508 lines
21 KiB
Plaintext
508 lines
21 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>
|
|
<title><%= ServerObject.atttable.get("TOPTITLE")%></title>
|
|
<!-- 引用页头及CSS页-->
|
|
<jsp:include page="/jsp/inc.jsp"></jsp:include>
|
|
<!-- Ionicons -->
|
|
<link rel="stylesheet" href="<%=request.getContextPath()%>/node_modules/ionicons/css/ionicons.min.css"/>
|
|
<!-- jvectormap -->
|
|
<link rel="stylesheet" href="<%=request.getContextPath()%>/CSS/jvectormap/jquery-jvectormap.css">
|
|
<style type="text/css" rel="stylesheet">
|
|
.top-card {
|
|
background-color: white;
|
|
}
|
|
.top-card:hover {
|
|
color: black;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.inner h3 {
|
|
text-align: right;
|
|
}
|
|
|
|
.inner p:hover {
|
|
color: black;
|
|
}
|
|
</style>
|
|
<script type="text/javascript" src="<%=request.getContextPath()%>/plugins/jvectormap/jvectormap-next/jquery-jvectormap.min.js" charset="utf-8"></script>
|
|
<script type="text/javascript" src="<%=request.getContextPath()%>/plugins/jvectormap/jquery-jvectormap-cn-mill.js" charset="utf-8"></script>
|
|
<script type="text/javascript">
|
|
|
|
function goToLocation(url){
|
|
$.post(ext.contextPath +"/user/getMenuRelation.do",{location:url},function(data){
|
|
console.info(data)
|
|
if(data.length>2){
|
|
doforward(url,data[2].id,data[1].id,data[0].id)
|
|
}
|
|
},'json');
|
|
|
|
}
|
|
$(function() {
|
|
//获取所有当前待办任务数量
|
|
$.post(ext.contextPath +"/maintenance/getTaskListAmount.do",function(data){
|
|
if(data.total>0){
|
|
$('#taskNum').html(data.total)
|
|
}
|
|
},'json');
|
|
//获取问题发起数量
|
|
$.post(ext.contextPath +"/maintenance/getLaunchListAmount.do",function(data){
|
|
if(data.amount>0){
|
|
$('#launchProblemNum').html(data.amount)
|
|
}
|
|
},'json');
|
|
//获取问题未完成数量
|
|
$.post(ext.contextPath +"/maintenance/getUnfinishAmount.do",function(data){
|
|
if(data.amount>0){
|
|
$('#unFinishNum').html(data.amount)
|
|
}
|
|
},'json');
|
|
//获取维护详情未完成数量
|
|
$.post(ext.contextPath +"/maintenance/getUnfinishDetailAmount.do",function(data){
|
|
if(data.amount>0){
|
|
$('#unSolveNum').html(data.amount)
|
|
}
|
|
},'json');
|
|
//获取所有未读消息数量
|
|
$.post(ext.contextPath +"/msg/getUnreadMsgs.do",function(data){
|
|
if(data.total>0){
|
|
$('#unReadMsgNum').html(data.total)
|
|
}
|
|
},'json');
|
|
});
|
|
|
|
|
|
</script>
|
|
|
|
</head>
|
|
<body onload="initMenu();" class="hold-transition skin-blue sidebar-mini">
|
|
<div class="wrapper" style="margin-left:-230px;">
|
|
|
|
<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' onclick="goToMainPage();" style="cursor:pointer "><i class="fa fa-dashboard"></i> 首页</a></li>
|
|
</ol>
|
|
</section>
|
|
|
|
<!-- Main content -->
|
|
<section class="content" id="homePage">
|
|
<!-- Small boxes (Stat box) -->
|
|
<div class="row">
|
|
<div class="col-lg-3 col-xs-6">
|
|
<!-- small box -->
|
|
<div class="small-box bg-white top-card">
|
|
<div class="inner">
|
|
|
|
|
|
<span style="font-size:25px;">入住企业</span>
|
|
<h3 style="color:#64a5cb;font-size:60px;" id="enterpriseNum"><span style="font-size:14px;font-weight:normal">家</span></h3>
|
|
</div>
|
|
<!--<div class="icon">-->
|
|
<!--<i class="ion ion-bag"></i>-->
|
|
<!--</div>-->
|
|
<!--<a href="#" class="small-box-footer" style="background-color:white;color:white">M</a>-->
|
|
</div>
|
|
</div>
|
|
<!-- ./col -->
|
|
<div class="col-lg-3 col-xs-6">
|
|
<!-- small box -->
|
|
<div class="small-box bg-white top-card">
|
|
<div class="inner">
|
|
<span style="font-size:25px;">接入设备台数</span>
|
|
<h3 style="color:#64a5cb;font-size:60px;" id="equipmentsNum"><span style="font-size:14px;font-weight:normal">台</span></h3>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- ./col -->
|
|
<div class="col-lg-3 col-xs-6">
|
|
<!-- small box -->
|
|
<div class="small-box bg-white top-card">
|
|
<div class="inner">
|
|
<span style="font-size:25px;">接入测量点数</span>
|
|
<h3 style="color:#64a5cb;font-size:60px;" id="mpointsNum"> <span style="font-size:14px;font-weight:normal">个</span></h3>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- ./col -->
|
|
<div class="col-lg-3 col-xs-6">
|
|
<!-- small box -->
|
|
<div class="small-box bg-white top-card">
|
|
<div class="inner">
|
|
<span style="font-size:25px;">分布城市</span>
|
|
<h3 style="color:#64a5cb;font-size:60px;" id="citesNum"><span style="font-size:14px;font-weight:normal">个</span></h3>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- ./col -->
|
|
</div>
|
|
<!-- /.row -->
|
|
<!-- Main row -->
|
|
<div class="row">
|
|
<!-- right col (We are only adding the ID to make the widgets sortable)-->
|
|
<section class="col-lg-9 connectedSortable">
|
|
|
|
<!-- Map box -->
|
|
<div class="box box-solid bg-light-blue-gradient">
|
|
<div class="box-header">
|
|
<!-- tools box -->
|
|
<div class="pull-right box-tools">
|
|
<button type="button" class="btn btn-primary btn-sm daterange pull-right" data-toggle="tooltip" title="Date range">
|
|
<i class="fa fa-calendar"></i></button>
|
|
<button type="button" class="btn btn-primary btn-sm pull-right" data-widget="collapse" data-toggle="tooltip" title="Collapse" style="margin-right: 5px;">
|
|
<i class="fa fa-minus"></i></button>
|
|
</div>
|
|
<!-- /. tools -->
|
|
|
|
<i class="fa fa-map-marker"></i>
|
|
|
|
<h3 class="box-title">
|
|
查看全国指数
|
|
</h3>
|
|
</div>
|
|
<div class="box-body">
|
|
<div id="china-map" style="height: 525px; width: 100%;"></div>
|
|
</div>
|
|
<!-- /.box-body-->
|
|
</div>
|
|
<!-- /.box -->
|
|
|
|
|
|
|
|
|
|
</section>
|
|
<!-- right col -->
|
|
|
|
|
|
<!-- Left col -->
|
|
<section class="col-lg-3 connectedSortable">
|
|
|
|
<div class="small-box bg-white top-card">
|
|
<div class="inner">
|
|
<span style="font-size:25px;">分布省</span>
|
|
<h3 style="color:#64a5cb;font-size:60px;" id="provincesNum"><span style="font-size:14px;font-weight:normal">个</span></h3>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="small-box bg-white top-card">
|
|
<div class="inner">
|
|
<span style="font-size:25px;">待机率</span>
|
|
<h3 style="color:#64a5cb;font-size:60px;">0.01<span style="font-size:14px;font-weight:normal">%</span></h3>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="small-box bg-white top-card">
|
|
<div class="inner">
|
|
<span style="font-size:25px;">故障率</span>
|
|
<h3 style="color:#64a5cb;font-size:60px;">0<span style="font-size:14px;font-weight:normal">%</span></h3>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="small-box bg-white top-card">
|
|
<div class="inner">
|
|
<span style="font-size:25px;">运行率</span>
|
|
<h3 style="color:#64a5cb;font-size:60px;">21.13<span style="font-size:14px;font-weight:normal">%</span></h3>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
</section>
|
|
<!-- /.Left col -->
|
|
|
|
</div>
|
|
<!-- /.row (main row) -->
|
|
|
|
</section>
|
|
<!-- /.content -->
|
|
</div>
|
|
<%-- <jsp:include page="/jsp/bottom.jsp"></jsp:include> --%>
|
|
<%-- <jsp:include page="/jsp/side.jsp"></jsp:include> --%>
|
|
</div>
|
|
<script type="text/javascript">
|
|
|
|
$(function(){
|
|
/* $.ajax("http://132.120.136.245:8080/DataManage/proapp.do?method=getStatisticalInfo",{
|
|
dataType: 'jsonp',
|
|
crossDomain: true,
|
|
success:function(data){
|
|
console.log(data);
|
|
}
|
|
}); */
|
|
$.get('${url}'+"/proapp.do?method=getStatisticalInfo",function(data){
|
|
console.log(ext.contextPath);
|
|
var visitorsData = {
|
|
US: 398, // USA
|
|
SA: 400, // Saudi Arabia
|
|
CA: 1000, // Canada
|
|
DE: 500, // Germany
|
|
FR: 760, // France
|
|
CN: 300, // China
|
|
AU: 700, // Australia
|
|
BR: 600, // Brazil
|
|
IN: 800, // India
|
|
GB: 320, // Great Britain
|
|
RU: 3000 // Russia
|
|
};
|
|
|
|
var dataStatus = [
|
|
/* { id: 'HKG', code:'', region:'', name: '香港', event: [], url: '' }, */
|
|
{ id: 'HAI', code:'CN-46', region:'', name: '海南', event: [], url: '' },
|
|
{ id: 'YUN', code:'CN-53', region:'', name: '云南', event: [], url: '' },
|
|
{ id: 'BEJ', code:'CN-11', region:'', name: '北京', event: [], url: '/event/1' },
|
|
{ id: 'TAJ', code:'CN-12', region:'', name: '天津', event: [], url: '' },
|
|
{ id: 'XIN', code:'CN-65', region:'', name: '新疆', event: [], url: '' },
|
|
{ id: 'TIB', code:'CN-54', region:'', name: '西藏', event: [], url: '' },
|
|
{ id: 'QIH', code:'CN-63', region:'', name: '青海', event: [], url: '' },
|
|
{ id: 'GAN', code:'CN-62', region:'', name: '甘肃', event: [], url: '' },
|
|
{ id: 'NMG', code:'CN-15', region:'', name: '内蒙古', event: [], url: '' },
|
|
{ id: 'NXA', code:'CN-64', region:'', name: '宁夏', event: [], url: '' },
|
|
{ id: 'SHX', code:'CN-14', region:'', name: '山西', event: [], url: '' },
|
|
{ id: 'LIA', code:'CN-21', region:'0411', name: '辽宁', event: [], url: '' },
|
|
{ id: 'JIL', code:'CN-22', region:'', name: '吉林', event: [], url: '' },
|
|
{ id: 'HLJ', code:'CN-23', region:'', name: '黑龙江', event: [], url: '' },
|
|
{ id: 'HEB', code:'CN-13', region:'', name: '河北', event: [], url: '' },
|
|
{ id: 'SHD', code:'CN-37', region:'', name: '山东', event: [], url: '' },
|
|
{ id: 'HEN', code:'CN-41', region:'', name: '河南', event: [], url: '' },
|
|
{ id: 'SHA', code:'CN-61', region:'', name: '陕西', event: [], url: '' },
|
|
{ id: 'SCH', code:'CN-51', region:'', name: '四川', event: [], url: '/event/2' },
|
|
{ id: 'CHQ', code:'CN-50', region:'', name: '重庆', event: [], url: '' },
|
|
{ id: 'HUB', code:'CN-42', region:'', name: '湖北', event: [], url: '/event/3' },
|
|
{ id: 'ANH', code:'CN-34', region:'', name: '安徽', event: [], url: '' },
|
|
{ id: 'JSU', code:'CN-32', region:'', name: '江苏', event: [], url: '' },
|
|
{ id: 'SHH', code:'CN-31', region:'021', name: '上海', event: [], url: '' },
|
|
{ id: 'ZHJ', code:'CN-33', region:'',name: '浙江', event: [], url: '' },
|
|
{ id: 'FUJ', code:'CN-47', region:'', name: '福建', event: [], url: '' },
|
|
{ id: 'TAI', code:'CN-48', region:'', name: '台湾', event: [], url: '' },
|
|
{ id: 'JXI', code:'CN-36', region:'', name: '江西', event: [], url: '' },
|
|
{ id: 'HUN', code:'CN-43', region:'', name: '湖南', event: [], url: '' },
|
|
{ id: 'GUI', code:'CN-52', region:'', name: '贵州', event: [], url: '' },
|
|
{ id: 'GXI', code:'CN-45', region:'', name: '广西', event: [], url: '' },
|
|
{ id: 'GUD', code:'CN-44', region:'', name: '广东', event: [], url: '' }
|
|
|
|
];
|
|
|
|
//var data = {"re0":"pass","re1":[{"alarmstate":"0","area":"上海","company":"BLG","distxt":"上海白龙港污水处理厂","equionumber":32,"id":"1","mpoint":73,"nature":"污水厂","region":"021 ","sucrate":100},{"alarmstate":"0","area":"上海","company":"JS","distxt":"上海金山新江污水处理厂","equionumber":27,"id":"2","mpoint":90,"nature":"污水厂","region":"021 ","sucrate":100},{"alarmstate":"0","area":"上海","company":"JSLX","distxt":"上海金山廊下污水处理厂","equionumber":18,"id":"3","mpoint":49,"nature":"污水厂","region":"021 ","sucrate":100},{"alarmstate":"0","area":"上海","company":"QY","distxt":"上海曲阳污水处理厂","equionumber":15,"id":"4","mpoint":42,"nature":"污水厂","region":"021 ","sucrate":100},{"alarmstate":"0","area":"上海","company":"SDK","distxt":"上海石洞口污水处理厂","equionumber":33,"id":"5","mpoint":70,"nature":"污水厂","region":"021 ","sucrate":100},{"alarmstate":"0","area":"上海","company":"SJXB","distxt":"上海新浜污水处理厂","equionumber":9,"id":"6","mpoint":30,"nature":"污水厂","region":"021 ","sucrate":100},{"alarmstate":"0","area":"上海","company":"TS","distxt":"上海天山污水处理厂","equionumber":19,"id":"7","mpoint":44,"nature":"污水厂","region":"021 ","sucrate":100},{"alarmstate":"0","area":"上海","company":"HQ","distxt":"上海虹桥能源中心","equionumber":0,"id":"8","mpoint":198,"nature":"企业","region":"021 ","sucrate":100},{"alarmstate":"0","area":"上海","company":"ZY1C","distxt":"上海竹园友联第一污水处理厂","equionumber":5,"id":"9","mpoint":57,"nature":"污水厂","region":"021 ","sucrate":100},{"alarmstate":"0","area":"上海","company":"ZY2C","distxt":"上海竹园第二污水处理厂","equionumber":11,"id":"10","mpoint":56,"nature":"污水厂","region":"021 ","sucrate":100},{"alarmstate":"0","area":"上海","company":"WS","distxt":"上海吴淞污水处理厂","equionumber":13,"id":"11","mpoint":107,"nature":"污水厂","region":"021 ","sucrate":100},{"alarmstate":"0","area":"大连","company":"DLQSH","distxt":"大连泉水河污水处理厂","equionumber":29,"id":"12","mpoint":117,"nature":"污水厂","region":"0411 ","sucrate":100},{"alarmstate":"0","area":"大连","company":"DLDLW","distxt":"大连大连湾污水处理厂","equionumber":39,"id":"13","mpoint":115,"nature":"污水厂","region":"0411 ","sucrate":100}]};
|
|
// 绘制数据地图
|
|
//setTimeout(function(){
|
|
createChinaMap(visitorsData,dataStatus,data);
|
|
//},0);
|
|
});
|
|
},'json');
|
|
// 绘制数据地图
|
|
function createChinaMap(visitorsData,dataStatus,data) {
|
|
data=JSON.parse(data);
|
|
console.log(data);
|
|
|
|
|
|
$.each(dataStatus,function(di,ds){
|
|
if(data.re1){
|
|
$.each(data['re1'], function(i,v){
|
|
console.log(v);
|
|
if($.trim(v.region) === ds.region) {
|
|
ds.event.push(v);
|
|
}
|
|
});
|
|
}
|
|
});
|
|
// jvectormap data
|
|
|
|
|
|
// China map by jvectormap
|
|
var opts = {
|
|
map: 'cn_mill',
|
|
backgroundColor: 'transparent',
|
|
regionStyle: {
|
|
initial: {
|
|
fill: '#e4e4e4',
|
|
'fill-opacity': 1,
|
|
stroke: 'none',
|
|
'stroke-width': 0,
|
|
'stroke-opacity': 1
|
|
}
|
|
},
|
|
series: {
|
|
regions: [{
|
|
//values: visitorsData,
|
|
scale: ['#92c1dc', '#ebf4f9'],
|
|
normalizeFunction: 'polynomial'
|
|
}]
|
|
},
|
|
onRegionTipShow: function(event, label, code) {
|
|
|
|
|
|
$.each(dataStatus, function(i, items) {
|
|
|
|
if (code == items.code) {
|
|
if(label.region === ""){
|
|
label.html(items.name);
|
|
} else {
|
|
console.log(label);
|
|
console.log(items.name);
|
|
console.log("ddd@"+JSON.stringify(items));
|
|
var html = "<div>";
|
|
$.each(items.event,function(ei,ev){
|
|
console.log(ev);
|
|
html += "<span>" + ev.distxt + ",接入设备数："+ ev.equionumber
|
|
+"</span><br/>";
|
|
|
|
});
|
|
label.html(html+"</div>");
|
|
}
|
|
|
|
} else {
|
|
if(label.region === ""){
|
|
label.html(label.name);
|
|
}
|
|
}
|
|
});
|
|
|
|
|
|
|
|
|
|
},
|
|
markerStyle: {
|
|
initial: {
|
|
fill: '#00a65a',
|
|
stroke: '#111'
|
|
}
|
|
},
|
|
markers: [
|
|
/* { latLng: [39.93, 116.40], name: '北京' },
|
|
{ latLng: [39.14, 117.21], name: '天津' },
|
|
{ latLng: [38.05, 114.52], name: '河北 - 石家庄' },
|
|
{ latLng: [37.89, 112.55], name: '山西 - 太原' },
|
|
|
|
{ latLng: [40.83, 111.66], name: '内蒙古自治区 - 呼和浩特' }, */
|
|
{ latLng: [41.81, 123.43], name: '辽宁省 - 沈阳' },
|
|
/* { latLng: [43.82, 125.32], name: '吉林省 - 长春' },
|
|
{ latLng: [45.77, 126.66], name: '黑龙江省 - 哈尔滨' }, */
|
|
|
|
{ latLng: [31.23, 121.48], name: '上海市' },
|
|
/* { latLng: [32.06, 118.78], name: '江苏省 - 南京' },
|
|
{ latLng: [30.26, 120.22], name: '浙江省 - 杭州' },
|
|
{ latLng: [31.87, 117.29], name: '安徽省 - 合肥' },
|
|
|
|
{ latLng: [26.05, 119.33], name: '福建省 - 厦门' },
|
|
{ latLng: [28.69, 115.89], name: '江西省 - 南昌' },
|
|
{ latLng: [30.26, 120.22], name: '浙江省 - 杭州' },
|
|
{ latLng: [31.87, 117.29], name: '安徽省 - 合肥' } */
|
|
]
|
|
};
|
|
|
|
/* var myCustomColors = {
|
|
'LIA': '#4E7387',
|
|
'SHH': '#333333'
|
|
};
|
|
|
|
opts.series.regions[0].setValues(myCustomColors); */
|
|
$('#china-map').vectorMap(opts);
|
|
|
|
|
|
/* $.each(dataStatus, function (i, items) {
|
|
console.log('lll',items.event);
|
|
if (items.event.length !== 0) {
|
|
var jsonStr = "{" + items.id + ":'#00FF00'}";
|
|
$('#china-map').vectorMap('set', 'colors', eval('(' + jsonStr + ')'));
|
|
}
|
|
}); */
|
|
|
|
|
|
|
|
console.log(dataStatus);
|
|
// 计算入住企业
|
|
calEnterpriseNum(dataStatus);
|
|
// 计算接入设备台数
|
|
calEquipmentsNum(dataStatus);
|
|
// 计算接入测量点数
|
|
calMpointsNum(dataStatus);
|
|
// 计算分布城市
|
|
calCitesNum(dataStatus);
|
|
// 计算分布省
|
|
calProvincesNum(dataStatus);
|
|
|
|
|
|
}
|
|
|
|
// 计算入住企业数
|
|
function calEnterpriseNum(dataStatus) {
|
|
var enterpriseNum = 0;
|
|
$.each(dataStatus,function(i,v){
|
|
if(v.event.length){
|
|
enterpriseNum += v.event.length;
|
|
}
|
|
});
|
|
$("#enterpriseNum").html(enterpriseNum);
|
|
|
|
}
|
|
|
|
// 计算设备接入台数
|
|
function calEquipmentsNum(dataStatus){
|
|
var equipmentsNum = 0;
|
|
$.each(dataStatus,function(i,v){
|
|
if(v.event.length){
|
|
$.each(v.event,function(k,val){
|
|
equipmentsNum += val.equionumber;
|
|
});
|
|
}
|
|
});
|
|
$("#equipmentsNum").html(equipmentsNum);
|
|
}
|
|
|
|
// 计算接入测量点数
|
|
function calMpointsNum(dataStatus){
|
|
var mpointsNum = 0;
|
|
$.each(dataStatus,function(i,v){
|
|
if(v.event.length){
|
|
$.each(v.event,function(k,val){
|
|
mpointsNum += val.mpoint;
|
|
});
|
|
}
|
|
});
|
|
$("#mpointsNum").html(mpointsNum);
|
|
}
|
|
|
|
// 计算分布省份
|
|
function calCitesNum(dataStatus) {
|
|
var citesNum = 0;
|
|
$.each(dataStatus,function(i,v){
|
|
if(v.event.length){
|
|
citesNum += 1;
|
|
}
|
|
});
|
|
$("#citesNum").html(citesNum);
|
|
}
|
|
|
|
// 计算分布省份
|
|
function calProvincesNum(dataStatus) {
|
|
var provincesNum = 0;
|
|
$.each(dataStatus,function(i,v){
|
|
if(v.event.length){
|
|
provincesNum += 1;
|
|
}
|
|
});
|
|
$("#provincesNum").html(provincesNum);
|
|
}
|
|
</script>
|
|
</body>
|
|
</html> |