机房环境监测服务端
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

{% 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 %}