1882 lines
73 KiB
Plaintext
1882 lines
73 KiB
Plaintext
|
<%@ page language="java" contentType="text/html; charset=UTF-8"
|
|||
|
|
pageEncoding="UTF-8" %>
|
|||
|
|
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
|
|||
|
|
<%@ taglib prefix="shiro" uri="http://shiro.apache.org/tags" %>
|
|||
|
|
<c:set var="ctx" value="${pageContext.request.contextPath}"/>
|
|||
|
|
<html lang="zh-CN">
|
|||
|
|
<head>
|
|||
|
|
<title>终端状态</title>
|
|||
|
|
<meta charset="UTF-8">
|
|||
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
|||
|
|
<meta name="viewport"
|
|||
|
|
content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no"/>
|
|||
|
|
<link rel="stylesheet" href="${ctx}/css/plugin/slide/reset.css">
|
|||
|
|
<link rel="stylesheet" href="${ctx}/css/plugin/bootstrap/bootstrap.min.css">
|
|||
|
|
<link rel="stylesheet" href="${ctx}/css/plugin/datatimepicker/bootstrap-datetimepicker.css">
|
|||
|
|
<link rel="stylesheet" href="${ctx}/css/plugin/datatables/datatables.bootstrap.css">
|
|||
|
|
<link rel="stylesheet" href="${ctx}/css/plugin/bootstrapSwitch/bootstrap-switch.min.css">
|
|||
|
|
<link rel="stylesheet" href="${ctx}/css/plugin/ztree/zTreeStyle.css">
|
|||
|
|
<link rel="stylesheet" href="${ctx}/css/plugin/fontawesome/font-awesome.min.css">
|
|||
|
|
<link rel="stylesheet" href="${ctx}/css/basic.css">
|
|||
|
|
<link rel="stylesheet" href="${ctx}/css/plugin/basicButton.css">
|
|||
|
|
<style>
|
|||
|
|
html, body {
|
|||
|
|
background-color: #F9F9F9 !important;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
table {
|
|||
|
|
font-size: 12px !important;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
#before,#next,#query{
|
|||
|
|
height: 20px !important;
|
|||
|
|
}
|
|||
|
|
.wanzhengdiv {
|
|||
|
|
position: absolute;
|
|||
|
|
z-index: 100;
|
|||
|
|
top:70px;
|
|||
|
|
}
|
|||
|
|
</style>
|
|||
|
|
</head>
|
|||
|
|
<body>
|
|||
|
|
<div class="container-fluid">
|
|||
|
|
<div class="form-inline mt5 wanzhengdiv">
|
|||
|
|
<div class="form-group has-feedback mr10">
|
|||
|
|
<span class=' font12 fontBold'>终端状态(左柱) <span class='run'><span class='inB bg-run smallBlock'></span> 投运 </span><span class='breaks'><span class='inB bg-breaks smallBlock'></span> 热备用 </span><span class='grey'><span class='inB bg-grey smallBlock'></span> 停运 </span></span>
|
|||
|
|
<span class=' font12 fontBold' > 终端在线率(右柱) <span class='info'><span class='inB bg-info smallBlock'></span> 在线率≥90%</span><span class='warn'> <span class='inB bg-warn smallBlock'></span> 60%≤在线率<90% </span><span class='error'> <span class='inB bg-error smallBlock'></span> 在线率<60%</span> </span>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
<div class="form-inline mt10">
|
|||
|
|
<div class="form-group has-feedback mr10" >
|
|||
|
|
<label >分类方式：</label>
|
|||
|
|
<select class="width3 form-control" id="datatype">
|
|||
|
|
<option selected value="0">区域</option>
|
|||
|
|
<option value="1">电压等级</option>
|
|||
|
|
<option value="2">终端厂家</option>
|
|||
|
|
<option value="3">干扰源类型</option>
|
|||
|
|
</select>
|
|||
|
|
</div>
|
|||
|
|
<div class="form-group has-feedback mr10" >
|
|||
|
|
<label >统计类型：</label>
|
|||
|
|
<input type="checkbox" checked class="checkbox" />
|
|||
|
|
</div>
|
|||
|
|
<div class="form-group">
|
|||
|
|
<%@include file="../../include/time.jsp"%>
|
|||
|
|
<button type="button" class="btn btn-primary " id="query">
|
|||
|
|
<i class="glyphicon glyphicon-search"></i>
|
|||
|
|
</button>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<div class="form-inline mt10">
|
|||
|
|
<div class="form-group has-feedback" >
|
|||
|
|
<label >区域：</label>
|
|||
|
|
<div class="disinlineb">
|
|||
|
|
<input id="area" class="form-control" style="width: 140px" readonly>
|
|||
|
|
<i class="fa fa-caret-down areaicon"></i>
|
|||
|
|
<i class="fa fa-caret-up treeUpIcon disnone"
|
|||
|
|
style="color: #C9CBCE;position: absolute;left: 60px;font-size: 18px;z-index: 9999;top: 20px"></i>
|
|||
|
|
<div class=" ztree treeUpDiv disnone " id="areaTree"
|
|||
|
|
style="position: absolute;width: 140px;height: 147px;border: 2px solid #C9CBCE;overflow: auto;top: 32px;background: #fff;z-index: 100;border-radius: 2px">
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<div class="form-group has-feedback mr10" >
|
|||
|
|
<label >电压等级：</label>
|
|||
|
|
<select class="width3 form-control" id="scale"></select>
|
|||
|
|
</div>
|
|||
|
|
<div class="form-group has-feedback mr10" >
|
|||
|
|
<label >终端厂家：</label>
|
|||
|
|
<select class="width3 form-control" id="manc"></select>
|
|||
|
|
</div>
|
|||
|
|
<div class="form-group has-feedback mr10" >
|
|||
|
|
<label >干扰源类型：</label>
|
|||
|
|
<select class="width3 form-control" id="loadtype"></select>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
<div class="row mt5">
|
|||
|
|
<%--区域模块--%>
|
|||
|
|
<div class="col-sm-7" id="areaDepts"></div>
|
|||
|
|
<div class="col-sm-5" id="areaT">
|
|||
|
|
<table id="areaTable" class="table table-striped table-bordered dataTable no-footer">
|
|||
|
|
<thead>
|
|||
|
|
<tr>
|
|||
|
|
<th>区域</th>
|
|||
|
|
<th>终端个数</th>
|
|||
|
|
<th>投运</th>
|
|||
|
|
<th>热备用</th>
|
|||
|
|
<th>停运</th>
|
|||
|
|
<th>在线率(%)</th>
|
|||
|
|
</tr>
|
|||
|
|
</thead>
|
|||
|
|
</table>
|
|||
|
|
</div>
|
|||
|
|
<%-- 终端厂家模块 --%>
|
|||
|
|
<div class="col-sm-7" id="company" style="display: none;"></div>
|
|||
|
|
<div class="col-sm-5" id="companyT" style="display: none;">
|
|||
|
|
<table id="companyTable" class="table table-striped table-bordered dataTable no-footer">
|
|||
|
|
<thead>
|
|||
|
|
<tr>
|
|||
|
|
<th>厂家</th>
|
|||
|
|
<th>终端个数</th>
|
|||
|
|
<th>投运</th>
|
|||
|
|
<th>热备用</th>
|
|||
|
|
<th>停运</th>
|
|||
|
|
<th>在线率(%)</th>
|
|||
|
|
</tr>
|
|||
|
|
</thead>
|
|||
|
|
</table>
|
|||
|
|
</div>
|
|||
|
|
<%-- 电压等级模块 --%>
|
|||
|
|
<div class="col-sm-7" id="vol" style="display: none;"></div>
|
|||
|
|
<div class="col-sm-5" id="volT" style="display: none;">
|
|||
|
|
<table id="volTable" class="table table-striped table-bordered dataTable no-footer">
|
|||
|
|
<thead>
|
|||
|
|
<tr>
|
|||
|
|
<th>电压等级</th>
|
|||
|
|
<th>终端个数</th>
|
|||
|
|
<th>投运</th>
|
|||
|
|
<th>热备用</th>
|
|||
|
|
<th>停运</th>
|
|||
|
|
<th>在线率(%)</th>
|
|||
|
|
</tr>
|
|||
|
|
</thead>
|
|||
|
|
</table>
|
|||
|
|
</div>
|
|||
|
|
<%-- 干扰源模块 --%>
|
|||
|
|
<div class="col-sm-7" id="loadtypep" style="display: none;"></div>
|
|||
|
|
<div class="col-sm-5" id="loadtypeT" style="display: none;">
|
|||
|
|
<table id="loadtypeTable" class="table table-striped table-bordered dataTable no-footer">
|
|||
|
|
<thead>
|
|||
|
|
<tr>
|
|||
|
|
<th>干扰源类型</th>
|
|||
|
|
<th>终端个数</th>
|
|||
|
|
<th>投运</th>
|
|||
|
|
<th>热备用</th>
|
|||
|
|
<th>停运</th>
|
|||
|
|
<th>在线率(%)</th>
|
|||
|
|
</tr>
|
|||
|
|
</thead>
|
|||
|
|
</table>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
<script src="${ctx}/js/plugin/jquery/jquery.min.js"></script>
|
|||
|
|
<script src="${ctx}/js/plugin/echarts/echarts.js"></script>
|
|||
|
|
<script src="${ctx}/js/plugin/layui/layer.js"></script>
|
|||
|
|
<script src="${ctx}/js/plugin/jquery/jquery.contextMenu.js"></script>
|
|||
|
|
<script src="${ctx}/js/plugin/jquery/jquery.cleverTabs.js"></script>
|
|||
|
|
<script src="${ctx}/js/plugin/datatables/datatables.jquery.js"></script>
|
|||
|
|
<script src="${ctx}/js/plugin/datatables/datatables.bootstrap.js"></script>
|
|||
|
|
<script src="${ctx}/jspJS/utils/loading.js"></script>
|
|||
|
|
<script src="${ctx}/js/color.js"></script>
|
|||
|
|
<script src="${ctx}/js/plugin/bootstrap/bootstrap-datetimepicker.js"></script>
|
|||
|
|
<script src="${ctx}/js/plugin/bootstrap/bootstrap-datetimepicker.zh-CN.js"></script>
|
|||
|
|
<script src="${ctx}/jspJS/utils/judgeAjaxStatus.js"></script>
|
|||
|
|
<script src="${ctx}/js/plugin/bootstrap/bootstrap-datetimepicker.js"></script>
|
|||
|
|
<script src="${ctx}/js/plugin/bootstrap/bootstrap-datetimepicker.zh-CN.js"></script>
|
|||
|
|
<script src="${ctx}/js/plugin/bootstrapSwitch/bootstrap-switch.min.js"></script>
|
|||
|
|
<script src="${ctx}/js/plugin/ztree/jquery.ztree.core.js"></script>
|
|||
|
|
<script src="${ctx}/js/area.js"></script>
|
|||
|
|
<script src="${ctx}/js/basic.js"></script>
|
|||
|
|
<script src="${ctx}/jspJS/utils/timeControl.js"></script>
|
|||
|
|
<script src="${ctx}/jspJS/utils/barUtil.js"></script>
|
|||
|
|
<script>
|
|||
|
|
var picHeight;
|
|||
|
|
var tabs;
|
|||
|
|
var $area = $("#area");
|
|||
|
|
var $startTime = $("#startTime");
|
|||
|
|
var $endTime = $("#endTime");
|
|||
|
|
var areaResult = null;
|
|||
|
|
var volResult = null;
|
|||
|
|
var companyResult = null;
|
|||
|
|
var loadtypeResult = null;
|
|||
|
|
var tiggleValue = "";
|
|||
|
|
var areLength;//区域的个数
|
|||
|
|
var volLength;
|
|||
|
|
var companyLength;//厂家个数
|
|||
|
|
var loadtypeLength;
|
|||
|
|
$("#interval").val("月份");
|
|||
|
|
var showtype = 0;
|
|||
|
|
var buttonname;
|
|||
|
|
var companyname;
|
|||
|
|
|
|||
|
|
// 新增tab页
|
|||
|
|
function addTab(url, label) {
|
|||
|
|
tabs.add({url: url, label: label});
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
$("#datatype").on("change",function() {
|
|||
|
|
var startTime = $startTime.eq(0).val();
|
|||
|
|
var endTime = $endTime.eq(0).val();
|
|||
|
|
var area = $area.eq(0).attr("index");
|
|||
|
|
if($("option:selected",this).val() == 0){
|
|||
|
|
$.ajax({
|
|||
|
|
type: "POST",
|
|||
|
|
url: "/pqs9000/user/getAreasInfo",
|
|||
|
|
dataType: 'json',
|
|||
|
|
async:false,
|
|||
|
|
success: function (data) {
|
|||
|
|
$("#area").val(data[0].name);
|
|||
|
|
$("#area").attr("index", data[0].id);
|
|||
|
|
areaTree = $.fn.zTree.init($("#areaTree"), settingAreaTree, data);
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
$("#area").attr("disabled",true);
|
|||
|
|
$("#scale").attr("disabled",false);
|
|||
|
|
$("#manc").attr("disabled",false);
|
|||
|
|
$("#loadtype").attr("disabled",false);
|
|||
|
|
|
|||
|
|
showtype = 0;
|
|||
|
|
var area = $area.eq(0).attr("index");
|
|||
|
|
var scale = $("#scale").val();
|
|||
|
|
var manc = $("#manc").val();
|
|||
|
|
var loadtype = $("#loadtype").val();
|
|||
|
|
refresh(startTime, endTime, area,scale,manc,loadtype)
|
|||
|
|
}else if($("option:selected",this).val() == 1){
|
|||
|
|
loadselect("电压等级","scale");
|
|||
|
|
$("#area").attr("disabled",false);
|
|||
|
|
$("#scale").attr("disabled",true);
|
|||
|
|
$("#manc").attr("disabled",false);
|
|||
|
|
$("#loadtype").attr("disabled",false);
|
|||
|
|
|
|||
|
|
$("#area").css("background-color","#fff");
|
|||
|
|
showtype = 1;
|
|||
|
|
var area = $area.eq(0).attr("index");
|
|||
|
|
var scale = $("#scale").val();
|
|||
|
|
var manc = $("#manc").val();
|
|||
|
|
var loadtype = $("#loadtype").val();
|
|||
|
|
refresh(startTime, endTime, area,scale,manc,loadtype);
|
|||
|
|
}else if($("option:selected",this).val() == 2){
|
|||
|
|
loadselect("制造厂商","manc");
|
|||
|
|
$("#area").attr("disabled",false);
|
|||
|
|
$("#scale").attr("disabled",false);
|
|||
|
|
$("#manc").attr("disabled",true);
|
|||
|
|
$("#loadtype").attr("disabled",false);
|
|||
|
|
$("#area").css("background-color","#fff");
|
|||
|
|
showtype = 2;
|
|||
|
|
var scale = $("#scale").val();
|
|||
|
|
var manc = $("#manc").val();
|
|||
|
|
var loadtype = $("#loadtype").val();
|
|||
|
|
refresh(startTime, endTime, area,scale,manc,loadtype);
|
|||
|
|
}else if($("option:selected",this).val() == 3){
|
|||
|
|
loadselect("干扰源类型","loadtype");
|
|||
|
|
$("#area").attr("disabled",false);
|
|||
|
|
$("#scale").attr("disabled",false);
|
|||
|
|
$("#manc").attr("disabled",false);
|
|||
|
|
$("#loadtype").attr("disabled",true);
|
|||
|
|
$("#area").css("background-color","#fff");
|
|||
|
|
showtype = 3;
|
|||
|
|
var area = $area.eq(0).attr("index");
|
|||
|
|
var scale = $("#scale").val();
|
|||
|
|
var manc = $("#manc").val();
|
|||
|
|
var loadtype = $("#loadtype").val();
|
|||
|
|
refresh(startTime, endTime, area,scale,manc,loadtype);
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
|
|||
|
|
$(function () {
|
|||
|
|
var start = $startTime.eq(0).val();
|
|||
|
|
var end = $endTime.eq(0).val();
|
|||
|
|
|
|||
|
|
$.ajax({
|
|||
|
|
type: "POST",
|
|||
|
|
data:{
|
|||
|
|
start: start,
|
|||
|
|
end: end
|
|||
|
|
},
|
|||
|
|
async:false,
|
|||
|
|
url: "/pqs9000/device/getMsgInfo",
|
|||
|
|
dataType: 'json',
|
|||
|
|
success: function (data) {
|
|||
|
|
buttonname = data.body.name;
|
|||
|
|
tiggleValue = data.body.name;
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
|
|||
|
|
|
|||
|
|
$.ajax({
|
|||
|
|
type: "POST",
|
|||
|
|
url: "/pqs9000/theme/getThemeInfo",
|
|||
|
|
async: false,
|
|||
|
|
dataType: 'json',
|
|||
|
|
success: function (data) {
|
|||
|
|
companyname = data.body.name;
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
|
|||
|
|
loadselect("电压等级","scale");
|
|||
|
|
loadselect("制造厂商","manc");
|
|||
|
|
loadselect("干扰源类型","loadtype");
|
|||
|
|
|
|||
|
|
$(".checkbox").bootstrapSwitch({
|
|||
|
|
onText: buttonname, // 设置ON文本
|
|||
|
|
offText: companyname, // 设置OFF文本
|
|||
|
|
onColor: "primary",// 设置ON文本颜色 (info/success/warning/danger/primary)
|
|||
|
|
offColor: "primary", // 设置OFF文本颜色 (info/success/warning/danger/primary)
|
|||
|
|
size: "small", // 设置控件大小,从小到大 (mini/small/normal/large)
|
|||
|
|
handleWidth: "60",//设置控件宽度
|
|||
|
|
// 当开关状态改变时触发
|
|||
|
|
onSwitchChange: function (event, state) {
|
|||
|
|
if (state === true) {
|
|||
|
|
tiggleValue = buttonname;
|
|||
|
|
} else {
|
|||
|
|
tiggleValue = companyname;
|
|||
|
|
}
|
|||
|
|
//重新画图
|
|||
|
|
reDrawAllPic();
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
picHeight = ($(window).height() - 90);
|
|||
|
|
tabs = $('#tabs').cleverTabs();
|
|||
|
|
$.ajax({
|
|||
|
|
type: "POST",
|
|||
|
|
url: "/pqs9000/user/getAreasInfo",
|
|||
|
|
dataType: 'json',
|
|||
|
|
success: function (data) {
|
|||
|
|
$("#area").val(data[0].name);
|
|||
|
|
$("#area").attr("index", data[0].id);
|
|||
|
|
areaTree = $.fn.zTree.init($("#areaTree"), settingAreaTree, data);
|
|||
|
|
|
|||
|
|
$("#area").attr("disabled",true);
|
|||
|
|
$("#scale").attr("disabled",false);
|
|||
|
|
$("#manc").attr("disabled",false);
|
|||
|
|
$("#loadtype").attr("disabled",false);
|
|||
|
|
//初始化页面内容
|
|||
|
|
var area = $area.eq(0).attr("index");
|
|||
|
|
var startTime = $startTime.eq(0).val();
|
|||
|
|
var endTime = $endTime.eq(0).val();
|
|||
|
|
refresh(startTime, endTime, area);
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
})
|
|||
|
|
|
|||
|
|
$("#query").click(function () {
|
|||
|
|
var area = $area.eq(0).attr("index");
|
|||
|
|
var startTime = $startTime.eq(0).val();
|
|||
|
|
var endTime = $endTime.eq(0).val();
|
|||
|
|
var scale = $("#scale").val();
|
|||
|
|
var manc = $("#manc").val();
|
|||
|
|
var loadtype = $("#loadtype").val();
|
|||
|
|
refresh(startTime, endTime, area,scale,manc,loadtype);
|
|||
|
|
});
|
|||
|
|
|
|||
|
|
function refresh(startTime, endTime,area,scale,manc,loadtype) {
|
|||
|
|
var i;
|
|||
|
|
$.ajax({
|
|||
|
|
url: '/pqs9000/area/deviceStatus',
|
|||
|
|
type: 'post',
|
|||
|
|
data: {
|
|||
|
|
startTime: startTime,
|
|||
|
|
endTime: endTime,
|
|||
|
|
area: area,
|
|||
|
|
scale:scale,
|
|||
|
|
manc:manc,
|
|||
|
|
loadtype:loadtype
|
|||
|
|
},
|
|||
|
|
dataType: 'json',
|
|||
|
|
beforeSend: function () {
|
|||
|
|
i = ityzl_SHOW_LOAD_LAYER();
|
|||
|
|
},
|
|||
|
|
success: function (data) {
|
|||
|
|
if (data.code === 500 | data.body === null) {
|
|||
|
|
companyResult = null;
|
|||
|
|
volResult = null;
|
|||
|
|
areaResult = null;
|
|||
|
|
loadtypeResult = null;
|
|||
|
|
} else {
|
|||
|
|
areLength = data.body.area === null ? 0 : data.body.area.length;
|
|||
|
|
companyLength = data.body.interval === null ? 0 : data.body.interval.length;
|
|||
|
|
volLength = data.body.vol === null ? 0 : data.body.vol.length;
|
|||
|
|
loadtypeLength = data.body.loadtype === null ? 0 : data.body.loadtype.length;
|
|||
|
|
|
|||
|
|
companyResult = data.body.interval;
|
|||
|
|
areaResult = data.body.area;
|
|||
|
|
volResult = data.body.vol;
|
|||
|
|
loadtypeResult = data.body.loadtype;
|
|||
|
|
}
|
|||
|
|
startQuery();
|
|||
|
|
//***********关闭loading
|
|||
|
|
ityzl_CLOSE_LOAD_LAYER(i);
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
//按区域进行统计
|
|||
|
|
function drawAreaPic(area, lineFeed,route) {
|
|||
|
|
//给div指定宽高
|
|||
|
|
$("#areaDepts").css("height", picHeight);
|
|||
|
|
var normal = [];
|
|||
|
|
var breaks = [];
|
|||
|
|
var shutdown = [];
|
|||
|
|
var areas = [];
|
|||
|
|
var rate=[];
|
|||
|
|
|
|||
|
|
if (null != area) {
|
|||
|
|
for (var i = 0; i < area.length; i++) {
|
|||
|
|
var monitors;
|
|||
|
|
var onlineRate;
|
|||
|
|
if (tiggleValue === buttonname) {
|
|||
|
|
monitors=area[i].amounts;
|
|||
|
|
areas[i] = area[i].name + lineFeed+"(" + area[i].amounts + ")";
|
|||
|
|
onlineRate = Number(area[i].online);
|
|||
|
|
var singleDataNormal = {};
|
|||
|
|
var singleDatabreal = {};
|
|||
|
|
var singleDatashutdown = {};
|
|||
|
|
singleDataNormal.value = area[i].status.normal;
|
|||
|
|
singleDataNormal.areaIndex = area[i].deptsIndex;
|
|||
|
|
normal[i]= singleDataNormal;
|
|||
|
|
singleDatabreal.value = area[i].status.breaks;
|
|||
|
|
singleDatabreal.areaIndex = area[i].deptsIndex;
|
|||
|
|
breaks[i] = singleDatabreal;
|
|||
|
|
singleDatashutdown.value = area[i].status.shutdown;
|
|||
|
|
singleDatashutdown.areaIndex = area[i].deptsIndex;
|
|||
|
|
shutdown[i] = singleDatashutdown;
|
|||
|
|
} else {
|
|||
|
|
monitors=area[i].gwamounts;
|
|||
|
|
areas[i] = area[i].name + lineFeed+"(" + area[i].gwamounts + ")";
|
|||
|
|
onlineRate = Number(area[i].gwonline);
|
|||
|
|
if(null!==area[i].gdStatus){
|
|||
|
|
var singleDataNormal = {};
|
|||
|
|
var singleDatabreal = {};
|
|||
|
|
var singleDatashutdown = {};
|
|||
|
|
singleDataNormal.value = area[i].status.normal;
|
|||
|
|
singleDataNormal.areaIndex = area[i].deptsIndex;
|
|||
|
|
normal[i]= singleDataNormal;
|
|||
|
|
singleDatabreal.value = area[i].status.breaks;
|
|||
|
|
singleDatabreal.areaIndex = area[i].deptsIndex;
|
|||
|
|
breaks[i] = singleDatabreal;
|
|||
|
|
singleDatashutdown.value = area[i].status.shutdown;
|
|||
|
|
singleDatashutdown.areaIndex = area[i].deptsIndex;
|
|||
|
|
shutdown[i] = singleDatashutdown;
|
|||
|
|
}else{
|
|||
|
|
var singleData = {};
|
|||
|
|
var item = {};
|
|||
|
|
singleData.value = 3.1415;
|
|||
|
|
item.color = noMonitor;
|
|||
|
|
singleData.itemStyle = item;
|
|||
|
|
singleData.areaIndex = area[i].deptsIndex;
|
|||
|
|
normal[i] = singleData;
|
|||
|
|
breaks[i] = 0;
|
|||
|
|
shutdown[i] = 0;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
if (Number(monitors) === 0) {
|
|||
|
|
var singleData = {};
|
|||
|
|
var item = {};
|
|||
|
|
singleData.value = 3.1415;
|
|||
|
|
item.color = noMonitor;
|
|||
|
|
singleData.itemStyle = item;
|
|||
|
|
singleData.areaIndex = area[i].deptsIndex;
|
|||
|
|
normal[i] = singleData;
|
|||
|
|
rate[i]=singleData;
|
|||
|
|
breaks[i] = 0;
|
|||
|
|
shutdown[i] = 0;
|
|||
|
|
} else {
|
|||
|
|
var singleData = {};
|
|||
|
|
var normalData = {};
|
|||
|
|
var itemStyle = {};
|
|||
|
|
normalData.color = getColor(onlineRate);
|
|||
|
|
if (onlineRate < 3.1414) {
|
|||
|
|
singleData.value = 3.1415;
|
|||
|
|
normalData.actual = onlineRate;
|
|||
|
|
} else {
|
|||
|
|
singleData.value = onlineRate;
|
|||
|
|
}
|
|||
|
|
itemStyle.normal = normalData;
|
|||
|
|
singleData.itemStyle = itemStyle;
|
|||
|
|
singleData.areaIndex = area[i].deptsIndex;
|
|||
|
|
rate[i] = singleData;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
var option = {
|
|||
|
|
backgroundColor: canvasBG,//背景色
|
|||
|
|
title: {
|
|||
|
|
text: '区域',
|
|||
|
|
left: '50%',
|
|||
|
|
padding: [
|
|||
|
|
25, // 上
|
|||
|
|
0, // 右
|
|||
|
|
0, // 下
|
|||
|
|
0, // 左
|
|||
|
|
]
|
|||
|
|
},
|
|||
|
|
color: [runColor, breaksColor, grey],
|
|||
|
|
tooltip: {
|
|||
|
|
trigger: 'axis',
|
|||
|
|
axisPointer: {
|
|||
|
|
type: 'shadow'
|
|||
|
|
},
|
|||
|
|
position: function (point, params, dom, rect, size) {
|
|||
|
|
// 鼠标坐标和提示框位置的参考坐标系是：以外层div的左上角那一点为原点，x轴向右，y轴向下
|
|||
|
|
// 提示框位置
|
|||
|
|
var x = 0; // x坐标位置
|
|||
|
|
var y = 0; // y坐标位置
|
|||
|
|
// 当前鼠标位置
|
|||
|
|
var pointX = point[0];
|
|||
|
|
var pointY = point[1];
|
|||
|
|
// 外层div大小
|
|||
|
|
// var viewWidth = size.viewSize[0];
|
|||
|
|
// var viewHeight = size.viewSize[1];
|
|||
|
|
// 提示框大小
|
|||
|
|
var boxWidth = size.contentSize[0];
|
|||
|
|
var boxHeight = size.contentSize[1];
|
|||
|
|
// boxWidth > pointX 说明鼠标左边放不下提示框
|
|||
|
|
if (boxWidth > pointX) {
|
|||
|
|
x = 5;
|
|||
|
|
} else { // 左边放的下
|
|||
|
|
x = pointX - boxWidth;
|
|||
|
|
}
|
|||
|
|
// boxHeight > pointY 说明鼠标上边放不下提示框
|
|||
|
|
if (boxHeight > pointY) {
|
|||
|
|
y = 5;
|
|||
|
|
} else { // 上边放得下
|
|||
|
|
y = pointY - boxHeight;
|
|||
|
|
}
|
|||
|
|
return [x, y];
|
|||
|
|
},
|
|||
|
|
formatter: function (params) {
|
|||
|
|
var tips="";
|
|||
|
|
tips+='<font style="font-size: 12px">'+params[0].name+'</font>';
|
|||
|
|
var color = params[0].color;
|
|||
|
|
tips +='<br/><font style="font-size: 12px">终端状态(%)</font>';
|
|||
|
|
if (color === noMonitor) {
|
|||
|
|
tips += '<br/><font style="font-size: 10px">投运 : /</font>';
|
|||
|
|
tips += '<br/><font style="font-size: 10px">热备用 : /</font>';
|
|||
|
|
tips += '<br/><font style="font-size: 10px">停运 : /</font>';
|
|||
|
|
tips += '<br/><font style="font-size: 12px">终端在线率(%)</font>';
|
|||
|
|
tips+='<br/><font style="font-size: 10px">/</font>';
|
|||
|
|
}else{
|
|||
|
|
for (var i = 0; i < 3; i++) {
|
|||
|
|
tips+='<br/><font style="font-size: 10px">'+params[i].seriesName+' : '+params[i].value+'</font>';
|
|||
|
|
}
|
|||
|
|
tips += '<br/><font style="font-size: 12px">终端在线率(%)</font>';
|
|||
|
|
var onlineRate;
|
|||
|
|
if(Number(params[3].value)===3.14159){
|
|||
|
|
onlineRate='暂无数据';
|
|||
|
|
}else if(Number(params[3].value)===3.1415){
|
|||
|
|
onlineRate='/';
|
|||
|
|
}else{
|
|||
|
|
onlineRate=params[3].value;
|
|||
|
|
}
|
|||
|
|
tips+='<br/><font style="font-size: 10px">'+onlineRate+'</font>';
|
|||
|
|
}
|
|||
|
|
return tips;
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
//控制图标在dataroom中的位置大小
|
|||
|
|
grid: {
|
|||
|
|
left: '1%',
|
|||
|
|
right: '11%',
|
|||
|
|
bottom: '3%',
|
|||
|
|
containLabel: true
|
|||
|
|
},
|
|||
|
|
xAxis: [{
|
|||
|
|
type: 'category',
|
|||
|
|
data: areas,
|
|||
|
|
name: '地区\n(终端个数)\n',
|
|||
|
|
splitLine: {
|
|||
|
|
show: false
|
|||
|
|
},
|
|||
|
|
axisLabel: {
|
|||
|
|
show:true,
|
|||
|
|
interval: 0,
|
|||
|
|
rotate:route,
|
|||
|
|
fontSize:10
|
|||
|
|
}
|
|||
|
|
}],
|
|||
|
|
yAxis: [{
|
|||
|
|
type: 'value',
|
|||
|
|
name: '%',
|
|||
|
|
max: 100
|
|||
|
|
}],
|
|||
|
|
series: [{
|
|||
|
|
name: '投运',
|
|||
|
|
type: 'bar',
|
|||
|
|
stack: 'sum',
|
|||
|
|
barMaxWidth: barMax,
|
|||
|
|
data: normal
|
|||
|
|
}, {
|
|||
|
|
name: '热备用',
|
|||
|
|
type: 'bar',
|
|||
|
|
stack: 'sum',
|
|||
|
|
barMaxWidth: barMax,
|
|||
|
|
data: breaks
|
|||
|
|
}, {
|
|||
|
|
name: '停运',
|
|||
|
|
type: 'bar',
|
|||
|
|
stack: 'sum',
|
|||
|
|
barMaxWidth: barMax,
|
|||
|
|
data: shutdown
|
|||
|
|
},{
|
|||
|
|
name: '在线率',
|
|||
|
|
type: 'bar',
|
|||
|
|
barGap: 0,
|
|||
|
|
barMaxWidth: barMax,
|
|||
|
|
data: rate
|
|||
|
|
}]
|
|||
|
|
};
|
|||
|
|
var district = echarts.init(document.getElementById('areaDepts'));
|
|||
|
|
district.setOption(option);
|
|||
|
|
district.on('click', function (params) {
|
|||
|
|
if (getRole("/pqs9000/business/runtime") === 1) {
|
|||
|
|
var city=params.data.areaIndex;
|
|||
|
|
window.top.addTab('runtime?area='+city, '终端运行情况')
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
//填充区域表格
|
|||
|
|
function initAreaTable(data) {
|
|||
|
|
var height = picHeight - 50;
|
|||
|
|
if (data == null) {
|
|||
|
|
data = [];
|
|||
|
|
}
|
|||
|
|
$("#areaTable").DataTable({
|
|||
|
|
data: data,
|
|||
|
|
autoWidth: false,
|
|||
|
|
order:[1,"desc"],
|
|||
|
|
columnDefs : [
|
|||
|
|
{ orderable: false, targets: [0,2,3,4] }
|
|||
|
|
],
|
|||
|
|
paging: false,
|
|||
|
|
lengthChange: false,
|
|||
|
|
searching: false,
|
|||
|
|
destroy: true,
|
|||
|
|
scrollY: height,
|
|||
|
|
info: false,
|
|||
|
|
language: {
|
|||
|
|
url: '/pqs9000/json/chine.json',
|
|||
|
|
},
|
|||
|
|
columns: [
|
|||
|
|
{data: 'name'},
|
|||
|
|
{data: 'amounts', render: function (data, type, full, meta) {
|
|||
|
|
if (tiggleValue === buttonname) {
|
|||
|
|
if(full.amounts==0){
|
|||
|
|
return "0";
|
|||
|
|
}
|
|||
|
|
return full.amounts;
|
|||
|
|
} else {
|
|||
|
|
if(full.gwamounts==0){
|
|||
|
|
return "0";
|
|||
|
|
}
|
|||
|
|
return full.gwamounts;
|
|||
|
|
}
|
|||
|
|
}, type: "number-fate"},
|
|||
|
|
{
|
|||
|
|
data: 'status.normalData', render: function (data, type, full, meta) {
|
|||
|
|
if (tiggleValue === buttonname) {
|
|||
|
|
if(full.amounts==0){
|
|||
|
|
return "/";
|
|||
|
|
}
|
|||
|
|
return full.status.normalData;
|
|||
|
|
} else {
|
|||
|
|
if(full.gwamounts==0){
|
|||
|
|
return "/";
|
|||
|
|
}
|
|||
|
|
if(null===full.gdStatus){
|
|||
|
|
return "0"
|
|||
|
|
}
|
|||
|
|
return full.gdStatus.normalData;
|
|||
|
|
}
|
|||
|
|
}, type: "number-fate"
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
data: 'status.breaksData', render: function (data, type, full, meta) {
|
|||
|
|
if (tiggleValue === buttonname) {
|
|||
|
|
if(full.amounts==0){
|
|||
|
|
return "/";
|
|||
|
|
}
|
|||
|
|
return full.status.breaksData;
|
|||
|
|
} else {
|
|||
|
|
if(full.gwamounts==0){
|
|||
|
|
return "/";
|
|||
|
|
}
|
|||
|
|
if(null===full.gdStatus){
|
|||
|
|
return "0"
|
|||
|
|
}
|
|||
|
|
return full.gdStatus.breaksData;
|
|||
|
|
}
|
|||
|
|
}, type: "number-fate"
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
data: 'status.shutdownData', render: function (data, type, full, meta) {
|
|||
|
|
if (tiggleValue === buttonname) {
|
|||
|
|
if(full.amounts==0){
|
|||
|
|
return "/";
|
|||
|
|
}
|
|||
|
|
return full.status.shutdownData;
|
|||
|
|
} else {
|
|||
|
|
if(full.gwamounts==0){
|
|||
|
|
return "/";
|
|||
|
|
}
|
|||
|
|
if(null===full.gdStatus){
|
|||
|
|
return "0"
|
|||
|
|
}
|
|||
|
|
return full.gdStatus.shutdownData;
|
|||
|
|
}
|
|||
|
|
}, type: "number-fate"
|
|||
|
|
}, {data:'online', render:function (data, type, full, meta) {
|
|||
|
|
if (tiggleValue === buttonname) {
|
|||
|
|
data = full.online;
|
|||
|
|
} else {
|
|||
|
|
data = full.gwonline;
|
|||
|
|
}
|
|||
|
|
if (Number(data) === 3.1415) {
|
|||
|
|
return "/";
|
|||
|
|
} else if (Number(data) === 3.14159) {
|
|||
|
|
return "（暂无数据）";
|
|||
|
|
} else {
|
|||
|
|
return data;
|
|||
|
|
}
|
|||
|
|
}, type: "number-fate"},
|
|||
|
|
],
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
|
|||
|
|
//按终端厂家进行统计
|
|||
|
|
function drawCompanyPic(companys, lineFeed,route) {
|
|||
|
|
$("#company").css("height", picHeight);
|
|||
|
|
var run = [];
|
|||
|
|
var breaks = [];
|
|||
|
|
var shutdown = [];
|
|||
|
|
var rate=[];
|
|||
|
|
var areas = [];
|
|||
|
|
if (null != companys) {
|
|||
|
|
for(var i=0;i<companys.length;i++){
|
|||
|
|
var monitors;
|
|||
|
|
var onlineRate;
|
|||
|
|
if (tiggleValue === buttonname) {
|
|||
|
|
monitors=companys[i].amounts;
|
|||
|
|
areas[i] = companys[i].name + lineFeed+"(" + companys[i].amounts + ")";
|
|||
|
|
onlineRate = Number(companys[i].online);
|
|||
|
|
run[i]=companys[i].status.normal;
|
|||
|
|
breaks[i]=companys[i].status.breaks;
|
|||
|
|
shutdown[i]=companys[i].status.shutdown;
|
|||
|
|
} else {
|
|||
|
|
monitors=companys[i].gwamounts;
|
|||
|
|
areas[i] = companys[i].name + lineFeed+"(" + companys[i].gwamounts + ")";
|
|||
|
|
onlineRate = Number(companys[i].gwonline);
|
|||
|
|
if(null!==companys[i].gdStatus){
|
|||
|
|
run[i] = companys[i].gdStatus.normal;
|
|||
|
|
breaks[i] = companys[i].gdStatus.breaks;
|
|||
|
|
shutdown[i] = companys[i].gdStatus.shutdown;
|
|||
|
|
}else{
|
|||
|
|
var singleData = {};
|
|||
|
|
var item = {};
|
|||
|
|
singleData.value = 3.1415;
|
|||
|
|
item.color = noMonitor;
|
|||
|
|
singleData.itemStyle = item;
|
|||
|
|
run[i] = singleData;
|
|||
|
|
breaks[i] = 0;
|
|||
|
|
shutdown[i] = 0;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
if(Number(monitors)===0){
|
|||
|
|
var singleData={};
|
|||
|
|
var normal={};
|
|||
|
|
var itemStyle={};
|
|||
|
|
singleData.value=3.1415;
|
|||
|
|
normal.color=noMonitor;
|
|||
|
|
itemStyle.normal=normal;
|
|||
|
|
singleData.itemStyle=itemStyle;
|
|||
|
|
run[i]=singleData;
|
|||
|
|
rate[i]=singleData;
|
|||
|
|
breaks[i]=0;
|
|||
|
|
shutdown[i]=0;
|
|||
|
|
}else{
|
|||
|
|
var singleData={};
|
|||
|
|
var normal={};
|
|||
|
|
var itemStyle={};
|
|||
|
|
normal.color = getColor(onlineRate);
|
|||
|
|
if(onlineRate<3.1414){
|
|||
|
|
singleData.value = 3.1415;
|
|||
|
|
normal.actual = onlineRate;
|
|||
|
|
}else{
|
|||
|
|
singleData.value = onlineRate;
|
|||
|
|
}
|
|||
|
|
itemStyle.normal=normal;
|
|||
|
|
singleData.itemStyle=itemStyle;
|
|||
|
|
rate[i]=singleData;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
var option = {
|
|||
|
|
backgroundColor: canvasBG,//背景色
|
|||
|
|
title: {
|
|||
|
|
text: '终端厂家',
|
|||
|
|
left: '50%',
|
|||
|
|
padding: [
|
|||
|
|
15, // 上
|
|||
|
|
0, // 右
|
|||
|
|
0, // 下
|
|||
|
|
0, // 左
|
|||
|
|
]
|
|||
|
|
},
|
|||
|
|
color: [runColor, breaksColor, grey],
|
|||
|
|
tooltip: {
|
|||
|
|
trigger: 'axis',
|
|||
|
|
axisPointer: {
|
|||
|
|
type: 'shadow'
|
|||
|
|
},
|
|||
|
|
position: function (point, params, dom, rect, size) {
|
|||
|
|
// 鼠标坐标和提示框位置的参考坐标系是：以外层div的左上角那一点为原点，x轴向右，y轴向下
|
|||
|
|
// 提示框位置
|
|||
|
|
var x = 0; // x坐标位置
|
|||
|
|
var y = 0; // y坐标位置
|
|||
|
|
// 当前鼠标位置
|
|||
|
|
var pointX = point[0];
|
|||
|
|
var pointY = point[1];
|
|||
|
|
// 外层div大小
|
|||
|
|
// var viewWidth = size.viewSize[0];
|
|||
|
|
// var viewHeight = size.viewSize[1];
|
|||
|
|
// 提示框大小
|
|||
|
|
var boxWidth = size.contentSize[0];
|
|||
|
|
var boxHeight = size.contentSize[1];
|
|||
|
|
// boxWidth > pointX 说明鼠标左边放不下提示框
|
|||
|
|
if (boxWidth > pointX) {
|
|||
|
|
x = 5;
|
|||
|
|
} else { // 左边放的下
|
|||
|
|
x = pointX - boxWidth;
|
|||
|
|
}
|
|||
|
|
// boxHeight > pointY 说明鼠标上边放不下提示框
|
|||
|
|
if (boxHeight > pointY) {
|
|||
|
|
y = 5;
|
|||
|
|
} else { // 上边放得下
|
|||
|
|
y = pointY - boxHeight;
|
|||
|
|
}
|
|||
|
|
return [x, y];
|
|||
|
|
},
|
|||
|
|
formatter: function (params) {
|
|||
|
|
var tips="";
|
|||
|
|
tips+='<font style="font-size: 12px">'+params[0].name+'</font>';
|
|||
|
|
var color = params[0].color;
|
|||
|
|
tips +='<br/><font style="font-size: 12px">终端状态(%)</font>';
|
|||
|
|
if (color === noMonitor) {
|
|||
|
|
tips += '<br/><font style="font-size: 10px">投运 : /</font>';
|
|||
|
|
tips += '<br/><font style="font-size: 10px">热备用 : /</font>';
|
|||
|
|
tips += '<br/><font style="font-size: 10px">停运 : /</font>';
|
|||
|
|
tips += '<br/><font style="font-size: 12px">终端在线率(%)</font>';
|
|||
|
|
tips+='<br/><font style="font-size: 10px">/</font>';
|
|||
|
|
}else{
|
|||
|
|
for (var i = 0; i < 3; i++) {
|
|||
|
|
tips+='<br/><font style="font-size: 10px">'+params[i].seriesName+' : '+params[i].value+'</font>';
|
|||
|
|
}
|
|||
|
|
tips += '<br/><font style="font-size: 12px">终端在线率(%)</font>';
|
|||
|
|
var onlineRate;
|
|||
|
|
if(Number(params[3].value)===3.14159){
|
|||
|
|
onlineRate='暂无数据';
|
|||
|
|
}else if(Number(params[3].value)===3.1415){
|
|||
|
|
onlineRate='/';
|
|||
|
|
}else{
|
|||
|
|
onlineRate=params[3].value;
|
|||
|
|
}
|
|||
|
|
tips+='<br/><font style="font-size: 10px">'+onlineRate+'</font>';
|
|||
|
|
}
|
|||
|
|
return tips;
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
//控制图标在dataroom中的位置大小
|
|||
|
|
grid: {
|
|||
|
|
left: '1%',
|
|||
|
|
right: '11%',
|
|||
|
|
bottom: '3%',
|
|||
|
|
containLabel: true
|
|||
|
|
},
|
|||
|
|
xAxis: [{
|
|||
|
|
type: 'category',
|
|||
|
|
data: areas,
|
|||
|
|
name: '终端厂家\n(终端个数)\n',
|
|||
|
|
splitLine: {
|
|||
|
|
show: false
|
|||
|
|
},
|
|||
|
|
axisLabel: {
|
|||
|
|
show:true,
|
|||
|
|
interval: 0,
|
|||
|
|
rotate:route,
|
|||
|
|
fontSize:10
|
|||
|
|
}
|
|||
|
|
}],
|
|||
|
|
yAxis: [{
|
|||
|
|
type: 'value',
|
|||
|
|
name: '%',
|
|||
|
|
min: '0',
|
|||
|
|
max: '100'
|
|||
|
|
}],
|
|||
|
|
series: [{
|
|||
|
|
name: '投运',
|
|||
|
|
type: 'bar',
|
|||
|
|
stack: 'sum',
|
|||
|
|
barMaxWidth: barMax,
|
|||
|
|
data: run
|
|||
|
|
}, {
|
|||
|
|
name: '热备用',
|
|||
|
|
type: 'bar',
|
|||
|
|
stack: 'sum',
|
|||
|
|
barMaxWidth: barMax,
|
|||
|
|
data: breaks
|
|||
|
|
}, {
|
|||
|
|
name: '停运',
|
|||
|
|
type: 'bar',
|
|||
|
|
stack: 'sum',
|
|||
|
|
barMaxWidth: barMax,
|
|||
|
|
data: shutdown
|
|||
|
|
},{
|
|||
|
|
name: '在线率',
|
|||
|
|
type: 'bar',
|
|||
|
|
barGap: 0,
|
|||
|
|
barMaxWidth: barMax,
|
|||
|
|
data: rate
|
|||
|
|
}]
|
|||
|
|
};
|
|||
|
|
var factory = echarts.init(document.getElementById('company'));
|
|||
|
|
factory.setOption(option);
|
|||
|
|
factory.on('click', function () {
|
|||
|
|
if (getRole("/pqs9000/business/runtime") == 1) {
|
|||
|
|
window.top.addTab('runtime', '终端运行情况')
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
//填充终端厂家表格
|
|||
|
|
function initCompanyTable(data) {
|
|||
|
|
var height = picHeight - 50;
|
|||
|
|
if (data == null) {
|
|||
|
|
data = [];
|
|||
|
|
}
|
|||
|
|
$("#companyTable").DataTable({
|
|||
|
|
data: data,
|
|||
|
|
autoWidth: false,
|
|||
|
|
order:[1,"desc"],
|
|||
|
|
columnDefs : [
|
|||
|
|
{ orderable: false, targets: [0,2,3,4] }
|
|||
|
|
],
|
|||
|
|
paging: false,
|
|||
|
|
lengthChange: false,
|
|||
|
|
searching: false,
|
|||
|
|
destroy: true,
|
|||
|
|
scrollY: height,
|
|||
|
|
info: false,
|
|||
|
|
language: {
|
|||
|
|
url: '/pqs9000/json/chine.json',
|
|||
|
|
},
|
|||
|
|
columns: [
|
|||
|
|
{data: 'name'},
|
|||
|
|
{data: 'amounts', render: function (data, type, full, meta) {
|
|||
|
|
if (tiggleValue === buttonname) {
|
|||
|
|
if(full.amounts==0){
|
|||
|
|
return "0";
|
|||
|
|
}
|
|||
|
|
return full.amounts;
|
|||
|
|
} else {
|
|||
|
|
if(full.gwamounts==0){
|
|||
|
|
return "0";
|
|||
|
|
}
|
|||
|
|
return full.gwamounts;
|
|||
|
|
}
|
|||
|
|
}, type: "number-fate"},
|
|||
|
|
{
|
|||
|
|
data: 'status.normalData', render: function (data, type, full, meta) {
|
|||
|
|
if (tiggleValue === buttonname) {
|
|||
|
|
if(full.amounts==0){
|
|||
|
|
return "/";
|
|||
|
|
}
|
|||
|
|
return full.status.normalData;
|
|||
|
|
} else {
|
|||
|
|
if(full.gwamounts==0){
|
|||
|
|
return "/";
|
|||
|
|
}
|
|||
|
|
if(null===full.gdStatus){
|
|||
|
|
return "0"
|
|||
|
|
}
|
|||
|
|
return full.gdStatus.normalData;
|
|||
|
|
}
|
|||
|
|
}, type: "number-fate"
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
data: 'status.breaksData', render: function (data, type, full, meta) {
|
|||
|
|
if (tiggleValue === buttonname) {
|
|||
|
|
if(full.amounts==0){
|
|||
|
|
return "/";
|
|||
|
|
}
|
|||
|
|
return full.status.breaksData;
|
|||
|
|
} else {
|
|||
|
|
if(full.gwamounts==0){
|
|||
|
|
return "/";
|
|||
|
|
}
|
|||
|
|
if(null===full.gdStatus){
|
|||
|
|
return "0"
|
|||
|
|
}
|
|||
|
|
return full.gdStatus.breaksData;
|
|||
|
|
}
|
|||
|
|
}, type: "number-fate"
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
data: 'status.shutdownData', render: function (data, type, full, meta) {
|
|||
|
|
if (tiggleValue === buttonname) {
|
|||
|
|
if(full.amounts==0){
|
|||
|
|
return "/";
|
|||
|
|
}
|
|||
|
|
return full.status.shutdownData;
|
|||
|
|
} else {
|
|||
|
|
if(full.gwamounts==0){
|
|||
|
|
return "/";
|
|||
|
|
}
|
|||
|
|
if(null===full.gdStatus){
|
|||
|
|
return "0"
|
|||
|
|
}
|
|||
|
|
return full.gdStatus.shutdownData;
|
|||
|
|
}
|
|||
|
|
}, type: "number-fate"
|
|||
|
|
},
|
|||
|
|
{data:'online', render:function (data, type, full, meta) {
|
|||
|
|
if (tiggleValue === buttonname) {
|
|||
|
|
data = full.online;
|
|||
|
|
} else {
|
|||
|
|
data = full.gwonline;
|
|||
|
|
}
|
|||
|
|
if (Number(data) === 3.1415) {
|
|||
|
|
return "/";
|
|||
|
|
} else if (Number(data) === 3.14159) {
|
|||
|
|
return "（暂无数据）";
|
|||
|
|
} else {
|
|||
|
|
return data;
|
|||
|
|
}
|
|||
|
|
}, type: "number-fate"},
|
|||
|
|
],
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
//按电压等级进行统计
|
|||
|
|
function drawVolPic(companys, lineFeed,route) {
|
|||
|
|
$("#vol").css("height", picHeight);
|
|||
|
|
var run = [];
|
|||
|
|
var breaks = [];
|
|||
|
|
var shutdown = [];
|
|||
|
|
var rate=[];
|
|||
|
|
var areas = [];
|
|||
|
|
if (null != companys) {
|
|||
|
|
for(var i=0;i<companys.length;i++){
|
|||
|
|
var monitors;
|
|||
|
|
var onlineRate;
|
|||
|
|
if (tiggleValue === buttonname) {
|
|||
|
|
monitors=companys[i].amounts;
|
|||
|
|
areas[i] = companys[i].name + lineFeed+"(" + companys[i].amounts + ")";
|
|||
|
|
onlineRate = Number(companys[i].online);
|
|||
|
|
run[i]=companys[i].status.normal;
|
|||
|
|
breaks[i]=companys[i].status.breaks;
|
|||
|
|
shutdown[i]=companys[i].status.shutdown;
|
|||
|
|
} else {
|
|||
|
|
monitors=companys[i].gwamounts;
|
|||
|
|
areas[i] = companys[i].name + lineFeed+"(" + companys[i].gwamounts + ")";
|
|||
|
|
onlineRate = Number(companys[i].gwonline);
|
|||
|
|
if(null!==companys[i].gdStatus){
|
|||
|
|
run[i] = companys[i].gdStatus.normal;
|
|||
|
|
breaks[i] = companys[i].gdStatus.breaks;
|
|||
|
|
shutdown[i] = companys[i].gdStatus.shutdown;
|
|||
|
|
}else{
|
|||
|
|
var singleData = {};
|
|||
|
|
var item = {};
|
|||
|
|
singleData.value = 3.1415;
|
|||
|
|
item.color = noMonitor;
|
|||
|
|
singleData.itemStyle = item;
|
|||
|
|
run[i] = singleData;
|
|||
|
|
breaks[i] = 0;
|
|||
|
|
shutdown[i] = 0;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
if(Number(monitors)===0){
|
|||
|
|
var singleData={};
|
|||
|
|
var normal={};
|
|||
|
|
var itemStyle={};
|
|||
|
|
singleData.value=3.1415;
|
|||
|
|
normal.color=noMonitor;
|
|||
|
|
itemStyle.normal=normal;
|
|||
|
|
singleData.itemStyle=itemStyle;
|
|||
|
|
run[i]=singleData;
|
|||
|
|
rate[i]=singleData;
|
|||
|
|
breaks[i]=0;
|
|||
|
|
shutdown[i]=0;
|
|||
|
|
}else{
|
|||
|
|
var singleData={};
|
|||
|
|
var normal={};
|
|||
|
|
var itemStyle={};
|
|||
|
|
normal.color = getColor(onlineRate);
|
|||
|
|
if(onlineRate<3.1414){
|
|||
|
|
singleData.value = 3.1415;
|
|||
|
|
normal.actual = onlineRate;
|
|||
|
|
}else{
|
|||
|
|
singleData.value = onlineRate;
|
|||
|
|
}
|
|||
|
|
itemStyle.normal=normal;
|
|||
|
|
singleData.itemStyle=itemStyle;
|
|||
|
|
rate[i]=singleData;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
var option = {
|
|||
|
|
backgroundColor: canvasBG,//背景色
|
|||
|
|
title: {
|
|||
|
|
text: '电压等级',
|
|||
|
|
left: '50%',
|
|||
|
|
padding: [
|
|||
|
|
15, // 上
|
|||
|
|
0, // 右
|
|||
|
|
0, // 下
|
|||
|
|
0, // 左
|
|||
|
|
]
|
|||
|
|
},
|
|||
|
|
color: [runColor, breaksColor, grey],
|
|||
|
|
tooltip: {
|
|||
|
|
trigger: 'axis',
|
|||
|
|
axisPointer: {
|
|||
|
|
type: 'shadow'
|
|||
|
|
},
|
|||
|
|
position: function (point, params, dom, rect, size) {
|
|||
|
|
// 鼠标坐标和提示框位置的参考坐标系是：以外层div的左上角那一点为原点，x轴向右，y轴向下
|
|||
|
|
// 提示框位置
|
|||
|
|
var x = 0; // x坐标位置
|
|||
|
|
var y = 0; // y坐标位置
|
|||
|
|
// 当前鼠标位置
|
|||
|
|
var pointX = point[0];
|
|||
|
|
var pointY = point[1];
|
|||
|
|
// 外层div大小
|
|||
|
|
// var viewWidth = size.viewSize[0];
|
|||
|
|
// var viewHeight = size.viewSize[1];
|
|||
|
|
// 提示框大小
|
|||
|
|
var boxWidth = size.contentSize[0];
|
|||
|
|
var boxHeight = size.contentSize[1];
|
|||
|
|
// boxWidth > pointX 说明鼠标左边放不下提示框
|
|||
|
|
if (boxWidth > pointX) {
|
|||
|
|
x = 5;
|
|||
|
|
} else { // 左边放的下
|
|||
|
|
x = pointX - boxWidth;
|
|||
|
|
}
|
|||
|
|
// boxHeight > pointY 说明鼠标上边放不下提示框
|
|||
|
|
if (boxHeight > pointY) {
|
|||
|
|
y = 5;
|
|||
|
|
} else { // 上边放得下
|
|||
|
|
y = pointY - boxHeight;
|
|||
|
|
}
|
|||
|
|
return [x, y];
|
|||
|
|
},
|
|||
|
|
formatter: function (params) {
|
|||
|
|
var tips="";
|
|||
|
|
tips+='<font style="font-size: 12px">'+params[0].name+'</font>';
|
|||
|
|
var color = params[0].color;
|
|||
|
|
tips +='<br/><font style="font-size: 12px">终端状态(%)</font>';
|
|||
|
|
if (color === noMonitor) {
|
|||
|
|
tips += '<br/><font style="font-size: 10px">投运 : /</font>';
|
|||
|
|
tips += '<br/><font style="font-size: 10px">热备用 : /</font>';
|
|||
|
|
tips += '<br/><font style="font-size: 10px">停运 : /</font>';
|
|||
|
|
tips += '<br/><font style="font-size: 12px">终端在线率(%)</font>';
|
|||
|
|
tips+='<br/><font style="font-size: 10px">/</font>';
|
|||
|
|
}else{
|
|||
|
|
for (var i = 0; i < 3; i++) {
|
|||
|
|
tips+='<br/><font style="font-size: 10px">'+params[i].seriesName+' : '+params[i].value+'</font>';
|
|||
|
|
}
|
|||
|
|
tips += '<br/><font style="font-size: 12px">终端在线率(%)</font>';
|
|||
|
|
var onlineRate;
|
|||
|
|
if(Number(params[3].value)===3.14159){
|
|||
|
|
onlineRate='暂无数据';
|
|||
|
|
}else if(Number(params[3].value)===3.1415){
|
|||
|
|
onlineRate='/';
|
|||
|
|
}else{
|
|||
|
|
onlineRate=params[3].value;
|
|||
|
|
}
|
|||
|
|
tips+='<br/><font style="font-size: 10px">'+onlineRate+'</font>';
|
|||
|
|
}
|
|||
|
|
return tips;
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
//控制图标在dataroom中的位置大小
|
|||
|
|
grid: {
|
|||
|
|
left: '1%',
|
|||
|
|
right: '11%',
|
|||
|
|
bottom: '3%',
|
|||
|
|
containLabel: true
|
|||
|
|
},
|
|||
|
|
xAxis: [{
|
|||
|
|
type: 'category',
|
|||
|
|
data: areas,
|
|||
|
|
name: '电压等级\n(终端个数)\n',
|
|||
|
|
splitLine: {
|
|||
|
|
show: false
|
|||
|
|
},
|
|||
|
|
axisLabel: {
|
|||
|
|
show:true,
|
|||
|
|
interval: 0,
|
|||
|
|
rotate:route,
|
|||
|
|
fontSize:10
|
|||
|
|
}
|
|||
|
|
}],
|
|||
|
|
yAxis: [{
|
|||
|
|
type: 'value',
|
|||
|
|
name: '%',
|
|||
|
|
min: '0',
|
|||
|
|
max: '100'
|
|||
|
|
}],
|
|||
|
|
series: [{
|
|||
|
|
name: '投运',
|
|||
|
|
type: 'bar',
|
|||
|
|
stack: 'sum',
|
|||
|
|
barMaxWidth: barMax,
|
|||
|
|
data: run
|
|||
|
|
}, {
|
|||
|
|
name: '热备用',
|
|||
|
|
type: 'bar',
|
|||
|
|
stack: 'sum',
|
|||
|
|
barMaxWidth: barMax,
|
|||
|
|
data: breaks
|
|||
|
|
}, {
|
|||
|
|
name: '停运',
|
|||
|
|
type: 'bar',
|
|||
|
|
stack: 'sum',
|
|||
|
|
barMaxWidth: barMax,
|
|||
|
|
data: shutdown
|
|||
|
|
},{
|
|||
|
|
name: '在线率',
|
|||
|
|
type: 'bar',
|
|||
|
|
barGap: 0,
|
|||
|
|
barMaxWidth: barMax,
|
|||
|
|
data: rate
|
|||
|
|
}]
|
|||
|
|
};
|
|||
|
|
var factory = echarts.init(document.getElementById('vol'));
|
|||
|
|
factory.setOption(option);
|
|||
|
|
factory.on('click', function () {
|
|||
|
|
if (getRole("/pqs9000/business/runtime") == 1) {
|
|||
|
|
window.top.addTab('runtime', '终端运行情况')
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
//填充电压等级表格
|
|||
|
|
function initVolTable(data) {
|
|||
|
|
var height = picHeight - 50;
|
|||
|
|
if (data == null) {
|
|||
|
|
data = [];
|
|||
|
|
}
|
|||
|
|
$("#volTable").DataTable({
|
|||
|
|
data: data,
|
|||
|
|
autoWidth: false,
|
|||
|
|
order:[1,"desc"],
|
|||
|
|
columnDefs : [
|
|||
|
|
{ orderable: false, targets: [0,2,3,4] }
|
|||
|
|
],
|
|||
|
|
paging: false,
|
|||
|
|
lengthChange: false,
|
|||
|
|
searching: false,
|
|||
|
|
destroy: true,
|
|||
|
|
scrollY: height,
|
|||
|
|
info: false,
|
|||
|
|
language: {
|
|||
|
|
url: '/pqs9000/json/chine.json',
|
|||
|
|
},
|
|||
|
|
columns: [
|
|||
|
|
{data: 'name'},
|
|||
|
|
{data: 'amounts', render: function (data, type, full, meta) {
|
|||
|
|
if (tiggleValue === buttonname) {
|
|||
|
|
if(full.amounts==0){
|
|||
|
|
return "0";
|
|||
|
|
}
|
|||
|
|
return full.amounts;
|
|||
|
|
} else {
|
|||
|
|
if(full.gwamounts==0){
|
|||
|
|
return "0";
|
|||
|
|
}
|
|||
|
|
return full.gwamounts;
|
|||
|
|
}
|
|||
|
|
}, type: "number-fate"},
|
|||
|
|
{
|
|||
|
|
data: 'status.normalData', render: function (data, type, full, meta) {
|
|||
|
|
if (tiggleValue === buttonname) {
|
|||
|
|
if(full.amounts==0){
|
|||
|
|
return "/";
|
|||
|
|
}
|
|||
|
|
return full.status.normalData;
|
|||
|
|
} else {
|
|||
|
|
if(full.gwamounts==0){
|
|||
|
|
return "/";
|
|||
|
|
}
|
|||
|
|
if(null===full.gdStatus){
|
|||
|
|
return "0"
|
|||
|
|
}
|
|||
|
|
return full.gdStatus.normalData;
|
|||
|
|
}
|
|||
|
|
}, type: "number-fate"
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
data: 'status.breaksData', render: function (data, type, full, meta) {
|
|||
|
|
if (tiggleValue === buttonname) {
|
|||
|
|
if(full.amounts==0){
|
|||
|
|
return "/";
|
|||
|
|
}
|
|||
|
|
return full.status.breaksData;
|
|||
|
|
} else {
|
|||
|
|
if(full.gwamounts==0){
|
|||
|
|
return "/";
|
|||
|
|
}
|
|||
|
|
if(null===full.gdStatus){
|
|||
|
|
return "0"
|
|||
|
|
}
|
|||
|
|
return full.gdStatus.breaksData;
|
|||
|
|
}
|
|||
|
|
}, type: "number-fate"
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
data: 'status.shutdownData', render: function (data, type, full, meta) {
|
|||
|
|
if (tiggleValue === buttonname) {
|
|||
|
|
if(full.amounts==0){
|
|||
|
|
return "/";
|
|||
|
|
}
|
|||
|
|
return full.status.shutdownData;
|
|||
|
|
} else {
|
|||
|
|
if(full.gwamounts==0){
|
|||
|
|
return "/";
|
|||
|
|
}
|
|||
|
|
if(null===full.gdStatus){
|
|||
|
|
return "0"
|
|||
|
|
}
|
|||
|
|
return full.gdStatus.shutdownData;
|
|||
|
|
}
|
|||
|
|
}, type: "number-fate"
|
|||
|
|
},
|
|||
|
|
{data:'online', render:function (data, type, full, meta) {
|
|||
|
|
if (tiggleValue === buttonname) {
|
|||
|
|
data = full.online;
|
|||
|
|
} else {
|
|||
|
|
data = full.gwonline;
|
|||
|
|
}
|
|||
|
|
if (Number(data) === 3.1415) {
|
|||
|
|
return "/";
|
|||
|
|
} else if (Number(data) === 3.14159) {
|
|||
|
|
return "（暂无数据）";
|
|||
|
|
} else {
|
|||
|
|
return data;
|
|||
|
|
}
|
|||
|
|
}, type: "number-fate"},
|
|||
|
|
],
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
//按干扰源类型进行统计
|
|||
|
|
function drawloadtypePic(companys, lineFeed,route) {
|
|||
|
|
$("#loadtypep").css("height", picHeight);
|
|||
|
|
var run = [];
|
|||
|
|
var breaks = [];
|
|||
|
|
var shutdown = [];
|
|||
|
|
var rate=[];
|
|||
|
|
var areas = [];
|
|||
|
|
if (null != companys) {
|
|||
|
|
for(var i=0;i<companys.length;i++){
|
|||
|
|
var monitors;
|
|||
|
|
var onlineRate;
|
|||
|
|
if (tiggleValue === buttonname) {
|
|||
|
|
monitors=companys[i].amounts;
|
|||
|
|
areas[i] = companys[i].name + lineFeed+"(" + companys[i].amounts + ")";
|
|||
|
|
onlineRate = Number(companys[i].online);
|
|||
|
|
run[i]=companys[i].status.normal;
|
|||
|
|
breaks[i]=companys[i].status.breaks;
|
|||
|
|
shutdown[i]=companys[i].status.shutdown;
|
|||
|
|
} else {
|
|||
|
|
monitors=companys[i].gwamounts;
|
|||
|
|
areas[i] = companys[i].name + lineFeed+"(" + companys[i].gwamounts + ")";
|
|||
|
|
onlineRate = Number(companys[i].gwonline);
|
|||
|
|
if(null!==companys[i].gdStatus){
|
|||
|
|
run[i] = companys[i].gdStatus.normal;
|
|||
|
|
breaks[i] = companys[i].gdStatus.breaks;
|
|||
|
|
shutdown[i] = companys[i].gdStatus.shutdown;
|
|||
|
|
}else{
|
|||
|
|
var singleData = {};
|
|||
|
|
var item = {};
|
|||
|
|
singleData.value = 3.1415;
|
|||
|
|
item.color = noMonitor;
|
|||
|
|
singleData.itemStyle = item;
|
|||
|
|
run[i] = singleData;
|
|||
|
|
breaks[i] = 0;
|
|||
|
|
shutdown[i] = 0;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
if(Number(monitors)===0){
|
|||
|
|
var singleData={};
|
|||
|
|
var normal={};
|
|||
|
|
var itemStyle={};
|
|||
|
|
singleData.value=3.1415;
|
|||
|
|
normal.color=noMonitor;
|
|||
|
|
itemStyle.normal=normal;
|
|||
|
|
singleData.itemStyle=itemStyle;
|
|||
|
|
run[i]=singleData;
|
|||
|
|
rate[i]=singleData;
|
|||
|
|
breaks[i]=0;
|
|||
|
|
shutdown[i]=0;
|
|||
|
|
}else{
|
|||
|
|
var singleData={};
|
|||
|
|
var normal={};
|
|||
|
|
var itemStyle={};
|
|||
|
|
normal.color = getColor(onlineRate);
|
|||
|
|
if(onlineRate<3.1414){
|
|||
|
|
singleData.value = 3.1415;
|
|||
|
|
normal.actual = onlineRate;
|
|||
|
|
}else{
|
|||
|
|
singleData.value = onlineRate;
|
|||
|
|
}
|
|||
|
|
itemStyle.normal=normal;
|
|||
|
|
singleData.itemStyle=itemStyle;
|
|||
|
|
rate[i]=singleData;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
var option = {
|
|||
|
|
backgroundColor: canvasBG,//背景色
|
|||
|
|
title: {
|
|||
|
|
text: '干扰源类型',
|
|||
|
|
left: '50%',
|
|||
|
|
padding: [
|
|||
|
|
15, // 上
|
|||
|
|
0, // 右
|
|||
|
|
0, // 下
|
|||
|
|
0, // 左
|
|||
|
|
]
|
|||
|
|
},
|
|||
|
|
color: [runColor, breaksColor, grey],
|
|||
|
|
tooltip: {
|
|||
|
|
trigger: 'axis',
|
|||
|
|
axisPointer: {
|
|||
|
|
type: 'shadow'
|
|||
|
|
},
|
|||
|
|
position: function (point, params, dom, rect, size) {
|
|||
|
|
// 鼠标坐标和提示框位置的参考坐标系是：以外层div的左上角那一点为原点，x轴向右，y轴向下
|
|||
|
|
// 提示框位置
|
|||
|
|
var x = 0; // x坐标位置
|
|||
|
|
var y = 0; // y坐标位置
|
|||
|
|
// 当前鼠标位置
|
|||
|
|
var pointX = point[0];
|
|||
|
|
var pointY = point[1];
|
|||
|
|
// 外层div大小
|
|||
|
|
// var viewWidth = size.viewSize[0];
|
|||
|
|
// var viewHeight = size.viewSize[1];
|
|||
|
|
// 提示框大小
|
|||
|
|
var boxWidth = size.contentSize[0];
|
|||
|
|
var boxHeight = size.contentSize[1];
|
|||
|
|
// boxWidth > pointX 说明鼠标左边放不下提示框
|
|||
|
|
if (boxWidth > pointX) {
|
|||
|
|
x = 5;
|
|||
|
|
} else { // 左边放的下
|
|||
|
|
x = pointX - boxWidth;
|
|||
|
|
}
|
|||
|
|
// boxHeight > pointY 说明鼠标上边放不下提示框
|
|||
|
|
if (boxHeight > pointY) {
|
|||
|
|
y = 5;
|
|||
|
|
} else { // 上边放得下
|
|||
|
|
y = pointY - boxHeight;
|
|||
|
|
}
|
|||
|
|
return [x, y];
|
|||
|
|
},
|
|||
|
|
formatter: function (params) {
|
|||
|
|
var tips="";
|
|||
|
|
tips+='<font style="font-size: 12px">'+params[0].name+'</font>';
|
|||
|
|
var color = params[0].color;
|
|||
|
|
tips +='<br/><font style="font-size: 12px">终端状态(%)</font>';
|
|||
|
|
if (color === noMonitor) {
|
|||
|
|
tips += '<br/><font style="font-size: 10px">投运 : /</font>';
|
|||
|
|
tips += '<br/><font style="font-size: 10px">热备用 : /</font>';
|
|||
|
|
tips += '<br/><font style="font-size: 10px">停运 : /</font>';
|
|||
|
|
tips += '<br/><font style="font-size: 12px">终端在线率(%)</font>';
|
|||
|
|
tips+='<br/><font style="font-size: 10px">/</font>';
|
|||
|
|
}else{
|
|||
|
|
for (var i = 0; i < 3; i++) {
|
|||
|
|
tips+='<br/><font style="font-size: 10px">'+params[i].seriesName+' : '+params[i].value+'</font>';
|
|||
|
|
}
|
|||
|
|
tips += '<br/><font style="font-size: 12px">终端在线率(%)</font>';
|
|||
|
|
var onlineRate;
|
|||
|
|
if(Number(params[3].value)===3.14159){
|
|||
|
|
onlineRate='暂无数据';
|
|||
|
|
}else if(Number(params[3].value)===3.1415){
|
|||
|
|
onlineRate='/';
|
|||
|
|
}else{
|
|||
|
|
onlineRate=params[3].value;
|
|||
|
|
}
|
|||
|
|
tips+='<br/><font style="font-size: 10px">'+onlineRate+'</font>';
|
|||
|
|
}
|
|||
|
|
return tips;
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
//控制图标在dataroom中的位置大小
|
|||
|
|
grid: {
|
|||
|
|
left: '1%',
|
|||
|
|
right: '11%',
|
|||
|
|
bottom: '3%',
|
|||
|
|
containLabel: true
|
|||
|
|
},
|
|||
|
|
xAxis: [{
|
|||
|
|
type: 'category',
|
|||
|
|
data: areas,
|
|||
|
|
name: '干扰源类型\n(终端个数)\n',
|
|||
|
|
splitLine: {
|
|||
|
|
show: false
|
|||
|
|
},
|
|||
|
|
axisLabel: {
|
|||
|
|
show:true,
|
|||
|
|
interval: 0,
|
|||
|
|
rotate:route,
|
|||
|
|
fontSize:10
|
|||
|
|
}
|
|||
|
|
}],
|
|||
|
|
yAxis: [{
|
|||
|
|
type: 'value',
|
|||
|
|
name: '%',
|
|||
|
|
min: '0',
|
|||
|
|
max: '100'
|
|||
|
|
}],
|
|||
|
|
series: [{
|
|||
|
|
name: '投运',
|
|||
|
|
type: 'bar',
|
|||
|
|
stack: 'sum',
|
|||
|
|
barMaxWidth: barMax,
|
|||
|
|
data: run
|
|||
|
|
}, {
|
|||
|
|
name: '热备用',
|
|||
|
|
type: 'bar',
|
|||
|
|
stack: 'sum',
|
|||
|
|
barMaxWidth: barMax,
|
|||
|
|
data: breaks
|
|||
|
|
}, {
|
|||
|
|
name: '停运',
|
|||
|
|
type: 'bar',
|
|||
|
|
stack: 'sum',
|
|||
|
|
barMaxWidth: barMax,
|
|||
|
|
data: shutdown
|
|||
|
|
},{
|
|||
|
|
name: '在线率',
|
|||
|
|
type: 'bar',
|
|||
|
|
barGap: 0,
|
|||
|
|
barMaxWidth: barMax,
|
|||
|
|
data: rate
|
|||
|
|
}]
|
|||
|
|
};
|
|||
|
|
var factory = echarts.init(document.getElementById('loadtypep'));
|
|||
|
|
factory.setOption(option);
|
|||
|
|
factory.on('click', function () {
|
|||
|
|
if (getRole("/pqs9000/business/runtime") == 1) {
|
|||
|
|
window.top.addTab('runtime', '终端运行情况')
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
//填充干扰源类型表格
|
|||
|
|
function initloadtypeTable(data) {
|
|||
|
|
var height = picHeight - 50;
|
|||
|
|
if (data == null) {
|
|||
|
|
data = [];
|
|||
|
|
}
|
|||
|
|
$("#loadtypeTable").DataTable({
|
|||
|
|
data: data,
|
|||
|
|
autoWidth: false,
|
|||
|
|
order:[1,"desc"],
|
|||
|
|
columnDefs : [
|
|||
|
|
{ orderable: false, targets: [0,2,3,4] }
|
|||
|
|
],
|
|||
|
|
paging: false,
|
|||
|
|
lengthChange: false,
|
|||
|
|
searching: false,
|
|||
|
|
destroy: true,
|
|||
|
|
scrollY: height,
|
|||
|
|
info: false,
|
|||
|
|
language: {
|
|||
|
|
url: '/pqs9000/json/chine.json',
|
|||
|
|
},
|
|||
|
|
columns: [
|
|||
|
|
{data: 'name'},
|
|||
|
|
{data: 'amounts', render: function (data, type, full, meta) {
|
|||
|
|
if (tiggleValue === buttonname) {
|
|||
|
|
if(full.amounts==0){
|
|||
|
|
return "0";
|
|||
|
|
}
|
|||
|
|
return full.amounts;
|
|||
|
|
} else {
|
|||
|
|
if(full.gwamounts==0){
|
|||
|
|
return "0";
|
|||
|
|
}
|
|||
|
|
return full.gwamounts;
|
|||
|
|
}
|
|||
|
|
}, type: "number-fate"},
|
|||
|
|
{
|
|||
|
|
data: 'status.normalData', render: function (data, type, full, meta) {
|
|||
|
|
if (tiggleValue === buttonname) {
|
|||
|
|
if(full.amounts==0){
|
|||
|
|
return "/";
|
|||
|
|
}
|
|||
|
|
return full.status.normalData;
|
|||
|
|
} else {
|
|||
|
|
if(full.gwamounts==0){
|
|||
|
|
return "/";
|
|||
|
|
}
|
|||
|
|
if(null===full.gdStatus){
|
|||
|
|
return "0"
|
|||
|
|
}
|
|||
|
|
return full.gdStatus.normalData;
|
|||
|
|
}
|
|||
|
|
}, type: "number-fate"
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
data: 'status.breaksData', render: function (data, type, full, meta) {
|
|||
|
|
if (tiggleValue === buttonname) {
|
|||
|
|
if(full.amounts==0){
|
|||
|
|
return "/";
|
|||
|
|
}
|
|||
|
|
return full.status.breaksData;
|
|||
|
|
} else {
|
|||
|
|
if(full.gwamounts==0){
|
|||
|
|
return "/";
|
|||
|
|
}
|
|||
|
|
if(null===full.gdStatus){
|
|||
|
|
return "0"
|
|||
|
|
}
|
|||
|
|
return full.gdStatus.breaksData;
|
|||
|
|
}
|
|||
|
|
}, type: "number-fate"
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
data: 'status.shutdownData', render: function (data, type, full, meta) {
|
|||
|
|
if (tiggleValue === buttonname) {
|
|||
|
|
if(full.amounts==0){
|
|||
|
|
return "/";
|
|||
|
|
}
|
|||
|
|
return full.status.shutdownData;
|
|||
|
|
} else {
|
|||
|
|
if(full.gwamounts==0){
|
|||
|
|
return "/";
|
|||
|
|
}
|
|||
|
|
if(null===full.gdStatus){
|
|||
|
|
return "0"
|
|||
|
|
}
|
|||
|
|
return full.gdStatus.shutdownData;
|
|||
|
|
}
|
|||
|
|
}, type: "number-fate"
|
|||
|
|
},
|
|||
|
|
{data:'online', render:function (data, type, full, meta) {
|
|||
|
|
if (tiggleValue === buttonname) {
|
|||
|
|
data = full.online;
|
|||
|
|
} else {
|
|||
|
|
data = full.gwonline;
|
|||
|
|
}
|
|||
|
|
if (Number(data) === 3.1415) {
|
|||
|
|
return "/";
|
|||
|
|
} else if (Number(data) === 3.14159) {
|
|||
|
|
return "（暂无数据）";
|
|||
|
|
} else {
|
|||
|
|
return data;
|
|||
|
|
}
|
|||
|
|
}, type: "number-fate"},
|
|||
|
|
],
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
//特殊处理，表头紧缩问题--start
|
|||
|
|
var it = null;
|
|||
|
|
|
|||
|
|
function startQuery() {
|
|||
|
|
//实时刷新时间单位为毫秒
|
|||
|
|
it = setInterval('refreshQuery()', 100);
|
|||
|
|
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/* 刷新查询 */
|
|||
|
|
function refreshQuery() {
|
|||
|
|
if(showtype == 0){
|
|||
|
|
$("#areaDepts").css("display", "");
|
|||
|
|
$("#areaT").css("display", "");
|
|||
|
|
$("#vol").css("display", "none");
|
|||
|
|
$("#volT").css("display", "none");
|
|||
|
|
$("#company").css("display", "none");
|
|||
|
|
$("#companyT").css("display", "none");
|
|||
|
|
$("#loadtypep").css("display", "none");
|
|||
|
|
$("#loadtypeT").css("display", "none");
|
|||
|
|
|
|||
|
|
if (parseInt(areLength) > parseInt(barUpperLimit7)) {
|
|||
|
|
drawAreaPic(areaResult, noLineFeed,barRouteIncline);
|
|||
|
|
} else {
|
|||
|
|
drawAreaPic(areaResult, lineFeed,barRouteZero);
|
|||
|
|
}
|
|||
|
|
initAreaTable(areaResult);
|
|||
|
|
}else if(showtype == 1){
|
|||
|
|
$("#areaDepts").css("display", "none");
|
|||
|
|
$("#areaT").css("display", "none");
|
|||
|
|
$("#vol").css("display", "");
|
|||
|
|
$("#volT").css("display", "");
|
|||
|
|
$("#company").css("display", "none");
|
|||
|
|
$("#companyT").css("display", "none");
|
|||
|
|
$("#loadtypep").css("display", "none");
|
|||
|
|
$("#loadtypeT").css("display", "none");
|
|||
|
|
|
|||
|
|
if (parseInt(companyLength) > parseInt(barUpperLimit7)) {
|
|||
|
|
drawVolPic(volResult, noLineFeed,barRouteIncline);
|
|||
|
|
} else {
|
|||
|
|
drawVolPic(volResult, lineFeed,barRouteZero);
|
|||
|
|
}
|
|||
|
|
initVolTable(volResult);
|
|||
|
|
}else if(showtype == 2){
|
|||
|
|
$("#areaDepts").css("display", "none");
|
|||
|
|
$("#areaT").css("display", "none");
|
|||
|
|
$("#vol").css("display", "none");
|
|||
|
|
$("#volT").css("display", "none");
|
|||
|
|
$("#company").css("display", "");
|
|||
|
|
$("#companyT").css("display", "");
|
|||
|
|
$("#loadtypep").css("display", "none");
|
|||
|
|
$("#loadtypeT").css("display", "none");
|
|||
|
|
|
|||
|
|
if (parseInt(companyLength) > parseInt(barUpperLimit7)) {
|
|||
|
|
drawCompanyPic(companyResult, noLineFeed,barRouteIncline);
|
|||
|
|
} else {
|
|||
|
|
drawCompanyPic(companyResult, lineFeed,barRouteZero);
|
|||
|
|
}
|
|||
|
|
initCompanyTable(companyResult);
|
|||
|
|
}else if(showtype == 3){
|
|||
|
|
$("#areaDepts").css("display", "none");
|
|||
|
|
$("#areaT").css("display", "none");
|
|||
|
|
$("#company").css("display", "none");
|
|||
|
|
$("#companyT").css("display", "none");
|
|||
|
|
$("#vol").css("display", "none");
|
|||
|
|
$("#volT").css("display", "none");
|
|||
|
|
$("#loadtypep").css("display", "");
|
|||
|
|
$("#loadtypeT").css("display", "");
|
|||
|
|
|
|||
|
|
if (parseInt(companyLength) > parseInt(barUpperLimit7)) {
|
|||
|
|
drawloadtypePic(loadtypeResult, noLineFeed,barRouteIncline);
|
|||
|
|
} else {
|
|||
|
|
drawloadtypePic(loadtypeResult, lineFeed,barRouteZero);
|
|||
|
|
}
|
|||
|
|
initloadtypeTable(loadtypeResult);
|
|||
|
|
}
|
|||
|
|
window.clearInterval(it)
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
//根据在线率获取颜色
|
|||
|
|
function getColor(data) {
|
|||
|
|
if (data >= 90) {
|
|||
|
|
return green;
|
|||
|
|
} else if (data === 3.1415) {
|
|||
|
|
return noMonitor;
|
|||
|
|
} else if (data === 3.14159) {
|
|||
|
|
return noData;
|
|||
|
|
} else if (data < 60) {
|
|||
|
|
return red;
|
|||
|
|
} else {
|
|||
|
|
return yellow;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
|
|||
|
|
//开关触发图片更新
|
|||
|
|
function reDrawAllPic() {
|
|||
|
|
if(showtype == 0){
|
|||
|
|
if (areaResult === null) {
|
|||
|
|
drawAreaPic(null);
|
|||
|
|
initAreaTable(null);
|
|||
|
|
} else {
|
|||
|
|
if (parseInt(areLength) > parseInt(barUpperLimit7)) {
|
|||
|
|
drawAreaPic(areaResult, noLineFeed,barRouteIncline);
|
|||
|
|
} else {
|
|||
|
|
drawAreaPic(areaResult, lineFeed,barRouteZero);
|
|||
|
|
}
|
|||
|
|
initAreaTable(areaResult);
|
|||
|
|
}
|
|||
|
|
}else if(showtype == 1){
|
|||
|
|
if (volResult === null) {
|
|||
|
|
drawVolPic(null);
|
|||
|
|
initVolTable(null);
|
|||
|
|
} else {
|
|||
|
|
if (parseInt(volLength) > parseInt(barUpperLimit7)) {
|
|||
|
|
drawVolPic(volResult, noLineFeed,barRouteIncline);
|
|||
|
|
} else {
|
|||
|
|
drawVolPic(volResult, lineFeed,barRouteZero);
|
|||
|
|
}
|
|||
|
|
initVolTable(volResult);
|
|||
|
|
}
|
|||
|
|
}else if(showtype == 2){
|
|||
|
|
if (companyResult === null) {
|
|||
|
|
drawCompanyPic(null);
|
|||
|
|
initCompanyTable(null);
|
|||
|
|
} else {
|
|||
|
|
if (parseInt(companyLength) > parseInt(barUpperLimit7)) {
|
|||
|
|
drawCompanyPic(companyResult, noLineFeed,barRouteIncline);
|
|||
|
|
} else {
|
|||
|
|
drawCompanyPic(companyResult, lineFeed,barRouteZero);
|
|||
|
|
}
|
|||
|
|
initCompanyTable(companyResult);
|
|||
|
|
}
|
|||
|
|
}else if(showtype == 3){
|
|||
|
|
if (loadtypeResult === null) {
|
|||
|
|
drawloadtypePic(null);
|
|||
|
|
initloadtypeTable(null);
|
|||
|
|
} else {
|
|||
|
|
if (parseInt(loadtypeLength) > parseInt(barUpperLimit7)) {
|
|||
|
|
drawloadtypePic(loadtypeResult, noLineFeed,barRouteIncline);
|
|||
|
|
} else {
|
|||
|
|
drawloadtypePic(loadtypeResult, lineFeed,barRouteZero);
|
|||
|
|
}
|
|||
|
|
initloadtypeTable(companyResult);
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* 数字排序自定义start
|
|||
|
|
*/
|
|||
|
|
jQuery.fn.dataTableExt.oSort['number-fate-asc'] = function (s1, s2) {
|
|||
|
|
if(s1==="/" ){
|
|||
|
|
s1=0;
|
|||
|
|
}
|
|||
|
|
if(s2==="/" ){
|
|||
|
|
s2=0;
|
|||
|
|
}
|
|||
|
|
return Number(s1) - Number(s2);
|
|||
|
|
};
|
|||
|
|
|
|||
|
|
jQuery.fn.dataTableExt.oSort['number-fate-desc'] = function (s1, s2) {
|
|||
|
|
if(s1==="/" ){
|
|||
|
|
s1=0;
|
|||
|
|
}
|
|||
|
|
if(s2==="/" ){
|
|||
|
|
s2=0;
|
|||
|
|
}
|
|||
|
|
return Number(s2) - Number(s1);
|
|||
|
|
};
|
|||
|
|
|
|||
|
|
function loadselect(dictypeName,div){
|
|||
|
|
var part='#'+div;
|
|||
|
|
$(part).find("option").remove();
|
|||
|
|
$.ajax({
|
|||
|
|
method : "post",
|
|||
|
|
url : "/pqs9000/device/getselect",
|
|||
|
|
data : {
|
|||
|
|
dictypeName:dictypeName
|
|||
|
|
},
|
|||
|
|
async:false,
|
|||
|
|
success : function(data) {
|
|||
|
|
if(data == null){
|
|||
|
|
var message = dictypeName + '信息加载失败';
|
|||
|
|
layer.msg(message,{icon:1,time:1000});
|
|||
|
|
}else{
|
|||
|
|
var option0 = $("<option selected value='"
|
|||
|
|
+ null + "'>"
|
|||
|
|
+ "全部" + "</option>");
|
|||
|
|
$(part).append(option0);
|
|||
|
|
$.each(data, function(i, item) {
|
|||
|
|
var option = $("<option value='"
|
|||
|
|
+ item.dicIndex + "'>"
|
|||
|
|
+ item.dicName + "</option>");
|
|||
|
|
$(part).append(option);
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
</script>
|
|||
|
|
</body>
|
|||
|
|
</html>
|