2022-08-17 10:12:40 +02:00

109 lines
3.0 KiB
HTML

{% extends "squeleton.html" %}
{% block page_content %}
<div class="row">
<div class="col-md-12">
{% for y in years %}
<div class="col-md-6">
<ul class="pagination">
<li class="disabled"><a>{{ y }}</a></li>
{% for m in months %}
<li {% if m == month and y == year %}class="active"{% endif %}>
<a href="{% url 'history' obj y m %}">{{ m }}</a>
</li>
{% endfor %}
</ul>
</div>
{% endfor %}
</div>
</div>
<div class="row">
<div class="col-md-12">
<h1 class="page-header"><i class="fa fa-{{ fa_icon }} fa-fw"></i> {{ title }}</h1>
<div class="panel panel-default">
<div class="panel-heading">
{% if mean_pc_ok %}
<h4>{{ title1 }} - Mean : {{ mean_pc_ok|floatformat }}</h4>
{% else %}
<h4>{{ title1 }}</h4>
{% endif %}
</div>
<div class="panel-body history-panel">
{% if some_results %}
<div id="chart-pc"></div>
<div class="legend green">{{ legend1.0 }}</div>
<div class="legend orange">{{ legend1.1}}</div>
<div class="legend red">{{ legend1.2 }}</div>
<div class="legend blue">{{ legend1.3 }}</div>
{% else %}
<p>No results</p>
{% endif %}
</div>
</div>
{% if mean_js_data %}
<div class="panel panel-default">
<div class="panel-heading">
<h4>{{ title2 }}</h4>
</div>
<div class="panel-body history-panel">
<div id="chart-mean"></div>
<div class="legend blue">{{ legend2.0 }}</div>
<div class="legend purple">{{ legend2.1}}</div>
</div>
</div>
{% endif %}
</div>
</div>
{% endblock %}
{% block scripts %}
{% load static %}
<script src="{% static 'js/plugins/morris/raphael.min.js' %}"></script>
<script src="{% static 'js/plugins/morris/morris.min.js' %}"></script>
<script>
$(function() {
Morris.Area({
element: 'chart-pc',
data: [
{{ pc_js_data|safe }}
],
xkey: 'period',
ykeys: ['ok', 'warn', 'crit', 'unknown'],
labels: [ {{ js_labels|safe }}],
lineColors: ['#059e0c', '#f0a124', '#e32f2f', '#5d85e9'],
pointSize: 2,
hideHover: 'auto',
smooth: true,
ymax: 100,
ymin: 0,
xLabels: 'day',
resize: true
});
{% if mean_js_data %}
Morris.Line({
element: 'chart-mean',
data: [
{{ mean_js_data|safe }}
],
xkey: 'period',
ykeys: ['mean', 'median'],
labels: ['Mean', 'Median'],
lineColors: ['#628be3', '#e850ad'],
pointSize: 2,
hideHover: 'auto',
xLabels: 'day',
resize: true
});
{% endif %}
});
</script>
{% endblock %}