From aecb795124c89e7cf76f0a17441e46166493c9a8 Mon Sep 17 00:00:00 2001 From: Celeste Date: Fri, 17 Feb 2023 11:01:29 +0800 Subject: [PATCH] =?UTF-8?q?[=E5=89=8D=E5=8F=B0]=20=E9=A6=96=E9=A0=81=20?= =?UTF-8?q?=E7=B3=BB=E7=B5=B1=E5=A4=A7=E9=A1=9E=E7=95=B0=E5=B8=B8=E6=A8=A3?= =?UTF-8?q?=E5=BC=8F=E4=BF=AE=E6=AD=A3=20|=20=E7=B3=BB=E7=B5=B1=E7=9B=A3?= =?UTF-8?q?=E6=8E=A7=20=E6=A8=93=E5=B1=A4=E5=B0=8F=E5=8D=A1=E7=89=87?= =?UTF-8?q?=E5=A4=A7=E5=B0=8F=E4=BF=AE=E6=AD=A3?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- Frontend/_dashboard.html | 2435 ++++++++++++++++++++++----------- Frontend/_sysMonAll.html | 16 +- Frontend/_sysMonFloor.html | 169 +-- Frontend/index.html | 169 +-- Frontend/js/n4js/alarmbaja.js | 4 +- 5 files changed, 1828 insertions(+), 965 deletions(-) diff --git a/Frontend/_dashboard.html b/Frontend/_dashboard.html index fb0460e..c263940 100644 --- a/Frontend/_dashboard.html +++ b/Frontend/_dashboard.html @@ -1,856 +1,1713 @@ 
-
-
- +
+
+ -
+
-
-
-
-
-
-
-

- -- - 今日用電量 kWH -

-
- -
-
-
-
-

- -- - 昨日用電量 kWH -

-
- -
-
-
-
-
-

- 昨日／今日用電比較 -

-
-
-
-
- +
+
+
+
+
+

+ -- + 今日用電量 kWH +

+
+ +
-
- +
+
+
+

+ -- + 昨日用電量 kWH +

+
+ +
-
-
-
-
-
-
-
-
-
-
-
-

- -- - 即時功率 kW -

-
- -
-
-
-
-
-

- -- - 即時契約容量占比 % -

-
- -
-
-
-
-
-

- 本週／上週用電比較 -

-
-
-
- +
+
+ +
-
--> -
-
- -
-
-
-
-
+
+
+
+
+
+

+ -- + 即時功率 kW +

+
+ +
+
+
+
+
+

+ -- + 即時契約容量占比 % +

+
+ +
+
+
+
+
+

+ 本週／上週用電比較 +

+
+
+
+ +
+ +
-
-
-
- -
+
+
+
+
+
+
-
-
-
-
-
-

- 異常狀態 -

-
-
-
-
- -
-
- -
-
-
-
-
-
-
-
-

- 工單進度 -

-
-
-
+
+
+
-
- -
-
- -
-
-
-
+ +
+
+
+
+
+

+ 異常狀態 +

+
+
+
+
+ +
+
+ +
+
+
+
+
+
+
+
+

+ 工單進度 +

+
+
+
+ +
+ +
+
+ +
+
+
+
+
+
+
-
+
+
+ - // 昨日用電量 - getElectricMeterDayDataByBaja(devNum + "_KWH", n4Sup, yesterday, today, (data) => { - let result = data?.data[0]?.sum; - result = result ? parseFloat(result).toFixed(2) : 0; - $("#yesUseElec").text(result); - chkBajaLoaded(); - }) +
- // 本週與上週用電量 (每天) - getElectricMeterDayDataByBaja(devNum + "_KWH", n4Sup, 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, 1 - 7) <= strToDate(x.timestamp.$cEncStr)); - let prevWeekData = data.data.filter(x => strToDate(displayDate(new Date(), "date"), null, 1 - 14) <= strToDate(x.timestamp.$cEncStr) && strToDate(new Date(), null, 1 - 7) >= strToDate(x.timestamp.$cEncStr)); +
+
+
+
+
+
+

+ -- + 今日用電量 kWH +

+
+ +
+
+
+
+
+

+ -- + 昨日用電量 kWH +

+
+ +
+
+
+
+
+

+ 昨日／今日用電比較 +

+
+
+
+
+ +
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+

+ -- + 即時功率 kW +

+
+ +
+
+
+
+
+

+ -- + 即時契約容量占比 % +

+
+ +
+
+
+
+
+

+ 本週／上週用電比較 +

+
+
+
+ +
+ +
- chartEveWeeksElec(curWeekData, prevWeekData) - chkBajaLoaded(); - }) +
+
+
+
+
+
+
- // 異常數量與復歸數量 - getAlarmCountByBaja((aData) => { - chartDataCnt.alarmCnt = aData.count; - chkBajaLoaded(); - }) - getRecoverCountByBaja((rData) => { - chartDataCnt.recCnt = rData.count; - chkBajaLoaded(); - }) - // 異常數量與復歸數量 - getCheckedAckedCountByBaja((data) => { - chartDataCnt.chkedErrCnt = data.count; - chkBajaLoaded(); - }) +
+
+
- getUnCheckedAckedCountByBaja((uData) => { - chartDataCnt.unChkedErrCnt = uData.count; - chkBajaLoaded(); - }) - } +
+
- function chkBajaLoaded() { - loadedCnt++; +
+
+
+
+
+

+ 異常狀態 +

+
+
+
+
+ +
+
+ +
+
+
+
+
+
+
+
+

+ 工單進度 +

+
+
+
- if (loadedCnt == 9) { - chartErrRec(["異常數量", "復歸數量"], [chartDataCnt.alarmCnt, chartDataCnt.recCnt]); - chartErrChk(["已確認異常", "未確認異常"], [chartDataCnt.chkedErrCnt, chartDataCnt.unChkedErrCnt]); - chartWorOrdErr(); - chartWorOrdFin(); - - $(loadEle).Loading("close"); - } - } - - // 圖表 - 今天與昨天用電量 (長條圖) - function chartEveDaysElec(todayData, yesData) { - let eveDayElecChartCanvas = $('#eveDayElecChart').get(0).getContext('2d'); - 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); - let eveDayElecChartData = { - labels: todayData?.data.map(x => x.timestamp.$time.$hour), - datasets: [ - { - id: "today", - type: "bar", - label: '今日用電量', - fill: false, - backgroundColor: color.success._500, - borderColor: color.success._500, - pointColor: color.success._500, - pointBackgroundColor: color.main1, - data: todayData?.data.map(x => x.sum), - order: 1, - }, - { - id: "yesterday", - type: "bar", - label: '昨日用電量', - fill: false, - backgroundColor: color.info._100, - borderColor: color.info._100, - pointColor: color.info._100, - pointBackgroundColor: color.info._100, - data: yesData?.data.map(x => x.sum), - order: 2, - } - ] - } - - let eveDayElecChartOptions = { - maintainAspectRatio: false, - responsive: true, - legend: { - display: true, - }, - scales: { - x: { - offset: true, - grid: { color: color.fusion._500 }, - }, - y: { - beginAtZero: true, - ticks: { - min: 0, - }, - } - }, - tooltips: { - callbacks: { - label: function (tooltipItem) { - let isTodayOrYes = tooltipItem.datasetIndex == 1 ? "昨日" : "今日"; - return isTodayOrYes + "用電量 : " + tooltipItem.value + " kWH"; - }, - title: function (tooltipItem) { - let result = tooltipItem[0].xLabel.toString().padStart(2, "0") + ":00"; - return result; - } - } - }, - } - - if (eveDayElecChart == null) { - eveDayElecChart = new Chart(eveDayElecChartCanvas, { - data: eveDayElecChartData, - options: eveDayElecChartOptions - }) - } else { - eveDayElecChart.data.datasets.forEach((dataset) => { - if (dataset.order == 1) { - dataset.data = todayData?.data.map(x => x.sum); - } else { - dataset.data = yesData?.data.map(x => x.sum); - } - }); - } - - - } - - // 圖表 - 這週與上週用電量 (長條圖) - function chartEveWeeksElec(curWeekData, prevWeekData) { - // console.log(curWeekData.map(x => x.sum),prevWeekData.map(x => x.sum)) - let eveWeekElecChartCanvas = $('#eveWeekElecChart').get(0).getContext('2d'); - - let eveWeekElecChartData = { - labels: curWeekData.map(x => dayToChiDay(strToDate(x.timestamp.$cEncStr, "day"))), - datasets: [ - { - id: "today", - type: "bar", - label: '本週用電量', - fill: false, - backgroundColor: color.success._500, - borderColor: color.success._500, - pointColor: color.success._500, - pointBackgroundColor: color.success._500, - data: curWeekData.map(x => x.sum), - order: 1, - }, - { - id: "yesterday", - type: "bar", - label: '上週用電量', - fill: false, - backgroundColor: color.info._100, - borderColor: color.info._100, - pointColor: color.info._100, - pointBackgroundColor: color.info._100, - data: prevWeekData.map(x => x.sum), - order: 2, - } - ] - } - // console.log(eveWeekElecChartData) - let eveWeekElecChartOptions = { - maintainAspectRatio: false, - responsive: true, - legend: { - display: true, - }, - scales: { - x: { - offset: true, - grid: { color: color.fusion._500 }, - }, - y: { - beginAtZero: true, - ticks: { - min: 0, - }, - } - }, - tooltips: { - callbacks: { - label: function (tooltipItem) { - let isTodayOrYes = tooltipItem.datasetIndex == 1 ? "上週" : "本週"; - return isTodayOrYes + "用電量 : " + tooltipItem.value + " kWH"; - }, - title: function (tooltipItem) { - console.log(tooltipItem) - let result = tooltipItem[0]?.xLabel.toString(); - return result; - } - } - }, - } - // console.log(eveWeekElecChartOptions) - if (eveWeekElecChart == null) { - eveWeekElecChart = new Chart(eveWeekElecChartCanvas, { - data: eveWeekElecChartData, - options: eveWeekElecChartOptions - }) - // console.log(eveWeekElecChart,eveWeekElecChartData, eveWeekElecChartOptions) - } else { - eveWeekElecChart.data.datasets.forEach((dataset) => { - if (dataset.order == 1) { - dataset.data = curWeekData.map(x => x.sum); - } else { - dataset.data = prevWeekData.map(x => x.sum); - } - }); - } - } - - // 圖表 - 異常與復歸圖表 (圓餅圖) - 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: datas, - } - ] - } - - let errRecChartOptions = { - maintainAspectRatio: false, - responsive: true, - legend: { - display: true, - }, - tooltips: { - enabled: true, - }, - } - - // This will get the first returned node in the jQuery collection. - if (errRecChart == null) { - errRecChart = new Chart(errRecChartCanvas, { - type: "pie", - data: errRecChartData, - options: errRecChartOptions - }) - } else { - errRecChart.data.datasets.forEach((dataset) => { - dataset.data = datas; - }); - } - } - - // 圖表 - 異常確認與未確認圖表 (圓餅圖) - 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: datas, - } - ] - } - - let errChkChartOptions = { - maintainAspectRatio: false, - responsive: true, - legend: { - display: true, - }, - tooltips: { - enabled: true, - }, - } - - if (errChkChart == null) { - errChkChart = new Chart(errChkChartCanvas, { - type: "pie", - data: errChkChartData, - options: errChkChartOptions - }) - } else { - errChkChart.data.datasets.forEach((dataset) => { - dataset.data = datas; - }); - } - - } - - // 圖表 - 異常未派工與異常已派工 (圓環圖) - function chartWorOrdErr(labels, datas) { - labels = ["異常未派工", "異常已派工"] - datas = [5, 9] - let worOrdErrChartCanvas = ctx = $('#worOrdErrChart').get(0).getContext('2d'); - - let worOrdErrChartData = { - labels: labels, - datasets: [ - { - label: '數量', - unit: '個', - fill: true, - backgroundColor: [color.danger._500, color.info._300], - data: datas, - } - ] - } - - let worOrdErrChartOptions = { - maintainAspectRatio: false, - responsive: true, - legend: { - display: true, - }, - tooltips: { - enabled: true, - }, - - - } - - if (worOrdErrChart == null) { - worOrdErrChart = new Chart(worOrdErrChartCanvas, { - type: "doughnut", - data: worOrdErrChartData, - options: worOrdErrChartOptions - }) - } else { - worOrdErrChart.data.datasets.forEach((dataset) => { - dataset.data = datas; - }); - } - - } - - // 圖表 - 工單已完成與工單未完成 (圓環圖) - function chartWorOrdFin(labels, datas) { - labels = ["工單已完成", "工單未完成"] - datas = [5, 9] - let worOrdFinChartCanvas = ctx = $('#worOrdFinChart').get(0).getContext('2d'); - - let worOrdFinChartData = { - labels: labels, - datasets: [ - { - label: '數量', - unit: '個', - fill: true, - backgroundColor: [color.danger._500, color.info._300], - data: datas, - } - ] - } - - let worOrdFinChartOptions = { - maintainAspectRatio: false, - responsive: true, - legend: { - display: true, - }, - tooltips: { - enabled: true, - }, - - - } - - if (worOrdFinChart == null) { - worOrdFinChart = new Chart(worOrdFinChartCanvas, { - type: "doughnut", - data: worOrdFinChartData, - options: worOrdFinChartOptions - }) - } else { - worOrdFinChart.data.datasets.forEach((dataset) => { - dataset.data = datas; - }); - } - - } - - // 從 baja 訂閱 左下角各系統小類異常狀態 - function getAlarmSub(data) { - $.each(data.data, (idx, alaObj) => { - if (alaObj.alarmClass.indexOf("_") != -1) { - let mainSubSys = alaObj.alarmClass.split("_").slice(0, 2).join("/"); - const img = $(`.btn-group.dev-group[data-id*='${mainSubSys}'] img`)[0].src.split('.') - const { length } = img - img[length - 1] = 'gif' - $(`.btn-group.dev-group[data-id*='${mainSubSys}'] img`)[0].src = img.join('.') - // $(`.btn-group.dev-group[data-id*='${mainSubSys}'] img`).addClass("blink"); - } - }) - $(`.dev-group img.blink`).each((idx, ele) => { - let devPath = $(ele).parents(".dev-group").data("id"); - let sysPath = devPath.split("/").slice(3, 5).join("/"); - let alaDevPath = data.data.map(x => x.alarmClass?.split("_").slice(0, 2).join("/")); - if (alaDevPath.indexOf(sysPath) == -1) { - const img = $(`.btn-group.dev-group[data-id*='${mainSubSys}'] img`)[0].src.split('.') - const { length } = img - img[length - 1] = 'png' - $(`.btn-group.dev-group[data-id*='${mainSubSys}'] img`)[0].src = img.join('.') - // $(ele).removeClass("blink"); - } - }) - } +
+ +
+
+ +
+
+
+
+
+
+
+
- function show3DModel() { - launchViewerNoTools(pageAct.urn, (viewer) => { - let elevOption = { - selector: "#forgeViewer", - viewer: viewer, - ordPath: { - "area_tag": pageAct.AreaTag, - "building_tag": pageAct.buiTag, - }, - } +
+ \ No newline at end of file diff --git a/Frontend/_sysMonAll.html b/Frontend/_sysMonAll.html index 4c12cd9..6b01074 100644 --- a/Frontend/_sysMonAll.html +++ b/Frontend/_sysMonAll.html @@ -47,7 +47,7 @@ $(function () { getBuildMenu((arr, data) => { - console.log(arr) + // console.log(arr) buildMenuData = data; if (arr.indexOf(4) != -1) { getFloDevList(arr[0] == 4 ? "left" : "right"); @@ -267,7 +267,7 @@ } else { let strHtml = ``; $.each(res.data, (index, floObj) => { - strHtml += `
` + strHtml += `
` strHtml += `` strHtml += `
` $.each(floObj.device_list, (index2, devObj) => { @@ -362,11 +362,12 @@ // Card 即時狀態 function drawStateTabBlo(devNum) { let devPath = devNum.replaceAll("_", "/"); - let position = $(`.card.device-wrap[data-number=${devNum}]`).data("position"); + let position = $(`.card.device-wrap[data-number=${devNum}]`).data("position") || "left"; let width = buildMenuData[position + "_icon_click_url_width"] ? buildMenuData[position + "_icon_click_url_width"] + "px" : "100%"; let height = buildMenuData[position + "_icon_click_url_height"] ? buildMenuData[position + "_icon_click_url_height"] + "px" : "100%"; - let strHtml = `
- + + let strHtml = `
+
` return strHtml; } @@ -538,12 +539,12 @@ } function setHotspotPoint(myDataList = []) { - console.log(myDataList) + // console.log(myDataList) getHopspotPoint(myDataList); } function setLightPoint(myDataList = []) { - console.log(myDataList) + // console.log(myDataList) getLightData(myDataList); } @@ -580,7 +581,6 @@ let name = allDevList.filter(x => x.device_guid == devObj.device_guid)[0]?.full_name; devObj.full_name = name; parentEle = crePosPopover(position, devObj); - $(parentEle).click(); }) diff --git a/Frontend/_sysMonFloor.html b/Frontend/_sysMonFloor.html index 3a12c22..51182ce 100644 --- a/Frontend/_sysMonFloor.html +++ b/Frontend/_sysMonFloor.html @@ -1,6 +1,6 @@  @@ -15,7 +15,7 @@
-->
-
+
@@ -35,12 +35,14 @@ var global_emergency_alarm_device_number = []; var zoomToggle = 3; $(function () { + console.log("floor") drawHeatBar(); getHotspotPoint(() => { show3DModel(pageAct.urn); }); initChart(); getFloData(); + subDevice(); }) @@ -164,7 +166,7 @@ function initChart() { let chartDom = $("#floChart")[0]; - floChart = echarts.init(chartDom, null, { width: 'auto'}); + floChart = echarts.init(chartDom, null, { width: 'auto' }); } function chartHandler(url) { @@ -182,12 +184,14 @@ tooltip: { formatter: function (params) { if (params.data.device_node_guid != undefined && params.data.device_node_guid != null && params.data.device_node_guid != "") { - return `名稱：${params.data.device_node_full_name}
- Guid：${params.data.device_node_guid}` + return `
+ 名稱：${params.data.device_node_full_name}
+ Guid：${params.data.device_node_guid} +
` } else { - return `名稱：${params.data.full_name}
- Guid：${params.data.device_guid}` + return `
名稱：${params.data.full_name}
+ Guid：${params.data.device_guid}
` } } }, @@ -327,7 +331,6 @@ let position = [params.event.event.clientX, params.event.event.clientY]; data._dbId = data._dbId ?? null; parentEle = crePosPopover(position, data); - $(parentEle).click(); } else { $(parentEle).YTTooltip("hide"); @@ -338,7 +341,7 @@ /*console.log("click", params);*/ var pixelPoint = [params.offsetX, params.offsetY]; var dataPoint = floChart.convertFromPixel({ geoIndex: 0 }, pixelPoint); - + if (!(params?.target?.shape?.symbolType == "circle")) { $(parentEle).YTTooltip("hide"); } @@ -370,7 +373,7 @@ (series.data ?? []).forEach(function (point) { let dbid = obj.myDataList.filter(x => x.device_number == point.device_number)[0]?._dbId; point._dbId = dbid; - currentData.forEach(function (cData) { + currentData.forEach(function (cData) { if (cData.device_guid == point.device_guid) { cData._dbId = dbid; } @@ -432,55 +435,55 @@ } //baja 訂閱設備 function subDevice() { - - let floMyBaja = new subscriptionDevices(); - var ordPath = { - "area_tag": pageAct.AreaTag, - "building_tag": pageAct.buiTag, - "system_tag": pageAct.sysMainTag, - "name_tag": pageAct.sysSubTag, + + let floMyBaja = new subscriptionDevices(); + var ordPath = { + "area_tag": pageAct.AreaTag, + "building_tag": pageAct.buiTag, + "system_tag": pageAct.sysMainTag, + "name_tag": pageAct.sysSubTag, + } + floMyBaja.setSubscribeDevicesByBql(ordPath); + floMyBaja.setSubscribeDevicesCallBack(function (data) { + let matchDevice = currentData.filter(x => x.device_number == data.device_number_full)[0]; + if (!matchDevice) { + return false; } - floMyBaja.setSubscribeDevicesByBql(ordPath); - floMyBaja.setSubscribeDevicesCallBack(function (data) { - let matchDevice = currentData.filter(x => x.device_number == data.device_number_full)[0]; - if (!matchDevice) { - return false; - } - let norDevPoiName = matchDevice.device_normal_point_name; - let cloDevPoiName = matchDevice.device_close_point_name; - let errDevPoiName = matchDevice.device_error_point_name; + let norDevPoiName = matchDevice.device_normal_point_name; + let cloDevPoiName = matchDevice.device_close_point_name; + let errDevPoiName = matchDevice.device_error_point_name; - if (data.point_name == "Temp") { - heatMap?.changeTemp(data.device_number_full, !isNaN(parseInt(data.value)) ? parseInt(data.value) : 0); - let devIdx = currentData.findIndex(x => x.device_number == data.device_number_full); - currentData[devIdx]._temp = !isNaN(parseInt(data.value)) ? parseInt(data.value) : 0; - } + if (data.point_name == "Temp") { + heatMap?.changeTemp(data.device_number_full, !isNaN(parseInt(data.value)) ? parseInt(data.value) : 0); + let devIdx = currentData.findIndex(x => x.device_number == data.device_number_full); + currentData[devIdx]._temp = !isNaN(parseInt(data.value)) ? parseInt(data.value) : 0; + } - if (data.point_name == norDevPoiName && data.value == matchDevice.device_normal_point_value) { - //顯示正常燈號 - $(`#${matchDevice.device_number}_status`).attr("data-light-type", "normal").data("light-type", "normal"); - } else if (data.point_name == cloDevPoiName && data.value == matchDevice.device_close_point_value) { - $(`#${matchDevice.device_number}_status`).attr("data-light-type", "close").data("light-type", "close"); - } else if (data.point_name == errDevPoiName && data.value == matchDevice.device_error_point_value) { - $(`#${matchDevice.device_number}_status`).attr("data-light-type", "error").data("light-type", "error"); - } - - }); + if (data.point_name == norDevPoiName && data.value == matchDevice.device_normal_point_value) { + //顯示正常燈號 + $(`#${matchDevice.device_number}_status`).attr("data-light-type", "normal").data("light-type", "normal"); + } else if (data.point_name == cloDevPoiName && data.value == matchDevice.device_close_point_value) { + $(`#${matchDevice.device_number}_status`).attr("data-light-type", "close").data("light-type", "close"); + } else if (data.point_name == errDevPoiName && data.value == matchDevice.device_error_point_value) { + $(`#${matchDevice.device_number}_status`).attr("data-light-type", "error").data("light-type", "error"); + } + + }); + + floMyBaja.setSubscribeDeviceEndCallBack(function (data) { + endPageLoading(); + if (data.findIndex(x => x.point_name == "Temp") != -1) { + // 顯示溫度條 + showHeat("[name=forgeHeatBar]"); + } + }); - floMyBaja.setSubscribeDeviceEndCallBack(function (data) { - endPageLoading(); - if (data.findIndex(x => x.point_name == "Temp") != -1) { - // 顯示溫度條 - showHeat("[name=forgeHeatBar]"); - } - }); - } function drawHeatBar() { $("#forgeHeatBarDiv").html(setTopHeatBar()); } - + // 電梯 3D 位置呈現 function set3DElevPos(viewer) { @@ -623,7 +626,7 @@ // 重設平面圖設備資料 function resetData() { - const scatter_symbol_convertData = function (data,zoom) { //正常、關閉排除CCVT(圓點) + const scatter_symbol_convertData = function (data, zoom) { //正常、關閉排除CCVT(圓點) let res = [], temp = []; data.forEach(function (item, index) { if (global_emergency_alarm_device_number != undefined @@ -766,7 +769,7 @@ tempData = Object.assign(tempData, oldTarObj) } }) - + temp.map(function (item) { var obj = { @@ -787,8 +790,8 @@ res.push(obj); }); - - + + return res; } @@ -912,7 +915,7 @@ //如果有子節點，則只針對子節點操作 if (item.device_nodes != undefined && item.device_nodes != null && item.device_nodes.length > 0) { item.device_nodes.forEach(function (item_node, item_node_index) { - + //添加父節點相關資訊 item_node.device_system_category_layer3 = item.device_system_category_layer3; item_node.device_error_color = item.device_error_color; @@ -1006,13 +1009,13 @@ }] }); } else { - + floChart.setOption({ series: [{ symbolOffset: [10, 10], - + data: scatter_symbol_convertData(currentData, zoom), //正常、關閉(圓點) - + }, { data: scatter_icon_convertData(currentData) //正常、關閉(icon) }, { @@ -1028,7 +1031,7 @@ } function getNextFloor(floGuid = null) { - + let url = baseApiUrl + "/api/Device/GetNextFloor"; objSendData.Data = { floor_guid: floGuid } let result = ""; @@ -1049,7 +1052,7 @@ launchViewerForHotspot(urn, (viewer, nodeIds) => { let nextFloor = getNextFloor(pageAct.floGuid); let curFloTag = pageAct.floTag; - + if (!nextFloor) { toast_warning("超出樓層範圍"); return; @@ -1085,28 +1088,28 @@ } function setHeatMap() { - console.log("currentData", currentData) - let devices = currentData.map(x => { - return { - roomDbId: !isNaN(parseInt(x.room_dbid)) ? parseInt(x.room_dbid) : -1, - id: x.device_number, - position: isJSON(x.device_coordinate_3d) ? JSON.parse(x.device_coordinate_3d) : {}, // x: 0, y: 25, z: -2.5 (3.35, -4.81, 12.88 - sensorTypes: ["temperature", "humidity"] + if (pageAct.sysMainTag !== "LT") { + let devices = currentData.map(x => { + return { + roomDbId: !isNaN(parseInt(x.room_dbid)) ? parseInt(x.room_dbid) : -1, + id: x.device_number, + position: isJSON(x.device_coordinate_3d) ? JSON.parse(x.device_coordinate_3d) : {}, // x: 0, y: 25, z: -2.5 (3.35, -4.81, 12.88 + sensorTypes: ["temperature", "humidity"] + } + }) + + let option = { + devices: devices, } - }) - let option = { - devices: devices, - } + heatMap = new ADHeatMaps(option); + heatMap.onComplete = () => { - if (pageAct.sysMainTag !== "LT") { - heatMap = new ADHeatMaps(option); - heatMap.onComplete = () => { - $.each(currentData, (idx, dev) => { - heatMap.changeTemp(dev.device_number, dev._temp || 0); - }) + $.each(currentData, (idx, dev) => { + heatMap.changeTemp(dev.device_number, dev._temp || 0); + }) + } } - } } function getHotspotPoint(callback = null) { @@ -1133,7 +1136,7 @@ $.extend(item, data); myDataList.push(item); }) - + setHotspotPoint(myDataList); callback ? callback() : ""; } @@ -1154,7 +1157,7 @@ devObj.full_name = name; parentEle = crePosPopover(position, devObj); $(parentEle).click(); - + let option = floChart.getOption(); option.series.forEach(function (series) { series.data.forEach(function (point) { @@ -1164,7 +1167,7 @@ }); }); floChart.setOption(option); - + }) onEvent("autodesk:clickOut:sprite", "#forgeViewer", function (e) { @@ -1176,7 +1179,7 @@ controlFocusHotspot(cData._dbId, false); }) } - + function chartUnFocusAll() { let option = floChart.getOption(); option.series.forEach(function (series) { @@ -1187,7 +1190,7 @@ floChart.setOption(option); } - // 解除 series 聚焦 + // 解除 series 聚焦 function chartUnFocus(ele) { let devGuid = $(ele).data("id"); let option = floChart.getOption(); diff --git a/Frontend/index.html b/Frontend/index.html index ed3b2d2..7480f5b 100644 --- a/Frontend/index.html +++ b/Frontend/index.html @@ -47,6 +47,8 @@ License: You must have a valid license purchased only from wrapbootstrap.com (li + + -
`; + +
首頁 + + +
`; $.each(res.data, function (i, v) { if (v.authCode == 'PF1') { strHtml += `
- + -
`; +
`; hasMonitor = true; } else { let icon = v.authCode == 'PF2' ? 'fa-chart-pie' : v.authCode == 'PF3' ? 'fa-chart-area' : v.authCode == 'PF4' ? 'fa-chart-line' : v.authCode == 'PF5' ? 'fa-bell' : v.authCode == 'PF6' ? 'fa-server' : v.authCode == 'PF7' ? 'fa-image' : v.authCode == 'PF8' ? 'fa-user' : ''; strHtml += `
- -
${v.subName} - -
`; + +
${v.subName} + +
`; } }); @@ -1690,7 +1693,7 @@ License: You must have a valid license purchased only from wrapbootstrap.com (li } - }, null, "POST", true).send(); + }, null, "POST",true).send(); } function getAlarm() { @@ -1704,7 +1707,7 @@ License: You must have a valid license purchased only from wrapbootstrap.com (li { title: "異常訊息", data: "msgText" }, ]; // 向 niagara 取得告警資料 - getAllDeviceAlarmByBaja(null, now, false, false, function (bajaDatas) { + getDeviceAlarmCardByBaja(null, now, false, false, function (bajaDatas) { let datas = bajaDatas.data; let titleHtml = `異常通知`; let notices = []; @@ -1715,7 +1718,7 @@ License: You must have a valid license purchased only from wrapbootstrap.com (li datas[idx].full_name = allDevices.filter(x => x.device_number == data.devicePath)[0]?.full_name; let div1 = creDiv(["col-12"]); - let button = creBtn("確認", "noticeChkBtn", null, ["btn btn-sm btn-secondary ml-auto col-4"], { uuid: data.uuid }); + let button = creBtn("確認", "noticeChkBtn", null, ["btn btn-sm btn-secondary ml-auto col-4"], {uuid:data.uuid}); let btnDiv = creDiv(["d-flex m-0 gap-5 mt-2"]); btnDiv.append(button); // 繪製 每行告警資訊 diff --git a/Frontend/js/n4js/alarmbaja.js b/Frontend/js/n4js/alarmbaja.js index d15ce11..e8c49cd 100644 --- a/Frontend/js/n4js/alarmbaja.js +++ b/Frontend/js/n4js/alarmbaja.js @@ -93,7 +93,7 @@ function getAlarmByBaja(startDate_millisecond, endDate_millisecond, isRecover, i var _index = 0; var _recoverState = isRecover ? "!= null" : "= null"; var _ackState = isAck ? "= 'acked'" : "= 'unacked'"; - console.log("local:|foxs:|alarm:|bql:select timestamp, ackState, alarmClass, alarmClassDisplayName, alarmValue, alarmData, alarmData.sourceName, uuid, alarmData.msgText, alarmData.numericValue, alarmData.presentValue, alarmData.status, alarmData.toState, normalTime where alarmClass = '" + alarmClass + "' and timestamp.millis > " + startDate_millisecond + " and timestamp.millis < " + endDate_millisecond + " and normalTime " + _recoverState + " and ackState " + _ackState + " order by timestamp asc") + //console.log("local:|foxs:|alarm:|bql:select timestamp, ackState, alarmClass, alarmClassDisplayName, alarmValue, alarmData, alarmData.sourceName, uuid, alarmData.msgText, alarmData.numericValue, alarmData.presentValue, alarmData.status, alarmData.toState, normalTime where alarmClass = '" + alarmClass + "' and timestamp.millis > " + startDate_millisecond + " and timestamp.millis < " + endDate_millisecond + " and normalTime " + _recoverState + " and ackState " + _ackState + " order by timestamp asc") require(['baja!'], function (baja) { baja.Ord.make("local:|foxs:|alarm:|bql:select timestamp, ackTime, ackState, alarmClass, alarmClassDisplayName, alarmValue, alarmData, alarmData.sourceName, uuid, alarmData.msgText, alarmData.numericValue, alarmData.presentValue, alarmData.status, alarmData.toState, normalTime where alarmClass = '" + alarmClass + "' and timestamp.millis > " + startDate_millisecond + " and timestamp.millis < " + endDate_millisecond + " and normalTime " + _recoverState + " and ackState " + _ackState + " order by timestamp asc").get() .then(function (table) { @@ -569,7 +569,7 @@ function getAllDeviceAlarmByBaja(startDate_millisecond, endDate_millisecond, isR if (startDate_millisecond) { startUrl = "timestamp.millis >= " + startDate_millisecond + " and "; } - console.log("local:|foxs:|alarm:|bql:select timestamp, ackTime, priority ,ackState, alarmClass, alarmClassDisplayName, alarmValue, alarmData, alarmData.sourceName, uuid, alarmData.msgText, alarmData.numericValue, alarmData.presentValue, alarmData.status, alarmData.toState, normalTime where " + startUrl + "timestamp.millis <= " + endDate_millisecond + " and normalTime " + _recoverState + " and ackState " + _ackState + " order by timestamp desc"); + //console.log("告警", "local:|foxs:|alarm:|bql:select timestamp, ackTime, priority ,ackState, alarmClass, alarmClassDisplayName, alarmValue, alarmData, alarmData.sourceName, uuid, alarmData.msgText, alarmData.numericValue, alarmData.presentValue, alarmData.status, alarmData.toState, normalTime where " + startUrl + "timestamp.millis <= " + endDate_millisecond + " and normalTime " + _recoverState + " and ackState " + _ackState + " order by timestamp desc"); require(['baja!'], function (baja) { baja.Ord.make("local:|foxs:|alarm:|bql:select timestamp, ackTime, priority ,ackState, alarmClass, alarmClassDisplayName, alarmValue, alarmData, alarmData.sourceName, uuid, alarmData.msgText, alarmData.numericValue, alarmData.presentValue, alarmData.status, alarmData.toState, normalTime where " + startUrl + "timestamp.millis <= " + endDate_millisecond + " and normalTime " + _recoverState + " and ackState " + _ackState + " order by timestamp desc").get()