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      |   77 +++++++++++++++++++++++--
 src/main/webapp/static/css/console.css  |   46 ++++++++++++--
 src/main/webapp/static/image/stop48.png |    0 
 3 files changed, 107 insertions(+), 16 deletions(-)

diff --git a/src/main/webapp/static/css/console.css b/src/main/webapp/static/css/console.css
index 43c7fd4..3ffc1cc 100644
--- a/src/main/webapp/static/css/console.css
+++ b/src/main/webapp/static/css/console.css
@@ -1,18 +1,48 @@
 html {
     height: 100%;
 }
+
 body {
     height: 100%;
     background-color: #fff;
     border-radius: 5px;
     box-shadow: 0 0 3px rgba(0,0,0,.3);
 }
-/* 澶撮儴 */
+
+/* ------------------------------------ 澶撮儴 ------------------------------------*/
 header {
     height: 20%;
     border: 1px solid red;
+    text-align: center;
+    opacity: 0.8;
+    position: relative;
 }
-/* 涓讳綋 */
+header h1 {
+    margin: 0;
+    letter-spacing: 2px;
+}
+
+/* 鐘舵�佹樉绀� */
+.machine-state {
+    text-align: left;
+}
+.crn-state-group {
+    margin-bottom: 5px;
+}
+/* 鍫嗗灈鏈虹姸鎬� */
+.crn-state {
+    display: inline-block;
+    width: 50px;
+    text-align: center;
+}
+/* 绔欑偣鐘舵�� */
+.site-state {
+    display: inline-block;
+    width: 50px;
+    text-align: center;
+}
+
+/* ------------------------------------ 涓讳綋 ------------------------------------*/
 main {
     height: 80%;
     position: relative;
@@ -25,21 +55,21 @@
 }
 /* 杈撻�佺嚎绗竴鍒� */
 .site-row-1 {
-    left: 200px;
+    left: 400px;
 }
 .site-row-1 .site {
     width: 100px;
 }
 /* 杈撻�佺嚎绗簩鍒� */
 .site-row-2 {
-    left: 300px;
+    left: 500px;
 }
 .site-row-2 .site {
     width: 100px;
 }
 /* 杈撻�佺嚎绗笁鍒� */
 .site-row-3 {
-    left: 400px;
+    left: 600px;
     width: 100px;
 }
 .site-row-3 .site {
@@ -48,7 +78,7 @@
 }
 /* 杈撻�佺嚎绗洓鍒� */
 .site-row-4 {
-    left: 500px;
+    left: 700px;
     width: 100px;
 }
 .site-row-4 .site {
@@ -77,7 +107,7 @@
 .main-part {
     position: absolute;
     top: 250px;
-    left: 400px;
+    left: 600px;
 }
 
 /* 鎺掑彿 */
@@ -109,7 +139,7 @@
 button.item {
     font-size: 13px;
     padding: 1px 1px 1px 1px;
-    width: 20px;
+    width: 30px;
     height: 20px;
     outline: none;
     cursor: pointer;
diff --git a/src/main/webapp/static/image/stop48.png b/src/main/webapp/static/image/stop48.png
new file mode 100644
index 0000000..881f726
--- /dev/null
+++ b/src/main/webapp/static/image/stop48.png
Binary files differ
diff --git a/src/main/webapp/views/console.html b/src/main/webapp/views/console.html
index d5d7f2b..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>
@@ -12,12 +13,46 @@
     <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>
+        .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;
+        }
 
     </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>
 
@@ -97,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">
@@ -125,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>
         <!-- 鍫嗗灈鏈� -->
@@ -159,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">
@@ -187,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>
@@ -220,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">
@@ -248,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>
         <!-- 鍫嗗灈鏈� -->
@@ -282,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">
@@ -310,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>
@@ -320,12 +387,6 @@
 </main>
 
 
-<!-- 寮瑰嚭灞� -->
-<form id="msg" style="display: none">
-    <input name="name" type="text">
-    <input name="password" type="password">
-    <button>纭畾</button>
-</form>
 </body>
 <script>
     var crn1Position = 0;
@@ -354,7 +415,7 @@
         layer.open({
             type: 1,
             shadeClose: true, //鐐瑰嚮閬僵鍏抽棴灞�
-            content: $("#msg")
+            content: 'text'
         });
     })
 

--
Gitblit v1.9.1