一段Js代码
base.js
(function(global){
var rootPath = global.rootPath = document.querySelector(".rootPath").innerHTML;
/****************************
* 格式化时间
***************************/
Date.prototype.Format = function(fmt){ //author: meizz
var o = {
"M+" : this.getMonth()+1, //月份
"d+" : this.getDate(), //日
"H+" : this.getHours(), //小时
"m+" : this.getMinutes(), //分
"s+" : this.getSeconds(), //秒
"q+" : Math.floor((this.getMonth()+3)/3), //季度
"S" : this.getMilliseconds() //毫秒
};
if(/(y+)/.test(fmt))
fmt=fmt.replace(RegExp.$1, (this.getFullYear()+"").substr(4 - RegExp.$1.length));
for(var k in o)
if(new RegExp("("+ k +")").test(fmt))
fmt = fmt.replace(RegExp.$1, (RegExp.$1.length==1) ? (o[k]) : (("00"+ o[k]).substr((""+ o[k]).length)));
return fmt;
};
/*禁用文字选中*/
document.body.onselectstart= function(){return false;};
/*获取当前时间*/
var getCurrentTime = global.getCurrentTime = function(){
var timer = new Date(),times = [];
times[0] = timer.getFullYear(),
times[1] = timer.getMonth() + 1,
times[2] = timer.getDate(),
times[3] = timer.getHours(),
times[4] = timer.getMinutes();
for(var i =0;n=times.length,i= parseInt(that.table.scrollHeight - that.table.offsetHeight))
that.table.scrollTop = 0;
that.table.scrollTop += that.step;
}else{
if(parseInt(that.table.scrollTop <= 0))
that.table.scrollTop = parseInt(that.table.scrollHeight);
that.table.scrollTop -= that.step;
}
if(parseInt(that.table.scrollTop) % that.lineHeight != 0){
that.scrollTimer = setTimeout(that._getFunction(that, "_autoScroll"), that.delay);
}else{
that.autoScrollTimer = setTimeout(that._getFunction(that, "_autoScroll"), that.timeout);
}
},
/**-------------------------------
* 获得相应方法
* @param {obj} object
* @param {method} method fn
* @param {parma} method parma
* @returns object fn
* -----------------------------*/
_getFunction:function(obj, method, parma){
return function(){
obj[method](parma);
};
},
/**-----------------------
* 右键菜 contexmenu event
* @param {null}
* ----------------------*/
_contex:function(){
var that = this;
that._addHandler(that.table, "contextmenu", function(e){
var e = e||window.event,target = e.target || e.srcElement;
e.preventDefault();
var trid = target.parentNode.id?target.parentNode.id:target.parentNode.parentNode.id;;
if(trid){
that.table.onmouseover = null;
that.table.onmouseout = null;
that._displayContex(e, trid);
that.clickFlag = false;
}
});
},
/**--------------------------------
* 重置列表宽度
* @param {null}
* @returns number tr->div width
* ------------------------------*/
_resize:function(){
var that = this,parent = that.table.parentNode,
width = parent.offsetWidth,
nodes = parent.getElementsByTagName("th"),
len = nodes.length,
sw = Math.floor(width/len);
for(j=0;j告警详情
确认告警
清除告警
定位设备
解决方案
';
el.innerHTML = str;
d.appendChild(el);
}
function selectNode(id, obj){
var nNode = obj.getNode(id);
if(nNode){
nNode.rectStyle = {fill:'url('+ nNode.treeNode.img +')',"stroke":"#0f6fc7","stroke-width":2};
obj.updateNode(id);
}
}
function restart(){
that._start();
that.table.onmouseover = that._getFunction(that,"_stop");
that.table.onmouseout = that._getFunction(that,"_start");
that.clickFlag = true;
}
/**告警菜单点击事件处理*/
el.onclick = function(e){
var e = e||window.event,target = e.target || e.srcElement;
var caseNode = target.innerHTML;
switch(caseNode){
case "告警详情": d.removeChild(el);selectUrl(rootPath + '/alarm/current/toPage.do?nodeId=' + that._getDeviceId(id)+'&initCondition=1','当前告警分析',[1000,600]);restart();that._setBgColor(trid, true);break;
case "确认告警": d.removeChild(el);that.confirmAlarm(id);restart();that._setBgColor(trid, true);break;
case "清除告警": that.clearAlarm(id);d.removeChild(el);restart();that._setBgColor(trid, true);break;
case "定位设备": d.removeChild(el);that.locationDevice(id);restart();that._setBgColor(trid, true);break;
case "解决方案": d.removeChild(el);that.alarmSolution(trid.title);restart();that._setBgColor(trid, true);break;
default: break;
}
};
el.onmouseleave = function(){
d.removeChild(el);
that._setBgColor(trid, true);
restart();
};
},
/**----------------------------------
* 确认告警
* @param {id} alarm object's id
* --------------------------------*/
confirmAlarm:function(id){
var confirmUrl = rootPath + '/alarm/current/confirmCurrentAlarm.do',that = this ;
$ajax(confirmUrl, "post", {id:that._getDeviceId(id)}, function(info){
//console.log(info);
//更新对应行的status的值为确认
document.getElementById(id).querySelector(".alarmStatus").innerHTML ="确认";
layer.msg(info.msg,{icon: 1});
});
},
/**---------------------------------
* 告警解决方案
* @param {alarmType} alarm type
* -------------------------------*/
alarmSolution:function(alarmType){
var confirmUrl = rootPath + '/alarm/current/alarmSolution.do';
$ajax(confirmUrl, "post", {alarmType: alarmType}, function(info){
console.log(info);
if(info.success){
layer.alert(info.obj.solution,
{ title:['告警解决方案','background:#15a506;color:#ffffff;font-size:16px;font-family:微软雅黑']
});
}else{
layer.msg(info.msg);
}
});
},
/**---------------------------------
* 清除告警
* @param {id} alarm object's id
* -------------------------------*/
clearAlarm:function(id){
var clearUrl = rootPath + '/alarm/current/deleteCurrentAlarm.do',that = this;
//询问框，是否清除告警
layer.confirm('确认清除告警？', {
title:['清除告警','background:#15a506;color:#ffffff;font-size:16px;font-family:微软雅黑'],
btn: ['确定'] //按钮
}, function(){
$ajax(clearUrl, "post", {deviceId: that._getDeviceId(id),alarmLevel: that._getAlarmLevel(id)}, function(info){
console.log(info);
if(info.success){
var node = document.getElementById(id);
that.table.removeChild(node);
layer.msg('清除告警成功', {icon: 1});
}
});
}, function(){
layer.closeAll();
});
},
/**----------------------------------
* 定位告警
* @param {id} alarm object's id
* --------------------------------*/
locationDevice:function(id){
var clearUrl = rootPath + '/alarm/current/locationDevice.do',that = this;
$ajax(clearUrl, "post", {deviceId: that._getDeviceId(id)}, function(info){
//console.log(info);
clearTopology();
initTopology("topoContent", info, false);
});
},
/**---------------------------------
* 告警级别颜色
* @param {level} alarm level
* @param {width} td->div width
* @returns string html
* -------------------------------*/
_getColor:function(level, width){
switch(level){
case 0: return '正常';
case 1: return '离线';
case 2: return '次要';
case 3: return '主要';
case 4: return '严重';
default: break;
}
},
/**----------------------
* 格式化时间
* @param {nS} number
* @returns string
* --------------------*/
_getLocalTime:function(nS) {
return new Date(nS).Format("yyyy-MM-dd HH:mm:ss");
},
/**---------------------------------
* 创建html
* @param {info} alarm info
* @param {width} td->div width
* @returns string
* -------------------------------*/
_createHtml:function(info, width){
var that = this,str = '',n = ' ';
str += that._getColor(info.alarmLevel, width);
if(info.alarmType) str += '' + info.alarmType + '';else str += n;
if(info.deviceName) str += '' + info.deviceName + '';else str += n;
if(info.ipAddress) str += '' + info.ipAddress + '';else str += n;
if(info.areaName) str += '' + info.areaName + '';else str += n;
if(info.ceateTime) str += '' + that._getLocalTime(info.ceateTime) + '';else str += n;
if(info.lastUpdateTime) str += '' + that._getLocalTime(info.lastUpdateTime) + '';else str += n;
if(info.alarmNumber) str += '' + info.alarmNumber + '';else str += n;
if(info.status) str += '' + info.status + '';else str += n;
return str;
},
/**--------------------------------
* 渲染告警列表
* @param {arr} alarm list json
* ------------------------------*/
init:function(arr){
var that = this,count = 0,len = arr.length;
if(that.clickFlag){
that._stop();
var str = '';
if(len > 0){
for(var j=0; j 0) && arr[j].isValid == 1){
count++;
str += that._insert(arr[j], that.tdWidth);
}
}
}
that.table.innerHTML = str;
that.lineHeight = that._getHeight();
if(that.table.offsetHeight > count*that.lineHeight){
that._openScroll();
}
that.clickFlag = true;
}
},
/**---------------------------------
* 查找是否存在项
* @param {id} alarm object's id
* @returns object | boolean
* -------------------------------*/
_checkedTr:function(info){
var that = this, tr = that.table.getElementsByTagName("tr"),flag = false,
id = '_' + info.deviceId + '_' + info.alarmLevel;
for(var j = tr.length - 1; j >= 0;j--){
if(tr[j].id == id){
flag = tr[j];
break;
}
}
return flag;
},
/**-------------------------------
* 插入告警
* @param {info} alarm info
* @param {width} td->div width
* @returns string
* -----------------------------*/
_insert:function(info, width){
var that = this, str = '';
str += '';
str += that._createHtml(info, width);
str += '';
return str;
},
/**------------------------------
* 移除告警
* @param {ele} dom object
* ----------------------------*/
_delete:function(ele){
if(ele) this.table.removeChild(ele);
},
/**------------------------------
* 修改告警
* @param {ele} tr dom
* @param {info} alarm info
* @param {width} td->div width
* -----------------------------*/
_modify:function(ele, info, width){
var that = this, str = '';
str += that._createHtml(info, width);
ele.innerHTML = str;
},
/**------------------------------
* 最新告警
* @param {arr} alarm list json
* ----------------------------*/
latestAlarm:function(arr){
var that = this, len = arr.length, str = '', table = that.table, inner = that.table.innerHTML;
if(len > 0){
for(j=0; j 0) && arr[j].isValid == 1){
if(!dom){
str += that._insert(arr[j], that.tdWidth);
if(str) table.innerHTML = str + inner;
}else{
that._modify(dom, arr[j], that.tdWidth);
}
}else if((arr[j].alarmLevel == 0) && arr[j].isValid == 1){
that._delete(dom);
}
}
}
}
};
/*ebu升级更新*/
global.UpgradeEbuDisplay = function(el){
this.container = document.getElementById(el);
this._bind();
};
UpgradeEbuDisplay.prototype = {
_bind:function(){
var that = this,parent = that.container.parentNode.parentNode.parentNode.parentNode,
exitBtn = parent.querySelector(".control-exit");
exitBtn.onclick = function(){
parent.style.cssText = "z-index:-6";
};
that.container.onscroll = function(){
var there = this,
header = that.container.parentNode.getElementsByTagName("thead")[0];
if(there.scrollLeft){
header.style.marginLeft = -there.scrollLeft + "px";
}else{
header.style.marginLeft = "0px";
}
};
},
/*渲染列表*/
init:function(msg){
var str = '',that = this,len = msg.length,def = that.container.getElementsByTagName("tr");
if(len > 0){
if(def.length > 0){
that.container.innerHTML = '';
}
for(var j = len - 1; j >= 0; j--){
if(msg[j]){
//var el = document.getElementById("upgradeEbu" + msg[j].capEbu.deviceIp);
if(!that.checkTr(msg[j].deviceIp)){
str += this.insert(msg[j]);
}else{
this.modify(msg[j]);
}
}
}
that.container.innerHTML += str;
}
},
/*检查已存在列表项*/
checkTr:function(deviceIp){
var dom = document.querySelectorAll(".upgradeEbu"),flag = false;
if(dom){
var len = dom.length;
for(j=0;j';
str += this.create(msg);
str += '';
return str;
},
/*修改*/
modify:function(msg){
var el = document.getElementById("upgradeEbu" + msg.deviceIp),str = '';
str += this.create(msg);
el.innerHTML = str;
},
/****************************************
* 0 success. new version: bld.xxxx.xxx
* 100 updating. downloading
* 101 updating. xxx
* 201 error. server parameter error.
* 202 error. download fail
* 203 error. rom file error
* 204 error. device upgrade error.
****************************************/
stateCode:function(msg){
if(msg.deviceStateCode == 0){
return '升级成功'+ msg.deviceStateMsg +'';
}else if(msg.deviceStateCode >= 100 && msg.deviceStateCode < 200){
return '升级中--' + msg.deviceStateMsg + '';
}else if(msg.deviceStateCode >= 200 && msg.deviceStateCode < 300){
return '升级失败--' + msg.deviceStateMsg + '';
}
},
/*创建元素*/
create:function(msg){
var str = '', none = ' ';
if(msg.deviceName) str += ''+ msg.deviceName +''; else str += none;
if(msg.deviceIp) str += ''+ msg.deviceIp +''; else str += none;
if(msg.requestUserName) str += ''+ msg.requestUserName +''; else str += none;
if(msg.requestIp) str += ''+ msg.requestIp +''; else str += none;
if(msg.requestTime) str += ''+ this.formatTime(msg.requestTime) +''; else str += none;
if(msg.upgradeStartTime) str += ''+ this.formatTime(msg.upgradeStartTime) +''; else str += none;
if(msg.upgradeLastTime) str += ''+ this.formatS(msg.upgradeLastTime) +''; else str += none;
if(msg.deviceStateCode) str += ''+ msg.deviceStateCode +''; else str += ' ';
str += this.stateCode(msg);
return str;
},
/*格式化时间项*/
formatTime:function(nS) {
return new Date(nS).Format("yyyy-MM-dd HH:mm:ss");
},
formatS:function(s){
return new Date(s).Format("mm:ss");
},
/*提示信息*/
displayTip:function(msg, layer){
var that = this;
//for(var j = 0,n = msg.length; j < n; j++){
//if(msg[j].statusCode == 1000 ){
var title = "EBU升级 (10秒后自动关闭)";
layer.open({
type: 1, //page层
offset:'rb',
title: [title,'background:#0172ff;color:#fff'], // title color: red -> blue
time:10000,
shade: 0, //不要遮罩
moveType: 1,
shift: 2, //0-6的动画形式，-1不开启
content: '' + msg + '',
});
//清空升级列表
setTimeout(function(){
that.container.innerHTML = '无设备在升级';
},2*60*1000);
//}
//}
}
};
/**--------------------------------
* 提示信息
* layer.js 提示信息在全屏下不可用
* ------------------------------*/
var prompted = global.prompted = {
msg:function(msg,el){
var d = document.querySelector(el),
content = document.createElement("div");
content.className = "promptedMsg";
content.innerHTML = ''+ msg + '';
d.appendChild(content);
setTimeout(function(){
d.removeChild(content);
},2*1000);
},
confirm:function(msg,el){
var d = document.querySelector(el),
content = document.createElement("div");
content.className = "promptedConfirm";
}
};
/*get websocket basic path*/
global.getWebsocketPath = function getWebsocketPath() {
var strFullPath = window.document.location.href;
var strPath = window.document.location.pathname;
var pos = strFullPath.indexOf(strPath);
var prePath = strFullPath.substring(0, pos);
var postPath = strPath.substring(0, strPath.substr(1).indexOf('/') + 1);
var rootPath = prePath + postPath;
rootPath = rootPath.replace("http", "ws");
return (rootPath);
};
})(window);
;(function(global){
/*拓扑对象方法*/
var topology = global.topology = {
getMsg:function(url, type, data, fn){
$ajax(url, type, data, fn);
},
/*获得对象position属性值*/
getPosition:function(el){
var dom = el.getBoundingClientRect(),
top = parseInt(dom.top),
bottom = parseInt(dom.bottom),
left = parseInt(dom.left),
right = parseInt(dom.right),
width = parseInt(dom.width || right - left),
height = parseInt(dom.height || bottom -top);
return {l:left,t:top,r:right,b:bottom,w:width,h:height};
},
/*渲染性能数据*/
getfeture:function(e, node, el, arr, display){
var ele = document.querySelector(el),str = '';
if(display){
// if(node.treeNode.nodeType === "ebu"){
// if(arr){
// if(arr.cpuUtilization) str += 'CPU占用率：' + arr.cpuUtilization + ' %
'; else str += '
CPU占用率：0 %
';
// if(arr.memoryUtilization) str += '内存占用率：' + arr.memoryUtilization + ' %
'; else str += '
内存占用率：0 %
';
// if(arr.diskUtilization) str += '磁盘占用率：' + arr.diskUtilization + ' %
'; else str += '
磁盘占用率：0 %
';
// if(arr.totalStream) str += '吞吐量：' + arr.totalStream + ' Byte/s
'; else str += '
吞吐量：0 Byte/s
';
// if(arr.alarmNumber) str += '告警数：' + arr.alarmNumber + ' 条
'; else str += '
告警数：0 条
';
// }
// }else if(node.treeNode.nodeType === "edu"){
// if(arr){
// if(arr.upStream) str += '上行：' + arr.upStream + ' Byte/s
'; else str += '
上行：0 Byte/s
';
// if(arr.downStream) str += '下行：' + arr.downStream + ' Byte/s
'; else str += '
下行：0 Byte/s
';
// if(arr.deviceNumber) str += '接入设备台数：' + arr.deviceNumber + ' 个
'; else str += '
接入设备台数：0 个
';
// if(arr.alarmNumber) str += '此设备下EBU告警数：' + arr.alarmNumber + ' 条
'; else str += '
此设备下EBU告警数：0 条
';
// }
// }
if(arr){
if(node.treeNode.nodeType === "ebu"){
if(arr.treeNode.nodeName) str += '设备名称：' + arr.treeNode.nodeName + '
'; else str += '
设备名称：
';
if(arr.treeNode.deviceIp) str += '设备IP：' + arr.treeNode.deviceIp + '
'; else str += '
设备IP：
';
if(arr.treeNode.deviceLocation) str += '安装位置：' + arr.treeNode.deviceLocation + '
'; else str += '
安装位置：
';
if(arr.treeNode.softVersion) str += '软件版本：' + arr.treeNode.softVersion + '
'; else str += '
软件版本：
';
if(arr.routerNumber!=undefined&&arr.routerNumber!=null) str += '路由连接数：' + arr.routerNumber + '
'; else str += '
路由连接数：
';
ele.innerHTML = str;
}else if(node.treeNode.nodeType === "edu"){
if(arr.treeNode.nodeName) str += '设备名称：' + arr.treeNode.nodeName + '
'; else str += '
设备名称：
';
if(arr.treeNode.deviceIp) str += '设备IP：' + arr.treeNode.deviceIp + '
'; else str += '
设备IP：
';
ele.innerHTML = str;
}
}
var el = {
w:ele.offsetWidth,
h:ele.offsetHeight
}, p = this.getPosition(ele.parentNode);
if(node.treeNode.nodeType === "edu" || node.treeNode.nodeType === "ebu"){
/**************************************
* 判断是否超出可视区域，超出则调整显示位置
*************************************/
if(p.b < (e.y + el.h)){
if(p.r < (e.x + el.w)){
ele.style.cssText = "left:" + (e.x - el.w) + "px;top:" + (e.y - el.h) + "px;z-index:99999;";
}else{
ele.style.cssText = "left:" + e.x + "px;top:" + (e.y - el.h) + "px;z-index:99999;";
}
}else if(p.t > (e.y - el.h - 56)){
if(p.r < (e.x + el.w)){
ele.style.cssText = "left:" + (e.x - el.w) + "px;top:" + e.y + "px;z-index:99999;";
}else{
ele.style.cssText = "left:" + e.x + "px;top:" + e.y + "px;z-index:99999;";
}
}else{
if(p.r < (e.x + el.w)){
ele.style.cssText = "left:" + (e.x - el.w) + "px;top:" + (e.y - el.h) + "px;z-index:99999;";
}else{
ele.style.cssText = "left:" + e.x + "px;top:" + (e.y - el.h) + "px;z-index:99999;";
}
}
}
}else{
ele.style.cssText = ";z-index:-8;";
ele.innerHTML = '';
}
},
/*拓扑右键菜单*/
disContex:function(e, node, layer, graph){
var body = document.getElementById("topologyView"),
that = this;
if(node.treeNode.nodeType === "edu" || node.treeNode.nodeType === "ebu"){
var str = '',doms = document.createElement("div");
doms.className = "displayContex";
if(node.treeNode.nodeType === "edu"){
str +='设备详情
删除设备
';
}else if(node.treeNode.nodeType === "ebu"){
str +='设备参数
告警信息
删除设备
升级设备
重启设备
';
}
doms.innerHTML = str;
body.appendChild(doms);
var el = {
w:doms.offsetWidth,
h:doms.offsetHeight
},
p = this.getPosition(body);
if(node.treeNode.nodeType === "edu" || node.treeNode.nodeType === "ebu"){
if(p.b < (e.y + el.h)){
if(p.r < (e.x + el.w)){
doms.style.cssText = "left:" + (e.x - el.w + 5) + "px;top:" + (e.y - el.h - 5) + "px;";
}else{
doms.style.cssText = "left:" + (e.x - 5) + "px;top:" + (e.y - el.h + 5) + "px;";
}
//console.log("bottom");
}else if(p.t > (e.y - el.h - 56)){
if(p.r < (e.x + el.w)){
doms.style.cssText = "left:" + (e.x - el.w + 5) + "px;top:" + (e.y - 5) + "px;";
}else{
doms.style.cssText = "left:" + (e.x - 5) + "px;top:" + (e.y - 5) + "px;";
}
//console.log("top");
}else{
//console.log("middle");
if(p.r < (e.x + el.w)){
doms.style.cssText = "left:" + (e.x - el.w + 5) + "px;top:" + (e.y - 5) + "px;";
}else{
doms.style.cssText = "left:" + (e.x - 5) + "px;top:" + (e.y - 5) + "px;";
}
}
}
doms.onmouseleave = function(){
body.removeChild(doms);
};
function deleteNode(title,url,data,graph){
layer.confirm(title,{icon:3,title:['系统信息','background:#f2f2f2;color:#1f60ca;font-size:16px;font-family:微软雅黑'],shade: [0.7,'#fff']},
function(index){ //确定删除
$ajax(url,"post",data,function(result){
if(result.success){
layer.msg(result.msg);
graph.removeNode(data.ids[0]);
}else{
layer.msg("删除失败！");
}
});
layer.close(index);
});
}
function directUrl(layer,url){
}
/*菜单点击处理*/
doms.onclick = function(e){
var evt = e || window.event,
nodes = evt.target.innerHTML;
if(node.treeNode.nodeType === "ebu"){
var deleteUrl = rootPath + '/device/ebu/delete.do';
var restartUrl = rootPath + '/web/deviceConfig/deviceConfigController/rebootDevice.do';
switch(nodes){
case "设备参数": selectUrl(rootPath + '/device/ebu/toPage.do?nodeId='+node.treeNode.id,'EBU管理',[1000,600]); break;
case "告警信息": selectUrl(rootPath + '/alarm/current/toPage.do?nodeId='+node.treeNode.id,'当前告警分析',[1000,600]); break;
case "删除设备": deleteNode("确定删除此EBU设备?",deleteUrl,{ids:[node.treeNode.id]},graph); break;
case "升级设备": that.upgradeDevice(node); break;
case "重启设备": that.restartDevice(node,restartUrl); break;
default: break;
}
}else{
var deleteUrl = rootPath + '/device/edu/delete.do';
switch(nodes){
case "设备详情": selectUrl(rootPath + '/device/edu/toPage.do','EDU管理',[1000,600]); break;
case "删除设备": deleteNode("确定删除此EDU设备?",deleteUrl,{ids:[node.treeNode.id]},graph); break;
default: break;
}
}
body.removeChild(doms);
};
}
},
/**---------------------------
* 重启设备
* @param {node} object
* -------------------------*/
restartDevice:function(node,restartUrl){
layer.confirm("重启设备?",{icon:3,title:['系统信息','background:#f2f2f2;color:#1f60ca;font-size:16px;font-family:微软雅黑'],shade: [0.7,'#fff']},
function(index){
//node.treeNode.id node.treeNode.deviceIp
var id = node.treeNode.id;
var ids = new Array(id);
var data={ids:ids};
$ajax(restartUrl,"post",data,function(result){
if(result.reboot){
layer.msg(result.reboot);
}
if(result.error){
layer.msg(result.error);
}
});
layer.close(index);
});
},
/**-------------------------------------
* 主页设备升级
* @param {node} object
* -----------------------------------*/
upgradeDevice:function(node){
/*版本选项框*/
function initVersion(msg){
var str = '',d = document.querySelector(".versionoption");
if(msg){
for(var j=msg.length-1;j>=0;j--){
str += '';
}
d.innerHTML = str;
}
}
layer.confirm('确定要升级所选EBU设备?',{icon:3,title:['系统信息','background:#f2f2f2;color:#1f60ca;font-size:16px;font-family:微软雅黑'],shade: [0.7,'#fff']},
function(index){
var getVersion = rootPath + '/device/upgrade/getAllRecord';
$ajax(getVersion, "get", {}, function(info){
layer.close(index);
document.querySelector(".selectVersion").style.cssText = "z-index:9999";
initVersion(info);
});
},function(index){
layer.close(index);
});
/*取消*/
var cancel = document.querySelector("#vcancel"),
confirm = document.querySelector("#vconfirm");
if(cancel){
cancel.onclick = function(){
document.querySelector(".selectVersion").style.cssText = "z-index:-8";
};
}
/*确定*/
if(confirm){
confirm.onclick = function(){
var url = rootPath + '/device/upgrade/ebuUpgrade';
var data = {ids:[node.treeNode.id],ftpId:getOptionValue(document.querySelector(".versionoption"))};
if(data.ftpId){
$.ajax({
type:"POST",
url:url,
data:data,
datatype: "json",
success:function(data){
var upgradeResultArray = JSON.parse(data);
parseUpgradeResult(upgradeResultArray);
},
error: function(){
layer.msg("未知异常");
}
});
}else{
layer.msg("请选择版本号");
}
};
}
}
};
})(window);
/***********************
* 顶部导航交互
* 主页设备升级状态入口
**********************/
;(function(){
var $userMsg = $('.userMsg'),
$userMenu = $('.userMenu'),
$mainMenu = $('.mainMenu').children('li');
$userMsg.hover(
function(){
$userMenu.stop().slideDown("slow");
},function(){
$userMenu.stop().slideUp("fast");
}
);
$mainMenu.hover(
function(){
$(this).find('.subMenu').stop().slideDown("slow");
},function(){
$(this).find('.subMenu').stop().slideUp("fast");
}
);
document.querySelector(".ebuUpgradeStatus").onclick = function(e){
document.querySelector("#upgradeMsgBg").style.cssText = "z-index:99";
var getUpgradeMsg = rootPath + '/device/upgrade/getUpgradeData.do';
if(typeof upgradeEbu != "undefined"){
$ajax(getUpgradeMsg, "get", {}, function(info){
//console.log(info);
if(!info.isFinish){
upgradeEbu.init(info.capDeviceUpgradeList);
}
});
}
};
})();
/*----------------------
* 视图切换
* 全屏处理
* -------------------*/
(function(global){
var clearClass = global.clearClass = function(obj){
var span = obj.getElementsByTagName("span");
for(var j=span.length-1;j>=0;j--){
if(span[j].className) span[j].className = "";
}
};
document.querySelector(".devViewHeader").onclick = function(e){
var that = this,
e = e||window.event,
target = e.target || e.srcElement,
ele = document.getElementById("operChart");
if(target.innerHTML && (target.innerHTML === "GIS图")){
clearClass(that);
target.className = "active";
document.getElementById("topologyView").style.cssText += "z-index:-1";
document.getElementById("gisMap").style.cssText += "z-index:2";
var toolbar = document.getElementById("topologyViewToolbar");
//console.log( 'toolbar = ' + toolbar );
if ( null != toolbar ){
toolbar.style.display = "none";
}
}else if(target.innerHTML && target.innerHTML === "拓扑图"){
clearClass(that);
target.className = "active";
document.getElementById("gisMap").style.cssText += "z-index:-1";
document.getElementById("topologyView").style.cssText += "z-index:2";
var toolbar = document.getElementById("topologyViewToolbar");
//console.log( 'toolbar2 = ' + toolbar );
if ( null != toolbar ){
toolbar.style.display = "block";
}
}
};
/*-----------------------
* 全屏处理方法
* --------------------*/
var fullScreenCtl = global.fullScreenCtl = function(fullElement,fullScreenBtn,fullFn,exitFn){
var el = document.getElementById(fullElement);
var requestFullScreen = el.requestFullScreen || el.webkitRequestFullScreen || el.mozRequestFullScreen || el.msRequestFullScreen;
var cancelFullScreen = document.cancelFullScreen || document.cancelFullScreen || document.webkitCancelFullScreen || document.mozCancelFullScreen || document.exitFullScreen;
fullScreenBtn.onclick = function(){
if((typeof flag) === "undefined" || !flag){
requestFullScreen.call(el);
el.addEventListener("fullscreenchange", FShandler);
el.addEventListener("webkitfullscreenchange", FShandler);
el.addEventListener("mozfullscreenchange", FShandler);
el.addEventListener("MSFullscreenChange", FShandler);
el.addEventListener("fullscreenerror", FSerrorhandler);
el.addEventListener("webkitfullscreenerror", FSerrorhandler);
el.addEventListener("mozfullscreenerror", FSerrorhandler);
el.addEventListener("MSFullscreenError", FSerrorhandler);
}else{
cancelFullScreen.call(document);
if(typeof exitFn === "function") exitFn();
}
//全屏处理
function FShandler(){
var fullscreenElement = document.fullscreenElement || document.webkitFullscreenElement || document.mozFullScreenElement;
var fullscreenEnabled = document.fullscreenEnabled || document.webkitFullscreenEnabled || document.mozFullScreenEnabled;
if(fullscreenElement && fullscreenEnabled){
flag = true;
if(typeof fullFn === "function") fullFn();
}else{
flag = false;
if(typeof exitFn === "function") exitFn();
}
}
//全屏异常处理
function FSerrorhandler(){}
};
};
var closeWheel = global.closeWheel = function(){
var mousewheel = function(e){
e=e || window.event;
if(e.wheelDelta && event.ctrlKey){//IE/Opera/Chrome
event.returnValue = false;
}else if(e.detail){//Firefox
event.returnValue = false;
}
};
if(document.addEventListener){
document.addEventListener('DOMMouseScroll', mousewheel, false);
}
window.onmousewheel = document.onmousewheel = mousewheel;//IE/Opera/Chrome/Safari
};
})(window);
/**********************
* 主页搜索
*********************/
;(function(gloabl){
document.querySelector(".schMiddle").onfocus = function(){
var that = this;
if(that.value === "输入设备名、IP搜索"){
that.value = '';
}
};
document.querySelector(".schMiddle").onblur = function(){
var that = this;
if(!that.value.trim()){
that.value = "输入设备名、IP搜索";
}
};
var getsUrl = rootPath + '/villagetopology/SearchTree.do';
document.querySelector(".schMiddle").onkeyup = function(e){
var that = this,evt = e || window.event;
if(evt.keyCode == 13){
$ajax(getsUrl,"get",{searchPara:that.value.trim()},function(result){
console.log(result);
var cnode = trees.getNode(result[0].pNode.id);
cnode.removeChildNodes();
mTree.schNodes(result, cnode);
cookie.set("search","key");
});
}
if(that.value.trim() === '' || that.value.trim() === "输入设备名、IP搜索"){
setTimeout(function(){
$ajax(getsUrl,"get",{searchPara:'请输入搜索内容'},function(result){
var cnode = trees.getNode(result[0].pNode.id);
cnode.removeChildNodes();
mTree.schNodes(result, cnode);
cookie.clear("search");
});
},1200);
}
};
document.querySelector(".schSure").onclick = function(){
var that = document.querySelector(".schMiddle");
if(that.value.trim() && that.value !== "请输入搜索内容"){
$ajax(getsUrl,"get",{searchPara:that.value.trim()},function(result){
var cnode = trees.getNode(result[0].pNode.id);
cnode.removeChildNodes();
mTree.schNodes(result, cnode);
cookie.set("search","key");
});
}else{
if(!that.value.trim() || that.value === "请输入搜索内容"){
$ajax(getsUrl,"get",{searchPara:that.value.trim()},function(result){
var cnode = trees.getNode(result[0].pNode.id);
cnode.removeChildNodes();
mTree.schNodes(result, cnode);
cookie.clear("search");
});
}else{
layer.msg("请输入要搜索的信息");
}
}
};
})(window);
/**更新树*/
;(function(global){
/**------------------------
* 数组去重
* unique(arr)
* @param {arr} arry
*-----------------------*/
global.unique = function(arr) {
var temp = [], hash = {};
for (var i = 0, elem; (elem = arr[i]) != null; i++) {
if (!hash[elem]) {
temp.push(elem);
hash[elem] = true;
}
}
return temp;
};
/**----------------------------------------------
* 添加，修改，删除操作后更新树
* updateTreeStatus(url, ids, tree)
* @param {url} 获取树节点信息的url
* @param {ids} id串 string | []
* @param {tree} tree对象，调用树方法查找及更新树
* --------------------------------------------*/
global.updateTreeStatus = function(url, ids, tree){
var node,
insertNode = function(url, node){
if(node){
node.removeChildNodes();
$ajax(url, "get", {nodeId:getNodeId(node.id), level:node.level}, function(info){
mTree.insertNodes(info[0].childNode, node);
});
}
};
if(isArray(ids)){
var id = unique(ids),len = unique(ids).length;
for(j=len-1; j>=0; j--){
node = tree.getNode(id[j]);
insertNode(url, node);
}
}else{
node = tree.getNode(ids);
insertNode(url, node);
}
};
/**--------------------------------------------------
* 添加，修改，删除操作后更新拓扑
* @param {url} 获取拓扑层信息的url
* @param {ids} id串 string | []
* @param {graph} graph对象，调用graph方法查找及更新拓扑
* -------------------------------------------------*/
global.updateTopologyStatus = function(url, ids, graph){
function checkNode(nodes){
var node, flag = false;
if(isArray(ids)){
var id = unique(ids),len = unique(ids).length;
for(j=len-1; j>=0; j--){
node = graph.getNode(id[j]);
if(node){
flag = true;
break;
}
}
}else{
node = graph.getNode(ids);
if(node){
flag = true;
}
}
return flag;
}
if(checkNode(ids)){
topology.getMsg(url, "post", {nodeId: getIdLevel().id, level: getIdLevel().level},
function(result){
if((typeof result.nodes != "undefined") && (result.edges.length >0) ){
clearTopology();
initTopology("topoContent", result, false);
}
});
}
};
/**------------------------------
* 升级成功更新拓扑
* @param {url} 获取拓扑层信息的url
* @param {ips} array []
* @param {graph} graph对象，
* 调用graph方法查找及更新拓扑
* ----------------------------*/
global.updateTopologyByUpgrade = function(url, ips, graph){
var len = ips.length, node;
if(len > 0){
for(var k = len -1 ; k >= 0; k--){
node = graph.getNodeByIp(ips[k]);
if(node){
topology.getMsg(url, "post", {nodeId: getIdLevel().id, level: getIdLevel().level},
function(result){
if((typeof result.nodes != "undefined") && (result.edges.length >0) ){
clearTopology();
initTopology("topoContent", result, false);
}
});
}
}
}
};
})(window);
/************************
* socket 推送
***********************/
;(function(){
/*********************************
* 更新拓扑节点
* 更新运行图列车
********************************/
var wsCapDeviceOnlineOffline = null,
wsCapDeviceOnlineOfflineOpen = false,
supFlag = false,
capDeviceOnlineOfflineTarget = getWebsocketPath() + "/capDevicWebsocket";
if(!supFlag && wsCapDeviceOnlineOffline == null){
if('WebSocket' in window){
wsCapDeviceOnlineOffline = new WebSocket(capDeviceOnlineOfflineTarget);
}else if('MozWebSocket' in window){
wsCapDeviceOnlineOffline = new MozWebSocket(capDeviceOnlineOfflineTarget);
}else{
//console.log('浏览器不能接收服务器推送消息,无法自动显示设备状态更新,可以手动刷新页面. 推荐使用IE11,Chrome,Firefox浏览器');
supFlag = true;
return ;
}
//成功建立连接
wsCapDeviceOnlineOffline.onopen = function(){
//console.log("Connect successful !");
};
//连接失败
wsCapDeviceOnlineOffline.onerror = function(err){
console.log(err);
};
//创建websocket同时,接收服务器发给客服端的消息
wsCapDeviceOnlineOffline.onmessage = function(msg){
var tNodes = JSON.parse(msg.data);
/*更新拓扑节点*/
if(typeof tNodes != "undefined" && tNodes[0] && tNodes[1].length > 0){
updateNodeStatus(tNodes, graph);
}
};
}
/*********************************
* 通用websocket通知
********************************/
var commonSocket = null,
commomSocketURL = getWebsocketPath() + "/commonWebsocket";
if(commonSocket == null){
if('WebSocket' in window){
commonSocket = new WebSocket(commomSocketURL);
}else if('MozWebSocket' in window){
commonSocket = new MozWebSocket(commomSocketURL);
}else{
//console.log('浏览器不能接收服务器推送消息,无法自动显示设备状态更新,可以手动刷新页面. 推荐使用IE11,Chrome,Firefox浏览器');
return ;
}
//成功建立连接
commonSocket.onopen = function(){
//console.log("Connect successful !");
};
//连接失败
commonSocket.onerror = function(err){
console.log(err);
};
//创建websocket同时,接收服务器发给客服端的消息
commonSocket.onmessage = function(msg){
var info = JSON.parse(msg.data);
//console.log(info);
/**添加，修改，删除后更新树*/
if( (typeof trees != "undefined") && info){
updateTreeStatus(getTreeNode, info.parentId, trees);
}
/**添加，修改，删除后更新拓扑图*/
if(typeof graph != "undefined" && info){
updateTopologyStatus(getTopologyNode, info.parentId, graph);
}
};
}
/*************************************
* 告警更新
* 告警拓扑edu，ebu状态更新
* 运行图设备状态更新
* ebu升级反馈信息
************************************/
var wsCapDefault = null,
wsCapDefaultOpened = false,
// 打开管道 ,ws://localhost:8080/项目名/@ServerEndpoint名字
wsCapDefaultTarget = getWebsocketPath() + "/capFaultWebsocket";
openCapDefaultWebsocket = function(){
if(wsCapDefault == null){
if('WebSocket' in window){
wsCapDefault = new WebSocket(wsCapDefaultTarget);
}else if('MozWebSocket' in window){
wsCapDefault = new MozWebSocket(wsCapDefaultTarget);
}else{
supFlag = true;
return ;
}
//成功建立连接
wsCapDefault.onopen = function(){
console.log("wsCapDefaultConnect successful !");
};
//连接失败等
wsCapDefault.onerror = function(err){
//console.log(err);
};
wsCapDefault.onmessage = function(msg){
//console.log(msg);
//创建websocket同时,接收服务器发给客服端的消息
if(msg.data != null || msg.data != undefined){
var capMsg = JSON.parse(msg.data),
width = document.querySelector(".diagram").offsetWidth;
//console.log(capMsg);
/*告警更新*/
if(typeof scrollAlarm != 'undefined'){
if(typeof capMsg.alarmList != "undefined"){
scrollAlarm.latestAlarm(capMsg.alarmList);
}
}
/*告警拓扑edu，ebu状态更新*/
if(typeof graph != 'undefined' && capMsg.topologyDeviceState){
for(var j = capMsg.topologyDeviceState.length - 1;j>=0;j--){
updateStatus(capMsg.topologyDeviceState[j], graph);
}
}
/*全网统计*/
if(typeof capMsg.ebu != "undefined"){
// ebu状态统计
var ebu = capMsg.ebu;
$('#ebuState').highcharts({
chart: {
type: 'bar',
backgroundColor: '#000',
height: 70,
width: width,
marginTop:20
},
colors: ['#ff0909', '#64ed11', '#808080'],
title: {
text: '中心接入设备：'+ebu.total+'台',
floating: true,
align: 'left',
x:60,
style: {
color: '#fff',
fontSize:'12'
}
},
tooltip: {
formatter: function () {
return this.x + this.series.name +
':' + this.y;
}
},
xAxis: {
categories: ['EBU'],
lineWidth: 0,
tickLength: 0,
},
yAxis: {
title:'',
labels: {
enabled: false
},
gridLineWidth:0,
},
legend: {
enabled:false
},
credits:{
enabled:false
},
plotOptions: {
series: {
stacking: 'normal',
animation:false
}
},
series: [{
name: '故障',
data: [parseInt(ebu.faultNumber)]
}, {
name: '在线',
data: [parseInt(ebu.onlineNumber)]
}, {
name: '离线',
data: [parseInt(ebu.offlineNumber)]
}]
});
// eau状态统计
var eau = capMsg.eau;
if(eau){
$('#eauState').highcharts({
chart: {
type: 'bar',
backgroundColor: '#000',
height: 70,
width: width,
marginTop:20
},
colors: ['#ff0909', '#64ed11', '#808080'],
title: {
text: '终端接入设备：'+eau.total+'台',
floating: true,
align: 'left',
x:60,
style: {
color: '#fff',
fontSize:'12'
}
},
tooltip: {
formatter: function () {
return this.x + this.series.name +':' + this.y;
}
},
xAxis: {
categories: ['EAU'],
lineWidth: 0,
tickLength: 0,
},
yAxis: {
title:'',
labels: {
enabled: false
},
gridLineWidth:0,
},
legend: {
enabled:false
},
credits:{
enabled:false
},
plotOptions: {
series: {
stacking: 'normal',
animation:false
}
},
series: [{
name: '故障',
data: [parseInt(eau.faultNumber)]
}, {
name: '在线',
data: [parseInt(eau.onlineNumber)]
}, {
name: '离线',
data: [parseInt(eau.offlineNumber)]
}]
});
}
}
/*ebu升级反馈信息*/
if(capMsg.upgradeMsg){
if(capMsg.upgradeMsg.isFinished){
/*升级中*/
if(capMsg.upgradeMsg.isFinished == 0){
var getUpgradeMsg = rootPath + '/device/upgrade/getUpgradeData.do';
if(typeof upgradeEbu != "undefined"){
$ajax(getUpgradeMsg, "get", {}, function(info){
upgradeEbu.init(info.capDeviceUpgradeList);
/**升级成功更新拓扑*/
var ips = getSuccessDeviceIps(info.capDeviceUpgradeList);
updateTopologyByUpgrade(getTopologyNode, ips, graph);
});
}
/*升级完成*/
}else if(capMsg.upgradeMsg.isFinished == 1){
if(typeof upgradeEbu != "undefined"){
upgradeEbu.displayTip(capMsg.upgradeMsg.msg, layer);
}
var node = graph.getNode(getIdLevel().id);
if(node){
topology.getMsg(getTopologyNode, "post", {nodeId: getIdLevel().id,level: getIdLevel().level},
function(result){
if(result.edges.length >0 && result.nodes){
clearTopology();
initTopology("topoContent", result, false);
}
});
}
}
}
}
}
};
}else{
//console.log("浏览器不支持！");
return;
}
};
openCapDefaultWebsocket();//开启设备告警的websocket监控
})();
/****************************************
* 拓扑
* 树导航
***************************************/
;(function(global){
/*设置节点Id及节点level*/
global.setIdLevel = function setIdLevel(nodeId, level){
document.getElementById("topologyLevel").querySelector(".topoId").value = nodeId;
document.getElementById("topologyLevel").querySelector(".topoLevel").value = level;
};
/*获取节点Id及节点level*/
global.getIdLevel = function getIdLevel(){
var id = document.getElementById("topologyLevel").querySelector(".topoId").value.trim(),
level = document.getElementById("topologyLevel").querySelector(".topoLevel").value.trim();
return {id:id,level:level};
};
/*清空拓扑容器*/
global.clearTopology = function clearTopology(){
var topoContent = document.getElementById("topoContent");
topoContent.removeChild(topoContent.childNodes[0]);
/*
* 进入全屏及退出全屏时，有时会查找不到svg
*/
};
/*视图切换*/
function setViewClass(){
var spans = document.querySelector(".devViewHeader").getElementsByTagName("span");
for(var j=spans.length-1;j>=0;j--){
if(spans[j].innerHTML === "拓扑图"){
spans[j].className = "active";
}else{
spans[j].className = "";
}
}
}
/*打印*/
function printfTopology(newstr,cb){
/* var index = layer.confirm('是否打印拓扑图?', {
title:['系统信息'],
icon:0,
btn: ['确定','取消']
}, function(){
var pop = window.open();
pop.document.write(newstr);
pop.window.print();
if(cb) cb(pop,index);
}); */
if(window.confirm("是否打印拓扑图?")){
var pop = window.open();
pop.document.write(newstr);
pop.window.print();
if(cb) cb(pop);
}
}
/*保存图片*/
var exportPng = function(url){
var exportform = document.getElementById("_exportform");
if(!exportform){
exportform = document.createElement("form");
exportform.id="_exportform";
exportform.style.display = "none";
exportform.method = "post";
exportform.action = url;//url
exportform.target = "";
exportform.innerHTML = "";
document.body.appendChild(exportform);
}
navigator.userAgent.indexOf("MSIE 9.0")> 0 && document.getElementById("topoContent").childNodes[0].removeAttribute("xmlns") ;
document.getElementById("_exportsvg").value = document.getElementById("topoContent").innerHTML;
exportform.submit();
};
/*获得告警级别对应颜色值*/
function getLevelColor(state){
switch(state){
case 0 : return ('#64ed11');
case 1 : return ('#808080');
case 2 : return ('#eaea06');
case 3 : return ('#ff7f00');
case 4 : return ('#ff0909');
default: return ('#64ed11');
}
}
/*设置选中项背景颜色*/
function setSelectBg(trees, node){
var selects = trees.ulElement.querySelectorAll(".node_selected");
for(var j=0,n=selects.length;j 0){
var data = {nodeId:node.nodeId,level:node.treeNode.level};
topology.getMsg(getTopologyNode, "post", data, function(result){
if(result && result.edges.length >0 && result.nodes){
clearTopology();
initTopology("topoContent", result, fullFlag);
}else{
if(!result || (result.edges.length == 0)){
prompted.msg("已是最底层！", "#topologyView");
}
}
setIdLevel(node.nodeId, node.treeNode.level);
});
}else{
var data = {nodeId:node.treeNode.parentId, level:node.treeNode.level};
topology.getMsg(getTopologyNode, "post", data, function(result){
if(!result || (result.edges.length == 0)){
prompted.msg("已是最顶层！", "#topologyView");
}else if(result.edges.length >0 && result.nodes){
clearTopology();
initTopology("topoContent", result, fullFlag);
}
setIdLevel(node.treeNode.parentId, node.treeNode.level);
});
}
}
},
/*拓扑节点右键弹出菜单*/
onnodecontextmenu:function(e,node){
clearTimeout(this.timeid);
topology.getfeture(e, node, ".fetureContent", node, false);
topology.disContex(e, node, layer, graph);
//console.log(node);
},
onnodesmousedown:function(e,node){
clearTimeout(this.timeid);
topology.getfeture(e, node, ".fetureContent", node, false);
},
/*鼠标经过拓扑节点获得对应的节点信息*/
onnodemouseover:function(e, node){
var getEbuFetureUrl = rootPath + '/web/charts/chartsController/getEbutopologyInfo.do';
var getEduFetureUrl = rootPath + '/web/charts/chartsController/getEdutopologyInfo.do';
var getRouterNumberUrl = rootPath + '/web/charts/chartsController/getRouterNumber.do';
if(node.treeNode.nodeType === "ebu"){
this.timeid = setTimeout(function(){
$ajax(getRouterNumberUrl,"get",{ebuId:node.nodeId},function(info){
node.routerNumber = info.routerNumber;
topology.getfeture(e,node,".fetureContent",node,true);
});
},1200);
}
// else if(node.treeNode.nodeType === "edu"){
// this.timeid = setTimeout(function(){
// $ajax(getEduFetureUrl,"get",{eduId:node.nodeId},function(info){
// //topology.getfeture(e,node,".fetureContent",info.ebuTopologyInfo,true);
// topology.getfeture(e,node,".fetureContent",info.eduTopologyInfo,true);
// });
// },1200);
// }
// this.timeid = setTimeout(function(){
// topology.getfeture(e, node, ".fetureContent", node, true);
// },1200);
},
/*鼠标离开拓扑节点，关闭信息窗*/
onnodemouseout:function(e,node){
clearTimeout(this.timeid);
topology.getfeture(e, node, ".fetureContent", node, false);
}
});
/*加载拓扑数据*/
graph.loadData(data);
/*拓扑刷新*/
document.querySelector(".topo-update").onclick = function(){
if(typeof fullFlag === "undefined" || !fullFlag){
var data = {
nodeId: getIdLevel().id,
level: getIdLevel().level
};
topology.getMsg(getTopologyNode, "post", data, function(result){
if(result.edges.length >0 && result.nodes){
clearTopology();
initTopology("topoContent", result, fullFlag);
prompted.msg("刷新成功！", "#topologyView");
}
});
}else{
clearTopology();
getAllTopologyNode(fullFlag);
prompted.msg("刷新成功！", "#topologyView");
}
};
/*拓扑图放大*/
document.querySelector(".topo-zoomIn").onclick = function(){
graph.setZoomIn(graph.getZoom()*1.1);
};
/*拓扑图缩小*/
document.querySelector(".topo-zoomOut").onclick = function(){
graph.setZoomOut(graph.getZoom()*0.9);
};
/*还原拓扑布局*/
document.querySelector(".topo-reset").onclick = function(){
// var nodeId = getIdLevel().id;
// graph.reset();
// graph.loadData(data);
graph.relayout();
//graph.center(nodeId);
};
/*打印*/
/* document.querySelector(".topo-print").onclick = function(){
printfTopology(graph.getInner(),function(pop){
pop.close();
});
}; */
/*保存拓为图片*/
document.querySelector(".topo-save").onclick = function(){
exportPng(saveTopologyPic);
};
/*保存拓扑图布局结构 */
document.querySelector(".save-point").onclick = function(){
var nodeId = getIdLevel().id;
var saveTopoUrl = saveTopologyPoint + '?topNodeId=' + nodeId;
nodeType = graph.getNode(nodeId).treeNode.nodeType;
var data = {points:graph.getCoordinates()};
if(typeof fullClick === "undefined" || !fullClick){
$.ajax({
type:'POST',
url:saveTopoUrl,
dataType:'json',
contentType:'application/json',
data:JSON.stringify(graph.getCoordinates()),
success:function(result){
prompted.msg(result.msg, "#topologyView");
}
});
}else{
prompted.msg("暂不支持保存全网拓扑。","#topologyView");
}
};
};
/*更新选中状态*/
global.updateSelectNode = function(oNodeId, nNodeId, obj){
var tNode = graph.getNode(oNodeId);
if(tNode){
tNode.treeNode.img = getImagePath(tNode.treeNode.nodeType,tNode.state);
obj.updateNode(oNodeId);
}
var nNode = graph.getNode(getNodeId(nNodeId));
if(nNode){
nNode.treeNode.img = getSelectNode(nNode);
}
obj.updateNode(getNodeId(nNodeId));
};
/*更新拓扑节点状态*/
global.updateNodeStatus = function(node, obj){
function checkNode(nodes){
var node, flag = false;
for(j=0, n=nodes[1].length; j0 && result.nodes){
clearTopology();
initTopology("topoContent", result, false);
}
});
}
};
//告警推送更新拓扑节点状态
global.updateStatus = function (node, obj){
var nNode = obj.getNode(node.deviceId),edge = obj.getNodeEdges(node.deviceId);
if(nNode && edge){
nNode.treeNode.img = getImagePath(node.deviceType, node.alarmLevel);
edge[0].label = ((node.alarmLevel == 1)?'x':'');
edge[0].arrowStyle.stroke = ((node.alarmLevel == 1)?getLevelColor(1):getLevelColor(0));
edge[0].arrowStyle.fill = edge[0].arrowStyle.stroke;
obj.updateNode(node.deviceId);
}
};
/*左树图标的路径*/
var imgPath = rootPath + '/js/modules/atree/icons';
/*初始化树*/
global.trees = createTree("atrees", imgPath, "#0d0d0d", null);
$ajax(getTreeNode, "get", {}, function(result){
mTree.initNodes(result, trees, imgPath);
trees.drawTree();
});
/*拓扑退出全屏处理*/
function fullScreenTopology(graph,fullFlag){
var fullTopoParam = {
nodeId: getIdLevel().id,
level: getIdLevel().level
};
$ajax(getTopologyNode, "get", fullTopoParam, function(result){
initTopology("topoContent", result, fullFlag);
});
}
/*拓扑进入全屏*/
function getAllTopologyNode(fullFlag){
$ajax(getTopologyAllNode, "get", {}, function(nodes){ //节点拓扑
//console.log(nodes);
initTopology("topoContent", nodes, fullFlag);
});
}
fullScreenCtl("topologyView",document.querySelector(".screen-button"),
function(){
fullSize("#topologyView", "#topoContent", true);
document.querySelector(".screen-button").title = "退出全屏";
document.querySelector(".screen-button").innerHTML = '
';
fullClick = false;
clearTopology();
fullScreenTopology(graph, fullClick);
//getAllTopologyNode(fullClick);
},function(){
smallSize("#topologyView", "#topoContent", true);
document.querySelector(".screen-button").title = "全屏";
document.querySelector(".screen-button").innerHTML = '
';
fullClick = false;
clearTopology();
fullScreenTopology(graph, fullClick);
});
/*树点击+获取对应树的节点信息*/
trees.nodeAfterOpenEvent = function(node) {
var key = cookie.get("search");
if(!key || key[0] !== "key"){
var data = {nodeId:getNodeId(node.id),level:node.level};
mTree.getNodes(getTreeNode, "get", data, function(result){
node.removeChildNodes();
mTree.insertNodes(result[0].childNode, node);
});
}
};
/*树节点点击获得对应的拓扑结构信息*/
trees.selectNode = function(node){
setSelectBg(trees, node);
/*非拓扑视图下，点击树导航切换到拓扑视图*/
var span = document.querySelector(".devViewHeader").querySelector(".active");
if(span.innerHTML === "GIS图"){
setViewClass();
document.getElementById("gisMap").style.cssText = "z-index:-1";
document.getElementById("topologyView").style.cssText = "z-index:2";
}
var nodeId = cookie.get("nodeId"),ebuClick = cookie.get("ebuClick");
var data = {nodeId:getNodeId(node.id),level:1};
topology.getMsg(getTopologyNode, "get", data, function(result){
if(result){
clearTopology();
initTopology("topoContent", result, false);
setIdLevel(getNodeId(node.id), data.level);
updateSelectNode(nodeId, getNodeId(node.id), graph);
cookie.set("nodeId", data.nodeId);
}
});
updateSelectNode(nodeId, getNodeId(node.id), graph);
cookie.set("nodeId", getNodeId(node.id));
var selects = trees.ulElement.querySelectorAll(".node_selected");
for(var j=0,n=selects.length;j
页面调用
/*----------------
*告警列表初始化
*---------------*/
var scrollAlarm = global.scrollAlarm = new ScrollAlarm("alarmContent");
var alarm = '{"alarmList":[{"alarmLevel":1,"alarmNumber":116,"alarmType":"EBU离线","areaName":"广东省广州市番禺区南亭村","ceateTime":1469699233000,"deviceId":"75c74d0764a24fb1aa0baa9839adcf9c","deviceName":"测试","deviceType":"EBU","id":"42d443f19674417db6d660854863e581","ipAddress":"192.168.8.250","isValid":1,"lastUpdateTime":1469756454000,"status":"未处理"},{"alarmLevel":1,"alarmNumber":38,"alarmType":"EBU离线","areaName":"广东省广州市天河区珠江新城","ceateTime":1469755516000,"deviceId":"2def55ec2ef44efc912d9ff6ff701e09","deviceName":"基站2","deviceType":"EBU","id":"8fce81d30c274ac787e8d09ae10cfb40","ipAddress":"172.16.34.98","isValid":1,"lastUpdateTime":1469756448000,"status":"未处理"}]}';
if(alarm){ //alarmList
alarm = JSON.parse(alarm);
scrollAlarm.latestAlarm(alarm.alarmList);
}
相关文章
图文推荐
- 文章
- 推荐
- 热门新闻