1675 lines
64 KiB
Plaintext
1675 lines
64 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>
|
|
<!-- 开关按钮-->
|
|
<link rel="stylesheet" href="<%=request.getContextPath()%>/node_modules/bootstrap-switch/dist/css/bootstrap3/bootstrap-switch.min.css"/>
|
|
<script type="text/javascript" src="<%=request.getContextPath()%>/node_modules/bootstrap-switch/dist/js/bootstrap-switch.min.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;
|
|
}
|
|
.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;
|
|
}
|
|
|
|
.line-small,.pie{
|
|
height: 222px;
|
|
width: 390px;
|
|
}
|
|
.pie-small{
|
|
height: 250px;
|
|
width: 315px;
|
|
}
|
|
.barPolar{
|
|
height: 160px;
|
|
}
|
|
.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;
|
|
}
|
|
.table>tbody>tr>td, .table>tbody>tr>th,
|
|
.table>tfoot>tr>td, .table>tfoot>tr>th,
|
|
.table>thead>tr>td, .table>thead>tr>th {
|
|
padding: 5px;
|
|
}
|
|
.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;
|
|
}
|
|
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;
|
|
}
|
|
.div-content .col-lg-3,
|
|
.div-content .col-lg-4,
|
|
.div-content .col-lg-5{
|
|
padding-left: 5px;
|
|
padding-right: 5px;
|
|
}
|
|
.div_block{
|
|
width: 100%;
|
|
height: 80px;
|
|
border-radius: 4px;
|
|
margin-bottom: 10px;
|
|
color: #ffffff;
|
|
padding: 5px 10px;
|
|
}
|
|
.div_block>div{
|
|
height: 50%;
|
|
line-height: 2;
|
|
font-size: 15px;
|
|
}
|
|
.div_blue{
|
|
background: -webkit-linear-gradient(206.565051177078deg, rgba(64, 188, 255, 1) 0%, rgba(64, 125, 255, 1) 100%);
|
|
background: -moz-linear-gradient(243.434948822922deg, rgba(64, 188, 255, 1) 0%, rgba(64, 125, 255, 1) 100%);
|
|
background: linear-gradient(243.434948822922deg, rgba(64, 188, 255, 1) 0%, rgba(64, 125, 255, 1) 100%);
|
|
}
|
|
.div_darkblue{
|
|
background: -webkit-linear-gradient(206.565051177078deg, rgba(23,144,255,1) 0%, rgba(39,105,202, 1) 100%);
|
|
background: -moz-linear-gradient(243.434948822922deg, rgba(23,144,255,1) 0%, rgba(39,105,202, 1) 100%);
|
|
background: linear-gradient(243.434948822922deg, rgba(23,144,255,1) 0%, rgba(39,105,202, 1) 100%);
|
|
}
|
|
.div_lightblue{
|
|
background: -webkit-linear-gradient(206.565051177078deg, rgba(23,199,255, 1) 0%, rgba(0,229,255, 1) 100%);
|
|
background: -moz-linear-gradient(243.434948822922deg, rgba(23,199,255, 1) 0%, rgba(0,229,255, 1) 100%);
|
|
background: linear-gradient(243.434948822922deg, rgba(23,199,255, 1) 0%, rgba(0,229,255, 1) 100%);
|
|
}
|
|
.div_green{
|
|
background: -webkit-linear-gradient(206.565051177078deg, rgba(43, 227, 162, 1) 0%, rgba(17, 164, 32, 1) 100%);
|
|
background: -moz-linear-gradient(243.434948822922deg, rgba(43, 227, 162, 1) 0%, rgba(17, 164, 32, 1) 100%);
|
|
background: linear-gradient(243.434948822922deg, rgba(43, 227, 162, 1) 0%, rgba(17, 164, 32, 1) 100%);
|
|
}
|
|
.div-title{
|
|
background-color: rgba(22, 145, 255, 1);
|
|
color: #ffffff;
|
|
padding:5px 10px;
|
|
border-top-left-radius: 5px;
|
|
border-top-right-radius: 5px;
|
|
}
|
|
.div-content{
|
|
height: 35px;
|
|
padding-top:8px;
|
|
border-left: 1px solid #D7D7D7;
|
|
border-right: 1px solid #D7D7D7;
|
|
border-bottom: 1px solid #D7D7D7;
|
|
background-color: #fff;
|
|
}
|
|
.div-content+.div-content{
|
|
border-bottom-left-radius: 5px;
|
|
border-bottom-right-radius: 5px;
|
|
}
|
|
.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 {
|
|
padding-right: 10px;
|
|
padding-left: 10px;
|
|
}
|
|
.box.box-white {
|
|
border-top-color: #ffffff;
|
|
}
|
|
.box.box-white h4{
|
|
border-left: 4px solid #387DC1;
|
|
padding-left: 10px;
|
|
}
|
|
.box.box-lightBlue {
|
|
background-color: #d7e5f0;
|
|
border-top-color: #d7e5f0;
|
|
}
|
|
.box.box-lightBlue h4{
|
|
border-left: 4px solid #387DC1;
|
|
padding-left: 10px;
|
|
}
|
|
.bootstrap-switch.bootstrap-switch-mini .bootstrap-switch-handle-off,
|
|
.bootstrap-switch.bootstrap-switch-mini .bootstrap-switch-handle-on,
|
|
.bootstrap-switch.bootstrap-switch-mini .bootstrap-switch-label,
|
|
.bootstrap-switch, .bootstrap-switch-handle-on, .bootstrap-switch-handle-off {
|
|
border-radius: 15px;
|
|
}
|
|
.box-header {
|
|
padding: 8px 10px;
|
|
}
|
|
.arrows-alt,.compress{
|
|
position: absolute;
|
|
right: 15px;
|
|
font-size: 25px;
|
|
color: #0a0a0a;
|
|
z-index: 11;
|
|
cursor: pointer;
|
|
}
|
|
.div-full{
|
|
position: fixed;
|
|
top: 0;
|
|
bottom: 0;
|
|
left: 0;
|
|
right: 0;
|
|
width: 100%;
|
|
height: 100%;
|
|
z-index: 10;
|
|
font-size: 20px;
|
|
|
|
}
|
|
.cursor-pointer{
|
|
cursor: pointer;
|
|
}
|
|
.img-sewage{
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
.img-sludge{
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
.img-gas{
|
|
float: right;
|
|
width: 25px;
|
|
margin: 5px;
|
|
}
|
|
.img-electric{
|
|
position: absolute;
|
|
top: 0;
|
|
right: 10px;
|
|
}
|
|
</style>
|
|
|
|
<script type="text/javascript">
|
|
var height = 1080;
|
|
var heightV =1;
|
|
var width = 1920;
|
|
var widthV =1;
|
|
var progressBar1 =0;
|
|
var progressBar2 =0;
|
|
var progressBar3 =0;
|
|
$(function () {
|
|
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/820;
|
|
widthV = width/1690;
|
|
$('.line-small').height($('.line-small').height()*heightV);
|
|
$('.line-small').width($('.line-small').width()*widthV);
|
|
$('.pie-small').height($('.pie-small').height()*heightV);
|
|
$('.pie-small').width($('.pie-small').width()*widthV);
|
|
$('.pie').height($('.pie').height()*heightV);
|
|
$('.pie').width($('.pie').width()*widthV);
|
|
|
|
$('#switch').bootstrapSwitch({ //初始化按钮
|
|
onText:" ",
|
|
offText:" ",
|
|
onColor:"primary",
|
|
offColor:"default",
|
|
size:"mini",
|
|
handleWidth:10,
|
|
labelWidth:20,
|
|
onSwitchChange:function(event,state){
|
|
if(state==true){
|
|
$('#deodorizationSecondLevelEnergyConsumptionRegion').hide();
|
|
$('#deodorizationSecondLevelEnergyConsumption').show();
|
|
}else{
|
|
$('#deodorizationSecondLevelEnergyConsumption').hide();
|
|
$('#deodorizationSecondLevelEnergyConsumptionRegion').show();
|
|
}
|
|
}
|
|
});
|
|
|
|
var legenddata = ['风机','空调水设备','给排水设备','照明'];
|
|
var data= [
|
|
{ value: 8, name: '风机' },
|
|
{ value: 5, name: '空调水设备' },
|
|
{ value: 5, name: '给排水设备' },
|
|
{ value: 2, name: '照明' }
|
|
]
|
|
doPie('equThirdLevelEnergyConsumption',data,'left','70%');
|
|
doPie('allOneLevelEnergyConsumption',data,'right','35%');
|
|
doPie('sewageSecondLevelEnergyConsumption',data,'right','35%');
|
|
doPie('sludgeSecondLevelEnergyConsumption',data,'right','35%');
|
|
doPie('deodorizationSecondLevelEnergyConsumption',data,'right','35%');
|
|
doPie('deodorizationSecondLevelEnergyConsumptionRegion',data,'right','35%');
|
|
doPie('ventilateSecondLevelEnergyConsumption',data,'right','35%');
|
|
legenddata = ['实时负荷'];
|
|
var seriesdata = [
|
|
{
|
|
name: legenddata[0],
|
|
type: 'line',
|
|
smooth: true,
|
|
showSymbol: false,
|
|
areaStyle: {
|
|
opacity: 1,
|
|
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
|
|
{
|
|
offset: 0,
|
|
color: 'rgba(33,203,33,1)'
|
|
},
|
|
{
|
|
offset: 1,
|
|
color: 'rgba(33,203,33,0.2)'
|
|
}
|
|
])
|
|
},
|
|
data: [['2022-01-01 00:00:00',21],['2022-02-01 00:00:00',10],['2022-03-01 00:00:00',14]
|
|
,['2022-04-01 00:00:00',15],['2022-05-01 00:00:00',23],['2022-06-01 00:00:00',20],
|
|
['2022-07-01 00:00:00',22],['2022-08-01 00:00:00',16],['2022-09-01 00:00:00',20]]
|
|
}
|
|
]
|
|
echartsLine('realTimeLoad',seriesdata,'','',['#2FC25B','#1890FF','#FACC14','#223273'],'MM}'+'/'+'{dd');
|
|
|
|
var bizid = unitId;
|
|
getData(bizid, "");
|
|
});
|
|
|
|
function getData(unitId, modelType) {
|
|
const myDate = new Date;
|
|
const year = myDate.getFullYear(); //获取当前年
|
|
const mon = myDate.getMonth() + 1; //获取当前月
|
|
const day = myDate.getDate(); //获取当前日
|
|
const h = myDate.getHours();//获取当前小时数(0-23)
|
|
const m = myDate.getMinutes();//获取当前分钟数(0-59)
|
|
const s = myDate.getSeconds();//获取当前秒
|
|
|
|
const nowTime = year + "-" + (mon < 10 ? "0" + mon : mon) + "-" + (day < 10 ? "0" + day : day);
|
|
$('#nowDate').html(nowTime);
|
|
var jsp_id = $('#jsp_id').val();
|
|
var time_input = $('#time_input').val();
|
|
$.ajax({
|
|
type: 'GET',
|
|
url: ext.contextPath + "/digitalProcess/digitalTechnologist/getJspData.do",
|
|
dataType: 'json',
|
|
data: {
|
|
unitId: unitId, time: time_input, jspId: jsp_id, modelType: modelType
|
|
},
|
|
async: true,
|
|
error: function () {
|
|
return false;
|
|
},
|
|
success: function (data) {
|
|
var arr = data;
|
|
console.log(arr);
|
|
var equThirdLevel_deodorization = 0;
|
|
var equThirdLevel_ventilate = 0;
|
|
var equThirdLevel_sewage = 0;
|
|
var equThirdLevel_sludge = 0;
|
|
var equThirdLevel_lighting = 0;
|
|
var equThirdLevel_ultraviolet = 0;
|
|
var equThirdLevel_blower = 0;
|
|
var equThirdLevel_surplus = 0;
|
|
|
|
var allOneLevel_deodorization = 0;
|
|
var allOneLevel_ventilate = 0;
|
|
var allOneLevel_sewage = 0;
|
|
var allOneLevel_sludge = 0;
|
|
|
|
var sewageSecondLevel_pretreatment = 0; //'预处理区
|
|
var sewageSecondLevel_primarySedimentationTank = 0; //'初沉池
|
|
var sewageSecondLevel_secondarySedimentationTank = 0; //'二沉池
|
|
var sewageSecondLevel_counterProductivePool = 0; //'生反池
|
|
var sewageSecondLevel_advancedTreatment = 0; //'深度处理区
|
|
var sewageSecondLevel_effluent = 0; //'出水区
|
|
var sewageSecondLevel_blower = 0; //'鼓风机
|
|
|
|
var sludgeSecondLevel_sludgeDrying = 0; //污泥干化系统
|
|
var sludgeSecondLevel_heating = 0; //加热系统
|
|
var sludgeSecondLevel_dephosphorization = 0; //除磷系统
|
|
var sludgeSecondLevel_sludgeConcentration = 0; //污泥浓缩调质系统
|
|
var sludgeSecondLevel_sludgeTreatment = 0; //污泥处理公共系统
|
|
var sludgeSecondLevel_auxiliary = 0; //辅助系统
|
|
|
|
var deodorizationSecondLevel_ionAirSupply = 0; //离子送风除臭
|
|
var deodorizationSecondLevel_activatedCarbon = 0; //活性炭除臭
|
|
var deodorizationSecondLevel_biology = 0; //生物除臭
|
|
|
|
var deodorizationSecondLevelRegion_pretreatment = 0; //预处理除臭
|
|
var deodorizationSecondLevelRegion_biologicalTreatment = 0; //生物处理除臭
|
|
var deodorizationSecondLevelRegion_sludge = 0; //污泥区除臭
|
|
|
|
var ventilateSecondLevel_pretreatment = 0; //预处理
|
|
var ventilateSecondLevel_biologicalTreatment = 0; //生物处理
|
|
var ventilateSecondLevel_advancedTreatment = 0; //深度处理
|
|
var ventilateSecondLevel_sludge = 0; //污泥区
|
|
|
|
var realTimeLoad_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;
|
|
}
|
|
if(visualCacheData.mpcode!=null && visualCacheData.mpcode!=undefined && visualCacheData.mpcode!=''){
|
|
mpcode = visualCacheData.mpcode;
|
|
}
|
|
} 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 (mPoint.mpointcode != null && mPoint.mpointcode != undefined && mPoint.mpointcode != '') {
|
|
mpcode = mPoint.mpointcode;
|
|
}
|
|
}
|
|
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);
|
|
$("." + arr[i].elementCode).attr("data-mpcode", mpcode);
|
|
}
|
|
} 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);
|
|
}
|
|
$("."+arr[i].elementCode).attr("data-mpcode", mpcode);
|
|
}
|
|
if ($("." + arr[i].elementCode).parent().find('.nowdate').length > 0) {
|
|
$("." + arr[i].elementCode).parent().find('.nowdate').html(nowdate.substring(11, 16));
|
|
}
|
|
}
|
|
if (arr[i].elementCode == 'equThirdLevel_deodorization') {
|
|
equThirdLevel_deodorization = value;
|
|
}
|
|
if (arr[i].elementCode == 'equThirdLevel_ventilate') {
|
|
equThirdLevel_ventilate = value;
|
|
}
|
|
if (arr[i].elementCode == 'equThirdLevel_sewage') {
|
|
equThirdLevel_sewage = value;
|
|
}
|
|
if (arr[i].elementCode == 'equThirdLevel_sludge') {
|
|
equThirdLevel_sludge = value;
|
|
}
|
|
if (arr[i].elementCode == 'equThirdLevel_lighting') {
|
|
equThirdLevel_lighting = value;
|
|
}
|
|
if (arr[i].elementCode == 'equThirdLevel_ultraviolet') {
|
|
equThirdLevel_ultraviolet = value;
|
|
}
|
|
if (arr[i].elementCode == 'equThirdLevel_blower') {
|
|
equThirdLevel_blower = value;
|
|
}
|
|
if (arr[i].elementCode == 'equThirdLevel_surplus') {
|
|
equThirdLevel_surplus = value;
|
|
}
|
|
if (arr[i].elementCode == 'allOneLevel_deodorization') {
|
|
allOneLevel_deodorization = value;
|
|
}
|
|
if (arr[i].elementCode == 'allOneLevel_ventilate') {
|
|
allOneLevel_ventilate = value;
|
|
}
|
|
if (arr[i].elementCode == 'allOneLevel_sewage') {
|
|
allOneLevel_sewage = value;
|
|
}
|
|
if (arr[i].elementCode == 'allOneLevel_sludge') {
|
|
allOneLevel_sludge = value;
|
|
}
|
|
if (arr[i].elementCode == 'sewageSecondLevel_pretreatment') {
|
|
sewageSecondLevel_pretreatment = value;//'预处理区
|
|
}
|
|
if (arr[i].elementCode == 'sewageSecondLevel_primarySedimentationTank') {
|
|
sewageSecondLevel_primarySedimentationTank = value;//'初沉池
|
|
}
|
|
if (arr[i].elementCode == 'sewageSecondLevel_secondarySedimentationTank') {
|
|
sewageSecondLevel_secondarySedimentationTank = value;//'二沉池
|
|
}
|
|
if (arr[i].elementCode == 'sewageSecondLevel_counterProductivePool') {
|
|
sewageSecondLevel_counterProductivePool = value;//'生反池
|
|
}
|
|
if (arr[i].elementCode == 'sewageSecondLevel_advancedTreatment') {
|
|
sewageSecondLevel_advancedTreatment = value;//'深度处理区
|
|
}
|
|
if (arr[i].elementCode == 'sewageSecondLevel_effluent') {
|
|
sewageSecondLevel_effluent = value;//'出水区
|
|
}
|
|
if (arr[i].elementCode == 'sewageSecondLevel_blower') {
|
|
sewageSecondLevel_blower = value;//'鼓风机
|
|
}
|
|
if (arr[i].elementCode == 'sludgeSecondLevel_sludgeDrying') {
|
|
sludgeSecondLevel_sludgeDrying = value;//污泥干化系统
|
|
}
|
|
if (arr[i].elementCode == 'sludgeSecondLevel_heating') {
|
|
sludgeSecondLevel_heating = value;//加热系统
|
|
}
|
|
if (arr[i].elementCode == 'sludgeSecondLevel_dephosphorization') {
|
|
sludgeSecondLevel_dephosphorization = value;//除磷系统
|
|
}
|
|
if (arr[i].elementCode == 'sludgeSecondLevel_sludgeConcentration') {
|
|
sludgeSecondLevel_sludgeConcentration = value;//污泥浓缩调质系统
|
|
}
|
|
if (arr[i].elementCode == 'sludgeSecondLevel_sludgeTreatment') {
|
|
sludgeSecondLevel_sludgeTreatment = value;//污泥处理公共系统
|
|
}
|
|
if (arr[i].elementCode == 'sludgeSecondLevel_auxiliary') {
|
|
sludgeSecondLevel_auxiliary = value;//辅助系统
|
|
}
|
|
if (arr[i].elementCode == 'deodorizationSecondLevel_ionAirSupply') {
|
|
deodorizationSecondLevel_ionAirSupply = value;//离子送风除臭
|
|
}
|
|
if (arr[i].elementCode == 'deodorizationSecondLevel_activatedCarbon') {
|
|
deodorizationSecondLevel_activatedCarbon = value;//活性炭除臭
|
|
}
|
|
if (arr[i].elementCode == 'deodorizationSecondLevel_biology') {
|
|
deodorizationSecondLevel_biology = value;//生物除臭
|
|
}
|
|
if (arr[i].elementCode == 'deodorizationSecondLevelRegion_pretreatment') {
|
|
deodorizationSecondLevelRegion_pretreatment = value;//预处理除臭
|
|
}
|
|
if (arr[i].elementCode == 'deodorizationSecondLevelRegion_biologicalTreatment') {
|
|
deodorizationSecondLevelRegion_biologicalTreatment = value;//生物处理除臭
|
|
}
|
|
if (arr[i].elementCode == 'deodorizationSecondLevelRegion_sludge') {
|
|
deodorizationSecondLevelRegion_sludge = value;//污泥区除臭
|
|
}
|
|
if (arr[i].elementCode == 'ventilateSecondLevel_pretreatment') {
|
|
ventilateSecondLevel_pretreatment = value;//预处理
|
|
}
|
|
if (arr[i].elementCode == 'ventilateSecondLevel_biologicalTreatment') {
|
|
ventilateSecondLevel_biologicalTreatment = value;//生物处理
|
|
}
|
|
if (arr[i].elementCode == 'ventilateSecondLevel_advancedTreatment') {
|
|
ventilateSecondLevel_advancedTreatment = value;//深度处理
|
|
}
|
|
if (arr[i].elementCode == 'ventilateSecondLevel_sludge') {
|
|
ventilateSecondLevel_sludge = value;//污泥区
|
|
}
|
|
if (arr[i].elementCode == 'realTimeLoad') {
|
|
realTimeLoad_dataseries = arr[i].jsonArray;
|
|
}
|
|
|
|
}
|
|
}
|
|
var legenddata = [];
|
|
var data= [
|
|
{ value: equThirdLevel_deodorization, name: '除臭' },
|
|
{ value: equThirdLevel_ventilate, name: '通风' },
|
|
{ value: equThirdLevel_sewage, name: '污水提升' },
|
|
{ value: equThirdLevel_sludge, name: '污泥' },
|
|
{ value: equThirdLevel_lighting, name: '照明' },
|
|
{ value: equThirdLevel_ultraviolet, name: '紫外' },
|
|
{ value: equThirdLevel_blower, name: '鼓风机' },
|
|
{ value: equThirdLevel_surplus, name: '剩余' }
|
|
]
|
|
doPie('equThirdLevelEnergyConsumption',data,'left','70%');
|
|
data= [
|
|
{ value: allOneLevel_deodorization, name: '除臭' },
|
|
{ value: allOneLevel_ventilate, name: '通风' },
|
|
{ value: allOneLevel_sewage, name: '污水' },
|
|
{ value: allOneLevel_sludge, name: '污泥' },
|
|
]
|
|
doPie('allOneLevelEnergyConsumption',data,'right','35%');
|
|
data= [
|
|
{ value: sewageSecondLevel_advancedTreatment, name: '深度处理区' },
|
|
{ value: sewageSecondLevel_pretreatment, name: '预处理区' },
|
|
{ value: sewageSecondLevel_primarySedimentationTank, name: '初沉池' },
|
|
{ value: sewageSecondLevel_secondarySedimentationTank, name: '二沉池' },
|
|
{ value: sewageSecondLevel_counterProductivePool, name: '生反池' },
|
|
{ value: sewageSecondLevel_effluent, name: '出水区' },
|
|
{ value: sewageSecondLevel_blower, name: '鼓风机' },
|
|
]
|
|
doPie('sewageSecondLevelEnergyConsumption',data,'right','35%');
|
|
data= [
|
|
{ value: sludgeSecondLevel_sludgeConcentration, name: '污泥浓缩调质系统' },
|
|
{ value: sludgeSecondLevel_sludgeTreatment, name: '污泥处理公共系统' },
|
|
{ value: sludgeSecondLevel_sludgeDrying, name: '污泥干化系统' },
|
|
{ value: sludgeSecondLevel_heating, name: '加热系统' },
|
|
{ value: sludgeSecondLevel_dephosphorization, name: '除磷系统' },
|
|
{ value: sludgeSecondLevel_auxiliary, name: '辅助系统' },
|
|
]
|
|
doPie('sludgeSecondLevelEnergyConsumption',data,'right','35%');
|
|
data= [
|
|
{ value: deodorizationSecondLevel_ionAirSupply, name: '离子送风除臭' },
|
|
{ value: deodorizationSecondLevel_activatedCarbon, name: '活性炭除臭' },
|
|
{ value: deodorizationSecondLevel_biology, name: '生物除臭' },
|
|
]
|
|
doPie('deodorizationSecondLevelEnergyConsumption',data,'right','35%');
|
|
data= [
|
|
{ value: deodorizationSecondLevelRegion_pretreatment, name: '预处理除臭' },
|
|
{ value: deodorizationSecondLevelRegion_biologicalTreatment, name: '生物处理除臭' },
|
|
{ value: deodorizationSecondLevelRegion_sludge, name: '污泥区除臭' },
|
|
]
|
|
doPie('deodorizationSecondLevelEnergyConsumptionRegion',data,'right','35%');
|
|
data= [
|
|
{ value: ventilateSecondLevel_pretreatment, name: '预处理' },
|
|
{ value: ventilateSecondLevel_biologicalTreatment, name: '生物处理' },
|
|
{ value: ventilateSecondLevel_advancedTreatment, name: '深度处理' },
|
|
{ value: ventilateSecondLevel_sludge, name: '污泥区' },
|
|
]
|
|
doPie('ventilateSecondLevelEnergyConsumption',data,'right','35%');
|
|
legenddata = ['实时负荷'];
|
|
var seriesdata = [
|
|
{
|
|
name: legenddata[0],
|
|
type: 'line',
|
|
smooth: true,
|
|
showSymbol: false,
|
|
areaStyle: {
|
|
opacity: 1,
|
|
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
|
|
{
|
|
offset: 0,
|
|
color: 'rgba(33,203,33,1)'
|
|
},
|
|
{
|
|
offset: 1,
|
|
color: 'rgba(33,203,33,0.2)'
|
|
}
|
|
])
|
|
},
|
|
data: realTimeLoad_dataseries
|
|
}
|
|
]
|
|
echartsLine('realTimeLoad',seriesdata,'','',['#2FC25B','#1890FF','#FACC14','#223273'],'MM}'+'/'+'{dd');
|
|
}
|
|
});
|
|
}
|
|
|
|
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 getDayDate(ev) {
|
|
getDateData(unitId,'day',$('#daydt').val());
|
|
}
|
|
function getMonthDate(ev) {
|
|
getDateData(unitId,'month',$('#monthdt').val());
|
|
}
|
|
function doBarPolar(id,data,text,color) {
|
|
var myChart = echarts.init(document.getElementById(id));
|
|
var option = {
|
|
title: [
|
|
{
|
|
text: data.value + '分',
|
|
left: '50%',
|
|
top: '35%',
|
|
textAlign: 'center',
|
|
textStyle: {
|
|
fontSize: '45',
|
|
color: color,
|
|
textAlign: 'center',
|
|
textBorderColor: 'rgba(0, 0, 0, 0)',
|
|
textShadowColor: '#000',
|
|
textShadowBlur: '0',
|
|
textShadowOffsetX: 0,
|
|
textShadowOffsetY: 1,
|
|
},
|
|
},
|
|
],
|
|
polar: {
|
|
radius: ['80%', '95%'],
|
|
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: color
|
|
},
|
|
},
|
|
},
|
|
],
|
|
};
|
|
myChart.clear();
|
|
myChart.setOption(option, true);
|
|
document.getElementById(id+"_title").innerHTML = text;
|
|
};
|
|
|
|
function echartsLine(id,data,legenddata,text,color,axisLabel) {
|
|
var lifeChart = echarts.getInstanceByDom(document.getElementById(id));
|
|
//有的话就获取已有echarts实例的DOM节点。
|
|
if (lifeChart != null) { // 如果存在，就进行销毁。
|
|
lifeChart.dispose();
|
|
}
|
|
var option = {
|
|
color: color,
|
|
title:{
|
|
text:text,
|
|
textStyle:{
|
|
color: '#919191'
|
|
}
|
|
},
|
|
tooltip: {
|
|
trigger: 'axis',
|
|
axisPointer: {
|
|
type: 'shadow'
|
|
}
|
|
},
|
|
grid: {
|
|
top: '5%',
|
|
left: '3%',
|
|
right: '4%',
|
|
bottom: '3%',
|
|
containLabel: true
|
|
},
|
|
xAxis: [
|
|
{
|
|
type: 'time',
|
|
axisLabel: {
|
|
formatter: '{'+axisLabel+'}'
|
|
},
|
|
axisLine: {
|
|
lineStyle:{
|
|
color: '#A0A0A0'
|
|
}
|
|
},
|
|
axisTick: {
|
|
alignWithLabel: true
|
|
}
|
|
},
|
|
],
|
|
yAxis: [
|
|
{
|
|
type: 'value',
|
|
name: '%',
|
|
axisLabel: {
|
|
formatter: '{value} %'
|
|
}
|
|
}
|
|
],
|
|
series: data
|
|
};
|
|
lifeChart = echarts.init(document.getElementById(id));
|
|
lifeChart.setOption(option,true);
|
|
}
|
|
function echartsLine2(id,data,legenddata,text,color,axisLabel) {
|
|
var lifeChart = echarts.getInstanceByDom(document.getElementById(id));
|
|
//有的话就获取已有echarts实例的DOM节点。
|
|
if (lifeChart != null) { // 如果存在，就进行销毁。
|
|
lifeChart.dispose();
|
|
}
|
|
var option = {
|
|
color: color,
|
|
title:{
|
|
text:text,
|
|
textStyle:{
|
|
color: '#919191'
|
|
}
|
|
},
|
|
legend: {
|
|
data: legenddata,
|
|
x: 'center',
|
|
bottom: '1%',
|
|
textStyle: {
|
|
color: '#919191',
|
|
fontSize: 12,
|
|
},
|
|
icon: 'roundRect'
|
|
},
|
|
tooltip: {
|
|
trigger: 'axis',
|
|
axisPointer: {
|
|
type: 'shadow'
|
|
}
|
|
},
|
|
grid: {
|
|
top: '4%',
|
|
left: '3%',
|
|
right: '4%',
|
|
bottom: '10%',
|
|
containLabel: true
|
|
},
|
|
xAxis: [
|
|
{
|
|
type: 'time',
|
|
axisLabel: {
|
|
formatter: '{'+axisLabel+'}'
|
|
},
|
|
axisLine: {
|
|
lineStyle:{
|
|
color: '#A0A0A0'
|
|
}
|
|
},
|
|
axisTick: {
|
|
alignWithLabel: true
|
|
}
|
|
}
|
|
],
|
|
yAxis: [
|
|
{
|
|
type: 'value',
|
|
},
|
|
],
|
|
series: data
|
|
};
|
|
lifeChart = echarts.init(document.getElementById(id));
|
|
lifeChart.setOption(option,true);
|
|
}
|
|
function doRadar(id,data,indicator,name){
|
|
var lifeChart = echarts.getInstanceByDom(document.getElementById(id));
|
|
//有的话就获取已有echarts实例的DOM节点。
|
|
if (lifeChart != null) { // 如果存在,就进行销毁。
|
|
lifeChart.dispose();
|
|
}
|
|
var option = {
|
|
tooltip: {
|
|
trigger: 'axis'
|
|
},
|
|
radar: [
|
|
{
|
|
indicator: indicator,
|
|
radius: '65%'
|
|
},
|
|
],
|
|
series: [
|
|
{
|
|
type: 'radar',
|
|
symbolSize :5,
|
|
lineStyle: {
|
|
width: 2 ,
|
|
},
|
|
areaStyle: {
|
|
color:'#00A8FF',
|
|
opacity: 0.2,
|
|
},
|
|
tooltip: {
|
|
trigger: 'item'
|
|
},
|
|
data: [
|
|
{
|
|
value: data,
|
|
name: name
|
|
}
|
|
]
|
|
}
|
|
]
|
|
};
|
|
lifeChart = echarts.init(document.getElementById(id));
|
|
lifeChart.setOption(option,true);
|
|
}
|
|
function doPie(id,data,legend,center){
|
|
var lifeChart = echarts.getInstanceByDom(document.getElementById(id));
|
|
//有的话就获取已有echarts实例的DOM节点。
|
|
if (lifeChart != null) { // 如果存在,就进行销毁。
|
|
lifeChart.dispose();
|
|
}
|
|
var option = {
|
|
tooltip: {
|
|
trigger: 'item'
|
|
},
|
|
legend: {
|
|
orient: 'vertical',
|
|
x: legend
|
|
},
|
|
series: [
|
|
{
|
|
name: '能耗统计',
|
|
type: 'pie',
|
|
radius: ['50%', '80%'],
|
|
center: [center, '50%'],
|
|
data: data,
|
|
label: {
|
|
position: 'inner',
|
|
formatter: function(params){
|
|
if(params.percent>=20){
|
|
return params.percent+"%"
|
|
}else{
|
|
return ''
|
|
}
|
|
},
|
|
},
|
|
emphasis: {
|
|
label: {
|
|
show: true,
|
|
fontSize: '40',
|
|
fontWeight: 'bold'
|
|
}
|
|
},
|
|
labelLine: {
|
|
show: false
|
|
},
|
|
}
|
|
]
|
|
};
|
|
lifeChart = echarts.init(document.getElementById(id));
|
|
lifeChart.setOption(option,true);
|
|
}
|
|
function showFullScreen(){
|
|
$('#contain').addClass('div-full');
|
|
$('.arrows-alt').hide();
|
|
$('.compress').show();
|
|
|
|
}
|
|
|
|
function exitFullScreen() {
|
|
$('#contain').removeClass('div-full');
|
|
$('.compress').hide();
|
|
$('.arrows-alt').show();
|
|
}
|
|
//div标签全屏方法
|
|
function launchIntoFullscreen(element) {
|
|
if(element.requestFullscreen){
|
|
element.requestFullscreen();
|
|
} else if(element.mozRequestFullScreen) {
|
|
element.mozRequestFullScreen();
|
|
} else if(element.webkitRequestFullscreen) {
|
|
element.webkitRequestFullscreen();
|
|
} else if(element.msRequestFullscreen) {
|
|
element.msRequestFullscreen();
|
|
}
|
|
}
|
|
|
|
//退出div标签全屏方法
|
|
function exitFullscreen() {
|
|
if(document.exitFullscreen) {
|
|
document.exitFullscreen();
|
|
} else if(document.mozCancelFullScreen) {
|
|
document.mozCancelFullScreen();
|
|
} else if(document.webkitExitFullscreen) {
|
|
document.webkitExitFullscreen();
|
|
}
|
|
}
|
|
function showLine(ele) {
|
|
var mpcode = $(ele).attr("data-mpcode");
|
|
$.post(ext.contextPath + '/data/showOnlyLine.do', {mpcode: mpcode, unitId: unitId}, function (data2) {
|
|
$("#subDiv").html(data2);
|
|
openModal('curveModal');
|
|
});
|
|
}
|
|
</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_id" id="jsp_id" value="energyEfficiencyOverview">
|
|
<section class="content container-fluid font-color-black" style="padding: 10px 10px 0 10px;">
|
|
<div id="subDiv"></div>
|
|
<!-- BEGIN CONTAINER -->
|
|
<div class="col-lg-12">
|
|
<div class="row">
|
|
<div class="col-lg-3">
|
|
<div class="box box-white">
|
|
<div class="box-header with-border">
|
|
<h4 class="box-title"><strong>电耗情况</strong></h4>
|
|
<div class="box-tools pull-right"></div>
|
|
</div>
|
|
<!-- /.box-header -->
|
|
<div class="box-body font-color-white text-left">
|
|
|
|
<div class="row">
|
|
<div class="col-lg-6">
|
|
<div class="div_block div_darkblue">
|
|
<div>年用电量<img src="<%=request.getContextPath()%>/IMG/digitalProcess/electric_year.png" class="img-gas"></div>
|
|
<div><span class="font-size-22 powerConsumptionYear cursor-pointer" onclick="showLine(this)">0</span> <small>kW·h</small></div>
|
|
</div>
|
|
</div>
|
|
<div class="col-lg-6">
|
|
<div class="div_block div_darkblue">
|
|
<div>月用电量<img src="<%=request.getContextPath()%>/IMG/digitalProcess/electric_month.png" class="img-gas"></div>
|
|
<div><span class="font-size-22 powerConsumptionMonth cursor-pointer" onclick="showLine(this)">0</span> <small>kW·h</small></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="row">
|
|
<div class="col-lg-6 ">
|
|
<div class="div_block div_blue">
|
|
<div>日用电量<img src="<%=request.getContextPath()%>/IMG/digitalProcess/electric_day.png" class="img-gas"></div>
|
|
<div><span class="font-size-22 powerConsumptionDay cursor-pointer" onclick="showLine(this)">0</span> <small>kW·h</small></div>
|
|
</div>
|
|
</div>
|
|
<div class="col-lg-6">
|
|
<div class="div_block div_blue">
|
|
<div>用电单耗<img src="<%=request.getContextPath()%>/IMG/digitalProcess/electric.png" class="img-electric"></div>
|
|
<div><span class="font-size-22 unitPowerConsumption cursor-pointer" onclick="showLine(this)">0</span> <small>kW·h/m³</small></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- /.box-body -->
|
|
<%--<div class="box-footer"></div>--%>
|
|
<!-- /.box-footer-->
|
|
</div>
|
|
<div class="box box-white">
|
|
<div class="box-header with-border">
|
|
<h4 class="box-title"><strong>实时负荷</strong></h4>
|
|
<div class="box-tools pull-right"></div>
|
|
</div>
|
|
<!-- /.box-header -->
|
|
<div class="box-body line-small" id="realTimeLoad">
|
|
|
|
</div>
|
|
<!-- /.box-body -->
|
|
<%--<div class="box-footer"></div>--%>
|
|
<!-- /.box-footer-->
|
|
</div>
|
|
</div>
|
|
<div class="col-lg-6 font-size-12">
|
|
<div class="box box-lightBlue" id="contain">
|
|
<div class="box-body text-left img-content">
|
|
<span class="arrows-alt" onclick="showFullScreen()"><i class="fa fa-arrows-alt"></i></span>
|
|
<span class="compress" style="display: none" onclick="exitFullScreen()"><i class="fa fa-compress"></i></span>
|
|
<div class="row">
|
|
<div class="col-lg-12 margin-bottom-10" style="min-height: 160px">
|
|
<img src="<%=request.getContextPath()%>/IMG/digitalProcess/sewage.png" class="img-sewage" />
|
|
</div>
|
|
</div>
|
|
<div class="row">
|
|
<div class="col-lg-3 margin-bottom-10">
|
|
<div class="div-title">预处理</div>
|
|
<div class="div-content">
|
|
<div class="col-lg-5">今日累计：</div>
|
|
<div class="col-lg-4 font-color-lightgreen cursor-pointer accumulatedToday_pretreatment" onclick="showLine(this)">0</div><div class="col-lg-3">kW·h</div>
|
|
</div>
|
|
<div class="div-content">
|
|
<div class="col-lg-5">电耗占比：</div>
|
|
<div class="col-lg-4 font-color-lightgreen cursor-pointer powerConsumptionProportion_pretreatment" onclick="showLine(this)">0</div><div class="col-lg-3">%</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-lg-3 margin-bottom-10">
|
|
<div class="div-title">水处理 (1#、2#) 处理线</div>
|
|
<div class="div-content">
|
|
<div class="col-lg-5">今日累计：</div>
|
|
<div class="col-lg-4 font-color-lightgreen cursor-pointer accumulatedToday_waterTreatment12" onclick="showLine(this)">0</div><div class="col-lg-3">kW·h</div>
|
|
</div>
|
|
<div class="div-content">
|
|
<div class="col-lg-5">电耗占比：</div>
|
|
<div class="col-lg-4 font-color-lightgreen cursor-pointer powerConsumptionProportion_waterTreatment12" onclick="showLine(this)">0</div><div class="col-lg-3">%</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-lg-3 margin-bottom-10">
|
|
<div class="div-title">水处理 (3#、4#) 处理线</div>
|
|
<div class="div-content">
|
|
<div class="col-lg-5">今日累计：</div>
|
|
<div class="col-lg-4 font-color-lightgreen cursor-pointer accumulatedToday_waterTreatment34" onclick="showLine(this)">0</div><div class="col-lg-3">kW·h</div>
|
|
</div>
|
|
<div class="div-content">
|
|
<div class="col-lg-5">电耗占比：</div>
|
|
<div class="col-lg-4 font-color-lightgreen cursor-pointer powerConsumptionProportion_waterTreatment34" onclick="showLine(this)">0</div><div class="col-lg-3">%</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-lg-3 margin-bottom-10">
|
|
<div class="div-title">鼓风机房</div>
|
|
<div class="div-content">
|
|
<div class="col-lg-5">今日累计：</div>
|
|
<div class="col-lg-4 font-color-lightgreen cursor-pointer accumulatedToday_blower" onclick="showLine(this)">0</div><div class="col-lg-3">kW·h</div>
|
|
</div>
|
|
<div class="div-content">
|
|
<div class="col-lg-5">电耗占比：</div>
|
|
<div class="col-lg-4 font-color-lightgreen cursor-pointer powerConsumptionProportion_blower" onclick="showLine(this)">0</div><div class="col-lg-3">%</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="row">
|
|
<div class="col-lg-6" style="min-height: 200px">
|
|
<img src="<%=request.getContextPath()%>/IMG/digitalProcess/sludge.png" class="img-sludge" />
|
|
</div>
|
|
<div class="col-lg-3 margin-bottom-10">
|
|
<div class="div-title">深度处理</div>
|
|
<div class="div-content">
|
|
<div class="col-lg-5">今日累计：</div>
|
|
<div class="col-lg-4 font-color-lightgreen cursor-pointer accumulatedToday_advancedTreatment" onclick="showLine(this)">0</div><div class="col-lg-3">kW·h</div>
|
|
</div>
|
|
<div class="div-content">
|
|
<div class="col-lg-5">电耗占比：</div>
|
|
<div class="col-lg-4 font-color-lightgreen cursor-pointer powerConsumptionProportion_advancedTreatment" onclick="showLine(this)">0</div><div class="col-lg-3">%</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-lg-3 margin-bottom-10">
|
|
<div class="div-title">泥处理</div>
|
|
<div class="div-content">
|
|
<div class="col-lg-5">今日累计：</div>
|
|
<div class="col-lg-4 font-color-lightgreen cursor-pointer accumulatedToday_mudTreatment" onclick="showLine(this)">0</div><div class="col-lg-3">kW·h</div>
|
|
</div>
|
|
<div class="div-content">
|
|
<div class="col-lg-5">电耗占比：</div>
|
|
<div class="col-lg-4 font-color-lightgreen cursor-pointer powerConsumptionProportion_mudTreatment" onclick="showLine(this)">0</div><div class="col-lg-3">%</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-lg-3">
|
|
<div class="div-title">除臭</div>
|
|
<div class="div-content">
|
|
<div class="col-lg-5">今日累计：</div>
|
|
<div class="col-lg-4 font-color-lightgreen cursor-pointer accumulatedToday_deodorization" onclick="showLine(this)">0</div><div class="col-lg-3">kW·h</div>
|
|
</div>
|
|
<div class="div-content">
|
|
<div class="col-lg-5">电耗占比：</div>
|
|
<div class="col-lg-4 font-color-lightgreen cursor-pointer powerConsumptionProportion_deodorization" onclick="showLine(this)">0</div><div class="col-lg-3">%</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-lg-3">
|
|
<div class="div-title">通风</div>
|
|
<div class="div-content">
|
|
<div class="col-lg-5">今日累计：</div>
|
|
<div class="col-lg-4 font-color-lightgreen cursor-pointer accumulatedToday_ventilate" onclick="showLine(this)">0</div><div class="col-lg-3">kW·h</div>
|
|
</div>
|
|
<div class="div-content">
|
|
<div class="col-lg-5">电耗占比：</div>
|
|
<div class="col-lg-4 font-color-lightgreen cursor-pointer powerConsumptionProportion_ventilate" onclick="showLine(this)">0</div><div class="col-lg-3">%</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- /.box-body -->
|
|
<%--<div class="box-footer"></div>--%>
|
|
<!-- /.box-footer-->
|
|
</div>
|
|
</div>
|
|
<div class="col-lg-3">
|
|
<div class="box box-white">
|
|
<div class="box-header with-border">
|
|
<h4 class="box-title"><strong>气水消耗</strong></h4>
|
|
<div class="box-tools pull-right"></div>
|
|
</div>
|
|
<!-- /.box-header -->
|
|
<div class="box-body font-color-white text-left">
|
|
<div class="row">
|
|
<div class="col-lg-6">
|
|
<div class="div_block div_lightblue">
|
|
<div>燃气年用量 <img src="<%=request.getContextPath()%>/IMG/digitalProcess/gas_year.png" class="img-gas"></div>
|
|
<div><span class="font-size-22 gasConsumptionYear cursor-pointer" onclick="showLine(this)">0</span> <small>万m³</small></div>
|
|
</div>
|
|
</div>
|
|
<div class="col-lg-6">
|
|
<div class="div_block div_lightblue">
|
|
<div>燃气月用量<img src="<%=request.getContextPath()%>/IMG/digitalProcess/gas_month.png" class="img-gas"></div>
|
|
<div><span class="font-size-22 gasConsumptionMonth cursor-pointer" onclick="showLine(this)">0</span> <small>万m³</small></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="row">
|
|
<div class="col-lg-6">
|
|
<div class="div_block div_darkblue">
|
|
<div>新水年用量<img src="<%=request.getContextPath()%>/IMG/digitalProcess/water_year.png" class="img-gas"></div>
|
|
<div><span class="font-size-22 waterConsumptionYear cursor-pointer" onclick="showLine(this)">0</span> <small>万吨</small></div>
|
|
</div>
|
|
</div>
|
|
<div class="col-lg-6">
|
|
<div class="div_block div_darkblue">
|
|
<div>新水月用量<img src="<%=request.getContextPath()%>/IMG/digitalProcess/water_month.png" class="img-gas"></div>
|
|
<div><span class="font-size-22 waterConsumptionMonth cursor-pointer" onclick="showLine(this)">0</span> <small>万吨</small></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- /.box-body -->
|
|
<%--<div class="box-footer"></div>--%>
|
|
<!-- /.box-footer-->
|
|
</div>
|
|
<div class="box box-white">
|
|
<div class="box-header with-border">
|
|
<h4 class="box-title"><strong>设备三级能耗统计</strong></h4>
|
|
<div class="box-tools pull-right"></div>
|
|
</div>
|
|
<!-- /.box-header -->
|
|
<div class="box-body pie" id="equThirdLevelEnergyConsumption">
|
|
|
|
</div>
|
|
<!-- /.box-body -->
|
|
<%--<div class="box-footer"></div>--%>
|
|
<!-- /.box-footer-->
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="row">
|
|
<div class="col-md-20">
|
|
<div class="box box-white">
|
|
<div class="box-header with-border">
|
|
<h4 class="box-title"><strong>全厂一级能耗统计</strong></h4>
|
|
<div class="box-tools pull-right"></div>
|
|
</div>
|
|
<!-- /.box-header -->
|
|
<div class="box-body pie-small" id="allOneLevelEnergyConsumption">
|
|
|
|
</div>
|
|
<!-- /.box-body -->
|
|
<%--<div class="box-footer"></div>--%>
|
|
<!-- /.box-footer-->
|
|
</div>
|
|
</div>
|
|
<div class="col-md-20">
|
|
<div class="box box-white">
|
|
<div class="box-header with-border">
|
|
<h4 class="box-title"><strong>污水二级能耗统计</strong></h4>
|
|
<div class="box-tools pull-right"></div>
|
|
</div>
|
|
<!-- /.box-header -->
|
|
<div class="box-body pie-small" id="sewageSecondLevelEnergyConsumption" >
|
|
|
|
</div>
|
|
<!-- /.box-body -->
|
|
<%--<div class="box-footer"></div>--%>
|
|
<!-- /.box-footer-->
|
|
</div>
|
|
</div>
|
|
<div class="col-md-20">
|
|
<div class="box box-white">
|
|
<div class="box-header with-border">
|
|
<h4 class="box-title"><strong>污泥二级能耗统计</strong></h4>
|
|
<div class="box-tools pull-right"></div>
|
|
</div>
|
|
<!-- /.box-header -->
|
|
<div class="box-body pie-small" id="sludgeSecondLevelEnergyConsumption">
|
|
|
|
</div>
|
|
<!-- /.box-body -->
|
|
<%--<div class="box-footer"></div>--%>
|
|
<!-- /.box-footer-->
|
|
</div>
|
|
</div>
|
|
<div class="col-md-20">
|
|
<div class="box box-white">
|
|
<div class="box-header with-border">
|
|
<h4 class="box-title"><strong>除臭二级能耗统计</strong></h4>
|
|
<div class="box-tools pull-right">
|
|
<input id="switch" name="switch" type="checkbox" checked>
|
|
</div>
|
|
</div>
|
|
<!-- /.box-header -->
|
|
<div class="box-body pie-small" id="deodorizationSecondLevelEnergyConsumption">
|
|
|
|
</div>
|
|
<div class="box-body pie-small" style="display: none"
|
|
id="deodorizationSecondLevelEnergyConsumptionRegion">
|
|
|
|
</div>
|
|
<!-- /.box-body -->
|
|
<%--<div class="box-footer"></div>--%>
|
|
<!-- /.box-footer-->
|
|
</div>
|
|
</div>
|
|
<div class="col-md-20">
|
|
<div class="box box-white">
|
|
<div class="box-header with-border">
|
|
<h4 class="box-title"><strong>通风二级能耗统计</strong></h4>
|
|
<div class="box-tools pull-right"></div>
|
|
</div>
|
|
<!-- /.box-header -->
|
|
<div class="box-body pie-small" id="ventilateSecondLevelEnergyConsumption">
|
|
|
|
</div>
|
|
<!-- /.box-body -->
|
|
<%--<div class="box-footer"></div>--%>
|
|
<!-- /.box-footer-->
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
</div>
|
|
</div>
|
|
</body>
|
|
</html> |