From a5c50ff60d14cad5ff27bfcade405c796f9ab0d3 Mon Sep 17 00:00:00 2001
From: vincent <1341870251@qq.com>
Date: 星期六, 30 五月 2020 09:29:25 +0800
Subject: [PATCH] #

---
 src/main/webapp/views/console.html |  151 +++++++++++++++++++++++++++-----------------------
 1 files changed, 82 insertions(+), 69 deletions(-)

diff --git a/src/main/webapp/views/console.html b/src/main/webapp/views/console.html
index d657c7b..987f16d 100644
--- a/src/main/webapp/views/console.html
+++ b/src/main/webapp/views/console.html
@@ -1,5 +1,6 @@
 <!DOCTYPE html>
 <html lang="en">
+<!--5灞� 28鍒� 1120搴撲綅-->
 <head>
     <meta charset="UTF-8">
     <title>WCS鎺у埗涓績</title>
@@ -10,84 +11,54 @@
     <link rel="stylesheet" type="text/css" href="../static/css/common.css">
     <link rel="stylesheet" type="text/css" href="../static/css/console.css">
     <script type="text/javascript" src="../static/js/jquery/jquery-3.3.1.min.js"></script>
+    <script type="text/javascript" src="../static/js/layer/layer.js"></script>
     <style>
-        /* 绔欑偣 */
-        .site {
-            color: #333;
-            height: 20px;
-            border: 1px solid #fff;
+        .system-state {
+            position: absolute;
+            top: 40px;
+            right: 20px;
+        }
+
+        .system-icon {
+            width: 100px;
+            height: 100px;
+            background-image: url("../static/image/stop48.png");
+            background-repeat: no-repeat;
+            background-size:100% 100%;
+            background-position: top center;
             cursor: pointer;
-            width: 50px;
-            text-align: center;
-            background-color: #21ff3a;
-            font-size: 13px;
-        }
-        /* 鏃犳晥绔欑偣锛堝繀椤诲湪site涓嬮潰锛� */
-        .site-none {
-            border: none;
-            background-color: transparent;
-        }
-
-        .main-part {
-            position: absolute;
-            top: 200px;
-            left: 400px;
-            /*transform: translate(-50%, 0);*/
-        }
-
-        /* --------- 杈撻�佺嚎鎬绘垚 --------- */
-        /* 杈撻�佺嚎绗竴鍒� */
-        .site-row-1 {
-            position: absolute;
-            left: 200px;
-            top: 72px;
-        }
-        .site-row-1 .site {
-            width: 100px;
-        }
-        /* 杈撻�佺嚎绗簩鍒� */
-        .site-row-2 {
-            position: absolute;
-            left: 300px;
-            top: 72px;
-        }
-        .site-row-2 .site {
-            width: 100px;
-        }
-        /* 杈撻�佺嚎绗笁鍒� */
-        .site-row-3 {
-            position: absolute;
-            left: 400px;
-            top: 72px;
-            width: 100px;
-        }
-        .site-row-3 .site {
-            float: left;
-            width: 100px;
-        }
-        /* 杈撻�佺嚎绗洓鍒� */
-        .site-row-4 {
-            position: absolute;
-            left: 500px;
-            top: 72px;
-            width: 100px;
-        }
-        .site-row-4 .site {
-            float: right;
-            width: 100px;
         }
 
     </style>
 </head>
 <body>
 <header>
-    <span>鎻忚堪淇℃伅</span>
+    <h1>鑷姩浠撳簱 WCS 鐩戞帶鍥�</h1>
+    <!-- 鐘舵�� -->
+    <div class="machine-state">
+        <div class="crn-state-group">
+            <span>鍫嗗灈鏈虹姸鎬�:</span>
+            <span class="crn-state" style="background-color: #21ff3a">鑷姩</span>
+            <span class="crn-state" style="background-color: red">寮傚父</span>
+        </div>
+        <div class="site-state-group">
+            <span>绔欑偣鐘舵��:</span>
+            <span class="site-state" style="background-color: #21ff3a;">鑷姩</span>
+            <span class="site-state" style="background-color: red;">寮傚父</span>
+        </div>
+    </div>
+    
+    <!-- 绯荤粺杩愯 -->
+    <div class="system-state">
+        <div class="system-icon"></div>
+    </div>
+    
 </header>
 <main>
 
     <!-- 宸﹁緭閫佺嚎 -->
     <!-- 绗竴鍒楋紙瀹藉害 100px锛�-->
-    <div class="site-row-1">
+    <div class="site-row site-row-1">
         <div id="site-1" class="site" style="width: 80px; height: 50px;line-height: 50px">1[9999]</div>
         <div id="site-2" class="site" >2</div>
         <div id="site-3" class="site" style="width: 80px; height: 30px;line-height: 30px">3</div>
@@ -99,7 +70,7 @@
         <div id="site-9" class="site" >9</div>
     </div>
     <!-- 绗簩鍒楋紙瀹藉害 100px锛� -->
-    <div class="site-row-2">
+    <div class="site-row site-row-2">
         <div id="site-32" class="site" style="width: 80px; height: 50px;line-height: 50px">32</div>
         <div id="site-31" class="site" >31</div>
         <div id="site-30" class="site" style="width: 80px; height: 30px;line-height: 30px">30</div>
@@ -115,15 +86,15 @@
         <div id="site-10" class="site" >10</div>
     </div>
     <!-- 绗笁鍒楋紙瀹藉害 100px锛�-->
-    <div class="site-row-3">
+    <div class="site-row site-row-3">
         <div class="site-none" style="width: 80px; height: 50px;line-height: 50px"></div>
         <div id="site-29" class="site" style="width: 50px;">29</div>
         <div id="site-28" class="site" style="width: 50px;">28</div>
         <div class="site-none" style="width: 80px; height: 50px;line-height: 30px"></div>
         <div id="site-24" class="site" >24</div>
     </div>
-    <!-- 绗笁鍒楋紙瀹藉害 100px锛�-->
-    <div class="site-row-4">
+    <!-- 绗洓鍒楋紙瀹藉害 100px锛�-->
+    <div class="site-row site-row-4">
         <div class="site-none" style="width: 80px; height: 50px;line-height: 50px"></div>
         <div id="site-27" class="site" >27</div>
         <div id="site-26" class="site" style="width: 80px; height: 30px;line-height: 30px">26</div>
@@ -161,6 +132,10 @@
             <button class="item">22</button>
             <button class="item">23</button>
             <button class="item">24</button>
+            <button class="item">25</button>
+            <button class="item">26</button>
+            <button class="item">27</button>
+            <button class="item">28</button>
             <div class="site site-none">&nbsp;&nbsp;&nbsp;&nbsp;</div>
         </div>
         <div class="stock-group">
@@ -189,6 +164,10 @@
             <button class="item">22</button>
             <button class="item">23</button>
             <button class="item">24</button>
+            <button class="item">25</button>
+            <button class="item">26</button>
+            <button class="item">27</button>
+            <button class="item">28</button>
             <div class="site site-none">&nbsp;&nbsp;&nbsp;&nbsp;</div>
         </div>
         <!-- 鍫嗗灈鏈� -->
@@ -223,6 +202,10 @@
             <button class="item">22</button>
             <button class="item">23</button>
             <button class="item">24</button>
+            <button class="item">25</button>
+            <button class="item">26</button>
+            <button class="item">27</button>
+            <button class="item">28</button>
             <div class="site site-none">&nbsp;&nbsp;&nbsp;&nbsp;</div>
         </div>
         <div class="stock-group">
@@ -251,6 +234,10 @@
             <button class="item">22</button>
             <button class="item">23</button>
             <button class="item">24</button>
+            <button class="item">25</button>
+            <button class="item">26</button>
+            <button class="item">27</button>
+            <button class="item">28</button>
             <div class="site site-none">&nbsp;&nbsp;&nbsp;&nbsp;</div>
         </div>
         <br>
@@ -284,6 +271,10 @@
             <button class="item">22</button>
             <button class="item">23</button>
             <button class="item">24</button>
+            <button class="item">25</button>
+            <button class="item">26</button>
+            <button class="item">27</button>
+            <button class="item">28</button>
             <div class="site site-none">&nbsp;&nbsp;&nbsp;&nbsp;</div>
         </div>
         <div class="stock-group">
@@ -312,6 +303,10 @@
             <button class="item">22</button>
             <button class="item">23</button>
             <button class="item">24</button>
+            <button class="item">25</button>
+            <button class="item">26</button>
+            <button class="item">27</button>
+            <button class="item">28</button>
             <div class="site site-none">&nbsp;&nbsp;&nbsp;&nbsp;</div>
         </div>
         <!-- 鍫嗗灈鏈� -->
@@ -346,6 +341,10 @@
             <button class="item">22</button>
             <button class="item">23</button>
             <button class="item">24</button>
+            <button class="item">25</button>
+            <button class="item">26</button>
+            <button class="item">27</button>
+            <button class="item">28</button>
             <div class="site site-none">&nbsp;&nbsp;&nbsp;&nbsp;</div>
         </div>
         <div class="stock-group">
@@ -374,6 +373,10 @@
             <button class="item">22</button>
             <button class="item">23</button>
             <button class="item">24</button>
+            <button class="item">25</button>
+            <button class="item">26</button>
+            <button class="item">27</button>
+            <button class="item">28</button>
             <div class="site site-none">&nbsp;&nbsp;&nbsp;&nbsp;</div>
         </div>
     </div>
@@ -382,6 +385,8 @@
     <input id="val" type="text">
     <button id="animate">animate</button>
 </main>
+
+
 </body>
 <script>
     var crn1Position = 0;
@@ -406,5 +411,13 @@
         }
     }
 
+    $('.item').on('click', function () {
+        layer.open({
+            type: 1,
+            shadeClose: true, //鐐瑰嚮閬僵鍏抽棴灞�
+            content: 'text'
+        });
+    })
+
 </script>
 </html>
\ No newline at end of file

--
Gitblit v1.9.1