<%@ 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="Station_powercut_query"/></title> <!-- 机房停电查询 -->
|
<link href="css/basic.css" rel="stylesheet">
|
<link rel="stylesheet" href="css/BrdwMaint.css">
|
<link rel="stylesheet" type="text/css" href="css/loading.css">
|
<link rel="stylesheet" href="css/nocontent.css">
|
<link href="src/css/layui.css" type="text/css" rel="stylesheet">
|
<style type="text/css">
|
body {
|
overflow-x: hidden !important;
|
}
|
#tbHead table{
|
width: 100%;
|
}
|
#tbBrdw {
|
overflow: auto;
|
}
|
#tbBrdw tbody tr:hover {
|
background-color: #DDDDDD;
|
}
|
#cardOption .con_table {
|
overflow: auto;
|
}
|
#tbBrdw table {
|
width: 100%;
|
}
|
#cardOption input[type="checkbox"] {
|
vertical-align: middle;
|
}
|
#cardOption table thead input[type="checkbox"]{
|
margin-left: 4px;
|
}
|
.filter {
|
position: fixed;
|
top: 50%;
|
right: 2px;
|
z-index: 999;
|
border: 1px solid #dbdbdb;
|
}
|
.filter a {
|
display: block;
|
padding: 0 10px;
|
height: 32px;
|
line-height: 32px;
|
text-decoration: none;
|
}
|
.filter a:hover {
|
background-color: #2f97ff;
|
color: #FFFFFF;
|
}
|
</style>
|
</head>
|
<body>
|
<!--头部内容开始-->
|
<jsp:include page="Top.jsp" flush="true"/>
|
<!--头部内容结束-->
|
<!--导航开始-->
|
<jsp:include page="nav.jsp" flush="true"/>
|
<!-- 主体内容 -->
|
<div id="main">
|
<div id="eleInfor">
|
<span class="summary"><s:text name="Station_powercut_query"/>--><s:text name="Show/hide_the_query_conditions"/></span>
|
<div class="checkCon">
|
<form action="" id="search_form">
|
<!-- 维护区信息 -->
|
<table>
|
<tr class="fWeight">
|
<td>省</td> <!-- 省 -->
|
<td>市</td> <!-- 市 -->
|
<td>区/县</td> <!-- 区/县 -->
|
<td><s:text name="Computer_name"/></td> <!-- 机房名称 -->
|
<td>机房停电类型</td>
|
<td colspan="2"><s:text name="Power_cut"/><s:text name="Time"/></td> <!-- 停电时间 -->
|
</tr>
|
<tr>
|
<td>
|
<select id="station_name1" name="stationname1"></select>
|
</td>
|
<td>
|
<select id="city" name="stationname2"></select>
|
</td>
|
<td>
|
<select id="county" name="stationname5"></select>
|
</td>
|
<td>
|
<select id="station_name" name="stationname"></select>
|
</td>
|
<td>
|
<select id="power_state" name="power_state">
|
<option value="100">全部</option>
|
<option value="0" selected="selected">实时停电监测</option>
|
<option value="1">历史停电数据</option>
|
</select>
|
</td>
|
<td style="width: 15%">
|
<input type="text" readonly="readonly" id="starttime" name="starttime" onclick="showCalendar(this)" value="2000-01-01">
|
</td>
|
<td style="width: 15%">
|
<input type="text" readonly="readonly" id="endtime" name="endtime" onclick="showCalendar(this)" value="">
|
</td>
|
</tr>
|
</table>
|
</form>
|
</div>
|
</div>
|
<!-- 表格固定的头部 -->
|
<div id="tbHead"></div>
|
<!-- 表格滚动的部分 -->
|
<div id="tbBrdw"></div>
|
<!-- 分页内容 -->
|
|
<form id="export_excel" action="ExportTable.servlet" method="post">
|
<input type="hidden" name="PageName" value="powercut.jsp"/>
|
<input type="hidden" id="table_th_arr" name="table_th_arr"/>
|
<input type="hidden" id="table_td_arr" name="table_td_arr"/>
|
</form>
|
|
<div id="paging">
|
<a href="javascript:" class="search"><s:text name="Search"/><!-- 查询 --></a>
|
<a href="javascript:" id="export_table"><s:text name="Export"/><!-- 导出 --></a>
|
<a href="javascript:" class="card-opt"><s:text name="Table_options"/><!-- 表格选项 --></a>
|
<s:text name="At_present"/><!-- 当前 --><span id="current">1/1</span>
|
<span><s:text name="Each_page"/><!-- 每页 --><input type="text" id="number" value="10"/><s:text name="Item"/><!-- 条 --></span>
|
<s:text name="Total_data"/><!-- 数据总量 --> <span id="total">10</span>
|
<a href="javascript:" id="home"><s:text name="HomePage"/><!-- 首页 --></a>
|
<a href="javascript:" id="pre"><s:text name="Page_Up"/><!-- 上一页 --></a>
|
<a href="javascript:" id="next_p"><s:text name="Page_Down"/><!-- 下一页 --></a>
|
<a href="javascript:" id="last"><s:text name="End_Page"/><!-- 尾页 --></a>
|
<span id="cont">
|
<s:text name="Goto"/><!-- 转到 --><input type="text" id="page_num" value="1"/>
|
<a href="javascript:" id="go"><s:text name="Jump"/><!-- 跳转 --></a>
|
</span>
|
</div>
|
</div>
|
<!-- 表格选项内容 -->
|
<div id="cardOption">
|
<span><s:text name="Options"/></span> <!-- 选项 -->
|
<div class="tbHead"></div>
|
<div class="con_table"></div>
|
<div class="input_container">
|
<input type="button" class="en-card-opts" value="<s:text name='Determine'/>"> <!-- 确定 -->
|
<input type="button" class="out-card-opts" value="<s:text name='Return'/>"> <!-- 返回 -->
|
</div>
|
</div>
|
<!-- 整体灰色遮罩层 -->
|
<div id="allShade"></div>
|
<script type="text/javascript" src="js/loading.js"></script>
|
<script type="text/javascript" src="js/nocontent.js"></script>
|
<script type="text/javascript" src="js/createTab.js"></script>
|
<script type="text/javascript" src="src/layui.all.js"></script>
|
<script type="text/javascript">
|
var Page={
|
pageCurr:1,
|
pageSize:10,
|
pageAll:1,
|
};
|
|
var arrTh = new Array(); // 表格的头部
|
var arrTd = new Array(); // 表格的表体
|
var tblStatus = new Array(); // 表格状态数组
|
var tblOptsHd = new Array(); // 表格选项头部
|
var tblOptsBd = new Array(); // 表格选项数组
|
//arrTh = ['维护区', '机房名称', '停电开始时间', '停电结束时间', '停电时长', '停电原因'];
|
arrTh = ['<s:text name="Maintenance_area"/>', '<s:text name="Computer_name"/>', '<s:text name="Power_cut"/><s:text name="Start_time"/>','停电状态','<s:text name="Power_cut"/><s:text name="End_time"/>', '<s:text name="Power_cut"/><s:text name="Time_long"/>'];
|
//tblOptsHd = ['编号', '选项', '是否选择'];
|
tblOptsHd = ['<s:text name="Number"/>', '<s:text name="Options"/>', '<s:text name="IsChecked"/>'];
|
var tblHd = $('#tbHead');
|
var tblBd = $('#tbBrdw');
|
|
// 根据表格的头部生成表格选项和表格的状态数组
|
$(function() {
|
centerDiv($('#cardOption'));
|
// 遍历表格头部生成状态数组
|
for(var i = 0; i < arrTh.length; i++) {
|
tblStatus.push(1);
|
var temp = new Array();
|
temp.push(i+1);
|
temp.push(arrTh[i]);
|
temp.push('<input type="checkbox" checked="checked"/>');
|
|
tblOptsBd.push(temp);
|
}
|
var cardHd = $('#cardOption .tbHead');
|
var cardBd = $('#cardOption .con_table');
|
createCard(cardHd, tblOptsHd, tblOptsBd);
|
createCard(cardBd, tblOptsHd, tblOptsBd);
|
});
|
|
// 点击条件筛选更改表格的高度
|
$(function() {
|
var checkCon = $('#eleInfor .checkCon').height(); // 获取条件筛选的高度
|
var isShow = true; // 标记筛选条件是否显示
|
$('#eleInfor .summary').click(function() {
|
var tblHt = $('#tbBrdw').height(); // 获取表格容器的高度
|
if(isShow) {
|
$('#eleInfor .checkCon').slideUp(function(){
|
$('#tbBrdw').height(tblHt + checkCon);
|
isShow = false;
|
});
|
}else {
|
$('#tbBrdw').height(tblHt - checkCon);
|
$('#eleInfor .checkCon').slideDown();
|
isShow = true;
|
}
|
});
|
});
|
|
// 生成表格
|
$(function() {
|
createAllTbl(tblHd, tblBd, arrTh, arrTd, tblStatus);
|
|
$('#paging .search').click(function() {
|
|
//noContent.showNoContent(); //显示查询失败框
|
searchStationPowerCutRecord();
|
|
});
|
|
// 点击表格选项显示表格选项弹出框
|
$('#paging .card-opt').click(function() {
|
var checkboxList = $('#cardOption .con_table table tbody').find('input[type="checkbox"]');
|
// 根据状态数组修改表格选项复选框的状态
|
for(var i = 0; i < tblStatus.length; i++) {
|
if(tblStatus[i] == 1) {
|
checkboxList.eq(i).prop('checked', true);
|
}else{
|
checkboxList.eq(i).prop('checked', false);
|
}
|
}
|
$('#cardOption').show();
|
$('#allShade').show();
|
});
|
|
// 点击取消和确定隐藏表格选项窗口和遮罩层
|
$('#cardOption .en-card-opts').click(function() {
|
// 根据表格选项的复选框设置状态数组
|
var checkboxList = $('#cardOption .con_table table tbody').find('input[type="checkbox"]');
|
checkboxList.each(function(i) {
|
if($(this).is(':checked')) {
|
tblStatus[i] = 1;
|
}else{
|
tblStatus[i] = 0;
|
}
|
});
|
createAllTbl(tblHd, tblBd, arrTh, arrTd, tblStatus);
|
$('#cardOption').hide();
|
$('#allShade').hide();
|
});
|
$('#cardOption .out-card-opts').click(function() {
|
$('#cardOption').hide();
|
$('#allShade').hide();
|
});
|
});
|
|
// 初始化页面高度
|
$(function() {
|
pageInit();
|
$(window).resize(function() {
|
pageInit();
|
});
|
|
$('#endtime').val(new Date().format("yyyy-MM-dd"));
|
});
|
|
// 初始化页面内容
|
function pageInit() {
|
var winHt = $(window).height();
|
var bodyHt = $('body').height();
|
var tblHt = $('#tbBrdw').height();
|
var shiftHt = winHt - bodyHt - 32;
|
if(shiftHt > 0) {
|
$('#tbBrdw').height(shiftHt + tblHt);
|
}
|
}
|
|
// 生成表格的头部和表体
|
function createAllTbl (header, body, arrTh, arrTd, status) {
|
//console.info(status);
|
var newArrTh = new Array();
|
var newArrTd = new Array();
|
newArrTh = getArrTh(status, arrTh);
|
newArrTd = getArrTd(status, arrTd);
|
createTablenew(header, newArrTh, newArrTd);
|
createTablenew(body, newArrTh, newArrTd);
|
// 定义表格的头部和表体宽度一致
|
var bdWidth = body.find('table').width();
|
header.find('table').width(bdWidth);
|
}
|
|
//对于弹出串口进行定位(position:fixed)
|
function centerDiv(ele){
|
//获取屏幕的高度对弹出窗口进行定位
|
var srnHei=$(window).height(); //屏幕的高度
|
var eleHei=ele.height(); //弹出窗口的高度
|
var topHei=parseInt((srnHei-eleHei)/2); //获取居中高度
|
ele.css({
|
'top':topHei
|
});
|
}
|
|
var formjson;
|
//查询机房停电记录
|
function searchStationPowerCutRecord(){
|
|
var jsontemp = $('#search_form').serialize();
|
if(formjson != jsontemp){
|
Page.pageCurr = 1;
|
formjson = jsontemp;
|
}
|
|
var load = layer.load(1);
|
var temp = createSearchParam();
|
//console.info(temp);
|
arrTd = new Array();
|
$.ajax({
|
type: "post",
|
url: "BattPower_offAction!serchByCondition",
|
async:true,
|
dataType:'text',
|
data:"json="+JSON.stringify(temp),
|
success: function(data){
|
data = eval("("+data+")");
|
var model = eval("("+data.result+")");
|
console.info(model);
|
if(model.code==1){
|
for(var i = 0 ;i<model.data.length;i++){
|
arrTd.push(model.data[i].StationName1); //维护区
|
arrTd.push(model.data[i].StationName); //机房名称
|
arrTd.push(model.data[i].poweroff_starttime); //停电开始时间
|
if(model.data[i].power_state == 0){
|
arrTd.push("停电中");
|
arrTd.push("--");
|
}else{
|
arrTd.push("停电恢复");
|
arrTd.push(model.data[i].poweroff_stoptime); //停电结束时间
|
}
|
arrTd.push(formatSeconds((new Date(model.data[i].poweroff_stoptime)-new Date(model.data[i].poweroff_starttime))/1000)); //停电时长
|
//arrTd.push(model.data[i].note); //停电原因
|
Page.pageAll = model.data[i].num;
|
}
|
}else{
|
noContent.showNoContent();
|
Page.pageAll = 0;
|
}
|
var pageNum = Math.ceil(Page.pageAll/Page.pageSize);
|
$('#page_num').val(Page.pageCurr);
|
$('#current').text(Page.pageCurr+"/"+pageNum);
|
$('#total').text(Page.pageAll);
|
|
createAllTbl(tblHd, tblBd, arrTh, arrTd, tblStatus);
|
layer.close(load);
|
},
|
|
error:function(){
|
loading.hideLoading();
|
noContent.showNoContent("查询失败,请检查网络连接！");
|
}
|
});
|
}
|
|
// 省-市-机房-电池组
|
var filterLoad;
|
$(document).ready(function(){
|
filterLoad = layer.load();
|
//页面加载时查询维护区中的枢纽类型
|
$.post("User_battgroup_baojigroup_battgroupAction!serchStationName1InGroup",null,function(data){
|
data=data.result;
|
data=eval("("+data+")");
|
//console.info(data);
|
if(data.code==1 && data.data.length>0){
|
var $select = $("#station_name1");
|
$select.text('');
|
for(var i=0;i<=data.data.length;i++){
|
$option=$("<option></option>");
|
if(i==0){
|
$option.html("<s:text name='All'/>(<s:text name='Common'/>"+data.data.length+"<s:text name='Species'/>)");
|
$option.attr("value", "");
|
}else{
|
$option.text(data.data[i-1]);
|
$option.attr("value",data.data[i-1]);
|
}
|
$select.append($option);
|
}
|
}else{
|
$("#station_name1").text('').html('<option>暂无管理的维护区</option>');
|
}
|
findCity();
|
});
|
});
|
|
// 根据维护区的内容查询市
|
function findCity(isLoad) {
|
var data = {
|
StationName1: $("#station_name1").val()
|
};
|
// 是否添加等待
|
if(isLoad) {
|
filterLoad = layer.load();
|
}
|
// 请求获取当前省下的市
|
$.ajax({
|
type: "post",
|
url: "BattInfAction!serchStationName2",
|
async:true,
|
dataType:'json',
|
data:"json = "+JSON.stringify(data),
|
success: function(data){
|
var rs = JSON.parse(data.result);
|
var $select = $("#city");
|
if(rs.code == 1) {
|
var _data= rs.data;
|
// 根据数据构造生成下拉列表的数据
|
var optsList = [];
|
for(var i=0;i<_data.length;i++){
|
var __data = _data[i];
|
var tmp = getOptionsData(__data.StationName2, __data.StationName2, __data);
|
optsList.push(tmp);
|
}
|
// 根据数据生成下拉列表
|
createOptions($select, optsList, true);
|
}else {
|
$select.text('').html('<option>暂无可测市</option>');
|
}
|
findCounty();
|
}
|
});
|
}
|
|
// 查询区/县
|
function findCounty(isLoad) {
|
var tmp = {
|
StationName1:$("#station_name1").val(),
|
StationName2:$("#city").val(),
|
};
|
// 是否添加等待
|
if(isLoad) {
|
filterLoad = layer.load();
|
}
|
// 查询区县
|
$.ajax({
|
type: 'post',
|
async: true,
|
url: "BattInfAction!serchStationName5",
|
data: "json="+JSON.stringify(tmp),
|
success:function(data) {
|
var rs = JSON.parse(data.result);
|
var $select = $("#county");
|
if(rs.code==1){
|
var _data = rs.data;
|
// 根据数据构造生成下拉列表的数据
|
var optsList = [];
|
for(var i=0;i<_data.length;i++){
|
var __data = _data[i];
|
var _attr = {
|
StationId: __data.StationId
|
};
|
var tmp = getOptionsData(__data.StationName5, __data.StationName5, __data, _attr);
|
optsList.push(tmp);
|
}
|
|
// 根据数据生成下拉列表
|
createOptions($select, optsList, true);
|
}else{
|
$select.text('').html('<option>暂无可测机房站点</option>');
|
}
|
findStationNamebyStationname1();
|
}
|
});
|
}
|
|
//当维护区的值变换时更新市
|
$('#station_name1').change(function(){
|
findCity(true);
|
});
|
|
//当维护区的值变换时更新机房站点
|
$('#city').change(function(){
|
findCounty(true);
|
});
|
|
//当区/县的值变换时更新机房站点
|
$('#county').change(function(){
|
findStationNamebyStationname1(true);
|
});
|
|
//根据省，市查询站点
|
function findStationNamebyStationname1(isLoad){
|
var tmp = {
|
StationName1:$("#station_name1").val(),
|
StationName2:$("#city").val(),
|
StationName5:$("#county").val()
|
};
|
// 是否添加等待
|
if(isLoad) {
|
filterLoad = layer.load();
|
}
|
//var selectvalue=$("#station_name1 option:selected").val();
|
//alert(selectvalue);
|
$.post("BattInfAction!serchStationName3","json="+JSON.stringify(tmp),function(data){
|
var rs = JSON.parse(data.result);
|
if(rs.code==1){
|
var _data = rs.data;
|
var $select = $("#station_name");
|
// 根据数据构造生成下拉列表的数据
|
var optsList = [];
|
for(var i=0;i<_data.length;i++){
|
var __data = _data[i];
|
var _attr = {
|
StationId: __data.StationId
|
};
|
var tmp = getOptionsData(__data.StationName3, __data.StationName3, __data, _attr);
|
optsList.push(tmp);
|
}
|
|
// 根据数据生成下拉列表
|
createOptions($select, optsList, true);
|
}else{
|
$("#station_name").text('').html('<option>暂无可测机房站点</option>');
|
}
|
|
layer.close(filterLoad);
|
});
|
}
|
|
|
//构造查询条件
|
function createSearchParam(){
|
var temp = {
|
binf:{
|
num:$('#power_state').val(),
|
StationName:$('#station_name').val(),
|
StationName1:$('#station_name1').val(),
|
StationName2:$('#city').val(),
|
StationName5:$('#county').val(),
|
BattProductDate:$('#starttime').val()+" 00:00:00",
|
BattProductDate1:$('#endtime').val()+" 23:59:59"
|
},
|
page:{
|
pageSize:Page.pageSize, //页面大小
|
pageCurr:Page.pageCurr, //当前页
|
}
|
};
|
return temp;
|
}
|
|
//首页
|
$('#home').click(function(){
|
if(Page!=undefined){
|
//var pageNum = Math.ceil(Page.pageAll/Page.pageSize);
|
if(Page.pageCurr != 1){
|
Page.pageCurr=1;
|
$('#paging .search').click();
|
}
|
}
|
});
|
|
//点击上一页
|
$("#pre").click(function(){
|
if(Page!=undefined){
|
if(Page.pageCurr > 1){
|
Page.pageCurr = Page.pageCurr-1;
|
$('#paging .search').click();
|
}
|
}
|
});
|
|
|
//点击下一页
|
$("#next_p").click(function(){
|
if(Page!=undefined){
|
var pageNum=Math.ceil(Page.pageAll/Page.pageSize);
|
if(Page.pageCurr < pageNum){
|
Page.pageCurr = Page.pageCurr+1;
|
|
//console.info(Page);
|
$('#paging .search').click();
|
}
|
}
|
});
|
|
//尾页
|
$('#last').click(function(){
|
if(Page !=undefined){
|
var pageNum=Math.ceil(Page.pageAll/Page.pageSize);
|
if(Page.pageCurr<pageNum){
|
Page.pageCurr = pageNum;
|
$('#paging .search').click();
|
}
|
}
|
});
|
|
|
//设置每页行数
|
$('#number').blur(function(){
|
var value=$('#number').attr("value");
|
//当输入的数大于0时
|
if(value>0){
|
value=parseInt(value);
|
if(Page.pageSize != value){
|
Page.pageCurr = 1;
|
Page.pageSize = value;
|
}
|
}else{
|
//当输入非法数字时
|
alert("<s:text name='Please_enter_the_legitimate_number!'/>"); /* 请输入合法的整数 */
|
$('#number').attr('value',Page.pageSize);
|
}
|
});
|
|
//填写完跳转到指定页
|
$('#page_num').blur(function(){
|
var tarpage=$('#page_num').attr('value');
|
if(tarpage>0){
|
|
}else{
|
alert("<s:text name='Please_enter_the_legitimate_number!'/>"); /* 请输入合法的数字 */
|
$('#page_num').attr('value',Page.pageCurr);
|
}
|
});
|
|
//点击跳转
|
$('#go').click(function(){
|
var tarpage=$('#page_num').attr('value');
|
tarpage=parseInt(tarpage);
|
if(Page!=undefined && Page.pageAll != 0){
|
var pageNum=Math.ceil(Page.pageAll/Page.pageSize);
|
if(tarpage > pageNum){
|
tarpage=pageNum;
|
$('#page_num').attr('value',pageNum);
|
}
|
Page.pageCurr= tarpage;
|
}else{
|
Page.pageCurr= tarpage;
|
}
|
$('#paging .search').click();
|
});
|
|
$('#export_table').click(function(){
|
//console.info($('#tbHead .tbFixed thead th').length);
|
exprotTable($('#tbHead table thead th'),$('#tbBrdw table tbody td'),$('#export_excel'),$('#table_th_arr'),$('#table_td_arr'));
|
});
|
|
function exprotTable(eleTh,eleTd,eleform,eleTh_Text,eleTd_Text){
|
//alert("导出");
|
var ArrTh=new Array();
|
for(var i=0;i<eleTh.length;i++)
|
{
|
ArrTh[i]=eleTh.eq(i).text();
|
}
|
var ArrTd="";
|
for(var i=0;i<eleTd.length;i++)
|
{
|
ArrTd+=eleTd.eq(i).text()+"&";
|
}
|
eleTh_Text.attr('value',ArrTh);
|
eleTd_Text.attr('value',ArrTd);
|
//console.info(ArrTh);
|
//console.info(ArrTd);
|
eleform.submit();
|
}
|
|
</script>
|
</body>
|
</html>
|
