1016 lines
43 KiB
Plaintext
1016 lines
43 KiB
Plaintext
<%@ page language="java" pageEncoding="UTF-8"%>
|
||
<%@ taglib uri="http://java.sun.com/jstl/core_rt" prefix="c"%>
|
||
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn"%>
|
||
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt"%>
|
||
<%@ page import="com.sipai.entity.base.ServerObject"%>
|
||
<%@ taglib uri="http://www.springsecurity.org/jsp" prefix="security"%>
|
||
|
||
|
||
<!DOCTYPE html>
|
||
<!-- <html lang="zh-CN"> -->
|
||
<!-- BEGIN HEAD -->
|
||
|
||
<head>
|
||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
|
||
<meta http-equiv = "X-UA-Compatible" content = "IE=edge,chrome=1" />
|
||
<!-- <meta http-equiv="X-UA-Compatible" content="IE=edge"/> -->
|
||
<title>
|
||
<%= ServerObject.atttable.get("TOPTITLE")%>
|
||
</title>
|
||
<!-- 引用页头及CSS页-->
|
||
<jsp:include page="/jsp/inc.jsp"></jsp:include>
|
||
|
||
<!-- 引入daterangepicker-->
|
||
<link rel="stylesheet" href="<%=request.getContextPath()%>/plugins/bootstrap-daterangepicker/daterangepicker.css"/>
|
||
<script type="text/javascript" src="<%=request.getContextPath()%>/plugins/bootstrap-daterangepicker/moment.min.js"
|
||
charset="utf-8"></script>
|
||
<script type="text/javascript" src="<%=request.getContextPath()%>/plugins/bootstrap-daterangepicker/daterangepicker.js"
|
||
charset="utf-8"></script>
|
||
<style type="text/css">
|
||
.font-size-12{
|
||
font-size: 12px;
|
||
}
|
||
.font-size-14{
|
||
font-size: 14px;
|
||
}
|
||
.font-size-15{
|
||
font-size: 15px;
|
||
}
|
||
.font-size-16{
|
||
font-size: 16px;
|
||
}
|
||
.font-size-17{
|
||
font-size: 17px;
|
||
}
|
||
.font-size-18{
|
||
font-size: 18px;
|
||
}
|
||
.font-size-20{
|
||
font-size: 20px;
|
||
}
|
||
.font-size-22{
|
||
font-size: 22px;
|
||
}
|
||
.font-size-26{
|
||
font-size: 26px;
|
||
}
|
||
.font-size-28{
|
||
font-size: 28px;
|
||
}
|
||
.font-size-34{
|
||
font-size: 34px;
|
||
}
|
||
.font-size-44{
|
||
font-size: 44px;
|
||
}
|
||
.font-color-red{
|
||
color: #FF0000;
|
||
}
|
||
.font-color-lightblue{
|
||
color: #00A8FF;
|
||
}
|
||
.font-color-blue{
|
||
color: #00D3FF;
|
||
}
|
||
.font-color-lightgreen{
|
||
color: #00C254;
|
||
}
|
||
.font-color-green{
|
||
color: #228100;
|
||
}
|
||
.font-color-yellow{
|
||
color: #FFCC00;
|
||
}
|
||
.font-color-purple{
|
||
color: #975FE4;
|
||
}
|
||
.font-color-black{
|
||
color: #000;
|
||
}
|
||
.font-color-white{
|
||
color: #ffffff;
|
||
}
|
||
.font-color-orange{
|
||
color: #FFAA00;
|
||
}
|
||
|
||
.font-color-grey{
|
||
color: #919191;
|
||
}
|
||
.padding-top-8{
|
||
padding-top: 8px;
|
||
}
|
||
.padding-left-40{
|
||
padding-left:40px;
|
||
}
|
||
.padding-right-40{
|
||
padding-right:40px;
|
||
}
|
||
.margin-bottom-10{
|
||
margin-bottom: 10px;
|
||
}
|
||
.margin-bottom-15{
|
||
margin-bottom: 15px;
|
||
}
|
||
.margin-bottom-20{
|
||
margin-bottom: 20px;
|
||
}
|
||
.margin-bottom-30{
|
||
margin-bottom: 30px;
|
||
}
|
||
.line-height-4{
|
||
line-height: 4;
|
||
}
|
||
.main-position{
|
||
position: absolute;
|
||
}
|
||
.main-title{
|
||
top: 0px;
|
||
left: 0px;
|
||
width: 100%;
|
||
padding: 10px 5px;
|
||
}
|
||
.title-element{
|
||
float: left;
|
||
margin-right: 15px;
|
||
text-align: center;
|
||
cursor: pointer;
|
||
}
|
||
.title-element > img{
|
||
margin-bottom: 10px;
|
||
}
|
||
.main-content{
|
||
width: 380px;
|
||
}
|
||
.main-content-left{
|
||
height: 1008px;
|
||
background: linear-gradient(90deg,rgba(1,37,51,0.60), rgba(0,37,51,0.40) 64%, rgba(8,42,55,0.10));
|
||
top: 72px;
|
||
left: 0px;
|
||
}
|
||
.main-content-right{
|
||
height: 1080px;
|
||
background: linear-gradient(270deg,rgba(0,40,55,0.60), rgba(0,37,51,0.40) 64%, rgba(8,42,55,0.10));
|
||
top: 0px;
|
||
right: 0px;
|
||
}
|
||
.greenConstruction-box{
|
||
width: 100%;
|
||
}
|
||
.greenConstruction-box-title{
|
||
width: 100%;
|
||
height: 50px;
|
||
background-image: url(<%=request.getContextPath()%>/IMG/environment/title.png);
|
||
background-repeat:no-repeat;
|
||
background-position: left center;
|
||
background-size: 100%;
|
||
}
|
||
.greenConstruction-box-title > h4{
|
||
padding: 0 35px;
|
||
}
|
||
.greenConstruction-box-title-tool{
|
||
|
||
}
|
||
.greenConstruction-box-content{
|
||
padding: 10px;
|
||
}
|
||
.greenConstruction-box-content p{
|
||
text-indent: 2em;
|
||
text-align: left;
|
||
padding: 0 15px;
|
||
}
|
||
.weather{
|
||
height: 75px;
|
||
width: 100%;
|
||
padding: 15px 5px;
|
||
}
|
||
.weather .col-md-3,
|
||
.weather .col-md-6{
|
||
padding: 0 5px;
|
||
}
|
||
.environment-floor{
|
||
background: rgba(10,93,120,0.47);
|
||
border: 1px solid #00e5ff;
|
||
margin: 5px;
|
||
cursor: pointer;
|
||
text-align: center;
|
||
color: #00edff;
|
||
float: left;
|
||
}
|
||
.environment-floor:hover{
|
||
border: 1px solid #00e5ff;
|
||
}
|
||
|
||
.environment-floor div{
|
||
height: 50%;
|
||
padding: 5px;
|
||
}
|
||
.environment-floor.active{
|
||
background: rgba(0,192,255,0.47);
|
||
border: 1px solid #00e5ff;
|
||
}
|
||
.environment-floor.error{
|
||
background: rgba(120,10,10,0.47);
|
||
border: 1px solid #ff0000;
|
||
color: #ffffff;
|
||
}
|
||
.floor-list{
|
||
width: 40px;
|
||
height: 360px;
|
||
bottom: 105px;
|
||
right: 450px;
|
||
}
|
||
.mainSeason-list{
|
||
width: 110px;
|
||
height: 200px;
|
||
bottom: 105px;
|
||
right: 450px;
|
||
}
|
||
.floor-list,.mainSeason-list{
|
||
background: rgba(0,0,0,0.50);
|
||
border: 1px solid #a7a7a7;
|
||
border-radius: 5px;
|
||
cursor: pointer;
|
||
}
|
||
.floor-list-border:hover,.mainSeason-list-border:hover{
|
||
border: 1px solid #00e5ff;
|
||
}
|
||
.floor-list-border.active,.mainSeason-list-border.active{
|
||
background: rgba(0,192,255,0.47);
|
||
border: 1px solid #00e5ff;
|
||
}
|
||
.floor-list-border,.mainSeason-list-border{
|
||
border-bottom: 1px solid #a7a7a7;
|
||
height: 40px;
|
||
}
|
||
|
||
.nav-tabs-custom.tab-BIM {
|
||
background: transparent;
|
||
}
|
||
.nav-tabs-custom.tab-BIM > .nav-tabs {
|
||
border-bottom: 1px solid #00d3ff;
|
||
}
|
||
.nav-tabs-custom.tab-BIM > .nav-tabs > li {
|
||
border-top: 3px solid transparent;
|
||
margin-bottom: -2px;
|
||
margin-right: 5px;
|
||
}
|
||
.nav-tabs-custom.tab-BIM > .nav-tabs > li.active {
|
||
background: #00d3ff;
|
||
border: 1px solid #00d3ff;
|
||
border-radius: 6px 6px 0px 0px;
|
||
}
|
||
.nav-tabs-custom.tab-BIM > .nav-tabs > li.active > a {
|
||
border: transparent;
|
||
background-color: transparent;
|
||
font-weight: bold;
|
||
}
|
||
.nav-tabs-custom.tab-BIM > .nav-tabs > li.active > a,
|
||
.nav-tabs-custom.tab-BIM > .nav-tabs > li.active:hover > a {
|
||
color: #000000;
|
||
}
|
||
.nav-tabs-custom.tab-BIM>.nav-tabs>li>a {
|
||
color: #baf1ff;
|
||
}
|
||
.tab-BIM>.nav>li>a {
|
||
padding: 10px;
|
||
font-size: 16px;
|
||
}
|
||
.techParameters-open{
|
||
cursor: pointer;
|
||
color: #00cbff;
|
||
}
|
||
.techParameters-close{
|
||
background: rgba(10,93,120,0.47);
|
||
border: 1px solid #00e5ff;
|
||
}
|
||
.equipmentCard .form-group{
|
||
margin-bottom: 1px;
|
||
background: rgba(57,57,57,0.50);
|
||
margin-right: 0;
|
||
margin-left: 0;
|
||
}
|
||
.equipmentCard .col-sm-8{
|
||
padding-top: 7px;
|
||
}
|
||
.equipmentCard .col-sm-4,.equipmentCard .col-sm-8{
|
||
padding-right: 10px;
|
||
padding-left: 10px;
|
||
}
|
||
.equipmentCard .table-striped>tbody>tr:nth-of-type(odd) {
|
||
background-color: transparent;
|
||
}
|
||
.energyEfficiencyManagement{
|
||
height: 960px;
|
||
}
|
||
.buildingOverview{
|
||
height: 350px;
|
||
}
|
||
.environmentalMonitoring{
|
||
height: 540px;
|
||
}
|
||
.deviceManagement{
|
||
height: 560px;
|
||
}
|
||
.serviceCentre{
|
||
height: 330px;
|
||
}
|
||
.box {
|
||
margin-bottom: 10px;
|
||
}
|
||
.equipmentOperationEvaluation,.radar{
|
||
height: 250px;
|
||
}
|
||
.pie ,.bar{
|
||
height: 220px;
|
||
}
|
||
.levelBar{
|
||
height: 340px;
|
||
width: 400px;
|
||
}
|
||
.line{
|
||
height: 360px;
|
||
width: 800px;
|
||
}
|
||
.col-md-20{
|
||
width: 20%;
|
||
float: left;
|
||
position: relative;
|
||
min-height: 1px;
|
||
padding-right: 10px;
|
||
padding-left: 10px;
|
||
}
|
||
.evaluate-green{
|
||
padding: 5px;
|
||
background: #21cb21;
|
||
border-radius: 4px;
|
||
}
|
||
.col-md-3,.col-md-4,.col-md-5,.col-md-8,.energyEfficiencyManagement .col-md-2{
|
||
padding-right: 8px;
|
||
padding-left: 8px;
|
||
}
|
||
.demonstration .row{
|
||
margin-right: 0px;
|
||
margin-left: 0px;
|
||
}
|
||
h3,h4{
|
||
margin-top: 10px;
|
||
margin-bottom: 10px;
|
||
}
|
||
.box-body {
|
||
padding: 10px 15px;
|
||
}
|
||
.nav-tabs-custom {
|
||
margin-bottom: 10px;
|
||
}
|
||
.nav-tabs-custom>.nav-tabs>li>a {
|
||
font-weight: bold;
|
||
}
|
||
.nav-tabs-custom>.nav-tabs>li.active {
|
||
border-bottom: 3px solid #0080FF;
|
||
border-top: 0;
|
||
}
|
||
.nav-tabs-custom>.nav-tabs>li.active>a {
|
||
border-right: 0;
|
||
border-left: 0;
|
||
}
|
||
.nav-tabs-custom>.nav-tabs>li.active>a,
|
||
.nav-tabs-custom>.nav-tabs>li.active:hover>a {
|
||
color: #0080FF;
|
||
}
|
||
.icon {
|
||
width: 40px;
|
||
height: 40px;
|
||
vertical-align: -0.15em;
|
||
fill: currentColor;
|
||
overflow: hidden;
|
||
margin-top: 5px;
|
||
}
|
||
.dateSelect{
|
||
position: absolute;
|
||
left: 25px;
|
||
z-index: 11;
|
||
width: 320px;
|
||
}
|
||
</style>
|
||
|
||
<script type="text/javascript">
|
||
var height = 1080;
|
||
var heightV =1;
|
||
var width = 1920;
|
||
var widthV =1;
|
||
var beginTimeStore_yangtzeRiver = '';
|
||
var endTimeStore_yangtzeRiver = '';
|
||
var beginTimeStore_reservoir = '';
|
||
var endTimeStore_reservoir = '';
|
||
let websocket = null;
|
||
let modelIp = "${modelIp}";
|
||
var bizid = '';
|
||
$(function () {
|
||
bizid = unitId;
|
||
height = $(window).height();
|
||
width = $(window).width();
|
||
if(width<(global_width*0.1)){
|
||
width = global_width-150;
|
||
}
|
||
if(height<(global_height*0.1)){
|
||
height = global_height-50;
|
||
}
|
||
heightV = height/860;
|
||
widthV = width/1690;
|
||
$('.line').height($('.line').height()*heightV);
|
||
$('.runLine').width($('.line').width()*widthV);
|
||
var seriesdata = [
|
||
{
|
||
name: '实测值',
|
||
type: 'line',
|
||
smooth: true,
|
||
symbol:'none',
|
||
data: [['2022-11-01',12], ['2022-11-02',10],['2022-11-03', 10], ['2022-11-04',11],
|
||
['2022-11-05',12], ['2022-11-06',14], ['2022-11-07',10]]
|
||
},
|
||
{
|
||
name: '预测值',
|
||
type: 'line',
|
||
smooth: true,
|
||
symbol:'none',
|
||
data: [['2022-11-01',8], ['2022-11-02',7],['2022-11-03', 6], ['2022-11-04',4],
|
||
['2022-11-05',8], ['2022-11-06',7], ['2022-11-07',6]]
|
||
},
|
||
{
|
||
name: '警戒值',
|
||
type: 'line',
|
||
smooth: true,
|
||
symbol:'none',
|
||
data: [['2022-11-01',16], ['2022-11-02',16],['2022-11-03', 16], ['2022-11-04',16],
|
||
['2022-11-05',16], ['2022-11-06',16], ['2022-11-07',16]]
|
||
},
|
||
]
|
||
echartsLine('reservoir_line',seriesdata,['green','blue','red']);
|
||
echartsLine('yangtzeRiver_line',seriesdata,['green','blue','red']);
|
||
var locale = {
|
||
"format": 'YYYY-MM-DD HH:mm',
|
||
"separator": " ~ ",
|
||
"applyLabel": "确定",
|
||
"cancelLabel": "取消",
|
||
"fromLabel": "起始时间",
|
||
"toLabel": "结束时间'",
|
||
"customRangeLabel": "自定义",
|
||
"weekLabel": "W",
|
||
"daysOfWeek": ["日", "一", "二", "三", "四", "五", "六"],
|
||
"monthNames": ["一月", "二月", "三月", "四月", "五月", "六月", "七月", "八月", "九月", "十月", "十一月", "十二月"],
|
||
"firstDay": 1
|
||
};
|
||
//定义locale汉化插件
|
||
beginTimeStore_yangtzeRiver = moment().subtract(15, 'days').format('YYYY-MM-DD') + " 00:00";
|
||
endTimeStore_yangtzeRiver = moment().subtract(-15, 'days').format('YYYY-MM-DD') + " 23:59";
|
||
beginTimeStore_reservoir = moment().subtract(15, 'days').format('YYYY-MM-DD') + " 00:00";
|
||
endTimeStore_reservoir = moment().subtract(-15, 'days').format('YYYY-MM-DD') + " 23:59";
|
||
$('#reservoirTime').val(beginTimeStore_reservoir + locale.separator + endTimeStore_reservoir);
|
||
$('#yangtzeRiverTime').val(beginTimeStore_yangtzeRiver + locale.separator + endTimeStore_yangtzeRiver);
|
||
$('#reservoirTime').daterangepicker({
|
||
"timePicker": true,
|
||
"timePicker24Hour": true,
|
||
"linkedCalendars": false,
|
||
"autoUpdateInput": false,
|
||
"timePickerIncrement": 10,
|
||
"locale": locale,
|
||
//汉化按钮部分
|
||
ranges: {
|
||
'今日': [moment(), moment().subtract(-1, 'days')],
|
||
'昨日': [moment().subtract(1, 'days'), moment()],
|
||
'最近7日': [moment().subtract(6, 'days'), moment().subtract(-1, 'days')],
|
||
'本月': [moment().startOf('month'), moment().endOf('month').subtract(-1, 'days')],
|
||
'上月': [moment().subtract(1, 'month').startOf('month'), moment().subtract(1, 'month').endOf('month').subtract(-1, 'days')]
|
||
},
|
||
startDate: beginTimeStore_reservoir,
|
||
endDate: endTimeStore_reservoir
|
||
}, function (start, end, label) {
|
||
beginTimeStore_reservoir = start.format(this.locale.format);
|
||
endTimeStore_reservoir = end.format(this.locale.format);
|
||
if (!this.startDate) {
|
||
this.element.val('');
|
||
} else {
|
||
this.element.val(this.startDate.format(this.locale.format) + this.locale.separator + this.endDate.format(this.locale.format));
|
||
}
|
||
});
|
||
$('#yangtzeRiverTime').daterangepicker({
|
||
"timePicker": true,
|
||
"timePicker24Hour": true,
|
||
"linkedCalendars": false,
|
||
"autoUpdateInput": false,
|
||
"timePickerIncrement": 10,
|
||
"locale": locale,
|
||
//汉化按钮部分
|
||
ranges: {
|
||
'今日': [moment(), moment().subtract(-1, 'days')],
|
||
'昨日': [moment().subtract(1, 'days'), moment()],
|
||
'最近7日': [moment().subtract(6, 'days'), moment().subtract(-1, 'days')],
|
||
'本月': [moment().startOf('month'), moment().endOf('month').subtract(-1, 'days')],
|
||
'上月': [moment().subtract(1, 'month').startOf('month'), moment().subtract(1, 'month').endOf('month').subtract(-1, 'days')]
|
||
},
|
||
startDate: beginTimeStore_yangtzeRiver,
|
||
endDate: endTimeStore_yangtzeRiver
|
||
}, function (start, end, label) {
|
||
beginTimeStore_yangtzeRiver = start.format(this.locale.format);
|
||
endTimeStore_yangtzeRiver = end.format(this.locale.format);
|
||
if (!this.startDate) {
|
||
this.element.val('');
|
||
} else {
|
||
this.element.val(this.startDate.format(this.locale.format) + this.locale.separator + this.endDate.format(this.locale.format));
|
||
}
|
||
});
|
||
if ('WebSocket' in window) {
|
||
// 创建websocket对象
|
||
websocket = new WebSocket("ws://" + modelIp + "/modelComputerWebSocketEnd/");
|
||
registerEvent(bizid);
|
||
} else {
|
||
alert('当前浏览器不支持websocket')
|
||
}
|
||
$(window).unload(function () {
|
||
console.log("websocket关闭");
|
||
websocket.close();
|
||
});
|
||
|
||
getData(bizid, "",1);
|
||
getData(bizid, "",2);
|
||
});
|
||
function echartsLine(id,data,color) {
|
||
var lifeChart = echarts.getInstanceByDom(document.getElementById(id));
|
||
//有的话就获取已有echarts实例的DOM节点。
|
||
if (lifeChart != null) { // 如果存在,就进行销毁。
|
||
lifeChart.dispose();
|
||
}
|
||
var option = {
|
||
color: color,
|
||
tooltip: {
|
||
trigger: 'axis'
|
||
},
|
||
legend: {
|
||
x: 'right',
|
||
icon: 'circle'
|
||
},
|
||
grid: {
|
||
left: '3%',
|
||
right: '4%',
|
||
bottom: '3%',
|
||
top: 70,
|
||
containLabel: true
|
||
},
|
||
xAxis: {
|
||
type: 'time',
|
||
boundaryGap: false,
|
||
axisLabel: {
|
||
formatter: '{MM}/{dd}'
|
||
},
|
||
axisLine: {
|
||
show: true
|
||
},
|
||
},
|
||
yAxis: {
|
||
type: 'value',
|
||
},
|
||
series: data
|
||
};
|
||
lifeChart = echarts.init(document.getElementById(id));
|
||
lifeChart.setOption(option,true);
|
||
}
|
||
function registerEvent(bizid) {
|
||
websocket.onopen = function (event) {
|
||
console.log("已连接");
|
||
}
|
||
|
||
websocket.onmessage = function (event) {
|
||
if (event != null) {
|
||
// console.log(event.data)
|
||
let modelType = event.data;
|
||
if (modelType != 'model_status') {
|
||
getData(bizid,modelType,1);
|
||
getData(bizid,modelType,2);
|
||
}
|
||
}
|
||
};
|
||
websocket.onclose = function (event) {
|
||
console.log("已断开");
|
||
reconnect();
|
||
};
|
||
//连接发生错误的回调方法
|
||
websocket.onerror = function () {
|
||
reconnect();
|
||
};
|
||
}
|
||
|
||
function reconnect() {
|
||
websocket = new WebSocket("ws://" + modelIp + "/modelComputerWebSocketEnd/");
|
||
websocket.onopen = function (event) {
|
||
console.log("已连接");
|
||
}
|
||
|
||
websocket.onmessage = function (event) {
|
||
};
|
||
|
||
websocket.onclose = function (event) {
|
||
setTimeout("reconnect();", 8000);
|
||
};
|
||
//连接发生错误的回调方法 `1
|
||
websocket.onerror = function () {
|
||
websocket.close();
|
||
};
|
||
}
|
||
function getData(unitId, modelType,jspnum) {
|
||
var jsp_id = $('#jsp_id'+jspnum).val();
|
||
var starttime = "";
|
||
var endtime = "";
|
||
if(jspnum==1){
|
||
starttime = beginTimeStore_reservoir;
|
||
endtime = endTimeStore_reservoir;
|
||
}
|
||
if(jspnum==2){
|
||
starttime = beginTimeStore_yangtzeRiver;
|
||
endtime = endTimeStore_yangtzeRiver;
|
||
}
|
||
var time_input = $('#time_input').val();
|
||
$.ajax({
|
||
type: 'GET',
|
||
url: ext.contextPath + "/digitalProcess/digitalTechnologist/getBGJspData.do",
|
||
dataType: 'json',
|
||
data: {
|
||
unitId: unitId, sdt: starttime, edt: endtime, jspId: jsp_id, modelType: modelType
|
||
},
|
||
async: true,
|
||
error: function () {
|
||
return false;
|
||
},
|
||
success: function (data) {
|
||
var arr = data;
|
||
console.log(arr);
|
||
var yangtzeRiver_CI_concentration_dataseries = [];
|
||
var yangtzeRiver_CI_concentration_forecast_dataseries = [];
|
||
var yangtzeRiver_CI_concentration_alert_dataseries = [];
|
||
var reservoir_CI_concentration_dataseries = [];
|
||
var reservoir_CI_concentration_forecast_dataseries = [];
|
||
var reservoir_CI_concentration_alert_dataseries = [];
|
||
|
||
if (arr != null && arr != undefined && arr != '' && arr.length > 0) {
|
||
for (var i = 0; i < arr.length; i++) {
|
||
var value = 0;
|
||
var numtail = 0;
|
||
var dataMax = 0;
|
||
var rate = 1;
|
||
var nowdate = getNowTime();
|
||
if (arr[i].visualCacheConfig != null
|
||
&& arr[i].visualCacheConfig != undefined
|
||
&& arr[i].visualCacheConfig != '') {
|
||
var visualCacheConfig = arr[i].visualCacheConfig;
|
||
if (visualCacheConfig.numtail != null && visualCacheConfig.numtail != undefined && visualCacheConfig.numtail != '') {
|
||
numtail = visualCacheConfig.numtail;
|
||
}
|
||
}
|
||
if (arr[i].visualCacheData != null
|
||
&& arr[i].visualCacheData != undefined
|
||
&& arr[i].visualCacheData != '') {
|
||
var visualCacheData = arr[i].visualCacheData;
|
||
if (visualCacheData.inivalue != null && visualCacheData.inivalue != undefined && visualCacheData.inivalue != '') {
|
||
value = visualCacheData.inivalue;
|
||
} else {
|
||
if (visualCacheData.value != null && visualCacheData.value != undefined && visualCacheData.value != '') {
|
||
value = visualCacheData.value;
|
||
} else {
|
||
if (arr[i].mPoint != null && arr[i].mPoint != undefined && arr[i].mPoint != '') {
|
||
var mPoint = arr[i].mPoint;
|
||
if (mPoint.parmvalue != null && mPoint.parmvalue != undefined && mPoint.parmvalue != '') {
|
||
value = mPoint.parmvalue;
|
||
}
|
||
if (mPoint.alarmmax != null && mPoint.alarmmax != undefined && mPoint.alarmmax != '') {
|
||
dataMax = mPoint.alarmmax;
|
||
}
|
||
if (mPoint.numtail != null && mPoint.numtail != undefined && mPoint.numtail != '') {
|
||
numtail = mPoint.numtail;
|
||
}
|
||
if (mPoint.measuredt != null && mPoint.measuredt != undefined && mPoint.measuredt != '') {
|
||
nowdate = mPoint.measuredt;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
if (visualCacheData.numtail != null && visualCacheData.numtail != undefined && visualCacheData.numtail != '') {
|
||
numtail = visualCacheData.numtail;
|
||
}
|
||
if (visualCacheData.insdt != null && visualCacheData.insdt != undefined && visualCacheData.insdt != '') {
|
||
nowdate = visualCacheData.insdt;
|
||
}
|
||
if (visualCacheData.rate != null && visualCacheData.rate != undefined && visualCacheData.rate != '') {
|
||
rate = visualCacheData.rate;
|
||
}
|
||
} else {
|
||
var mPoint = arr[i].mPoint;
|
||
if (mPoint != null && mPoint != undefined && mPoint != '') {
|
||
if (mPoint.parmvalue != null && mPoint.parmvalue != undefined && mPoint.parmvalue != '') {
|
||
value = mPoint.parmvalue;
|
||
}
|
||
if (mPoint.alarmmax != null && mPoint.alarmmax != undefined && mPoint.alarmmax != '') {
|
||
dataMax = mPoint.alarmmax;
|
||
}
|
||
if (mPoint.numtail != null && mPoint.numtail != undefined && mPoint.numtail != '') {
|
||
numtail = mPoint.numtail;
|
||
}
|
||
if (mPoint.measuredt != null && mPoint.measuredt != undefined && mPoint.measuredt != '') {
|
||
nowdate = mPoint.measuredt;
|
||
}
|
||
}
|
||
}
|
||
if (arr[i].getValueType == 'getRedisData' || arr[i].getValueType == 'getTHMonthHistoryAndRedisData') {
|
||
if (arr[i].value != null) {
|
||
let redisValue = eval("(" + arr[i].value + ")");
|
||
// console.log(redisValue)
|
||
value = redisValue.mpvalue;
|
||
if (isNumber(value)) {
|
||
if (arr[i].visualCacheData != null) {
|
||
if (arr[i].visualCacheData.numtail != null) {
|
||
value = Number(value).toFixed(Number(arr[i].visualCacheData.numtail));
|
||
}
|
||
}
|
||
value = toThousands(value);
|
||
}
|
||
if (arr[i].visualCacheData != null) {
|
||
if (arr[i].visualCacheData.unit != null) {
|
||
value += arr[i].visualCacheData.unit;
|
||
}0
|
||
}
|
||
if ($("." + arr[i].elementCode).length > 0) {
|
||
$("." + arr[i].elementCode).html(value);
|
||
}
|
||
} else {
|
||
$('.' + arr[i].elementCode).text('-');
|
||
}
|
||
} else {
|
||
value = parseFloat(value) * rate;
|
||
value = value.toFixed(numtail);
|
||
if ($("." + arr[i].elementCode).length > 0) {
|
||
if (isNumber(value)) {
|
||
$("." + arr[i].elementCode).html(toThousands(value));
|
||
} else {
|
||
$("." + arr[i].elementCode).html(value);
|
||
}
|
||
}
|
||
if ($("." + arr[i].elementCode).parent().find('.nowdate').length > 0) {
|
||
$("." + arr[i].elementCode).parent().find('.nowdate').html(nowdate.substring(11, 16));
|
||
}
|
||
}
|
||
//长江水质曲线-实测值
|
||
if (arr[i].elementCode == 'yangtzeRiver_CI_concentration_measured') {
|
||
//actualHandlingCapacityDay_dataseries = getdataseries(arr[i].mPointHistory,arr[i].visualCacheDataList,numtail);
|
||
yangtzeRiver_CI_concentration_dataseries = arr[i].jsonArray;
|
||
}
|
||
//长江水质曲线-预测值
|
||
if (arr[i].elementCode == 'yangtzeRiver_CI_concentration_forecast') {
|
||
//daily_energy_output_dataseries = getdataseries(arr[i].mPointHistory,arr[i].visualCacheDataList,numtail);
|
||
yangtzeRiver_CI_concentration_forecast_dataseries = arr[i].jsonArray;
|
||
}
|
||
//长江水质曲线-警戒值
|
||
if (arr[i].elementCode == 'yangtzeRiver_CI_concentration_alert') {
|
||
//forecastProcessingCapacityHour_dataseries = getdataseries(arr[i].mPointHistory,arr[i].visualCacheDataList,numtail);
|
||
yangtzeRiver_CI_concentration_alert_dataseries = arr[i].jsonArray;
|
||
}
|
||
//水库水质曲线-实测值
|
||
if (arr[i].elementCode == 'reservoir_CI_concentration_measured') {
|
||
//actualHandlingCapacityDay_dataseries = getdataseries(arr[i].mPointHistory,arr[i].visualCacheDataList,numtail);
|
||
reservoir_CI_concentration_dataseries = arr[i].jsonArray;
|
||
}
|
||
//水库水质曲线-预测值
|
||
if (arr[i].elementCode == 'reservoir_CI_concentration_forecast') {
|
||
//daily_energy_output_dataseries = getdataseries(arr[i].mPointHistory,arr[i].visualCacheDataList,numtail);
|
||
reservoir_CI_concentration_forecast_dataseries = arr[i].jsonArray;
|
||
}
|
||
//水库水质曲线-警戒值
|
||
if (arr[i].elementCode == 'reservoir_CI_concentration_alert') {
|
||
//forecastProcessingCapacityHour_dataseries = getdataseries(arr[i].mPointHistory,arr[i].visualCacheDataList,numtail);
|
||
reservoir_CI_concentration_alert_dataseries = arr[i].jsonArray;
|
||
}
|
||
|
||
}
|
||
}
|
||
if(jspnum==1){
|
||
var seriesdata = [
|
||
{
|
||
name: '实测值',
|
||
type: 'line',
|
||
smooth: true,
|
||
symbol:'none',
|
||
data: reservoir_CI_concentration_dataseries
|
||
},
|
||
/* {
|
||
name: '预测值',
|
||
type: 'line',
|
||
smooth: true,
|
||
symbol:'none',
|
||
data: reservoir_CI_concentration_forecast_dataseries
|
||
},*/
|
||
{
|
||
name: '警戒值',
|
||
type: 'line',
|
||
smooth: true,
|
||
symbol:'none',
|
||
data: reservoir_CI_concentration_alert_dataseries
|
||
},
|
||
]
|
||
echartsLine('reservoir_line',seriesdata,['green','red','blue']);
|
||
}
|
||
if(jspnum==2){
|
||
var seriesdata = [
|
||
{
|
||
name: '实测值',
|
||
type: 'line',
|
||
smooth: true,
|
||
symbol:'none',
|
||
data: yangtzeRiver_CI_concentration_dataseries
|
||
},
|
||
{
|
||
name: '预测值',
|
||
type: 'line',
|
||
smooth: true,
|
||
symbol:'none',
|
||
data: yangtzeRiver_CI_concentration_forecast_dataseries
|
||
},
|
||
{
|
||
name: '警戒值',
|
||
type: 'line',
|
||
smooth: true,
|
||
symbol:'none',
|
||
data: yangtzeRiver_CI_concentration_alert_dataseries
|
||
},
|
||
]
|
||
echartsLine('yangtzeRiver_line', seriesdata, ['green', 'blue', 'red']);
|
||
}
|
||
}
|
||
});
|
||
}
|
||
|
||
function getdataseries(mPointHistory, visualCacheDataList, numtail) {
|
||
var dataseries = [];
|
||
if (mPointHistory != null
|
||
&& mPointHistory != undefined
|
||
&& mPointHistory != '') {
|
||
var mPointHistory = mPointHistory;
|
||
for (var m = 0; m < mPointHistory.length; m++) {
|
||
var dataserie = [];
|
||
dataserie.push(mPointHistory[m].measuredt.substr(0, 16));
|
||
dataserie.push(mPointHistory[m].parmvalue.toFixed(numtail));
|
||
dataseries.push(dataserie);
|
||
}
|
||
} else {
|
||
if (visualCacheDataList != null
|
||
&& visualCacheDataList != undefined
|
||
&& visualCacheDataList != '') {
|
||
var visualCacheDataList = visualCacheDataList;
|
||
for (var m = 0; m < visualCacheDataList.length; m++) {
|
||
var dataserie = [];
|
||
dataserie.push(visualCacheDataList[m].insdt.substr(0, 16));
|
||
dataserie.push(visualCacheDataList[m].value.toFixed(numtail));
|
||
dataseries.push(dataserie);
|
||
}
|
||
}
|
||
}
|
||
return dataseries;
|
||
}
|
||
function queryData(num) {
|
||
getData(bizid, "",num);
|
||
}
|
||
</script>
|
||
|
||
</head>
|
||
<body class="hold-transition ${cu.themeclass} sidebar-mini">
|
||
<div class="wrapper">
|
||
<div class="content-wrapper content-wrapper-bg-darkblue overall-content">
|
||
<!-- BEGIN CONTAINER -->
|
||
<input type="hidden" name="jsp_id1" id="jsp_id1" value="waterIntakeManagement_reservoir">
|
||
<input type="hidden" name="jsp_id2" id="jsp_id2" value="waterIntakeManagement_yangtzeRiver">
|
||
<section class="content container-fluid font-color-black">
|
||
<!-- BEGIN CONTAINER -->
|
||
<div class="col-lg-12">
|
||
<div class="row">
|
||
<div class="col-lg-6">
|
||
<div class="box box-primary">
|
||
<div class="box-header with-border">
|
||
<h3 class="box-title"><strong>水库水质数据</strong></h3>
|
||
<div class="box-tools pull-right"></div>
|
||
</div>
|
||
<!-- /.box-header -->
|
||
<div class="box-body font-size-16 line" style="padding-top: 30px;">
|
||
<div class="row margin-bottom-30">
|
||
<strong class="col-lg-7">水库余氯总氯(PPm)</strong>
|
||
<div class="col-lg-5 reservoir_CI_concentration">27</div>
|
||
</div>
|
||
<div class="row margin-bottom-30">
|
||
<strong class="col-lg-7">水库浊度(ntu)</strong>
|
||
<div class="col-lg-5 reservoir_turbidity">27</div>
|
||
</div>
|
||
<div class="row margin-bottom-30">
|
||
<strong class="col-lg-7">水库PH</strong>
|
||
<div class="col-lg-5 reservoir_PH">27</div>
|
||
</div>
|
||
<div class="row margin-bottom-30">
|
||
<strong class="col-lg-7">水库溶解氧浓度(mg/L)</strong>
|
||
<div class="col-lg-5 reservoir_DO_concentration">27</div>
|
||
</div>
|
||
<div class="row">
|
||
<strong class="col-lg-7">水库电导率(μS/cm)</strong>
|
||
<div class="col-lg-5 reservoir_conductivity">27</div>
|
||
</div>
|
||
</div>
|
||
<!-- /.box-body -->
|
||
<%--<div class="box-footer"></div>--%>
|
||
<!-- /.box-footer-->
|
||
</div>
|
||
</div>
|
||
<div class="col-lg-6">
|
||
<div class="box box-primary">
|
||
<div class="box-header with-border">
|
||
<h3 class="box-title"><strong>水库水质曲线(余氯总氯)</strong></h3>
|
||
<div class="box-tools pull-right"></div>
|
||
</div>
|
||
<!-- /.box-header -->
|
||
<div class="box-body">
|
||
<div class="input-group dateSelect">
|
||
<input type="text" class="form-control" id="reservoirTime" style="width:270px">
|
||
<span class="input-group-btn">
|
||
<button class="btn btn-default" type="button" onclick="queryData(1)">查询</button>
|
||
</span>
|
||
</div><!-- /input-group -->
|
||
<div class="row">
|
||
<div class="col-lg-12 line" id="reservoir_line">
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- /.box-body -->
|
||
<%--<div class="box-footer"></div>--%>
|
||
<!-- /.box-footer-->
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="row">
|
||
<div class="col-lg-6">
|
||
<div class="box box-primary">
|
||
<div class="box-header with-border">
|
||
<h3 class="box-title"><strong>长江水质数据</strong></h3>
|
||
<div class="box-tools pull-right"></div>
|
||
</div>
|
||
<!-- /.box-header -->
|
||
<div class="box-body font-size-16 line" style="padding-top: 30px;">
|
||
<div class="row margin-bottom-30">
|
||
<strong class="col-lg-7">长江CI浓度(PPm)</strong>
|
||
<div class="col-lg-5 yangtzeRiver_CI_concentration">27</div>
|
||
</div>
|
||
<div class="row margin-bottom-30">
|
||
<strong class="col-lg-7">长江浊度(ntu)</strong>
|
||
<div class="col-lg-5 yangtzeRiver_turbidity">27</div>
|
||
</div>
|
||
<div class="row margin-bottom-30">
|
||
<strong class="col-lg-7">长江PH</strong>
|
||
<div class="col-lg-5 yangtzeRiver_PH">27</div>
|
||
</div>
|
||
<div class="row margin-bottom-30">
|
||
<strong class="col-lg-7">长江溶解氧浓度(mg/L)</strong>
|
||
<div class="col-lg-5 yangtzeRiver_DO_concentration">27</div>
|
||
</div>
|
||
<div class="row margin-bottom-30">
|
||
<strong class="col-lg-7">长江电导率(μS/cm)</strong>
|
||
<div class="col-lg-5 yangtzeRiver_conductivity">27</div>
|
||
</div>
|
||
</div>
|
||
<!-- /.box-body -->
|
||
<%--<div class="box-footer"></div>--%>
|
||
<!-- /.box-footer-->
|
||
</div>
|
||
</div>
|
||
<div class="col-lg-6">
|
||
<div class="box box-primary">
|
||
<div class="box-header with-border">
|
||
<h3 class="box-title"><strong>长江水质曲线</strong></h3>
|
||
<div class="box-tools pull-right"></div>
|
||
</div>
|
||
<!-- /.box-header -->
|
||
<div class="box-body line">
|
||
<div class="input-group dateSelect">
|
||
<input type="text" class="form-control" id="yangtzeRiverTime" style="width:270px">
|
||
<span class="input-group-btn">
|
||
<button class="btn btn-default" type="button" onclick="queryData(2)">查询</button>
|
||
</span>
|
||
</div><!-- /input-group -->
|
||
<div class="row">
|
||
<div class="col-lg-12 line" id="yangtzeRiver_line">
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- /.box-body -->
|
||
<%--<div class="box-footer"></div>--%>
|
||
<!-- /.box-footer-->
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
</div>
|
||
</div>
|
||
</body>
|
||
</html> |