xzzn/SIPAIIS_WMS_JSSW
4
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity
Files
main
SIPAIIS_WMS_JSSW/WebRoot/jsp/visual/evaluate_homepage.jsp

1870 lines
84 KiB
Plaintext
Raw Permalink Normal View History

first commit
2026-01-16 14:13:44 +08:00
<%@ 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" />
<title>
<%= ServerObject.atttable.get("TOPTITLE")%>
</title>
<!-- 引用页头及CSS页-->
<jsp:include page="/jsp/inc.jsp"></jsp:include>
<style type="text/css">
.whole-body{
background: transparent;
width: 3342px;
height: 1730px;
padding-top: 60px;
padding-bottom: 60px;
padding-left: 70px;
padding-right: 70px;
}
.content-wrapper-bg-darkblue{
background: rgba(0,17,33,0.70);
border: 1px solid #454545;
border-radius: 14px;
}
.content-left, .content-right{
float: left;
padding:0;
}
.content-left{
width: 810px;
}
.content-right{
width: 2380px;
}
.content-right-subject{
min-height: 215px;
}
.content-bg-darkblue{
background: rgba(12,12,12,0.60);
}
.homePage-btn{
cursor:pointer;
background: rgba(54,167,204,0.70);
border-radius: 10px;
}
.col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9,
.col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9,
.col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9,
.col-xs-1, .col-xs-10, .col-xs-11, .col-xs-12, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9,
.col-xs-1-5 {
padding-right: 5px;
padding-left: 5px
}
.col-xs-1-5 {
width: 12%;
}
.col-xs-1-5{
float: left;
}
.col-xs-1-5 {
position: relative;
min-height: 1px;
}
.title-height{
height:70px;
}
.row-10{
height:10%;
}
.row-15{
height:15%;
}
.row-25{
height:25%;
}
.row-30{
height:30%;
}
.row-35{
height:35%;
}
.row-40{
height:40%;
}
.row-50{
height:50%;
}
.row-70{
height:70%;
}
.row-75{
height:75%;
}
.row-100{
height:100%;
}
.content-wrapper-bg-grey{
background: #eeeeee;
}
.content-wrapper-bg-white,.bgcolor-white,.bgcolor-white-light{
background: #ffffff;
border-radius: 5px;
}
.content-wrapper-bg-white,.content-wrapper-bg-transparent{
margin:0 5px;
border-radius: 5px;
}
.bgcolor-blue{
background: #052941;
}
.margin-bottom-15{
margin-bottom: 15px;
}
.margin-bottom-22{
margin-bottom: 22px;
}
.margin-bottom-25{
margin-bottom: 25px;
}
.margin-bottom-36{
margin-bottom: 22px;
}
.margin-bottom-55{
margin-bottom: 55px;
}
.margin-bottom-75{
margin-bottom: 75px;
}
.padding-topbottom-35{
padding-top: 35px;
padding-bottom: 35px;
}
.pad-topbottom-60{
padding-top: 60px;
padding-bottom: 60px;
}
.pad-leftright-72{
padding-left: 72px;
padding-right: 72px;
}
.pad-bottom-10{
padding-bottom: 10px;
}
.padding-top-5{
padding-top:5px;
}
.padding-top-10{
padding-top: 10px;
}
.padding-top-15{
padding-top: 15px;
}
.padding-top-27{
padding-top: 27px;
}
.padding-top-90{
padding-top: 90px;
}
.line-height-08{
line-height: 0.8;
}
.line-height-1{
line-height: 1;
}
.line-height-2{
line-height: 2;
}
.line-height-2-3{
line-height: 2.3;
}
.line-height-3{
line-height: 3;
}
.line-height-5{
line-height: 5;
}
.line-height-6{
line-height: 6;
}
.font-size-12{
font-size: 12px;
font-weight: 400;
line-height: 24px;
}
.font-size-14{
font-size: 14px;
line-height: inherit;
}
.font-size-16{
font-size: 16px;
}
.font-size-20{
font-size: 20px;
}
.font-size-22{
font-size: 22px;
}
.font-size-30{
font-size: 30px;
}
.font-size-35{
font-size: 35px;
}
.font-size-36{
font-size: 36px;
}
.font-size-40{
font-size: 40px;
line-height: normal;
}
.font-size-50{
font-size: 50px;
}
.font-size-60{
font-size: 60px;
}
.font-size-65{
font-size: 65px;
}
.font-size-70{
font-size: 70px;
}
.font-color-white,.font-color-dark-white{
color: #FFFFFF;
}
.font-color-black{
color: #0d2336;
font-weight: 600;
}
.font-color-red{
color: #E7A2FF
}
.font-color-redlight{
color: #CE00FF
}
.font-color-blue,.font-color-dark-blue{
color: #1472FF;
}
.font-color-lightBlue,.font-color-light-blue{
color: #04FFFF;
}
.font-color-green{
color: #69F9B6;
}
.border-left{
border-left: 1px solid #c1c1c1;
}
.border-right{
border-right: 2px solid #ffffff;
}
.border-bottom{
border-bottom: 1px solid #c1c1c1;
}
.border-leftAndRight{
border-left: 1px solid #c1c1c1;border-right: 1px solid #c1c1c1;
}
.bgcolor-blue-light{
background: #192B73;
}
.bgcolor-transparent{
background: transparent;
border-radius: 5px;
}
.img-icon{
width: 70px;
height: 70px;
}
.img-pump{
width: 60px;
height: 97px;
}
.progress_bar{
min-width: 630px;
height: 25px;
}
.polarBarLegend{
width: 360px;
height: 200px;
position: fixed;
}
.polarBar{
min-width: 630px;
height: 450px;
}
.cursor-pointer{
cursor: pointer;
}
.pressure-line{
width: 1180px;
height: 560px;
}
.rawwater-line{
width: 2360px;
height: 560px;
}
.instructions-line{
width: 2360px;
height: 355px;
}
</style>
<script type="text/javascript">
var fontcolor_grey = '#aeaeae';
var fontcolor_black = '#0d2336';
var color_blue = '#36FFF9';
var color_blue_other = '#1D4F6D';
var img_name = '';
var color = ['#649DFF','#64FFFA','#ff2ee3','#2e97ff','#ffb536'];
$(function () {
var width = $(window).width();
var height = $(window).height();
var proportion_width = width/3340;
var proportion_height = height/1730;
if(width>0 && width<=3340){
$('.whole-body').width($('.whole-body').width()*proportion_width);
$('.whole-body').height($('.whole-body').height()*proportion_height)
$('.whole-body').css("paddingTop",$('.whole-body').css("paddingTop").replace('px', '')*proportion_height);
$('.whole-body').css("paddingBottom",$('.whole-body').css("paddingTop").replace('px', '')*proportion_height);
$('.whole-body').css("paddingLeft",$('.whole-body').css("paddingTop").replace('px', '')*proportion_height);
$('.whole-body').css("paddingRight",$('.whole-body').css("paddingTop").replace('px', '')*proportion_height);
$('.content-left').width($('.content-left').width()*proportion_width);
$('.content-right').width($('.content-left').width()*proportion_width);
}
$('.polarBar').width($('.polarBar').parent().width());
$('.progress_bar').width($('.progress_bar').parent().width()-80);
var data = [87,90]
polarBar('polarBar',data);
data = {
value1:5,
value2:10,
}
progressBar('progress_bar',data,'#69F6F9','#1472FF');
var legenddata = ['水位变化趋势','配电单耗变化趋势'];
var seriesdata = [
{
name: legenddata[0],
type: 'bar',
barWidth: 20 ,
data: [['01-01',10],['01-02',11],['01-03',12],['01-04',13],['01-05',14],['01-06',11],['01-07',13],
['01-08',11],['01-09',12],['01-10',13],['01-11',14],['01-12',11],['01-13',13]
]
}
]
doBar('instructions-line',legenddata,seriesdata);
seriesdata = [
{
name: legenddata[0],
type: 'line',
data: [['2022-01-14 00:00',10],['2022-01-14 01:00',11],['2022-01-14 02:00',12],['2022-01-14 03:00',13],['2022-01-14 04:00',14],['2022-01-14 05:00',11],['2022-01-14 06:00',13]
,['2022-01-14 07:00',14],['2022-01-14 08:00',12],['2022-01-14 09:00',15],['2022-01-14 10:00',15],['2022-01-14 11:00',11],['2022-01-14 12:00',12],['2022-01-14 13:00',13]
,['2022-01-14 14:00',12],['2022-01-14 15:00',11]]
}
]
echarts_line('pressure-cumulative',legenddata,seriesdata,'累计压力调整');
echarts_line('pressure-actual',legenddata,seriesdata,'实际压力变化趋势');
echarts_line('pressure-dispatch',legenddata,seriesdata,'调度指令压力变化趋势');
echarts_line('rawwater-water',legenddata,seriesdata,'水量数据曲线');
seriesdata = [
{
name: legenddata[0],
type: 'line',
data: [['2022-01-14 00:00',10],['2022-01-14 01:00',11],['2022-01-14 02:00',12],['2022-01-14 03:00',13],['2022-01-14 04:00',14],['2022-01-14 05:00',11],['2022-01-14 06:00',13]
,['2022-01-14 07:00',14],['2022-01-14 08:00',12],['2022-01-14 09:00',15],['2022-01-14 10:00',15],['2022-01-14 11:00',11],['2022-01-14 12:00',12],['2022-01-14 13:00',13]
,['2022-01-14 14:00',12],['2022-01-14 15:00',11]]
},
{
name: legenddata[1],
type: 'line',
yAxisIndex: 1,
data: [['2022-01-14 00:00',20],['2022-01-14 01:00',21],['2022-01-14 02:00',22],['2022-01-14 03:00',23],['2022-01-14 04:00',24],['2022-01-14 05:00',21],['2022-01-14 06:00',23]
,['2022-01-14 07:00',24],['2022-01-14 08:00',22],['2022-01-14 09:00',25],['2022-01-14 10:00',25],['2022-01-14 11:00',21],['2022-01-14 12:00',22],['2022-01-14 13:00',23]
,['2022-01-14 14:00',22],['2022-01-14 15:00',21]]
}
]
echarts_line_2y('reservoir-energy',legenddata,seriesdata,'能效模式');
echarts_line_2y('reservoir-steady',legenddata,seriesdata,'稳态模式');
getData();
setInterval("getData()",60000);
});
function addAndRemove4Class(one,two){
$('.'+one).addClass(two);
$('.'+one).removeClass(one);
}
function getData(){
var bizid = "";
var jsp_id = $('#jsp_id').val();
var time_input = $('#time_input').val();
$.post(ext.contextPath + '/evaluate/getEvaluateData.do', {bizid:bizid,time:time_input,jsp_id:jsp_id} , function(data) {
var arr= JSON.parse(data);
console.log(arr);
var pressure_cumulative_seriesdata = [];
var pressure_actual_seriesdata = [];
var reservoir_lvl_seriesdata = [];
var reservoir_pump_seriesdata = [];
var rawwater_water_seriesdata = [];
var pressure_dispatch_seriesdata = [];
var instructions_line_seriesdata = [];
var production_load_rate = null;
var automatic_execution_rate = null;
var cumulative_times_today = 0;
var automatic_execution_times = 0;
if(arr.rows!=null && arr.rows!=undefined && arr.rows!=''){
for(var i=0;i<arr.rows.length;i++){
var value =0;
var numtail=0;
var dataMax=0;
var rate = 1;
var nowdate = getNowTime();
if(arr.rows[i].visualCacheConfig!=null
&& arr.rows[i].visualCacheConfig!=undefined
&& arr.rows[i].visualCacheConfig!=''){
var visualCacheConfig = arr.rows[i].visualCacheConfig;
if(visualCacheConfig.numtail!=null && visualCacheConfig.numtail!=undefined && visualCacheConfig.numtail!=''){
numtail = visualCacheConfig.numtail;
}
}
if(arr.rows[i].visualCacheData!=null
&& arr.rows[i].visualCacheData!=undefined
&& arr.rows[i].visualCacheData!=''){
var visualCacheData = arr.rows[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.rows[i].mPoint!=null && arr.rows[i].mPoint!=undefined && arr.rows[i].mPoint!=''){
var mPoint = arr.rows[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.rows[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.rows[i].elementCode+"_img").length > 0){
var src = "<%=request.getContextPath()%>/IMG/evaluate/pump_grey.png";
if(value==0){
src = "<%=request.getContextPath()%>/IMG/evaluate/pump_green.png";
}
if(value==1){
src = "<%=request.getContextPath()%>/IMG/evaluate/pump_red.png";
}
$("."+arr.rows[i].elementCode+"_img").html('<img class="img-pump" src='+src+'>');
}
if($("."+arr.rows[i].elementCode+"_text").length > 0){
var text = "";
if(value==1){
text = "运行";
}else{
text = "检修";
}
$("."+arr.rows[i].elementCode+"_text").html(text);
}
value = parseFloat(value)*rate;
value = value.toFixed(numtail);
if($("."+arr.rows[i].elementCode).length > 0){
$("."+arr.rows[i].elementCode).html(toThousands(value));
}
if($("."+arr.rows[i].elementCode).parent().find('.nowdate').length > 0){
$("."+arr.rows[i].elementCode).parent().find('.nowdate').html(nowdate.substring(11,16));
}
if(arr.rows[i].elementCode=='cumulative_times_today'){
instructions_line_seriesdata = getdataseries(arr.rows[i].mPointHistory,arr.rows[i].visualCacheDataList,numtail);
cumulative_times_today = value;
}
if(arr.rows[i].elementCode=='automatic_execution_times'){
automatic_execution_times = value;
}
if(arr.rows[i].elementCode=='pressure_cumulative'){
pressure_cumulative_seriesdata = getdataseries(arr.rows[i].mPointHistory,arr.rows[i].visualCacheDataList,numtail);
}
if(arr.rows[i].elementCode=='pressure_actual'){
pressure_actual_seriesdata = getdataseries(arr.rows[i].mPointHistory,arr.rows[i].visualCacheDataList,numtail);
}
if(arr.rows[i].elementCode=='reservoir_lvl'){
reservoir_lvl_seriesdata = getdataseries(arr.rows[i].mPointHistory,arr.rows[i].visualCacheDataList,numtail);
}
if(arr.rows[i].elementCode=='reservoir_pump'){
reservoir_pump_seriesdata = getdataseries(arr.rows[i].mPointHistory,arr.rows[i].visualCacheDataList,numtail);
}
if(arr.rows[i].elementCode=='rawwater_water'){
rawwater_water_seriesdata = getdataseries(arr.rows[i].mPointHistory,arr.rows[i].visualCacheDataList,numtail);
}
if(arr.rows[i].elementCode=='pressure_dispatch'){
pressure_dispatch_seriesdata = getdataseries(arr.rows[i].mPointHistory,arr.rows[i].visualCacheDataList,numtail);
}
}
}
var implementation_rate = 0;
if(cumulative_times_today>0){
implementation_rate = automatic_execution_times/cumulative_times_today*100;
}
var manual_adjustment_times = cumulative_times_today-automatic_execution_times;
var adjustment_rate = 0;
if(cumulative_times_today>0){
adjustment_rate = manual_adjustment_times/cumulative_times_today*100;
}
if($(".implementation_rate").length > 0){
implementation_rate = implementation_rate.toFixed(0);
$(".implementation_rate").html(toThousands(implementation_rate));
}
if($(".manual_adjustment_times").length > 0){
manual_adjustment_times = manual_adjustment_times.toFixed(0);
$(".manual_adjustment_times").html(toThousands(manual_adjustment_times));
}
if($(".adjustment_rate").length > 0){
adjustment_rate = adjustment_rate.toFixed(0);
$(".adjustment_rate").html(toThousands(adjustment_rate));
}
var data = [production_load_rate,automatic_execution_rate]
if(production_load_rate!=null && production_load_rate!=''&&
automatic_execution_rate!=null && automatic_execution_rate!=''){
polarBar('polarBar',data);
}
var legenddata = [''];
var seriesdata = [
{
name: legenddata[0],
type: 'bar',
barWidth: 20 ,
data: instructions_line_seriesdata
}
]
if(instructions_line_seriesdata!=null && instructions_line_seriesdata.length>0){
doBar('instructions-line',legenddata,seriesdata);
}
var pressure_cumulative_legenddata = ['累计压力调整'];
var seriesdata = [
{
name: pressure_cumulative_legenddata[0],
type: 'line',
data: pressure_cumulative_seriesdata
}
]
if(pressure_cumulative_seriesdata!=null && pressure_cumulative_seriesdata.length>0){
echarts_line('pressure-cumulative',pressure_cumulative_legenddata,seriesdata,'累计压力调整');
}
var pressure_actual_legenddata = ['实际压力变化趋势'];
seriesdata = [
{
name: pressure_actual_legenddata[0],
type: 'line',
data: pressure_actual_seriesdata
}
]
if(pressure_actual_seriesdata!=null && pressure_actual_seriesdata.length>0){
echarts_line('pressure-actual',pressure_actual_legenddata,seriesdata,'实际压力变化趋势');
}
legenddata = ['水位变化趋势','配电单耗变化趋势'];
seriesdata = [
{
name: legenddata[0],
type: 'line',
data: reservoir_lvl_seriesdata
},
{
name: legenddata[1],
type: 'line',
yAxisIndex: 1,
data: reservoir_pump_seriesdata
}
]
if(reservoir_lvl_seriesdata!=null && reservoir_lvl_seriesdata.length>0 && reservoir_pump_seriesdata!=null && reservoir_pump_seriesdata.length>0){
echarts_line_2y('reservoir-energy',legenddata,seriesdata,'能效模式');
echarts_line_2y('reservoir-steady',legenddata,seriesdata,'稳态模式');
}
legenddata = ['调度指令压力变化趋势'];
seriesdata = [
{
name: legenddata[0],
type: 'line',
data: pressure_dispatch_seriesdata
}
]
if(pressure_dispatch_seriesdata!=null && pressure_dispatch_seriesdata.length>0){
echarts_line('pressure-dispatch',legenddata,seriesdata,'调度指令压力变化趋势');
}
legenddata = ['水量数据曲线'];
seriesdata = [
{
name: legenddata[0],
type: 'line',
data: rawwater_water_seriesdata
}
]
if(rawwater_water_seriesdata!=null && rawwater_water_seriesdata.length>0){
echarts_line('rawwater-water',legenddata,seriesdata,'水量数据曲线');
}
});
}
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 echarts_line(id,legenddata,seriesdata,title){
var lifeChart = echarts.getInstanceByDom(document.getElementById(id));
//有的话就获取已有echarts实例的DOM节点。
if (lifeChart != null) { // 如果存在，就进行销毁。
lifeChart.dispose();
}
var option = {
color:color,
tooltip: {
trigger: 'axis'
},
title:{
text: title,
x: 'center',
textStyle: {
fontSize: '36',
fontWeight: '400',
color: '#ffffff',
},
},
/* legend: {
data: legenddata,
x:'right',
textStyle: {
color: fontcolor_grey ,
fontSize: 12 ,
},
icon:'roundRect'
}, */
grid: {
left: '3%',
right: '4%',
bottom: '3%',
top: '15%',
containLabel: true
},
xAxis: {
type: 'time',
axisLabel: {
color: '#a0a0a0',
fontSize: 35 ,
}
},
yAxis: {
type: 'value',
max: function (value) {
if(value.max>1){
return Math.floor(value.max*1.5);
}else{
return (value.max+1);
}
},
axisLine: {
show: true,
},
splitLine: {
show: true,
lineStyle: {
type: 'dashed' ,
}
},
axisLabel: {
color: '#a0a0a0',
fontSize: 35 ,
}
},
series: seriesdata,
};
lifeChart = echarts.init(document.getElementById(id));
lifeChart.setOption(option,true);
}
function echarts_line_2y(id,legenddata,seriesdata,title){
var lifeChart = echarts.getInstanceByDom(document.getElementById(id));
//有的话就获取已有echarts实例的DOM节点。
if (lifeChart != null) { // 如果存在，就进行销毁。
lifeChart.dispose();
}
var option = {
color:['#07D5FF','#FFFF07'],
tooltip: {
trigger: 'axis'
},
title:{
text: title,
x: 'center',
textStyle: {
fontSize: '36',
fontWeight: '400',
color: '#ffffff',
},
},
legend: {
data: legenddata,
x:'right',
top: '10%',
textStyle: {
color: '#ffffff',
fontSize: 30 ,
},
icon:'circle'
},
grid: {
left: '3%',
right: '4%',
bottom: '3%',
top: '22%',
containLabel: true
},
xAxis: {
type: 'time',
axisLabel: {
color: '#a0a0a0',
fontSize: 35 ,
}
},
yAxis: [
{
type: 'value',
max: function (value) {
if(value.max>1){
return Math.floor(value.max*1.5);
}else{
return (value.max+1);
}
},
axisLine: {
show: true,
},
splitLine: {
show: true,
lineStyle: {
type: 'dashed' ,
}
},
axisLabel: {
color: '#a0a0a0',
fontSize: 35 ,
}
},
{
type: 'value',
max: function (value) {
if(value.max>1){
return Math.floor(value.max*1.5);
}else{
return (value.max+1);
}
},
axisLine: {
show: true,
},
splitLine: {
show: true,
lineStyle: {
type: 'dashed' ,
}
},
axisLabel: {
color: '#a0a0a0',
fontSize: 35 ,
}
}
],
series: seriesdata,
};
lifeChart = echarts.init(document.getElementById(id));
lifeChart.setOption(option,true);
}
function doBar(id,legenddata,seriesdata){
var lifeChart = echarts.getInstanceByDom(document.getElementById(id));
//有的话就获取已有echarts实例的DOM节点。
if (lifeChart != null) { // 如果存在，就进行销毁。
lifeChart.dispose();
}
var option = {
color:['#13E0FF'],
tooltip: {
trigger: 'axis'
},
grid: {
left: '3%',
right: '4%',
bottom: '3%',
top: '5%',
containLabel: true
},
xAxis: {
type: 'category',
axisLabel: {
color: '#a0a0a0',
fontSize: 35 ,
}
},
yAxis: {
type: 'value',
max: function (value) {
if(value.max>1){
return Math.floor(value.max*1.5);
}else{
return (value.max+1);
}
},
axisLine: {
show: true,
},
splitLine: {
show: true,
lineStyle: {
type: 'dashed' ,
}
},
axisLabel: {
color: '#a0a0a0',
fontSize: 35 ,
}
},
series: seriesdata,
};
lifeChart = echarts.init(document.getElementById(id));
lifeChart.setOption(option,true);
}
function doBarAndPie(id,data){
var myChart = echarts.init(document.getElementById(id));
var option = {
color:['#71D3FF','#8871FF','#F671FF','#28EC77','#FFFA71'],
title: [
{
text: data.value + '%',
left: '50%',
top: '40%',
textAlign: 'center',
textStyle: {
fontSize: '40',
fontWeight: '400',
color: '#69F6F9',
textAlign: 'center',
textBorderColor: 'rgba(0, 0, 0, 0)',
textShadowColor: '#000',
textShadowBlur: '0',
textShadowOffsetX: 0,
textShadowOffsetY: 1,
},
},
],
polar: {
radius: ['45%', '55%'],
center: ['50%', '50%'],
},
angleAxis: {
max: 100,
clockwise: false,
axisLine: {
show: false,
},
axisTick: {
show: false,
},
axisLabel: {
show: false,
},
splitLine: {
show: false,
},
},
radiusAxis: {
type: 'category',
show: true,
axisLabel: {
show: false,
},
axisLine: {
show: false,
},
axisTick: {
show: false,
},
},
series: [
{
name: '',
type: 'bar',
roundCap: true,
z: 2,
showBackground: true,
data: [data.value],
coordinateSystem: 'polar',
itemStyle: {
normal: {
color: '#36FFF9'
},
},
},
{
name: 'Access From',
type: 'pie',
radius: ['60%', '80%'],
label: {
color: "#fff" ,
},
center: ['50%', '50%'],
avoidLabelOverlap: false,
data: data.list
}
],
};
myChart.clear();
myChart.setOption(option, true);
}
function progressBar(id,data,color1,color2){
var myChart = echarts.init(document.getElementById(id));
var option={
grid: {
top: 0,
bottom: 0,
left: '0',
right: '0'
},
xAxis: {
show: false,
type: "value",
boundaryGap: [0, 0]
},
yAxis: [
{
type: "category",
data: [""],
axisLine: { show: false },
axisTick: [
{
show: false
}
]
}
],
series: [
{
name: "金额",
type: "bar",
zlevel: 1,
itemStyle: {
normal: {
barBorderRadius: 9,
color: color1
}
},
barWidth: 20,
data: [data.value1]
},
{
name: "背景",
type: "bar",
barWidth: 20,
barGap: "-100%",
data: [data.value2],
itemStyle: {
normal: {
color: color2,
barBorderRadius: 9
}
}
}
]
}
myChart.clear();
myChart.setOption(option, true);
}
function polarBar(id,data){
var myChart = echarts.init(document.getElementById(id));
var option = {
color:['#69F9B6','#1472FF','#1A3D70','#1A3D70'],
grid: {
top: 0,
bottom: 0,
left: '0',
right: '0'
},
angleAxis: {
max: 133,
axisLine: {
show: false
},
axisTick: {
show: false
},
axisLabel: {
show: false
},
splitLine: {
show: false
}
},
radiusAxis: {
type: 'category',
data: ['AAA'],
axisLine: {
show: false
},
axisTick: {
show: false
},
splitLine: {
show: false
},
axisLabel: {
show: false
}
},
polar: {
radius: ['100%', '60%'],
center: ['50%', '50%'],
},
series: [
{
type: 'bar',
data: [data[0]],
stack: 'A',
coordinateSystem: 'polar',
},
{
type: 'bar',
data: [data[1]],
stack: 'B',
coordinateSystem: 'polar',
},
{
type: 'bar',
data: [100-data[0]],
stack: 'A',
coordinateSystem: 'polar',
},
{
type: 'bar',
data: [100-data[1]],
stack: 'B',
coordinateSystem: 'polar',
}
]
};
myChart.clear();
myChart.setOption(option, true);
}
function homePage() {
$('.jump-area').hide();
$('.sub-region').hide();
$('.homePage').show();
}
function jumpArea(el) {
$('.homePage').hide();
$('.sub-region').hide();
$('.jump-area').show();
$('.'+el).show();
}
//添加千分位符合
function toThousands(num) {
var nums =num;
var re=/\d{1,3}(?=(\d{3})+$)/g;
var n1=0;
if(nums!=null && nums!='' && nums!=undefined){
n1=nums.toString().replace(/^(\d+)((\.\d+)?)$/,function(s,s1,s2){return s1.replace(re,"$&,")+s2;});
}
return n1;
}
</script>
</head>
<body>
<div class="whole-body content-wrapper-bg-darkblue">
<!-- BEGIN CONTAINER -->
<input type="hidden" name="jsp_id" id="jsp_id" value="evaluate_homepage">
<div class="col-xs-12 text-center font-size-36 font-color-white margin-bottom-55">
<label class="col-xs-2 font-size-50 title-height">调度仿真敏捷评估</label>
<span class="col-xs-3 title-height line-height-2-3">开始运行时间：<span class="font-color-lightBlue">2022-1-1 13:30</span></span>
<span class="col-xs-2 title-height line-height-2-3">连续运行时间：<span class="font-color-lightBlue">530小时</span></span>
<span class="col-xs-4 title-height line-height-2-3">当前指令执行情况：<span class="font-color-lightBlue">完成计算 推送指令 自动执行</span></span>
<div class="col-xs-1 title-height line-height-2-3" ><div class="homePage-btn jump-area" style="display:none" onclick="homePage()">主页</div></div>
</div>
<div class="col-xs-12 text-center font-size-36 font-color-white">
<div class="content-left text-left padding-top-27">
<div class="row">
<div class="col-xs-12">
<div class="polarBarLegend">
<span class="col-xs-12"><div class="col-xs-7 line-height-2-3">生产负荷率</div><div class="col-xs-5 font-color-blue"><span class="font-size-60">87</span>%</div></span>
<span class="col-xs-12"><div class="col-xs-7 line-height-2-3">自动执行率</div><div class="col-xs-5 font-color-green"><span class="font-size-60">90</span>%</div></span>
</div>
<div class="polarBar" id="polarBar"></div>
</div>
</div>
<div class="row padding-top-90 margin-bottom-36">
<div class="col-xs-4 margin-bottom-25">方案推送</div>
<div class="col-xs-4 margin-bottom-25">压力调整</div>
<div class="col-xs-4 margin-bottom-25">总响应时间</div>
<div class="col-xs-4 font-color-lightBlue"><span class="font-size-60 scheme_push_time">1</span>min</div>
<div class="col-xs-4 font-color-blue font-size-60"><span class="font-size-60 pressure_adjustment_time">2</span>min</div>
<div class="col-xs-4 font-color-lightBlue font-size-60"><span class="font-size-60 total_response_time">3</span>min</div>
</div>
<div class="row">
<div class="col-xs-12">
<div class="progress_bar" id="progress_bar"></div>
</div>
</div>
<div class="row padding-top-90 margin-bottom-75">
<div class="col-xs-6 margin-bottom-25">水龄</div>
<div class="col-xs-6 margin-bottom-25">调度精准性</div>
<div class="col-xs-6 font-color-lightBlue"><span class="font-size-60 water_age">3</span>小时</div>
<div class="col-xs-6 font-color-lightBlue"><span class="font-size-60 scheduling_accuracy">98</span>%</div>
</div>
<div class="row text-center jump-area" style="display:none">
<div class="col-xs-4 margin-bottom-75 cursor-pointer" onclick="jumpArea('instructions')" >
<div class="col-xs-12">
<img class="img-icon" alt="调度指令" src="<%=request.getContextPath()%>/IMG/evaluate/instructions.png">
</div>
<span class="col-xs-12 font-size-40">调度指令</span>
</div>
<div class="col-xs-4 margin-bottom-75 cursor-pointer" onclick="jumpArea('pressure')" >
<div class="col-xs-12">
<img class="img-icon" alt="调度压力" src="<%=request.getContextPath()%>/IMG/evaluate/pressure.png">
</div>
<span class="col-xs-12 font-size-40">调度压力</span>
</div>
<div class="col-xs-4 margin-bottom-75 cursor-pointer" onclick="jumpArea('pump')">
<div class="col-xs-12">
<img class="img-icon" alt="机泵状态" src="<%=request.getContextPath()%>/IMG/evaluate/pump.png">
</div>
<span class="col-xs-12 font-size-40">机泵状态</span>
</div>
<div class="col-xs-4 margin-bottom-75 cursor-pointer" onclick="jumpArea('reservoir')">
<div class="col-xs-12">
<img class="img-icon" alt="水库控制评估" src="<%=request.getContextPath()%>/IMG/evaluate/reservoir.png">
</div>
<span class="col-xs-12 font-size-40">水库控制评估</span>
</div>
<div class="col-xs-4 margin-bottom-75 cursor-pointer" onclick="jumpArea('production')">
<div class="col-xs-12">
<img class="img-icon" alt="产线分配评估" src="<%=request.getContextPath()%>/IMG/evaluate/production.png">
</div>
<span class="col-xs-12 font-size-40">产线分配评估</span>
</div>
<div class="col-xs-4 margin-bottom-75 cursor-pointer" onclick="jumpArea('rawwater')">
<div class="col-xs-12">
<img class="img-icon" alt="原水调度评估" src="<%=request.getContextPath()%>/IMG/evaluate/rawwater.png">
</div>
<span class="col-xs-12 font-size-40">原水调度评估</span>
</div>
</div>
</div>
<div class="content-right">
<div class="col-xs-12 homePage">
<div class="col-xs-12 content-right-subject padding-topbottom-35 content-bg-darkblue cursor-pointer" onclick="jumpArea('instructions')" >
<div class="col-xs-2">
<div class="col-xs-12">
<img class="img-icon" alt="调度指令" src="<%=request.getContextPath()%>/IMG/evaluate/instructions.png">
</div>
<span class="col-xs-12 font-size-40">调度指令</span>
</div>
<div class="col-xs-10">
<div class="col-xs-2 border-right">
<div class="col-xs-12">今日累计</div>
<div class="col-xs-12 font-color-lightBlue"><span class="font-size-60 cumulative_times_today">50</span>次</div>
</div>
<div class="col-xs-2">
<div class="col-xs-12">自动执行</div>
<div class="col-xs-12 font-color-lightBlue"><span class="font-size-60 automatic_execution_times">45</span>次</div>
</div>
<div class="col-xs-2 border-right">
<div class="col-xs-12">执行率</div>
<div class="col-xs-12 font-color-lightBlue"><span class="font-size-60 implementation_rate">90</span>%</div>
</div>
<div class="col-xs-2">
<div class="col-xs-12">手动调整</div>
<div class="col-xs-12 font-color-lightBlue"><span class="font-size-60 manual_adjustment_times">3</span>次</div>
</div>
<div class="col-xs-2 border-right">
<div class="col-xs-12">调整率</div>
<div class="col-xs-12 font-color-lightBlue"><span class="font-size-60 adjustment_rate">6</span>%</div>
</div>
<div class="col-xs-2">
<div class="col-xs-12">失败次数</div>
<div class="col-xs-12 font-color-lightBlue"><span class="font-size-60 number_of_failures">2</span></div>
</div>
</div>
</div>
<div class="col-xs-12 content-right-subject padding-topbottom-35 cursor-pointer" onclick="jumpArea('pressure')">
<div class="col-xs-2">
<div class="col-xs-12">
<img class="img-icon" alt="调度压力" src="<%=request.getContextPath()%>/IMG/evaluate/pressure.png">
</div>
<span class="col-xs-12 font-size-40">调度压力</span>
</div>
<div class="col-xs-10">
<div class="col-xs-2">
<div class="col-xs-12">当前压力值</div>
<div class="col-xs-12 font-color-lightBlue"><span class="font-size-60 current_pressure_value">40</span>kPa</div>
</div>
<div class="col-xs-2">
<div class="col-xs-12">压力变化率</div>
<div class="col-xs-12 font-color-lightBlue"><span class="font-size-60 pressure_change_rate">12</span>%</div>
</div>
</div>
</div>
<div class="col-xs-12 content-right-subject padding-topbottom-35 content-bg-darkblue cursor-pointer" onclick="jumpArea('pump')">
<div class="col-xs-2">
<div class="col-xs-12">
<img class="img-icon" alt="机泵状态" src="<%=request.getContextPath()%>/IMG/evaluate/pump.png">
</div>
<span class="col-xs-12 font-size-40">机泵状态</span>
</div>
<div class="col-xs-10">
<div class="col-xs-1">
<div class="col-xs-12">1#</div>
<div class="col-xs-12 pump_status_1_img">
<img class="img-pump" alt="1#机泵" src="<%=request.getContextPath()%>/IMG/evaluate/pump_grey.png">
</div>
</div>
<div class="col-xs-1">
<div class="col-xs-12">2#</div>
<div class="col-xs-12 pump_status_2_img">
<img class="img-pump" alt="2#机泵" src="<%=request.getContextPath()%>/IMG/evaluate/pump_grey.png">
</div>
</div>
<div class="col-xs-1">
<div class="col-xs-12">3#</div>
<div class="col-xs-12 pump_status_3_img">
<img class="img-pump" alt="3#机泵" src="<%=request.getContextPath()%>/IMG/evaluate/pump_grey.png">
</div>
</div>
<div class="col-xs-1">
<div class="col-xs-12">4#</div>
<div class="col-xs-12 pump_status_4_img">
<img class="img-pump" alt="4#机泵" src="<%=request.getContextPath()%>/IMG/evaluate/pump_red.png">
</div>
</div>
<div class="col-xs-1">
<div class="col-xs-12">5#</div>
<div class="col-xs-12 pump_status_5_img">
<img class="img-pump" alt="5#机泵" src="<%=request.getContextPath()%>/IMG/evaluate/pump_red.png">
</div>
</div>
<div class="col-xs-1">
<div class="col-xs-12">6#</div>
<div class="col-xs-12 pump_status_6_img">
<img class="img-pump" alt="6#机泵" src="<%=request.getContextPath()%>/IMG/evaluate/pump_green.png">
</div>
</div>
<div class="col-xs-1">
<div class="col-xs-12">7#</div>
<div class="col-xs-12 pump_status_7_img">
<img class="img-pump" alt="7#机泵" src="<%=request.getContextPath()%>/IMG/evaluate/pump_green.png">
</div>
</div>
<div class="col-xs-1">
<div class="col-xs-12">8#</div>
<div class="col-xs-12 pump_status_8_img">
<img class="img-pump" alt="8#机泵" src="<%=request.getContextPath()%>/IMG/evaluate/pump_red.png">
</div>
</div>
<div class="col-xs-1">
<div class="col-xs-12">9#</div>
<div class="col-xs-12">
<img class="img-pump pump_status_9_img" alt="9#机泵" src="<%=request.getContextPath()%>/IMG/evaluate/pump_green.png">
</div>
</div>
<div class="col-xs-1">
<div class="col-xs-12">10#</div>
<div class="col-xs-12 pump_status_10_img">
<img class="img-pump" alt="10#机泵" src="<%=request.getContextPath()%>/IMG/evaluate/pump_green.png">
</div>
</div>
<div class="col-xs-2">
<div class="col-xs-12">健康状况评估</div>
<div class="col-xs-12 font-color-lightBlue"><span class="font-size-60">优</span></div>
</div>
</div>
</div>
<div class="col-xs-12 content-right-subject padding-topbottom-35 cursor-pointer" onclick="jumpArea('reservoir')">
<div class="col-xs-2">
<div class="col-xs-12">
<img class="img-icon" alt="水库控制评估" src="<%=request.getContextPath()%>/IMG/evaluate/reservoir.png">
</div>
<span class="col-xs-12 font-size-40">水库控制评估</span>
</div>
<div class="col-xs-10">
<div class="col-xs-3">
<div class="col-xs-12">能效模式本月累计运行</div>
<div class="col-xs-12 font-color-lightBlue"><span class="font-size-60 energy_efficiency_monthly_cumulative_operation">40</span>min</div>
</div>
<div class="col-xs-1-5 border-right">
<div class="col-xs-12">能耗节约</div>
<div class="col-xs-12 font-color-lightBlue"><span class="font-size-60 energy_efficiency_energy_saving">50</span>kwh</div>
</div>
<div class="col-xs-3">
<div class="col-xs-12">稳态模式本月累计运行</div>
<div class="col-xs-12 font-color-lightBlue"><span class="font-size-60 steady_state_monthly_cumulative_operation">40</span>min</div>
</div>
<div class="col-xs-1-5 border-right">
<div class="col-xs-12">能耗节约</div>
<div class="col-xs-12 font-color-lightBlue"><span class="font-size-60 steady_state_energy_saving">50</span>kwh</div>
</div>
<div class="col-xs-3">
<div class="col-xs-12">累计应急供水时长</div>
<div class="col-xs-12 font-color-lightBlue"><span class="font-size-60 cumulative_duration_of_emergency_water_supply">50</span>min</div>
</div>
</div>
</div>
<div class="col-xs-12 content-right-subject padding-topbottom-35 content-bg-darkblue cursor-pointer" onclick="jumpArea('production')" >
<div class="col-xs-2">
<div class="col-xs-12">
<img class="img-icon" alt="产线分配评估" src="<%=request.getContextPath()%>/IMG/evaluate/production.png">
</div>
<span class="col-xs-12 font-size-40">产线分配评估</span>
</div>
<div class="col-xs-10">
<div class="col-xs-12">
<div class="col-xs-2">
<div class="col-xs-12">1#实时处理水量</div>
<div class="col-xs-12 font-color-lightBlue"><span class="font-size-60 real_time_water_treatment_1">40</span>m³/h</div>
</div>
<div class="col-xs-1-5">
<div class="col-xs-12">运行负荷</div>
<div class="col-xs-12 font-color-lightBlue"><span class="font-size-60 operating_load_1">40</span>%</div>
</div>
<div class="col-xs-1-5 border-right">
<div class="col-xs-12">运行状态</div>
<div class="col-xs-12 font-color-lightBlue"><span class="font-size-60 running_state_1_text">运行</span></div>
</div>
<div class="col-xs-2">
<div class="col-xs-12">2#实时处理水量</div>
<div class="col-xs-12 font-color-lightBlue"><span class="font-size-60 real_time_water_treatment_2">40</span>m³/h</div>
</div>
<div class="col-xs-1-5">
<div class="col-xs-12">运行负荷</div>
<div class="col-xs-12 font-color-lightBlue"><span class="font-size-60 operating_load_2">40</span>%</div>
</div>
<div class="col-xs-1-5 border-right">
<div class="col-xs-12">运行状态</div>
<div class="col-xs-12 font-color-lightBlue"><span class="font-size-60 running_state_2_text">运行</span></div>
</div>
</div>
<div class="col-xs-12">
<div class="col-xs-2">
<div class="col-xs-12">3#实时处理水量</div>
<div class="col-xs-12 font-color-lightBlue"><span class="font-size-60 real_time_water_treatment_3">40</span>m³/h</div>
</div>
<div class="col-xs-1-5">
<div class="col-xs-12">运行负荷</div>
<div class="col-xs-12 font-color-lightBlue"><span class="font-size-60 operating_load_3">40</span>%</div>
</div>
<div class="col-xs-1-5 border-right">
<div class="col-xs-12">运行状态</div>
<div class="col-xs-12 font-color-lightBlue"><span class="font-size-60 running_state_3_text">运行</span></div>
</div>
<div class="col-xs-2">
<div class="col-xs-12">4#实时处理水量</div>
<div class="col-xs-12 font-color-lightBlue"><span class="font-size-60 real_time_water_treatment_4">40</span>m³/h</div>
</div>
<div class="col-xs-1-5">
<div class="col-xs-12">运行负荷</div>
<div class="col-xs-12 font-color-lightBlue"><span class="font-size-60 operating_load_4">40</span>%</div>
</div>
<div class="col-xs-1-5 border-right">
<div class="col-xs-12">运行状态</div>
<div class="col-xs-12 font-color-lightBlue"><span class="font-size-60 running_state_4_text">运行</span></div>
</div>
</div>
</div>
</div>
<div class="col-xs-12 content-right-subject padding-topbottom-35 cursor-pointer" onclick="jumpArea('rawwater')" >
<div class="col-xs-2">
<div class="col-xs-12">
<img class="img-icon" alt="原水调度评估" src="<%=request.getContextPath()%>/IMG/evaluate/rawwater.png">
</div>
<span class="col-xs-12 font-size-40">原水调度评估</span>
</div>
<div class="col-xs-10">
<div class="col-xs-2">
<div class="col-xs-12">今日累计调整</div>
<div class="col-xs-12 font-color-lightBlue"><span class="font-size-60 raw_water_cumulative_adjustment_times_today">50</span>次</div>
</div>
<div class="col-xs-2">
<div class="col-xs-12">自动调整</div>
<div class="col-xs-12 font-color-lightBlue"><span class="font-size-60 raw_water_automatic_adjustment_times">40</span>次</div>
</div>
<div class="col-xs-2">
<div class="col-xs-12">人工调整</div>
<div class="col-xs-12 font-color-lightBlue"><span class="font-size-60 raw_water_manual_adjustment_times">10</span>次</div>
</div>
<div class="col-xs-2">
<div class="col-xs-12">今日累计调整水量</div>
<div class="col-xs-12 font-color-lightBlue"><span class="font-size-60 accumulated_adjusted_water_volume_today">10</span>万吨</div>
</div>
</div>
</div>
</div>
<div class="col-xs-12 sub-region instructions" style="display:none;">
<div class="col-xs-12 content-right-subject padding-topbottom-35 content-bg-darkblue">
<div class="col-xs-2">
<div class="col-xs-12">
<img class="img-icon" alt="调度指令" src="<%=request.getContextPath()%>/IMG/evaluate/instructions.png">
</div>
<span class="col-xs-12 font-size-40">调度指令</span>
</div>
<div class="col-xs-10">
<div class="col-xs-2 border-right">
<div class="col-xs-12">今日累计</div>
<div class="col-xs-12 font-color-lightBlue"><span class="font-size-60 cumulative_times_today">50</span>次</div>
</div>
<div class="col-xs-2">
<div class="col-xs-12">自动执行</div>
<div class="col-xs-12 font-color-lightBlue"><span class="font-size-60 automatic_execution_times">45</span>次</div>
</div>
<div class="col-xs-2 border-right">
<div class="col-xs-12">执行率</div>
<div class="col-xs-12 font-color-lightBlue"><span class="font-size-60 implementation_rate">90</span>%</div>
</div>
<div class="col-xs-2">
<div class="col-xs-12">手动调整</div>
<div class="col-xs-12 font-color-lightBlue"><span class="font-size-60 manual_adjustment_times">3</span>次</div>
</div>
<div class="col-xs-2 border-right">
<div class="col-xs-12">调整率</div>
<div class="col-xs-12 font-color-lightBlue"><span class="font-size-60 adjustment_rate">6</span>%</div>
</div>
<div class="col-xs-2">
<div class="col-xs-12">失败次数</div>
<div class="col-xs-12 font-color-lightBlue"><span class="font-size-60 number_of_failures">2</span></div>
</div>
</div>
</div>
<div class="col-xs-12 padding-topbottom-35">
<div class="instructions-line" id="instructions-line"></div>
</div>
<div class="col-xs-12 padding-topbottom-35">
<table class="table text-center">
<tr><th>序号</th><th>指令内容</th><th>发布时间</th><th>完成时间</th><th>持续时间</th></tr>
<tr>
<td>1</td>
<td>水龄：从原水到出厂，在每个工艺段的停留时间。清水库水 龄。模型计算</td>
<td>2022-01-13 13:23</td>
<td>2022-01-13 13:43</td>
<td>20分钟</td>
</tr>
</table>
</div>
</div>
<div class="col-xs-12 sub-region pressure" style="display:none;">
<div class="col-xs-12 content-right-subject padding-topbottom-35 content-bg-darkblue">
<div class="col-xs-2">
<div class="col-xs-12">
<img class="img-icon" alt="调度压力" src="<%=request.getContextPath()%>/IMG/evaluate/pressure.png">
</div>
<span class="col-xs-12 font-size-40">调度压力</span>
</div>
<div class="col-xs-10">
<div class="col-xs-2">
<div class="col-xs-12">当前压力值</div>
<div class="col-xs-12 font-color-lightBlue"><span class="font-size-60 current_pressure_value">40</span>kPa</div>
</div>
<div class="col-xs-2">
<div class="col-xs-12">压力变化率</div>
<div class="col-xs-12 font-color-lightBlue"><span class="font-size-60 pressure_change_rate">12</span>%</div>
</div>
</div>
</div>
<div class="col-xs-12 padding-topbottom-35">
<div class="col-xs-6"><div class="pressure-line" id="pressure-cumulative"></div></div>
<div class="col-xs-6"><div class="pressure-line" id="pressure-actual"></div></div>
</div>
<div class="col-xs-12 padding-topbottom-35">
<div class="col-xs-6"><div class="pressure-line" id="pressure-dispatch"></div></div>
<div class="col-xs-6"></div>
</div>
</div>
<div class="col-xs-12 sub-region pump" style="display:none;">
<div class="col-xs-12 content-right-subject padding-topbottom-35 content-bg-darkblue">
<div class="col-xs-2">
<div class="col-xs-12">
<img class="img-icon" alt="机泵状态" src="<%=request.getContextPath()%>/IMG/evaluate/pump.png">
</div>
<span class="col-xs-12 font-size-40">机泵状态</span>
</div>
<div class="col-xs-10">
<div class="col-xs-1">
<div class="col-xs-12">1#</div>
<div class="col-xs-12 pump_status_1_img">
<img class="img-pump" alt="1#机泵" src="<%=request.getContextPath()%>/IMG/evaluate/pump_grey.png">
</div>
</div>
<div class="col-xs-1">
<div class="col-xs-12">2#</div>
<div class="col-xs-12 pump_status_2_img">
<img class="img-pump" alt="2#机泵" src="<%=request.getContextPath()%>/IMG/evaluate/pump_grey.png">
</div>
</div>
<div class="col-xs-1">
<div class="col-xs-12">3#</div>
<div class="col-xs-12 pump_status_3_img">
<img class="img-pump" alt="3#机泵" src="<%=request.getContextPath()%>/IMG/evaluate/pump_grey.png">
</div>
</div>
<div class="col-xs-1">
<div class="col-xs-12">4#</div>
<div class="col-xs-12 pump_status_4_img">
<img class="img-pump" alt="4#机泵" src="<%=request.getContextPath()%>/IMG/evaluate/pump_red.png">
</div>
</div>
<div class="col-xs-1">
<div class="col-xs-12">5#</div>
<div class="col-xs-12 pump_status_5_img">
<img class="img-pump" alt="5#机泵" src="<%=request.getContextPath()%>/IMG/evaluate/pump_red.png">
</div>
</div>
<div class="col-xs-1">
<div class="col-xs-12">6#</div>
<div class="col-xs-12 pump_status_6_img">
<img class="img-pump" alt="6#机泵" src="<%=request.getContextPath()%>/IMG/evaluate/pump_green.png">
</div>
</div>
<div class="col-xs-1">
<div class="col-xs-12">7#</div>
<div class="col-xs-12 pump_status_7_img">
<img class="img-pump" alt="7#机泵" src="<%=request.getContextPath()%>/IMG/evaluate/pump_green.png">
</div>
</div>
<div class="col-xs-1">
<div class="col-xs-12">8#</div>
<div class="col-xs-12 pump_status_8_img">
<img class="img-pump" alt="8#机泵" src="<%=request.getContextPath()%>/IMG/evaluate/pump_red.png">
</div>
</div>
<div class="col-xs-1">
<div class="col-xs-12">9#</div>
<div class="col-xs-12 pump_status_9_img">
<img class="img-pump" alt="9#机泵" src="<%=request.getContextPath()%>/IMG/evaluate/pump_green.png">
</div>
</div>
<div class="col-xs-1">
<div class="col-xs-12">10#</div>
<div class="col-xs-12 pump_status_10_img">
<img class="img-pump" alt="10#机泵" src="<%=request.getContextPath()%>/IMG/evaluate/pump_green.png">
</div>
</div>
<div class="col-xs-2">
<div class="col-xs-12">健康状况评估</div>
<div class="col-xs-12 font-color-lightBlue"><span class="font-size-60">优</span></div>
</div>
</div>
</div>
<div class="col-xs-12 padding-topbottom-35">
<div class="col-xs-2">
<span class="col-xs-12">运行负荷</span>
</div>
<div class="col-xs-10">
<div class="col-xs-1 pump_operating_load_1">0</div>
<div class="col-xs-1 pump_operating_load_2">0</div>
<div class="col-xs-1 pump_operating_load_3">0</div>
<div class="col-xs-1 pump_operating_load_4">88</div>
<div class="col-xs-1 pump_operating_load_5">88</div>
<div class="col-xs-1 pump_operating_load_6">0</div>
<div class="col-xs-1 pump_operating_load_7">0</div>
<div class="col-xs-1 pump_operating_load_8">87</div>
<div class="col-xs-1 pump_operating_load_9">0</div>
<div class="col-xs-1 pump_operating_load_10">0</div>
</div>
</div>
<div class="col-xs-12 padding-topbottom-35">
<div class="col-xs-2">
<span class="col-xs-12">累计运行时长（h）</span>
</div>
<div class="col-xs-10">
<div class="col-xs-1 pump_cumulative_running_time_1">23</div>
<div class="col-xs-1 pump_cumulative_running_time_2">19</div>
<div class="col-xs-1 pump_cumulative_running_time_3">23</div>
<div class="col-xs-1 pump_cumulative_running_time_4">23</div>
<div class="col-xs-1 pump_cumulative_running_time_5">42</div>
<div class="col-xs-1 pump_cumulative_running_time_6">23</div>
<div class="col-xs-1 pump_cumulative_running_time_7">35</div>
<div class="col-xs-1 pump_cumulative_running_time_8">23</div>
<div class="col-xs-1 pump_cumulative_running_time_9">23</div>
<div class="col-xs-1 pump_cumulative_running_time_10">56</div>
</div>
</div>
<div class="col-xs-12 padding-topbottom-35">
<div class="col-xs-2">
<span class="col-xs-12">开停次数（次）</span>
</div>
<div class="col-xs-10">
<div class="col-xs-1 pump_start_stop_times_1">1</div>
<div class="col-xs-1 pump_start_stop_times_2">1</div>
<div class="col-xs-1 pump_start_stop_times_3">1</div>
<div class="col-xs-1 pump_start_stop_times_4">1</div>
<div class="col-xs-1 pump_start_stop_times_5">1</div>
<div class="col-xs-1 pump_start_stop_times_6">1</div>
<div class="col-xs-1 pump_start_stop_times_7">1</div>
<div class="col-xs-1 pump_start_stop_times_8">1</div>
<div class="col-xs-1 pump_start_stop_times_9">1</div>
<div class="col-xs-1 pump_start_stop_times_10">1</div>
</div>
</div>
<div class="col-xs-12 padding-topbottom-35">
<div class="col-xs-2">
<span class="col-xs-12">健康状态评估</span>
</div>
<div class="col-xs-10">
<div class="col-xs-1">优</div>
<div class="col-xs-1">优</div>
<div class="col-xs-1">优</div>
<div class="col-xs-1">优</div>
<div class="col-xs-1">优</div>
<div class="col-xs-1">优</div>
<div class="col-xs-1">优</div>
<div class="col-xs-1">优</div>
<div class="col-xs-1">优</div>
<div class="col-xs-1">优</div>
</div>
</div>
<!-- <div class="col-xs-12 padding-topbottom-35">
<div class="col-xs-2">
<span class="col-xs-12">是否均匀开泵</span>
</div>
<div class="col-xs-10">
<div class="col-xs-1">是</div>
<div class="col-xs-1">是</div>
<div class="col-xs-1">是</div>
<div class="col-xs-1">是</div>
<div class="col-xs-1">是</div>
<div class="col-xs-1">是</div>
<div class="col-xs-1">是</div>
<div class="col-xs-1">是</div>
<div class="col-xs-1">是</div>
<div class="col-xs-1">是</div>
</div>
</div> -->
</div>
<div class="col-xs-12 sub-region reservoir" style="display:none;">
<div class="col-xs-12 content-right-subject padding-topbottom-35 content-bg-darkblue">
<div class="col-xs-2">
<div class="col-xs-12">
<img class="img-icon" alt="水库控制评估" src="<%=request.getContextPath()%>/IMG/evaluate/reservoir.png">
</div>
<span class="col-xs-12 font-size-40">水库控制评估</span>
</div>
<div class="col-xs-10">
<div class="col-xs-3">
<div class="col-xs-12">能效模式本月累计运行</div>
<div class="col-xs-12 font-color-lightBlue"><span class="font-size-60 energy_efficiency_monthly_cumulative_operation">40</span>min</div>
</div>
<div class="col-xs-1-5 border-right">
<div class="col-xs-12">能耗节约</div>
<div class="col-xs-12 font-color-lightBlue"><span class="font-size-60 energy_efficiency_energy_saving">50</span>kwh</div>
</div>
<div class="col-xs-3">
<div class="col-xs-12">稳态模式本月累计运行</div>
<div class="col-xs-12 font-color-lightBlue"><span class="font-size-60 steady_state_monthly_cumulative_operation">40</span>min</div>
</div>
<div class="col-xs-1-5 border-right">
<div class="col-xs-12">能耗节约</div>
<div class="col-xs-12 font-color-lightBlue"><span class="font-size-60 steady_state_energy_saving">50</span>kwh</div>
</div>
<div class="col-xs-3">
<div class="col-xs-12">累计应急供水时长</div>
<div class="col-xs-12 font-color-lightBlue"><span class="font-size-60 cumulative_duration_of_emergency_water_supply">50</span>min</div>
</div>
</div>
</div>
<div class="col-xs-12 padding-topbottom-35">
<div class="col-xs-6"><div class="pressure-line" id="reservoir-energy"></div></div>
<div class="col-xs-6"><div class="pressure-line" id="reservoir-steady"></div></div>
</div>
</div>
<div class="col-xs-12 sub-region production" style="display:none;">
<div class="col-xs-12 content-right-subject padding-topbottom-35 content-bg-darkblue">
<div class="col-xs-2">
<div class="col-xs-12">
<img class="img-icon" alt="产线分配评估" src="<%=request.getContextPath()%>/IMG/evaluate/production.png">
</div>
<span class="col-xs-12 font-size-40">产线分配评估</span>
</div>
<div class="col-xs-10">
<div class="col-xs-3">
<div class="col-xs-12">1#产线运行状态</div>
<div class="col-xs-12 font-color-lightBlue"><span class="font-size-60 running_state_1_text">运行</span></div>
</div>
<div class="col-xs-3">
<div class="col-xs-12">2#产线运行状态</div>
<div class="col-xs-12 font-color-lightBlue"><span class="font-size-60 running_state_2_text">运行</span></div>
</div>
<div class="col-xs-3">
<div class="col-xs-12">3#产线运行状态</div>
<div class="col-xs-12 font-color-lightBlue"><span class="font-size-60 running_state_3_text">运行</span></div>
</div>
<div class="col-xs-3">
<div class="col-xs-12">4#产线运行状态</div>
<div class="col-xs-12 font-color-lightBlue"><span class="font-size-60 running_state_4_text">运行</span></div>
</div>
</div>
</div>
<div class="col-xs-12 padding-topbottom-35">
<div class="col-xs-2">
<span class="col-xs-12">实时处理水量（m³/h）</span>
</div>
<div class="col-xs-10">
<div class="col-xs-3 real_time_water_treatment_1"></div>
<div class="col-xs-3 real_time_water_treatment_2"></div>
<div class="col-xs-3 real_time_water_treatment_3"></div>
<div class="col-xs-3 real_time_water_treatment_4"></div>
</div>
</div>
<div class="col-xs-12 padding-topbottom-35">
<div class="col-xs-2">
<span class="col-xs-12">运行负荷（%）</span>
</div>
<div class="col-xs-10">
<div class="col-xs-3 operating_load_1"></div>
<div class="col-xs-3 operating_load_2"></div>
<div class="col-xs-3 operating_load_3"></div>
<div class="col-xs-3 operating_load_4"></div>
</div>
</div>
<div class="col-xs-12 padding-topbottom-35">
<div class="col-xs-2">
<span class="col-xs-12">自动调整（次）</span>
</div>
<div class="col-xs-10">
<div class="col-xs-3 production_line_1_automatic_adjustment_times"></div>
<div class="col-xs-3 production_line_2_automatic_adjustment_times"></div>
<div class="col-xs-3 production_line_3_automatic_adjustment_times"></div>
<div class="col-xs-3 production_line_4_automatic_adjustment_times"></div>
</div>
</div>
<div class="col-xs-12 padding-topbottom-35">
<div class="col-xs-2">
<span class="col-xs-12">手动调整（次）</span>
</div>
<div class="col-xs-10">
<div class="col-xs-3 production_line_1_automatic_adjustment_times"></div>
<div class="col-xs-3 production_line_2_automatic_adjustment_times"></div>
<div class="col-xs-3 production_line_3_automatic_adjustment_times"></div>
<div class="col-xs-3 production_line_4_automatic_adjustment_times"></div>
</div>
</div>
<div class="col-xs-12 padding-topbottom-35">
<div class="col-xs-2">
<span class="col-xs-12">能效对比</span>
</div>
<div class="col-xs-10">
<div class="col-xs-3 production_line_1_energy_efficiency_comparison"></div>
<div class="col-xs-3 production_line_2_energy_efficiency_comparison"></div>
<div class="col-xs-3 production_line_3_energy_efficiency_comparison"></div>
<div class="col-xs-3 production_line_4_energy_efficiency_comparison"></div>
</div>
</div>
</div>
<div class="col-xs-12 sub-region rawwater" style="display:none;">
<div class="col-xs-12 content-right-subject padding-topbottom-35 content-bg-darkblue">
<div class="col-xs-2">
<div class="col-xs-12">
<img class="img-icon" alt="原水调度评估" src="<%=request.getContextPath()%>/IMG/evaluate/rawwater.png">
</div>
<span class="col-xs-12 font-size-40">原水调度评估</span>
</div>
<div class="col-xs-10">
<div class="col-xs-2">
<div class="col-xs-12">今日累计调整</div>
<div class="col-xs-12 font-color-lightBlue"><span class="font-size-60 raw_water_cumulative_adjustment_times_today">50</span>次</div>
</div>
<div class="col-xs-2">
<div class="col-xs-12">自动调整</div>
<div class="col-xs-12 font-color-lightBlue"><span class="font-size-60 raw_water_automatic_adjustment_times">40</span>次</div>
</div>
<div class="col-xs-2">
<div class="col-xs-12">人工调整</div>
<div class="col-xs-12 font-color-lightBlue"><span class="font-size-60 raw_water_manual_adjustment_times">10</span>次</div>
</div>
<div class="col-xs-2">
<div class="col-xs-12">今日累计调整水量</div>
<div class="col-xs-12 font-color-lightBlue"><span class="font-size-60 accumulated_adjusted_water_volume_today">10</span>万吨</div>
</div>
</div>
</div>
<div class="col-xs-12 padding-topbottom-35">
<div class="rawwater-line" id="rawwater-water"></div>
</div>
</div>
</div>
</div>
</div>
</body>
</html>
Reference in New Issue Copy Permalink