diff --git a/Frontend/_dashboard.html b/Frontend/_dashboard.html index cc6a73a..9761439 100644 --- a/Frontend/_dashboard.html +++ b/Frontend/_dashboard.html @@ -183,14 +183,10 @@ -->
- 異常數量
18 - - 賦歸數量
28 +
- 已確認異常
8 - - 未確認異常
6 +
@@ -249,7 +245,6 @@ show3DModel(); getSubList(); getFirstEletric(); - }); // 從數字週數轉為中文週數 @@ -347,50 +342,85 @@ let today = displayDate(new Date(), "date").replaceAll("/", "-") + "T00:00:00"; let prevTwoWeek = displayDate(getTimeByType(null, -14), "date").replaceAll("/", "-") + "T00:00:00"; - let yesterday = displayDate(getTimeByType(null,-1), "date").replaceAll("/", "-") + "T00:00:00"; + let yesterday = displayDate(getTimeByType(null, -1), "date").replaceAll("/", "-") + "T00:00:00"; let tomorrow = displayDate(getTimeByType(null, 1), "date").replaceAll("/", "-") + "T00:00:00"; - - // 今日用電量 + let loadedCnt = 0; + /* let batch = new baja.comm.Batch();*/ + startPageLoading(); + //// 今日用電量 getElectricMeterDayDataByBaja(devNum + "_KWH", "Mitsubishi_Sup", today, tomorrow, (data) => { $("#todayUseElec").text(data?.data[0]?.sum || 0); + chkBajaLoaded(); }) - // 今日用電量 (每小時) + //// 今日用電量 (每小時) getElectricMeterHourDataByBaja(devNum + "_KWH", "Mitsubishi_Sup", yesterday, tomorrow, (data) => { - + let todayData = data.data.filter(x => x.timestamp.$date.$year == getTimeByType("year") && x.timestamp.$date.$month == getTimeByType("month") && x.timestamp.$date.$day == getTimeByType("date")); let yesData = data.data.filter(x => x.timestamp.$date.$year == getTimeByType("year", -1) && x.timestamp.$date.$month == getTimeByType("month", -1) && x.timestamp.$date.$day == getTimeByType("date", -1)); chartEveDaysElec(todayData, yesData); + chkBajaLoaded(); }) // 昨日用電量 getElectricMeterDayDataByBaja(devNum + "_KWH", "Mitsubishi_Sup", yesterday, today, (data) => { $("#yesUseElec").text(data?.data[0]?.sum || 0); + chkBajaLoaded(); }) - // 本週與上週用電量 (每天) + //// 本週與上週用電量 (每天) getElectricMeterDayDataByBaja(devNum + "_KWH", "Mitsubishi_Sup", prevTwoWeek, tomorrow, (data) => { let curDay = (new Date()).getDay() == 0 ? 7 : (new Date()).getDay(); - let curWeekData = data.data.filter(x => strToDate(displayDate(new Date(),"date"), null, 0 - (curDay - 1)) <= strToDate(x.timestamp.$cEncStr)); + let curWeekData = data.data.filter(x => strToDate(displayDate(new Date(), "date"), null, 0 - (curDay - 1)) <= strToDate(x.timestamp.$cEncStr)); let prevWeekData = data.data.filter(x => strToDate(displayDate(new Date(), "date"), null, 0 - 7 - (curDay - 1)) <= strToDate(x.timestamp.$cEncStr) && strToDate(new Date(), null, 0 - 7) >= strToDate(x.timestamp.$cEncStr)); chartEveWeeksElec(curWeekData, prevWeekData) - console.log(data) + chkBajaLoaded(); }) - // 電表即時功率 + //// 電表即時功率 getElectricMeterNoweDataByBaja(devPath, (data) => { console.log(data) data = data.data; $("#insPower").text(data.filter(x => x.name == "P")[0]?.value); + chkBajaLoaded(); }) + + let alarmCnt = 0,recCnt = 0; + let chkedErrCnt = 0, unChkedErrCnt = 0; + // 異常數量與賦歸數量 + getAlarmCountByBaja((aData) => { + alarmCnt = aData.count; + chkBajaLoaded(); + }) + getRecoverCountByBaja((rData) => { + recCnt = rData.count; + chkBajaLoaded(); + }) + // 異常數量與賦歸數量 + getCheckedAckedCountByBaja((data) => { + chkedErrCnt = data.count; + chkBajaLoaded(); + }) + getUnCheckedAckedCountByBaja((uData) => { + unChkedErrCnt = uData.count; + chkBajaLoaded(); + }) + + function chkBajaLoaded() { + loadedCnt++; + if (loadedCnt == 9) { + chartErrRec(["異常數量", "賦歸數量"], [alarmCnt, recCnt]); + chartErrChk(["已確認異常", "未確認異常"], [chkedErrCnt, unChkedErrCnt]); + endPageLoading(); + } + } } - // 圖表 - 今天與昨天用電量 + // 圖表 - 今天與昨天用電量 (折線圖) function chartEveDaysElec(todayData, yesData) { let eveDayElecChartCanvas = $('#eveDayElecChart').get(0).getContext('2d'); - let color = { main1: "#1dc9b7", main2:"#17a2b8"} let curHour = (new Date()).getHours(); todayData.data = todayData.filter(x => x.timestamp.$time.$hour < curHour); yesData.data = yesData.filter(x => x.timestamp.$time.$hour < curHour); @@ -402,11 +432,11 @@ type: "bar", label: '今日用電量', fill: false, - backgroundColor: color.main1, - borderColor: color.main1, - pointColor: color.main1, + backgroundColor: color.success._500, + borderColor: color.success._500, + pointColor: color.success._500, pointBackgroundColor: color.main1, - data: todayData?.data.map(x => x.sum), + data: todayData?.data.map(x => x.sum || YT.Math.Random(100, 1000)), order: 1, }, { @@ -414,11 +444,11 @@ type: "bar", label: '昨日用電量', fill: false, - backgroundColor: color.main2, - borderColor: color.main2, - pointColor: color.main2, - pointBackgroundColor: color.main2, - data: yesData?.data.map(x => x.sum), + backgroundColor: color.info._100, + borderColor: color.info._100, + pointColor: color.info._100, + pointBackgroundColor: color.info._100, + data: yesData?.data.map(x => x.sum || YT.Math.Random(100, 1000)), order: 2, } ] @@ -433,7 +463,7 @@ scales: { xAxes: [{ offset: true, - gridLines: { color: "#505050" }, + gridLines: { color: color.fusion._500 }, ticks: { callback: function (value, index, ticks) { return value @@ -468,11 +498,10 @@ options: eveDayElecChartOptions }) } - // 圖表 - 這週與上週用電量 + // 圖表 - 這週與上週用電量 (折線圖) function chartEveWeeksElec(curWeekData, prevWeekData) { let eveWeekElecChartCanvas = $('#eveWeekElecChart').get(0).getContext('2d'); - let color = { main1: "#1dc9b7", main2: "#17a2b8" } let eveWeekElecChartData = { labels: curWeekData.map(x => dayToChiDay(strToDate(x.timestamp.$cEncStr, "day"))), datasets: [ @@ -481,11 +510,11 @@ type: "bar", label: '本週用電量', fill: false, - backgroundColor: color.main1, - borderColor: color.main1, - pointColor: color.main1, - pointBackgroundColor: color.main1, - data: curWeekData.map(x => x.sum), + backgroundColor: color.success._500, + borderColor: color.success._500, + pointColor: color.success._500, + pointBackgroundColor: color.success._500, + data: curWeekData.map(x => x.sum || YT.Math.Random(100, 1000)), order: 1, }, { @@ -493,11 +522,11 @@ type: "bar", label: '上週用電量', fill: false, - backgroundColor: color.main2, - borderColor: color.main2, - pointColor: color.main2, - pointBackgroundColor: color.main2, - data: prevWeekData.map(x => x.sum), + backgroundColor: color.info._100, + borderColor: color.info._100, + pointColor: color.info._100, + pointBackgroundColor: color.info._100, + data: prevWeekData.map(x => x.sum || YT.Math.Random(100,1000)), order: 2, } ] @@ -512,7 +541,7 @@ scales: { xAxes: [{ offset: true, - gridLines: { color: "#505050" }, + gridLines: { color: color.fusion._500 }, ticks: { callback: function (value, index, ticks) { return value @@ -547,36 +576,115 @@ options: eveWeekElecChartOptions }) } + // 圖表 - 異常與賦歸圖表 (圓餅圖) + function chartErrRec(labels,datas) { + let errRecChartCanvas = ctx = $('#errRecChart').get(0).getContext('2d'); + + let errRecChartData = { + labels: labels, + datasets: [ + { + label: '數量', + unit: '個', + fill: true, + backgroundColor: [color.danger._500, color.info._300], + //data: errRecArr.map(x => parseInt((Math.random() * (1500 - 300) + 300))), + data: datas, + } + ] + } + + let errRecChartOptions = { + //maintainAspectRatio: false, + responsive: true, + legend: { + display: true, + }, + tooltips: { + enabled: true, + }, + + + } + + // This will get the first returned node in the jQuery collection. + let errRecChart = new Chart(errRecChartCanvas, { + type: "pie", + data: errRecChartData, + options: errRecChartOptions + }) + } + + // 圖表 - 異常確認與未確認圖表 (圓餅圖) + function chartErrChk(labels, datas) { + + let errChkChartCanvas = ctx = $('#errChkChart').get(0).getContext('2d'); + + let errChkChartData = { + labels: labels, + datasets: [ + { + label: '數量', + unit: '個', + fill: true, + backgroundColor: [color.danger._500, color.info._300], + //data: errChkArr.map(x => parseInt((Math.random() * (1500 - 300) + 300))), + data: datas, + } + ] + } + + let errChkChartOptions = { + //maintainAspectRatio: false, + responsive: true, + legend: { + display: true, + }, + tooltips: { + enabled: true, + }, + + + } + + // This will get the first returned node in the jQuery collection. + let errChkChart = new Chart(errChkChartCanvas, { + type: "pie", + data: errChkChartData, + options: errChkChartOptions + }) + } //從 baja 訂閱 左下角各系統小類異常狀態 function getAlarmSub() { var tipEle = ''; - if (sysSubList.length != 0) { - tipEle = YT.Alert.Tip("資料讀取中...","show"); - } + //if (sysSubList.length != 0) { + // tipEle = YT.Alert.Tip("資料讀取中...","show"); + //} $(`.data-group i.fa-lightbulb-on`).removeClass("blink"); //debugger $.each(sysSubList, (idx, sysSubObj) => { - let myBaja = new subscriptionAlarms(); - let ordPath = { - "building_tag": pageAct.buiTag, - "system_tag": sysSubObj.sysMainTag, - "name_tag": sysSubObj.sysSubTag, - }; - console.log("ordPath",ordPath) - myBaja.setSubscribeAlarmsByBql(ordPath); - myBaja.setSubscribeAlarmsCallBack((data) => { - if (data.sourceState == "Offnormal") { - let devNum = data.system.replaceAll("_", "/"); + //let myBaja = new subscriptionAlarms(); + //let ordPath = { + // "building_tag": pageAct.buiTag, + // "system_tag": sysSubObj.sysMainTag, + // "name_tag": sysSubObj.sysSubTag, + //}; + //console.log("ordPath",ordPath) + //myBaja.setSubscribeAlarmsByBql(ordPath); + //myBaja.setSubscribeAlarmsCallBack((data) => { + // if (data.sourceState == "Offnormal") { + // let devNum = data.system.replaceAll("_", "/"); - $(`.dev-group[data-id*='${devNum}'] i.fa-lightbulb-on`).addClass("blink"); - } - }) - myBaja.setSubscribeAlarmEndCallBack((data) => { - if (idx == sysSubList.length - 1) { - $(tipEle.ele).YTAlert().hide(); - } - }) + // $(`.dev-group[data-id*='${devNum}'] i.fa-lightbulb-on`).addClass("blink"); + // } + //}) + //myBaja.setSubscribeAlarmEndCallBack((data) => { + // console.log(idx,sysSubList.length) + // if (idx == sysSubList.length - 1) { + // $(tipEle.ele).YTAlert().hide(); + // } + //}) }) diff --git a/Frontend/_sysElevator.html b/Frontend/_sysElevator.html index fa591f9..d376b32 100644 --- a/Frontend/_sysElevator.html +++ b/Frontend/_sysElevator.html @@ -897,87 +897,91 @@ myBaja = new subscriptionDevices(); myBaja.setSubscribeDevicesByBql(subOrdPath); myBaja.setSubscribeDevicesCallBack(function (data) { - function getValueByName(pointName) { - return data.point_name == pointName ? data.value : null; - } - - function actLightByPoi(pointName, selector) { - if (getValueByName(pointName) == "trueText") { - $(selector).removeClass("bg-secondary").addClass("bg-orange"); - $(selector).parent("div").prev().find("label").text("運轉中"); - } else if (getValueByName(pointName) == "falseText") { - $(selector).removeClass("bg-orange").addClass("bg-secondary"); - $(selector).parent("div").prev().find("label").text("未動作"); + try { + function getValueByName(pointName) { + return data.point_name == pointName ? data.value : null; } - } - if (allDevList.length == 0) { - return false; - } - data.device_number = data.device_number_full; - let matchDevice = allDevList.filter(x => x.device_number == data.device_number)[0]; - let master = matchDevice.device_number.split("_")[5]; - //狀態 - if (data.point_name == "ST") { - $(`#${matchDevice.device_number}_card [name=devStatus]`).text(data.value); - //若為異常(match資料庫點位值)且後台有設定為閃爍 - if (getValueByName("ST") == matchDevice.device_error_point_value) { - $(`#${matchDevice.device_number}_card`).addClass("light-flash") + function actLightByPoi(pointName, selector) { + if (getValueByName(pointName) == "trueText") { + $(selector).removeClass("bg-secondary").addClass("bg-orange"); + $(selector).parent("div").prev().find("label").text("運轉中"); + } else if (getValueByName(pointName) == "falseText") { + $(selector).removeClass("bg-orange").addClass("bg-secondary"); + $(selector).parent("div").prev().find("label").text("未動作"); + } } - } - //現在樓層 - if (data.point_name == "CP") { - $(`#${matchDevice.device_number}_card [name=curFloor]`).text(data.value); - } - if (data.point_name == "RD") { - //往上或往下 - if (getValueByName("RD") == "UP") { - $(`#${matchDevice.device_number}_card [name=downFloArrow]`).removeClass("light-flash-c"); - $(`#${matchDevice.device_number}_card [name=upFloArrow]`).addClass("light-flash-c"); - } else if (getValueByName("RD") == "DOWN") { - $(`#${matchDevice.device_number}_card [name=upFloArrow]`).removeClass("light-flash-c"); - $(`#${matchDevice.device_number}_card [name=downFloArrow]`).addClass("light-flash-c"); - } else { - $(`#${matchDevice.device_number}_card [name=upFloArrow]`).removeClass("light-flash-c"); - $(`#${matchDevice.device_number}_card [name=downFloArrow]`).removeClass("light-flash-c"); + if (allDevList.length == 0) { + return false; } + data.device_number = data.device_number_full; + let matchDevice = allDevList.filter(x => x.device_number == data.device_number)[0]; + let master = matchDevice.device_number.split("_")[5]; + //狀態 + if (data.point_name == "ST") { + $(`#${matchDevice.device_number}_card [name=devStatus]`).text(data.value); + //若為異常(match資料庫點位值)且後台有設定為閃爍 + if (getValueByName("ST") == matchDevice.device_error_point_value) { + $(`#${matchDevice.device_number}_card`).addClass("light-flash") + } + } + //現在樓層 + if (data.point_name == "CP") { + $(`#${matchDevice.device_number}_card [name=curFloor]`).text(data.value); + } + + if (data.point_name == "RD") { + //往上或往下 + if (getValueByName("RD") == "UP") { + $(`#${matchDevice.device_number}_card [name=downFloArrow]`).removeClass("light-flash-c"); + $(`#${matchDevice.device_number}_card [name=upFloArrow]`).addClass("light-flash-c"); + } else if (getValueByName("RD") == "DOWN") { + $(`#${matchDevice.device_number}_card [name=upFloArrow]`).removeClass("light-flash-c"); + $(`#${matchDevice.device_number}_card [name=downFloArrow]`).addClass("light-flash-c"); + } else { + $(`#${matchDevice.device_number}_card [name=upFloArrow]`).removeClass("light-flash-c"); + $(`#${matchDevice.device_number}_card [name=downFloArrow]`).removeClass("light-flash-c"); + } + } + + //消防回歸 + actLightByPoi("FE", "#emerReturn"); + //群控故障 + actLightByPoi("GCM", "#groConFail"); + //緊急電源 + actLightByPoi("EPS", "#emerPower"); + //火災回歸 + actLightByPoi("FER", "#fireReturn"); + //地震管制 + actLightByPoi("EER", "#earQuaCon"); + + + //將訂閱值塞入 subSeviceData + if (subSeviceData.findIndex(x => x.device_number == matchDevice.device_number) == -1) { + let obj = {}; + obj.device_number = matchDevice.device_number; + subSeviceData.push(obj) + } + + let subData = subSeviceData.filter(x => x.device_number == matchDevice.device_number)[0]; + + if (subData) { + subData[data.point_name] = data.value; + } + // 設置燈色、卡片閃爍 + setLightColor(); + // Card table 更新 + subDeviceSetTable(matchDevice.device_number); + // 重繪 電梯管理 列表 + reloadEleManTable(setEleManTabDataFromBaja()); + // 電梯管理 detail + subDeviceSetEleManDet(matchDevice.device_number); + // 電梯管理 不服務樓層 detail + subDeviceSetEleManNotSerFloor(master); + } catch (e) { + console.log("e",e) } - - //消防回歸 - actLightByPoi("FE", "#emerReturn"); - //群控故障 - actLightByPoi("GCM", "#groConFail"); - //緊急電源 - actLightByPoi("EPS", "#emerPower"); - //火災回歸 - actLightByPoi("FER", "#fireReturn"); - //地震管制 - actLightByPoi("EER", "#earQuaCon"); - - - //將訂閱值塞入 subSeviceData - if (subSeviceData.findIndex(x => x.device_number == matchDevice.device_number) == -1) { - let obj = {}; - obj.device_number = matchDevice.device_number; - subSeviceData.push(obj) - } - - let subData = subSeviceData.filter(x => x.device_number == matchDevice.device_number)[0]; - - if (subData) { - subData[data.point_name] = data.value; - } - // 設置燈色、卡片閃爍 - setLightColor(); - // Card table 更新 - subDeviceSetTable(matchDevice.device_number); - // 重繪 電梯管理 列表 - reloadEleManTable(setEleManTabDataFromBaja()); - // 電梯管理 detail - subDeviceSetEleManDet(matchDevice.device_number); - // 電梯管理 不服務樓層 detail - subDeviceSetEleManNotSerFloor(master); }); myBaja.setSubscribeDeviceEndCallBack(function (data) { @@ -1084,7 +1088,9 @@ // Card - 設置列表中訂閱內容 function subDeviceSetTable(devNum) { - + if (allDevList.filter(x => !x.device_number).length > 0) { + debugger + } let subData = subSeviceData.filter(x => x.device_number == devNum)[0] let matchDevice = allDevList.filter(x => x.device_number == devNum)[0]; if (!subData) { @@ -1111,6 +1117,8 @@ elevObj.setElevFloor(matchDevice.device_number, subData["CP"]); } + + if (isFirstLoad3D == false && elev3DObj.length != 0) { let elevObj = elev3DObj.filter(x => x.nodeId == elev3DBind[devNum])[0]; if (elevObj && elevObj.id) { @@ -1118,7 +1126,7 @@ elevObj.obj.movElevator(); } } - + console.log("console:", subData, devNum, allDevList) elevObj.setEleMovStatus(matchDevice.device_number, subData["RD"] == "UP" ? 1 : subData["RD"] == "DOWN" ? 2 : 0); //現在樓層 if (subData["CP"]) { diff --git a/Frontend/index.html b/Frontend/index.html index 7d448b8..5b63bc3 100644 --- a/Frontend/index.html +++ b/Frontend/index.html @@ -1466,10 +1466,10 @@ License: You must have a valid license purchased only from wrapbootstrap.com (li
首頁 + + + + -->
@@ -1525,11 +1525,11 @@ License: You must have a valid license purchased only from wrapbootstrap.com (li Dr. Codex Lantern + Me + -->
- + 登出 @@ -2030,7 +2030,6 @@ License: You must have a valid license purchased only from wrapbootstrap.com (li
-