update

static/home.js

@@ -110,16 +110,16 @@ function factory_show(company){
     var factory_arr = new Array();
     for(var i=0;i<obj[1].length;i++){
         if(factory_arr.indexOf(obj[1][i].factory)==-1 && obj[1][i].company==company){
-            inner+="<button type='button' class='btn text-white m-1' id='factory " +obj[1][i].factory+ "' onclick=\"change_map(\'"+obj[1][i].company+"\',\'"+obj[1][i].factory+"\');\"";
-            inner += ">廠區"+obj[1][i].factory+"</button><button onclick=\"department_show(\'"+obj[1][i].company+"\',\'"+obj[1][i].factory+"\');\"> 查看</button>";
+            inner+="<button type='button' style='font-size:24px; padding:20px 100px' class='btn text-white me-3 mb-3' id='factory " +obj[1][i].factory+ "' onclick=\"change_map(\'"+obj[1][i].company+"\',\'"+obj[1][i].factory+"\');\"";
+            inner += ">廠區"+obj[1][i].factory+"</button><button  style='padding:20px 30px;font-size:20px;'  class='btn btn-primary mb-3' onclick=\"department_show(\'"+obj[1][i].company+"\',\'"+obj[1][i].factory+"\');\"> 查看</button>";
             factory_arr.push(obj[1][i].factory);
         }
     }
     //測試用
-    inner+="<button type='button' class='btn btn btn-outline-success m-1' id='factory B' onclick=\"change_map(\'"+obj[1][0].company+"\',\'B\');\"";
-    inner += ">廠區B</button> <button onclick=\"department_show(\'"+obj[1][0].company+"\',\'B\');\">查看 </button>";
-    inner+="<button type='button' class='btn btn btn-outline-success m-1' id='factory C' onclick=\"change_map(\'"+obj[1][0].company+"\',\'C\');\"";
-    inner += ">廠區C</button><button onclick=\"department_show(\'"+obj[1][0].company+"\',\'C\');\"> 查看</button>";
+    inner+="<div><button type='button'  style='font-size:24px; padding:20px 100px' class='btn btn btn-success me-3 mb-3' id='factory B' onclick=\"change_map(\'"+obj[1][0].company+"\',\'B\');\"";
+    inner += ">廠區B</button><button style='padding:20px 30px;font-size:20px;' class='btn btn-primary mb-3' onclick=\"department_show(\'"+obj[1][0].company+"\',\'B\');\">查看 </button></div>";
+    inner+="<div><button type='button' style='font-size:24px; padding:20px 100px' class='btn btn btn-success  me-3 mb-3' id='factory C' onclick=\"change_map(\'"+obj[1][0].company+"\',\'C\');\"";
+    inner += ">廠區C</button><button  style='padding:20px 30px;font-size:20px;'  class='btn btn-primary mb-3' onclick=\"department_show(\'"+obj[1][0].company+"\',\'C\');\"> 查看</button></div>";
     document.getElementById('company').innerHTML="";
     document.getElementById('company_text').innerHTML=company;
     document.getElementById('company_name').innerHTML="<button type='button' class='btn btn-primary m-1' onclick=\"company_show();\">返回</button> 公司"+ company + "";
@@ -182,7 +182,7 @@ function department_change(){
     var tower_group_arr = new Array();
     for(var i=0;i<obj[1].length;i++){
         if(tower_group_arr.indexOf(obj[1][i].group)==-1 && obj[1][i].company==document.getElementById('company_text').innerHTML/*&& obj[1][i].factory==document.getElementById('factory_text').innerHTML&& obj[1][i].department==document.getElementById("department_list").value*/){
-            inner+='<tr><td>' + obj[1][i].group + '</td><td>健康</td><td><button class="btn btn-primary m-1" onclick=\"towerGroup_show();\">查看</button></td></tr>' ;
+            inner+='<tr><td>' + obj[1][i].group + '</td><td style="color:#078b07" class="fw-bold">健康<i class="fas fa-check-circle ps-1"></i></td>\<td><button class="btn btn-primary m-1" onclick=\"towerGroup_show();\">查看</button></td></tr>' ;
             tower_group_arr.push(obj[1][i].group);
             console.log(inner);
         }
@@ -215,7 +215,7 @@ function tower(tower_group){
     var inner= '<p class="fw-bold">機組'+tower_group +'</p><table style="font-size: 16px;" class="table text-center"><tr><th>設備</th><th>馬達效能</th><th>機組狀態</th></tr>';
     for(var i=0;i<obj[1].length;i++){
         if(obj[1][i].company==document.getElementById('company_text').innerHTML/*&& obj[1][i].factory==document.getElementById('factory_text').innerHTML&& obj[1][i].department==document.getElementById("department_text").innerHTML*/&&obj[1][i].group==tower_group){
-            inner+='<tr><td>' + obj[1][i].tower + '</td><td>健康</td><td><button class="btn btn-primary m-1">查看</button></td></tr>';
+            inner+='<tr><td>' + obj[1][i].tower + '</td><td style="color:#078b07" class="fw-bold">健康<i class="fas fa-check-circle ps-1"></i></td>\<td><button class="btn btn-primary m-1">查看</button></td></tr>';
         }
     }
 

static/index.js

@@ -28,12 +28,12 @@ $("#btn_login").click(function () {
   });
 
   
-  $( ".side-bar-link" ).click(function() {
-    console.log(1);
-    alert('hi');
-    $(this).addClass("active");
-    $(".active").siblings().removeClass('active');
-  });
+  // $( ".side-bar-link" ).click(function() {
+  //   console.log(1);
+  //   alert('hi');
+  //   $(this).addClass("active");
+  //   $(".active").siblings().removeClass('active');
+  // });
 
 
   

templates/home.html

@@ -14,21 +14,14 @@
 
 <div class="card">
     <h1 class="fw-bold">機組狀態</h1>
-<div class="ps-3" id='company'></div>
-<div id='factory'>
-    <p id='company_name'></p>
-    <div class="mb-3" id='factory_select'> </div>
+
+    <div id='factory'>
+        <p id='company_name'></p>
         <div class="row px-0 mx-0">
             <div class="col-lg-6">
-                <div id='department'>
-                    <select style="display: none;" class="form-select" id="department_list" onChange="department_change();">
-                    </select>
-                    <div id='department_show'>
-                
-                    </div>
-                </div>
-                <div id='towergroup'>
-                
+                <div>
+                    <div class="ps-3" id='company'></div>
+                    <div class="mb-3" id='factory_select'> </div>
                 </div>
             </div>
             <div class="col-lg-6">
@@ -36,6 +29,12 @@
             </div>
         </div>
     </div>
+    <div id='department'>
+        <select style="display: none;" class="form-select" id="department_list" onChange="department_change();">
+        </select>
+        <div id='department_show'></div>
+    </div>
+    <div id='towergroup'></div>
 </div>
 <script type="text/javascript" src="static/home.js"></script>