486 lines
12 KiB
JavaScript
486 lines
12 KiB
JavaScript
|
|
$.i18n();
|
||
|
|
|
||
|
|
function getDevTree() {
|
||
|
|
$.ajax({
|
||
|
|
url: "/ems/monitorBusiness/queryAlarmTreeMs",
|
||
|
|
type: "get",
|
||
|
|
data: {},
|
||
|
|
dataType: "json",
|
||
|
|
success: function(res) {
|
||
|
|
initTree(res.rows);
|
||
|
|
}
|
||
|
|
});
|
||
|
|
}
|
||
|
|
|
||
|
|
function getColor() {
|
||
|
|
$.ajax({
|
||
|
|
url: "/ems/monitorBusiness/findAlarmcolor",
|
||
|
|
type: "post",
|
||
|
|
dataType: "json",
|
||
|
|
async:false,
|
||
|
|
success: function(res) {
|
||
|
|
window.colorList = {};
|
||
|
|
window.colorIds = [];
|
||
|
|
for (var i = 0, str = ""; i < res.length; i++) {
|
||
|
|
var o = res[i];
|
||
|
|
str +=
|
||
|
|
'<dd data-id="' +
|
||
|
|
o.id +
|
||
|
|
'" data-name="' +
|
||
|
|
o.name +
|
||
|
|
'">' +
|
||
|
|
o.name +
|
||
|
|
'</dd><dt class="color" style="background-color:#' +
|
||
|
|
o.color +
|
||
|
|
'"></dt><br>';
|
||
|
|
window.colorList[o.name] = o.color;
|
||
|
|
window.colorIds.push(o.id);
|
||
|
|
}
|
||
|
|
|
||
|
|
}
|
||
|
|
});
|
||
|
|
}
|
||
|
|
$(function() {
|
||
|
|
getColor();
|
||
|
|
// getDevTree();
|
||
|
|
var cols = [
|
||
|
|
{
|
||
|
|
key: "3",
|
||
|
|
name: $("input:hidden[name=h-timeStamp]"),
|
||
|
|
sortId: "timeStamp",
|
||
|
|
sort: "asc",
|
||
|
|
fn: "event",
|
||
|
|
prop: "timeStamp"
|
||
|
|
},
|
||
|
|
{
|
||
|
|
key: "7",
|
||
|
|
name: $("input:hidden[name=h-priority]"),
|
||
|
|
sortId: "priority",
|
||
|
|
sort: "",
|
||
|
|
fn: "event",
|
||
|
|
prop: "priority"
|
||
|
|
},
|
||
|
|
{
|
||
|
|
key: "5",
|
||
|
|
name: $("input:hidden[name=h-location]"),
|
||
|
|
sortId: "location",
|
||
|
|
sort: "",
|
||
|
|
fn: "event",
|
||
|
|
prop: "location"
|
||
|
|
},
|
||
|
|
{
|
||
|
|
key: "8",
|
||
|
|
name: $("input:hidden[name=h-almType]"),
|
||
|
|
sortId: "almType",
|
||
|
|
sort: "",
|
||
|
|
fn: "event",
|
||
|
|
prop: "almType"
|
||
|
|
},
|
||
|
|
// {
|
||
|
|
// key: '2',
|
||
|
|
// name: $('input:hidden[name=h-almStatus]'),
|
||
|
|
// sortId: 'almStatus',
|
||
|
|
// sort: '',
|
||
|
|
// fn:'event',
|
||
|
|
// prop:'almStatus'
|
||
|
|
// },
|
||
|
|
{
|
||
|
|
key: "content",
|
||
|
|
name: $("input:hidden[name=h-content]"),
|
||
|
|
sort: false,
|
||
|
|
fn: "alarm",
|
||
|
|
prop: "content"
|
||
|
|
}
|
||
|
|
];
|
||
|
|
window.alarm = initSocket({
|
||
|
|
url: "historyEvent",
|
||
|
|
success: function(res) {
|
||
|
|
$("#table").css("counter-reset", "c " + (res.pageNo - 1) * res.pageSize);
|
||
|
|
if (res.data) {
|
||
|
|
for (var i = 0, str = ""; i < res.data.length; i++) {
|
||
|
|
var d = res.data[i];
|
||
|
|
var vals = cols.reduce(function(o, v, i) {
|
||
|
|
var str = "";
|
||
|
|
if (v.key == 3) {
|
||
|
|
str = dayjs(d.other[v.key]).format("YYYY-MM-DD HH:mm:ss");
|
||
|
|
} else if (v.key == "content") {
|
||
|
|
str = d[v.key];
|
||
|
|
} else {
|
||
|
|
str = d.other[v.key];
|
||
|
|
}
|
||
|
|
o.push(str);
|
||
|
|
return o;
|
||
|
|
}, []);
|
||
|
|
str += "<tr><td></td><td>" + vals.join("</td><td>") + "</td></tr>";
|
||
|
|
}
|
||
|
|
}
|
||
|
|
if (!str) {
|
||
|
|
$("#table tbody tr td").text("");
|
||
|
|
} else {
|
||
|
|
$("#table tbody").html(str);
|
||
|
|
}
|
||
|
|
$("#page").initPage(
|
||
|
|
{
|
||
|
|
resKey: {
|
||
|
|
pageSize: "pageSize",
|
||
|
|
curPage: "page",
|
||
|
|
sumPage: "records"
|
||
|
|
},
|
||
|
|
pageSize: res.pageSize,
|
||
|
|
curPage: res.pageNo,
|
||
|
|
total: res.total
|
||
|
|
},
|
||
|
|
function(opt) {
|
||
|
|
alarm.open(opt);
|
||
|
|
}
|
||
|
|
);
|
||
|
|
setTimeout(function() {
|
||
|
|
$(".page-loading").hide();
|
||
|
|
}, 500);
|
||
|
|
},
|
||
|
|
open: function(opt) {
|
||
|
|
if (localStorage) {
|
||
|
|
var pageSize = localStorage.getItem("alarmPageSize");
|
||
|
|
}
|
||
|
|
if (!pageSize) {
|
||
|
|
pageSize = 100;
|
||
|
|
}
|
||
|
|
var priority;
|
||
|
|
if (window.colorIds && window.colorIds.length > 0) {
|
||
|
|
priority = window.colorIds.join(";");
|
||
|
|
} else {
|
||
|
|
priority = "1;2;3;4;5";
|
||
|
|
}
|
||
|
|
var param = {
|
||
|
|
orderType: "timeStamp",
|
||
|
|
sequence: "asc",
|
||
|
|
pageNo: opt.curPage || 1,
|
||
|
|
pageSize: pageSize,
|
||
|
|
content: "",
|
||
|
|
priority: priority,
|
||
|
|
startTime: "",
|
||
|
|
endTime: "",
|
||
|
|
location: "",
|
||
|
|
regionId: "",
|
||
|
|
devType: "",
|
||
|
|
type: "",
|
||
|
|
almStatus: "",
|
||
|
|
devGroup: ""
|
||
|
|
};
|
||
|
|
//设备组
|
||
|
|
var treeObj = $.fn.zTree.getZTreeObj("devtree");
|
||
|
|
if (treeObj) {
|
||
|
|
var nodes = treeObj.getCheckedNodes(true);
|
||
|
|
}
|
||
|
|
if (nodes && nodes.length > 0) {
|
||
|
|
param.devGroup = nodes.reduce(function(o, v, i) {
|
||
|
|
if (o) {
|
||
|
|
o += ";";
|
||
|
|
}
|
||
|
|
o += v.treeCode;
|
||
|
|
return o;
|
||
|
|
}, "");
|
||
|
|
}
|
||
|
|
//处理排序
|
||
|
|
var el = $("#table thead").find(".asc");
|
||
|
|
if (!el[0]) {
|
||
|
|
el = $("#table thead").find(".desc");
|
||
|
|
param.sequence = "desc";
|
||
|
|
} else {
|
||
|
|
param.sequence = "asc";
|
||
|
|
}
|
||
|
|
param.orderType = el.attr("sort-id");
|
||
|
|
//处理时间
|
||
|
|
if ($("input[name=time]").is(":checked")) {
|
||
|
|
var startTime = $("select[name=time-start]").val();
|
||
|
|
var endTime = $("select[name=time-end]").val();
|
||
|
|
if (start && end) {
|
||
|
|
param.startTime = dayjs(startTime).valueOf();
|
||
|
|
param.endTime = dayjs(endTime).valueOf();
|
||
|
|
}
|
||
|
|
}
|
||
|
|
//处理筛选
|
||
|
|
if ($("input[name=priority]").is(":checked")) {
|
||
|
|
param.priority = $("select[name=priority-item]")
|
||
|
|
.val()
|
||
|
|
.join(";");
|
||
|
|
}
|
||
|
|
if ($("input[name=location]").is(":checked")) {
|
||
|
|
param.location = $("select[name=location-item]")
|
||
|
|
.val()
|
||
|
|
.join(";");
|
||
|
|
}
|
||
|
|
if ($("input[name=region]").is(":checked")) {
|
||
|
|
param.regionId = $("select[name=region-item]")
|
||
|
|
.val()
|
||
|
|
.join(";");
|
||
|
|
}
|
||
|
|
if ($("input[name=typename]").is(":checked")) {
|
||
|
|
param.type = $("select[name=typename-item]")
|
||
|
|
.val()
|
||
|
|
.join(";");
|
||
|
|
}
|
||
|
|
if ($("input[name=devtype]").is(":checked")) {
|
||
|
|
param.devType = $("select[name=devtype-item]").val();
|
||
|
|
}
|
||
|
|
if ($("input[name=content]").is(":checked")) {
|
||
|
|
param.content = $("input[name=content-item]").val();
|
||
|
|
}
|
||
|
|
|
||
|
|
alarm.send(param);
|
||
|
|
}
|
||
|
|
});
|
||
|
|
//devGroup
|
||
|
|
|
||
|
|
var today = dayjs().startOf("day");
|
||
|
|
// query(1, cols);
|
||
|
|
getFilterData("", function(data) {
|
||
|
|
createHtml(data.alarmLevel, "select[name=priority-item]");
|
||
|
|
createHtml(data.location, "select[name=location-item]");
|
||
|
|
createHtml(data.regionInfo, "select[name=region-item]");
|
||
|
|
createHtml(data.alarmType, "select[name=typename-item]");
|
||
|
|
createHtml(data.subSystem, "select[name=subsystem-item]");
|
||
|
|
$("select[name=subsystem-item]").val(4);
|
||
|
|
});
|
||
|
|
getFilterData(4, function(data) {
|
||
|
|
createHtml(data.devType, "select[name=devtype-item]");
|
||
|
|
});
|
||
|
|
$(".Wdate").on("click", function() {
|
||
|
|
var option = {
|
||
|
|
el: this,
|
||
|
|
isShowClear: false,
|
||
|
|
firstDayOfWeek: 1,
|
||
|
|
dateFmt: "yyyy-MM-dd HH:mm",
|
||
|
|
onpicked: function() {}
|
||
|
|
};
|
||
|
|
WdatePicker(option);
|
||
|
|
});
|
||
|
|
$("#realtime").on("click", function() {
|
||
|
|
location.href = "/page/event.html";
|
||
|
|
});
|
||
|
|
$("#configsubmit").on("click", function() {
|
||
|
|
var pagezise = $("input[name=alarmeverypage]").val();
|
||
|
|
if (pagezise && localStorage) {
|
||
|
|
localStorage.setItem("alarmPageSize", pagezise);
|
||
|
|
}
|
||
|
|
var param = [];
|
||
|
|
$("#colorconfig .color").each(function(i, e) {
|
||
|
|
var id = $(e)
|
||
|
|
.prev("dd")
|
||
|
|
.attr("data-id");
|
||
|
|
var name = $(e)
|
||
|
|
.prev("dd")
|
||
|
|
.attr("data-name");
|
||
|
|
param.push({
|
||
|
|
id: id,
|
||
|
|
name: name,
|
||
|
|
color: colorList[name]
|
||
|
|
});
|
||
|
|
});
|
||
|
|
$.ajax({
|
||
|
|
contentType: "application/JSON; charset=UTF-8",
|
||
|
|
url: "/ems/monitorBusiness/insertColor",
|
||
|
|
data: JSON.stringify(param),
|
||
|
|
type: "post",
|
||
|
|
dataType: "json",
|
||
|
|
success: function(res) {
|
||
|
|
if ((res.reflag = "succ")) {
|
||
|
|
$("#configcancel").trigger("click");
|
||
|
|
} else {
|
||
|
|
alert(res.reflagInfo);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
});
|
||
|
|
});
|
||
|
|
$("#configcancel").on("click", function() {
|
||
|
|
$(".shadow").hide();
|
||
|
|
});
|
||
|
|
$("input[name=alarmeverypage]").on("blur", function() {
|
||
|
|
var v = $(this).val();
|
||
|
|
v = v > 2000 ? 2000 : Math.floor(v);
|
||
|
|
$(this).val(v);
|
||
|
|
});
|
||
|
|
//点击表头排序
|
||
|
|
$("#table").on("click", "th", function() {
|
||
|
|
if (!$(this).hasClass("sort")) {
|
||
|
|
return false;
|
||
|
|
}
|
||
|
|
var isAsc = $(this).hasClass("asc");
|
||
|
|
var isDesc = $(this).hasClass("desc");
|
||
|
|
if (isAsc || isDesc) {
|
||
|
|
$(this)
|
||
|
|
.removeClass(isAsc ? "asc" : "desc")
|
||
|
|
.addClass(!isAsc ? "asc" : "desc");
|
||
|
|
} else {
|
||
|
|
$("#table th")
|
||
|
|
.removeClass("asc")
|
||
|
|
.removeClass("desc");
|
||
|
|
$(this).addClass("asc");
|
||
|
|
}
|
||
|
|
alarm.open({
|
||
|
|
curPage: $(".page-btn.cur").html()
|
||
|
|
});
|
||
|
|
});
|
||
|
|
// $('#colorconfig').on('click','dt.color',function(){
|
||
|
|
// var el=this;
|
||
|
|
// var color=$(this).css('background-color')
|
||
|
|
// console.log(color);
|
||
|
|
// $(this).ColorPicker({
|
||
|
|
// flat: true,
|
||
|
|
// color: $(el).css('background-color'),
|
||
|
|
// onSubmit: function(hsb, hex, rgb) {
|
||
|
|
// console.log(333);
|
||
|
|
// $(el).css('background-color','rgb('+rgb.r+','+rgb.g+','+rgb.b+')');
|
||
|
|
// return false;
|
||
|
|
// }
|
||
|
|
// });
|
||
|
|
// })
|
||
|
|
$("#filter").on("click", function() {
|
||
|
|
$("#config_dialog").hide();
|
||
|
|
$("#filter_dialog").show();
|
||
|
|
$(".shadow").show();
|
||
|
|
});
|
||
|
|
$("#config").on("click", function() {
|
||
|
|
$("#filter_dialog").hide();
|
||
|
|
$("#config_dialog").show();
|
||
|
|
$(".shadow").show();
|
||
|
|
});
|
||
|
|
$("#query").on("click", function() {
|
||
|
|
alarm.open({
|
||
|
|
curPage: $(".page-btn.cur").html()
|
||
|
|
});
|
||
|
|
$(".shadow").hide();
|
||
|
|
});
|
||
|
|
$("#search").on("click", function() {
|
||
|
|
alarm.open({
|
||
|
|
curPage: $(".page-btn.cur").html()
|
||
|
|
});
|
||
|
|
});
|
||
|
|
$("#define").on("click", function() {
|
||
|
|
$(".shadow").hide();
|
||
|
|
});
|
||
|
|
$(".shadow>div").on("click", "p.close em", function() {
|
||
|
|
$(".shadow").hide();
|
||
|
|
});
|
||
|
|
//点击查询
|
||
|
|
crateTableHead(cols);
|
||
|
|
//筛选
|
||
|
|
$("#filter_dialog .content li label:first-child input:checkbox").on(
|
||
|
|
"click",
|
||
|
|
function() {
|
||
|
|
var ckd = $(this).is(":checked");
|
||
|
|
var parent = $(this).closest("li");
|
||
|
|
parent.toggleClass("dis");
|
||
|
|
if (ckd) {
|
||
|
|
parent.find("select").removeAttr("disabled");
|
||
|
|
parent.find("label:last-child input").removeAttr("disabled");
|
||
|
|
} else {
|
||
|
|
parent
|
||
|
|
.find("select")
|
||
|
|
.attr("disabled", true)
|
||
|
|
.val("");
|
||
|
|
parent.find("label:last-child input").attr("disabled", true);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
);
|
||
|
|
//全选
|
||
|
|
$("#filter_dialog .content li label:last-child input:checkbox").on(
|
||
|
|
"click",
|
||
|
|
function() {
|
||
|
|
var ckd = $(this).is(":checked");
|
||
|
|
var parent = $(this).closest("li");
|
||
|
|
if (
|
||
|
|
$(this)
|
||
|
|
.attr("name")
|
||
|
|
.indexOf("-all") == -1
|
||
|
|
) {
|
||
|
|
return false;
|
||
|
|
}
|
||
|
|
if (ckd) {
|
||
|
|
var values = [];
|
||
|
|
parent.find("select option").each(function(i, e) {
|
||
|
|
values.push($(e).attr("value"));
|
||
|
|
});
|
||
|
|
parent.find("select").val(values);
|
||
|
|
} else {
|
||
|
|
parent.find("select").val("");
|
||
|
|
}
|
||
|
|
}
|
||
|
|
);
|
||
|
|
});
|
||
|
|
|
||
|
|
function crateTableHead(cols) {
|
||
|
|
var head = cols.reduce(function(o, v, i) {
|
||
|
|
var cls = v.sort === false ? "" : "sort " + v.sort;
|
||
|
|
o +=
|
||
|
|
'<th class="' +
|
||
|
|
cls +
|
||
|
|
'" sort-id="' +
|
||
|
|
v.sortId +
|
||
|
|
'" data-i18n="' +
|
||
|
|
(v.fn + "." + v.prop) +
|
||
|
|
'">' +
|
||
|
|
v.name.val() +
|
||
|
|
"</th>";
|
||
|
|
return o;
|
||
|
|
}, "");
|
||
|
|
$("#table thead").html("<tr><th></th>" + head + "</tr>");
|
||
|
|
}
|
||
|
|
|
||
|
|
function getFilterData(id, fn) {
|
||
|
|
$.ajax({
|
||
|
|
url: "/ems/monitorBusiness/queryEventConditionMs",
|
||
|
|
type: "get",
|
||
|
|
data: {
|
||
|
|
type: isNaN(id) || id === "" || id === null ? 1 : 2,
|
||
|
|
id: id
|
||
|
|
},
|
||
|
|
dataType: "json",
|
||
|
|
success: function(res) {
|
||
|
|
if (typeof fn === "function") {
|
||
|
|
fn(res.mapData);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
});
|
||
|
|
}
|
||
|
|
|
||
|
|
function creatConfig(rows) {}
|
||
|
|
|
||
|
|
function createHtml(rows, selected) {
|
||
|
|
for (var i = 0, options = ""; i < rows.length; i++) {
|
||
|
|
options +=
|
||
|
|
'<option value="' + rows[i].id + '">' + rows[i].name + "</option>";
|
||
|
|
}
|
||
|
|
$(selected).html(options);
|
||
|
|
}
|
||
|
|
|
||
|
|
function initTree(data) {
|
||
|
|
var setting = {
|
||
|
|
data: {
|
||
|
|
simpleData: {
|
||
|
|
enable: true,
|
||
|
|
idKey: "treeCode",
|
||
|
|
pIdKey: "treePCode",
|
||
|
|
rootPId: ""
|
||
|
|
}
|
||
|
|
},
|
||
|
|
view: {
|
||
|
|
showLine: false,
|
||
|
|
expandSpeed: "fast",
|
||
|
|
showIcon: false
|
||
|
|
},
|
||
|
|
check: {
|
||
|
|
enable: true,
|
||
|
|
chkStyle: "checkbox"
|
||
|
|
},
|
||
|
|
callback: {
|
||
|
|
onCheck: function() {
|
||
|
|
console.log(arguments);
|
||
|
|
// alarm.open({curPage:$('.page-btn.cur').html()})
|
||
|
|
}
|
||
|
|
}
|
||
|
|
};
|
||
|
|
var zTreeObj = $.fn.zTree.init($("#devtree"), setting, data);
|
||
|
|
return zTreeObj;
|
||
|
|
}
|