| New file |
| | |
|---|
| | | <%@ 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%>">
|
|---|
| | | |
|---|
| | | <title>流量统计</title> <!--流量统计-->
|
|---|
| | | <meta charset="UTF-8">
|
|---|
| | | <meta name="viewport" content="width=device-width, initial-scale=1">
|
|---|
| | | <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" type="text/css" href="css/dischargeplan_layout.css">
|
|---|
| | | <link rel="stylesheet" type="text/css" href="src/css/layui.css">
|
|---|
| | | <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">
|
|---|
| | | <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%;
|
|---|
| | | }
|
|---|
| | | #tbBrdw table i.fa-refresh {
|
|---|
| | | font-size:18px;
|
|---|
| | | cursor: pointer;
|
|---|
| | | }
|
|---|
| | | #cardOption input[type="checkbox"] {
|
|---|
| | | vertical-align: middle;
|
|---|
| | | }
|
|---|
| | | #cardOption table thead input[type="checkbox"]{
|
|---|
| | | margin-left: 4px;
|
|---|
| | | }
|
|---|
| | | </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">流量统计</span>
|
|---|
| | | <div class="checkCon">
|
|---|
| | | <!-- 维护区信息 -->
|
|---|
| | | <form action="" id="search_form">
|
|---|
| | | <table>
|
|---|
| | | <tr class="fWeight">
|
|---|
| | | <td>省</td> <!-- 省 -->
|
|---|
| | | <td>市</td> <!-- 市 -->
|
|---|
| | | <td><s:text name="Computer_name"/></td> <!-- 机房名称 -->
|
|---|
| | | <td>统计方式</td>
|
|---|
| | | <td colspan="2" style="width: 30%;">时间段</td>
|
|---|
| | | </tr>
|
|---|
| | | <tr>
|
|---|
| | | <td>
|
|---|
| | | <select id="station_name1">
|
|---|
| | | |
|---|
| | | </select>
|
|---|
| | | </td>
|
|---|
| | | <td>
|
|---|
| | | <select id="city">
|
|---|
| | | |
|---|
| | | </select>
|
|---|
| | | </td>
|
|---|
| | | <td>
|
|---|
| | | <select id="station_name">
|
|---|
| | | </select>
|
|---|
| | | </td>
|
|---|
| | | <td>
|
|---|
| | | <select>
|
|---|
| | | <option>按年统计</option>
|
|---|
| | | <option>按月统计</option>
|
|---|
| | | <option>按日统计</option>
|
|---|
| | | </select>
|
|---|
| | | </td>
|
|---|
| | | <td><input type="text" id="startalm" readonly="readonly" name="bmd.adata.alm_start_time" value="2000-1-1" /></td>
|
|---|
| | | <td><input type="text" id="endTalm" readonly="readonly" name="bmd.adata.alm_start_time1" /></td>
|
|---|
| | | </tr>
|
|---|
| | | </table>
|
|---|
| | | </form>
|
|---|
| | | </div>
|
|---|
| | | </div>
|
|---|
| | | <!-- 表格固定的头部 -->
|
|---|
| | | <div id="tbHead"></div>
|
|---|
| | | <!-- 表格滚动的部分 -->
|
|---|
| | | <div id="tbBrdw"></div>
|
|---|
| | | |
|---|
| | | |
|---|
| | | |
|---|
| | | <!-- 按钮内容 -->
|
|---|
| | | <div id="paging">
|
|---|
| | | <span>总计</span>
|
|---|
| | | <span>5000</span>
|
|---|
| | | </div>
|
|---|
| | | </div>
|
|---|
| | | |
|---|
| | | <!-- 整体灰色遮罩层 -->
|
|---|
| | | <div id="allShade"></div>
|
|---|
| | | <script type="text/javascript" src="js/loading.js"></script>
|
|---|
| | | <script type="text/javascript" src="js/createTab.js"></script>
|
|---|
| | | <script type="text/javascript" src="src/layui.js"></script>
|
|---|
| | | |
|---|
| | | <script type="text/javascript" src="js/eleHistWarn1-jquery.ui.js"></script>
|
|---|
| | | <script type="text/javascript">
|
|---|
| | | layui.use(['layer'], function() {
|
|---|
| | | var layer = layui.layer;
|
|---|
| | | 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="Nominal_capacity"/>(AH)', '<s:text name="Actual_capacity"/>(AH)','<s:text name="Residual_capacity"/>(AH)', '<s:text name="real_time"/><s:text name="Current"/>(A)', '<s:text name="Power_cut"/><s:text name="Endurance"/><s:text name="Time"/>'];
|
|---|
| | | //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() {
|
|---|
| | | for(i=0;i<5000;i++){arrTd.push(i)}
|
|---|
| | | createAllTbl(tblHd, tblBd, arrTh, arrTd, tblStatus);
|
|---|
| | | // 点击表格选项显示表格选项弹出框
|
|---|
| | | $('#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() {
|
|---|
| | | $('#endtime').val(new Date().format('yyyy-MM-dd'));
|
|---|
| | | });
|
|---|
| | | |
|---|
| | | // 初始化页面高度
|
|---|
| | | $(function() {
|
|---|
| | | pageInit();
|
|---|
| | | $(window).resize(function() {
|
|---|
| | | pageInit();
|
|---|
| | | });
|
|---|
| | | });
|
|---|
| | | |
|---|
| | | // 初始化页面内容
|
|---|
| | | 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
|
|---|
| | | });
|
|---|
| | | }
|
|---|
| | | |
|---|
| | | |
|---|
| | | |
|---|
| | | |
|---|
| | | |
|---|
| | | |
|---|
| | | |
|---|
| | | // 省-市-机房-电池组
|
|---|
| | | $(document).ready(function(){
|
|---|
| | | //页面加载时查询维护区中的枢纽类型
|
|---|
| | | $.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() {
|
|---|
| | | var data = {
|
|---|
| | | StationName1: $("#station_name1").val()
|
|---|
| | | };
|
|---|
| | | // 请求获取当前省下的市
|
|---|
| | | $.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>');
|
|---|
| | | }
|
|---|
| | | findStationNamebyStationname1();
|
|---|
| | | }
|
|---|
| | | });
|
|---|
| | | }
|
|---|
| | | //当维护区的值变换时更新市
|
|---|
| | | $('#station_name1').change(function(){
|
|---|
| | | findCity();
|
|---|
| | | });
|
|---|
| | | //当维护区的值变换时更新机房站点
|
|---|
| | | $('#city').change(function(){
|
|---|
| | | findStationNamebyStationname1();
|
|---|
| | | });
|
|---|
| | | |
|---|
| | | //根据省，市查询站点
|
|---|
| | | function findStationNamebyStationname1(){
|
|---|
| | | findStationNamebyStationname1.stations = new Array();
|
|---|
| | | var tmp = {
|
|---|
| | | StationName1:$("#station_name1").val(),
|
|---|
| | | StationName2:$("#city").val()
|
|---|
| | | };
|
|---|
| | | //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];
|
|---|
| | | //console.info(__data);
|
|---|
| | | var _attr = {
|
|---|
| | | StationId: __data.FBSDeviceId,
|
|---|
| | | };
|
|---|
| | | var tmp = getOptionsData(__data.StationName3, __data.StationName, __data, _attr);
|
|---|
| | | optsList.push(tmp);
|
|---|
| | | }
|
|---|
| | | findStationNamebyStationname1.stations = _data;
|
|---|
| | | // 根据数据生成下拉列表
|
|---|
| | | createOptions($select, optsList, true);
|
|---|
| | | }else{
|
|---|
| | | $("#station_name").text('').html('<option>暂无可测机房站点</option>');
|
|---|
| | | }
|
|---|
| | | });
|
|---|
| | | }
|
|---|
| | | });
|
|---|
| | | |
|---|
| | | |
|---|
| | | |
|---|
| | | |
|---|
| | | //获取选中的机房对象
|
|---|
| | | function getSelectStation(dev_id,arr){
|
|---|
| | | if(arr != undefined && arr.length > 0){
|
|---|
| | | for(var i=0;i<arr.length;i++){
|
|---|
| | | if(arr[i].FBSDeviceId == dev_id){
|
|---|
| | | return arr[i];
|
|---|
| | | }
|
|---|
| | | }
|
|---|
| | | }
|
|---|
| | | return undefined;
|
|---|
| | | }
|
|---|
| | | |
|---|
| | | |
|---|
| | | |
|---|
| | |
|
|---|
| | | |
|---|
| | | </script>
|
|---|
| | | </body>
|
|---|
| | | </html> |
|---|
