Files
SIPAIIS_WMS_JSSW/WebRoot/jsp/work/overviewProduce2020.jsp

2179 lines
69 KiB
Plaintext
Raw Normal View History

2026-01-16 14:13:44 +08:00
<%@ page language="java" pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jstl/core_rt" prefix="c"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt"%>
<%@ page import="com.sipai.entity.base.ServerObject"%>
<%@ taglib uri="http://www.springsecurity.org/jsp" prefix="security"%>
<%@page import="com.sipai.entity.scada.MPoint"%>
<%request.setAttribute("Flag_Enable",MPoint.Flag_Enable);%>
<%request.setAttribute("Flag_Disable",MPoint.Flag_Disable);%>
<!DOCTYPE html>
<!-- <html lang="zh-CN"> -->
<!-- BEGIN HEAD -->
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title><%= ServerObject.atttable.get("TOPTITLE")%></title>
<!-- 引用页头及CSS页-->
<jsp:include page="/jsp/inc.jsp"></jsp:include>
<style>
html{height:100%}
body{height:100%;margin:0px;padding:0px}
#container{height:100%}
.box-top {
height:300px;
padding:10px ;
}
.box-bottom{
height:240px;
padding:10px ;
}
.box-middle{
height:355px;
padding:10px ;
}
.box-middle >.box-body{
padding-bottom: 0 ;
}
.box.box-white {
border-top: 0;
}
.box-body{
}
.box-header .box-title{
font-size: 16px;
font-family: MicrosoftYaHei
}
.box.box-white .box-border{
padding:0 10px;
}
.box.box-white .box-border >.box-border-left{
width: 50px;
height: 4px;
background: #c4e2e6;
border-radius: 4px;
float:left;
}
.box.box-white .box-border >.box-border-right{
width: calc(100% - 50px);
height: 3px;
border-bottom: 2px solid #f6f7fa;
border-radius: 4px;
float:right;
}
.lable-right{
font-size: 15px;
font-family: MicrosoftYaHei;
font-weight: 600;
color: #1d1e1f;
line-height: 20px;
letter-spacing: 1px;
}
.lable-right1{
font-size: 12px
font-family: MicrosoftYaHei;
font-weight: 600;
color: #1D1E1F;
line-height: 18px;
letter-spacing: 1px;
text-align: center;
}
.lable-right_2{
font-size: 14px
font-family: MicrosoftYaHei;
font-weight: 600;
color: #1D1E1F;
line-height: 18px;
letter-spacing: 1px;
text-align: center;
}
.lable-right_21{
font-size: 20px
font-family: MicrosoftYaHei;
font-weight: 600;
color: #1D1E1F;
line-height: 16px;
letter-spacing: 1px;
text-align: center;
}
.lable-left{
font-size: 14px;
font-family: MicrosoftYaHei;
color: #68696b;
line-height: 20px;
letter-spacing: 1px;
}
.icon1{
display: inline-block;
width: 48px;
height: 48px;
background-image: url(../../IMG/sy/sy1.jpg) ;
background-position: left left;
background-size: 42px 42px;
background-repeat: no-repeat;
padding-top:20px;
}
.icon2{
display: inline-block;
width: 48px;
height: 48px;
background-image: url(../../IMG/sy/sy4.jpg) ;
background-position: left left;
background-size: 48px 48px;
background-repeat: no-repeat;
padding-top:20px;
}
.icon3{
display: inline-block;
width: 48px;
height: 48px;
background-image: url(../../IMG/sy/sy5.jpg) ;
background-position: left left;
background-size: 48px 48px;
background-repeat: no-repeat;
padding-top:20px;
}
.icon4{
display: inline-block;
width: 48px;
height: 48px;
background-image: url(../../IMG/sy/sy6.jpg) ;
background-position: left left;
background-size: 48px 48px;
background-repeat: no-repeat;
padding-top:20px;
}
.icon5{
display: inline-block;
width:48px;
height: 48px;
background-image: url(../../IMG/sy/sy7.jpg) ;
background-position: left left;
background-size: 48px 48px;
background-repeat: no-repeat;
padding-top:20px;
float:left;
}
.icon6{
display: inline-block;
width: 43px;
height: 43px;
background-image: url(../../IMG/sy/sy8.jpg) ;
background-position: left left;
background-size: 42px 42px;
background-repeat: no-repeat;
padding-top:20px; margin-left: 8px;
}
.icon7{
display: inline-block;
width: 42px;
height: 43px;
background-image: url(../../IMG/sy/sy9.jpg) ;
background-position: left left;
background-size: 48px 48px;
background-repeat: no-repeat;
padding-top:20px;
}
.sys1{
background-image: url(../../IMG/sy/sy2.jpg) ;
background-position: center center;
background-size: 345px 580px;
background-repeat: no-repeat;
}
.sys3{
display: inline-block;
width: 902px;
height: 884px;
background-image: url(../../IMG/sy/sy3.png) ;
background-position: center center;
background-size: 902px 884px;
background-repeat: no-repeat;
}
.dl-horizontal{
margin-top:10px;
}
.dl-horizontal>dt{
font-weight:initial;
text-align: left;
width: 80px;
height: 20px;
margin-bottom:13px;
}
.dl-horizontal.dl-horizontal-right>dt{
width: 180px;
text-align: right;
margin-bottom:17px;
}
.dl-horizontal.dl-horizontal-right>dd{
margin-left: 180px;
margin-bottom:17px;
}
.dl-horizontal>dd{
margin-left: 80px;
height: 20px;
text-align: left;
margin-bottom:13px;
}
.dl-horizontal>.font-blue{
color: #3e99e8;
}
.dl-horizontal>.font-red{
color: #F55945;
}
.dl-horizontal>.font-yellow{
color: #F0B253;
}
.yesterday{
float:right;
width:50%;
height:70px;
text-align:center;
border-left:1px solid #e5e5e5;
margin-top:15px;
}
.yesterday-title{
height: 24px;
background: #3883ff;
font-size: 12px;
padding-top:3px;
font-family: MicrosoftYaHei, MicrosoftYaHei-Bold;
font-weight: 700;
color: #ffffff;
line-height: 16px;
letter-spacing: 1px;
margin-left:30px;
margin-right:22px;
}
.yesterday-num{
margin-top:10px;
margin-left:30px;
margin-right:22px;
border-bottom:1px solid #e5e5e5;
font-size: 18px;
font-family: Helvetica, Helvetica-Bold;
font-weight: 700;
text-align: center;
color: #161616;
height: 35px;
line-height: 25px;
letter-spacing: 2px;
}
.lable-green{
font-size: 40px;
font-family: MicrosoftYaHei, MicrosoftYaHei-Bold;
font-weight: 700;
text-align: center;
color: #00CCCC;
line-height: 18px;
}
.lable-green2{
font-size: 32px;
font-family: MicrosoftYaHei, MicrosoftYaHei-Bold;
font-weight: 700;
text-align: center;
color: #00CCCC;
line-height: 18px;
}
.lable-green3{
font-size: 28px;
font-family: MicrosoftYaHei, MicrosoftYaHei-Bold;
font-weight: 700;
text-align: center;
color: #0988FF;
line-height: 18px;
}
.lable-green4{
font-size: 28px;
font-family: MicrosoftYaHei, MicrosoftYaHei-Bold;
font-weight: 700;
text-align: center;
color: #E06012;
line-height: 18px;
}
.lable-green5{
font-size: 28px;
font-family: MicrosoftYaHei, MicrosoftYaHei-Bold;
font-weight: 700;
text-align: center;
color: #FE8841;
line-height: 18px;
}
.lable-green6{
font-size: 36px;
font-family: MicrosoftYaHei, MicrosoftYaHei-Bold;
font-weight:1000;
text-align: center;
color: #00CCCC;
line-height:18px;
vertical-align:top;
}
.lable-green1{
font-size: 40px;
font-family: MicrosoftYaHei, MicrosoftYaHei-Bold;
font-weight: 700;
text-align: center;
color: #000000;
line-height: 72px;
}
.lable-green-small{
font-size: 30px;
font-family: MicrosoftYaHei, MicrosoftYaHei-Bold;
font-weight: 700;
text-align: left;
color: #00cccc;
line-height: 42px;
}
.lable-green1-small{
font-size: 16px;
font-family: MicrosoftYaHei, MicrosoftYaHei-Bold;
font-weight: 700;
text-align: center;
color: #1D1E1F;
line-height: 17px;
vertical-align:top;
}
.lable-green12-small{
font-size: 16px;
font-family: MicrosoftYaHei, MicrosoftYaHei-Bold;
font-weight:1000;
text-align: center;
color: #1D1E1F;
line-height:48px;
vertical-align:top;
}
@media (max-width: 1600px) {
.lable-green12-small{
font-size: 14px;
}
}
.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: 6px;
padding-left: 6px;
height: 100%;
}
/* NAV STACKED */
.nav-stacked > li > a {
border-radius: 0;
border-top: 0;
border-left: 3px solid transparent;
color: #444;
}
.nav-stacked > li.active > a,.nav-stacked>li.active>a:focus,
.nav-stacked > li.active > a:hover {
background: #3c8dbc;
border-radius: 8px;
color: #f3f3f3;
border-top: 0;
border-left: 0;
}
.nav-stacked > li.header {
border-bottom: 1px solid #ddd;
color: #777;
margin-bottom: 10px;
padding: 5px 10px;
text-transform: uppercase;
}
.progress1 {
overflow: hidden;
height: 8px;
margin-bottom: 10px;
background-color: #E7EBEE;
border-radius: 55px;
-webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
}
.progress-bar1 {
float: left;
width: 0%;
height: 100%;
font-size: 12px;
line-height: 20px;
color: #000;
text-align: center;
background-color: #0988FF;
-webkit-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15);
box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15);
-webkit-transition: width 0.6s ease;
-o-transition: width 0.6s ease;
transition: width 0.6s ease;
border-radius: 55px;
}
.progress12 {
overflow: hidden;
height: 8px;
margin-bottom: 10px;
background-color: #E9E1EC;
border-radius: 55px;
-webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
}
.progress-bar12 {
float: left;
width: 0%;
height: 100%;
font-size: 12px;
line-height: 20px;
color: #000;
text-align: center;
background-color: #862CAA;
-webkit-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15);
box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15);
-webkit-transition: width 0.6s ease;
-o-transition: width 0.6s ease;
transition: width 0.6s ease;
border-radius: 55px;
}
.progress2 {
overflow: hidden;
height: 12px;
margin-bottom: 10px;
background-color: #FFE9DB;
border-radius: 55px;
-webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
}
.progress-bar21 {
float: left;
width: 0%;
height: 100%;
font-size: 12px;
line-height: 20px;
color: #000;
text-align: center;
background-color: #FFC19B;
-webkit-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15);
box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15);
-webkit-transition: width 0.6s ease;
-o-transition: width 0.6s ease;
transition: width 0.6s ease;
border-radius: 55px;
}
.progress-bar22 {
float: left;
width: 0%;
height: 100%;
font-size: 12px;
line-height: 20px;
color: #000;
text-align: center;
background-color: #FE8841 ;
-webkit-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15);
box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15);
-webkit-transition: width 0.6s ease;
-o-transition: width 0.6s ease;
transition: width 0.6s ease;
border-radius: 55px;
}
.progress3 {
overflow: hidden;
height: 12px;
margin-bottom: 10px;
background-color: #F6E2FE;
border-radius: 55px;
-webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
}
.progress-bar31 {
float: left;
width: 0%;
height: 100%;
font-size: 12px;
line-height: 20px;
color: #000;
text-align: center;
background-color: #D188EF;
-webkit-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15);
box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15);
-webkit-transition: width 0.6s ease;
-o-transition: width 0.6s ease;
transition: width 0.6s ease;
border-radius: 55px;
}
.progress-bar32 {
float: left;
width: 0%;
height: 100%;
font-size: 12px;
line-height: 20px;
color: #000;
text-align: center;
background-color: #862CAA ;
-webkit-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15);
box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15);
-webkit-transition: width 0.6s ease;
-o-transition: width 0.6s ease;
transition: width 0.6s ease;
border-radius: 55px;
}
.FontColor-Words {
font-size: 28px;
font-weight:bold;
color: #4666B7;
float:left;
}
.FontColor-Words-Medium {
font-size: 23px;
font-weight:bold;
color: #4666B7;
float:left;
}
.FontColor-Words-Small {
font-size: 14px;
color: #000000;
}
/* 文字预设大小 */
.FontSize-Words-Large{
font-size:69px;
}
.FontSize-Words-Medium{
font-size:40px;
}
.FontSize-Words-Small{
font-size:20px;
font-weight:bold;
}
.FontSize-Words-Xsmall {
font-size: 15px;
font-weight:bold;
}
.FontSize-Words-XXsmall {
font-size: 13px;
}
/* END */
/* 文字预设颜色 */
.FontColor-Words-Light {
color: #69F6F9;
}
.FontColor-Words-Yellow {
color: #B25C16;
}
.FontColor-Words-Pink {
color: #E922FF;
}
.FontColor-Words-Blue {
color: #375999;
}
.FontColor-Words-DarkBlue {
color: #325490;
}
.FontColor-Words-LightBlue {
color: #369FFF;
}
/* END */
/* 数字预设颜色 */
.FontColor-Numbers {
color: #4666B7;
}
.FontColor-Numbers-Light {
color: #0A171F;
float:left;
}
.FontColor-Numbers-LightBlue {
color: #69F6F9;
}
.FontColor-Numbers-Green {
color: #00CCCC;
}
.FontColor-Numbers-Yellow {
color: #FFD428;
}
.FontColor-Numbers-Red {
color: #FF0624;
}
/* 数字预设大小 */
.FontSize-Numbers-Large{
font-size:69px;
line-height:1;
}
.FontSize-Numbers-Medium{
font-size:37px;
line-height:1;
font-weight: 700;
}
.FontSize-Numbers-Small{
font-size:24px;
line-height:0.7;
font-weight: 700;
}
.FontSize-Numbers-Xsmall{
font-size:16px;
line-height:1;
}
.FontLineHeight-One{
line-height:1;
}
.FontSize-Numbers-Top{
font-size:30px;
}
/* END */
.canvas-title{
width:500px;
position: absolute;
top: 20px;
left: 80px;
text-align:center;
}
.canvas-text{
width: 190px;
position: absolute;
background: rgba(225,241,255,0.5);
border-radius: 3px;
text-align:center;
padding:10px;
}
.canvas-text .row{
padding:5px 0;
}
.canvas-text .font-text{
font-size: 12px;
font-family: MicrosoftYaHei;
text-align: right;
color: #606163;
line-height: 16px;
letter-spacing: 1px;
}
.canvas-text .font-num{
font-size: 16px;
font-family: Helvetica;
text-align: left;
font-weight: 700;
color: #26282D;
line-height: 16px;
letter-spacing: 1px;
}
.canvas-text-one{
top: 110px;
left: 10px;
}
.canvas-text-two{
top: 260px;
left: 10px;
}
.canvas-text-three{
top: 390px;
left: 200px;
}
.canvas-text-four{
top: 445px;
left: 430px;
}
.canvas-text-five{
top: 220px;
left: 610px;
}
.canvas-text-six{
top: 55px;
left: 610px;
}.handle-title{
height:5%;
font-size: 16px;
font-family: MicrosoftYaHei;
font-weight:600;
text-align: center;
line-height: 21px;
letter-spacing: 1px;
} .font-blue{
color: #1890FF;
}
</style>
<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=ANwFCFs9Kd0cWIc2dAqhxUqNdwXsk9Fp"></script>
<script type="text/javascript">
var addFun = function() {
$.post(ext.contextPath + '/work/mpoint/add.do', {} , function(data) {
$("#subDiv").html(data);
openModal('subModal');
});
};
var editFun = function(id) {
$.post(ext.contextPath + '/work/mpoint/edit.do', {id:id} , function(data) {
$("#subDiv").html(data);
openModal('subModal');
});
};
var deleteFun = function(id) {
swal({
text: "您确定要删除此记录?",
dangerMode: true,
buttons: {
cancel: {
text: "取消",
value: null,
visible: true,
className: "btn btn-default btn-sm",
closeModal: true,
},
confirm: {
text: "确定",
value: true,
visible: true,
className: "btn btn-danger btn-sm",
closeModal: true
}
}
})
.then(willDelete => {
if (willDelete) {
$.post(ext.contextPath + '/work/group/delete.do', {id : id}, function(data) {
if(data==1){
$("#table").bootstrapTable('refresh');
}else{
showAlert('d','删除失败','mainAlertdiv');
}
});
}
});
};
var deletesFun = function() {
var checkedItems = $("#table").bootstrapTable('getSelections');
var datas="";
$.each(checkedItems, function(index, item){
datas+=item.id+",";
});
if(datas==""){
showAlert('d','请先选择记录','mainAlertdiv');
}else{
swal({
text: "您确定要删除此记录?",
dangerMode: true,
buttons: {
cancel: {
text: "取消",
value: null,
visible: true,
className: "btn btn-default btn-sm",
closeModal: true,
},
confirm: {
text: "确定",
value: true,
visible: true,
className: "btn btn-danger btn-sm",
closeModal: true
}
}
})
.then(willDelete => {
if (willDelete) {
$.post(ext.contextPath + '/work/group/deletes.do', {ids:datas} , function(data) {
if(data>0){
$("#table").bootstrapTable('refresh');
}else{
showAlert('d','删除失败','mainAlertdiv');
}
});
}
});
}
};
var init = function() {
$.post(ext.contextPath + '/work/group/getListForSelect.do', {} , function(data) {
//console.info(data)
if(data.length>0){
for(var i=0;i<data.length;i++){
$("#search_code").append("<option value='"+data[i].id+"'>"+data[i].text+"</option>");
}
}
},'json');
};
var dosearch = function() {
$("#table").bootstrapTable('refresh');
};
//达标率
function dogauge(id,value,title){
var max = 100;
// 蓝色背景
var num = value / max;
var colorSet = [
[num, "#347EFB"],
[1, "#F6F8F9"]
];
var myChart = echarts.init(document.getElementById(id));
var option = {
title:{
text:title,
textStyle: {
fontSize: 12 ,
fontWeight: 400 ,
color: '#a3a9af' ,
},
x:'center',
bottom:0,
},
grid: {
top:0,
left:0,
right:0,
bottom:0,
},
tooltip: {
formatter: '{a} <br/>{b} : {c}%'
},
series: [
{
name: '达标率',
type: 'gauge',
radius: '100%' ,
center: ["50%", "50%"], //整体的位置设置
startAngle: 180,
endAngle: 0,
splitLine: {
show: false ,
},
axisLine: {
// 坐标轴线
lineStyle: {
// 属性lineStyle控制线条样式
color: colorSet,
width: 15,
opacity: 1 //刻度背景宽度
}
},
axisTick: {
show: false ,
},
axisLabel: {
show: false ,
},
pointer: {
show: false ,
},
detail: {
offsetCenter: [0, '-15%'] ,
fontSize: 34 ,
formatter: '{value}%'
},
data: [{value: value}]
}
]
};
myChart.clear();
myChart.setOption(option, true);
}
//达标率
function dogauge1(id,value,title,colors){
var max = 100;
// 蓝色背景
var num = value / max;
var colorSet = [
[num,colors],
[1, "#F6F8F9"]
];
var myChart = echarts.init(document.getElementById(id));
var option = {
title:{
text:title,
textStyle: {
fontSize: 12 ,
fontWeight: 400 ,
color: colors ,
},
x:'center',
bottom:0,
},
grid: {
top:0,
left:0,
right:0,
bottom:0,
},
tooltip: {
formatter: '{a} <br/>{b} : {c}%'
},
series: [
{
name: '达标率',
type: 'gauge',
radius: '150%' ,
center: ["50%", "75%"], //整体的位置设置
startAngle: 180, //开始角度 左侧角度
endAngle:0,
splitLine: {
show: false ,
},
axisLine: {
// 坐标轴线
lineStyle: {
// 属性lineStyle控制线条样式
color: colorSet,
width: 19,
opacity: 1 //刻度背景宽度
}
},
axisTick: {
show: false ,
},
axisLabel: {
show: false ,
},
pointer: {
show: false ,
},
detail: {
offsetCenter: [0, '-25%'] ,
fontSize: 34 ,
formatter: '{value}%'
},
data: [{value: value}]
}
]
};
myChart.clear();
myChart.setOption(option, true);
}
//设备完好率
function doequgood(id,value,subtext_v,color_v){
var othVal = 100 - value;
var myChart = echarts.init(document.getElementById(id));
var option = {
title: {
text: value+'%',
x: 'center',
y:'center',
top:'20%',
textStyle: {
fontWeight: 'normal',
color: '#0580f2',
fontSize: '20'
},
subtext:subtext_v,
subtextStyle: {
fontSize: '12',
fontWeight: 200,
color: '#a3a9af',
}
},
color: ['#F6F8F9'],
grid: {
top:0,
left:0,
right:0,
bottom:0,
},
series: [{
name: 'Line 1',
type: 'pie',
clockWise: true,
radius: ['80%', '100%'],
itemStyle: {
normal: {
label: {
show: false
},
labelLine: {
show: false
}
}
},
hoverAnimation: false,
data: [{
value: value,
name: '01',
itemStyle: {
normal: {
color: color_v,
label: {
show: false
},
labelLine: {
show: false
}
}
}
}, {
name: '02',
value: othVal
}]
}]
}
myChart.clear();
myChart.setOption(option, true);
}
//设备类型pie
function doequtype(id,val){
const colorList = ['#3883FF', '#A84ECB', '#FE8840', '#FBD444', '#7F6AAD', '#585247'];
var data = val;
var legendName = new Array;
data.forEach(function(value,i){
legendName[i] = value.name;
});
var myChart = echarts.init(document.getElementById(id));
var option = {
title: {
text: '设备',
textStyle: {
fontSize: 17,
color: '#000',
lineHeight: 24
},
subtextStyle: {
fontSize: 28,
color: '#333'
},
textAlign: 'center',
left: '19%',
top: '41%'
},
grid: {
top:0,
left:0,
right:0,
bottom:0,
},
tooltip: {
trigger: 'item',
},
legend: {
type: 'scroll',
orient: 'vertical',
right: '7%',
top: '20%',
itemGap: 10,
selectedMode: false,
data: legendName,
textStyle: {
rich: {
uname: {
fontSize: 14,
color: '#606163',
},
unum: {
fontSize: 20,
color: '#000',
}
}
},
formatter(name) {
var index = 0;
data.forEach(function(value,i){
if(value.name == name){
index = i;
}
});
var value = data[index].value;
return ' {uname|'+name+'}{unum|'+value+'}';
}
},
color: colorList,
series: [
{
name: '设备',
type: 'pie',
radius: ['60%', '85%'],
center: ['20%', '50%'],
label: {
show: false
},
labelLine: {
show: false
},
itemStyle: {
borderWidth: 3,
borderColor: '#fff'
},
data: data,
}
]
};
myChart.clear();
myChart.setOption(option, true);
}
//处理量、外运量等line
function doline(id,data){
const colorList = ['#347EFB', '#EBA043', '#9E70C7', '#47C1C8', '#F55945', '#A84ECB'];
var series = new Array;
data.forEach(function(val,i){
series[i] = {
name: val.name,
type: 'line',
data: val.value,
smooth: true,
showSymbol: false,
areaStyle: {
// 线性渐变,前四个参数分别是 x0, y0, x2, y2, 范围从 0 - 1相当于在图形包围盒中的百分比如果 globalCoord 为 `true`,则该四个值是绝对的像素位置
color: {
type: 'linear',
x: 0,
y: 0.9,
x2: 0,
y2: 0,
colorStops: [{
offset: 0, color: '#FFF' // 0% 处的颜色
}, {
offset: 1, color: colorList[i] // 100% 处的颜色
}],
global: false // 缺省为 false
}
},
lineStyle:{
color:colorList[i],
},
};
});
// 基于准备好的dom初始化echarts实例
var myChart = echarts.init(document.getElementById(id));
var option = {
color: colorList,
tooltip: {
trigger: 'axis',
},
legend: {
top: 0,
left: 10,
icon:'circle',
textStyle: {
color: '#000' ,
lineHeight: 16,
fontSize: 13 ,
fontWeight : 600 ,
},
},
grid: {
left: '1%',
right: '1%',
top: '20%',
bottom: '5%',
containLabel: true
},
xAxis: {
type : 'category',
boundaryGap: false,
axisLabel: {
color:'#8A88B7',
},
axisLine: {
show: false
},
axisTick: {
show: false
},
},
yAxis: {
type: 'value',
splitNumber: 3 ,
axisLine: {
show: false
},
axisTick: {
show: false
},
axisLabel: {
color:'#8A88B7',
},
//网格样式
splitLine: {
show: true,
lineStyle:{
color: '#8A88B7',
type: 'dashed'
}
}
},
series: series
};
myChart.clear();
myChart.setOption(option, true);
}
//药、电等bar
function doBar(id,data,colorNum){
const colorList = ['#F0B253', '#397EFA', '#9E70C7', '#47C1C8', '#F55945', '#A84ECB'];
// 基于准备好的dom初始化echarts实例
var myChart = echarts.init(document.getElementById(id));
var option = {
color: colorList[colorNum],
tooltip: {
trigger: 'axis',
},
grid: {
left: '1%',
right: '1%',
top: '20%',
bottom: '5%',
containLabel: true
},
legend: {
top: 0,
left: 10,
icon:'circle',
textStyle: {
color: '#000' ,
lineHeight: 16,
fontSize: 13 ,
fontWeight : 600 ,
},
},
xAxis: [
{
type: 'category',
axisLine: {
lineStyle:{
color:'#8A88B7',
}
},
axisLabel: {
color:'#8A88B7',
},
axisTick: {
show: false
},
}
],
yAxis: [
{
type: 'value',
axisLine: {
lineStyle:{
color:'#8A88B7',
}
},
axisLabel: {
color:'#8A88B7',
},
axisTick: {
show: false
},
//网格样式
splitLine: {
show: true,
lineStyle:{
color: '#8A88B7',
type: 'dashed',
opacity:0.3,
}
}
}
],
series: [
{
name: data.name,
type: 'bar',
barWidth: '20%',
barMinWidth: 10 ,
data: data.value
}
]
};
myChart.clear();
myChart.setOption(option, true);
}
//巡检、维修、保养等完成率bar
function doendPie(id,data,colorNum){
var width = $(window).width();
var xData ='-11';
if(width==1353){
xData ='-28%';
}
const colorList = [ '#FE8841', '#A84ECB','#3A84FF','#9E70C7','#347EFB', '#EBA043', '#A84ECB'];
var othVal = 100 - data.value;
var myChart = echarts.init(document.getElementById(id));
var option = {
color: ['#F6F8F9'],
title: {
text: data.value+'%',
x: 'center',
y: 'center',
top:'25%',
textStyle: {
fontWeight: 'normal',
color: "#606163",
fontSize: '25'
},
},
legend: {
data:[data.name],
x: xData,
y: '83%',
icon:'none',
textStyle: {
color: '#a3a9af' ,
lineHeight: 16,
fontSize: 13 ,
fontWeight : 600 ,
},
},
grid: {
top:0,
left:0,
right:0,
bottom:0,
},
series: [{
name: 'Line 1',
type: 'pie',
clockWise: true,
radius: ['65%', '80%'],
center: ['50%', '40%'],
itemStyle: {
normal: {
label: {
show: false
},
labelLine: {
show: false
}
}
},
hoverAnimation: false,
startAngle:175, //起始角度
data: [{
value: data.value,
name: data.name,
itemStyle: {
normal: {
color: colorList[colorNum],
label: {
show: false
},
labelLine: {
show: false
}
}
}
}, {
name: '02',
value: othVal
}]
}]
}
myChart.clear();
myChart.setOption(option, true);
}
function doendPie1(id,data,colorNum){
const colorList = [ '#FE8841', '#A84ECB','#3A84FF','#9E70C7','#347EFB', '#EBA043', '#A84ECB'];
var othVal = 100 - data.value;
var myChart = echarts.init(document.getElementById(id));
var option = {
color: ['#F6F8F9'],
title: {
text: data.value+'%',
x: 'center',
y: 'center',
top:'30%',
textStyle: {
fontWeight: 'normal',
color:colorList[colorNum],
fontSize: '25'
},
},
legend: {
data:[data.name],
x: '9%',
y: '85%',
icon:'none',
textStyle: {
color: colorList[colorNum] ,
lineHeight: 16,
fontSize: 13 ,
fontWeight : 600 ,
},
},
grid: {
top:0,
left:0,
right:0,
bottom:0,
},
series: [{
name: 'Line 1',
type: 'pie',
clockWise: true,
radius: ['65%', '80%'],
center: ['50%', '40%'],
itemStyle: {
normal: {
label: {
show: false
},
labelLine: {
show: false
}
}
},
hoverAnimation: false,
startAngle:290, //起始角度
data: [{
value: data.value,
name: data.name,
itemStyle: {
normal: {
color: colorList[colorNum],
label: {
show: false
},
labelLine: {
show: false
}
}
}
}, {
name: '02',
value: othVal
}]
}]
}
myChart.clear();
myChart.setOption(option, true);
}
function doTable(id){
var height = $("#"+id).parent().height();
$("#"+id).bootstrapTable({
//url:"",
height:height,
striped: false, //是否显示行间隔色
cache: false, //是否使用缓存默认为true所以一般情况下需要设置一下这个属性*
});
}
function homepagedata(biz_id){
$.post(ext.contextPath + '/work/mpoint/getpage.do'+biz_id, {} , function(data) {
var arr= JSON.parse(data);
$('#pagehome').val(arr);
$("#equipmentTotal").html(arr.equipmentTotal);
$("#equipmentTotalRun").html(arr.equipmentTotalRun);
$("#equipmentAnomaliesTotal").html(arr.equipmentAnomaliesTotal);
$("#materialApplication").html(arr.materialApplication);
$("#materialApplicationTotal").html("¥"+arr.materialApplicationTotal);
$("#completePurchase").html(arr.completePurchase);
$("#completePurchaseTotal").html("¥"+arr.completePurchaseTotal);
$("#runPurchase").html(arr.runPurchase);
$("#runPurchaseTotal").html("¥"+arr.runPurchaseTotal);
$("#pzxjs").html(arr.pzxjs);
$("#pzxjsywc").html(arr.pzxjsywc);
$("#pzxjsjxz").html(arr.pzxjsjxz);
$("#pzxjswks").html(arr.pzxjswks);
$("#wszxjs").html(arr.wszxjs);
$("#wszxjsywc").html(arr.wszxjsywc);
$("#wszxjsjxz").html(arr.wszxjsjxz);
$("#wszxjswks").html(arr.wszxjswks);
$("#htzs").html(arr.htzs);
$("#equipmentRunAnomalies").html(arr.equipmentRunAnomalies+"/"+arr.equipmentTotal);
$("#equipmentToAnomalies").html(arr.equipmentToAnomalies+"/"+arr.equipmentTotal);
$("#inventory").html(arr.inventory+"/"+arr.inventoryMax);
$("#zqhts").html(arr.zqhts+"/"+arr.htzs);
$("#zxhts").html(arr.zxhts+"/"+arr.htzs);
var equipmentRunAnomalieswidth = arr.equipmentRunAnomalies*100/arr.equipmentTotal;
$("#equipmentRunAnomaliesstyle").width(equipmentRunAnomalieswidth+'%');
var equipmentToAnomalieswidth = arr.equipmentToAnomalies*100/arr.equipmentTotal;
$("#equipmentToAnomaliesstyle").width(equipmentToAnomalieswidth+'%');
var inventorywidth = arr.inventory*100/arr.inventoryMax;
$("#inventorystyle").width(inventorywidth+'%');
var zqhtswidth = arr.zqhts*100/arr.htzs;
$("#zqhtsstyle").width(zqhtswidth+'%');
var pzxjswidth = (arr.pzxjsjxz+arr.pzxjsywc)*100/arr.pzxjs;
$("#pzxjs1").width(pzxjswidth+'%');
var pzxjs2width = arr.pzxjsywc*100/arr.pzxjsjxz+arr.pzxjsywc;
$("#pzxjs2").width(pzxjs2width+'%');
var wszxjswidth = (arr.wszxjsjxz+arr.wszxjsywc)*100/arr.wszxjs;
$("#wszxjs1").width(wszxjswidth+'%');
var wszxjs2width = arr.wszxjsywc*100/arr.wszxjsjxz+arr.wszxjsywc;
$("#wszxjs2").width(wszxjs2width+'%');
//init();
// dogauge("in",60,'进水达标率');
//dogauge("out",100,'出水达标率');
// doequgood("equ-good",70,'设备完好率','#FBD444');
var xjPie = {name:"设备完好率",value:arr.equipmentIntactRate};
doendPie("equ-good",xjPie,0);
// doequgood("equ-good2",70,'大修完成率','#A84ECB');
var xjPie1 = {name:"大修完成率",value:arr.equipmentRepair};
doendPie("equ-good2",xjPie1,1);
// doequgood("equ-good3",70,'保养完成率','#3883FF');
var xjPie2 = {name:"保养完成率",value:arr.equipmentMaintain};
doendPie("equ-good3",xjPie2,2);
dogauge1("in",arr.pzxjswcl,'泵站巡检完成率','#FE8841');
dogauge1("in1",arr.wszxjswcl,'污水厂巡检完成率','#862CAA');
//doequgood("equ-good4",70,'合同完成率','#0988FF');
var xjPie3 = {name:"合同完成率",value:arr.htxcl};
doendPie1("equ-good4",xjPie3,2);
//doequgood("equ-good5",70,'合同未完成率','#FE8841');
var xjPie4 = {name:"合同未完成率",value:arr.htwxcl};
doendPie1("equ-good5",xjPie4,0);
var data = [
{name: 'A类设备数量', value: arr.equipmentTotalA},
{name: 'B类设备数量', value: arr.equipmentTotalB},
{name: 'C类设备数量', value: arr.equipmentTotalC},
];
doequtype("equ-type",data);
});
}
var pagedata = $('#pagehome').val();
// var pagearr= JSON.parse(pagedata);
$(function() {
var mp = new BMap.Map("container12");
// 创建地图实例
var point = new BMap.Point(119.982345,31.800048);
// 创建点坐标
mp.centerAndZoom(point,13);
// 初始化地图,设置中心点坐标和地图级别
//泵站所
var point1 = new BMap.Point(119.99774,31.835191);
var marker = new BMap.Marker(point1);
mp.enableScrollWheelZoom();
//着重
function ComplexCustomOverlay1(point, text, mouseoverText){
this._point = point;
this._text = text;
this._overText = mouseoverText;
}
ComplexCustomOverlay1.prototype = new BMap.Overlay();
ComplexCustomOverlay1.prototype.initialize = function(map){
this._map = map;
var div = this._div = document.createElement("div");
div.style.position = "absolute";
div.style.zIndex = BMap.Overlay.getZIndex(this._point.lat);
div.style.backgroundColor = "#FE8841";
div.style.border = "1px solid #BC3B3A";
div.style.color = "white";
div.style.height = "28px";
div.style.padding = "2px";
div.style.lineHeight = "28px";
div.style.whiteSpace = "nowrap";
div.style.MozUserSelect = "none";
div.style.fontSize = "22px"
var span = this._span = document.createElement("span");
div.appendChild(span);
span.appendChild(document.createTextNode(this._text));
var that = this;
var arrow = this._arrow = document.createElement("div");
//arrow.style.background = "url(//map.baidu.com/fwmap/upload/r/map/fwmap/static/house/images/label.png) no-repeat";
arrow.style.position = "absolute";
arrow.style.width = "11px";
arrow.style.height = "10px";
arrow.style.top = "22px";
arrow.style.left = "10px";
arrow.style.overflow = "hidden";
div.appendChild(arrow);
div.onmouseover = function(){
this.style.backgroundColor = "#6BADCA";
this.style.borderColor = "#0000ff";
this.getElementsByTagName("span")[0].innerHTML = that._overText;
arrow.style.backgroundPosition = "0px -20px";
}
div.onmouseout = function(){
this.style.backgroundColor = "#FE8841";
this.style.borderColor = "#BC3B3A";
this.getElementsByTagName("span")[0].innerHTML = that._text;
arrow.style.backgroundPosition = "0px 0px";
}
mp.getPanes().labelPane.appendChild(div);
return div;
}
ComplexCustomOverlay1.prototype.draw = function(){
var map = this._map;
var pixel = map.pointToOverlayPixel(this._point);
this._div.style.left = pixel.x - parseInt(this._arrow.style.left) + "px";
this._div.style.top = pixel.y - 30 + "px";
}
// 复杂的自定义覆盖物
function ComplexCustomOverlay(point, text, mouseoverText){
this._point = point;
this._text = text;
this._overText = mouseoverText;
}
ComplexCustomOverlay.prototype = new BMap.Overlay();
ComplexCustomOverlay.prototype.initialize = function(map){
this._map = map;
var div = this._div = document.createElement("div");
div.style.position = "absolute";
div.style.zIndex = BMap.Overlay.getZIndex(this._point.lat);
div.style.backgroundColor = "#3A84FF";
div.style.border = "1px solid #BC3B3A";
div.style.color = "white";
div.style.height = "18px";
div.style.padding = "2px";
div.style.lineHeight = "18px";
div.style.whiteSpace = "nowrap";
div.style.MozUserSelect = "none";
div.style.fontSize = "12px"
var span = this._span = document.createElement("span");
div.appendChild(span);
span.appendChild(document.createTextNode(this._text));
var that = this;
var arrow = this._arrow = document.createElement("div");
//arrow.style.background = "url(//map.baidu.com/fwmap/upload/r/map/fwmap/static/house/images/label.png) no-repeat";
arrow.style.position = "absolute";
arrow.style.width = "11px";
arrow.style.height = "10px";
arrow.style.top = "22px";
arrow.style.left = "10px";
arrow.style.overflow = "hidden";
div.appendChild(arrow);
div.onmouseover = function(){
this.style.backgroundColor = "#6BADCA";
this.style.borderColor = "#0000ff";
this.getElementsByTagName("span")[0].innerHTML = that._overText;
arrow.style.backgroundPosition = "0px -20px";
}
div.onmouseout = function(){
this.style.backgroundColor = "#3A84FF";
this.style.borderColor = "#BC3B3A";
this.getElementsByTagName("span")[0].innerHTML = that._text;
arrow.style.backgroundPosition = "0px 0px";
}
mp.getPanes().labelPane.appendChild(div);
return div;
}
ComplexCustomOverlay.prototype.draw = function(){
var map = this._map;
var pixel = map.pointToOverlayPixel(this._point);
this._div.style.left = pixel.x - parseInt(this._arrow.style.left) + "px";
this._div.style.top = pixel.y - 30 + "px";
}
ComplexCustomOverlay1.prototype.draw = function(){
var map = this._map;
var pixel = map.pointToOverlayPixel(this._point);
this._div.style.left = pixel.x - parseInt(this._arrow.style.left) + "px";
this._div.style.top = pixel.y - 30 + "px";
}
//var txt = "泵站所", mouseoverTxt = txt + " " ;
var myCompOverlay = new ComplexCustomOverlay(new BMap.Point(119.99774,31.835191), "泵站所","泵站所");
var myCompOverlay1 = new ComplexCustomOverlay(new BMap.Point(119.986146,31.950963), "江边厂","江边厂");
var myCompOverlay2 = new ComplexCustomOverlay(new BMap.Point(120.076925,31.719423), "戚墅堰厂","戚墅堰厂");
var myCompOverlay3 = new ComplexCustomOverlay1(new BMap.Point(119.982345,31.800048 ), "常州排水处","常州排水处");
var myCompOverlay4 = new ComplexCustomOverlay(new BMap.Point(119.991248,31.805994 ), "管网所","管网所");
var myCompOverlay5 = new ComplexCustomOverlay(new BMap.Point(119.996757,31.835341 ), " 监测站"," 监测站");
var myCompOverlay6 = new ComplexCustomOverlay(new BMap.Point(119.934247,31.776931 ), "清潭厂","清潭厂");
mp.addOverlay(myCompOverlay);
mp.addOverlay(myCompOverlay1);
mp.addOverlay(myCompOverlay2);
mp.addOverlay(myCompOverlay3);
mp.addOverlay(myCompOverlay4);
mp.addOverlay(myCompOverlay5);
mp.addOverlay(myCompOverlay6);
ComplexCustomOverlay.prototype.addEventListener = function(event,fun){
this._div['on'+event] = fun;
}
ComplexCustomOverlay1.prototype.addEventListener = function(event,fun){
this._div['on'+event] = fun;
}
var biz_id = '?biz_id='+unitId;
if (unitId=='0519CZPS'){ biz_id ='' }
myCompOverlay.addEventListener('click',function(){
biz_id = '?biz_id=7b19e5c1efe94009b6ba777f096f4caa';
homepagedata(biz_id);
});
myCompOverlay1.addEventListener('click',function(){
//alert('click1');
biz_id = '?biz_id=JB';
homepagedata(biz_id);
});
myCompOverlay2.addEventListener('click',function(){
// alert('click2');
biz_id = '?biz_id=QC';
homepagedata(biz_id);
});
myCompOverlay3.addEventListener('click',function(){
// alert('click2');
biz_id = '?biz_id=0519CZPS';
homepagedata(biz_id);
});
myCompOverlay4.addEventListener('click',function(){
// alert('click2');
biz_id = '?biz_id=a89ffc7e3d514c6eaf6ce67711f6ac04';
homepagedata(biz_id);
});
myCompOverlay5.addEventListener('click',function(){
// alert('click2');
biz_id = '?biz_id=bd537f9da31b4153bc9d00646ada214d';
homepagedata(biz_id);
});
myCompOverlay6.addEventListener('click',function(){
// alert('click2');
biz_id = '?biz_id=QT';
homepagedata(biz_id);
});
homepagedata(biz_id);
});
function addTab(id,title,url){
parent.addTab(id,title,url);
}
</script>
</head>
<body onload="initMenu()" class="hold-transition ${cu.themeclass} sidebar-mini">
<div class="wrapper">
<!-- 引用top -->
<%--<jsp:include page="/jsp/top.jsp"></jsp:include>--%>
<!-- 菜单栏 -->
<%--<jsp:include page="/jsp/left.jsp"></jsp:include>--%>
<div class="content-wrapper">
<!-- Content Header (Page header) -->
<!-- <section class="content-header">
<h1 id ="head_title"></h1>
<ol class="breadcrumb">
<li><a id ='head_firstlevel' href="#"><i class="fa fa-refresh"></i> </a></li>
</ol>
</section> -->
<!-- Main content -->
<section class="content container-fluid">
<div id="mainAlertdiv"></div>
<div id="subDiv"></div>
<div id="menu4SelectDiv"></div>
<input type="hidden" id="pagehome" name="pagehome">
<div calss="row">
<div class="col-md-3">
<div class="box box-white box-left" >
<div class="box-header">
<div class="box-tools pull-right">
</div>
<!-- /.box-tools -->
</div>
<div class="box-border">
<div class="box-border-left"></div>
<div class="box-border-right"></div>
</div>
<!-- /.box-header -->
<div class="box-body" style="cursor: pointer;" >
<div class="col-md-12 text-center" style="padding-top:20px;" onclick="addTab('equtab','设备台账','equipment/showEquipmentCard.do')">
<div class="col-md-6 lable-green12-small">
<i class=" icon1" ></i>
<span style=" line-height:48px; vertical-align:top;">总设备数量</span>
</div>
<span id="equipmentTotal" class="col-md-6 lable-green" style="padding-top:13px;" ></span>
</div>
<div class="row" onclick="addTab('equtab','设备台账','equipment/showEquipmentCard.do')">
<div class="col-md-12" id="equ-type" style="height:140px;"></div>
</div>
<div class="col-md-12 text-center" style="padding-top:20px;" onclick="addTab('equtab','设备台账','equipment/showEquipmentCard.do?equipmentstatus=在用')">
<div class="col-md-6 lable-green12-small">
<i class=" icon2" ></i>
<span style=" line-height:48px; vertical-align:top;">投运设备数</span>
</div>
<span id = "equipmentTotalRun" class="col-md-6 lable-green" style="padding-top:13px;" ></span>
</div>
<div class="col-md-12">
<div class="col-md-4" id="equ-good" style="height:100px;"></div>
<div class="col-md-4" id="equ-good2" style="height:100px;"></div>
<div class="col-md-4" id="equ-good3" style="height:100px;"></div>
</div>
<div class="col-md-12 text-center" style="padding-top:20px;" onclick="addTab('equtab','设备维修','maintenance/showMaintenanceDetailList.do')">
<div class="col-md-6 lable-green12-small">
<i class=" icon3" ></i>
<span style=" line-height:48px; vertical-align:top;">总异常数量</span>
</div>
<span id= "equipmentAnomaliesTotal" class="col-md-6 lable-green" style="padding-top:13px;" ></span>
</div>
<div class="col-md-12 text-center" style="padding-top:5px;" onclick="addTab('equtab','设备维修','maintenance/showMaintenanceDetailList.do')">
<div style="height: 30px;background: #f4faff;padding-top:5px;border-radius: 4px;">
<div class="FontColor-Words-Small" style="width:35%;float:left;">运行异常数量</div>
<div style="padding-top:5px;width:40%;float:left;">
<div class="progress1">
<div class="progress-bar1" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" id = "equipmentRunAnomaliesstyle" style="float:left;">
<span class="sr-only">60% Complete</span>
</div>
</div>
</div>
<div class="FontColor-Numbers-Light FontSize-Numbers-Xsmall" id="equipmentRunAnomalies" style="text-align:center;width:25%;float:center;padding-top:2px;"></div>
</div>
</div>
<div class="col-md-12 text-center" style="padding-top:20px;" onclick="addTab('equtab','设备维修','maintenance/showMaintenanceDetailList.do')">
<div style="height: 30px;padding-top:5px;background: #f4faff;border-radius: 4px;">
<div class="FontColor-Words-Small" style="width:35%;float:left;">设备异常数量</div>
<div style="padding-top:5px;width:40%;float:left;">
<div class="progress1">
<div class="progress-bar1" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100" id = "equipmentToAnomaliesstyle" style="float:left;">
<span class="sr-only">100% Complete</span>
</div>
</div>
</div>
<div class="FontColor-Numbers-Light FontSize-Numbers-Xsmall" id="equipmentToAnomalies" style="text-align:center;width:25%;float:center;padding-top:2px;" ></div>
</div>
</div>
</div>
<!-- /.box-body -->
</div>
<div class="box box-white box-left">
<div class="box-header">
<div class="box-tools pull-right">
</div>
<!-- /.box-tools -->
</div>
<div class="box-border">
<div class="box-border-left"></div>
<div class="box-border-right"></div>
</div>
<!-- /.box-header -->
<div class="box-body" style="cursor: pointer;" >
<div class="row" style="padding-bottom:10px;" onclick="addTab('subscribetab','部门申购','sparepart/subscribe/showList.do')">
<div class="col-md-2 text-center" style="padding-top:20px;">
<i class=" icon6" ></i>
</div>
<div class="col-md-4 text-center" style="padding-top:20px;">
<span class="col-md-12 lable-green2" id="materialApplication"></span>
<span class="col-md-12 lable-right1">&#12288;&#12288;</span>
<span class="col-md-12 lable-right1">物资申请</span>
</div>
<div class="col-md-6 text-center" style="padding-top:20px;">
<span class="col-md-12 lable-green3" id = "materialApplicationTotal"></span>
</div>
</div>
<div style="width: calc(100% - 20px);height: 2px;margin:0 10px;opacity: 0.23;border: 1px solid #c4e2e6;"></div>
<div class="row" style="padding-bottom:10px;" onclick="addTab('subscribetab','部门申购','sparepart/subscribe/showList.do')">
<div class="col-md-2 text-center" style="padding-top:50px;">
<i class=" icon7" ></i>
</div>
<div class="col-md-10 text-center">
<div class="row">
<div class="col-md-6 text-center" style="padding-top:20px;">
<span class="col-md-12 lable-green2" id="completePurchase"></span>
<span class="col-md-12 lable-right1">&#12288;&#12288;</span>
<span class="col-md-12 lable-right1">已完成的采购</span>
</div>
<div class="col-md-6 text-center" style="padding-top:20px;">
<span class="col-md-12 lable-green4" id="completePurchaseTotal"></span>
</div>
<div class="row">&#12288;&#12288;</div>
<div class="col-md-6 text-center" style="padding-top:20px;">
<span class="col-md-12 lable-green2" id="runPurchase"></span>
<span class="col-md-12 lable-right1">&#12288;&#12288;</span>
<span class="col-md-12 lable-right1">进行中的采购</span>
</div>
<div class="col-md-6 text-center" style="padding-top:20px;">
<span class="col-md-12 lable-green5" id = "runPurchaseTotal"></span>
</div>
</div>
</div>
</div>
<div style="width: calc(100% - 20px);height: 2px;margin:0 10px;opacity: 0.23;border: 1px solid #c4e2e6;"></div>
<div class="row" style="padding-top:5%;" onclick="addTab('subscribetab','库存管理','sparepart/stock/showList.do')">
<div class="col-md-2 text-center " style="height: 48px;">
<i class = "icon5" ></i>
</div>
<div class="col-md-10 text-center" style="height:40px;border-radius: 5px;">
<div class="col-md-3" style="padding:0;background: #FBF0FF;">
<div class="FontColor-Words-Small" style="padding-top:10px;">库存总数</div>
</div>
<div class="col-md-4" style="padding-top:15px;background: #FBF0FF;" >
<div class="progress12">
<div class="progress-bar12" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" id = "inventorystyle" style="float:left;">
</div>
</div>
</div>
<div class="col-md-5" style="padding-top:15px;background: #FBF0FF;">
<div class="FontColor-Numbers-Light FontSize-Numbers-Xsmall" id="inventory"
style="text-align:center;width:100%;"></div>
</div>
</div>
</div>
</div>
<!-- /.box-body -->
</div>
</div>
</div>
<div calss="row">
<div class="col-md-6 " >
<div id="container12" style="height:1018px;" >
</div>
</div>
</div>
<div calss="row">
<div class="col-md-3 " >
<div class="box box-white box-left sys1" style="height: 600px;">
<div class="box-header">
<div class="box-tools pull-right">
</div>
<!-- /.box-tools -->
</div>
<div class="box-border">
<div class="box-border-left"></div>
<div class="box-border-right"></div>
</div>
<!-- /.box-header -->
<div class="box-body" style="cursor: pointer;" onclick="addTab('patrolRecordtab','巡检总览','timeEfficiency/patrolRecord/showOverview.do')">
<div class="col-md-12 text-center" >
<!-- <div class="col-md-8">
</div>
<div class="col-md-4 btn-top">
<a class="btn btn-default pull-right" type="button" >本月</a>
<a class="btn btn-primary pull-right" type="button" >本年</a>
</div> -->
<div class="row" style="padding-top:30px;">
<div class="col-md-3 text-center" style="padding-top:25px;">
<div class="row">
<span class="col-md-12 lable-right_2">泵站</span>
</div>
<div class="row">
<span class="col-md-12 lable-right_2">巡检总数</span>
</div>
</div>
<div class="col-md-3 text-center" style="padding-top:28px;">
<span class="col-md-12 lable-green6" id="pzxjs"></span>
</div>
<div class="col-md-6 text-center" >
<div style="width:100%;height:85px;" id="in"></div>
</div>
</div>
<div class="row">&#12288;&#12288;</div>
<div style="height: 50%;width: 100%;padding-top:5%;">
<div class="FontColor-Words-Small" style="width:5%;float:left;">&#12288;</div>
<div style="padding-top:5px;width:90%;float:left;">
<div class="progress2">
<div class="progress-bar21" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" id="pzxjs1" style="float:left;">
<div class="progress-bar22" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" id="pzxjs2" style="float:left;">
<span class="sr-only">60% Complete</span>
</div>
</div>
</div>
</div>
<div class="FontColor-Words-Small" style="width:5%;float:left;">&#12288;</div>
</div>
<div class="row">&#12288;&#12288;</div>
<div class="col-md-12 text-center" >
<div class="col-md-4 text-center" >
<div class="col-md-5 text-center" > &#12288; </div>
<div class="col-md-6 text-center" style="width: 26px;height: 12px;background: #fe8841;" > &#12288; </div>
<span class="col-md-12 lable-right_2">&#12288;已完成</span>
<span class="col-md-12 lable-right_21" id="pzxjsywc" >&#12288;</span>
</div>
<div class="col-md-4 text-center" >
<div class="col-md-5 text-center" > &#12288; </div>
<div class="col-md-6 text-center" style="width: 26px;height: 12px;background: #FFB385;" > &#12288; </div>
<span class="col-md-12 lable-right_2">&#12288;进行中</span>
<span class="col-md-12 lable-right_21" id="pzxjsjxz">&#12288;</span>
</div>
<div class="col-md-4 text-center" >
<div class="col-md-5 text-center" > &#12288; </div>
<div class="col-md-6 text-center" style="width: 26px;height: 12px;background: #FFE9DB;" > &#12288; </div>
<span class="col-md-12 lable-right_2">&#12288;未开始</span>
<span class="col-md-12 lable-right_21" id="pzxjswks">&#12288;</span>
</div>
</div>
<div class="col-md-12 text-center" >
<div class="row">&#12288;&#12288;</div>
<div style="width: calc(100% - 20px);height: 2px;margin:0 10px;opacity: 0.23;border: 1px solid #c4e2e6;"></div>
<div class="row" style="padding-top:30px;">
<div class="col-md-3 text-center" style="padding-top:25px;">
<div class="row">
<span class="col-md-12 lable-right_2">污水厂</span>
</div>
<div class="row">
<span class="col-md-12 lable-right_2">巡检总数</span>
</div>
</div>
<div class="col-md-3 text-center" style="padding-top:28px;">
<span class="col-md-12 lable-green6" id="wszxjs"></span>
</div>
<div class="col-md-6 text-center" >
<div style="width:100%;height:85px;" id="in1"></div>
</div>
</div>
<div style="height: 50%;width: 100%;padding-top:15%;">
<div class="FontColor-Words-Small" style="width:5%;float:left;">&#12288;</div>
<div style="padding-top:5px;width:90%;float:left;">
<div class="progress3">
<div class="progress-bar31" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" id="wszxjs1" style="float:left;">
<div class="progress-bar32" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" id="wszxjs2" style="float:left;">
<span class="sr-only">60% Complete</span>
</div>
</div>
</div>
</div>
<div class="FontColor-Words-Small" style="width:5%;float:left;">&#12288;</div>
</div>
<div class="row">&#12288;&#12288;</div>
<div class="col-md-12 text-center" >
<div class="col-md-4 text-center" >
<div class="col-md-5 text-center" > &#12288; </div>
<div class="col-md-6 text-center" style="width: 26px;height: 12px;background: #862CAA;" > &#12288; </div>
<span class="col-md-12 lable-right_2">&#12288;已完成</span>
<span class="col-md-12 lable-right_21" id = "wszxjsywc"></span>
</div>
<div class="col-md-4 text-center" >
<div class="col-md-5 text-center" > &#12288; </div>
<div class="col-md-6 text-center" style="width: 26px;height: 12px;background: #D188EF;" > &#12288; </div>
<span class="col-md-12 lable-right_2">&#12288;进行中</span>
<span class="col-md-12 lable-right_21"id = "wszxjsjxz" ></span>
</div>
<div class="col-md-4 text-center" >
<div class="col-md-5 text-center" > &#12288; </div>
<div class="col-md-6 text-center" style="width: 26px;height: 12px;background: #F6E2FE;" > &#12288; </div>
<span class="col-md-12 lable-right_2">&#12288;未开始</span>
<span class="col-md-12 lable-right_21" id = "wszxjswks"></span>
</div>
</div>
</div>
</div>
</div>
<!-- /.box-body -->
</div>
<div class="box box-white box-left">
<div class="box-header">
<div class="box-tools pull-right">
</div>
<!-- /.box-tools -->
</div>
<div class="box-border">
<div class="box-border-left"></div>
<div class="box-border-right"></div>
</div>
<!-- /.box-header -->
<div class="box-body" style="cursor: pointer;" onclick="addTab('contracttab','合同汇总','sparepart/contract/summary.do')">
<div class="col-md-12 text-center" style="padding-top:20px;">
<div class="col-md-6 lable-green12-small">
<i class=" icon4" ></i>
<span style=" line-height:48px; vertical-align:top;">合同总数</span>
</div>
<span class="col-md-6 lable-green" style="padding-top:13px;" id = "htzs"></span>
</div>
<div class="row">&#12288;&#12288;</div>
<div class="col-md-12 text-center" style="padding-top:5px;">
<div style="height: 30px;background: #f4faff;padding-top:5px;border-radius: 4px;">
<div class="FontColor-Words-Small" style="width:35%;float:left;">在签合同数量</div>
<div style="padding-top:5px;width:40%;float:left;">
<div class="progress1">
<div class="progress-bar1" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" id = "zqhtsstyle" style="width: 70%;float:left;">
<span class="sr-only">60% Complete</span>
</div>
</div>
</div>
<div class="FontColor-Numbers-Light FontSize-Numbers-Xsmall" id="zqhts" style="text-align:center;width:25%;float:center;padding-top:2px;"></div>
</div>
</div>
<div class="col-md-12 text-center" style="padding-top:20px;">
<div style="height: 30px;background: #f4faff;padding-top:5px;border-radius: 4px;">
<div class="FontColor-Words-Small" style="width:35%;float:left;">执行合同数量</div>
<div style="padding-top:5px;width:40%;float:left;">
<div class="progress1">
<div class="progress-bar1" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" id = "zqhtsstylestyle" style="float:left;">
<span class="sr-only">60% Complete</span>
</div>
</div>
</div>
<div class="FontColor-Numbers-Light FontSize-Numbers-Xsmall" id="zxhts" style="text-align:center;width:25%;float:center;padding-top:2px;"></div>
</div>
</div>
<div class="row">&#12288;&#12288;</div>
<div class="col-md-12 text-center" style="padding-top:10px;">
<div style="height: 50%;width: 100%;">
<div class="col-md-6" id="equ-good4" style="height:120px;"></div>
<div class="col-md-6" id="equ-good5" style="height:120px;"></div>
</div>
</div>
<div class="row">&#12288;&#12288;</div>
</div>
<!-- /.box-body -->
</div>
</div>
</div>
</div>
</section>
<!-- /.content -->
</div>
<%--<jsp:include page="/jsp/bottom.jsp"></jsp:include>--%>
<%--<jsp:include page="/jsp/side.jsp"></jsp:include>--%>
</div>
<script type="text/javascript">
</script>
</body>
</html>