<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
|
<%
|
String path = request.getContextPath();
|
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
|
%>
|
<%@ taglib uri="/struts-tags" prefix="s" %>
|
<!DOCTYPE HTML>
|
<html>
|
<head>
|
<base href="<%=basePath%>">
|
<meta charset="UTF-8">
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
<meta http-equiv="pragma" content="no-cache">
|
<meta http-equiv="cache-control" content="no-cache">
|
<meta http-equiv="expires" content="0">
|
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
|
<meta http-equiv="description" content="This is my page">
|
<title><s:text name="Dev_temperature_statistics"></s:text></title> <!-- 设备温度统计 -->
|
<link rel="stylesheet" type="text/css" href="pages/css/base.css">
|
<link rel="stylesheet" type="text/css" href="jqueryui/jquery-ui.css">
|
<link rel="stylesheet" type="text/css" href="src/css/layui.css">
|
<link rel="stylesheet" type="text/css" href="pages/css/mylayui.css">
|
<style>
|
.dataTypeCont {
|
width: 160px;
|
text-align: center;
|
}
|
.dataTypeCont .layui-form-switch {
|
min-width: 70px;
|
margin-top: 4px;
|
}
|
</style>
|
</head>
|
<body>
|
<!--头部内容开始-->
|
<jsp:include page="Top.jsp" flush="true"/>
|
<!--头部内容结束-->
|
<!--导航开始-->
|
<jsp:include page="nav.jsp" flush="true"/>
|
<!-- 主体内容 -->
|
<div class="layui-page-container">
|
<!-- 条件筛选 -->
|
<div class="layui-page-filter">
|
<div class="page-filter-header layui-page-filter-fweight">设备温度统计</div>
|
<div class="page-filter-content">
|
<table>
|
<tr class="layui-page-filter-tbl-header layui-page-filter-fweight">
|
<td>省</td> <!-- 省 -->
|
<td>市</td> <!-- 市 -->
|
<td>区/县</td> <!-- 市 -->
|
<!-- <td><s:text name="Computer_name"/></td> --> <!-- 机房名称 -->
|
<td colspan='2'>日期范围</td>
|
</tr>
|
<tr>
|
<td>
|
<div class="layui-form" lay-filter="provinceFilter">
|
<div class="layui-form-item">
|
<div class="layui-input-block">
|
<select name="province" id="province" lay-filter="province">
|
<option value="">请选择省</option>
|
</select>
|
</div>
|
</div>
|
</div>
|
</td>
|
<td>
|
<div class="layui-form" lay-filter="cityFilter">
|
<div class="layui-form-item">
|
<div class="layui-input-block">
|
<select name="city" id="city" lay-filter="city">
|
<option value="">请选择市/区</option>
|
</select>
|
</div>
|
</div>
|
</div>
|
</td>
|
<td>
|
<div class="layui-form" lay-filter="countyFilter">
|
<div class="layui-form-item">
|
<div class="layui-input-block">
|
<select name="county" id="county" lay-filter="county" lay-search="">
|
<option value="">请选择区/县</option>
|
</select>
|
</div>
|
</div>
|
</div>
|
</td>
|
<td>
|
<div class="layui-form" lay-filter="startTimeFilter">
|
<div class="layui-form-item">
|
<div class="layui-input-block">
|
<input type="text" class="layui-input" placeholder="yyyy-MM-dd HH:mm:ss" id="startTime">
|
</div>
|
</div>
|
</div>
|
</td>
|
<td>
|
<div class="layui-form" lay-filter="endTimeFilter">
|
<div class="layui-form-item">
|
<div class="layui-input-block">
|
<input type="text" class="layui-input" placeholder="yyyy-MM-dd HH:mm:ss" id="endTime">
|
</div>
|
</div>
|
</div>
|
</td>
|
</tr>
|
</table>
|
</div>
|
</div>
|
<div class="layui-page-content">
|
<!-- 表格内容 -->
|
<table id="pageTbl" lay-filter="pageTbl"></table>
|
</div>
|
<div class="data-footer">
|
<!-- 分页内容 -->
|
<div id="paging">
|
<a href="javascript:" class="search"><s:text name="Search"/></a> <!-- 查询 -->
|
<a href="javascript:" id="export_table"><s:text name="Export"/></a> <!-- 导出 -->
|
</div>
|
</div>
|
<div style="height: 1px; background-color: #5cadff"></div>
|
</div>
|
<div id="lineGraphData"></div>
|
<form action="ExportTable.servlet" method="post" id="all_picture" enctype="multipart/form-data">
|
<input type="hidden" name="PageName" value="autoPageName" />
|
<input type="hidden" name="exp_picture_str" id="tmpLineGraph" />
|
<input type="hidden" name="excelTitle" id="tblTitle" value="设备温度">
|
<input type="hidden" name="table_th_arr" id="tblTh">
|
<input type="hidden" name="table_td_arr" id="tblTd">
|
</form>
|
<script type="text/html" id="details">
|
<a class="layui-btn layui-btn-normal layui-btn-xs" lay-event="details">详情</a>
|
</script>
|
<script type="text/javascript" src="js/jquery-1.8.3.js"></script>
|
<script type="text/javascript" src="js/echarts.js"></script>
|
<script type="text/javascript" src="jqueryui/jquery-ui.min.js"></script>
|
<script type="text/javascript" src="src/layui.js"></script>
|
<script type="text/javascript" src="pages/js/mylayui.js"></script>
|
<script type="text/javascript">
|
var permits;
|
<% Object obj=session.getAttribute("permits");
|
if(obj!=null){
|
String permits =obj.toString(); %>
|
permits=<%=permits%>;
|
//console.info(json);
|
<% } %>
|
layui.use(['form', 'table', 'layer', 'laydate','element'], function() {
|
var table = layui.table; // 获取表格模块
|
var form = layui.form; // 获取表单模块
|
var layer = layui.layer; // 获取弹出框模块
|
var laydate = layui.laydate; // 获取日期模块
|
var element = layui.element; // 获取元素操作模块
|
var date = new Date();
|
var nowDate = date.format('yyyy-MM-dd hh:mm:ss');
|
|
//console.log(nowDate);
|
// 时间段选择
|
var startTime = laydate.render({
|
elem: '#startTime'
|
,type: 'datetime'
|
,value: '2012-01-01 00:00:00'
|
,btns: ['now', 'confirm']
|
});
|
|
var endTime = laydate.render({
|
elem: '#endTime'
|
,type: 'datetime'
|
,value: nowDate
|
,btns: ['now', 'confirm']
|
});
|
|
// 点击查询
|
$('#paging .search').click(function() {
|
searchTmpData();
|
});
|
|
// 导出报表
|
$('#export_table').click(function() {
|
exportData();
|
});
|
|
|
var isNewLoad = true;
|
var pre_province = getQueryString('province');
|
// 查询省下拉框
|
searchProvince();
|
// 查询省
|
var filterLoad = layer.load();
|
function searchProvince() {
|
// 请求后台查询
|
$.ajax({
|
type:'post',
|
async:true,
|
url: 'User_battgroup_baojigroup_battgroupAction!serchStationName1InGroup',
|
data: null,
|
dataType: 'json',
|
success:function(result) {
|
var rs = JSON.parse(result.result);
|
var list = []; // option结果集
|
var ele = $('#province'); // 目标select
|
if(rs.code == 1) {
|
var data = rs.data;
|
var allTxt = "<s:text name='All'/>(<s:text name='Common'/>"+data.length+"<s:text name='Species'/>)";
|
list.push(getLayuiSelect(allTxt, '', {}, undefined));
|
// 遍历查询结果
|
for(var i=0; i<data.length; i++) {
|
var _data = data[i];
|
var _tmp = getLayuiSelect(_data, _data, {}, {});
|
if(pre_province == _data && isNewLoad){
|
_tmp = getLayuiSelect(_data, _data, {}, {},true);
|
}
|
list.push(_tmp);
|
}
|
}else {
|
list.push(getLayuiSelect('暂无省/直辖市', '', {}, undefined));
|
}
|
|
// 根据对象数组生成下拉列表
|
createLayuiSelect(ele, list);
|
form.render('select', 'provinceFilter');
|
|
// 查询市
|
searchCity();
|
}
|
});
|
}
|
|
// 切换省-市
|
form.on('select(province)', function(data) {
|
// 查询市
|
searchCity(true);
|
});
|
|
// 查询市
|
function searchCity(isLoad) {
|
// 构造查询条件
|
var tmp = {
|
StationName1: $("#province").val()
|
};
|
var pre_city = getQueryString('city');
|
|
// 是否添加等待
|
if(isLoad) {
|
filterLoad = layer.load();
|
}
|
// 根据构造条件查询内容
|
$.ajax({
|
type: 'post',
|
async: true,
|
url: 'BattInfAction!serchStationName2',
|
dataType: 'json',
|
data: "json = "+JSON.stringify(tmp),
|
success: function(result) {
|
var rs = JSON.parse(result.result);
|
var list = []; // option结果集
|
var ele = $('#city'); // 目标select
|
if(rs.code == 1) {
|
var data = rs.data;
|
var allTxt = "<s:text name='All'/>(<s:text name='Common'/>"+data.length+"<s:text name='Species'/>)";
|
list.push(getLayuiSelect(allTxt, '', {}, undefined));
|
// 遍历查询结果
|
for(var i=0; i<data.length; i++) {
|
var _data = data[i];
|
var _tmp = getLayuiSelect(_data.StationName2, _data.StationName2, {}, _data);
|
if(pre_city == _data.StationName2 && isNewLoad){
|
_tmp = getLayuiSelect(_data.StationName2, _data.StationName2, {}, _data,true);
|
}
|
list.push(_tmp);
|
}
|
}else {
|
list.push(getLayuiSelect('暂无市/区', '', {}, undefined));
|
}
|
|
// 根据对象数组生成下拉列表
|
createLayuiSelect(ele, list);
|
form.render('select', 'cityFilter');
|
|
// 查询区县
|
searchCounty();
|
}
|
});
|
}
|
|
// 切换市-区县
|
form.on('select(city)', function(data) {
|
// 查询区县
|
searchCounty(true);
|
});
|
|
|
// 查询区/县
|
var countyClear = new ClearSelectVal($('#county'));
|
function searchCounty(isLoad) {
|
var list = []; // option结果集
|
var ele = $('#county'); // 目标select
|
// 判断必要条件是否存在
|
var parentStatus = checkLayuiParent($("#city"));
|
if(!parentStatus) {
|
layer.close(filterLoad); // 关闭等待框
|
list.push(getLayuiSelect('请先选择市', '', {}, undefined));
|
// 根据对象数组生成下拉列表
|
createLayuiSelect(ele, list);
|
form.render('select', 'countyFilter');
|
// 向容器容添加删除按钮
|
countyClear.init();
|
layer.close(filterLoad);
|
return;
|
}
|
|
// 构造查询条件
|
var tmp = {
|
StationName1: $("#province").val(),
|
StationName2: $("#city").val()
|
};
|
// 是否添加等待
|
if(isLoad) {
|
filterLoad = layer.load();
|
}
|
var pre_county = getQueryString('county');
|
// 根据构造条件查询内容
|
$.ajax({
|
type: 'post',
|
async: true,
|
url: 'BattInfAction!serchStationName5',
|
dataType: 'json',
|
data: "json = "+JSON.stringify(tmp),
|
success: function(result) {
|
var rs = JSON.parse(result.result);
|
|
if(rs.code == 1) {
|
var data = rs.data;
|
var allTxt = "<s:text name='All'/>(<s:text name='Common'/>"+data.length+"<s:text name='Species'/>)";
|
list.push(getLayuiSelect(allTxt, '', {}, undefined));
|
// 遍历查询结果
|
for(var i=0; i<data.length; i++) {
|
var _data = data[i];
|
var _tmp = getLayuiSelect(_data.StationName5, _data.StationName5, {}, _data);
|
if(pre_county == _data.StationName5 && isNewLoad){
|
_tmp = getLayuiSelect(_data.StationName5, _data.StationName5, {}, _data,true);
|
}
|
//console.info(_tmp);
|
list.push(_tmp);
|
}
|
}else {
|
list.push(getLayuiSelect('暂无区/县', '', {}, undefined));
|
}
|
|
// 根据对象数组生成下拉列表
|
createLayuiSelect(ele, list);
|
form.render('select', 'countyFilter');
|
countyClear.init();
|
layer.close(filterLoad);
|
}
|
});
|
}
|
|
// 表格模块
|
var tOptions = {
|
elem: '#pageTbl'
|
,toolbar: false
|
,cellMinWidth: 80
|
,cols: [[
|
{field:'stationname1', title: '省', align: 'center', width: 180}
|
,{field: 'stationname2', title: '市', align: 'center', width: 180}
|
,{field: 'stationname5', title: '区县', align: 'center', width: 220}
|
,{field:'stationname3', title:'机房名称', align:'center'}
|
,{field:'dev_tmp', title:'设备最高温度', align:'center'}
|
,{field:'detail', title:'详情', align:'center', width: 160, toolbar: '#details'}
|
]]
|
,data:[]
|
,limit: 10000
|
,page: false
|
,height: 'full-290'
|
};
|
|
// 生成表格数据
|
table.render(tOptions);
|
|
// 点击表格中的工具按钮
|
table.on('tool(pageTbl)', function(obj){
|
//console.log(obj);
|
switch(obj.event) {
|
case 'details':
|
details(obj);
|
break;
|
};
|
});
|
|
// 显示详情
|
function details(obj) {
|
var data = obj.data;
|
var random = Math.random();
|
$('#lineGraphData').data('data', data);
|
layer.open({
|
type: 2
|
,title: data.stationname+'('+data.startTime+'-'+data.endTime+')'+'-折线图'
|
,area:['1200px', '520px']
|
,resize: false
|
,content: 'iframe/tmpLine.html?random='+random
|
});
|
}
|
// 查询温度统计
|
function searchTmpData() {
|
var searchParams = createSearchParams();
|
tOptions.data = [];
|
//console.log(searchParams);
|
// 判断查询条件不符合规定，返回
|
if(searchParams.code == 0) {
|
layer.msg(searchParams.msg);
|
return;
|
}
|
var params = searchParams.data;
|
//console.log(params);
|
var loading = layer.load(1);
|
$.ajax({
|
type: 'post',
|
async: true,
|
url: 'Devtmp_recordAction!serchByInfo',
|
data: 'json='+JSON.stringify(params),
|
dataType: 'json',
|
success: function(res) {
|
var rs = JSON.parse(res.result);
|
if(rs.code == 1) {
|
var data = rs.data;
|
for(var i=0; i<data.length; i++) {
|
var _data = data[i];
|
_data.startTime = params.BattProductDate;
|
_data.endTime = params.BattProductDate1;
|
}
|
tOptions.data = data;
|
}
|
table.render(tOptions);
|
},
|
complete: function() {
|
layer.close(loading);
|
}
|
});
|
}
|
// 构造查询函数
|
function createSearchParams() {
|
var result = {
|
code:1,
|
data: {},
|
msg: '获取成功'
|
};
|
var num = 1;
|
var StationName = "";
|
var startTime = $('#startTime').val();
|
var endTime = $('#endTime').val();
|
|
// 判断num的值
|
var province = $('#province').val();
|
var city = $('#city').val();
|
var county = $('#county').val();
|
if(county) {
|
num = 3;
|
StationName = county;
|
}else if(city) {
|
num = 2;
|
StationName = city;
|
}else if(province) {
|
StationName = province;
|
}
|
// 校验结束时间是否大于开始时间
|
var start = new Date(startTime).getTime();
|
var end = new Date(endTime).getTime();
|
if(start >= end) {
|
result.code = 0;
|
result.msg = '开始时间不能大于结束时间'
|
return result;
|
}
|
var data = {
|
num: num,
|
StationName: StationName,
|
BattProductDate: startTime,
|
BattProductDate1: endTime
|
};
|
result.data = data;
|
return result;
|
}
|
|
// 导出报表
|
function exportData() {
|
var cols = tOptions.cols[0];
|
var data = tOptions.data;
|
var ths = [];
|
// 遍历头部
|
for(var i=0; i<cols.length-1; i++) {
|
var col = cols[i];
|
ths.push(col.title);
|
}
|
// 遍历数据
|
var tds = [];
|
for(var i=0; i<data.length; i++) {
|
var _data = data[i];
|
tds.push(_data.stationname1);
|
tds.push(_data.stationname2);
|
tds.push(_data.stationname5);
|
tds.push(_data.stationname3);
|
tds.push(_data.dev_tmp);
|
}
|
var tblThStr = ths.join(',');
|
var tblTdStr = tds.join('&');
|
$('#tblTh').val(tblThStr);
|
$('#tblTd').val(tblTdStr);
|
// console.log(lineGraph);
|
$('#all_picture').submit();
|
}
|
});
|
</script>
|
</body>
|
</html>
|
