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.
107 lines
5.4 KiB
107 lines
5.4 KiB
4 years ago
|
{% extends "admin/base_site.html" %}
|
||
|
|
{% load static %}
|
||
|
|
{% block extrahead %}
|
||
|
|
<link rel="stylesheet" type="text/css" href="{% static 'css/bootstrap.css' %}">
|
||
|
|
<link rel="stylesheet" type="text/css" href="{% static 'css/bootstrap-datetimepicker.css' %}">
|
||
|
|
<script src="{% static 'js/jquery-2.1.1.min.js' %}"></script>
|
||
|
|
<script src="{% static 'js/bootstrap.js' %}"></script>
|
||
|
|
<script src="{% static 'js/bootstrap-datetimepicker.js' %}"></script>
|
||
|
|
<script src="{% static 'js/echarts.min.js' %}"></script>
|
||
|
|
{% endblock %}
|
||
|
|
{% block content %}
|
||
|
|
<style>
|
||
|
|
.lst{
|
||
|
|
padding-left: 0;
|
||
|
|
list-style: none;
|
||
|
|
}
|
||
|
|
</style>
|
||
|
|
<div>
|
||
|
|
<label><h2>统计图表</h2></label>
|
||
|
|
</br>
|
||
|
|
<form action="." method="POST" id="chartform" onsubmit="return check_form()">
|
||
|
|
{% csrf_token %}
|
||
|
|
<table class="table" table-layout="fixed" width="90%">
|
||
|
|
<tbody>
|
||
|
|
<tr>
|
||
|
|
<td width="320px">
|
||
|
|
<span class="dropdown" id="topic">
|
||
|
|
<button type="button" class="btn dropdown-toggle" data-toggle="dropdown" id="topicbtn">
|
||
|
|
{% if topicname %}
|
||
|
|
{{ topicname }}
|
||
|
|
{% else %}
|
||
|
|
主题选择
|
||
|
|
{% endif %}
|
||
|
|
</button>
|
||
|
|
<ul class="dropdown-menu">
|
||
|
|
<li class="lst"><a href="#" onclick="change_topic(this)">采集统计</a></li>
|
||
|
|
<li class="lst"><a href="#" onclick="change_topic(this)">报警统计</a></li>
|
||
|
|
<li class="lst"><a href="#" onclick="change_topic(this)">综合统计</a></li>
|
||
|
|
</ul>
|
||
|
|
</span>
|
||
|
|
<input type="hidden" name="topicval" id="topicval" value="{{ topicname }}">
|
||
|
|
<span style="padding-left:10px"></span>
|
||
|
|
<span class="dropdown hidden" id="tp">
|
||
|
|
<button type="button" class="btn dropdown-toggle" data-toggle="dropdown" id="tpbtn">
|
||
|
|
{% if tpname %}
|
||
|
|
{{ tpname }}
|
||
|
|
{% else %}
|
||
|
|
采集数据
|
||
|
|
{% endif %}
|
||
|
|
</button>
|
||
|
|
<ul class="dropdown-menu">
|
||
|
|
<li class="lst"><a href="#" onclick="change_tp(this)">温度数据</a></li>
|
||
|
|
<li class="lst"><a href="#" onclick="change_tp(this)">湿度数据</a></li>
|
||
|
|
<li class="lst"><a href="#" onclick="change_tp(this)">火情数据</a></li>
|
||
|
|
<li class="lst"><a href="#" onclick="change_tp(this)">漏水数据</a></li>
|
||
|
|
<li class="lst"><a href="#" onclick="change_tp(this)">断电数据</a></li>
|
||
|
|
</ul>
|
||
|
|
</span>
|
||
|
|
<input type="hidden" name="tpval" id="tpval" value="{{ tpname }}">
|
||
|
|
<span class="dropdown hidden" id="spot">
|
||
|
|
<button type="button" class="btn dropdown-toggle" data-toggle="dropdown" id="spotbtn">
|
||
|
|
{% if spot %}
|
||
|
|
{{ spot }}
|
||
|
|
{% else %}
|
||
|
|
选择地点
|
||
|
|
{% endif %}
|
||
|
|
</button>
|
||
|
|
<ul class="dropdown-menu">
|
||
|
|
{% for spt in spots %}
|
||
|
|
<li class="lst"><a href="#" onclick="change_spot(this)">{{ spt }}</a></li>
|
||
|
|
{% endfor %}
|
||
|
|
</ul>
|
||
|
|
</span>
|
||
|
|
<input type="hidden" name="spotval" id="spotval" value="{{ spot }}">
|
||
|
|
</td>
|
||
|
|
<td width="180px">
|
||
|
|
<input type="text" class="form-control" name="startdate" placeholder="起始时间" id="startdate" value="{{ startdate }}" readonly>
|
||
|
|
</td>
|
||
|
|
<td width="180px">
|
||
|
|
<input type="text" class="form-control" name="enddate" placeholder="结束时间" id="enddate" value="{{ enddate }}" readonly>
|
||
|
|
</td>
|
||
|
|
<td>
|
||
|
|
<input type="submit" value="确定" class="btn-primary">
|
||
|
|
</td>
|
||
|
|
</tr>
|
||
|
|
</tbody>
|
||
|
|
</table>
|
||
|
|
</form>
|
||
|
|
</div>
|
||
|
|
<script src="{% static 'js/chartpage.js' %}"></script>
|
||
|
|
<div id="mainchart" style="width: 800px;height:600px;"></div>
|
||
|
|
<script src="{% static 'js/alarmchart.js' %}"></script>
|
||
|
|
<script src="{% static 'js/envchart.js' %}"></script>
|
||
|
|
<script src="{% static 'js/comprechart.js' %}"></script>
|
||
|
|
<script type="text/javascript">
|
||
|
|
{% ifequal topicname '报警统计' %}
|
||
|
|
alarmchart('{{ startdate }}','{{ enddate }}',{{ statics_data|safe }});
|
||
|
|
{% endifequal %}
|
||
|
|
{% ifequal topicname '采集统计' %}
|
||
|
|
tpdict = {'温度数据':'temperature', '湿度数据':'humidity', '火情数据':'fire', '漏水数据':'water', '断电数据':'electricity'};
|
||
|
|
envchart('{{ tpname }}',tpdict['{{ tpname }}'],{{ statics_data|safe }});
|
||
|
|
{% endifequal %}
|
||
|
|
{% ifequal topicname '综合统计' %}
|
||
|
|
comprechart({{ spots|safe }},{{ statics_data|safe }});
|
||
|
|
{% endifequal %}
|
||
|
|
</script>
|
||
|
|
{% endblock %}
|