1958 lines
89 KiB
Plaintext
1958 lines
89 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/iconfontGroup/font_zengcheng/iconfont.css"/>
|
||
<style type="text/css">
|
||
.content-wrapper{
|
||
padding: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: 3px;
|
||
padding-left: 3px;
|
||
}
|
||
.text-fontcolor-white{
|
||
color:#ffffff;
|
||
}
|
||
.text-fontcolor-black{
|
||
color:#000000;
|
||
}
|
||
.text-fontcolor-gray-light{
|
||
color:#AEAEAE;
|
||
}
|
||
.text-fontcolor-red{
|
||
color:#FF0000;
|
||
}
|
||
.text-fontcolor-green{
|
||
color:#24AE36;
|
||
}
|
||
.text-fontcolor-blue{
|
||
color:#1790FF;
|
||
}
|
||
|
||
.font-size-14{
|
||
font-size: 14px;
|
||
}
|
||
.font-size-16{
|
||
font-size: 16px;
|
||
}
|
||
.font-size-20{
|
||
font-size: 20px;
|
||
}
|
||
.font-size-30{
|
||
font-size: 30px;
|
||
}
|
||
.font-size-40{
|
||
font-size: 40px;
|
||
}
|
||
.padding-UpDown-0{
|
||
padding-top: 0;
|
||
padding-bottom: 0;
|
||
}
|
||
.padding-UpDown-5{
|
||
padding-top: 5px;
|
||
padding-bottom: 5px;
|
||
}
|
||
.padding-UpDown-10{
|
||
padding-top: 10px;
|
||
padding-bottom: 10px;
|
||
}
|
||
.padding-UpDown-15{
|
||
padding-top: 15px;
|
||
padding-bottom: 15px;
|
||
}
|
||
.padding-UpDown-20{
|
||
padding-top: 20px;
|
||
padding-bottom: 20px;
|
||
}
|
||
.padding-LeftRight-0{
|
||
padding-top: 0;
|
||
padding-bottom: 0;
|
||
}
|
||
.padding-LeftRight-5{
|
||
padding-top: 5px;
|
||
padding-bottom: 5px;
|
||
}
|
||
.padding-LeftRight-10{
|
||
padding-top: 10px;
|
||
padding-bottom: 10px;
|
||
}
|
||
.padding-LeftRight-15{
|
||
padding-top: 15px;
|
||
padding-bottom: 15px;
|
||
}
|
||
.padding-LeftRight-20{
|
||
padding-top: 20px;
|
||
padding-bottom: 20px;
|
||
}
|
||
.line-height-20{
|
||
line-height: 20px;
|
||
}
|
||
.box {
|
||
margin-bottom: 10px;
|
||
}
|
||
|
||
.box> .box-header>.box-title>i {
|
||
margin-right:10px;
|
||
}
|
||
.box.box-solid.box-blue {
|
||
border: 1px solid #00c0ef;
|
||
}
|
||
.box.box-solid.box-blue > .box-header {
|
||
background: #1790FF;
|
||
background-color: #1790FF;
|
||
padding: 5px;
|
||
}
|
||
.box.box-solid.box-blue > .box-body {
|
||
background: #EBF6FF;
|
||
background-color: #EBF6FF;
|
||
padding: 5px;
|
||
}
|
||
.pie_processing_capacity{
|
||
width: 220px;
|
||
height: 220px;
|
||
}
|
||
.dashboard{
|
||
width: 170px;
|
||
height: 170px;
|
||
}
|
||
.annular{
|
||
width: 150px;
|
||
height: 170px;
|
||
}
|
||
.annular_reverse{
|
||
width: 170px;
|
||
height: 220px;
|
||
}
|
||
.stacked_bar_one{
|
||
width: 270px;
|
||
height: 220px;
|
||
}
|
||
.stacked_bar_two{
|
||
width: 460px;
|
||
height: 220px;
|
||
}
|
||
.special_bar{
|
||
width: 560px;
|
||
height: 185px;
|
||
}
|
||
.radar{
|
||
width: 180px;
|
||
height: 160px;
|
||
}
|
||
.box>.box-header>.fa, .box>.box-header>.glyphicon,
|
||
.box>.box-header>.ion, .box>.box-header .box-title {
|
||
font-size: 16px;
|
||
}
|
||
.box-body {
|
||
padding: 5px 10px;
|
||
}
|
||
.table {
|
||
margin-bottom: 0px;
|
||
}
|
||
.carousel {
|
||
padding: 30px 0 0 0;
|
||
}
|
||
.carousel-control {
|
||
width: 1.5%;
|
||
}
|
||
.carousel-control>.fa {
|
||
top: 0;
|
||
margin-top: 0px;
|
||
left: 0;
|
||
font-size: 30px;
|
||
}
|
||
.carousel-indicators {
|
||
top: 5px;
|
||
bottom: auto;
|
||
}
|
||
.factory_list {
|
||
overflow: auto;
|
||
}
|
||
.nav>li>a {
|
||
padding: 5px 10px;
|
||
}
|
||
</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_blueSystem = ['#0C4F9D','#0089F2','#68B4FF','#95DEFF','#CBEFFF','#BBDEFF'];
|
||
var color_redSystem = ['#FF1717','#FF00C4','#8700FF','#FF2C2C','#C7BBFF','#FFC2F9'];
|
||
var color_yellowSystem = ['#CE6408','#FFCEA4','#FF9317','#FFC400','#FFF3B5'];
|
||
var color_greenSystem = ['#24AE36','#19D119'];
|
||
|
||
$(function () {
|
||
var height = $(window).height();
|
||
var width = $(window).width();
|
||
var height_proportion = height/995;
|
||
var width_proportion = width/1725;
|
||
$('.factory_list').height($('.pie_processing_capacity').height()*height_proportion);
|
||
$('.pie_processing_capacity').height($('.pie_processing_capacity').height()*height_proportion);
|
||
$('.pie_processing_capacity').width($('.pie_processing_capacity').width()*width_proportion);
|
||
$('.dashboard').height($('.dashboard').height()*height_proportion);
|
||
$('.dashboard').width($('.dashboard').width()*width_proportion);
|
||
$('.annular').height($('.annular').height()*height_proportion);
|
||
$('.annular').width($('.annular').width()*width_proportion);
|
||
$('.annular_reverse').height($('.annular_reverse').height()*height_proportion);
|
||
$('.annular_reverse').width($('.annular_reverse').width()*width_proportion);
|
||
|
||
$('.stacked_bar_one').height($('.stacked_bar_one').height()*height_proportion);
|
||
$('.stacked_bar_one').width($('.stacked_bar_one').width()*width_proportion);
|
||
$('.stacked_bar_two').height($('.stacked_bar_two').height()*height_proportion);
|
||
$('.stacked_bar_two').width($('.stacked_bar_two').width()*width_proportion);
|
||
$('.special_bar').height($('.special_bar').height()*height_proportion);
|
||
$('.special_bar').width($('.special_bar').width()*width_proportion);
|
||
$('.radar').height($('.radar').height()*height_proportion);
|
||
$('.radar').width($('.radar').width()*width_proportion);
|
||
|
||
|
||
var bizid = unitId;
|
||
|
||
var data = [
|
||
{ value: 0, name: '增城永和' },
|
||
{ value: 0, name: '增城中心' }
|
||
];
|
||
doendPie('pie_processing_capacity',data);
|
||
var value = 0;
|
||
var actual = 400;
|
||
var planned = 300;
|
||
var proportion1=0;
|
||
var proportion2=0;
|
||
var total = 0;
|
||
if(actual>=planned){
|
||
value = planned;
|
||
total = actual*1.1;
|
||
proportion1 = value/total;
|
||
proportion2 = actual/total;
|
||
color = color_redSystem[3];
|
||
}else{
|
||
if(actual<planned){
|
||
value = actual;
|
||
total = planned*1.1;
|
||
proportion1 = value/total;
|
||
proportion2 = planned/total;
|
||
color = color_greenSystem[1];
|
||
}
|
||
}
|
||
|
||
doGauge('power_consumption',(120*proportion1),proportion1,proportion2,color);
|
||
actual = 300;
|
||
planned = 400;
|
||
if(actual>=planned){
|
||
value = planned;
|
||
total = actual*1.1;
|
||
proportion1 = value/total;
|
||
proportion2 = actual/total;
|
||
color = color_redSystem[3];
|
||
}else{
|
||
if(actual<planned){
|
||
value = actual;
|
||
total = planned*1.1;
|
||
proportion1 = value/total;
|
||
proportion2 = planned/total;
|
||
color = color_greenSystem[1];
|
||
}
|
||
}
|
||
doGauge('ton_water_power_consumption',(120*proportion1),proportion1,proportion2,color);
|
||
doAnnular('equipment_intact_rate',0,"设备完好率",color_blueSystem[1]);
|
||
doAnnular('failure_shutdown_rate',0,"故障停机率",color_redSystem[3]);
|
||
doAnnular('patrol_inspection_completion_rate',0,"巡检完成率",color_blueSystem[1]);
|
||
|
||
var color = [color_redSystem[2],color_redSystem[1]];
|
||
doAnnularReverse('maintain_completion_rate',0,0,"维修完成率","保养完成率",color)
|
||
var legenddata = ['已完成','未完成'];
|
||
var xAxisData = ['增城永和','增城中心'];
|
||
var data1 = [0,0];
|
||
var data2 = [0,0];
|
||
var seriesdata=[
|
||
{
|
||
name: '已完成',
|
||
type: 'bar',
|
||
stack: 'one',
|
||
barMaxWidth:20 ,
|
||
data: data1
|
||
},
|
||
{
|
||
name: '未完成',
|
||
type: 'bar',
|
||
stack: 'one',
|
||
barMaxWidth:20 ,
|
||
data: data2
|
||
},
|
||
];
|
||
color = [color_blueSystem[1],color_blueSystem[5]];
|
||
doStackedBar('patrol_inspection_stacked_bar',legenddata,seriesdata,xAxisData,color);
|
||
legenddata = ['维修已完成','维修未完成','保养已完成','保养未完成'];
|
||
var data3 = [0,0];
|
||
var data4 = [0,0];
|
||
seriesdata=[
|
||
{
|
||
name: '维修已完成',
|
||
type: 'bar',
|
||
stack: 'one',
|
||
barMaxWidth:20 ,
|
||
data: data1
|
||
},
|
||
{
|
||
name: '维修未完成',
|
||
type: 'bar',
|
||
stack: 'one',
|
||
barMaxWidth:20 ,
|
||
data: data2
|
||
},
|
||
{
|
||
name: '保养已完成',
|
||
type: 'bar',
|
||
stack: 'two',
|
||
barMaxWidth:20 ,
|
||
data: data3
|
||
},
|
||
{
|
||
name: '保养未完成',
|
||
type: 'bar',
|
||
stack: 'two',
|
||
barMaxWidth:20 ,
|
||
data: data4
|
||
}
|
||
];
|
||
var color = [color_redSystem[2],color_redSystem[4],color_redSystem[1],color_redSystem[5]];
|
||
doStackedBar('maintain_stacked_bar',legenddata,seriesdata,xAxisData,color);
|
||
legenddata=['今日水处理量','昨日水处理量','计划水处理量'];
|
||
seriesdata = [
|
||
{
|
||
name: '计划水处理量',
|
||
type: 'bar',
|
||
xAxisIndex: 1,
|
||
barWidth: 30,
|
||
itemStyle: {
|
||
color: 'none',
|
||
borderColor: color_blueSystem[5] ,
|
||
borderWidth: 2 ,
|
||
borderType: 'dashed' ,
|
||
},
|
||
data: [0, 0],
|
||
},
|
||
{
|
||
name: '无用',
|
||
type: 'bar',
|
||
xAxisIndex: 1,
|
||
barWidth: 24,
|
||
},
|
||
{
|
||
name: '今日水处理量',
|
||
type: 'bar',
|
||
barWidth: 25,
|
||
data: [0, 0],
|
||
},
|
||
{
|
||
name: '昨日水处理量',
|
||
type: 'bar',
|
||
barWidth: 25,
|
||
data: [0, 0],
|
||
},
|
||
]
|
||
color = [color_blueSystem[5],color_blueSystem[1]];
|
||
//doBarSpecial('water_treatment',legenddata,seriesdata,xAxisData,color);
|
||
legenddata=['今日泥处理量','昨日泥处理量','计划泥处理量'];
|
||
seriesdata = [
|
||
{
|
||
name: '计划泥处理量',
|
||
type: 'bar',
|
||
xAxisIndex: 1,
|
||
barWidth: 30,
|
||
itemStyle: {
|
||
color: 'none',
|
||
borderColor: color_yellowSystem[1] ,
|
||
borderWidth: 2 ,
|
||
borderType: 'dashed' ,
|
||
},
|
||
data: [0, 0],
|
||
},
|
||
{
|
||
name: '无用',
|
||
type: 'bar',
|
||
xAxisIndex: 1,
|
||
barWidth: 24,
|
||
},
|
||
{
|
||
name: '今日泥处理量',
|
||
type: 'bar',
|
||
barWidth: 25,
|
||
data: [0, 0],
|
||
},
|
||
{
|
||
name: '昨日泥处理量',
|
||
type: 'bar',
|
||
barWidth: 25,
|
||
data: [0, 0],
|
||
},
|
||
]
|
||
color = [color_yellowSystem[1],color_yellowSystem[0]];
|
||
//doBarSpecial('mud_treatment',legenddata,seriesdata,xAxisData,color);
|
||
getData(bizid);
|
||
setInterval("getData('"+bizid+"')",600000);
|
||
});
|
||
|
||
function addAndRemove4Class(one,two){
|
||
$('.'+one).addClass(two);
|
||
$('.'+one).removeClass(one);
|
||
}
|
||
function getData(bizid){
|
||
var jsp_id = $('#jsp_id').val();
|
||
var time_input = $('#time_input').val();
|
||
$('.factory_list').empty();
|
||
$('.carousel-inner').empty();
|
||
$.post(ext.contextPath + '/zengCheng/getZengChengCompanyData.do', {bizid:bizid,time:time_input,jsp_id:jsp_id} , function(data) {
|
||
var arr= JSON.parse(data);
|
||
console.log(arr);
|
||
var left_top_line_legenddata=[];
|
||
var left_top_line_seriesdata=[];
|
||
var left_middle_line_legenddata=[];
|
||
var left_middle_line_seriesdata=[];
|
||
var left_bottom_bar_legenddata=[];
|
||
var left_bottom_bar_seriesdata=[];
|
||
|
||
var left_bottom_line_1_legenddata=[];
|
||
var left_bottom_line_1_seriesdata=[];
|
||
var left_bottom_line_2_legenddata=[];
|
||
var left_bottom_line_2_seriesdata=[];
|
||
|
||
var bar_max =0;
|
||
var bar_min =0;
|
||
var bar_totle =0;
|
||
var center_bottom_line_legenddata=[];
|
||
var center_bottom_line_seriesdata=[];
|
||
var equipment_intact = 0;
|
||
var failure_shutdown = 0;
|
||
var patrol =0;
|
||
var maintenance =0;
|
||
var repair = 0;
|
||
var right_bottom_bar_legenddata=[];
|
||
var right_bottom_bar_seriesdata=[];
|
||
var accumulated_today = 0;
|
||
var target_water_volume = 0;
|
||
var water_difference = 0;
|
||
var actual_power_consumption = 0;
|
||
var planned_power_consumption = 0;
|
||
var actual_ton_water_power_consumption = 0;
|
||
var planned_ton_water_power_consumption = 0;
|
||
var difference_power_consumption = 0;
|
||
var difference_ton_water_power_consumption = 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].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;
|
||
}else{
|
||
if(arr.rows[i].numtail!=null && arr.rows[i].numtail!=undefined && arr.rows[i].numtail!=''){
|
||
numtail = arr.rows[i].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;
|
||
}
|
||
}
|
||
}
|
||
value = parseFloat(value)*rate;
|
||
value = value.toFixed(numtail);
|
||
//value = parseFloat(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=='equipment_intact_rate'){
|
||
equipment_intact=value;
|
||
}
|
||
//故障停机率
|
||
if(arr.rows[i].elementCode=='failure_shutdown_rate'){
|
||
failure_shutdown=value;
|
||
}
|
||
//巡检完成率
|
||
if(arr.rows[i].elementCode=='patrol_inspection_completion_rate'){
|
||
patrol=value;
|
||
}
|
||
//维修完成率
|
||
if(arr.rows[i].elementCode=='repair_completion_rate'){
|
||
repair=value;
|
||
}
|
||
//保养完成率
|
||
if(arr.rows[i].elementCode=='maintain_completion_rate'){
|
||
maintenance=value;
|
||
}
|
||
if(arr.rows[i].elementCode=='accumulated_today'){
|
||
accumulated_today=value;
|
||
}
|
||
if(arr.rows[i].elementCode=='target_water_volume'){
|
||
target_water_volume=value;
|
||
}
|
||
if(arr.rows[i].elementCode=='actual_power_consumption'){
|
||
actual_power_consumption=value;
|
||
}
|
||
if(arr.rows[i].elementCode=='planned_power_consumption'){
|
||
planned_power_consumption=value;
|
||
}
|
||
if(arr.rows[i].elementCode=='actual_ton_water_power_consumption'){
|
||
actual_ton_water_power_consumption=value;
|
||
}
|
||
if(arr.rows[i].elementCode=='planned_ton_water_power_consumption'){
|
||
planned_ton_water_power_consumption=value;
|
||
}
|
||
}
|
||
water_difference = target_water_volume-accumulated_today;
|
||
/* if(water_difference>0){
|
||
$(".water_difference").removeClass("text-fontcolor-red");
|
||
$(".water_difference").addClass("text-fontcolor-green");
|
||
$(".water_difference").html(toThousands(water_difference.toFixed(numtail)));
|
||
}else{
|
||
$(".water_difference").removeClass("text-fontcolor-green");
|
||
$(".water_difference").addClass("text-fontcolor-red");
|
||
$(".water_difference").html(toThousands(water_difference.toFixed(numtail)));
|
||
} */
|
||
difference_power_consumption = planned_power_consumption-actual_power_consumption;
|
||
if(difference_power_consumption>0){
|
||
$(".difference_power_consumption").removeClass("text-fontcolor-red");
|
||
$(".difference_power_consumption").addClass("text-fontcolor-green");
|
||
$(".difference_power_consumption").html(toThousands(difference_power_consumption.toFixed(numtail)));
|
||
$(".difference_power_consumption").prev().removeClass("text-fontcolor-red");
|
||
$(".difference_power_consumption").prev().addClass("text-fontcolor-green");
|
||
$(".difference_power_consumption").prev().html('节约');
|
||
|
||
}else{
|
||
$(".difference_power_consumption").removeClass("text-fontcolor-green");
|
||
$(".difference_power_consumption").addClass("text-fontcolor-red");
|
||
$(".difference_power_consumption").html(toThousands(difference_power_consumption.toFixed(numtail)));
|
||
$(".difference_power_consumption").prev().removeClass("text-fontcolor-green");
|
||
$(".difference_power_consumption").prev().addClass("text-fontcolor-red");
|
||
$(".difference_power_consumption").prev().html('超支');
|
||
}
|
||
difference_ton_water_power_consumption = planned_ton_water_power_consumption-actual_ton_water_power_consumption;
|
||
if(difference_ton_water_power_consumption>0){
|
||
$(".difference_ton_water_power_consumption").removeClass("text-fontcolor-red");
|
||
$(".difference_ton_water_power_consumption").addClass("text-fontcolor-green");
|
||
$(".difference_ton_water_power_consumption").html(toThousands(difference_ton_water_power_consumption.toFixed(numtail)));
|
||
$(".difference_ton_water_power_consumption").prev().removeClass("text-fontcolor-red");
|
||
$(".difference_ton_water_power_consumption").prev().addClass("text-fontcolor-green");
|
||
$(".difference_ton_water_power_consumption").prev().html('节约');
|
||
}else{
|
||
$(".difference_ton_water_power_consumption").removeClass("text-fontcolor-green");
|
||
$(".difference_ton_water_power_consumption").addClass("text-fontcolor-red");
|
||
$(".difference_ton_water_power_consumption").html(toThousands(difference_ton_water_power_consumption.toFixed(numtail)));
|
||
$(".difference_ton_water_power_consumption").prev().removeClass("text-fontcolor-green");
|
||
$(".difference_ton_water_power_consumption").prev().addClass("text-fontcolor-red");
|
||
$(".difference_ton_water_power_consumption").prev().html('超支');
|
||
}
|
||
}
|
||
var processing_capacity_data = [];
|
||
var processing_capacity_data_children =0;
|
||
var power_value = 0;
|
||
var power_actual = 400;
|
||
var power_planned = 300;
|
||
var power_proportion1=0;
|
||
var power_proportion2=0;
|
||
var power_total = 0;
|
||
var water_power_value = 0;
|
||
var water_power_actual = 400;
|
||
var water_power_planned = 300;
|
||
var water_power_proportion1=0;
|
||
var water_power_proportion2=0;
|
||
var water_power_total = 0;
|
||
var xAxisData = [];
|
||
var patrol_inspection_completion_data = [];
|
||
var patrol_inspection_incompletion_data = [];
|
||
var repair_completion_data = [];
|
||
var repair_incompletion_data = [];
|
||
var maintain_completion_data = [];
|
||
var maintain_incompletion_data = [];
|
||
|
||
var accumulated_today_data = [];
|
||
var yesterday_processing_capacity_data = [];
|
||
var target_water_volume_data = [];
|
||
var target_mud_volume_data = [];
|
||
var mud_accumulated_today_data = [];
|
||
var mud_accumulated_yesterday_data = [];
|
||
var htmlStr = "";
|
||
var htmlStrOl = "";
|
||
|
||
var equipment_score = 0;
|
||
var function_score = 0;
|
||
var cost_score = 0;
|
||
var security_score = 0;
|
||
if(arr.children!=null && arr.children!=undefined && arr.children!='' && arr.children.length>0){
|
||
htmlStr = '';
|
||
htmlStrOl = '';
|
||
for(var i=0;i<(arr.children.length/3);i++){
|
||
htmlStr += '<div class="item"></div>';
|
||
htmlStrOl += '<li data-target="#carousel-example-generic" data-slide-to="'+i+'"></li>';
|
||
}
|
||
|
||
$('.carousel-indicators').append(htmlStrOl);
|
||
$('.carousel-indicators').children().eq(0).addClass("active");
|
||
$('.carousel-inner').append(htmlStr);
|
||
$('.carousel-inner').children().eq(0).addClass("active");
|
||
$('#myTabs_water').empty();
|
||
$('#myTabContent_water').empty();
|
||
$('#myTabs_power').empty();
|
||
$('#myTabContent_power').empty();
|
||
for(var i=0;i<arr.children.length;i++){
|
||
var sname = arr.children[i].sname;
|
||
var companyID = arr.children[i].id;
|
||
var active = "active";
|
||
var contentActive = "active in";
|
||
if(i!=0){
|
||
active = "";
|
||
contentActive = "";
|
||
}
|
||
var tabStr = '';
|
||
if(i>2){
|
||
if(!$('#myTabDrop-contents_water').length > 0){
|
||
var dropdown = '<li role="presentation" class="dropdown">'+
|
||
'<a href="#" id="myTabDrop_water" class="dropdown-toggle" data-toggle="dropdown" aria-controls="myTabDrop-contents_water" aria-expanded="false">下拉列表 <span class="caret"></span></a>'+
|
||
'<ul class="dropdown-menu" aria-labelledby="myTabDrop_water" id="myTabDrop-contents_water"></ul>'+
|
||
'</li>';
|
||
$('#myTabs_water').append(dropdown);
|
||
}
|
||
tabStr = '<li class=""><a href="#'+companyID+'_water" role="tab" id="'+sname+'_tab_water" data-toggle="tab" aria-controls="'+sname+'_water" aria-expanded="false">'+sname+'</a></li>';
|
||
$('#myTabDrop-contents_water').append(tabStr);
|
||
//电量
|
||
if(!$('#myTabDrop-contents_power').length > 0){
|
||
var dropdown = '<li role="presentation" class="dropdown">'+
|
||
'<a href="#" id="myTabDrop_power" class="dropdown-toggle" data-toggle="dropdown" aria-controls="myTabDrop-contents_power" aria-expanded="false">下拉列表 <span class="caret"></span></a>'+
|
||
'<ul class="dropdown-menu" aria-labelledby="myTabDrop_power" id="myTabDrop-contents_power"></ul>'+
|
||
'</li>';
|
||
$('#myTabs_power').append(dropdown);
|
||
}
|
||
tabStr = '<li class=""><a href="#'+companyID+'_power" role="tab" id="'+sname+'_tab_power" data-toggle="tab" aria-controls="'+sname+'_power" aria-expanded="false">'+sname+'</a></li>';
|
||
$('#myTabDrop-contents_power').append(tabStr);
|
||
}else{
|
||
tabStr = '<li role="presentation" class="'+active+'"><a href="#'+companyID+'_tab_water" id="'+sname+'_water" role="tab" data-toggle="tab" aria-controls="'+sname+'_water" aria-expanded="false">'+sname+'</a></li>';
|
||
$('#myTabs_water').append(tabStr);
|
||
tabStr = '<li role="presentation" class="'+active+'"><a href="#'+companyID+'_tab_power" id="'+sname+'_power" role="tab" data-toggle="tab" aria-controls="'+sname+'_power" aria-expanded="false">'+sname+'</a></li>';
|
||
$('#myTabs_power').append(tabStr);
|
||
}
|
||
var tabContentStr='<div role="tabpanel" class="tab-pane fade '+contentActive+'" id="'+companyID+'_tab_water" aria-labelledby="'+companyID+'_tab_water">'+
|
||
'<div class="special_bar" id="'+companyID+'_water"></div>'+
|
||
'</div>';
|
||
$('#myTabContent_water').append(tabContentStr);
|
||
var tabContentStr='<div role="tabpanel" class="tab-pane fade '+contentActive+'" id="'+companyID+'_tab_power" aria-labelledby="'+companyID+'_tab_power">'+
|
||
'<div class="special_bar" id="'+companyID+'_power"></div>'+
|
||
'</div>';
|
||
$('#myTabContent_power').append(tabContentStr);
|
||
xAxisData[i]=arr.children[i].sname;
|
||
if(arr.children.length==1){
|
||
htmlStr = '<div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">';
|
||
}else{
|
||
if(arr.children.length==2){
|
||
htmlStr = '<div class="col-lg-6 col-md-6 col-sm-6 col-xs-12">';
|
||
}else{
|
||
htmlStr = '<div class="col-lg-4 col-md-4 col-sm-4 col-xs-12">';
|
||
}
|
||
}
|
||
htmlStr += '<div class="box box-widget">'+
|
||
'<div class="box-header with-border">'+
|
||
'<h3 class="box-title font-size-16"><i class="iconfont icon-ercigongshui"></i>'+arr.children[i].sname+'</h3>'+
|
||
'</div>'+
|
||
'<!-- /.box-header -->'+
|
||
'<div class="box-body">'+
|
||
'<div class="col-lg-5 col-md-5 col-sm-5 col-xs-12">'+
|
||
'<div class="col-xs-12 padding-UpDown-5">'+
|
||
'<span class="col-xs-9 text-fontcolor-gray-light">健康评价得分:</span>'+
|
||
'<span class="col-xs-3 font-size-30 line-height-20 text-fontcolor-blue health_evaluation_score_'+arr.children[i].id+'">0</span>'+
|
||
'</div>'+
|
||
'<div class="col-xs-12 padding-UpDown-5">'+
|
||
'<span class="col-xs-6 text-fontcolor-gray-light">设备: </span>'+
|
||
'<span class="col-xs-6 equipment_score_'+arr.children[i].id+'">0</span>'+
|
||
'</div>'+
|
||
'<div class="col-xs-12 padding-UpDown-5">'+
|
||
'<span class="col-xs-6 text-fontcolor-gray-light">运行: </span>'+
|
||
'<span class="col-xs-6 function_score_'+arr.children[i].id+'">0</span>'+
|
||
'</div>'+
|
||
'<div class="col-xs-12 padding-UpDown-5">'+
|
||
'<span class="col-xs-6 text-fontcolor-gray-light">成本: </span>'+
|
||
'<span class="col-xs-6 cost_score_'+arr.children[i].id+'">0</span>'+
|
||
'</div>'+
|
||
'<div class="col-xs-12 padding-UpDown-5">'+
|
||
'<span class="col-xs-6 text-fontcolor-gray-light">安全:</span>'+
|
||
'<span class="col-xs-6 security_score_'+arr.children[i].id+'">0</span>'+
|
||
'</div>'+
|
||
'</div>'+
|
||
'<div class="col-lg-7 col-md-7 col-sm-7 col-xs-12">'+
|
||
'<div class="radar center-block" id="radar_'+arr.children[i].id+'"></div>'+
|
||
'</div>'+
|
||
'<div class="col-lg-12 col-md-12 col-sm-12 col-xs-12 table-responsive">'+
|
||
'<table class="table table-condensed">'+
|
||
'<tr class="text-fontcolor-gray-light">'+
|
||
'<td></td>'+
|
||
'<td>PH</td>'+
|
||
'<td>NH<sub>3</sub>_N</td>'+
|
||
'<td>TP</td>'+
|
||
'<td>COD</td>'+
|
||
'<td>SS</td>'+
|
||
'<td>TN</td>'+
|
||
'</tr>'+
|
||
'<tr>'+
|
||
'<td class="text-fontcolor-gray-light">进水</td>'+
|
||
'<td class="inlet_PH_'+arr.children[i].id+'">0</td>'+
|
||
'<td class="inlet_HN3N_'+arr.children[i].id+'">0</td>'+
|
||
'<td class="inlet_TP_'+arr.children[i].id+'">0</td>'+
|
||
'<td class="inlet_COD_'+arr.children[i].id+'">0</td>'+
|
||
'<td class="inlet_SS_'+arr.children[i].id+'">0</td>'+
|
||
'<td class="inlet_TN_'+arr.children[i].id+'">0</td>'+
|
||
'</tr>'+
|
||
'<tr>'+
|
||
'<td class="text-fontcolor-gray-light">出水</td>'+
|
||
'<td class="effluent_PH_'+arr.children[i].id+'">0</td>'+
|
||
'<td class="effluent_HN3N_'+arr.children[i].id+'">0</td>'+
|
||
'<td class="effluent_TP_'+arr.children[i].id+'">0</td>'+
|
||
'<td class="effluent_COD_'+arr.children[i].id+'">0</td>'+
|
||
'<td class="effluent_SS_'+arr.children[i].id+'">0</td>'+
|
||
'<td class="effluent_TN_'+arr.children[i].id+'">0</td>'+
|
||
'</tr>'+
|
||
'</table>'+
|
||
'</div>'+
|
||
'</div>'+
|
||
'<!-- /.box-body -->'+
|
||
'</div>'+
|
||
'</div>';
|
||
if(i>2){
|
||
if(i>5){
|
||
if(i>8){
|
||
$('.carousel-inner').children().eq(3).append(htmlStr);
|
||
}else{
|
||
$('.carousel-inner').children().eq(2).append(htmlStr);
|
||
}
|
||
}else{
|
||
$('.carousel-inner').children().eq(1).append(htmlStr);
|
||
}
|
||
}else{
|
||
$('.carousel-inner').children().eq(0).append(htmlStr);
|
||
}
|
||
var seriesdatas = [];
|
||
var legenddata = [];
|
||
var seriesdatas_power = [];
|
||
var legenddata_power = [];
|
||
if(arr.children[i].rows!=null && arr.children[i].rows!=undefined && arr.children[i].rows!=''){
|
||
for(var j=0;j<arr.children[i].rows.length;j++){
|
||
var value =0;
|
||
var numtail=0;
|
||
var dataMax=0;
|
||
var nowdate = getNowTime();
|
||
if(arr.children[i].rows[j].visualCacheData!=null
|
||
&& arr.children[i].rows[j].visualCacheData!=undefined
|
||
&& arr.children[i].rows[j].visualCacheData!=''){
|
||
var visualCacheData = arr.children[i].rows[j].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.children[i].rows[j].mPoint!=null && arr.children[i].rows[j].mPoint!=undefined && arr.children[i].rows[j].mPoint!=''){
|
||
var mPoint = arr.children[i].rows[j].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;
|
||
}else{
|
||
if(arr.children[i].rows[j].numtail!=null && arr.children[i].rows[j].numtail!=undefined && arr.children[i].rows[j].numtail!=''){
|
||
numtail = arr.children[i].rows[j].numtail;
|
||
}
|
||
}
|
||
if(visualCacheData.insdt!=null && visualCacheData.insdt!=undefined && visualCacheData.insdt!=''){
|
||
nowdate = visualCacheData.insdt;
|
||
}
|
||
}else{
|
||
var mPoint = arr.children[i].rows[j].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;
|
||
}
|
||
}
|
||
}
|
||
value = parseFloat(value).toFixed(numtail);
|
||
if($("."+arr.children[i].rows[j].elementCode+'_'+arr.children[i].id).length > 0){
|
||
$("."+arr.children[i].rows[j].elementCode+'_'+arr.children[i].id).html(toThousands(value));
|
||
}
|
||
if(arr.children[i].rows[j].elementCode=='processing_capacity'){
|
||
processing_capacity_data_children = value;
|
||
}
|
||
if(arr.children[i].rows[j].elementCode=='actual_power_consumption'){
|
||
power_actual = value;
|
||
}
|
||
if(arr.children[i].rows[j].elementCode=='planned_power_consumption'){
|
||
power_planned = value;
|
||
}
|
||
if(arr.children[i].rows[j].elementCode=='actual_ton_water_power_consumption'){
|
||
water_power_actual = value;
|
||
var dataserie = getdataseries(arr.children[i].rows[j].mPointHistory,arr.children[i].rows[j].visualCacheDataList,numtail);
|
||
var seriesdata = {
|
||
name: arr.children[i].rows[j].name,
|
||
type: 'line',
|
||
areaStyle: {},
|
||
yAxisIndex: 1,
|
||
data: dataserie,
|
||
};
|
||
seriesdatas_power.push(seriesdata);
|
||
legenddata_power.push(arr.children[i].rows[j].name);
|
||
}
|
||
if(arr.children[i].rows[j].elementCode=='planned_ton_water_power_consumption'){
|
||
water_power_planned = value;
|
||
var dataserie = getdataseries(arr.children[i].rows[j].mPointHistory,arr.children[i].rows[j].visualCacheDataList,numtail);
|
||
var seriesdata = {
|
||
name: arr.children[i].rows[j].name,
|
||
type: 'line',
|
||
areaStyle: {},
|
||
yAxisIndex: 1,
|
||
data: dataserie,
|
||
};
|
||
seriesdatas_power.push(seriesdata);
|
||
legenddata_power.push(arr.children[i].rows[j].name);
|
||
}
|
||
if(arr.children[i].rows[j].elementCode=='patrol_inspection_completion_num'){
|
||
patrol_inspection_completion_data.push(value);
|
||
}
|
||
if(arr.children[i].rows[j].elementCode=='patrol_inspection_incompletion_num'){
|
||
patrol_inspection_incompletion_data.push(value);
|
||
}
|
||
if(arr.children[i].rows[j].elementCode=='repair_completion_num'){
|
||
repair_completion_data.push(value);
|
||
}
|
||
if(arr.children[i].rows[j].elementCode=='repair_incompletion_num'){
|
||
repair_incompletion_data.push(value);
|
||
}
|
||
if(arr.children[i].rows[j].elementCode=='maintain_completion_num'){
|
||
maintain_completion_data.push(value);
|
||
}
|
||
if(arr.children[i].rows[j].elementCode=='maintain_incompletion_num'){
|
||
maintain_incompletion_data.push(value);
|
||
}
|
||
if(arr.children[i].rows[j].elementCode=='accumulated_today'){
|
||
accumulated_today_data.push(value);
|
||
}
|
||
if(arr.children[i].rows[j].elementCode=='yesterday_processing_capacity'){
|
||
yesterday_processing_capacity_data.push(value);
|
||
}
|
||
if(arr.children[i].rows[j].elementCode=='target_water_volume'){
|
||
target_water_volume_data.push(value);
|
||
}
|
||
if(arr.children[i].rows[j].elementCode=='target_mud_volume'){
|
||
target_mud_volume_data.push(value);
|
||
}
|
||
if(arr.children[i].rows[j].elementCode=='mud_accumulated_today'){
|
||
mud_accumulated_today_data.push(value);
|
||
}
|
||
if(arr.children[i].rows[j].elementCode=='mud_accumulated_yesterday'){
|
||
mud_accumulated_yesterday_data.push(value);
|
||
}
|
||
if(arr.children[i].rows[j].elementCode=='accumulated_today'){
|
||
var dataserie = getdataseries(arr.children[i].rows[j].mPointHistory,arr.children[i].rows[j].visualCacheDataList,numtail);
|
||
var seriesdata = {
|
||
name: arr.children[i].rows[j].name,
|
||
type: 'line',
|
||
areaStyle: {},
|
||
data: dataserie,
|
||
};
|
||
seriesdatas.push(seriesdata);
|
||
legenddata.push(arr.children[i].rows[j].name);
|
||
}
|
||
if(arr.children[i].rows[j].elementCode=='target_water_volume'){
|
||
var dataserie = getdataseries(arr.children[i].rows[j].mPointHistory,arr.children[i].rows[j].visualCacheDataList,numtail);
|
||
var seriesdata = {
|
||
name: arr.children[i].rows[j].name,
|
||
type: 'line',
|
||
areaStyle: {},
|
||
data: dataserie,
|
||
};
|
||
seriesdatas.push(seriesdata);
|
||
legenddata.push(arr.children[i].rows[j].name);
|
||
}
|
||
if(arr.children[i].rows[j].elementCode=='actual_power_consumption'){
|
||
var dataserie = getdataseries(arr.children[i].rows[j].mPointHistory,arr.children[i].rows[j].visualCacheDataList,numtail);
|
||
var seriesdata = {
|
||
name: arr.children[i].rows[j].name,
|
||
type: 'line',
|
||
areaStyle: {},
|
||
data: dataserie,
|
||
};
|
||
seriesdatas_power.push(seriesdata);
|
||
legenddata_power.push(arr.children[i].rows[j].name);
|
||
}
|
||
if(arr.children[i].rows[j].elementCode=='planned_power_consumption'){
|
||
var dataserie = getdataseries(arr.children[i].rows[j].mPointHistory,arr.children[i].rows[j].visualCacheDataList,numtail);
|
||
var seriesdata = {
|
||
name: arr.children[i].rows[j].name,
|
||
type: 'line',
|
||
areaStyle: {},
|
||
data: dataserie,
|
||
};
|
||
seriesdatas_power.push(seriesdata);
|
||
legenddata_power.push(arr.children[i].rows[j].name);
|
||
}
|
||
if(arr.children[i].rows[j].elementCode=='equipment_score'){
|
||
equipment_score = value;
|
||
}
|
||
if(arr.children[i].rows[j].elementCode=='function_score'){
|
||
function_score = value;
|
||
}
|
||
if(arr.children[i].rows[j].elementCode=='cost_score'){
|
||
cost_score = value;
|
||
}
|
||
if(arr.children[i].rows[j].elementCode=='security_score'){
|
||
security_score = value;
|
||
}
|
||
}
|
||
}
|
||
showDoubleLine(companyID+"_water",legenddata,seriesdatas,[color_blueSystem[1],color_blueSystem[5]]);
|
||
showDoubleLine(companyID+"_power",legenddata_power,seriesdatas_power,[color_yellowSystem[3],color_yellowSystem[4]]);
|
||
htmlStr = '<div class="col-xs-12 padding-UpDown-5">'+
|
||
'<span class="col-xs-1 font-size-14"><i class="fa fa-circle"></i></span>'+
|
||
'<span class="col-xs-5 text-fontcolor-gray-light">'+arr.children[i].sname+'</span>'+
|
||
'<span class="col-xs-3 service_population">'+processing_capacity_data_children+'</span>'+
|
||
'<span class="col-xs-3">万吨</span>'+
|
||
'</div>';
|
||
$('.factory_list').append(htmlStr);
|
||
processing_capacity_data.push({
|
||
name: arr.children[i].sname,
|
||
value: processing_capacity_data_children,
|
||
});
|
||
var radar_data = [equipment_score,function_score,cost_score,security_score];
|
||
doRadar('radar_'+arr.children[i].id,radar_data);
|
||
}
|
||
}
|
||
doendPie('pie_processing_capacity',processing_capacity_data);
|
||
doAnnular('equipment_intact_rate',equipment_intact,"设备完好率",color_blueSystem[1]);
|
||
doAnnular('failure_shutdown_rate',failure_shutdown,"故障停机率",color_redSystem[3]);
|
||
doAnnular('patrol_inspection_completion_rate',patrol,"巡检完成率",color_blueSystem[1]);
|
||
var color = [color_redSystem[2],color_redSystem[1]];
|
||
doAnnularReverse('maintain_completion_rate',repair,maintenance,"维修完成率","保养完成率",color);
|
||
if(power_actual>=power_planned){
|
||
power_value = power_planned;
|
||
power_total = power_actual*1.1;
|
||
power_proportion1 = power_value/power_total;
|
||
power_proportion2 = power_actual/power_total;
|
||
color = color_redSystem[3];
|
||
}else{
|
||
if(power_actual<power_planned){
|
||
power_value = power_actual;
|
||
power_total = power_planned*1.1;
|
||
power_proportion1 = power_value/power_total;
|
||
power_proportion2 = power_planned/power_total;
|
||
color = color_greenSystem[1];
|
||
}
|
||
}
|
||
|
||
doGauge('power_consumption',(120*power_proportion1),power_proportion1,power_proportion2,color);
|
||
if(water_power_actual>=water_power_planned){
|
||
water_power_value = water_power_planned;
|
||
water_power_total = water_power_actual*1.1;
|
||
water_power_proportion1 = water_power_value/water_power_total;
|
||
water_power_proportion2 = water_power_actual/water_power_total;
|
||
color = color_redSystem[3];
|
||
}else{
|
||
if(water_power_actual<water_power_planned){
|
||
water_power_value = water_power_actual;
|
||
water_power_total = water_power_planned*1.1;
|
||
water_power_proportion1 = water_power_value/water_power_total;
|
||
water_power_proportion2 = water_power_planned/water_power_total;
|
||
color = color_greenSystem[1];
|
||
}
|
||
}
|
||
doGauge('ton_water_power_consumption',(120*water_power_proportion1),water_power_proportion1,water_power_proportion2,color);
|
||
var legenddata = ['已完成','未完成'];
|
||
var seriesdata=[
|
||
{
|
||
name: '已完成',
|
||
type: 'bar',
|
||
stack: 'one',
|
||
barMaxWidth:20 ,
|
||
data: patrol_inspection_completion_data
|
||
},
|
||
{
|
||
name: '未完成',
|
||
type: 'bar',
|
||
stack: 'one',
|
||
barMaxWidth:20 ,
|
||
data: patrol_inspection_incompletion_data
|
||
},
|
||
];
|
||
color = [color_blueSystem[1],color_blueSystem[5]];
|
||
doStackedBar('patrol_inspection_stacked_bar',legenddata,seriesdata,xAxisData,color);
|
||
legenddata = ['维修已完成','维修未完成','保养已完成','保养未完成'];
|
||
seriesdata=[
|
||
{
|
||
name: '维修已完成',
|
||
type: 'bar',
|
||
stack: 'one',
|
||
barMaxWidth:20 ,
|
||
data: repair_completion_data
|
||
},
|
||
{
|
||
name: '维修未完成',
|
||
type: 'bar',
|
||
stack: 'one',
|
||
barMaxWidth:20 ,
|
||
data: repair_incompletion_data
|
||
},
|
||
{
|
||
name: '保养已完成',
|
||
type: 'bar',
|
||
stack: 'two',
|
||
barMaxWidth:20 ,
|
||
data: maintain_completion_data
|
||
},
|
||
{
|
||
name: '保养未完成',
|
||
type: 'bar',
|
||
stack: 'two',
|
||
barMaxWidth:20 ,
|
||
data: maintain_incompletion_data
|
||
}
|
||
];
|
||
var color = [color_redSystem[2],color_redSystem[4],color_redSystem[1],color_redSystem[5]];
|
||
doStackedBar('maintain_stacked_bar',legenddata,seriesdata,xAxisData,color);
|
||
legenddata=['今日水处理量','昨日水处理量','计划水处理量'];
|
||
seriesdata = [
|
||
{
|
||
name: '计划水处理量',
|
||
type: 'bar',
|
||
xAxisIndex: 1,
|
||
barWidth: 30,
|
||
itemStyle: {
|
||
color: 'none',
|
||
borderColor: color_blueSystem[5] ,
|
||
borderWidth: 2 ,
|
||
borderType: 'dashed' ,
|
||
},
|
||
data: target_water_volume_data,
|
||
},
|
||
{
|
||
name: '无用',
|
||
type: 'bar',
|
||
xAxisIndex: 1,
|
||
barWidth: 24,
|
||
},
|
||
{
|
||
name: '今日水处理量',
|
||
type: 'bar',
|
||
barWidth: 25,
|
||
data: accumulated_today_data,
|
||
},
|
||
{
|
||
name: '昨日水处理量',
|
||
type: 'bar',
|
||
barWidth: 25,
|
||
data: yesterday_processing_capacity_data,
|
||
},
|
||
]
|
||
color = [color_blueSystem[5],color_blueSystem[1]];
|
||
//doBarSpecial('water_treatment',legenddata,seriesdata,xAxisData,color);
|
||
legenddata=['今日泥处理量','昨日泥处理量','计划泥处理量'];
|
||
seriesdata = [
|
||
{
|
||
name: '计划泥处理量',
|
||
type: 'bar',
|
||
xAxisIndex: 1,
|
||
barWidth: 30,
|
||
itemStyle: {
|
||
color: 'none',
|
||
borderColor: color_yellowSystem[1] ,
|
||
borderWidth: 2 ,
|
||
borderType: 'dashed' ,
|
||
},
|
||
data: target_mud_volume_data,
|
||
},
|
||
{
|
||
name: '无用',
|
||
type: 'bar',
|
||
xAxisIndex: 1,
|
||
barWidth: 24,
|
||
},
|
||
{
|
||
name: '今日泥处理量',
|
||
type: 'bar',
|
||
barWidth: 25,
|
||
data: mud_accumulated_today_data,
|
||
},
|
||
{
|
||
name: '昨日泥处理量',
|
||
type: 'bar',
|
||
barWidth: 25,
|
||
data: mud_accumulated_yesterday_data,
|
||
},
|
||
]
|
||
color = [color_yellowSystem[1],color_yellowSystem[0]];
|
||
// doBarSpecial('mud_treatment',legenddata,seriesdata,xAxisData,color);
|
||
$('.carousel').carousel({
|
||
interval: 500000,
|
||
});
|
||
});
|
||
|
||
}
|
||
function doStackedBar(id,legenddata,seriesdata,xAxisData,color){
|
||
var lifeChart = echarts.getInstanceByDom(document.getElementById(id));
|
||
//有的话就获取已有echarts实例的DOM节点。
|
||
if (lifeChart != null) { // 如果存在,就进行销毁。
|
||
lifeChart.dispose();
|
||
}
|
||
var option = {
|
||
color:color,
|
||
grid: {
|
||
top: '18%',
|
||
left: '2%',
|
||
right: '2%',
|
||
bottom:'5%',
|
||
containLabel: true
|
||
},
|
||
legend: {
|
||
data: legenddata,
|
||
x: 'left',
|
||
icon: 'circle',
|
||
},
|
||
tooltip: {},
|
||
xAxis: {
|
||
data: xAxisData,
|
||
},
|
||
yAxis: {},
|
||
series: seriesdata
|
||
};
|
||
lifeChart = echarts.init(document.getElementById(id));
|
||
lifeChart.setOption(option,true);
|
||
}
|
||
|
||
function doendPie(id,data){
|
||
var lifeChart = echarts.getInstanceByDom(document.getElementById(id));
|
||
//有的话就获取已有echarts实例的DOM节点。
|
||
if (lifeChart != null) { // 如果存在,就进行销毁。
|
||
lifeChart.dispose();
|
||
}
|
||
var option = {
|
||
color: color_blueSystem,
|
||
title: {
|
||
text: '各厂处理能力占比',
|
||
textStyle:{
|
||
fontSize:14,
|
||
},
|
||
left: 'center',
|
||
},
|
||
tooltip: {
|
||
trigger: 'item'
|
||
},
|
||
series: [
|
||
{
|
||
name: '处理量',
|
||
type: 'pie',
|
||
radius: '70%',
|
||
data: data,
|
||
label: {
|
||
show: false,
|
||
position: 'center'
|
||
},
|
||
labelLine: {
|
||
show: false
|
||
},
|
||
}
|
||
]
|
||
};
|
||
lifeChart = echarts.init(document.getElementById(id));
|
||
lifeChart.setOption(option,true);
|
||
}
|
||
function doGauge(id,data,proportion1,proportion2,color){
|
||
var lifeChart = echarts.getInstanceByDom(document.getElementById(id));
|
||
//有的话就获取已有echarts实例的DOM节点。
|
||
if (lifeChart != null) { // 如果存在,就进行销毁。
|
||
lifeChart.dispose();
|
||
}
|
||
var option = {
|
||
series: [
|
||
{
|
||
type: 'gauge',
|
||
splitNumber: 20,
|
||
radius: '95%',
|
||
min: 0,
|
||
max: 120,
|
||
axisLine: {
|
||
lineStyle: {
|
||
color: [
|
||
[proportion1, '#0088FF'],
|
||
[proportion2, color],
|
||
[1, '#E6E6E6']
|
||
]
|
||
}
|
||
},
|
||
pointer: {
|
||
itemStyle: {
|
||
color: 'auto'
|
||
}
|
||
},
|
||
axisTick: {
|
||
show: false
|
||
},
|
||
splitLine: {
|
||
distance: -30,
|
||
length: 30,
|
||
lineStyle: {
|
||
color: '#fff',
|
||
width: 5
|
||
}
|
||
},
|
||
axisLabel: {
|
||
color: '#000',
|
||
fontSize: 12,
|
||
formatter: function (value) {
|
||
if(value%10==0){
|
||
return value;
|
||
}else{
|
||
return "";
|
||
}
|
||
}
|
||
},
|
||
|
||
pointer: {
|
||
length: '70%' ,
|
||
width: 3 ,
|
||
itemStyle: {
|
||
color: '#000'
|
||
}
|
||
},
|
||
anchor: {
|
||
show: true,
|
||
showAbove: true ,
|
||
size:11,
|
||
itemStyle: {
|
||
color: '#000',
|
||
}
|
||
},
|
||
detail: {
|
||
show:false
|
||
},
|
||
data: [
|
||
{
|
||
value: data
|
||
}
|
||
]
|
||
}
|
||
]
|
||
};
|
||
lifeChart = echarts.init(document.getElementById(id));
|
||
lifeChart.setOption(option,true);
|
||
}
|
||
function doAnnular(id,data,title,color){
|
||
var lifeChart = echarts.getInstanceByDom(document.getElementById(id));
|
||
//有的话就获取已有echarts实例的DOM节点。
|
||
if (lifeChart != null) { // 如果存在,就进行销毁。
|
||
lifeChart.dispose();
|
||
}
|
||
var option = {
|
||
color:[color],
|
||
series: [
|
||
{
|
||
type: 'gauge',
|
||
startAngle: 90,
|
||
endAngle: -270,
|
||
radius: '95%',
|
||
pointer: {
|
||
show: false
|
||
},
|
||
progress: {
|
||
show: true,
|
||
roundCap: true,
|
||
clip: false,
|
||
},
|
||
splitLine: {
|
||
show: false,
|
||
},
|
||
axisTick: {
|
||
show: false
|
||
},
|
||
axisLabel: {
|
||
show: false,
|
||
distance: 50
|
||
},
|
||
axisLine: {
|
||
lineStyle: {
|
||
width: 8
|
||
}
|
||
},
|
||
data: [
|
||
{
|
||
value: data,
|
||
name: title,
|
||
title: {
|
||
offsetCenter: ['0%', '-40%']
|
||
},
|
||
detail: {
|
||
valueAnimation: true,
|
||
offsetCenter: ['0%', '30%']
|
||
}
|
||
}
|
||
],
|
||
title: {
|
||
fontSize: 14
|
||
},
|
||
detail: {
|
||
fontSize: 40,
|
||
fontWeight:400,
|
||
color: 'auto',
|
||
formatter: '{value}%'
|
||
}
|
||
}
|
||
]
|
||
};
|
||
lifeChart = echarts.init(document.getElementById(id));
|
||
lifeChart.setOption(option,true);
|
||
}
|
||
function doAnnularReverse(id,data1,data2,title1,title2,color){
|
||
var lifeChart = echarts.getInstanceByDom(document.getElementById(id));
|
||
//有的话就获取已有echarts实例的DOM节点。
|
||
if (lifeChart != null) { // 如果存在,就进行销毁。
|
||
lifeChart.dispose();
|
||
}
|
||
var option = {
|
||
color:color,
|
||
series: [
|
||
{
|
||
type: 'gauge',
|
||
startAngle: 180,
|
||
endAngle: 0,
|
||
radius: '85%',
|
||
pointer: {
|
||
show: false
|
||
},
|
||
progress: {
|
||
show: true,
|
||
roundCap: true,
|
||
clip: false,
|
||
},
|
||
splitLine: {
|
||
show: false,
|
||
},
|
||
axisTick: {
|
||
show: false
|
||
},
|
||
axisLabel: {
|
||
show: false,
|
||
distance: 50
|
||
},
|
||
axisLine: {
|
||
lineStyle: {
|
||
width: 8
|
||
}
|
||
},
|
||
data: [
|
||
{
|
||
value: data1,
|
||
name: title1+"%",
|
||
title: {
|
||
offsetCenter: ['0%', '-120%']
|
||
},
|
||
detail: {
|
||
valueAnimation: true,
|
||
offsetCenter: ['0%', '-25%']
|
||
}
|
||
}
|
||
],
|
||
title: {
|
||
fontSize: 14
|
||
},
|
||
detail: {
|
||
fontSize: 40,
|
||
fontWeight:400,
|
||
color: 'auto',
|
||
formatter: '{value}'
|
||
}
|
||
},
|
||
{
|
||
type: 'gauge',
|
||
startAngle: 0,
|
||
endAngle: -180,
|
||
clockwise: false ,
|
||
radius: '85%',
|
||
pointer: {
|
||
show: false
|
||
},
|
||
progress: {
|
||
show: true,
|
||
roundCap: true,
|
||
clip: false,
|
||
},
|
||
splitLine: {
|
||
show: false,
|
||
},
|
||
axisTick: {
|
||
show: false
|
||
},
|
||
axisLabel: {
|
||
show: false,
|
||
distance: 50
|
||
},
|
||
axisLine: {
|
||
lineStyle: {
|
||
width: 8
|
||
}
|
||
},
|
||
data: [
|
||
{
|
||
value: data2,
|
||
name: title2+"%",
|
||
title: {
|
||
offsetCenter: ['0%', '125%']
|
||
},
|
||
detail: {
|
||
valueAnimation: true,
|
||
offsetCenter: ['0%', '40%']
|
||
}
|
||
}
|
||
],
|
||
title: {
|
||
fontSize: 14
|
||
},
|
||
detail: {
|
||
fontSize: 40,
|
||
fontWeight:400,
|
||
color: 'auto',
|
||
formatter: '{value}'
|
||
}
|
||
}
|
||
]
|
||
};
|
||
lifeChart = echarts.init(document.getElementById(id));
|
||
lifeChart.setOption(option,true);
|
||
}
|
||
|
||
function doBarSpecial(id,legenddata,seriesdata,xAxisData,color){
|
||
var lifeChart = echarts.getInstanceByDom(document.getElementById(id));
|
||
//有的话就获取已有echarts实例的DOM节点。
|
||
if (lifeChart != null) { // 如果存在,就进行销毁。
|
||
lifeChart.dispose();
|
||
}
|
||
var option = {
|
||
color:color,
|
||
tooltip: {
|
||
trigger: 'axis'
|
||
},
|
||
grid: {
|
||
top: '14%',
|
||
left: '2%',
|
||
right: '2%',
|
||
bottom:'5%',
|
||
containLabel: true
|
||
},
|
||
legend: {
|
||
data: legenddata,
|
||
icon: 'circle',
|
||
x:'left',
|
||
},
|
||
calculable: true,
|
||
xAxis: [
|
||
{
|
||
type: 'category',
|
||
data: xAxisData
|
||
},
|
||
{
|
||
type: 'category',
|
||
show: false,
|
||
data: xAxisData
|
||
}
|
||
],
|
||
yAxis: [
|
||
{
|
||
type: 'value'
|
||
}
|
||
],
|
||
series: seriesdata
|
||
};
|
||
lifeChart = echarts.init(document.getElementById(id));
|
||
lifeChart.setOption(option,true);
|
||
}
|
||
function doRadar(id,data){
|
||
var lifeChart = echarts.getInstanceByDom(document.getElementById(id));
|
||
//有的话就获取已有echarts实例的DOM节点。
|
||
if (lifeChart != null) { // 如果存在,就进行销毁。
|
||
lifeChart.dispose();
|
||
}
|
||
var option = {
|
||
tooltip: {
|
||
trigger: 'axis'
|
||
},
|
||
radar: [
|
||
{
|
||
indicator: [
|
||
{ text: '设备', max: 100 },
|
||
{ text: '运行', max: 100 },
|
||
{ text: '成本', max: 100 },
|
||
{ text: '安全', max: 100 }
|
||
],
|
||
|
||
radius: '60%'
|
||
},
|
||
],
|
||
series: [
|
||
{
|
||
type: 'radar',
|
||
symbolSize :5,
|
||
lineStyle: {
|
||
width: 1 ,
|
||
},
|
||
areaStyle: {
|
||
color:'#1188FF',
|
||
opacity: 0.2,
|
||
},
|
||
tooltip: {
|
||
trigger: 'item'
|
||
},
|
||
data: [
|
||
{
|
||
value: data,
|
||
name: '健康评价得分'
|
||
}
|
||
]
|
||
}
|
||
]
|
||
};
|
||
lifeChart = echarts.init(document.getElementById(id));
|
||
lifeChart.setOption(option,true);
|
||
}
|
||
|
||
function showDoubleLine(id,legenddata,seriesdata,color){
|
||
var lifeChart = echarts.getInstanceByDom(document.getElementById(id));
|
||
//有的话就获取已有echarts实例的DOM节点。
|
||
if (lifeChart != null) { // 如果存在,就进行销毁。
|
||
lifeChart.dispose();
|
||
}
|
||
var option = {
|
||
color:color,
|
||
tooltip: {
|
||
trigger: 'axis',
|
||
},
|
||
grid: {
|
||
top:'13%',
|
||
left: '3%',
|
||
right: '4%',
|
||
bottom: '3%',
|
||
containLabel: true
|
||
},
|
||
legend: {
|
||
data: legenddata,
|
||
icon: 'circle',
|
||
x:'left',
|
||
},
|
||
xAxis: {
|
||
type: 'category',
|
||
boundaryGap: false,
|
||
splitLine: {
|
||
show: true ,
|
||
lineStyle: {
|
||
color: ['#aaa'] ,
|
||
type: 'dashed' ,
|
||
}
|
||
},
|
||
},
|
||
yAxis: [{
|
||
type: 'value',
|
||
splitLine: {
|
||
show: true ,
|
||
lineStyle: {
|
||
color: ['#aaa'] ,
|
||
type: 'dashed' ,
|
||
}
|
||
},
|
||
},{
|
||
type: 'value',
|
||
splitLine: {
|
||
show: true ,
|
||
lineStyle: {
|
||
color: ['#aaa'] ,
|
||
type: 'dashed' ,
|
||
}
|
||
},
|
||
}],
|
||
series: seriesdata
|
||
};
|
||
|
||
var myChart = echarts.init(document.getElementById(id));//有的话就获取已有echarts实例的DOM节点。
|
||
myChart.setOption(option, true);
|
||
}
|
||
//添加千分位符合
|
||
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;
|
||
}
|
||
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;
|
||
}
|
||
</script>
|
||
|
||
</head>
|
||
<body class="hold-transition ${cu.themeclass} sidebar-mini">
|
||
<div class="wrapper">
|
||
<div class="content-wrapper text-fontcolor-black font-size-14">
|
||
<!-- BEGIN CONTAINER -->
|
||
<input type="hidden" name="jsp_id" id="jsp_id" value="zengCheng">
|
||
<div class="col-lg-4 col-md-4 col-sm-4 col-xs-12">
|
||
<div class="box box-widget">
|
||
<div class="box-header with-border">
|
||
<h3 class="box-title font-size-16">${unitSname}概况</h3>
|
||
</div>
|
||
<!-- /.box-header -->
|
||
<div class="box-body">
|
||
<div class="col-lg-5 col-md-5 col-sm-5 col-xs-12 padding-UpDown-5">
|
||
<div class="col-xs-12 padding-UpDown-5">
|
||
<span class="col-xs-5 text-fontcolor-gray-light">下属厂区:</span>
|
||
<span class="col-xs-3 subordinate_factory">0</span>
|
||
<span class="col-xs-4">个</span>
|
||
</div>
|
||
<div class="col-xs-12 padding-UpDown-5">
|
||
<span class="col-xs-5 text-fontcolor-gray-light">服务面积:</span>
|
||
<span class="col-xs-3 service_area">0</span>
|
||
<span class="col-xs-4">平方米</span>
|
||
</div>
|
||
<div class="col-xs-12 padding-UpDown-5">
|
||
<span class="col-xs-5 text-fontcolor-gray-light">服务人口: </span>
|
||
<span class="col-xs-3 service_population">0</span>
|
||
<span class="col-xs-4">万人 </span>
|
||
</div>
|
||
<div class="col-xs-12 padding-UpDown-5">
|
||
<span class="col-xs-5 text-fontcolor-gray-light">处理能力:</span>
|
||
<span class="col-xs-3 processing_capacity">0</span>
|
||
<span class="col-xs-4">万立方米</span>
|
||
</div>
|
||
</div>
|
||
<div class="col-lg-7 col-md-7 col-sm-7 col-xs-12">
|
||
<div class="box box-blue box-solid text-center text-fontcolor-blue">
|
||
<div class="box-header with-border">
|
||
<h3 class="box-title text-fontcolor-white">处理总量信息（万吨）</h3>
|
||
</div>
|
||
<!-- /.box-header -->
|
||
<div class="box-body">
|
||
<div class="col-xs-12">
|
||
<span class="col-xs-4">昨日处理量</span>
|
||
<span class="col-xs-4">今日累计</span>
|
||
<span class="col-xs-4">目标水量</span>
|
||
</div>
|
||
<div class="col-xs-12">
|
||
<span class="col-xs-4 font-size-40 yesterday_processing_capacity">0</span>
|
||
<span class="col-xs-4 font-size-40 accumulated_today">0</span>
|
||
<span class="col-xs-4 font-size-40 target_water_volume">0</span>
|
||
<!-- <div class="col-xs-4">
|
||
<span class="col-xs-12 font-size-20 target_water_volume">0</span>
|
||
<span class="col-xs-12 font-size-20 water_difference">0</span>
|
||
</div> -->
|
||
</div>
|
||
</div>
|
||
<!-- /.box-body -->
|
||
</div>
|
||
</div>
|
||
<div class="col-lg-5 col-md-5 col-sm-5 col-xs-12">
|
||
<div class="pie_processing_capacity" id="pie_processing_capacity"></div>
|
||
</div>
|
||
<div class="col-lg-7 col-md-7 col-sm-7 col-xs-12 factory_list">
|
||
|
||
</div>
|
||
</div>
|
||
<!-- /.box-body -->
|
||
</div>
|
||
<div class="box box-widget">
|
||
<div class="box-header with-border">
|
||
<h3 class="box-title font-size-16"><i class="iconfont icon-caiwu"></i>成本</h3>
|
||
</div>
|
||
<!-- /.box-header -->
|
||
<div class="box-body">
|
||
<div class="col-lg-2 col-md-2 col-sm-2 col-xs-12">
|
||
<div class="box box-blue box-solid text-center text-fontcolor-blue">
|
||
<div class="box-header with-border">
|
||
<h3 class="box-title text-fontcolor-white font-size-14">用电量(万kwh)</h3>
|
||
</div>
|
||
<!-- /.box-header -->
|
||
<div class="box-body">
|
||
<span class="col-xs-12 font-size-40 actual_power_consumption">0</span>
|
||
<div class="col-xs-12">
|
||
<span class="col-xs-7">计划</span>
|
||
<span class="col-xs-5 planned_power_consumption">0</span>
|
||
</div>
|
||
<div class="col-xs-12 text-fontcolor-red">
|
||
<span class="col-xs-7">超支</span>
|
||
<span class="col-xs-5 difference_power_consumption">0</span>
|
||
</div>
|
||
</div>
|
||
<!-- /.box-body -->
|
||
</div>
|
||
</div>
|
||
<div class="col-lg-4 col-md-4 col-sm-4 col-xs-12">
|
||
<div class="dashboard" id="power_consumption"></div>
|
||
</div>
|
||
<div class="col-lg-2 col-md-2 col-sm-2 col-xs-12">
|
||
<div class="box box-blue box-solid text-center text-fontcolor-blue">
|
||
<div class="box-header with-border">
|
||
<h3 class="box-title text-fontcolor-white font-size-14">吨水电耗(万吨/日)</h3>
|
||
</div>
|
||
<!-- /.box-header -->
|
||
<div class="box-body">
|
||
<span class="col-xs-12 font-size-40 actual_ton_water_power_consumption">0</span>
|
||
<div class="col-xs-12">
|
||
<span class="col-xs-7">计划</span>
|
||
<span class="col-xs-5 planned_ton_water_power_consumption">0</span>
|
||
</div>
|
||
<div class="col-xs-12 text-fontcolor-green">
|
||
<span class="col-xs-7">节约</span>
|
||
<span class="col-xs-5 difference_ton_water_power_consumption">0</span>
|
||
</div>
|
||
</div>
|
||
<!-- /.box-body -->
|
||
</div>
|
||
</div>
|
||
<div class="col-lg-4 col-md-4 col-sm-4 col-xs-12">
|
||
<div class="dashboard" id="ton_water_power_consumption"></div>
|
||
</div>
|
||
</div>
|
||
<!-- /.box-body -->
|
||
</div>
|
||
<div class="box box-widget">
|
||
<div class="box-header with-border">
|
||
<h3 class="box-title font-size-16"><i class="iconfont icon-shuibeng"></i>设备概况</h3>
|
||
</div>
|
||
<!-- /.box-header -->
|
||
<div class="box-body">
|
||
<div class="col-lg-7 col-md-7 col-sm-7 col-xs-12">
|
||
<div class="col-lg-6 col-md-6 col-sm-6 col-xs-12">
|
||
<div class="annular" id="equipment_intact_rate"></div>
|
||
</div>
|
||
<div class="col-lg-6 col-md-6 col-sm-6 col-xs-12">
|
||
<div class="annular" id="failure_shutdown_rate"></div>
|
||
</div>
|
||
</div>
|
||
<div class="col-lg-5 col-md-5 col-sm-5 col-xs-12">
|
||
<div class="box box-blue box-solid text-center text-fontcolor-blue">
|
||
<div class="box-header with-border">
|
||
<h3 class="box-title text-fontcolor-white">异常故障</h3>
|
||
</div>
|
||
<!-- /.box-header -->
|
||
<div class="box-body">
|
||
<div class="col-xs-12">
|
||
<span class="col-xs-6 font-size-40 report_fault">0</span>
|
||
<span class="col-xs-6 font-size-40 abnormal_alarm">0</span>
|
||
</div>
|
||
<div class="col-xs-12">
|
||
<span class="col-xs-6">上报故障</span>
|
||
<span class="col-xs-6">异常报警</span>
|
||
</div>
|
||
</div>
|
||
<!-- /.box-body -->
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- /.box-body -->
|
||
</div>
|
||
</div>
|
||
<div class="col-lg-8 col-md-8 col-sm-8 col-xs-12">
|
||
<div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
|
||
<div id="carousel-example-generic" class="carousel slide" data-ride="carousel">
|
||
<ol class="carousel-indicators">
|
||
<!-- <li data-target="#carousel-example-generic" data-slide-to="0" class="active"></li>
|
||
<li data-target="#carousel-example-generic" data-slide-to="1" class=""></li>
|
||
<li data-target="#carousel-example-generic" data-slide-to="2" class=""></li> -->
|
||
</ol>
|
||
<div class="carousel-inner">
|
||
|
||
</div>
|
||
<a class="left carousel-control" href="#carousel-example-generic" data-slide="prev">
|
||
<span class="fa fa-angle-left"></span>
|
||
</a>
|
||
<a class="right carousel-control" href="#carousel-example-generic" data-slide="next">
|
||
<span class="fa fa-angle-right"></span>
|
||
</a>
|
||
</div>
|
||
</div>
|
||
<div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
|
||
<div class="box box-widget">
|
||
<!-- /.box-header -->
|
||
<div class="box-body">
|
||
<div class="col-lg-6 col-md-6 col-sm-6 col-xs-12">
|
||
<div class="col-xs-12 padding-UpDown-10">
|
||
<span class="col-lg-4 col-md-4 col-sm-5 col-xs-12">近7日水处理量(万吨）</span>
|
||
<div class="col-lg-8 col-md-8 col-sm-7 col-xs-12">
|
||
<!-- Nav tabs -->
|
||
<ul id="myTabs_water" class="nav nav-tabs pull-right" role="tablist"></ul>
|
||
</div>
|
||
<!-- <span class="col-lg-3 col-md-3 col-sm-3 col-xs-12 text-fontcolor-gray-light">今日处理总量</span>
|
||
<span class="col-lg-1 col-md-1 col-sm-1 col-xs-12 accumulated_today">0</span>
|
||
<span class="col-lg-2 col-md-2 col-sm-2 col-xs-12 text-fontcolor-gray-light">目标</span>
|
||
<span class="col-lg-1 col-md-1 col-sm-1 col-xs-12 target_water_volume">0</span> -->
|
||
</div>
|
||
<div class="col-xs-12">
|
||
<div id="myTabContent_water" class="tab-content"></div>
|
||
</div>
|
||
</div>
|
||
<div class="col-lg-6 col-md-6 col-sm-6 col-xs-12">
|
||
<div class="col-xs-12 padding-UpDown-10">
|
||
<span class="col-lg-4 col-md-4 col-sm-5 col-xs-12">近7日用电量(万kwh）</span>
|
||
<div class="col-lg-8 col-md-8 col-sm-7 col-xs-12">
|
||
<!-- Nav tabs -->
|
||
<ul id="myTabs_power" class="nav nav-tabs pull-right" role="tablist"></ul>
|
||
</div>
|
||
<!-- <span class="col-lg-3 col-md-3 col-sm-3 col-xs-12 text-fontcolor-gray-light">今日处理总量</span>
|
||
<span class="col-lg-1 col-md-1 col-sm-1 col-xs-12 mud_accumulated_today">0</span>
|
||
<span class="col-lg-2 col-md-2 col-sm-2 col-xs-12 text-fontcolor-gray-light">目标</span>
|
||
<span class="col-lg-1 col-md-1 col-sm-1 col-xs-12 target_mud_volume">0</span> -->
|
||
</div>
|
||
<div class="col-xs-12">
|
||
<div id="myTabContent_power" class="tab-content"></div>
|
||
<!-- <div class="special_bar" id="mud_treatment"></div> -->
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- /.box-body -->
|
||
</div>
|
||
<div class="box box-widget">
|
||
<div class="box-header with-border">
|
||
<h3 class="box-title font-size-16"><i class="iconfont icon-gongdanbaobiao"></i>工单统计</h3>
|
||
</div>
|
||
<!-- /.box-header -->
|
||
<div class="box-body">
|
||
<div class="col-lg-2 col-md-2 col-sm-2 col-xs-12">
|
||
<div class="annular_reverse" id="patrol_inspection_completion_rate"></div>
|
||
</div>
|
||
<div class="col-lg-3 col-md-3 col-sm-3 col-xs-12">
|
||
<div class="stacked_bar_one" id="patrol_inspection_stacked_bar"></div>
|
||
</div>
|
||
<div class="col-lg-2 col-md-2 col-sm-2 col-xs-12">
|
||
<div class="annular_reverse" id="maintain_completion_rate"></div>
|
||
</div>
|
||
<div class="col-lg-5 col-md-5 col-sm-5 col-xs-12">
|
||
<div class="stacked_bar_two" id="maintain_stacked_bar"></div>
|
||
</div>
|
||
</div>
|
||
<!-- /.box-body -->
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</body>
|
||
</html> |