Merge branch 'master' of https://gitea.mjm-staging.developers-homelab.net/BIMS/BIMS

2023-02-06 10:20:48 +08:00 · 2023-02-06 10:20:48 +08:00 · 125b24f6d5
commit 125b24f6d5
parent a17a11b180 79e0ec3e76
32 changed files with 364 additions and 244 deletions
--- a/Backend/Properties/launchSettings.json
+++ b/Backend/Properties/launchSettings.json
@ -15,8 +15,8 @@
        "ASPNETCORE_ENVIRONMENT": "Development",
        "ASPNETCORE_HOSTINGSTARTUPASSEMBLIES": "Microsoft.AspNetCore.Mvc.Razor.RuntimeCompilation",
        "FORGE_CALLBACK_URL": "http://localhost:3000/api/forge/callback/oauth",
-        "FORGE_CLIENT_ID": "TA3hqsFfzQbNOUXKpldKUKSew4SJ21w5",
-        "FORGE_CLIENT_SECRET": "D002f92d839144f8"
+        "FORGE_CLIENT_ID": "VeGoOgZcAVCBkiThYvLRSVrCTH6TTwyh",
+        "FORGE_CLIENT_SECRET": "Rl1KHJIAI8GSAfhK"
      }
    },
    "Backend": {
--- a/Backend/Views/BuildInfo/Index.cshtml
+++ b/Backend/Views/BuildInfo/Index.cshtml
@ -278,7 +278,7 @@
                    var file = input3Dfile;
                    var formData = new FormData();
                    formData.append('fileToUpload', file);
-                    formData.append('bucketKey', "ta3hqsffzqbnouxkpldkuksew4sj21w5-bims_models");//forge上傳平台-資料夾
+               formData.append('bucketKey', "vegoogzcavcbkithyvlrsvrcth6ttwyh-202302_ibms");//forge上傳平台-資料夾

                    $.ajax({
                        url: '/api/forge/oss/objects',
@ -454,7 +454,7 @@
                    var file = input3Dfile;
                    var formData = new FormData();
                    formData.append('fileToUpload', file);
-                    formData.append('bucketKey', "ta3hqsffzqbnouxkpldkuksew4sj21w5-bims_models");//forge上傳平台-資料夾
+               formData.append('bucketKey', "vegoogzcavcbkithyvlrsvrcth6ttwyh-202302_ibms");//forge上傳平台-資料夾

                    $.ajax({
                        url: '/api/forge/oss/objects',
@ -484,6 +484,7 @@
                                //formData2.append("orgName_3D", file_names[0]);
                                //formData2.append("extName_3D", file_names[1]);
                            }
+                            console.log("urn_3D", urn)
                            formData2.append("urn_3D", urn);
                            formData2.append("orgName_3D", m3d_names[0]);
                            formData2.append("extName_3D", m3d_names[1]);
@ -961,7 +962,7 @@
        function translateObject(urn) {
            $("#forgeViewer").empty();
            //if (node == null) node = $('#appBuckets').jstree(true).get_selected(true)[0];
-            var bucketKey = "ta3hqsffzqbnouxkpldkuksew4sj21w5-bims_models";//forge上傳平台-資料夾
+            var bucketKey = "vegoogzcavcbkithyvlrsvrcth6ttwyh-202302_ibms";//forge上傳平台-資料夾
            var objectKey = urn;

            jQuery.post({
@ -969,6 +970,7 @@
                contentType: 'application/json',
                data: JSON.stringify({ 'bucketKey': bucketKey, 'objectName': objectKey }),
                success: function (res) {
+                  console.log("@@973", res)
                    //$("#forgeViewer").html('Translation started! Please try again in a moment.');
                },
            });
--- a/Backend/appsettings.Development.json
+++ b/Backend/appsettings.Development.json
@ -16,8 +16,8 @@
    "MySqlDBConfig": {
      "Server": "FYlY+w0XDIz+jmF2rlZWJw==", //0.201
      "Port": "js2LutKe+rdjzdxMPQUrvQ==",
-      //"Database": "VJB2XC+lAtzuHObDGMVOAA==", //30  
-      "Database": "IgYBsgG2VLKKxFb64j7LOA==", //wsp
+      "Database": "VJB2XC+lAtzuHObDGMVOAA==", //30  
+      //"Database": "IgYBsgG2VLKKxFb64j7LOA==", //wsp
      "Root": "SzdxEgaJJ7tcTCrUl2zKsA==",
      "Password": "FVAPxztxpY4gJJKQ/se4bQ=="
    }
--- a/Backend/appsettings.json
+++ b/Backend/appsettings.json
@ -16,8 +16,8 @@
    "MySqlDBConfig": {
      "Server": "FYlY+w0XDIz+jmF2rlZWJw==", //0.201
      "Port": "js2LutKe+rdjzdxMPQUrvQ==",
-     // "Database": "VJB2XC+lAtzuHObDGMVOAA==", //三菱
-      "Database": "IgYBsgG2VLKKxFb64j7LOA==", //wsp
+      "Database": "VJB2XC+lAtzuHObDGMVOAA==", //三菱
+      //"Database": "IgYBsgG2VLKKxFb64j7LOA==", //wsp
      "Root": "SzdxEgaJJ7tcTCrUl2zKsA==",
      "Password": "FVAPxztxpY4gJJKQ/se4bQ=="
    }
--- a/Backend/wwwroot/forgeDemo.html
+++ b/Backend/wwwroot/forgeDemo.html
@ -255,7 +255,9 @@
          /*launchViewer("dXJuOmFkc2sub2JqZWN0czpvcy5vYmplY3Q6dGEzaHFzZmZ6cWJub3V4a3BsZGt1a3NldzRzajIxdzUtYmltc19tb2RlbHMvJUUzJTgwJTkwJUU1JThGJUIwJUU1JThDJTk3JUU0JUI4JUFEJUU4JThGJUIxJUU1JUE0JUE3JUU2JUE4JTkzJUUzJTgwJTkxQVJDJUU5JTlCJTk5JUU2JUE4JUExJUU1JUJDJThGK01FUCVFNiU4QiU4NiVFNyVCMyVCQiVFNyVCNSVCMV8wMTE5Lm53ZA")*/

          /* 0201 更換好電梯順序 */
-          launchViewer("dXJuOmFkc2sub2JqZWN0czpvcy5vYmplY3Q6dGEzaHFzZmZ6cWJub3V4a3BsZGt1a3NldzRzajIxdzUtYmltc19tb2RlbHMvJUUzJTgwJTkwJUU1JThGJUIwJUU1JThDJTk3JUU0JUI4JUFEJUU4JThGJUIxJUU1JUE0JUE3JUU2JUE4JTkzJUUzJTgwJTkxQVJDJUU5JTlCJTk5JUU2JUE4JUExJUU1JUJDJThGK01FUCVFNiU4QiU4NiVFNyVCMyVCQiVFNyVCNSVCMV8wMjAxLm53ZA")
+          /* launchViewer("dXJuOmFkc2sub2JqZWN0czpvcy5vYmplY3Q6dGEzaHFzZmZ6cWJub3V4a3BsZGt1a3NldzRzajIxdzUtYmltc19tb2RlbHMvJUUzJTgwJTkwJUU1JThGJUIwJUU1JThDJTk3JUU0JUI4JUFEJUU4JThGJUIxJUU1JUE0JUE3JUU2JUE4JTkzJUUzJTgwJTkxQVJDJUU5JTlCJTk5JUU2JUE4JUExJUU1JUJDJThGK01FUCVFNiU4QiU4NiVFNyVCMyVCQiVFNyVCNSVCMV8wMjAxLm53ZA")*/
+          // 0202 將感測器新增到電梯內
+          launchViewer("dXJuOmFkc2sub2JqZWN0czpvcy5vYmplY3Q6dmVnb29nemNhdmNia2l0aHl2bHJzdnJjdGg2dHR3eWgtMjAyMzAyX2libXMvJUUzJTgwJTkwJUU1JThGJUIwJUU1JThDJTk3JUU0JUI4JUFEJUU4JThGJUIxJUU1JUE0JUE3JUU2JUE4JTkzJUUzJTgwJTkxQVJDJUU5JTlCJTk5JUU2JUE4JUExJUU1JUJDJThGK01FUCVFNiU4QiU4NiVFNyVCMyVCQiVFNyVCNSVCMV8wMjAyLm53ZA==")
            //launchViewer('dXJuOmFkc2sub2JqZWN0czpvcy5vYmplY3Q6dnNjb2RlFX2ZvcmdlX3Rlc3QvJUUzJFTgwJTkwQVJDJUUzJTgwJTkxXzIwMjJfMTJfMTMubndk');//new ARC
            //launchViewer('dXJuOmFkc2sub2JqZWN0czpvcy5vYmplY3Q6dnNjb2RlX2ZvcmdlX3Rlc3QvJUUzJTgwJTkwTUVQJUUzJTgwJTkxXzIwMjJfMTJfMTMubndj');//new MEP
            //launchViewer('dXJuOmFkc2sub2JqZWN0czpvcy5vYmplY3Q6dnNjb2RlX2ZvcmdlX3Rlc3QvJUUzJTgwJTkwQVJDJUUzJTgwJTkxJUU1JTg1JUE4JUU2JUEzJTlGXzIwMjJfMTJfMTMubndj');//全棟 ARC
--- a/Frontend/_energyManagement.html
+++ b/Frontend/_energyManagement.html
@ -260,60 +260,63 @@
  // 左上方 系統小類卡片區塊
  function getSubSysList(type = 0) {
    subSysList = [];
-    let url = baseApiUrl + "/api/Device/GetMainSub";
-    let sendData = {
-      building_tag: pageAct.buiTag,
-    };
-    objSendData.Data = sendData;
-    ytAjax = new YourTeam.Ajax(url, objSendData, function (res) {
-      if (!res || res.code != "0000" || !res.data) {
-
-            } else {
-                let strHtml = '';
-                $.each(res.data.history_Main_Systems, (index, mainSysObj) => {
-                    $.each(mainSysObj.history_Sub_systems, (index2, subSysObj) => {
-                        subSysList.push(subSysObj);
-if ((type == 0 || (type == 3 && mainSysObj.main_system_tag == "ELEV")) && filNotShowSysSub.indexOf(subSysObj.sub_system_tag) == -1) {
-                            strHtml += `<div class="col-sm-12 col-xl-4 mb-2">
-                                            <div class="card elecCard cur-poi" data-id="${mainSysObj.main_system_tag}_${subSysObj.sub_system_tag}" data-name="${subSysObj.full_name}">
-                                                <div class="card-body">
-                                                    <h4 class="card-title color-white">${subSysObj.full_name}用電</h4>
-                                                    <p class="card-text color-white pl-5 pr-3 d-flex justify-content-between">
-                                                        <span>${elecCardConText[type]?.text1}</span>
-                                                        <span id="insPow${mainSysObj.main_system_tag}_${subSysObj.sub_system_tag}"></span>
-                                                    </p>
-                                                    <p class="card-text color-white pl-5 pr-3 d-flex justify-content-between">
-                                                        <span>${elecCardConText[type]?.text2}</span>
-                                                        <span id="insPowPer${mainSysObj.main_system_tag}_${subSysObj.sub_system_tag}"></span>
-                                                    </p>
-                                                </div>
-                                            </div>
-                                        </div>`;
+    let url = baseApiUrl + "/api/Energe/GetElecBySubSysTag";
+    // let sendData = {
+    //     building_tag: pageAct.buiTag,
+    // };
+    // objSendData.Data = sendData;
+    ytAjax = new YourTeam.Ajax(
+      url,
+      null,
+      function (res) {
+        if (!res || res.code != "0000" || !res.data) {
+        } else {
+          let strHtml = "";
+          $.each(res.data, (index, mainSysObj) => {
+            if ((type == 0 || (type == 3 && mainSysObj.mainSubTag == "ELEV_EL"))
+              //  && filNotShowSysSub.indexOf(subSysObj.sub_system_tag) == -1
+            ) {
+              const full_name = mainSysObj.system_remark.split("-")[1];
+              strHtml += `<div class="col-sm-12 col-xl-4 mb-2">
+                <div class="card elecCard cur-poi" data-id="${mainSysObj.mainSubTag}" data-name="${mainSysObj.mainSubTag}">
+                    <div class="card-body">
+                        <h4 class="card-title color-white">${full_name}用電</h4>
+                        <p class="card-text color-white pl-5 pr-3 d-flex justify-content-between">
+                            <span>${elecCardConText[type]?.text1}</span>
+                            <span id="insPow${mainSysObj.mainSubTag}"></span>
+                        </p>
+                        <p class="card-text color-white pl-5 pr-3 d-flex justify-content-between">
+                            <span>${elecCardConText[type]?.text2}</span>
+                            <span id="insPowPer${mainSysObj.mainSubTag}"></span>
+                        </p>
+                    </div>
+                </div>
+            </div>`;
            }
-          })
-        })
-        if (type == 3) {
-          strHtml += `<div class="col-sm-12 col-xl-4 mb-2">
-                                            <div class="card elecCard cur-poi">
-                                                <div class="card-body">
-                                                    <h4 class="card-title color-white">太陽能設備用電</h4>
-                                                    <p class="card-text color-white pl-5 pr-3 d-flex justify-content-between">
-                                                        <span>${elecCardConText[type]?.text1}</span>
-                                                        <span id="insPow">---</span>
-                                                    </p>
-                                                    <p class="card-text color-white pl-5 pr-3 d-flex justify-content-between">
-                                                        <span>${elecCardConText[type]?.text2}</span>
-                                                         <span id="insPow">---</span>
-                                                    </p>
-                                                </div>
-                                            </div>
-                                        </div>`;
+          });
+          if (type == 3) {
+            strHtml += `<div class="col-sm-12 col-xl-4 mb-2">
+                    <div class="card elecCard cur-poi">
+                        <div class="card-body">
+                            <h4 class="card-title color-white">太陽能設備用電</h4>
+                            <p class="card-text color-white pl-5 pr-3 d-flex justify-content-between">
+                                <span>${elecCardConText[type]?.text1}</span>
+                                <span id="insPow">---</span>
+                            </p>
+                            <p class="card-text color-white pl-5 pr-3 d-flex justify-content-between">
+                                <span>${elecCardConText[type]?.text2}</span>
+                                    <span id="insPow">---</span>
+                            </p>
+                        </div>
+                    </div>
+                </div>`;
+          }
+          $("#eneSubSysList").html(strHtml);
        }
-        console.log(strHtml)
-        $("#eneSubSysList").html(strHtml);
-      }
-    }, null, "POST").send();
-
+      },
+      null,
+      "POST",
+    ).send();
  }

  // 取得 對應系統小類的總電錶
@ -420,7 +423,6 @@ if ((type == 0 || (type == 3 && mainSysObj.main_system_tag == "ELEV")) && filNot
    $.each(subSysElecList, (idx, elecObj) => {
      let devPath
      devPath = elecObj.system_device_tag?.split("_").slice(0, 8).join("/");
-      console.log(424, devPath)
      getElectricMeterNoweDataByBaja(devPath, (data) => {
        data = data.data;
        let result = 0;
@ -428,8 +430,7 @@ if ((type == 0 || (type == 3 && mainSysObj.main_system_tag == "ELEV")) && filNot
          result = data.filter(x => x.name == "P_rec")[0]?.value?.roundDecimal(2);
          $(`#insPow${elecObj.mainSubTag}`).text(result);
          result = data.filter(x => x.name == "KWH_rec")[0]?.value?.roundDecimal(2);
-          console.log(429, data, result)
-          $(`#insPowPer${elecObj.mainSubTag}`).text((result / totalPow * 100).roundDecimal(2) + " %");
+          $(`#insPowPer${elecObj.mainSubTag}`).text((result / result * 100).roundDecimal(2) + " %");
        } else {
          /*        result = result ? result.roundDecimal(2) : 0;*/
          result = data.filter(x => x.name == "P")[0]?.value?.roundDecimal(2);
@ -471,7 +472,6 @@ if ((type == 0 || (type == 3 && mainSysObj.main_system_tag == "ELEV")) && filNot
        todayElecChart?.destroy();
        return;
      }
-
      getElectricMeterHourDataByBaja(tarDevNum + "_KWH", n4Sup, 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"));
        chartTodaysElec(todayData);
@ -552,6 +552,7 @@ if ((type == 0 || (type == 3 && mainSysObj.main_system_tag == "ELEV")) && filNot

  // 圖表 - 今天用電量 (折線圖)
  function chartTodaysElec(todayData) {
+    todayElecChart?.destroy();
    let todayElecChartCanvas = $('#todayElecChart').get(0).getContext('2d');
    let curHour = (new Date()).getHours();
    todayData.data = todayData.filter(x => x.timestamp.$time.$hour < curHour);
@ -618,7 +619,7 @@ if ((type == 0 || (type == 3 && mainSysObj.main_system_tag == "ELEV")) && filNot

  // 圖表 - 今日與30日內平均用電量比較 (長條圖)
  function chartEveWeeksElec(curWeekData, avgData) {
-
+    elecCompChart?.destroy()
    let elecCompChartCanvas = $('#elecCompChart').get(0).getContext('2d');
    let elecCompChartData = {
      labels: curWeekData.map(x => dayToChiDay(strToDate(x.timestamp.$cEncStr, "day"))),
--- a/Frontend/_sysMonFloor.html
+++ b/Frontend/_sysMonFloor.html
@ -1099,13 +1099,14 @@
            devices: devices,
        }

+      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) {
--- a/FrontendWebApi/ApiControllers/OAuthController.cs
+++ b/FrontendWebApi/ApiControllers/OAuthController.cs
@ -49,8 +49,8 @@ namespace FrontendWebApi.ApiControllers
            TwoLeggedApi oauth = new TwoLeggedApi();
            string grantType = "client_credentials";
            dynamic bearer = await oauth.AuthenticateAsync(
-              "TA3hqsFfzQbNOUXKpldKUKSew4SJ21w5",
-              "D002f92d839144f8",
+              "VeGoOgZcAVCBkiThYvLRSVrCTH6TTwyh",
+              "Rl1KHJIAI8GSAfhK",
              grantType,
              scopes);
            return bearer;
--- a/FrontendWebApi/ApiControllers/OSSController.cs
+++ b/FrontendWebApi/ApiControllers/OSSController.cs
@ -13,7 +13,7 @@ namespace FrontendWebApi.ApiControllers
    {
        private IWebHostEnvironment _env;
        public OSSController(IWebHostEnvironment env) { _env = env; }
-        string id = "TA3hqsFfzQbNOUXKpldKUKSew4SJ21w5";
+        string id = "VeGoOgZcAVCBkiThYvLRSVrCTH6TTwyh";
        public string ClientId { get { return id.ToLower(); } }

        /// <summary>
--- a/FrontendWebApi/Properties/launchSettings.json
+++ b/FrontendWebApi/Properties/launchSettings.json
@ -15,8 +15,8 @@
        "ASPNETCORE_ENVIRONMENT": "Development",
        "ASPNETCORE_HOSTINGSTARTUPASSEMBLIES": "Microsoft.AspNetCore.Mvc.Razor.RuntimeCompilation",
        "FORGE_CALLBACK_URL": "http://localhost:3000/api/forge/callback/oauth",
-        "FORGE_CLIENT_ID": "TA3hqsFfzQbNOUXKpldKUKSew4SJ21w5",
-        "FORGE_CLIENT_SECRET": "D002f92d839144f8",
+        "FORGE_CLIENT_ID": "VeGoOgZcAVCBkiThYvLRSVrCTH6TTwyh",
+        "FORGE_CLIENT_SECRET": "Rl1KHJIAI8GSAfhK",
        "ASPNETCORE_URLS": "http://localhost:5500"
      },
      "applicationUrl": "https://localhost:5001;http://localhost:5000"
--- a/ibms_react/ibms_react.esproj
+++ b/ibms_react/ibms_react.esproj
@ -4,10 +4,17 @@
    <JavaScriptTestRoot>src\</JavaScriptTestRoot>
    <JavaScriptTestFramework>Jest</JavaScriptTestFramework>
    <!-- Command to run on project build -->
-    <BuildCommand></BuildCommand>
+    <BuildCommand>
+    </BuildCommand>
    <!-- Command to create an optimized build of the project that's ready for publishing -->
    <ProductionBuildCommand>npm run build</ProductionBuildCommand>
    <!-- Folder where production build objects will be placed -->
    <BuildOutputFolder>$(MSBuildProjectDirectory)\build</BuildOutputFolder>
  </PropertyGroup>
+  <ItemGroup>
+    <None Remove="src\utils\baja\bajaUtil.js" />
+  </ItemGroup>
+  <ItemGroup>
+    <None Remove="src\utils\baja\bajaUtil.js" />
+  </ItemGroup>
 </Project>
--- a/ibms_react/src/App.css
+++ b/ibms_react/src/App.css
@ -1,38 +0,0 @@
-.App {
-  text-align: center;
-}
-
-.App-logo {
-  height: 40vmin;
-  pointer-events: none;
-}
-
-@media (prefers-reduced-motion: no-preference) {
-  .App-logo {
-    animation: App-logo-spin infinite 20s linear;
-  }
-}
-
-.App-header {
-  background-color: #282c34;
-  min-height: 100vh;
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  justify-content: center;
-  font-size: calc(10px + 2vmin);
-  color: white;
-}
-
-.App-link {
-  color: #61dafb;
-}
-
-@keyframes App-logo-spin {
-  from {
-    transform: rotate(0deg);
-  }
-  to {
-    transform: rotate(360deg);
-  }
-}
--- a/ibms_react/src/App.js
+++ b/ibms_react/src/App.js
@ -1,4 +1,4 @@
-import { useMemo, useEffect, useState } from "react";
+import { useMemo, useEffect, useState, useCallback } from "react";
 import { Outlet, NavLink } from "react-router-dom";
 import { useSelector, useDispatch } from "react-redux";
 import { Container, Nav, Navbar, NavDropdown } from "react-bootstrap";
@ -49,6 +49,16 @@ function App() {
      dispatch(fetchSysMainSub(selectedBuiTag));
    }
  }, [selectedBuiTag]);
+
+  // 離開頁面就清除所有 cookie
+  //const removeAllCookie = useCallback(() => {
+  //  console.log("關閉分頁時，清除所有 cookie")
+  //  window.addEventListener("beforeunload",() => {
+  //    document.cookie.match(/[^ =;]+(?=\=)/g).forEach(key => {
+  //      document.cookie = `${key}=""; max-age=0`;
+  //    }) })
+  //}, [])
+
  return (
    <div className="App">
      {/* 主選單 */}
--- a/ibms_react/src/App.test.js
+++ b/ibms_react/src/App.test.js
@ -1,8 +0,0 @@
-import { render, screen } from '@testing-library/react';
-import App from './App';
-
-test('renders learn react link', () => {
-  render(<App />);
-  const linkElement = screen.getByText(/learn react/i);
-  expect(linkElement).toBeInTheDocument();
-});
--- a/ibms_react/src/components/forges/ForgeModel.js
+++ b/ibms_react/src/components/forges/ForgeModel.js
@ -1,17 +1,29 @@
-import React, { useEffect, useRef, useState } from "react";
+import React, { useEffect, useRef, useMemo } from "react";
 import { useDispatch, useSelector } from "react-redux";
 import * as THREE from "three";
 import { fetchForge, shutdownForge } from "@STORE/forgeSlice";
+import { SubscribeDeviceTempByBaja } from "@UTIL"
 import hotspot from "@ASSET/img/hotspot.svg";

-function ForgeModel({ forgeHeight, sprites = [] }) {
+function ForgeModel({ forgeHeight, deviceList = [] }) {
  const dispatch = useDispatch();
  const viewerEl = useRef(null);
  const {
    buildingInfo: { urn_3D },
-    forgeViewer: { viewer, dataVizExtn, DataVizCore },
+    forgeViewer: { viewer, model,dataVizExtn, DataVizCore, structureInfo },
+    device: { selectedDeviceSysTag,selectedDeviceNameTag,tempsensorDevList }
  } = useSelector((store) => store);

+  const deviceArray = useMemo(()=> deviceList.map(({ device_number, device_coordinate_3d, room_dbid }) => {
+    return {
+      id: device_number, // An ID to identify this device
+      position: JSON.parse(device_coordinate_3d), // World coordinates of this device
+      roomId: room_dbid,
+      sensorTypes: ["temperature", "humidity"], // The types/properties this device exposes
+      temp: 0,
+    }
+  }), [selectedDeviceNameTag])
+
  // 載入 Forge Viewer
  useEffect(() => {
    if (urn_3D) {
@ -21,9 +33,9 @@ function ForgeModel({ forgeHeight, sprites = [] }) {
          urn: urn_3D,
        }),
      );
+     };
      return () => {
        dispatch(shutdownForge());
-      };
    }
  }, [urn_3D]);

@ -38,7 +50,7 @@ function ForgeModel({ forgeHeight, sprites = [] }) {
  // 熱點點擊事件
  const onSpriteClicked = (event) => {
    const targetDbIds = [event.dbId];
-    spriteUpdate(event, targetDbIds, { scale: 1.3, color: { r: 1, g: 0, b: 0 } });
+    spriteUpdate(event, targetDbIds, { scale: 1.3, color: { r: 1.0, g: 0, b: 0 } });
    console.log(`Sprite clicked:${targetDbIds}`);
  };

@ -51,10 +63,9 @@ function ForgeModel({ forgeHeight, sprites = [] }) {

  // 進入系統監控頁面，出現熱點
  useEffect(() => {
-    if (sprites.length !== 0 && viewer && dataVizExtn) {
-      // const filterSprites = sprites.map;
+    if (deviceList.length !== 0 && viewer && dataVizExtn) {
      dataVizExtn.removeAllViewables();
-      sprites.forEach(async ({ device_coordinate_3d, forge_dbid }, index) => {
+      deviceList.forEach(async ({ device_coordinate_3d, forge_dbid }, index) => {
        const viewableType = DataVizCore.ViewableType.SPRITE;
        const spriteColor = new THREE.Color(0xffffff);
        const spriteIconUrl = hotspot;
@ -78,12 +89,84 @@ function ForgeModel({ forgeHeight, sprites = [] }) {
    }

    return () => {
-      if (sprites.length !== 0 && viewer && dataVizExtn) {
+      if (deviceList.length !== 0 && viewer && dataVizExtn) {
        viewer.removeEventListener(DataVizCore.MOUSE_CLICK, onSpriteClicked);
        viewer.removeEventListener(DataVizCore.MOUSE_CLICK_OUT, onSpriteClickedOut);
      }
    };
-  }, [sprites, dataVizExtn, viewer]);
+  }, [deviceList, dataVizExtn]);
+
+  // 熱圖
+  const getSensorValue = (surfaceShadingPoint) => {
+    // The `SurfaceShadingPoint.id` property matches one of the identifiers passed to `generateSurfaceShadingData` 
+      const { temp } = surfaceShadingPoint;
+      return temp / 40;
+  }
+
+  // 構建熱圖
+  const establishHeatMaps = async (deviceList, dataVizExtn) => {
+    // 不重複的房間值
+    const uniqueRoomIds = [...new Set(deviceArray.map(r => r.roomId))]; // 房間唯一值
+    const {
+      SurfaceShadingData,
+      SurfaceShadingPoint,
+      SurfaceShadingNode,
+    } = DataVizCore;
+    const heatmapData = new SurfaceShadingData();
+    uniqueRoomIds.forEach(room_Id => {
+       // 為每個房間都建立一個 Node
+      const shadingNode = new SurfaceShadingNode("TemperatureSensor", room_Id);
+      deviceArray.forEach(({ id, position, roomId, sensorTypes  }) => {
+      // 設備對應的 roomId 用來判斷要加入哪個 Node
+        if (room_Id === roomId) {
+          const pt = new SurfaceShadingPoint(id, position, sensorTypes);
+          shadingNode.addPoint(pt);
+        }
+
+      })
+      heatmapData.addChild(shadingNode);
+      heatmapData.initialize(viewer.model);
+    })
+    await dataVizExtn.setupSurfaceShading(viewer.model, heatmapData, {
+      type: "PlanarHeatmap",
+      slicingPosition: 0.5, // Slicing happens at the vertical mid-point of the geometry
+      placementPosition: 1.0, // The sliced planar heatmap placed at the base of geometry
+      minOpacity: 0.0, // The default value if this option is omitted
+      maxOpacity: 0.5, // The default value if this option is omitted
+    });
+     // 對 "temperature" 的溫度設定兩種顏色：紅色和藍色
+    dataVizExtn.registerSurfaceShadingColors("temperature", [0x0000ff, 0x00ff00, 0xffff00, 0xff0000]);
+
+    if (deviceArray.length !== 0) {
+      const sensorType = "temperature";
+      deviceArray.forEach(({ id }) => {
+        dataVizExtn.renderSurfaceShading(id, sensorType, getSensorValue);
+      })
+    }
+  }
+
+  useEffect(() => {
+  if (deviceList && structureInfo && dataVizExtn && selectedDeviceSysTag == "ME") {
+    // 訂閱有 Temp 的設備
+    deviceList.forEach(({ device_number }) => {
+      SubscribeDeviceTempByBaja(device_number, dispatch)
+    })
+    establishHeatMaps(deviceList, dataVizExtn, structureInfo);
+  }
+    return () => { }
+}, [selectedDeviceNameTag]);
+
+  useEffect(() => {
+    if (tempsensorDevList.length !== 0) {
+      deviceArray.forEach((device) => {
+        if (tempsensorDevList.findIndex(({ device_number }) => device_number === device.id) !== -1) {
+          const newTempObj = tempsensorDevList.find(({ device_number }) => device_number === device.id)
+          device.temp = newTempObj.temp;
+          dataVizExtn.updateSurfaceShading(getSensorValue);
+        }
+      })     
+    }
+  }, [tempsensorDevList])

  return <div ref={viewerEl} id="forgeViewer" style={{ height: forgeHeight }}></div>;
 }
--- a/ibms_react/src/index.css
+++ b/ibms_react/src/index.css
@ -1,13 +0,0 @@
-body {
-  margin: 0;
-  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',
-    'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',
-    sans-serif;
-  -webkit-font-smoothing: antialiased;
-  -moz-osx-font-smoothing: grayscale;
-}
-
-code {
-  font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New',
-    monospace;
-}
--- a/ibms_react/src/logo.svg
+++ b/ibms_react/src/logo.svg
@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 841.9 595.3"><g fill="#61DAFB"><path d="M666.3 296.5c0-32.5-40.7-63.3-103.1-82.4 14.4-63.6 8-114.2-20.2-130.4-6.5-3.8-14.1-5.6-22.4-5.6v22.3c4.6 0 8.3.9 11.4 2.6 13.6 7.8 19.5 37.5 14.9 75.7-1.1 9.4-2.9 19.3-5.1 29.4-19.6-4.8-41-8.5-63.5-10.9-13.5-18.5-27.5-35.3-41.6-50 32.6-30.3 63.2-46.9 84-46.9V78c-27.5 0-63.5 19.6-99.9 53.6-36.4-33.8-72.4-53.2-99.9-53.2v22.3c20.7 0 51.4 16.5 84 46.6-14 14.7-28 31.4-41.3 49.9-22.6 2.4-44 6.1-63.6 11-2.3-10-4-19.7-5.2-29-4.7-38.2 1.1-67.9 14.6-75.8 3-1.8 6.9-2.6 11.5-2.6V78.5c-8.4 0-16 1.8-22.6 5.6-28.1 16.2-34.4 66.7-19.9 130.1-62.2 19.2-102.7 49.9-102.7 82.3 0 32.5 40.7 63.3 103.1 82.4-14.4 63.6-8 114.2 20.2 130.4 6.5 3.8 14.1 5.6 22.5 5.6 27.5 0 63.5-19.6 99.9-53.6 36.4 33.8 72.4 53.2 99.9 53.2 8.4 0 16-1.8 22.6-5.6 28.1-16.2 34.4-66.7 19.9-130.1 62-19.1 102.5-49.9 102.5-82.3zm-130.2-66.7c-3.7 12.9-8.3 26.2-13.5 39.5-4.1-8-8.4-16-13.1-24-4.6-8-9.5-15.8-14.4-23.4 14.2 2.1 27.9 4.7 41 7.9zm-45.8 106.5c-7.8 13.5-15.8 26.3-24.1 38.2-14.9 1.3-30 2-45.2 2-15.1 0-30.2-.7-45-1.9-8.3-11.9-16.4-24.6-24.2-38-7.6-13.1-14.5-26.4-20.8-39.8 6.2-13.4 13.2-26.8 20.7-39.9 7.8-13.5 15.8-26.3 24.1-38.2 14.9-1.3 30-2 45.2-2 15.1 0 30.2.7 45 1.9 8.3 11.9 16.4 24.6 24.2 38 7.6 13.1 14.5 26.4 20.8 39.8-6.3 13.4-13.2 26.8-20.7 39.9zm32.3-13c5.4 13.4 10 26.8 13.8 39.8-13.1 3.2-26.9 5.9-41.2 8 4.9-7.7 9.8-15.6 14.4-23.7 4.6-8 8.9-16.1 13-24.1zM421.2 430c-9.3-9.6-18.6-20.3-27.8-32 9 .4 18.2.7 27.5.7 9.4 0 18.7-.2 27.8-.7-9 11.7-18.3 22.4-27.5 32zm-74.4-58.9c-14.2-2.1-27.9-4.7-41-7.9 3.7-12.9 8.3-26.2 13.5-39.5 4.1 8 8.4 16 13.1 24 4.7 8 9.5 15.8 14.4 23.4zM420.7 163c9.3 9.6 18.6 20.3 27.8 32-9-.4-18.2-.7-27.5-.7-9.4 0-18.7.2-27.8.7 9-11.7 18.3-22.4 27.5-32zm-74 58.9c-4.9 7.7-9.8 15.6-14.4 23.7-4.6 8-8.9 16-13 24-5.4-13.4-10-26.8-13.8-39.8 13.1-3.1 26.9-5.8 41.2-7.9zm-90.5 125.2c-35.4-15.1-58.3-34.9-58.3-50.6 0-15.7 22.9-35.6 58.3-50.6 8.6-3.7 18-7 27.7-10.1 5.7 19.6 13.2 40 22.5 60.9-9.2 20.8-16.6 41.1-22.2 60.6-9.9-3.1-19.3-6.5-28-10.2zM310 490c-13.6-7.8-19.5-37.5-14.9-75.7 1.1-9.4 2.9-19.3 5.1-29.4 19.6 4.8 41 8.5 63.5 10.9 13.5 18.5 27.5 35.3 41.6 50-32.6 30.3-63.2 46.9-84 46.9-4.5-.1-8.3-1-11.3-2.7zm237.2-76.2c4.7 38.2-1.1 67.9-14.6 75.8-3 1.8-6.9 2.6-11.5 2.6-20.7 0-51.4-16.5-84-46.6 14-14.7 28-31.4 41.3-49.9 22.6-2.4 44-6.1 63.6-11 2.3 10.1 4.1 19.8 5.2 29.1zm38.5-66.7c-8.6 3.7-18 7-27.7 10.1-5.7-19.6-13.2-40-22.5-60.9 9.2-20.8 16.6-41.1 22.2-60.6 9.9 3.1 19.3 6.5 28.1 10.2 35.4 15.1 58.3 34.9 58.3 50.6-.1 15.7-23 35.6-58.4 50.6zM320.8 78.4z"/><circle cx="420.9" cy="296.5" r="45.7"/><path d="M520.5 78.1z"/></g></svg>
--- a/ibms_react/src/pages/Monitor.js
+++ b/ibms_react/src/pages/Monitor.js
@ -3,26 +3,49 @@ import { useParams } from "react-router-dom";
 import { useSelector, useDispatch } from "react-redux";
 import { Container, Row, Col, Card, ButtonGroup, Button } from "react-bootstrap";
 import ForgeModel from "@COM/forges/ForgeModel";
-import { fetchSelectedDeviceMenu, fetchSelectedDeviceList, fetchSelectedDevFlTags } from "@STORE";
+import { fetchSelectedDeviceMenu, fetchSelectedDeviceList, fetchSelectedDevFlTags, changeMainSubSys } from "@STORE";
 import defdev from "@ASSET/img/defdev.png";
 function Monitor() {
  const params = useParams().systemId; // main_sub
  const [main_system_tag, sub_system_tag] = params.split("_");
  const dispatch = useDispatch();
  const {
-    buildingInfo: { selectedBuiTag },
    device: { selectedDeviceMenu, selectedDeviceList, selectedDeviceFloorTags },
    system: { mainSub },
+    forgeViewer: { viewer, model },
  } = useSelector((state) => state);

  useEffect(() => {
-    if (selectedBuiTag && main_system_tag && sub_system_tag) {
+    if (main_system_tag && sub_system_tag) {
+      dispatch(changeMainSubSys({ main_system_tag, sub_system_tag }))
      dispatch(fetchSelectedDeviceMenu({ main_system_tag, sub_system_tag }));
      dispatch(fetchSelectedDeviceList({ sub_system_tag }));
      dispatch(fetchSelectedDevFlTags({ sub_system_tag }));
    }
    // 載入資料
-  }, [main_system_tag, sub_system_tag, selectedBuiTag]);
+  }, [main_system_tag, sub_system_tag]);
+
+  // 只顯示指定的設備
+  // 取得所有 forge dbid
+  const getAllDbIds = (model) => {
+    const instanceTree = model.getInstanceTree();
+    const allDbIdsStr = Object.keys(instanceTree.nodeAccess.dbIdToIndex);
+    return allDbIdsStr.map(id => parseInt(id));
+  }
+  useEffect(() => {
+    if (model && selectedDeviceList.length !== 0) {
+      console.log(model)
+      const allDbIds = getAllDbIds(model)
+      viewer.hide(allDbIds)
+      const showDbIds = selectedDeviceList.map((d) => parseInt(d.forge_dbid))
+      let showNodeDbId = [];
+      selectedDeviceList.forEach(({ device_nodes }) => {
+        showNodeDbId = [...showNodeDbId, ...device_nodes.map(({ forge_dbid }) => forge_dbid)]
+      })
+      viewer.show([...showDbIds, ...showNodeDbId])
+    }
+  }, [model, selectedDeviceList])
+
  return (
    <>
      <Container
@ -60,12 +83,13 @@ function Monitor() {
                  <Col md={1}>
                    <Button className="px-4 py-2 text-white">{floor_tag}</Button>
                  </Col>
-                  <Col className="d-flex justify-content-evenly align-items-center flex-wrap">
-                    {selectedDeviceList.map(({ device_guid, full_name, forge_dbid }) => (
-                      <Card
+                  <Col className="d-flex justify-content-start align-items-center flex-wrap">
+                    {selectedDeviceList.map(({ device_guid, full_name, forge_dbid, device_floor }) => (
+                      device_floor === floor_tag ?
+                        <Card
                        bg="dark"
                        key={device_guid}
-                        className="mb-3"
+                        className="mb-3 ms-4"
                        style={{ maxWidth: "45%" }}
                      >
                        <Card.Body>
@ -77,13 +101,14 @@ function Monitor() {
                            <span className="text-secondary me-4">功率 kW</span>
                            <Card.Link
                              className="text-white text-decoration-none"
-                              data-forgeId={forge_dbid}
+                                data-forgeid={forge_dbid}
                            >
                              詳細內容
                            </Card.Link>
                          </Card.Text>
                        </Card.Body>
-                      </Card>
+                        </Card> :
+                      <></>
                    ))}
                  </Col>
                </Row>
@ -91,7 +116,7 @@ function Monitor() {
            )}
          </Col>
          <Col md={6}>
-            <ForgeModel forgeHeight="90vh" sprites={selectedDeviceList} />
+            <ForgeModel forgeHeight="90vh" deviceList={ selectedDeviceList } />
          </Col>
        </Row>
      </Container>
--- a/ibms_react/src/reportWebVitals.js
+++ b/ibms_react/src/reportWebVitals.js
@ -1,13 +0,0 @@
-const reportWebVitals = onPerfEntry => {
-  if (onPerfEntry && onPerfEntry instanceof Function) {
-    import('web-vitals').then(({ getCLS, getFID, getFCP, getLCP, getTTFB }) => {
-      getCLS(onPerfEntry);
-      getFID(onPerfEntry);
-      getFCP(onPerfEntry);
-      getLCP(onPerfEntry);
-      getTTFB(onPerfEntry);
-    });
-  }
-};
-
-export default reportWebVitals;
--- a/ibms_react/src/routes/routes.js
+++ b/ibms_react/src/routes/routes.js
@ -20,8 +20,8 @@ const routes = [
        /(?:(?:^|.*;\s*)JWT-Authorization\s*\=\s*([^;]*).*$)|^.*$/,
        "$1",
      );
-      if (window.location.href.includes("localhost:3000") && !JWT_Authorization) {
        console.log(JWT_Authorization);
+      if (window.location.href.includes("localhost:3000") && !JWT_Authorization) {
        return redirect("/login");
      } else if (window.location.href.includes("http://220.132.206.5") && !JWT_Authorization) {
        const account = await setUserAccountByBaja();
--- a/ibms_react/src/setupTests.js
+++ b/ibms_react/src/setupTests.js
@ -1,5 +0,0 @@
-// jest-dom adds custom jest matchers for asserting on DOM nodes.
-// allows you to do things like:
-// expect(element).toHaveTextContent(/react/i)
-// learn more: https://github.com/testing-library/jest-dom
-import '@testing-library/jest-dom';
--- a/ibms_react/src/stores/buildingSlice.js
+++ b/ibms_react/src/stores/buildingSlice.js
@ -16,7 +16,7 @@ const buildingSlice = createSlice({
    buildingList: ["中凌大樓"],
    urn_3D: "",
    selectedBuiArea: "TPE",
-    selectedBuiTag: "",
+    selectedBuiTag: "B1",
    selectedBuiFullName: "",
    errMsg: "",
  },
--- a/ibms_react/src/stores/deviceListSlice.js
+++ b/ibms_react/src/stores/deviceListSlice.js
@ -3,6 +3,7 @@ import axios from "axios";
 import { deviceBuiMenuBaseUrl, deviceListBaseUrl, deviceFloorBaseUrl } from "@CON";
 import { ajaxRes } from "@UTIL";

+// 獲取小類中總覽資料
 export const fetchSelectedDeviceMenu = createAsyncThunk(
  "deviceList/fetchSelectedDeviceMenu",
  async ({ main_system_tag, sub_system_tag }, thunkAPI) => {
@ -29,14 +30,12 @@ export const fetchSelectedDeviceList = createAsyncThunk(
    if (code !== "0000" || !data) {
      return rejectWithValue(msg);
    } else {
-      console.log(data)
      let results=[];
      data.forEach((p) => {
        p.device_list.forEach((d) => {
          results.push({ ...d, device_floor: p.full_name });
        });
      });
-      console.log("v", [...results]);
      return fulfillWithValue([...results]);
    }
  },
@ -66,16 +65,30 @@ const deviceListSlice = createSlice({
    selectedDeviceMaster: "", // BANK1
    selectedDeviceLastName: "", // ELEV
    selectedDeviceSerialTag: "", // N1
+    tempsensorDevList: [],
  },
  reducers: {
-    getAllDevice: (state, action) => {},
+    getAllDevice: (state, action) => { },
+    getCurDeviceTemp: (state, { payload }) => {
+      const { device_number, temp } = payload;
+      state.tempsensorDevList = state.tempsensorDevList.map((sensor) => {
+        if (sensor.some(s => s.device_number == device_number)) {
+          return { ...sensor, temp }
+        }
+        return sensor
+      })
+    },
+    changeMainSubSys: (state, { payload }) => {
+      const { main_system_tag, sub_system_tag } = payload;
+      state.selectedDeviceSysTag = main_system_tag;
+      state.selectedDeviceNameTag = sub_system_tag;
+    }
  },
  extraReducers: (builder) => {
    builder.addCase(fetchSelectedDeviceMenu.fulfilled, (state, { payload }) => {
      state.selectedDeviceMenu = payload;
    });
    builder.addCase(fetchSelectedDeviceList.fulfilled, (state, { payload }) => {
-      console.log("de", payload);
      state.selectedDeviceList = payload;
    });

@ -88,5 +101,5 @@ const deviceListSlice = createSlice({
 });

 const { reducer, actions } = deviceListSlice;
-export const { getAllDevice } = actions;
+export const { getCurDeviceTemp, changeMainSubSys } = actions;
 export default reducer;
--- a/ibms_react/src/stores/forgeSlice.js
+++ b/ibms_react/src/stores/forgeSlice.js
@ -6,7 +6,7 @@ export const fetchForge = createAsyncThunk(
  async ({ viewerEl, urn }, { dispatch, fulfillWithValue, rejectWithValue }) => {
    const res = await forgeInit(viewerEl);
    if (res.ok) {
-      modelLoad(res.viewer, urn, dispatch);
+      await modelLoad(res.viewer, urn, dispatch);
      return fulfillWithValue(res.viewer);
    } else {
      return rejectWithValue(res.errCode);
@ -18,8 +18,10 @@ const forgeSlice = createSlice({
  name: "forge",
  initialState: {
    viewer: null,
+    model: null,
    dataVizExtn: null,
    DataVizCore: null,
+    structureInfo: null,
    errCode: 0,
    urn_3D: "",
  },
@ -27,6 +29,14 @@ const forgeSlice = createSlice({
    loadDataVizExtn: (state, { payload }) => {
      state.dataVizExtn = payload;
      state.DataVizCore = window.Autodesk.DataVisualization.Core;
+      // heatmap
+      state.structureInfo = new window.Autodesk.DataVisualization.Core.ModelStructureInfo(state.model);
+    },
+    loadStructureInfo: (state, { payload }) => {
+      state.structureInfo = payload
+    },
+    loadModel: (state, { payload }) => {
+      state.model = payload
    },
    shutdownForge: (state, action) => {
      state.viewer?.finish();
@ -46,5 +56,5 @@ const forgeSlice = createSlice({
 });

 const { reducer, actions } = forgeSlice;
-export const { shutdownForge, loadDataVizExtn } = actions;
+export const { shutdownForge, loadDataVizExtn, loadModel } = actions;
 export default reducer;
--- a/ibms_react/src/stores/index.js
+++ b/ibms_react/src/stores/index.js
@ -5,8 +5,10 @@ import device, {
  fetchSelectedDeviceList,
  fetchSelectedDeviceMenu,
  fetchSelectedDevFlTags,
+  getCurDeviceTemp,
+  changeMainSubSys,
 } from "./deviceListSlice";
-import forgeViewer, { fetchForge, loadDataVizExtn, shutdownForge } from "./forgeSlice";
+import forgeViewer, { fetchForge, loadDataVizExtn, loadModel, shutdownForge } from "./forgeSlice";
 import system, { fetchSysMainSub } from "./systemSlice";
 import user, { fetchUserInfo, fetchUserAuthPages } from "./userSlice";
 import alarm, { fetchBuiAlarmStateByBaja } from "./alarmSlice";
@ -40,16 +42,25 @@ export default store;
 export {
  fetchBuiList,
  changeBuilding,
+
  fetchSelectedDeviceList,
  fetchSelectedDeviceMenu,
  fetchSelectedDevFlTags,
+  getCurDeviceTemp,
+  changeMainSubSys,
+
  fetchForge,
  loadDataVizExtn,
+  loadModel,
  shutdownForge,
+
  fetchSysMainSub,
+
  fetchUserInfo,
  fetchUserAuthPages,
+
  fetchBuiAlarmStateByBaja,
+
  fetchInitElecMeterByBaja,
  getElectricMeter,
  getHourElectricMeter,
--- a/ibms_react/src/utils/baja/alarmBaja.js
+++ b/ibms_react/src/utils/baja/alarmBaja.js
@ -14,7 +14,8 @@ export async function getBuiAlarmStateByBaja(area_tag, building_tag) {
            const { msgText, sourceName } = this.get("alarmData").$map.$map;
            const { $enc: ackState } = this.get("ackState").getType();
            const { $enc: sourceState } = this.get("sourceState").getType();
-            if (ackState !== "acked" && sourceState !== "normal") {
+            // 在選單上的顯示警告，只須出現在緊急的 offnormal 設備
+            if (sourceState !== "normal") {
              result.push({
                msgText,
                sourceName,
--- a/ibms_react/src/utils/baja/bajaUtil.js
+++ b/ibms_react/src/utils/baja/bajaUtil.js
@ -0,0 +1,12 @@
+export function PointSubscribe(baja, sub, ordPath, pointName) {
+  // ord 為要訂閱的點位
+  baja.Ord.make(`local:|foxs:|station:|slot:/${ordPath}`)
+    .get()
+    .then(folder => {
+      folder.getSlots().is("control:NumericWritable").eachValue((point) => {
+        if (point.getDisplayName() === pointName) {
+          baja.Ord.make(`local:|foxs:|station:|slot:/${ordPath}/${pointName}`).get({ subscriber: sub })
+        }
+      })
+    })
+}
--- a/ibms_react/src/utils/baja/deviceBaja.js
+++ b/ibms_react/src/utils/baja/deviceBaja.js
@ -1,26 +1,35 @@
+import { getCurDeviceTemp } from "@STORE"
+import { roundDecimal } from "@UTIL";
 // 訂閱設備
 // 針對數值的點位
-export function SubscribeDeviceByBaja(ord) {
+export function SubscribeDeviceTempByBaja(ordPath, dispatch) {
  window.require &&
    window.requirejs(["baja!"], (baja) => {
      console.log("進入 bajaSubscriber 準備執行BQL訂閱");
-      const sub = new baja.subscriber();
-      sub.attach("changed", (prop, cx) => {
-        console.log(prop, cx);
-      });
+      const sub = new baja.Subscriber();
+      function passValueToFront(temp) {
+        dispatch(getCurDeviceTemp({ device_number: ordPath, temp }))
+      }
+      sub.attach("changed", (prop) => {
+        if (prop && prop.$displayName === "Out") {
+          passValueToFront(prop.$getValue().getValueDisplay())
+        }
+      })
+      sub.attach("subscribed", (prop) => {
+        if (prop && prop.$displayName === "Out") {
+          passValueToFront(prop.$getValue().getValueDisplay())
+        }
+      })
      // ord 為要訂閱的點位
-      baja.Ord.make(ord)
-        .get({
-          subscriber: sub,
-          // cursor 對返回的數據做處理
-          cursor: {
-            before: function () {},
-            each: function () {},
-            after: function () {},
-          },
+      // ord 為要訂閱的點位
+      baja.Ord.make(`local:|foxs:|station:|slot:/${ordPath}`)
+        .get()
+        .then(folder => {
+          folder.getSlots().is("control:NumericWritable").eachValue((point) => {
+            if (point.getDisplayName() === "Temp" || point.getDisplayName() === "TEMP") {
+              baja.Ord.make(`local:|foxs:|station:|slot:/${ordPath}/${point.getDisplayName()}`).get({ subscriber: sub })
+            }
+          })
        })
-        .then((point) => {
-          console.log(point);
-        });
-    });
+    })
 }
--- a/ibms_react/src/utils/baja/electricityBaja.js
+++ b/ibms_react/src/utils/baja/electricityBaja.js
@ -89,30 +89,34 @@ export async function getCurPower(ordPath, dispatch) {
  window.require &&
    window.require(["baja!"], function (baja) {
      const sub = new baja.Subscriber();
-      sub.attach("changed", function (prop) {
-        const value = roundDecimal(this.get("out").getValue());
+      function passValueToFront(value) {
+        const newValue = roundDecimal(value);
        dispatch(
          getCurElectricity([
-            { data: value, text: "即時功率 " },
-            { data: roundDecimal(value / 4), text: "即時契約容量占比 " },
+            { data: newValue, text: "即時功率 " },
+            { data: roundDecimal(newValue / 4), text: "即時契約容量占比 " },
          ]),
        );
+      }
+      sub.attach("changed", function (prop) {
+        if (prop && prop.$displayName === "Out") {
+          passValueToFront(prop.$getValue().getValueDisplay())
+        }
+      })
+        sub.attach("subscribed", function (prop) {
+          if (prop && prop.$displayName === "Out") {
+            passValueToFront(prop.$getValue().getValueDisplay())
+          }
      });
+      // ord 為要訂閱的點位
      baja.Ord.make(`local:|foxs:|station:|slot:/${ordPath}`)
        .get()
-        .then((folder) => {
-          folder
-            .getSlots()
-            .is("control:NumericWritable")
-            .eachValue((point) => {
-              if (point.getDisplayName() === "P") {
-                baja.Ord.make(
-                  `local:|foxs:|station:|slot:/TPE/B1/EE/E4/R2F/NA/WHT/N1/${point.getDisplayName()}`,
-                ).get({
-                  subscriber: sub,
-                });
-              }
-            });
-        });
+        .then(folder => {
+          folder.getSlots().is("control:NumericWritable").eachValue((point) => {
+            if (point.getDisplayName() === "P") {
+              baja.Ord.make(`local:|foxs:|station:|slot:/${ordPath}/${point.getDisplayName() }`).get({ subscriber: sub })
+            }
+          })
+        })
    });
 }
--- a/ibms_react/src/utils/baja/index.js
+++ b/ibms_react/src/utils/baja/index.js
@ -1,5 +1,5 @@
 import { getBuiAlarmStateByBaja, getDeviceAlarmByBaja } from "./alarmBaja";
-import { SubscribeDeviceByBaja } from "./deviceBaja";
+import { SubscribeDeviceTempByBaja } from "./deviceBaja";
 import { getTotalElectricByBaja, getCurPower } from "./electricityBaja";
 // 下載 N4 內置requireJS
 function loadRequireJS() {
@ -25,10 +25,14 @@ function setUserAccountByBaja(callBackFunc = null) {

 export {
  loadRequireJS,
+  // 使用者
  setUserAccountByBaja,
+  // alarm
  getBuiAlarmStateByBaja,
  getDeviceAlarmByBaja,
-  SubscribeDeviceByBaja,
+  // device
+  SubscribeDeviceTempByBaja,
+  // eletricity
  getTotalElectricByBaja,
  getCurPower,
 };
--- a/ibms_react/src/utils/forge.js
+++ b/ibms_react/src/utils/forge.js
@ -1,5 +1,5 @@
 import { forgeTokenBaseUrl } from "@CON";
-import { loadDataVizExtn } from "@STORE";
+import { loadDataVizExtn, loadModel } from "@STORE";
 // 載入 forgeCss 樣式
 function loadForgeCss(src) {
  const link = document.createElement("link");
@ -72,15 +72,19 @@ export function modelLoad(viewer, urn, dispatch) {
  const documentId = `urn:${urn}`;
  window.Autodesk.Viewing.Document.load(documentId, onDocumentLoadSuccess, onDocumentLoadFailure);

-  function onDocumentLoadSuccess(viewerDocument) {
+  async function onDocumentLoadSuccess(viewerDocument) {
    var defaultModel = viewerDocument.getRoot().getDefaultGeometry();
    viewer.loadDocumentNode(viewerDocument, defaultModel);

-    viewer.addEventListener(window.Autodesk.Viewing.GEOMETRY_LOADED_EVENT, async function () {
-      // 取得所有 forge dbid
-      const allDbIds = getAllDbIds(this);
-      const dataVizExtn = await viewer.loadExtension("Autodesk.DataVisualization");
-      dispatch(loadDataVizExtn(dataVizExtn));
+    viewer.addEventListener(window.Autodesk.Viewing.GEOMETRY_LOADED_EVENT, async ()=> {
+      console.log(viewer.model)
+      dispatch(loadModel(viewer.model))
+    // sprites
+    const dataVizExtn = await viewer.loadExtension("Autodesk.DataVisualization");
+    dispatch(loadDataVizExtn(dataVizExtn));
+    // heatmap
+    //const structureInfo = new window.Autodesk.DataVisualization.Core.ModelStructureInfo(viewer.model);
+    //dispatch(loadStructureInfo(structureInfo));
    });
  }

@ -89,13 +93,4 @@ export function modelLoad(viewer, urn, dispatch) {
  }
 }

-// 取得 forge dbid
-function getAllDbIds(viewer) {
-  var instanceTree = viewer.model?.getData().instanceTree;

-  var allDbIdsStr = Object.keys(instanceTree.nodeAccess.dbIdToIndex);
-
-  return allDbIdsStr.map(function (id) {
-    return parseInt(id);
-  });
-}
--- a/ibms_react/src/utils/index.js
+++ b/ibms_react/src/utils/index.js
@ -1,9 +1,13 @@
 import {
  loadRequireJS,
+  // 使用者
  setUserAccountByBaja,
+  // alarm
  getBuiAlarmStateByBaja,
  getDeviceAlarmByBaja,
-  SubscribeDeviceByBaja,
+  // device
+  SubscribeDeviceTempByBaja,
+  // eletricity
  getTotalElectricByBaja,
  getCurPower,
 } from "./baja/index";
@ -14,10 +18,14 @@ import { userLogin } from "./login";
 import { roundDecimal } from "./math";
 export {
  loadRequireJS,
+  // 使用者
  setUserAccountByBaja,
+  // alarm
  getBuiAlarmStateByBaja,
  getDeviceAlarmByBaja,
-  SubscribeDeviceByBaja,
+  // device
+  SubscribeDeviceTempByBaja,
+  // eletricity
  getTotalElectricByBaja,
  getCurPower,
  forgeInit,
				`@ -1 +0,0 @@`
				<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 841.9 595.3"><g fill="#61DAFB"><path d="M666.3 296.5c0-32.5-40.7-63.3-103.1-82.4 14.4-63.6 8-114.2-20.2-130.4-6.5-3.8-14.1-5.6-22.4-5.6v22.3c4.6 0 8.3.9 11.4 2.6 13.6 7.8 19.5 37.5 14.9 75.7-1.1 9.4-2.9 19.3-5.1 29.4-19.6-4.8-41-8.5-63.5-10.9-13.5-18.5-27.5-35.3-41.6-50 32.6-30.3 63.2-46.9 84-46.9V78c-27.5 0-63.5 19.6-99.9 53.6-36.4-33.8-72.4-53.2-99.9-53.2v22.3c20.7 0 51.4 16.5 84 46.6-14 14.7-28 31.4-41.3 49.9-22.6 2.4-44 6.1-63.6 11-2.3-10-4-19.7-5.2-29-4.7-38.2 1.1-67.9 14.6-75.8 3-1.8 6.9-2.6 11.5-2.6V78.5c-8.4 0-16 1.8-22.6 5.6-28.1 16.2-34.4 66.7-19.9 130.1-62.2 19.2-102.7 49.9-102.7 82.3 0 32.5 40.7 63.3 103.1 82.4-14.4 63.6-8 114.2 20.2 130.4 6.5 3.8 14.1 5.6 22.5 5.6 27.5 0 63.5-19.6 99.9-53.6 36.4 33.8 72.4 53.2 99.9 53.2 8.4 0 16-1.8 22.6-5.6 28.1-16.2 34.4-66.7 19.9-130.1 62-19.1 102.5-49.9 102.5-82.3zm-130.2-66.7c-3.7 12.9-8.3 26.2-13.5 39.5-4.1-8-8.4-16-13.1-24-4.6-8-9.5-15.8-14.4-23.4 14.2 2.1 27.9 4.7 41 7.9zm-45.8 106.5c-7.8 13.5-15.8 26.3-24.1 38.2-14.9 1.3-30 2-45.2 2-15.1 0-30.2-.7-45-1.9-8.3-11.9-16.4-24.6-24.2-38-7.6-13.1-14.5-26.4-20.8-39.8 6.2-13.4 13.2-26.8 20.7-39.9 7.8-13.5 15.8-26.3 24.1-38.2 14.9-1.3 30-2 45.2-2 15.1 0 30.2.7 45 1.9 8.3 11.9 16.4 24.6 24.2 38 7.6 13.1 14.5 26.4 20.8 39.8-6.3 13.4-13.2 26.8-20.7 39.9zm32.3-13c5.4 13.4 10 26.8 13.8 39.8-13.1 3.2-26.9 5.9-41.2 8 4.9-7.7 9.8-15.6 14.4-23.7 4.6-8 8.9-16.1 13-24.1zM421.2 430c-9.3-9.6-18.6-20.3-27.8-32 9 .4 18.2.7 27.5.7 9.4 0 18.7-.2 27.8-.7-9 11.7-18.3 22.4-27.5 32zm-74.4-58.9c-14.2-2.1-27.9-4.7-41-7.9 3.7-12.9 8.3-26.2 13.5-39.5 4.1 8 8.4 16 13.1 24 4.7 8 9.5 15.8 14.4 23.4zM420.7 163c9.3 9.6 18.6 20.3 27.8 32-9-.4-18.2-.7-27.5-.7-9.4 0-18.7.2-27.8.7 9-11.7 18.3-22.4 27.5-32zm-74 58.9c-4.9 7.7-9.8 15.6-14.4 23.7-4.6 8-8.9 16-13 24-5.4-13.4-10-26.8-13.8-39.8 13.1-3.1 26.9-5.8 41.2-7.9zm-90.5 125.2c-35.4-15.1-58.3-34.9-58.3-50.6 0-15.7 22.9-35.6 58.3-50.6 8.6-3.7 18-7 27.7-10.1 5.7 19.6 13.2 40 22.5 60.9-9.2 20.8-16.6 41.1-22.2 60.6-9.9-3.1-19.3-6.5-28-10.2zM310 490c-13.6-7.8-19.5-37.5-14.9-75.7 1.1-9.4 2.9-19.3 5.1-29.4 19.6 4.8 41 8.5 63.5 10.9 13.5 18.5 27.5 35.3 41.6 50-32.6 30.3-63.2 46.9-84 46.9-4.5-.1-8.3-1-11.3-2.7zm237.2-76.2c4.7 38.2-1.1 67.9-14.6 75.8-3 1.8-6.9 2.6-11.5 2.6-20.7 0-51.4-16.5-84-46.6 14-14.7 28-31.4 41.3-49.9 22.6-2.4 44-6.1 63.6-11 2.3 10.1 4.1 19.8 5.2 29.1zm38.5-66.7c-8.6 3.7-18 7-27.7 10.1-5.7-19.6-13.2-40-22.5-60.9 9.2-20.8 16.6-41.1 22.2-60.6 9.9 3.1 19.3 6.5 28.1 10.2 35.4 15.1 58.3 34.9 58.3 50.6-.1 15.7-23 35.6-58.4 50.6zM320.8 78.4z"/><circle cx="420.9" cy="296.5" r="45.7"/><path d="M520.5 78.1z"/></g></svg>