[Frontend]報表校區顯示 | dashboard 小類點擊跳轉 | 重新整理頁面跳轉

This commit is contained in:
Celeste 2023-08-24 15:13:29 +08:00
parent 716ecde2af
commit abb323c961
4 changed files with 1142 additions and 1058 deletions

View File

@ -358,11 +358,23 @@
x.mainSys == mainSysObj.main_system_tag && x.mainSys == mainSysObj.main_system_tag &&
x.subSys == subSysObj.sub_system_tag x.subSys == subSysObj.sub_system_tag
)[0]?.iconClass; )[0]?.iconClass;
strHtml += `<div class="btn-group btn-group-lg col-lg-6 mb-4 dev-group" data-id="/${pageAct.AreaTag}/${pageAct.buiTag}/${mainSysObj.main_system_tag}/${subSysObj.sub_system_tag}"> strHtml += `<div class="btn-group btn-group-lg col-lg-6 mb-4 dev-group" data-id="/${pageAct.AreaTag
<button name="topFunBtn" data-page="systemMonitor" type="button" class="btn btn-secondary col-4" > }/${pageAct.buiTag}/${mainSysObj.main_system_tag}/${subSysObj.sub_system_tag
}">
<button name="topFunBtn" data-page="systemMonitor" type="button" class="btn btn-secondary col-4" data-subSysobj=${JSON.stringify(
{
...subSysObj,
main_system_tag: mainSysObj.main_system_tag,
}
)}>
<img src="${iconClass}" class="w-100 "></img> <img src="${iconClass}" class="w-100 "></img>
</button> </button>
<button name="topFunBtn" data-page="systemMonitor" id="sysSubCardBtn${subSysObj.sub_system_tag}" type="button" class="btn btn-secondary" data-id="${subSysObj.sub_system_tag}" style="font-size: 20px">${subSysObj.full_name}</button> <button name="topFunBtn" data-page="systemMonitor" id="sysSubCardBtn${subSysObj.sub_system_tag
}" type="button" class="btn btn-secondary" data-id="${subSysObj.sub_system_tag
}" data-subSysObj=${JSON.stringify({
...subSysObj,
main_system_tag: mainSysObj.main_system_tag,
})} style="font-size: 20px">${subSysObj.full_name}</button>
</div>`; </div>`;
}); });
}); });

File diff suppressed because it is too large Load Diff

View File

@ -1,79 +1,79 @@
<div class="container-fluid px-0"> <div class="container-fluid px-0">
<div class="row no-gutters" style="min-height: 90vh;"> <div class="row no-gutters" style="height: calc(100vh - 72px)">
<div class="col-1"> <div class="col-1">
<aside id="sysMonNavbar" class="w-100 yt-navbar yt-left-navbar h-100 mt-0"> <aside id="sysMonNavbar" class="w-100 yt-navbar yt-left-navbar h-100 mt-0">
<div class="yt-navbar-content"> <div class="yt-navbar-content">
<ul id="sysMonBtnList"></ul> <ul id="sysMonBtnList"></ul>
</div>
</aside>
</div> </div>
</aside> <div class="col-11">
</div> <div class="container-fluid">
<div class="col-11"> <div class="row bg-dark align-items-center">
<div class="container-fluid"> <label id="sysSubText" class="mx-5 mb-0 fs-1-05"></label>
<div class="row bg-dark align-items-center"> <div class="btn-group my-1" id="floList"></div>
<label id="sysSubText" class="mx-5 mb-0 fs-1-05"></label> </div>
<div class="btn-group my-1" id="floList"></div> </div>
<main id="js-page-content" role="main" class="page-content"></main>
</div> </div>
</div>
<main id="js-page-content" role="main" class="page-content"></main>
</div> </div>
</div>
</div> </div>
<script> <script>
var floList = []; var floList = [];
$(function () { $(function () {
$("#sysSubText").text(pageAct.buiName + "/" + pageAct.sysSubName); $("#sysSubText").text(pageAct.buiName + "/" + pageAct.sysSubName);
getSysMonBtnList(); getSysMonBtnList();
getFloList(); getFloList();
});
onEvent("yt:tab:change", "[name=floBtn]", function () {
$.each(tolSubList, (idx, sub) => {
sub.unsubscribeAll();
sub.detach();
}); });
tolSubList = [];
pageAct.floTag = $(this).data("id");
pageAct.floGuid = $(this).data("guid");
if ($(this).data("id") == "all") {
pageAct.floTag = null;
pageAct.floGuid = null;
$("#js-page-content").load("_sysMonAll.html", loadCallback);
} else {
$("#js-page-content").load("_sysMonFloor.html", loadCallback);
}
});
onEvent("change", "#buiList", function (e, actEle) { onEvent("yt:tab:change", "[name=floBtn]", function () {
getFloList(); $.each(tolSubList, (idx, sub) => {
}); sub.unsubscribeAll();
sub.detach();
function getFloList() { });
let url = baseApiUrl + "/api/Device/GetFloor"; tolSubList = [];
let sendData = { pageAct.floTag = $(this).data("id");
building_tag: pageAct.buiTag, pageAct.floGuid = $(this).data("guid");
sub_system_tag: pageAct.sysSubTag, if ($(this).data("id") == "all") {
}; pageAct.floTag = null;
objSendData.Data = sendData; pageAct.floGuid = null;
ytAjax = new YourTeam.Ajax( $("#js-page-content").load("_sysMonAll.html", loadCallback);
url,
objSendData,
function (res) {
if (!res || res.code != "0000" || !res.data) {
} else { } else {
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>`; $("#js-page-content").load("_sysMonFloor.html", loadCallback);
$.each(res.data, (index, floObj) => {
strHtml += `<button name="floBtn" data-id="${floObj.floor_tag}" data-guid="${floObj.floor_guid}" 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;
var ytTab = new YT.Tab({ tabName: "floor" });
} }
}, });
null,
"POST" onEvent("change", "#buiList", function (e, actEle) {
).send(); getFloList();
} });
function getFloList() {
let url = baseApiUrl + "/api/Device/GetFloor";
let sendData = {
building_tag: pageAct.buiTag,
sub_system_tag: pageAct.sysSubTag,
};
objSendData.Data = sendData;
ytAjax = new YourTeam.Ajax(
url,
objSendData,
function (res) {
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 btn-sm-2" data-tabname="floor" data-target="all">總覽</button>`;
$.each(res.data, (index, floObj) => {
strHtml += `<button name="floBtn" data-id="${floObj.floor_tag}" data-guid="${floObj.floor_guid}" 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;
var ytTab = new YT.Tab({ tabName: "floor" });
}
},
null,
"POST"
).send();
}
</script> </script>

View File

@ -1190,7 +1190,6 @@ License: You must have a valid license purchased only from wrapbootstrap.com (li
pageAct.buiTag = $(actEle).prop("id").split("buiBtn")[1]; pageAct.buiTag = $(actEle).prop("id").split("buiBtn")[1];
pageAct.buiName = $(actEle).text(); pageAct.buiName = $(actEle).text();
pageAct.urn = $(actEle).data("urn"); pageAct.urn = $(actEle).data("urn");
console.log("building");
clearTimeout(refreshPageTimer); clearTimeout(refreshPageTimer);
refreshPageTimer = setTimeout(() => { refreshPageTimer = setTimeout(() => {
@ -1344,7 +1343,6 @@ License: You must have a valid license purchased only from wrapbootstrap.com (li
) { ) {
lastPageAct = JSON.parse(sessionStorage.getItem("pageAct")); lastPageAct = JSON.parse(sessionStorage.getItem("pageAct"));
} }
if ( if (
(lastPageAct.sysSubTag && lastPage == "systemMonitor") || (lastPageAct.sysSubTag && lastPage == "systemMonitor") ||
lastPage == "sysElevator" lastPage == "sysElevator"
@ -1352,11 +1350,11 @@ License: You must have a valid license purchased only from wrapbootstrap.com (li
) { ) {
$("#sysMonTopBtn").YTTab("set"); $("#sysMonTopBtn").YTTab("set");
if (!pageAct.isShowBuildingInMenu) { if (!pageAct.isShowBuildingInMenu) {
$(`#subSysBtn${lastPageAct.sysSubTag}`).click(); $(`#buiBtn${lastPageAct.buiTag}`).click();
} else { } else {
$( $(
`#subSysBtn${lastPageAct.sysSubTag `#subSysBtn${lastPageAct.sysSubTag
}[data-building-tag=${buildingTagOnJquery(pageAct.buiTag)}]` }[data-building-tag=${buildingTagOnJquery(lastPageAct.buiTag)}]`
).click(); ).click();
} }
} else { } else {
@ -1911,15 +1909,16 @@ License: You must have a valid license purchased only from wrapbootstrap.com (li
} }
function setSysTagForPageAct(obj) { function setSysTagForPageAct(obj) {
console.log($(obj).data("subsysobj"))
pageAct.sysMainTag = pageAct.sysMainTag =
$(obj).data("subSysObj")?.main_system_tag || $(obj).data("subsysobj")?.main_system_tag ||
pageAct.sysSubObj.main_system_tag; pageAct.sysSubObj.main_system_tag;
pageAct.sysSubTag = pageAct.sysSubTag =
$(obj).data("subSysObj")?.sub_system_tag || $(obj).data("subsysobj")?.sub_system_tag ||
pageAct.sysSubObj.sub_system_tag; pageAct.sysSubObj.sub_system_tag;
pageAct.sysSubName = pageAct.sysSubName =
$(obj).data("subSysObj")?.full_name || pageAct.sysSubName; $(obj).data("subsysobj")?.full_name || pageAct.sysSubName;
pageAct.sysSubObj = $(obj).data("subSysObj") || pageAct.sysSubObj; pageAct.sysSubObj = $(obj).data("subsysobj") || pageAct.sysSubObj;
getDevItem(); getDevItem();
} }
@ -2234,7 +2233,13 @@ License: You must have a valid license purchased only from wrapbootstrap.com (li
{ href: "javascript:;" }, { href: "javascript:;" },
[], [],
`subSysBtn${subSysObj.sub_system_tag}`, `subSysBtn${subSysObj.sub_system_tag}`,
{ page: page, tabname: "systemMonitor" }, {
page: page,
tabname: "systemMonitor",
"building-tag": buildingTagOnJquery(
pageAct.buiTag
),
},
"topFunBtn" "topFunBtn"
); );
li.append(a); li.append(a);
@ -2243,10 +2248,10 @@ License: You must have a valid license purchased only from wrapbootstrap.com (li
subSysObj.main_system_tag = mainSysObj.main_system_tag; subSysObj.main_system_tag = mainSysObj.main_system_tag;
$("#sysMonBtnList").append(li); $("#sysMonBtnList").append(li);
if (index === 0 && index2 === 0) { if (index === 0 && index2 === 0) {
pageAct.sysMainTag = mainSysObj.main_system_tag; // pageAct.sysMainTag = mainSysObj.main_system_tag;
pageAct.sysSubName = subSysObj.full_name; // pageAct.sysSubName = subSysObj.full_name;
pageAct.sysSubObj = subSysObj; // pageAct.sysSubObj = subSysObj;
pageAct.sysSubTag = subSysObj.sub_system_tag; // pageAct.sysSubTag = subSysObj.sub_system_tag;
$(`#subSysBtn${subSysObj.sub_system_tag}`).addClass( $(`#subSysBtn${subSysObj.sub_system_tag}`).addClass(
"active" "active"
); );