update

static/channel.js

@@ -1,3 +1,5 @@
+
+
 obj="";
 obj2 = "";
 get_org();
@@ -152,7 +154,7 @@ xhr.send();
 function insertHTML(data){
     console.log(data);
     //aria.innerHTML=data[0].tower_name;
-    var inner='<table style="font-size:16px;" class="table"> <tr> <th>主軸分析 </th><th>軸承分析 </th><th>馬達分析 </th><th>齒輪分析 </th> </tr> <tr>';
+    var inner='<h1>故障診斷</h1><table style="font-size:16px;" class="table"> <tr> <th>主軸分析 </th><th>軸承分析 </th><th>馬達分析 </th><th>齒輪分析 </th> </tr> <tr>';
     inner+='<td><span style="color: #078B07;">正常</span>  不平衡 '+data.DW_Unbalance+'</td><td><span style="color: #078B07;">正常</span>  油膜旋震 '+data.DW_Whirl+'</td><td><span style="color: #078B07;">正常</span>  氣隙不均 '+data.DW_AirGap+'</td><td><span style="color: #078B07;">正常</span>  齒輪不對中 '+data.DW_GMisalignment+'</td></tr><tr>';
     inner+='<td><span style="color: #078B07;">正常</span>  軸彎曲 '+data.DW_Unbalance+'</td><td><span style="color: #078B07;">正常</span>  油膜晃蕩 '+data.DW_Whirl+'</td><td><span style="color: #078B07;">正常</span>  轉子條斷裂 '+data.DW_AirGap+'</td><td><span style="color: #078B07;">正常</span>  齒輪斷齒 '+data.DW_GMisalignment+'</td></tr><tr>';
     inner+='<td><span style="color: #078B07;">正常</span>  不對中 '+data.DW_Unbalance+'</td><td><span style="color: #078B07;">正常</span>  內還損傷 '+data.DW_Whirl+'</td><td><span style="color: #078B07;">正常</span>  相位問題 '+data.DW_AirGap+'</td><td><span style="color: #078B07;">正常</span>  齒輪磨損 '+data.DW_GMisalignment+'</td></tr><tr>';

static/home.js

@@ -1,3 +1,4 @@
+
 start();
 user_role = '';
 data = '';

static/index.css

@@ -182,12 +182,7 @@ color:#fff;
 padding: 10px;
 }
 #tower{
-width: 100%;
-padding: 10px;
-border-radius: 5px;
-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.3);
 border:none;
-
 }
 h1{
 font-size: 1.6rem;

static/index.js

@@ -26,9 +26,15 @@ $("#btn_login").click(function () {
     console.log(data);    // test 
     xhr.send(data);
   });
+
   
-  
-  
+  $( ".side-bar-link" ).click(function() {
+    console.log(1);
+    alert('hi');
+    $(this).addClass("active");
+    $(".active").siblings().removeClass('active');
+  });
+
 
   
   

static/tower.js

@@ -1,3 +1,4 @@
+
 var xhr = new XMLHttpRequest();
 var url = "tower/org";
 obj = "";

static/vibration.js

@@ -1,3 +1,4 @@
+
 var xhr = new XMLHttpRequest();
 var url = "tower/org";
 obj = "";

templates/index.html

@@ -51,6 +51,12 @@
         <li><a href="/system" class="side-bar-link">系統設定</a></li>
       </ul>
     </div>
+    <!-- <script>
+      $(".side-bar-link").click(function () {
+        $(this).addClass("active");
+        $(".active").siblings().removeClass('active');
+      });
+    </script> -->
     <div id='content'>
       {% block body %}
 
@@ -70,7 +76,9 @@
     integrity="sha384-Atwg2Pkwv9vp0ygtn1JAojH0nYbwNJLPhwyoVbhoPwBhjQPR5VtM2+xf0Uwh9KtT"
     crossorigin="anonymous"></script>
   <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
-  <script src="https://cdnjs.cloudflare.com/ajax/libs/gauge.js/1.3.7/gauge.min.js" integrity="sha512-J0d1VfdfTSDoDPEsahCtf2nC+groXdWkuQFyJjS+s3CpKj63X9Hf3pMEJtjIJt/ODh0QwTRx2/OioL+9fMoqSA==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
+  <script src="https://cdnjs.cloudflare.com/ajax/libs/gauge.js/1.3.7/gauge.min.js"
+    integrity="sha512-J0d1VfdfTSDoDPEsahCtf2nC+groXdWkuQFyJjS+s3CpKj63X9Hf3pMEJtjIJt/ODh0QwTRx2/OioL+9fMoqSA=="
+    crossorigin="anonymous" referrerpolicy="no-referrer"></script>
   <script type="text/javascript" src="/static/index.js"></script>
 </body>
 

templates/tower.html

@@ -44,9 +44,10 @@
 </div>
 <div id="tower-box">
     <div id="tower-img" class="card text-white">
-        
-        <img src="/static/img/1631004814192.jpg" class="img-fluid" alt="...">
-        <div id="tower">
+        <div class="text-center">
+            <img style="width: 80%;" src="/static/img/1631004814192.jpg" class="img-fluid" alt="...">
+        </div>
+        <div class="mt-3" id="tower">
         </div>
     </div>
 </div>

templates/vibration_test.html

@@ -32,16 +32,25 @@
 <div class="state card">
     <div class="row px-0 mx-0">
         <div class="col-lg-6">
-            <div class="device">
-                <p class="fw-bold mb-0">設備狀態:</p>
-                <h1 style="color: #078B07;">健康<i style="color: #078B07;" class="fas fa-check-circle ps-1"></i></h1>
-            </div>
-            <div class="Connect">
-                <p class="fw-bold mb-0">連線狀態:</p>
-                <h1 style="color: #078B07;">正常</h1>
+            <div class="row px-0 mx-0">
+                <div class="col-lg-6 py-3">
+
+                    <img style="object-fit: cover; width: 200px; height: 200px;border-radius: 50%;" class="img-fluid" src="/static/img/dev001.png" alt="">
+ 
+                </div>
+                <div class="col-lg-6 py-3">
+                    <div class="device">
+                        <p class="fw-bold mb-0">設備狀態:</p>
+                        <h1 style="color: #078B07;">健康<i style="color: #078B07;" class="fas fa-check-circle ps-1"></i></h1>
+                    </div>
+                    <div class="Connect">
+                        <p class="fw-bold mb-0">連線狀態:</p>
+                        <h1 style="color: #078B07;">正常</h1>
+                    </div>
+                </div>
             </div>
         </div>
-        <div class="col-lg-6">
+        <div class="col-lg-6 py-3">
             <div>
                 <p>設備位區:<span class="fw-bold">台塑</span></p>
             </div>
@@ -51,31 +60,53 @@
             <div>
                 <p>負責人:<span class="fw-bold">***</span></p>
             </div>
+            <div>
+                <p class="mb-0 mt-5">最後更新時間:2021/09/15 18:09</p>
+            </div>
 
         </div>
         <hr>
-        <div>
-            <p class="mb-0">最後更新時間:2021/09/15 18:09</p>
+        <div class="col-lg-12">
+            <div style="width: 60%; margin: auto;">
+                <div class="row px-0 mx-0">
+                    <div class="col-lg-6">
+                        <img class="img-fluid" src="/static/img/dev001-pic1.png" alt="">
+                    </div>
+                    <div class="col-lg-6">
+                        <img class="img-fluid" src="/static/img/dev001-pic2.png" alt="">
+                    </div>
+                </div>
+            </div>
         </div>
     </div>
 </div>
 <div id='test'></div>
-<div class="card mt-5">
-    <h1>通道列表</h1>
-    <table style="font-size: 16px;" class="table text-center">
-        <thead>
-            <tr>
-                <th>編號</th>
-                <th>vrms(mm/s)</th>
-                <th>健康指標</th>
-                <th>健康狀態</th>
-                <th>連線運作狀態</th>
-            </tr>
-            <tbody id="tower_info">
 
-            </tbody>
-        </thead>
-    </table>
+<div class="card mt-5">
+    <div class="row px-0 mx-0">
+        <div class="col-lg-6">
+            <h1>通道照片</h1>
+            <img class="img-fluid" src="/static/img/dev001-chl.png" alt="">
+        </div>
+        <div class="col-lg-6">
+            <h1>通道列表</h1>
+            <table style="font-size: 16px;" class="table text-center">
+                <thead>
+                    <tr>
+                        <th>編號</th>
+                        <th>vrms(mm/s)</th>
+                        <th>健康狀態</th>
+                        <th>健康指標</th>
+                        <th>連線運作狀態</th>
+                    </tr>
+                    <tbody id="tower_info">
+        
+                    </tbody>
+                </thead>
+            </table>
+        </div>
+       
+    </div>
 </div>
 <div id='tower_perfrom'></div>
 {% endblock %}