80 lines
2.9 KiB
HTML
80 lines
2.9 KiB
HTML
<div class="container-fluid px-0">
|
|
<div class="row no-gutters" style="height: calc(100vh - 72px)">
|
|
<div class="col-1">
|
|
<aside id="sysMonNavbar" class="w-100 yt-navbar yt-left-navbar h-100 mt-0">
|
|
<div class="yt-navbar-content">
|
|
<ul id="sysMonBtnList"></ul>
|
|
</div>
|
|
</aside>
|
|
</div>
|
|
<div class="col-11">
|
|
<div class="container-fluid">
|
|
<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>
|
|
</div>
|
|
</div>
|
|
<main id="js-page-content" role="main" class="page-content"></main>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<script>
|
|
var floList = [];
|
|
|
|
$(function () {
|
|
$("#sysSubText").text(pageAct.buiName + "/" + pageAct.sysSubName);
|
|
getSysMonBtnList();
|
|
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) {
|
|
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>
|