diff --git a/Frontend/_dashboard.html b/Frontend/_dashboard.html
index ab70fcc..51df0a6 100644
--- a/Frontend/_dashboard.html
+++ b/Frontend/_dashboard.html
@@ -308,22 +308,14 @@
 
     //取得第一筆電錶
     function getFirstEletric() {
-        let url = baseApiUrl + "/api/Device/GetDeviceList";
-        let sendData = {
-            sub_system_tag: "E4",
-            building_tag: pageAct.buiTag,
-        };
-        objSendData.Data = sendData;
-        ytAjax = new YourTeam.Ajax(url, objSendData, function (res) {
+        let url = baseApiUrl + "/api/Energe/GetElecBySubSysTag";
+
+        ytAjax = new YourTeam.Ajax(url, null, function (res) {
             if (!res || res.code != "0000" || !res.data) {
 
             } else {
-               
-                $.each(res.data, (index, floObj) => {
-                    $.each(floObj.device_list, (index2, devObj) => {
-                        tarElePath = devObj.device_number;
-                    })
-                })
+                subSysElecList = res.data;
+                tarElePath = subSysElecList.filter(x => x.mainSubTag == "total")[0]?.system_device_tag ?? "";
                 startPageLoading();
                 getSubBaja();
                 getElectricBaja();
@@ -803,6 +795,7 @@
 
     function subDeviceSetStatus() {
         let subOrdPath = {
+            "area_tag": pageAct.AreaTag,
             "building_tag": pageAct.buiTag,
             "system_tag": "ELEV",
             "name_tag": "EL",
diff --git a/Frontend/_sysElevator.html b/Frontend/_sysElevator.html
index aec5321..9201177 100644
--- a/Frontend/_sysElevator.html
+++ b/Frontend/_sysElevator.html
@@ -920,6 +920,7 @@
     var elev3DOption = {};
     var elev3DObj = [];
     var subOrdPath = {
+        "area_tag": pageAct.AreaTag,
         "building_tag": pageAct.buiTag,
         "system_tag": pageAct.sysMainTag,
         "name_tag": pageAct.sysSubTag,
@@ -1970,8 +1971,6 @@
                 var dataPoint = floChart.convertFromPixel({ geoIndex: 0 }, pixelPoint);
                 console.log(dataPoint);
 
-
-
                 temp_device_on_floor_map = [{
                     device_guid: selected_temp_device.device_guid,
                     device_full_name: selected_temp_device.device_full_name,
diff --git a/Frontend/_sysMonAll.html b/Frontend/_sysMonAll.html
index ae64eb7..7713a57 100644
--- a/Frontend/_sysMonAll.html
+++ b/Frontend/_sysMonAll.html
@@ -1,9 +1,8 @@
 <style>
-    
 </style>
 
 <div class="row">
-    <div class="col-sm-12 col-xl-5">
+    <div class="col-sm-12 col-xl-6">
         <div class="d-flex mb-4" style="gap:15px">
             <div class="row m-0 align-items-center">
                 <span id="sysNorLight" class="circle-light mr-2 " data-light-type="normal"></span>
@@ -25,7 +24,7 @@
         </div>
     </div>
     <div class="col-sm-12 col-xl-7">
-       
+
     </div>
 </div>
 
@@ -37,46 +36,49 @@
 
 <script>
     var allDevList = [];  //全設備清單
+    
     $(function () {
         getFloDevList();
         setLightColor();
-        
-        subDevice();
+
+
     })
 
     //baja 訂閱設備
     function subDevice() {
-        myBaja = new subscriptionDevices();
-        var ordPath = {
-            "building_tag": pageAct.buiTag,
-            "system_tag": pageAct.sysMainTag,
-            "name_tag": pageAct.sysSubTag,
+        if (myBaja == null) {
+            myBaja = new subscriptionDevices();
+            var ordPath = {
+                "area_tag": pageAct.AreaTag,
+                "building_tag": pageAct.buiTag,
+                "system_tag": pageAct.sysMainTag,
+                "name_tag": pageAct.sysSubTag,
+            }
+            myBaja.setSubscribeDevicesByBql(ordPath);
+            myBaja.setSubscribeDevicesCallBack(function (data) {
+                let matchDevice = allDevList.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;
+
+                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");
+                }
+                setLightColor();
+            });
+
+            myBaja.setSubscribeDeviceEndCallBack(function (data) {
+                endPageLoading();
+            });
         }
-        myBaja.setSubscribeDevicesByBql(ordPath);
-        myBaja.setSubscribeDevicesCallBack(function (data) {
-            let matchDevice = allDevList.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;
-
-            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");
-            }
-            setLightColor();
-        });
-
-        myBaja.setSubscribeDeviceEndCallBack(function (data) {
-            endPageLoading();
-        });
-        
     }
     //根據 data-type 設置顏色 (判斷後台是否有設定，若無則帶預設)
     function setLightColor() {
@@ -121,14 +123,14 @@
             } else {
                 let strHtml = ``;
                 $.each(res.data, (index, floObj) => {
-                    strHtml += `<div class='d-flex justify-content-start mb-5' style="">`
-                    strHtml += `<button id="floItemBtn${floObj.full_name}" type="button" class="btn btn-primary waves-effect waves-themed mr-5 align-self-center" >${floObj.full_name}</button>`
-
+                    strHtml += `<div class='d-flex justify-content-start mb-5 ' style="">`
+                    strHtml += `<button id="floItemBtn${floObj.full_name}" type="button" class="btn btn-primary waves-effect waves-themed mr-5 mt-1 align-self-start" >${floObj.full_name}</button>`
+                    strHtml += `<div class="col p-0 d-grid grid-gap-5 grid-temp-col-c" style="--c-grid-temp-col:repeat(auto-fill,minmax(250px,1fr))">`
                     $.each(floObj.device_list, (index2, devObj) => {
                         console.log(">>>> url: " + baseImgUrl + " , img: " + varPathImg + ", icon: " + devObj.device_master_icon);
                         allDevList.push(devObj);
-                        
-                        strHtml += `<div class="card m-1 border device-wrap" style="width:300px">
+
+                        strHtml += `<div class="card m-1 border device-wrap">
                                         <div class="card-body p-2">
                                             <div class="d-flex mb-2">
                                                 <div  class="mr-5 cur-poi">
@@ -146,8 +148,13 @@
                                         </div>
                                     </div>`;
                     })
-                    strHtml += "</div>"
+                    strHtml += "</div></div>";
                 })
+                if (!res.data || res.data.length == 0) {
+                    endPageLoading();
+                } else {
+                    subDevice();
+                }
                 $("#floDevList").append(strHtml);
                 initPopover();
             }
diff --git a/Frontend/_systemMonitor.html b/Frontend/_systemMonitor.html
index a4661be..0f16397 100644
--- a/Frontend/_systemMonitor.html
+++ b/Frontend/_systemMonitor.html
@@ -18,7 +18,7 @@
 
 <script>
     var floList = [];
-    
+    var myBaja = null;
     $(function () {
         $("#sysSubText").text(pageAct.sysSubName);
         getFloList();
diff --git a/Frontend/css/site.css b/Frontend/css/site.css
index 8111c27..a7e4001 100644
--- a/Frontend/css/site.css
+++ b/Frontend/css/site.css
@@ -207,6 +207,22 @@ input.toggle:checked {
 input:-webkit-autofill {
      background-color:rgba(0, 0, 0, 0.15)!important;
 }
+
+.d-grid {
+    display: grid;
+}
+
+.grid-gap-1 { grid-gap: 1px; }
+.grid-gap-2 { grid-gap: 2px; }
+.grid-gap-3 { grid-gap: 3px; }
+.grid-gap-4 { grid-gap: 4px; }
+.grid-gap-5 { grid-gap: 5px; }
+.grid-gap-c { grid-gap: var(--c-grid-gap); }
+
+.grid-temp-col-c {
+    grid-template-columns: var(--c-grid-temp-col);
+}
+
 @keyframes lds-ring {
     0% {
         transform: rotate(0deg);
diff --git a/Frontend/index.html b/Frontend/index.html
index 44799d0..0f8bbd6 100644
--- a/Frontend/index.html
+++ b/Frontend/index.html
@@ -2091,6 +2091,10 @@ License: You must have a valid license purchased only from wrapbootstrap.com (li
         var loadingTip = '';
         var pageAct = {};  //記錄全頁面已選擇項目
         pageAct.AreaTag = "TPE";
+        if (localStorage.getItem("buiTag")) {
+            pageAct.buiTag = localStorage.getItem("buiTag");
+        }
+
         if (location.href.indexOf("ord") != -1) {
             location.href = "/file/index.html"
         }
@@ -2230,7 +2234,11 @@ License: You must have a valid license purchased only from wrapbootstrap.com (li
                         } else {
                             let strHtml = ``;
                             $.each(res.data, (index, buiObj) => {
-                                strHtml += `<a id="buiBtn${buiObj.building_tag}" data-urn="${buiObj.urn_3D}" class="dropdown-item" href="javascript:;">${buiObj.full_name}</a>`;
+                                let actStr = "";
+                                if (pageAct.buiTag == buiObj.building_tag) {
+                                    actStr = "active";
+                                }
+                                strHtml += `<a id="buiBtn${buiObj.building_tag}" data-urn="${buiObj.urn_3D}" class="dropdown-item ${actStr}" href="javascript:;">${buiObj.full_name}</a>`;
                             })
                             $("#buiList").append(strHtml).droSetItem();  //droSetItem 預設第一筆 active
                         }
@@ -2322,9 +2330,9 @@ License: You must have a valid license purchased only from wrapbootstrap.com (li
                 onEvent("active:change", "#buiList", function (e, actEle) {
                     if (actEle) {
                         pageAct.buiTag = $(actEle).prop("id").split("buiBtn")[1];
+                        localStorage.setItem("buiTag", pageAct.buiTag);
                         pageAct.urn = $(actEle).data("urn");
                     }
-
                 })
 
                 $(window).on("timeout:3s", function () {
@@ -2476,7 +2484,7 @@ License: You must have a valid license purchased only from wrapbootstrap.com (li
                             //loadErrRecTable2($(oriEle).data("number"));
                             //loadErrRecTable();
                             loadErr($(oriEle).data("number"));
-                            subDeviceSetTable ? subDeviceSetTable($(oriEle).data("number")) : ""
+                            typeof subDeviceSetTable != "undefined" ? subDeviceSetTable($(oriEle).data("number")) : ""
                         }
                     })
                 })
diff --git a/Frontend/js/n4js/bajatest.js b/Frontend/js/n4js/bajatest.js
index c89a906..48a98b9 100644
--- a/Frontend/js/n4js/bajatest.js
+++ b/Frontend/js/n4js/bajatest.js
@@ -147,8 +147,8 @@ function BajaSubscribeDevicesByBql() {
         // var building_tag = "H";
         // var system_tag = "M10";
         // baja.Ord.make(`ip:greencloud.fic.com.tw|foxs:|station:|slot:/Arena/${building_tag}/${system_tag}|bql:select name, displayname, slotPath, out.value, out from control:ControlPoint`)
-        console.log(`local:|foxs:|station:|slot:/TPE/${ordPath.building_tag}/${ordPath.system_tag}/${ordPath.name_tag}|bql:select name, displayname, slotPath, out.value, out, facets  from control:ControlPoint`);
-        baja.Ord.make(`local:|foxs:|station:|slot:/TPE/${ordPath.building_tag}/${ordPath.system_tag}/${ordPath.name_tag}|bql:select name, displayname, slotPath, out.value, out, facets  from control:ControlPoint`)
+        console.log(`local:|foxs:|station:|slot:/${ordPath.area_tag}/${ordPath.building_tag}/${ordPath.system_tag}/${ordPath.name_tag}|bql:select name, displayname, slotPath, out.value, out, facets  from control:ControlPoint`);
+        baja.Ord.make(`local:|foxs:|station:|slot:/${ordPath.area_tag}/${ordPath.building_tag}/${ordPath.system_tag}/${ordPath.name_tag}|bql:select name, displayname, slotPath, out.value, out, facets  from control:ControlPoint`)
             .get(
                 function (table) {
                     var tableStart, tableFinish;
@@ -296,7 +296,7 @@ function BajaSubscribeAlarmsByBql(ordPathForAlarm) {
                 var sourceState = (this.$map.$map.in10.$val.$map.$map.value.$display) == 'true' ? "Offnormal" : "Normal";
 
                 var modify_target_device = {
-                    "system": "TPE_" + ordPathForAlarm.building_tag + "_" + ordPathForAlarm.system_tag + "_" + ordPathForAlarm.name_tag,
+                    "system": ordPathForAlarm.area_tag + "_" + ordPathForAlarm.building_tag + "_" + ordPathForAlarm.system_tag + "_" + ordPathForAlarm.name_tag,
                     "sourceState": sourceState ? sourceState : null
                 }
 
@@ -307,8 +307,8 @@ function BajaSubscribeAlarmsByBql(ordPathForAlarm) {
         });
 
         //使用bql語法
-        console.log(`local:|foxs:|alarm:|bql:select top 1 timestamp, sourceState, normalTime where alarmData.sourceName like '%TPE_${ordPathForAlarm.building_tag}_${ordPathForAlarm.system_tag}_${ordPathForAlarm.name_tag}_%' order by timestamp desc`);
-        baja.Ord.make(`local:|foxs:|alarm:|bql:select top 1 timestamp, sourceState, alarmData, alarmData.sourceName, normalTime where alarmData.sourceName like '%TPE_${ordPathForAlarm.building_tag}_${ordPathForAlarm.system_tag}_${ordPathForAlarm.name_tag}_%' order by timestamp desc`)
+        console.log(`local:|foxs:|alarm:|bql:select top 1 timestamp, sourceState, normalTime where alarmData.sourceName like '%${ordPathForAlarm.area_tag}_${ordPathForAlarm.building_tag}_${ordPathForAlarm.system_tag}_${ordPathForAlarm.name_tag}_%' order by timestamp desc`);
+        baja.Ord.make(`local:|foxs:|alarm:|bql:select top 1 timestamp, sourceState, alarmData, alarmData.sourceName, normalTime where alarmData.sourceName like '%${ordPathForAlarm.area_tag}_${ordPathForAlarm.building_tag}_${ordPathForAlarm.system_tag}_${ordPathForAlarm.name_tag}_%' order by timestamp desc`)
             .get(
                 function (table) {
                     var tableStart, tableFinish;
@@ -338,7 +338,7 @@ function BajaSubscribeAlarmsByBql(ordPathForAlarm) {
                             var normalTime = this.getDisplay("normalTime");
 
                             var modify_target_device = {
-                                "system": "TPE_" + ordPathForAlarm.building_tag + "_" + ordPathForAlarm.system_tag + "_" + ordPathForAlarm.name_tag,
+                                "system": ordPathForAlarm.area_tag + "_" + ordPathForAlarm.building_tag + "_" + ordPathForAlarm.system_tag + "_" + ordPathForAlarm.name_tag,
                                 "sourceState": sourceState ? sourceState : null
                             }
                             totalTargetDevice.push(modify_target_device);