[Frontend] 修改系統監控為下拉選單 | 系統監控側邊選單改固定且為小類|校園總覽及電表塗改為滿版
This commit is contained in:
parent
6e3bf25510
commit
8eed17987b
2156
Frontend/_alert.html
2156
Frontend/_alert.html
File diff suppressed because it is too large
Load Diff
@ -15,53 +15,41 @@
|
|||||||
<div class="col-sm-12 col-xl-4">
|
<div class="col-sm-12 col-xl-4">
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col-sm-6 col-xl-6">
|
<div class="col-sm-6 col-xl-6">
|
||||||
<div
|
<div class="p-3 bg-primary-300 rounded overflow-hidden position-relative text-white mb-g">
|
||||||
class="p-3 bg-primary-300 rounded overflow-hidden position-relative text-white mb-g"
|
|
||||||
>
|
|
||||||
<div class="">
|
<div class="">
|
||||||
<h3 class="display-4 d-block l-h-n m-0 fw-500">
|
<h3 class="display-4 d-block l-h-n m-0 fw-500">
|
||||||
<span id="todayUseElec">--</span>
|
<span id="todayUseElec">--</span>
|
||||||
<small class="m-0 l-h-n">今日用電量 kWH</small>
|
<small class="m-0 l-h-n">今日用電量 kWH</small>
|
||||||
</h3>
|
</h3>
|
||||||
</div>
|
</div>
|
||||||
<i
|
<i class="fal fa-user position-absolute pos-right pos-bottom opacity-15 mb-n1 mr-n1"
|
||||||
class="fal fa-user position-absolute pos-right pos-bottom opacity-15 mb-n1 mr-n1"
|
style="font-size: 6rem"></i>
|
||||||
style="font-size: 6rem"
|
|
||||||
></i>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="col-sm-6 col-xl-6">
|
<div class="col-sm-6 col-xl-6">
|
||||||
<div
|
<div class="p-3 bg-warning-400 rounded overflow-hidden position-relative text-white mb-g">
|
||||||
class="p-3 bg-warning-400 rounded overflow-hidden position-relative text-white mb-g"
|
|
||||||
>
|
|
||||||
<div class="">
|
<div class="">
|
||||||
<h3 class="display-4 d-block l-h-n m-0 fw-500">
|
<h3 class="display-4 d-block l-h-n m-0 fw-500">
|
||||||
<span id="yesUseElec">--</span>
|
<span id="yesUseElec">--</span>
|
||||||
<small class="m-0 l-h-n">昨日用電量 kWH</small>
|
<small class="m-0 l-h-n">昨日用電量 kWH</small>
|
||||||
</h3>
|
</h3>
|
||||||
</div>
|
</div>
|
||||||
<i
|
<i class="fal fa-gem position-absolute pos-right pos-bottom opacity-15 mb-n1 mr-n4"
|
||||||
class="fal fa-gem position-absolute pos-right pos-bottom opacity-15 mb-n1 mr-n4"
|
style="font-size: 6rem"></i>
|
||||||
style="font-size: 6rem"
|
|
||||||
></i>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="col-lg-12">
|
<div class="col-lg-12">
|
||||||
<div
|
<div id="panel-2"
|
||||||
id="panel-2"
|
class="panel"
|
||||||
class="panel"
|
data-panel-sortable
|
||||||
data-panel-sortable
|
data-panel-collapsed
|
||||||
data-panel-collapsed
|
data-panel-close>
|
||||||
data-panel-close
|
|
||||||
>
|
|
||||||
<div class="panel-hdr">
|
<div class="panel-hdr">
|
||||||
<h2>昨日／今日用電比較 (kWh)</h2>
|
<h2>昨日／今日用電比較 (kWh)</h2>
|
||||||
</div>
|
</div>
|
||||||
<div class="panel-container show">
|
<div class="panel-container show">
|
||||||
<div class="panel-content poisition-relative">
|
<div class="panel-content poisition-relative">
|
||||||
<div
|
<div class="p-1 position-absolute pos-right pos-top mt-3 mr-3 z-index-cloud d-flex align-items-center justify-content-center">
|
||||||
class="p-1 position-absolute pos-right pos-top mt-3 mr-3 z-index-cloud d-flex align-items-center justify-content-center"
|
|
||||||
>
|
|
||||||
<!--<div class="border-faded border-top-0 border-left-0 border-bottom-0 py-2 pr-4 mr-3 hidden-sm-down">
|
<!--<div class="border-faded border-top-0 border-left-0 border-bottom-0 py-2 pr-4 mr-3 hidden-sm-down">
|
||||||
<div class="text-right fw-500 l-h-n d-flex flex-column">
|
<div class="text-right fw-500 l-h-n d-flex flex-column">
|
||||||
<div class="h3 m-0 d-flex align-items-center justify-content-end">
|
<div class="h3 m-0 d-flex align-items-center justify-content-end">
|
||||||
@ -93,45 +81,35 @@
|
|||||||
<div class="col-sm-12 col-xl-4">
|
<div class="col-sm-12 col-xl-4">
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col-sm-6 col-xl-6">
|
<div class="col-sm-6 col-xl-6">
|
||||||
<div
|
<div class="p-3 bg-success-200 rounded overflow-hidden position-relative text-white mb-g">
|
||||||
class="p-3 bg-success-200 rounded overflow-hidden position-relative text-white mb-g"
|
|
||||||
>
|
|
||||||
<div class="">
|
<div class="">
|
||||||
<h3 class="display-4 d-block l-h-n m-0 fw-500">
|
<h3 class="display-4 d-block l-h-n m-0 fw-500">
|
||||||
<span id="insPower">--</span>
|
<span id="insPower">--</span>
|
||||||
<small class="m-0 l-h-n">即時功率 kW</small>
|
<small class="m-0 l-h-n">即時功率 kW</small>
|
||||||
</h3>
|
</h3>
|
||||||
</div>
|
</div>
|
||||||
<i
|
<i class="fal fa-lightbulb position-absolute pos-right pos-bottom opacity-15 mb-n5 mr-n6"
|
||||||
class="fal fa-lightbulb position-absolute pos-right pos-bottom opacity-15 mb-n5 mr-n6"
|
style="font-size: 8rem"></i>
|
||||||
style="font-size: 8rem"
|
|
||||||
></i>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="col-sm-6 col-xl-6">
|
<div class="col-sm-6 col-xl-6">
|
||||||
<div
|
<div class="p-3 bg-info-200 rounded overflow-hidden position-relative text-white mb-g">
|
||||||
class="p-3 bg-info-200 rounded overflow-hidden position-relative text-white mb-g"
|
|
||||||
>
|
|
||||||
<div class="">
|
<div class="">
|
||||||
<h3 class="display-4 d-block l-h-n m-0 fw-500">
|
<h3 class="display-4 d-block l-h-n m-0 fw-500">
|
||||||
<span id="insPowerPer">--</span>
|
<span id="insPowerPer">--</span>
|
||||||
<small class="m-0 l-h-n">即時契約容量占比 %</small>
|
<small class="m-0 l-h-n">即時契約容量占比 %</small>
|
||||||
</h3>
|
</h3>
|
||||||
</div>
|
</div>
|
||||||
<i
|
<i class="fal fa-globe position-absolute pos-right pos-bottom opacity-15 mb-n1 mr-n4"
|
||||||
class="fal fa-globe position-absolute pos-right pos-bottom opacity-15 mb-n1 mr-n4"
|
style="font-size: 6rem"></i>
|
||||||
style="font-size: 6rem"
|
|
||||||
></i>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="col-lg-12">
|
<div class="col-lg-12">
|
||||||
<div
|
<div id="panel-3"
|
||||||
id="panel-3"
|
class="panel"
|
||||||
class="panel"
|
data-panel-sortable
|
||||||
data-panel-sortable
|
data-panel-collapsed
|
||||||
data-panel-collapsed
|
data-panel-close>
|
||||||
data-panel-close
|
|
||||||
>
|
|
||||||
<div class="panel-hdr">
|
<div class="panel-hdr">
|
||||||
<h2>本週／上週用電比較 (kWh)</h2>
|
<h2>本週／上週用電比較 (kWh)</h2>
|
||||||
</div>
|
</div>
|
||||||
@ -204,16 +182,12 @@
|
|||||||
</div>
|
</div>
|
||||||
<div class="panel-container h-100 show">
|
<div class="panel-container h-100 show">
|
||||||
<div class="panel-content poisition-relative p-0 row p-0 h-100">
|
<div class="panel-content poisition-relative p-0 row p-0 h-100">
|
||||||
<div
|
<div class="col-12 mb-2 position-relative row m-0 justify-content-center"
|
||||||
class="col-12 mb-2 position-relative row m-0 justify-content-center"
|
style="max-height: 150px">
|
||||||
style="max-height: 150px"
|
|
||||||
>
|
|
||||||
<canvas class="chart" id="errRecChart"></canvas>
|
<canvas class="chart" id="errRecChart"></canvas>
|
||||||
</div>
|
</div>
|
||||||
<div
|
<div class="col-12 mb-2 position-relative row m-0 justify-content-center"
|
||||||
class="col-12 mb-2 position-relative row m-0 justify-content-center"
|
style="max-height: 150px">
|
||||||
style="max-height: 150px"
|
|
||||||
>
|
|
||||||
<canvas class="chart" id="errChkChart"></canvas>
|
<canvas class="chart" id="errChkChart"></canvas>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@ -227,16 +201,12 @@
|
|||||||
</div>
|
</div>
|
||||||
<div class="panel-container h-100 show">
|
<div class="panel-container h-100 show">
|
||||||
<div class="panel-content poisition-relative row p-0 h-100 p-0">
|
<div class="panel-content poisition-relative row p-0 h-100 p-0">
|
||||||
<div
|
<div class="col-12 mb-2 position-relative row m-0 justify-content-center"
|
||||||
class="col-12 mb-2 position-relative row m-0 justify-content-center"
|
style="max-height: 150px">
|
||||||
style="max-height: 150px"
|
|
||||||
>
|
|
||||||
<canvas class="chart" id="worOrdErrChart"></canvas>
|
<canvas class="chart" id="worOrdErrChart"></canvas>
|
||||||
</div>
|
</div>
|
||||||
<div
|
<div class="col-12 mb-2 position-relative row m-0 justify-content-center"
|
||||||
class="col-12 mb-2 position-relative row m-0 justify-content-center"
|
style="max-height: 150px">
|
||||||
style="max-height: 150px"
|
|
||||||
>
|
|
||||||
<canvas class="chart" id="worOrdFinChart"></canvas>
|
<canvas class="chart" id="worOrdFinChart"></canvas>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@ -267,8 +237,6 @@
|
|||||||
};
|
};
|
||||||
var contractCapacity = 0;
|
var contractCapacity = 0;
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
$(document).ready(function () {
|
$(document).ready(function () {
|
||||||
$(loadEle).Loading("start");
|
$(loadEle).Loading("start");
|
||||||
$(loadEle).Loading("close");
|
$(loadEle).Loading("close");
|
||||||
@ -292,10 +260,10 @@
|
|||||||
(x) => x.mainSys == obj.mainSys && x.subSys == obj.subSys
|
(x) => x.mainSys == obj.mainSys && x.subSys == obj.subSys
|
||||||
)[0];
|
)[0];
|
||||||
strHtml = `<div class="btn-group btn-group-lg col-lg-6 mb-4 dev-group">
|
strHtml = `<div class="btn-group btn-group-lg col-lg-6 mb-4 dev-group">
|
||||||
<button name="topFunBtn" data-page="alert" type="button" class="btn btn-secondary col-4 d-flex jusity-content-center">
|
<button name="topFunBtn" data-page="alert" type="button" class="btn btn-secondary col-4 d-flex jusity-content-center disabled" disabled>
|
||||||
<img src="${iconObj.iconClass}" class="w-100"></img>
|
<img src="${iconObj.iconClass}" class="w-100"></img>
|
||||||
</button>
|
</button>
|
||||||
<button id="sysSubCardBtn${obj.subSys}" type="button" class="btn btn-secondary" data-id="${obj.subSys}" style="font-size: 20px">${obj.text}</button>
|
<button id="sysSubCardBtn${obj.subSys}" type="button" class="btn btn-secondary disabled" disabled data-id="${obj.subSys}" style="font-size: 20px">${obj.text}</button>
|
||||||
</div>`;
|
</div>`;
|
||||||
$("#sysSubBtnList").append(strHtml);
|
$("#sysSubBtnList").append(strHtml);
|
||||||
}
|
}
|
||||||
@ -331,10 +299,10 @@
|
|||||||
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}/${pageAct.buiTag}/${mainSysObj.main_system_tag}/${subSysObj.sub_system_tag}">
|
||||||
<button name="topFunBtn" data-page="alert" type="button" class="btn btn-secondary col-4">
|
<button name="topFunBtn" data-page="alert" type="button" class="btn btn-secondary col-4" >
|
||||||
<img src="${iconClass}" class="w-100 "></img>
|
<img src="${iconClass}" class="w-100 "></img>
|
||||||
</button>
|
</button>
|
||||||
<button 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 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>
|
||||||
</div>`;
|
</div>`;
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
@ -349,7 +317,7 @@
|
|||||||
// 取得 自動須量
|
// 取得 自動須量
|
||||||
function getAutDemVal() {
|
function getAutDemVal() {
|
||||||
let url = baseApiUrl + "/api/Dashboard/GetContractValue";
|
let url = baseApiUrl + "/api/Dashboard/GetContractValue";
|
||||||
let sendData = pageAct.buiTag
|
let sendData = pageAct.buiTag;
|
||||||
objSendData.Data = sendData;
|
objSendData.Data = sendData;
|
||||||
ytAjax = new YourTeam.Ajax(
|
ytAjax = new YourTeam.Ajax(
|
||||||
url,
|
url,
|
||||||
@ -358,7 +326,7 @@
|
|||||||
if (!res || res.code != "0000" || !res.data) {
|
if (!res || res.code != "0000" || !res.data) {
|
||||||
} else {
|
} else {
|
||||||
contractCapacity = (res.data || [])[0]?.contract_value ?? 0;
|
contractCapacity = (res.data || [])[0]?.contract_value ?? 0;
|
||||||
getFirstEletric()
|
getFirstEletric();
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
null,
|
null,
|
||||||
@ -432,18 +400,12 @@
|
|||||||
"T00:00:00";
|
"T00:00:00";
|
||||||
|
|
||||||
// 今日用電量
|
// 今日用電量
|
||||||
getElectricMeterDayDataByBaja(
|
getElectricMeterDayDataByBaja(devNum, n4Sup, today, tomorrow, (data) => {
|
||||||
devNum,
|
let result = data?.data[0]?.sum;
|
||||||
n4Sup,
|
result = result ? parseFloat(result).toFixed(2) : 0;
|
||||||
today,
|
$("#todayUseElec").text(result);
|
||||||
tomorrow,
|
chkBajaLoaded();
|
||||||
(data) => {
|
});
|
||||||
let result = data?.data[0]?.sum;
|
|
||||||
result = result ? parseFloat(result).toFixed(2) : 0;
|
|
||||||
$("#todayUseElec").text(result);
|
|
||||||
chkBajaLoaded();
|
|
||||||
}
|
|
||||||
);
|
|
||||||
|
|
||||||
// 今日用電量 (每小時)
|
// 今日用電量 (每小時)
|
||||||
getElectricMeterHourDataByBaja(
|
getElectricMeterHourDataByBaja(
|
||||||
@ -470,18 +432,12 @@
|
|||||||
);
|
);
|
||||||
|
|
||||||
// 昨日用電量
|
// 昨日用電量
|
||||||
getElectricMeterDayDataByBaja(
|
getElectricMeterDayDataByBaja(devNum, n4Sup, yesterday, today, (data) => {
|
||||||
devNum,
|
let result = data?.data[0]?.sum;
|
||||||
n4Sup,
|
result = result ? parseFloat(result).toFixed(2) : 0;
|
||||||
yesterday,
|
$("#yesUseElec").text(result);
|
||||||
today,
|
chkBajaLoaded();
|
||||||
(data) => {
|
});
|
||||||
let result = data?.data[0]?.sum;
|
|
||||||
result = result ? parseFloat(result).toFixed(2) : 0;
|
|
||||||
$("#yesUseElec").text(result);
|
|
||||||
chkBajaLoaded();
|
|
||||||
}
|
|
||||||
);
|
|
||||||
|
|
||||||
// 本週與上週用電量 (每天)
|
// 本週與上週用電量 (每天)
|
||||||
getElectricMeterDayDataByBaja(
|
getElectricMeterDayDataByBaja(
|
||||||
@ -499,9 +455,9 @@
|
|||||||
let prevWeekData = data.data.filter(
|
let prevWeekData = data.data.filter(
|
||||||
(x) =>
|
(x) =>
|
||||||
strToDate(displayDate(new Date(), "date"), null, 1 - 14) <=
|
strToDate(displayDate(new Date(), "date"), null, 1 - 14) <=
|
||||||
strToDate(x.timestamp.$cEncStr) &&
|
strToDate(x.timestamp.$cEncStr) &&
|
||||||
strToDate(new Date(), null, 1 - 7) >=
|
strToDate(new Date(), null, 1 - 7) >=
|
||||||
strToDate(x.timestamp.$cEncStr)
|
strToDate(x.timestamp.$cEncStr)
|
||||||
);
|
);
|
||||||
|
|
||||||
chartEveWeeksElec(curWeekData, prevWeekData);
|
chartEveWeeksElec(curWeekData, prevWeekData);
|
||||||
@ -511,7 +467,7 @@
|
|||||||
|
|
||||||
// 異常數量與復歸數量
|
// 異常數量與復歸數量
|
||||||
getAlarmCountByBaja((aData) => {
|
getAlarmCountByBaja((aData) => {
|
||||||
console.log("aData",aData)
|
console.log("aData", aData);
|
||||||
chartDataCnt.alarmCnt = aData;
|
chartDataCnt.alarmCnt = aData;
|
||||||
chkBajaLoaded();
|
chkBajaLoaded();
|
||||||
});
|
});
|
||||||
@ -988,7 +944,7 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
function show3DModel() {
|
function show3DModel() {
|
||||||
if(typeof launchViewerNoTools != "undefined"){
|
if (typeof launchViewerNoTools != "undefined") {
|
||||||
launchViewerNoTools(
|
launchViewerNoTools(
|
||||||
pageAct.urn,
|
pageAct.urn,
|
||||||
(viewer) => {
|
(viewer) => {
|
||||||
@ -1024,6 +980,10 @@
|
|||||||
|
|
||||||
onEvent("click", "button[id^=sysSubCardBtn]", function () {
|
onEvent("click", "button[id^=sysSubCardBtn]", function () {
|
||||||
let subSysTag = $(this).data("id");
|
let subSysTag = $(this).data("id");
|
||||||
$(`#subSysBtn${subSysTag}[data-building-tag='${buildingTagOnJquery(pageAct.buiTag)}']`).click();
|
$(
|
||||||
|
`#subSysBtn${subSysTag}[data-building-tag='${buildingTagOnJquery(
|
||||||
|
pageAct.buiTag
|
||||||
|
)}']`
|
||||||
|
).click();
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|||||||
@ -1,9 +1,9 @@
|
|||||||
|
|
||||||
<div class="container-fluid">
|
<div class="container-fluid">
|
||||||
<div class="row bg-dark align-items-center">
|
<div class="row bg-dark align-items-center">
|
||||||
<label id="sysSubText" class=" mx-5 mb-0 fs-1-05"></label>
|
<label id="sysSubText" class=" mx-5 mb-0 fs-1-05"></label>
|
||||||
<div style="height:85vh" class="col-12 p-0">
|
<div style="height:91vh" class="col-12 p-0">
|
||||||
<iframe src="/ord?file:^px/AllMeter.px|view:?fullScreen=true" width="100%" height="100%" style="zoom:0.1"></iframe>
|
<iframe id="homeIframe" src="/ord?file:^px/AllMeter.px|view:?fullScreen=true" width="100%" height="100%" style="zoom:0.1"></iframe>
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
File diff suppressed because it is too large
Load Diff
@ -1,9 +1,11 @@
|
|||||||
|
<style></style>
|
||||||
<div class="container-fluid">
|
<div class="container-fluid">
|
||||||
<div class="row bg-dark align-items-center">
|
<div class="row bg-dark align-items-center">
|
||||||
<label id="sysSubText" class=" mx-5 mb-0 fs-1-05"></label>
|
<label id="sysSubText" class="mx-5 mb-0 fs-1-05"></label>
|
||||||
<div style="height:85vh" class="col-12">
|
<div style="height: 90vh" class="col-12">
|
||||||
<iframe src="/ord?file:^px/Home.px|view:?fullScreen=true" width="100%" height="100%"></iframe>
|
<iframe src="/ord?file:^px/Home.px|view:?fullScreen=true"
|
||||||
</div>
|
width="100%"
|
||||||
|
height="100%"></iframe>
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@ -1,65 +1,79 @@
|
|||||||
|
<div class="container-fluid px-0">
|
||||||
<div class="container-fluid">
|
<div class="row no-gutters" style="min-height: 90vh;">
|
||||||
<div class="row bg-dark align-items-center">
|
<div class="col-1">
|
||||||
<label id="sysSubText" class=" mx-5 mb-0 fs-1-05"></label>
|
<aside id="sysMonNavbar" class="w-100 yt-navbar yt-left-navbar h-100 mt-0">
|
||||||
<div class="btn-group my-1" id="floList">
|
<div class="yt-navbar-content">
|
||||||
|
<ul id="sysMonBtnList"></ul>
|
||||||
</div>
|
</div>
|
||||||
|
</aside>
|
||||||
</div>
|
</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>
|
</div>
|
||||||
<main id="js-page-content" role="main" class="page-content">
|
|
||||||
|
|
||||||
</main>
|
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
var floList = [];
|
var floList = [];
|
||||||
|
|
||||||
$(function () {
|
$(function () {
|
||||||
$("#sysSubText").text(pageAct.buiName +"/"+pageAct.sysSubName);
|
$("#sysSubText").text(pageAct.buiName + "/" + pageAct.sysSubName);
|
||||||
getFloList();
|
getSysMonBtnList();
|
||||||
})
|
getFloList();
|
||||||
|
});
|
||||||
|
|
||||||
onEvent("yt:tab:change", "[name=floBtn]", function () {
|
onEvent("yt:tab:change", "[name=floBtn]", function () {
|
||||||
$.each(tolSubList, (idx, sub) => {
|
$.each(tolSubList, (idx, sub) => {
|
||||||
sub.unsubscribeAll();
|
sub.unsubscribeAll();
|
||||||
sub.detach();
|
sub.detach();
|
||||||
})
|
});
|
||||||
tolSubList=[];
|
tolSubList = [];
|
||||||
pageAct.floTag = $(this).data("id");
|
pageAct.floTag = $(this).data("id");
|
||||||
pageAct.floGuid = $(this).data("guid");
|
pageAct.floGuid = $(this).data("guid");
|
||||||
if ($(this).data("id") == "all") {
|
if ($(this).data("id") == "all") {
|
||||||
pageAct.floTag = null;
|
pageAct.floTag = null;
|
||||||
pageAct.floGuid = null;
|
pageAct.floGuid = null;
|
||||||
$("#js-page-content").load("_sysMonAll.html", loadCallback);
|
$("#js-page-content").load("_sysMonAll.html", loadCallback);
|
||||||
} else {
|
} else {
|
||||||
$("#js-page-content").load("_sysMonFloor.html", loadCallback);
|
$("#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();
|
|
||||||
}
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
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>
|
</script>
|
||||||
4485
Frontend/index.html
4485
Frontend/index.html
File diff suppressed because it is too large
Load Diff
@ -95,7 +95,10 @@ function setDropdownItem(menuEle) {
|
|||||||
|
|
||||||
let actText = $(menuEle).find(".dropdown-item.active").first().text();
|
let actText = $(menuEle).find(".dropdown-item.active").first().text();
|
||||||
let actEleId = $(menuEle).prop("id");
|
let actEleId = $(menuEle).prop("id");
|
||||||
$(`.dropdown-toggle[data-target=${actEleId}]`).text(actText);
|
if (actEleId) {
|
||||||
|
$(`.dropdown-toggle[data-target=${actEleId}]`).text(actText);
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
/*actChaCallback($(menuEle).find(".dropdown-item.active"))*/
|
/*actChaCallback($(menuEle).find(".dropdown-item.active"))*/
|
||||||
$(menuEle).trigger("active:change", $(menuEle).find(".dropdown-item.active"));
|
$(menuEle).trigger("active:change", $(menuEle).find(".dropdown-item.active"));
|
||||||
@ -1248,42 +1251,62 @@ class Forge3DSensor {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
function setTopBuildingText(){
|
function setTopBuildingText() {
|
||||||
$(".top-building-text-container").load("_topBuildingText.html",function(){
|
$(".top-building-text-container").load("_topBuildingText.html", function () {
|
||||||
|
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
function buildingTagOnJquery(building_tag){
|
function buildingTagOnJquery(building_tag) {
|
||||||
let frontSyntax = building_tag.slice(0,2);
|
let frontSyntax = building_tag.slice(0, 2);
|
||||||
if(frontSyntax == "$3"){
|
if (frontSyntax == "$3") {
|
||||||
return building_tag.slice(2,building_tag.length);
|
return building_tag.slice(2, building_tag.length);
|
||||||
}
|
}
|
||||||
return building_tag;
|
return building_tag;
|
||||||
}
|
}
|
||||||
|
|
||||||
function buildingTagOnProcess(building_tag){
|
function buildingTagOnProcess(building_tag) {
|
||||||
if(!isNaN(parseInt(building_tag.slice(0,1)))){
|
if (!isNaN(parseInt(building_tag.slice(0, 1)))) {
|
||||||
building_tag = "$3" + building_tag;
|
building_tag = "$3" + building_tag;
|
||||||
}
|
}
|
||||||
return building_tag;
|
return building_tag;
|
||||||
}
|
}
|
||||||
|
|
||||||
function deviceNumber(devNum){
|
function deviceNumber(devNum) {
|
||||||
if(devNum.includes("$3")){
|
if (devNum.includes("$3")) {
|
||||||
devNum = devNum.replaceAll("$3","");
|
devNum = devNum.replaceAll("$3", "");
|
||||||
}
|
}
|
||||||
return devNum;
|
return devNum;
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
function deviceNumberOnProcess(devNum){
|
function deviceNumberOnProcess(devNum) {
|
||||||
if(devNum.includes("/")){
|
if (devNum.includes("/")) {
|
||||||
tags = devNum.split("/");
|
tags = devNum.split("/");
|
||||||
buildingTag = tags[1];
|
buildingTag = tags[1];
|
||||||
buildingTag = buildingTagOnProcess(buildingTag);
|
buildingTag = buildingTagOnProcess(buildingTag);
|
||||||
devNum = tags[0] + "/" + buildingTag + "/" + tags.slice(2,tags.length).join("/")
|
devNum = tags[0] + "/" + buildingTag + "/" + tags.slice(2, tags.length).join("/")
|
||||||
}
|
}
|
||||||
return devNum;
|
return devNum;
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function convertToBase64(imagePath, callback) {
|
||||||
|
// 創建一個新的 FileReader 物件
|
||||||
|
const reader = new FileReader();
|
||||||
|
|
||||||
|
// 當 FileReader 讀取完成時的處理函數
|
||||||
|
reader.onloadend = () => {
|
||||||
|
if (typeof callback === 'function') {
|
||||||
|
// 從 result 中獲取 base64 編碼的圖像數據
|
||||||
|
const base64String = reader.result.split(',')[1];
|
||||||
|
callback(base64String);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
// 讀取圖像文件
|
||||||
|
fetch(imagePath)
|
||||||
|
.then((response) => response.blob())
|
||||||
|
.then((blob) => reader.readAsDataURL(blob))
|
||||||
|
.catch((error) => console.error('Error:', error));
|
||||||
|
}
|
||||||
Loading…
Reference in New Issue
Block a user