<div id="container" class="row">
    <div class="col-lg-12">
        <div class="panel">
            <form id="granularity" action="index.php" method="get" class="form-horizontal">
                <input type="hidden" name="controller" value="AdminMyVetShopCliniqueStatistiques">
                <input type="hidden" name="token" value="{getAdminToken tab='AdminMyVetShopCliniqueStatistiques'}">
                <div class="row row-margin-bottom">
                    <label for="clinique_id" class="control-label col-lg-3">
                        Clinique
                    </label>
                    <div class="col-lg-2">
                        <select name="clinique_id" id="clinique_id" onchange="this.form.submit();">
                            <option value="">Aucune clinique</option>
                            {foreach $cliniques as $cli}
                                <option value="{$cli->id_myvetshop_clinique}"{if $clinique and $clinique->id_myvetshop_clinique == $cli->id_myvetshop_clinique} selected{/if} >{$cli->code_privilege}</option>
                            {/foreach}
                        </select>
                    </div>
                </div>
            </form>
        </div>
    </div>
</div>

<div id="container" class="row">
    <div class="col-lg-12 panel">
        <div class="panel-heading">
            CA TTC
        </div>
        <div class="row">
            <div class="col-sm-6">
                <table>
                    <tbody>
                    <tr>
                        <th>CA Réel</th>
                        <td>{$indicateurs.ca_total.ca_reel_ttc|round:2} €</td>
                    </tr>
                    <tr>
                        <th>Réductions accordées</th>
                        <td>{$indicateurs.ca_total.reduction_ttc|round:2} €</td>
                    </tr>
                    <tr>
                        <th>CA hors réductions</th>
                        <td>{$indicateurs.ca_total.produits_ttc|round:2} €</td>
                    </tr>
                    </tbody>
                </table>
            </div>
            <div class="col-sm-6">
                <div id="repartition_ca_petfooders" style="height: 250px; width: 400px;"></div>
                <script type="text/javascript">
                    var data = {$indicateurs.repartition_ca_petfooders|@json_encode nofilter};

                    function labelFormatter(label, series) {
                        return "<div style='font-size:8pt; text-align:center; padding:2px; color:white;'>" + label + "<br/>" + Math.round(series.data[0][1]) + " € (" + Math.round(series.percent) + " %)</div>";
                    }

                    $.plot('#repartition_ca_petfooders', data, {
                        series: {
                            pie: {
                                show: true,
                                radius: 1,
                                label: {
                                    show: true,
                                    radius: 1,
                                    formatter: labelFormatter,
                                    background: {
                                        opacity: 0.8
                                    }
                                },
                                combine: {
                                    color: '#999',
                                    threshold: 0.1,
                                    label: 'AUTRE'
                                }
                            }
                        },
                        grid: {
                            hoverable: true
                        },
                        legend: {
                            show: false
                        }
                    });
                </script>
            </div>
        </div>
    </div>
</div>
