90 lines
2.8 KiB
XML
90 lines
2.8 KiB
XML
<metal:block use-macro="main_template">
|
|
<div metal:fill-slot="content">
|
|
|
|
<br />
|
|
<div class="row">
|
|
<form method="POST" id="frm" class="form-horizontal">
|
|
<div class="form-group">
|
|
<label class="control-label col-sm-2">Societe</label>
|
|
<div class="col-sm-4">
|
|
<select class="form-control" id="societe" name="societe" onChange="$('#frm').submit()">
|
|
<tal:block tal:repeat="item societes">
|
|
<option value="${item}" tal:attributes="selected societe==item and 'selected' or None"> ${item}</option>
|
|
</tal:block>
|
|
</select>
|
|
</div>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
|
|
<div class="row">
|
|
<!-- Histogramme CA sur 12 mois par clients -->
|
|
<div id="chart_ca_12m" style="width: 100%; height: 500px;"></div>
|
|
</div>
|
|
|
|
<div class="row">
|
|
<!-- camembert 1 -->
|
|
<div class="col-sm-4">
|
|
<div id="chart_ca_3y_1" style="width: 100%; height: 500px;"></div>
|
|
</div>
|
|
<div class="col-sm-4">
|
|
<div id="chart_ca_3y_2" style="width: 100%; height: 500px;"></div>
|
|
</div>
|
|
<div class="col-sm-4">
|
|
<div id="chart_ca_3y_3" style="width: 100%; height: 500px;"></div>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
|
|
<script type="text/javascript">
|
|
google.charts.load("current", {packages:["corechart"]});
|
|
google.charts.setOnLoadCallback(drawChart);
|
|
var dataSet_ca_12m = ${chart_ca_12m};
|
|
|
|
var dataSet_ca_3y_1 = ${chart_ca_3y_1};
|
|
var dataSet_ca_3y_2 = ${chart_ca_3y_2};
|
|
var dataSet_ca_3y_3 = ${chart_ca_3y_3};
|
|
|
|
function drawChart() {
|
|
var data_ca_12m = google.visualization.arrayToDataTable(dataSet_ca_12m);
|
|
|
|
var data_ca_3y_1 = google.visualization.arrayToDataTable(dataSet_ca_3y_1);
|
|
var data_ca_3y_2 = google.visualization.arrayToDataTable(dataSet_ca_3y_2);
|
|
var data_ca_3y_3 = google.visualization.arrayToDataTable(dataSet_ca_3y_3);
|
|
|
|
var options_ca_12m = {
|
|
title: '${title}',
|
|
vAxis: {title: "Chiffre d'Affaires en €"},
|
|
isStacked: true
|
|
};
|
|
|
|
var options_ca_3y_1 = {
|
|
title: '${title1}',
|
|
};
|
|
|
|
var options_ca_3y_2 = {
|
|
title: '${title2}',
|
|
};
|
|
|
|
var options_ca_3y_3 = {
|
|
title: '${title3}',
|
|
};
|
|
|
|
var chart_ca_12m = new google.visualization.SteppedAreaChart(document.getElementById('chart_ca_12m'));
|
|
chart_ca_12m.draw(data_ca_12m, options_ca_12m);
|
|
|
|
var chart_ca_3y_1 = new google.visualization.PieChart(document.getElementById('chart_ca_3y_1'));
|
|
chart_ca_3y_1.draw(data_ca_3y_1, options_ca_3y_1);
|
|
var chart_ca_3y_2 = new google.visualization.PieChart(document.getElementById('chart_ca_3y_2'));
|
|
chart_ca_3y_2.draw(data_ca_3y_2, options_ca_3y_2);
|
|
var chart_ca_3y_3 = new google.visualization.PieChart(document.getElementById('chart_ca_3y_3'));
|
|
chart_ca_3y_3.draw(data_ca_3y_3, options_ca_3y_3);
|
|
}
|
|
</script>
|
|
|
|
</div><!-- content -->
|
|
</metal:block>
|
|
|
|
|