jay.chang/ibms-dome
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

[Frontend][系統監控] niagara 訂閱串接

Browse Source
This commit is contained in:
dev01 2022-11-23 15:38:52 +08:00
parent acd7906d2c
commit 2c248f485a
3 changed files with 109 additions and 68 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

76
Frontend/_sysElevator.html
View File

@ -8,8 +8,8 @@
}
table.elevator-build td {
padding: 0.2rem 0.5rem;
height: 40px;
width: 55px;
height: 50px;
width: 45px;
border: 1px solid #000;
}
elevator .elevator-body, elevator .elevator-header {
@ -27,9 +27,11 @@
</div>
<div class="elevator-body d-flex align-items-center justify-content-center h-100 yt-table-container">
<table id="floorTable" class="elevator-build m-auto">
<div id="floorTable_wrapper" class="elevator-build-container">
<table id="floorTable" class="elevator-build m-auto">
</table>
</div>
</table>
</div>
</div>
<!--<div>
@ -892,15 +894,24 @@
for (let e = 1; e <= eleCnt + 2; e++) {
let td = creEle("td");
if (e == 1) {
td.addClass("t-black")
td.text(rfloors[f - 1]);
} else if (e == eleCnt + 2) {
}
else {
let div = creDiv(["d-flex", "justify-content-center", "align-items-end","h-100"]);
div.append(`<i class="fas fa-door-open fs-1-05"></i>`)
td.append(div)
}
tr.append(td);
}
tbody.append(tr);
$("#floorTable_wrapper").append(eleCircle)
}
$("#floorTable").html(tbody);
$("#floorTable tbody tr").each((index, tr) => {
$(tr).find("td:eq(0)").css("border-left", "0");
@ -919,61 +930,4 @@
}
function initYTTable(element) {
let obj = { init: null, SetContainer: null, Ele: element || $(".yt-table") };
obj.init = function () {
this.SetContainer();
this.SetBorder();
this.SetEndCellRightBorderRemove();
this.SetEndCellBottomBorderRemove();
}
obj.SetContainer = function () {
$(this.Ele).each(function (index, value) {
if ($(value).parent(".yt-table-container").length != 0) {
$(value).unwrap(".yt-table-container");
}
let strHtml = $(`<div class="yt-table-container"></div>`);
$(value).wrap(strHtml);
$(value).parent(".yt-table-container").parent().addClass("table-div");
})
}
obj.SetBorder = function () {
console.log("123123", $(this.Ele))
$(`${$(this.Ele).selector}.th-td-br th,${$(this.Ele).selector}.th-td-br td`).css("border-right", "1px solid #adadad");
$(`${$(this.Ele).selector}.th-bd thead th`).css("border-bottom", "1px solid #adadad");
$(`${$(this.Ele).selector}.td-bd tbody td`).css("border-bottom", "1px solid #adadad");
}
obj.SetEndCellRightBorderRemove = function () {
let notBorder = 0;
$(`${$(this.Ele).selector} thead th:last-child,.yt-table tbody td:last-child`).each(function (index, value) {
if (index >= notBorder) {
$(value).css("border-right", "0px");
}
if ($(value).attr("rowspan")) {
let rowspan = parseInt($(value).attr("rowspan"));
notBorder = index + rowspan;
}
})
}
obj.SetEndCellBottomBorderRemove = function () {
$(`${$(this.Ele).selector} tr:last-child td`).each(function (index, value) {
$(value).css("border-bottom", "0px");
})
$(`${$(this.Ele).selector} tr td[rowspan]`).each(function (index, value) {
let tr = $(value).closest("tr");
let oriTrInd = $(tr).index();
let lastTrInd = $(tr).parent("tbody").find("tr:last-child").index();
if (lastTrInd - oriTrInd == $(value).prop("rowspan") - 1) {
$(value).css("border-bottom", "0px");
}
})
}
obj.init();
}
</script>

98
Frontend/_sysMonAll.html
View File

@ -46,12 +46,43 @@
<script>
var allDevList = [];
$(function () {
getFloDevList();
setLightColor();
initSub();
})
function initSub() {
myBaja = new subscriptionDevices();
var ordPath = {
"building_tag": pageAct.buiTag,
"system_tag": pageAct.sysMainTag,
"name_tag": pageAct.sysSubTag,
}
myBaja.setSubscribeDevicesByBql(ordPath);
myBaja.setSubscribeDevicesCallBack(function (data) {
let matchDevice = allDevList.filter(x => x.device_number.split("_")[x.device_number.split("_").length - 1] == data.device_number)[0];
let norDevPoiName = matchDevice.device_normal_point_name;
let cloDevPoiName = matchDevice.device_close_point_name;
let errDevPoiName = matchDevice.device_error_point_name;
if (data.point_name == norDevPoiName && data.value == matchDevice.device_normal_point_value) {
//顯示正常燈號
$(`#${matchDevice.device_number}_status`).attr("data-light-type", "normal").data("light-type", "normal");
} else if (data.point_name == cloDevPoiName && data.value == matchDevice.device_close_point_value) {
$(`#${matchDevice.device_number}_status`).attr("data-light-type", "close").data("light-type", "close");
} else if (data.point_name == errDevPoiName && data.value == matchDevice.device_error_point_value) {
$(`#${matchDevice.device_number}_status`).attr("data-light-type", "error").data("light-type", "error");
}
setLightColor();
});
}
//function loadStaLight() {
// if (pageAct.sysSubObj.device_normal_color) {
// $("#sysNorLight").css("background-color", pageAct.sysSubObj.device_normal_color);
@ -108,7 +139,7 @@
$.each(floObj.device_list, (index2, devObj) => {
console.log(">>>> url: " + baseImgUrl + " , img: " + varPathImg + ", icon: " + devObj.device_master_icon);
allDevList.push(devObj);
strHtml += `<div class="card m-1 border device-wrap" style="width:300px">
<div class="card-body p-2">
<div class="d-flex mb-2">
@ -120,7 +151,7 @@
</div>
</div>
<div class="d-flex mb-0 mt-2 align-items-center">
<span id="${devObj.device_number}_status" class="circle-light" data-light-type="normal"></span>
<span id="${devObj.device_number}_status" class="circle-light"></span>
<span class="d-none">即時功率：</span>
<a href="javascript:;" name="devItem" data-id="${devObj.device_guid}" data-number="${devObj.device_number}" data-name="${devObj.full_name}" class=" ml-2 mb-0 ">詳細資料</a>
</div>
@ -195,7 +226,10 @@
let devName = $(ele).data("name"); //full_name
$(ele).YTTooltip({
html: `<div class="card m-1 border device-wrap">
<div class="card-header p-3">
<div class="col-12 p-0 row justify-content-end m-0">
<button class="btn p-2"><i class="fas fa-times fs-1 text-white-50" data-close="yttooltip"></i></button>
</div>
<div class="card-header p-2 px-3">
<div class="position-absolute w-50" style="word-break: break-all;">
<label class="m-0 mt-2">${devName}</label>
@ -205,7 +239,6 @@
<button type="button" id="info-tab" class="btn btn-icon nav-link" role="tab" data-tabname="cardTab" data-target="#info"><i class="fa fa-cog icon"></i></button>
<button type="button" id="errRec-tab" class="btn btn-icon nav-link" role="tab" data-tabname="cardTab" data-target="#errRec"><i class="fas fa-exclamation-triangle"></i></button>
<button type="button" id="opeRec-tab" class="btn btn-icon nav-link" role="tab" data-tabname="cardTab" data-target="#opeRec"><i class="fa fa-bars icon"></i></button>
<button class="btn p-2"><i class="fas fa-times fs-1 text-white-50" data-close="yttooltip"></i></button>
</div>
</div>
<div class="card-body p-2 tab-content">
@ -234,7 +267,8 @@
$("#info").html(drawInfoTabBlo(devGuid));
loadOpeRecTable(devGuid);
//loadErrRecTable2($(oriEle).data("number"));
loadErrRecTable();
//loadErrRecTable();
loadErr($(oriEle).data("number"));
}
})
})
@ -328,6 +362,58 @@
errRecTable = new YourTeam.JqDataTables.getTableByStatic(tag, datas, columns, column_defs, null, null, null, null, "tpi");
}
function loadErr(allPath) {
if (allPath != undefined && allPath != null) {
let _pathArr = allPath.split("_");//TPE_B1_ELEV_EL_R2F_NA_ELEV1_N1
let _devicePath = _pathArr[0] + "_" + _pathArr[1] + "_" + _pathArr[2] + "_" + _pathArr[3] + "_" + _pathArr[4] + "_" + _pathArr[5];
getOneDeviceAlarmTop10ByBaja(_devicePath, callbackForErr);
}
else {
console.log("no device");
}
}
function callbackForErr(result) {
let tag = "#errRecTable";
let datas;
let column_defs = [
{ "targets": [0], "width": "15%", "sortable": true },
{ "targets": [1], "width": "25%", "sortable": true },
{ "targets": [2], "width": "25%", "sortable": true },
{ "targets": [3], "width": "35%", "sortable": true },
];
let columns = [
{
"title": "異常ID",
"data": "uuid",
},
{
"title": "異常原因",
"data": "msgText",
},
{
"title": "ACK確認",
"data": "ackState",
},
{
"title": "發生/完成時間",
"data": "normalTime",
"render": function (data, type, row) {
return row.timestamp + "<br>" + data;
},
},
];
let json_object = JSON.parse(result);
datas = json_object['data'];
errRecTable = new YourTeam.JqDataTables.getTableByStatic(tag, datas, columns, column_defs, null, null, null, null, "tpi");
}
//function loadErrRecTable2(allPath) {
// if (allPath != undefined && allPath != null) {
// let _pathArr = allPath.split("_");//TPE_B1_ELEV_EL_R2F_NA_ELEV1_N1

1
Frontend/index.html
View File

@ -2459,6 +2459,7 @@ License: You must have a valid license purchased only from wrapbootstrap.com (li
};
});
</script>
<script src="js/n4js/bajatest.js"></script>
<script src="js/bajascript/require.config.js"></script>
<script src="js/FileSaver.js"></script>