You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
66 lines
3.1 KiB
66 lines
3.1 KiB
{% extends request.is_ajax|yesno:'nullcont.htm,abonapp/ext.htm' %}
|
|
{% load i18n %}
|
|
{% block content %}
|
|
|
|
<div class="row">
|
|
<div class="col-sm-12">
|
|
<div class="panel panel-default">
|
|
<div class="panel-heading">
|
|
<h3 class="panel-title">{% blocktrans with wantdate_d=wantdate|date:'j E Y' %}Graph of use by {{ wantdate_d }}{% endblocktrans %}</h3>
|
|
</div>
|
|
<div class="panel-body">
|
|
{% if charts_data %}
|
|
<div id="chrt"></div>
|
|
<script type="text/javascript">
|
|
$(document).ready(function ($) {
|
|
new Chartist.Line('#chrt', {
|
|
series: [
|
|
{
|
|
data: [
|
|
{{ charts_data }}
|
|
]
|
|
}
|
|
]
|
|
}, {
|
|
height: '600px',
|
|
showArea: true,
|
|
showLine: false,
|
|
showPoint: false,
|
|
high: {{ high }},
|
|
axisX: {
|
|
type: Chartist.FixedScaleAxis,
|
|
divisor: 12,
|
|
labelInterpolationFnc: function (value) {
|
|
return moment(value).format('HH:mm:ss');
|
|
}
|
|
},
|
|
lineSmooth: Chartist.Interpolation.cardinal({
|
|
tension: 0
|
|
})
|
|
});
|
|
});
|
|
</script>
|
|
{% else %}
|
|
<h2>{% trans 'Static info was Not found' %}</h2>
|
|
{% endif %}
|
|
<form action="{% url 'abonapp:charts' group.pk abon.username %}" method="get" class="input-group">
|
|
<span class="input-group-btn">
|
|
<button class="btn btn-default" type="submit">
|
|
<span class="glyphicon glyphicon-calendar"></span> {% trans 'Show graph by date' %}
|
|
</button>
|
|
</span>
|
|
<input type="text" class="form-control" placeholder="{% trans 'Choose a date' %}" id="date_choose" name="wantdate" value="{{ wantdate|date:'dmY' }}">
|
|
</form>
|
|
<script type="text/javascript">
|
|
$(document).ready(function ($) {
|
|
$('#date_choose').datetimepicker({
|
|
format: 'DDMMYYYY'
|
|
});
|
|
});
|
|
</script>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
{% endblock %}
|