184 lines
4.8 KiB
HTML
184 lines
4.8 KiB
HTML
{% extends "bijoe/base.html" %}
|
|
{% load i18n staticfiles %}
|
|
|
|
{% block extrascripts %}
|
|
{{ form.media.css }}
|
|
<script src="{% static "xstatic/ChartNew.js" %}"></script>
|
|
<style>
|
|
form {
|
|
float: left;
|
|
width: 20%;
|
|
}
|
|
input[type=date] {
|
|
width: calc(100% / 2 - 8px);
|
|
}
|
|
select {
|
|
width: 100%;
|
|
}
|
|
table {
|
|
padding-left: 2em;
|
|
}
|
|
input[type=submit] {
|
|
float: right;
|
|
z-index: 1;
|
|
}
|
|
.filter { display: inline-block; }
|
|
</style>
|
|
{% endblock %}
|
|
|
|
{% block breadcrumb %}
|
|
|
|
{% url 'homepage' as homepage_url %}
|
|
<a href="{{ homepage_url }}">{% trans "Homepage" %}</a>
|
|
|
|
{% url 'warehouse' warehouse=warehouse.name as warehouse_url %}
|
|
<a href="{{ warehouse_url }}">{{ warehouse.label }}</a>
|
|
|
|
<a>{{ cube.label }}</a>
|
|
{% endblock %}
|
|
|
|
{% block content %}
|
|
<form method="post">
|
|
{% csrf_token %}
|
|
<input type="submit" value="ODS" name="ods"/>
|
|
<h2>Mesure(s)</h2>
|
|
{% with field=form.measures %}
|
|
<p {% if field.css_classes %}class="{{ field.css_classes }}"{% endif %}>
|
|
{{ field }}
|
|
{% if field.help_text %}
|
|
<span class="helptext">{{ field.help_text }}</span>
|
|
{% endif %}
|
|
</p>
|
|
{% endwith %}
|
|
<h2>Regroupement(s)</h2>
|
|
{% with field=form.drilldown %}
|
|
<p {% if field.css_classes %}class="{{ field.css_classes }}"{% endif %}>
|
|
{{ field }}
|
|
{% if field.help_text %}
|
|
<span class="helptext">{{ field.help_text }}</span>
|
|
{% endif %}
|
|
</p>
|
|
{% endwith %}
|
|
<h2>Filtre(s)</h2
|
|
{% for field in form %}
|
|
{% if not field.is_hidden and field.name != "measures" and field.name != "drilldown" %}
|
|
<p {% if field.css_classes %}class="{{ field.css_classes }}"{% endif %}>
|
|
{{ field.label_tag }}
|
|
{% if field.errors %}
|
|
<ul class="errorlist">
|
|
{% for error in field.errors %}
|
|
<li>{{ error }}</li>
|
|
{% endfor %}
|
|
</ul>
|
|
{% endif %}
|
|
{{ field }}
|
|
{% if field.help_text %}
|
|
<span class="helptext">{{ field.help_text }}</span>
|
|
{% endif %}
|
|
</p>
|
|
{% endif %}
|
|
{% endfor %}
|
|
</form>
|
|
{% if data %}
|
|
<table>
|
|
<thead>
|
|
{% for dimension in drilldown %}
|
|
<th>{{ dimension.label.capitalize }}</th>
|
|
{% endfor %}
|
|
{% for measure in measures %}
|
|
<th>{{ measure.label.capitalize }}</th>
|
|
{% endfor %}
|
|
</thead>
|
|
<tbody>
|
|
{% for row in data %}
|
|
<tr>
|
|
{% for cell in row %}
|
|
<td>{% if cell == None %}{% trans "None" %}{% else %}{{ cell }}{% endif %}</td>
|
|
{% endfor %}
|
|
</tr>
|
|
{% endfor %}
|
|
</tbody>
|
|
</table>
|
|
<canvas style="width: 100%"></canvas>
|
|
{% else %}
|
|
<div class="big-msg-info">Veuillez choisir des mesures et des regroupements</div>
|
|
{% endif %}
|
|
{% endblock %}
|
|
|
|
{% block page-end %}
|
|
{{ form.media.js }}
|
|
<script>
|
|
$(function () {
|
|
$('input[type="date"]').datepicker({
|
|
dateFormat: 'yy-mm-dd',
|
|
changeMonth: true,
|
|
changeYear: true,
|
|
},
|
|
$.datepicker.regional['fr']);
|
|
$('input, select').on('change', function () {
|
|
$('form').submit();
|
|
});
|
|
})
|
|
var data = {{ json|safe }};
|
|
linedata = {labels: [], datasets: []};
|
|
for (var i = 0; i < data.length; i++) {
|
|
var row = data[i];
|
|
var label = [];
|
|
var datasets = linedata.datasets;
|
|
for (var j = 0; j < row.coords.length; j++) {
|
|
label.push(row.coords[j].value)
|
|
}
|
|
label = label.join(' ');
|
|
linedata.labels.push(label)
|
|
for (var j = 0; j < row.measures.length; j++) {
|
|
if (datasets.length < j+1) {
|
|
datasets.push({data: []});
|
|
}
|
|
datasets[j].label = row.measures[j].label;
|
|
datasets[j].axis = j+1;
|
|
datasets[j].data.push(row.measures[j].value);
|
|
}
|
|
}
|
|
var ctx = $('canvas')[0].getContext("2d");
|
|
var option = {
|
|
//Boolean - Whether the scale should start at zero, or an order of magnitude down from the lowest value
|
|
scaleBeginAtZero : true,
|
|
|
|
//Boolean - Whether grid lines are shown across the chart
|
|
scaleShowGridLines : true,
|
|
|
|
//String - Colour of the grid lines
|
|
scaleGridLineColor : "rgba(0,0,0,.05)",
|
|
|
|
//Number - Width of the grid lines
|
|
scaleGridLineWidth : 1,
|
|
|
|
//Boolean - Whether to show horizontal lines (except X axis)
|
|
scaleShowHorizontalLines: true,
|
|
|
|
//Boolean - Whether to show vertical lines (except Y axis)
|
|
scaleShowVerticalLines: true,
|
|
|
|
//Boolean - If there is a stroke on each bar
|
|
barShowStroke : true,
|
|
|
|
//Number - Pixel width of the bar stroke
|
|
barStrokeWidth : 2,
|
|
|
|
//Number - Spacing between each of the X value sets
|
|
barValueSpacing : 5,
|
|
|
|
//Number - Spacing between data sets within X values
|
|
barDatasetSpacing : 1,
|
|
|
|
//String - A legend template
|
|
responsive: true,
|
|
responsiveMinHeight: 300,
|
|
legend: true,
|
|
yAxisMinimumInterval: 10,
|
|
inGraphDataShow: true,
|
|
}
|
|
new Chart(ctx).Bar(linedata, option);
|
|
</script>
|
|
{% endblock %}
|