| | |
| | | <html lang="en"> |
| | | <head> |
| | | <meta charset="UTF-8"> |
| | | <title>Title</title> |
| | | <title>WCS控制中心</title> |
| | | <meta name="renderer" content="webkit"> |
| | | <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> |
| | | <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0"> |
| | |
| | | <link rel="stylesheet" type="text/css" href="../static/css/common.css"> |
| | | <link rel="stylesheet" type="text/css" href="../static/css/console.css"> |
| | | <style> |
| | | .main-part { |
| | | position: absolute; |
| | | top: 100px; |
| | | left: 400px; |
| | | /*transform: translate(-50%, 0);*/ |
| | | } |
| | | |
| | | /* 站点 */ |
| | | .site { |
| | | border: 1px transparent; |
| | | border-radius: 3px; |
| | | cursor: pointer; |
| | | width: 50px; |
| | | text-align: center; |
| | | background-color: #21ff3a; |
| | | font-size: 13px; |
| | | float: left; |
| | | } |
| | | .site:hover { |
| | | opacity: 0.7; |
| | | } |
| | | /* 无效站点 */ |
| | | /* 无效站点(必须在site下面) */ |
| | | .site-none { |
| | | border: none; |
| | | background-color: transparent; |
| | | } |
| | | |
| | | .main-part { |
| | | position: absolute; |
| | | top: 200px; |
| | | left: 400px; |
| | | /*transform: translate(-50%, 0);*/ |
| | | } |
| | | |
| | | /* 输送线第一列 */ |
| | | .site-row-1 { |
| | | |
| | | } |
| | | /* 输送线第二列 */ |
| | | .site-row-2 { |
| | | position: absolute; |
| | | left: 300px; |
| | | top: 220px; |
| | | } |
| | | .site-row-2 .site { |
| | | width: 100px; |
| | | } |
| | | |
| | | </style> |
| | | </head> |
| | |
| | | <main> |
| | | |
| | | <!-- 左输送线 --> |
| | | <div class="line-left"> |
| | | <!-- 第一列 --> |
| | | <div class="row-1"> |
| | | <!-- 第一列 --> |
| | | <div class="site-row-1"> |
| | | |
| | | </div> |
| | | <!-- 第二列 --> |
| | | <div class="row-2"> |
| | | |
| | | </div> |
| | | </div> |
| | | <!-- 第二列 --> |
| | | <div class="site-row-2"> |
| | | <div id="site-32" class="site">32</div> |
| | | <div id="site-31" class="site">31</div> |
| | | <div id="site-30" class="site">30</div> |
| | | <div id="site-23" class="site">23</div> |
| | | <div id="site-22" class="site">22</div> |
| | | <div id="site-20" class="site">20</div> |
| | | <div id="site-19" class="site">19</div> |
| | | <div id="site-17" class="site">17</div> |
| | | <div id="site-16" class="site">16</div> |
| | | <div id="site-15" class="site">15</div> |
| | | <div id="site-13" class="site">13</div> |
| | | <div id="site-12" class="site">12</div> |
| | | <div id="site-10" class="site">10</div> |
| | | </div> |
| | | |
| | | |
| | |
| | | <button class="item">22</button> |
| | | <button class="item">23</button> |
| | | <button class="item">24</button> |
| | | <div class="site site-none"> </div> |
| | | </div> |
| | | <div class="stock-group"> |
| | | <div id="site-21" class="site">21</div> |
| | |
| | | <button class="item">22</button> |
| | | <button class="item">23</button> |
| | | <button class="item">24</button> |
| | | <div class="site site-none"> </div> |
| | | </div> |
| | | <!-- 堆垛机 --> |
| | | <div class="crn"> |
| | |
| | | <button class="item">22</button> |
| | | <button class="item">23</button> |
| | | <button class="item">24</button> |
| | | <div class="site site-none"> </div> |
| | | </div> |
| | | <div class="stock-group"> |
| | | <div class="site site-none"> </div> |
| | |
| | | <button class="item">22</button> |
| | | <button class="item">23</button> |
| | | <button class="item">24</button> |
| | | <div class="site site-none"> </div> |
| | | </div> |
| | | <br> |
| | | |
| | |
| | | <button class="item">22</button> |
| | | <button class="item">23</button> |
| | | <button class="item">24</button> |
| | | <div class="site site-none"> </div> |
| | | </div> |
| | | <div class="stock-group"> |
| | | <div id="site-14" class="site">14</div> |
| | |
| | | <button class="item">22</button> |
| | | <button class="item">23</button> |
| | | <button class="item">24</button> |
| | | <div class="site site-none"> </div> |
| | | </div> |
| | | <!-- 堆垛机 --> |
| | | <div class="crn"> |
| | |
| | | <button class="item">22</button> |
| | | <button class="item">23</button> |
| | | <button class="item">24</button> |
| | | <div class="site site-none"> </div> |
| | | </div> |
| | | <div class="stock-group"> |
| | | <div class="site site-none"> </div> |
| | |
| | | <button class="item">22</button> |
| | | <button class="item">23</button> |
| | | <button class="item">24</button> |
| | | <div class="site site-none"> </div> |
| | | </div> |
| | | </div> |
| | | |