[Frontend] [系統監控] 燈號後端資料串接 | 上方樓層topbar高度調窄

This commit is contained in:
dev01 2022-11-18 18:30:19 +08:00
parent c779fd32f3
commit d625ffb16a
5 changed files with 57 additions and 23 deletions

View File

@ -1,6 +1,6 @@
<style>
[id^=yt_tooltip] {
width: 600px;
width: 650px;
}
.circle-light {
@ -14,15 +14,15 @@
<div class="col-sm-12 col-xl-5">
<div class="d-flex mb-4" style="gap:15px">
<div class="row m-0 align-items-center">
<span class="circle-light bg-success mr-2"></span>
<span id="sysNorLight" class="circle-light mr-2"></span>
<label class="mb-0">正常</label>
</div>
<div class="row m-0 align-items-center">
<span class="circle-light bg-secondary mr-2"></span>
<span id="sysCloLight" class="circle-light mr-2"></span>
<label class="mb-0">關機</label>
</div>
<div class="row m-0 align-items-center">
<span class="circle-light bg-danger mr-2"></span>
<span id="sysErrLight" class="circle-light mr-2"></span>
<label class="mb-0">異常</label>
</div>
</div>
@ -49,8 +49,27 @@
$(function () {
getFloDevList();
loadStaLight();
})
function loadStaLight() {
if (pageAct.sysSubObj.device_normal_color) {
$("#sysNorLight").css("background-color", pageAct.sysSubObj.device_normal_color);
} else {
$("#sysNorLight").addClass("bg-success");
}
if (pageAct.sysSubObj.device_close_color) {
$("#sysCloLight").css("background-color", pageAct.sysSubObj.device_close_color);
} else {
$("#sysCloLight").addClass("bg-secondary");
}
if (pageAct.sysSubObj.device_error_color) {
$("#sysErrLight").css("background-color", pageAct.sysSubObj.device_error_color);
} else {
$("#sysErrLight").addClass("bg-danger");
}
}
function getFloDevList() {
let url = baseApiUrl + "/api/Device/GetDeviceList";
let sendData = {
@ -238,16 +257,17 @@
//getOneDeviceAlarmTop10ByBaja(_devicePath, callback);
let column_defs = [
{ "targets": [0], "width": "8%", "sortable": true },
{ "targets": [1], "width": "8%", "sortable": true },
{ "targets": [2], "width": "7%", "sortable": true },
{ "targets": [3], "width": "7%", "sortable": true },
{ "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": "異常原因",
@ -260,6 +280,7 @@
{
"title": "發生/賦歸時間",
"data": "timestamp",
"width": "45%",
},
];

View File

@ -1,12 +1,12 @@
<style>
[id^=yt_tooltip] {
width: 450px;
width: 650px;
}
</style>
<div class="container-fluid">
<div class="row bg-dark">
<h1 id="sysSubText" class="p-2 mx-5 mb-0"></h1>
<div class="btn-group my-2" id="floList">
<div class="row bg-dark align-items-center">
<label id="sysSubText" class=" mx-5 mb-0 fs-1-05"></label>
<div class="btn-group my-1" id="floList">
</div>
@ -47,9 +47,9 @@
if (!res || res.code != "0000" || !res.data) {
} else {
let strHtml = `<button name="floBtn" data-id="all" type="button" class="btn btn-secondary waves-effect waves-themed" data-tabname="floor" data-target="all">總覽</button>`;
let strHtml = `<button name="floBtn" data-id="all" type="button" class="btn btn-secondary waves-effect waves-themed btn-sm-2" data-tabname="floor" data-target="all">總覽</button>`;
$.each(res.data, (index, floObj) => {
strHtml += `<button name="floBtn" data-id="${floObj.floor_tag}" class="btn btn-secondary waves-effect waves-themed" data-tabname="floor" data-target="${floObj.floor_tag}">${floObj.floor_tag}</button>`;
strHtml += `<button name="floBtn" data-id="${floObj.floor_tag}" class="btn btn-secondary waves-effect waves-themed btn-sm-2" data-tabname="floor" data-target="${floObj.floor_tag}">${floObj.floor_tag}</button>`;
})
$("#floList").html(strHtml);
floList = res.data;

View File

@ -3,7 +3,13 @@
background: rgba(0, 0, 0, 0.03);
}
.btn-sm-2 {
padding: 2px 19px;
}
.table.dataTable td {
word-break:break-all;
}
/* ================================================================ */
/* 單一方法 */

View File

@ -2077,8 +2077,8 @@ License: You must have a valid license purchased only from wrapbootstrap.com (li
}
$(function () {
getSysMonBtnList();
getBuiList();
getSysMonBtnList();
})
@ -2095,9 +2095,10 @@ License: You must have a valid license purchased only from wrapbootstrap.com (li
onEvent("active:change", "#sysMonBtnList", function (e, actEle) {
if (actEle) {
pageAct.sysMainTag = $(actEle).data("maintag");
pageAct.sysSubTag = $(actEle).prop("id").split("subSysBtn")[1];
pageAct.sysSubName = $(actEle).text();
pageAct.sysMainTag = $(actEle).data("subSysObj").main_system_tag;
pageAct.sysSubTag = $(actEle).data("subSysObj").sub_system_tag;
pageAct.sysSubName = $(actEle).data("subSysObj").full_name;
pageAct.sysSubObj = $(actEle).data("subSysObj");
}
$(this).trigger("change");
})
@ -2115,17 +2116,23 @@ License: You must have a valid license purchased only from wrapbootstrap.com (li
function getSysMonBtnList() {
let url = baseApiUrl + "/api/Device/GetMainSub";
ytAjax = new YourTeam.Ajax(url, null, function (res) {
let sendData = {
building_tag: pageAct.buiTag,
};
objSendData.Data = sendData;
ytAjax = new YourTeam.Ajax(url, objSendData, function (res) {
if (!res || res.code != "0000" || !res.data) {
} else {
let strHtml = ``;
$("#sysMonBtnList").html()
$.each(res.data.history_Main_Systems, (index, mainSysObj) => {
$.each(mainSysObj.history_Sub_systems, (index2, subSysObj) => {
strHtml += `<button id="subSysBtn${subSysObj.sub_system_tag}" data-maintag="${mainSysObj.main_system_tag}"class="dropdown-item" type="button" data-page="systemMonitor" name="topFunBtn">${subSysObj.full_name}</button>`;
let btn = creBtn(subSysObj.full_name, `subSysBtn${subSysObj.sub_system_tag}`, "topFunBtn", ["dropdown-item"], { page: "systemMonitor" });
subSysObj.main_system_tag = mainSysObj.main_system_tag;
btn.data("subSysObj", subSysObj);
$("#sysMonBtnList").append(btn);
})
})
$("#sysMonBtnList").append(strHtml);
}
}, null, "POST").send();
}

View File

@ -61,7 +61,7 @@ namespace FrontendWebApi.ApiControllers
{
var dbsub = await frontendRepository.GetAllAsync<HistoryDBMainSub>(
@$"select distinct v1.system_key main_name, v1.system_value main_system_tag, v2.system_key sub_name, v2.system_value sub_system_tag, v1.system_priority, v2.system_priority,
dk.device_normal_color, dk.device_error_color, dk.device_error_color
dk.device_normal_color, dk.device_close_color, dk.device_error_color
from role_auth a
join auth_page b on a.AuthCode = b.AuthCode
join userinfo c on c.role_guid = a.role_guid