[前端] 更新修改部分

Frontend/_historyData.html

@@ -16,7 +16,17 @@
 
         </div>
         <div class="col-sm-12 col-xl-10">
-            <div class="row bg-dark p-2 mb-5">
+            <div class="row bg-dark p-2">
+                <div>
+                    <div class="py-2 col-12" id="his_building">
+                        <div
+                        class="item btn-group btn-group-toggle"
+                        data-toggle="buttons"
+                        ></div>
+                    </div>
+                </div>
+            </div>
+            <div class="row bg-dark p-2 mb-5 align-items-center">
                 <div class="col-auto">
                     <div class="btn-group">
                         <button type="button" onclick="setDateType('day', this)" class="btn btn-secondary waves-effect waves-themed">日期</button>
@@ -70,9 +80,20 @@
 
 <script>
     var historyTable = null;
+    var buildingTag = null;
     $(function () {
-        initList();
+        let html = "";
+        for (let building of pageAct.buildList) {
+            html += `<label class="btn btn-secondary">
+                            <input type="radio" name="buildingRadio" id="radio_${building.building_tag}" value="${building.building_tag}" onChange="SelectBuild(this,'${building.building_tag}')"> ${building.full_name}
+                        </label>`;
+        }
+        $("#his_building").find(".item").empty();
+        $("#his_building").find(".item").append(html);
+        if ($("#his_building .item label").first())
+            $("#his_building .item label").first().click()
 
+        initList();
         // default list filter
         initApp.listFilter($('#js_default_list'), $('#js_default_list_filter'));
         // custom response message
@@ -161,11 +182,13 @@
                 }
             }
         });
+        
     });
 
     function initList() {
+        $(loadEle).Loading("start");
         let sendData = {
-            building_tag: pageAct.buiTag
+            building_tag: buildingTag
         }
         objSendData.Data = sendData;
         let url = baseApiUrl + "/api/History/GetMainSub";
@@ -178,8 +201,8 @@
                     strHtml += `<li>
                                     <a href="#" data-filter-tags="${val.full_name.toLowerCase()}" data-maintag="${val.main_system_tag}">
                                         <span class="nav-link-text">${val.full_name}</span>
-                                    </a>
-                                    <ul style="${index == 0 ? `display:block;` : ``}">`;
+                                        </a>
+                                        <ul style="${index == 0 ? `display:block;` : ``}">`;
                                             
                     i1 = (val.history_Sub_systems != null && i1 == null) ? index : null;
                 }
@@ -232,6 +255,7 @@
             $('#js_nested_list').html(strHtml);
             $(`[data-tabname="hisListItem"]`).YTTab();
         }
+        $(loadEle).Loading("close");
         ytAjax = new YourTeam.Ajax(url, objSendData, success, null, "POST").send();
     }
 
@@ -266,7 +290,6 @@
         var edt = new Date(new Date().setDate(sdt.getDate() + 1));
         start = start ?? sdt.toLocaleDateString();
         end = end ?? edt.toLocaleDateString();
-        $(loadEle).Loading("start");
         callBackFromHistory()
         getHistoryDataByBaja(pageAct.deviceNumber + "_" + pageAct.deviceItem,
             new Date(start).getTime(),
@@ -277,9 +300,7 @@
     }
 
     function callBackFromHistory(res = '{"count":0,"data":[]}') {
-        // console.log("@H1",res)
         res = JSON.parse(res);
-        // console.log("@history",res.data)
         loadTable(res.data);
         if (historyTable != null) {
             let t = $('#historyTable').dataTable();
@@ -288,7 +309,6 @@
             if (res.data.length > 0)
                 t.fnAddData(res.data);
         }
-        $(loadEle).Loading("close");
     }
 
     function setValue(deviceNumber, deviceName, deviceItem, elem) {
@@ -388,9 +408,10 @@
     }
 
     function loadTable(data) {
+        $(loadEle).Loading("start");
+
         if (data) {
             $.each(data, function (i, v) {
-                // console.log("loadTable",pageAct.devicePoiName.split(" ")[0])
                 v.type = pageAct.devicePoiName.split(" ")[0];
             });
 
@@ -425,7 +446,6 @@
 					"title": "紀錄時間",
 					"data": "timestamp",
 					"render": function (data) {
-						// console.log(data)
 						return displayDate(data, "datetime");
 					}
 				}
@@ -433,6 +453,7 @@
 
 			historyTable = new YourTeam.JqDataTables.getTableByStatic(tag, data, columns, column_defs, null, null, null, null, "tpi");
         }
+        $(loadEle).Loading("close");
     }
 
     function exportExcel() {
@@ -450,4 +471,26 @@
                 location.href = baseApiUrl + "/api/df?path=" + rel.data.split('/')[0] + "&fileName=" + rel.data.split('/')[1] + "&token=" + cookies.get("JWT-Authorization");
         }, null, "POST").send();
     }
+
+    //選擇棟別
+  function SelectBuild(e, building_tag) {
+    checkIsSelectedBuilding();
+  }
+
+  function checkIsSelectedBuilding() {
+    let result = false;
+    let buildingRadios = $("[name=buildingRadio]:checked");
+    buildingTag = null;
+    if (buildingRadios && buildingRadios.length > 0) {
+        $("[name=buildingRadio]").parent().removeClass("btn-info");
+        $("[name=buildingRadio]").parent().addClass("btn-secondary");
+        $("[name=buildingRadio]:checked").parent().removeClass("btn-secondary");
+        $("[name=buildingRadio]:checked").parent().addClass("btn-info");
+        buildingTag = buildingRadios.prop("id").split("_")[1]; //building tag
+        initList();
+        result = true;
+    } else {
+    }
+    return result;
+  }
 </script>