|  |  | 
 |  |  | <!DOCTYPE html> | 
 |  |  | <html lang="en"> | 
 |  |  | <!--5层 28列 1120库位--> | 
 |  |  | <head> | 
 |  |  |     <meta charset="UTF-8"> | 
 |  |  |     <meta charset="utf-8"> | 
 |  |  |     <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/normalize.css"> | 
 |  |  |     <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> | 
 |  |  |     <link rel="stylesheet" href="../static/css/console.css"> | 
 |  |  |     <link rel="stylesheet" href="../static/css/animate.min.css"> | 
 |  |  |     <script src="../static/js/jquery/jquery-3.3.1.min.js"></script> | 
 |  |  |     <script src="../static/js/layer/layer.js"></script> | 
 |  |  |     <script type="text/javascript" src="../static/js/common.js"></script> | 
 |  |  |     <script type="text/javascript" src="../static/js/layer/layer.js"></script> | 
 |  |  |     <style> | 
 |  |  |         /* layer 深蓝色按钮修改 */ | 
 |  |  |         /*.layui-layer-lan .layui-layer-btn {*/ | 
 |  |  |             /*border-top: none;*/ | 
 |  |  |         /*}*/ | 
 |  |  |         .layui-layer-lan .layui-layer-btn a { | 
 |  |  |             background: #4476A7; | 
 |  |  |             border-color: #4476A7; | 
 |  |  |             color: #fff; | 
 |  |  |         } | 
 |  |  |         .layui-layer-lan .layui-layer-btn .layui-layer-btn1 { | 
 |  |  |             background: #fff; | 
 |  |  |             color: #333; | 
 |  |  |             border-color: #E9E7E7; | 
 |  |  |         } | 
 |  |  |         .layui-layer-lan .layui-layer-btn .layui-layer-btn1:hover { | 
 |  |  |             background-color: #f7f7f7; | 
 |  |  |         } | 
 |  |  |     </style> | 
 |  |  | </head> | 
 |  |  | <body> | 
 |  |  | <header> | 
 |  |  |     <!-- 系统运行状态 --> | 
 |  |  |     <div class="system-state"> | 
 |  |  |         <div id="system-icon" class="system-icon-open" onclick="systemSwitch()"></div> | 
 |  |  |         <span id="system-run-desc">系统运行中...</span> | 
 |  |  |     </div> | 
 |  |  | <div class="root"> | 
 |  |  |     <header class="header"> | 
 |  |  |         <h1>自动仓库WCS监控图</h1> | 
 |  |  |         <h6>AUTOMATIC WAREHOUSE WCS MONITORING DIAGRAM</h6> | 
 |  |  |     </header> | 
 |  |  |     <main class="main"> | 
 |  |  |         <!--第1列 --> | 
 |  |  |         <div class="site-row site-row-1" id="fool1"> | 
 |  |  |             <div id="site-102" class="site" style="height: 38px;line-height: 38px;width:156px;">102</div> | 
 |  |  |  | 
 |  |  |     <!-- 信息展示 --> | 
 |  |  |     <div class="data-window"> | 
 |  |  |         <!-- 标题 --> | 
 |  |  |         <h1>自动仓库 WCS 监控图</h1> | 
 |  |  |             <div id="site-101" class="site" style="height: 38px;line-height: 38px;width:156px;">101</div> | 
 |  |  |  | 
 |  |  |         <!-- 颜色提示 --> | 
 |  |  |         <div class="tips"> | 
 |  |  |             <div class="tips-item"> | 
 |  |  |                 <label>堆垛机状态颜色: </label> | 
 |  |  |                 <div class="item-group"> | 
 |  |  |                     <span class="machine-put">入库</span> | 
 |  |  |                     <span class="machine-take">出库</span> | 
 |  |  |                     <span class="machine-stock-move">库到库</span> | 
 |  |  |                     <span class="machine-site-move">站到站</span> | 
 |  |  |                     <span class="machine-p-move">PToP</span> | 
 |  |  |                     <span class="machine-error">异常</span> | 
 |  |  |                     <span class="machine-auto">自动</span> | 
 |  |  |                     <span class="machine-unauto">非自动/手动</span> | 
 |  |  |             <div id="site-100" class="site" style="height: 38px;line-height: 38px;width:156px;">100</div> | 
 |  |  |         </div> | 
 |  |  |         <!--第2列--> | 
 |  |  |         <div class="site-row site-row-2" id="fool2" style="display: none"> | 
 |  |  |             <div id="site-202" class="site" style="height: 38px;line-height: 38px;width:156px;">202</div> | 
 |  |  |  | 
 |  |  |             <div id="site-201" class="site" style="height: 38px;line-height: 38px;width:156px;">201</div> | 
 |  |  |  | 
 |  |  |             <div id="site-200" class="site" style="height: 38px;line-height: 38px;width:156px;">200</div> | 
 |  |  |         </div> | 
 |  |  |  | 
 |  |  |         <!--第3列--> | 
 |  |  |         <div class="site-row site-row-3" id="fool3" style="display: none"> | 
 |  |  |             <div id="site-302" class="site" style="height: 38px;line-height: 38px;width:156px;">302</div> | 
 |  |  |  | 
 |  |  |             <div id="site-301" class="site" style="height: 38px;line-height: 38px;width:156px;">301</div> | 
 |  |  |  | 
 |  |  |             <div id="site-300" class="site" style="height: 38px;line-height: 38px;width:156px;">300</div> | 
 |  |  |         </div> | 
 |  |  |  | 
 |  |  |         <!--楼层按钮--> | 
 |  |  |  | 
 |  |  |             <button class="floorBtn  btn-16" onclick="changFloor(1)" style="margin-top: 150px">1F</button> | 
 |  |  |             <button class="floorBtn  btn-16" onclick="changFloor(2)" style="margin-top: 200px">2F</button> | 
 |  |  |             <button class="floorBtn  btn-16" onclick="changFloor(3)" style="margin-top: 250px">3F</button> | 
 |  |  |  | 
 |  |  |         <!-- 货架 + 堆垛机 + 入库站点 --> | 
 |  |  |         <div class="main-part"> | 
 |  |  |             <!-- 第一组 --> | 
 |  |  |             <div class="lane" style="margin-bottom: 280px"> | 
 |  |  |                 <!-- 货架 --> | 
 |  |  |                 <div class="stock-group"> | 
 |  |  |                     <button class="item">1</button> | 
 |  |  |                     <button class="item">2</button> | 
 |  |  |                     <button class="item">3</button> | 
 |  |  |                     <button class="item">4</button> | 
 |  |  |                     <button class="item" style="border: none;background-color: #6ca7a8"></button> | 
 |  |  |                     <button class="item" style="border: none;background-color: #6ca7a8"></button> | 
 |  |  |                     <button class="item">7</button> | 
 |  |  |                     <button class="item">8</button> | 
 |  |  |                     <button class="item">9</button> | 
 |  |  |                     <button class="item">10</button> | 
 |  |  |                     <button class="item">11</button> | 
 |  |  |                     <button class="item">12</button> | 
 |  |  |                     <button class="item">13</button> | 
 |  |  |                     <span class="row-no">1#</span> | 
 |  |  |                 </div> | 
 |  |  |             </div> | 
 |  |  |             <div class="tips-item"> | 
 |  |  |                 <label>输送设备状态颜色: </label> | 
 |  |  |                 <div class="item-group"> | 
 |  |  |                     <span class="site-auto-run-id">自动+有物+ID</span> | 
 |  |  |                     <span class="site-auto-run">自动+有物</span> | 
 |  |  |                     <span class="site-auto-id">自动+ID</span> | 
 |  |  |                     <span class="site-auto">自动</span> | 
 |  |  |                     <span class="site-unauto">非自动/手动</span> | 
 |  |  |                 <div class="stock-group"> | 
 |  |  |                     <button class="item">1</button> | 
 |  |  |                     <button class="item">2</button> | 
 |  |  |                     <button class="item">3</button> | 
 |  |  |                     <button class="item">4</button> | 
 |  |  |                     <button class="item" style="border: none;background-color: #6ca7a8"></button> | 
 |  |  |                     <button class="item" style="border: none;background-color: #6ca7a8"></button> | 
 |  |  |                     <button class="item">7</button> | 
 |  |  |                     <button class="item">8</button> | 
 |  |  |                     <button class="item">9</button> | 
 |  |  |                     <button class="item">10</button> | 
 |  |  |                     <button class="item">11</button> | 
 |  |  |                     <button class="item">12</button> | 
 |  |  |                     <button class="item">13</button> | 
 |  |  |                     <span class="row-no">2#</span> | 
 |  |  |                 </div> | 
 |  |  |                 <div class="stock-group"> | 
 |  |  |                     <button class="item">1</button> | 
 |  |  |                     <button class="item">2</button> | 
 |  |  |                     <button class="item">3</button> | 
 |  |  |                     <button class="item">4</button> | 
 |  |  |                     <button class="item" style="border: none;background-color: #6ca7a8"></button> | 
 |  |  |                     <button class="item" style="border: none;background-color: #6ca7a8"></button> | 
 |  |  |                     <button class="item">7</button> | 
 |  |  |                     <button class="item">8</button> | 
 |  |  |                     <button class="item">9</button> | 
 |  |  |                     <button class="item">10</button> | 
 |  |  |                     <button class="item">11</button> | 
 |  |  |                     <button class="item">12</button> | 
 |  |  |                     <button class="item">13</button> | 
 |  |  |                     <span class="row-no">3#</span> | 
 |  |  |                 </div> | 
 |  |  |                 <div class="stock-group"> | 
 |  |  |                     <button class="item">1</button> | 
 |  |  |                     <button class="item">2</button> | 
 |  |  |                     <button class="item">3</button> | 
 |  |  |                     <button class="item">4</button> | 
 |  |  |                     <button class="item" style="border: none;background-color: #6ca7a8"></button> | 
 |  |  |                     <button class="item" style="border: none;background-color: #6ca7a8"></button> | 
 |  |  |                     <button class="item">7</button> | 
 |  |  |                     <button class="item">8</button> | 
 |  |  |                     <button class="item">9</button> | 
 |  |  |                     <button class="item">10</button> | 
 |  |  |                     <button class="item">11</button> | 
 |  |  |                     <button class="item">12</button> | 
 |  |  |                     <button class="item">13</button> | 
 |  |  |                     <span class="row-no">4#</span> | 
 |  |  |                 </div> | 
 |  |  |  | 
 |  |  |                 <!-- 堆垛机 --> | 
 |  |  |                 <div class="crn"> | 
 |  |  |                     <hr class="pathway"> | 
 |  |  |                     <div id="crn-1" class="machine"></div> | 
 |  |  |                 </div> | 
 |  |  |  | 
 |  |  |                 <!-- 货架 --> | 
 |  |  |                 <div class="stock-group"> | 
 |  |  |                     <button class="item">1</button> | 
 |  |  |                     <button class="item">2</button> | 
 |  |  |                     <button class="item">3</button> | 
 |  |  |                     <button class="item">4</button> | 
 |  |  |                     <button class="item">5</button> | 
 |  |  |                     <button class="item">6</button> | 
 |  |  |                     <button class="item">7</button> | 
 |  |  |                     <button class="item">8</button> | 
 |  |  |                     <button class="item">9</button> | 
 |  |  |                     <button class="item">10</button> | 
 |  |  |                     <button class="item">11</button> | 
 |  |  |                     <button class="item">12</button> | 
 |  |  |                     <button class="item">13</button> | 
 |  |  |                     <span class="row-no">5#</span> | 
 |  |  |                 </div> | 
 |  |  |                 <div class="stock-group"> | 
 |  |  |                     <button class="item">1</button> | 
 |  |  |                     <button class="item">2</button> | 
 |  |  |                     <button class="item">3</button> | 
 |  |  |                     <button class="item">4</button> | 
 |  |  |                     <button class="item">5</button> | 
 |  |  |                     <button class="item">6</button> | 
 |  |  |                     <button class="item">7</button> | 
 |  |  |                     <button class="item">8</button> | 
 |  |  |                     <button class="item">9</button> | 
 |  |  |                     <button class="item">10</button> | 
 |  |  |                     <button class="item">11</button> | 
 |  |  |                     <button class="item">12</button> | 
 |  |  |                     <button class="item">13</button> | 
 |  |  |                     <span class="row-no">6#</span> | 
 |  |  |                 </div> | 
 |  |  |                 <div class="stock-group"> | 
 |  |  |                     <button class="item">1</button> | 
 |  |  |                     <button class="item">2</button> | 
 |  |  |                     <button class="item">3</button> | 
 |  |  |                     <button class="item">4</button> | 
 |  |  |                     <button class="item">5</button> | 
 |  |  |                     <button class="item">6</button> | 
 |  |  |                     <button class="item">7</button> | 
 |  |  |                     <button class="item">8</button> | 
 |  |  |                     <button class="item">9</button> | 
 |  |  |                     <button class="item">10</button> | 
 |  |  |                     <button class="item">11</button> | 
 |  |  |                     <button class="item">12</button> | 
 |  |  |                     <button class="item">13</button> | 
 |  |  |                     <span class="row-no">7#</span> | 
 |  |  |                 </div> | 
 |  |  |                 <div class="stock-group"> | 
 |  |  |                     <button class="item">1</button> | 
 |  |  |                     <button class="item">2</button> | 
 |  |  |                     <button class="item">3</button> | 
 |  |  |                     <button class="item">4</button> | 
 |  |  |                     <button class="item">5</button> | 
 |  |  |                     <button class="item">6</button> | 
 |  |  |                     <button class="item">7</button> | 
 |  |  |                     <button class="item">8</button> | 
 |  |  |                     <button class="item">9</button> | 
 |  |  |                     <button class="item">10</button> | 
 |  |  |                     <button class="item">11</button> | 
 |  |  |                     <button class="item">12</button> | 
 |  |  |                     <button class="item">13</button> | 
 |  |  |                     <span class="row-no">8#</span> | 
 |  |  |                 </div> | 
 |  |  |                 <div class="stock-group"> | 
 |  |  |                     <button class="item">1</button> | 
 |  |  |                     <button class="item">2</button> | 
 |  |  |                     <button class="item">3</button> | 
 |  |  |                     <button class="item">4</button> | 
 |  |  |                     <button class="item">5</button> | 
 |  |  |                     <button class="item">6</button> | 
 |  |  |                     <button class="item">7</button> | 
 |  |  |                     <button class="item">8</button> | 
 |  |  |                     <button class="item">9</button> | 
 |  |  |                     <button class="item">10</button> | 
 |  |  |                     <button class="item">11</button> | 
 |  |  |                     <button class="item">12</button> | 
 |  |  |                     <button class="item">13</button> | 
 |  |  |                     <span class="row-no">9#</span> | 
 |  |  |                 </div> | 
 |  |  |                 <div class="stock-group"> | 
 |  |  |                     <button class="item">1</button> | 
 |  |  |                     <button class="item">2</button> | 
 |  |  |                     <button class="item">3</button> | 
 |  |  |                     <button class="item">4</button> | 
 |  |  |                     <button class="item">5</button> | 
 |  |  |                     <button class="item">6</button> | 
 |  |  |                     <button class="item">7</button> | 
 |  |  |                     <button class="item">8</button> | 
 |  |  |                     <button class="item">9</button> | 
 |  |  |                     <button class="item">10</button> | 
 |  |  |                     <button class="item">11</button> | 
 |  |  |                     <button class="item">12</button> | 
 |  |  |                     <button class="item">13</button> | 
 |  |  |                     <span class="row-no">10#</span> | 
 |  |  |                 </div> | 
 |  |  |                 <div class="stock-group"> | 
 |  |  |                     <button class="item">1</button> | 
 |  |  |                     <button class="item">2</button> | 
 |  |  |                     <button class="item">3</button> | 
 |  |  |                     <button class="item">4</button> | 
 |  |  |                     <button class="item">5</button> | 
 |  |  |                     <button class="item">6</button> | 
 |  |  |                     <button class="item">7</button> | 
 |  |  |                     <button class="item">8</button> | 
 |  |  |                     <button class="item">9</button> | 
 |  |  |                     <button class="item">10</button> | 
 |  |  |                     <button class="item">11</button> | 
 |  |  |                     <button class="item">12</button> | 
 |  |  |                     <button class="item">13</button> | 
 |  |  |                     <span class="row-no">11#</span> | 
 |  |  |                 </div> | 
 |  |  |             </div> | 
 |  |  |         </div> | 
 |  |  |     </div> | 
 |  |  | </header> | 
 |  |  | <main> | 
 |  |  |     </main> | 
 |  |  |     <footer class="footer"> | 
 |  |  |         <!-- 总开关 --> | 
 |  |  |         <div class="system-state"> | 
 |  |  |             <div class="body-head">总开关</div> | 
 |  |  |             <div class="switch"> | 
 |  |  |                 <div id="system-icon" class="system-icon-open" onclick="systemSwitch()"></div> | 
 |  |  |                 <div class="switch_r"> | 
 |  |  |                     <p>系统状态</p> | 
 |  |  |                     <p id="system-run-desc">系统运行中</p> | 
 |  |  |                 </div> | 
 |  |  |             </div> | 
 |  |  |         </div> | 
 |  |  |         <!-- 堆垛机状态 --> | 
 |  |  |         <div class="machine-status"> | 
 |  |  |             <div class="body-head">堆垛机状态</div> | 
 |  |  |             <div class="state"> | 
 |  |  |                 <span>堆垛机 1</span> | 
 |  |  |                 <span class="state-ss machine-put-flag   ">入库</span> | 
 |  |  |             </div> | 
 |  |  | <!--            <div class="state">--> | 
 |  |  | <!--                <span>堆垛机 2</span>--> | 
 |  |  | <!--                <span class="state-ss machine-auto-flag   ">自动</span>--> | 
 |  |  |  | 
 |  |  |     <!----------- 工具栏 ----------> | 
 |  |  |     <!-- 入库口 --> | 
 |  |  |     <div class="cargo-put"></div> | 
 |  |  |     <!-- 扫码器 --> | 
 |  |  |     <div id="code-decoder-1" class="code-decoder"> | 
 |  |  |         <span id="code-decoder-data-1" class="code-decoder-data">0</span> | 
 |  |  | <!--            </div>--> | 
 |  |  |             <div class="button"><span>所有状态</span></div> | 
 |  |  |             <div class="button item-group"> | 
 |  |  |                 <span class="machine-put-flag">入库</span> | 
 |  |  |                 <span class="machine-take-flag">出库</span> | 
 |  |  |                 <span class="machine-stock-move-flag">库到库</span> | 
 |  |  |                 <span class="machine-site-move-flag">站到站</span> | 
 |  |  |                 <span class="machine-p-move-flag">PToP</span> | 
 |  |  |                 <span class="machine-error-flag">异常</span> | 
 |  |  |                 <span class="machine-auto-flag">自动</span> | 
 |  |  |                 <span class="machine-unauto-flag">非自动/手动</span> | 
 |  |  |             </div> | 
 |  |  |         </div> | 
 |  |  |         <!-- 输送线状态 --> | 
 |  |  |         <div class="line-status"> | 
 |  |  |             <div class="body-head">输送线状态</div> | 
 |  |  |             <div class="state states"> | 
 |  |  |                 <span>运输线总数</span> | 
 |  |  |                 <span class="line-ss">9</span> | 
 |  |  |             </div> | 
 |  |  |             <div class="button"><span>所有状态</span></div> | 
 |  |  |             <div class="button item-group"> | 
 |  |  |                 <span class="site-auto-run-id">自动+有物+ID</span> | 
 |  |  |                 <span class="site-auto-run">自动+有物</span> | 
 |  |  |                 <span class="site-auto-id">自动+ID</span> | 
 |  |  |                 <span class="site-auto">自动</span> | 
 |  |  |                 <span class="site-unauto">非自动/手动</span> | 
 |  |  |             </div> | 
 |  |  |         </div> | 
 |  |  |         <!-- 条码表格 --> | 
 |  |  |         <div class="bar-code"> | 
 |  |  |             <div class="body-head" id="code">条码扫描器</div> | 
 |  |  |             <div class="tablebox"> | 
 |  |  |                 <div class="table-head"> | 
 |  |  |                     <li><span>条码名称</span><span class="right">扫码时间</span></li> | 
 |  |  |                 </div> | 
 |  |  |                 <div id="barcode1" class="table-body"> | 
 |  |  |  | 
 |  |  |                 </div> | 
 |  |  |             </div> | 
 |  |  |             <div class="tablebox"> | 
 |  |  |                 <div class="table-head"> | 
 |  |  |                     <li><span>条码名称</span><span class="right">扫码时间</span></li> | 
 |  |  |                 </div> | 
 |  |  |                 <div id="barcode2" class="table-body"> | 
 |  |  |  | 
 |  |  |                 </div> | 
 |  |  |             </div> | 
 |  |  |             <div class="tablebox"> | 
 |  |  |                 <div class="table-head"> | 
 |  |  |                     <li><span>条码名称</span><span class="right">扫码时间</span></li> | 
 |  |  |                 </div> | 
 |  |  |                 <div id="barcode3" class="table-body"> | 
 |  |  |  | 
 |  |  |                 </div> | 
 |  |  |             </div> | 
 |  |  |         </div> | 
 |  |  |     </footer> | 
 |  |  |  | 
 |  |  |     <!-- 堆垛机弹窗 --> | 
 |  |  |     <div id="crnWindow" style="display: none;" class="animate__animated animate__fadeIn"> | 
 |  |  |         <div id="crnWindow-head"> | 
 |  |  |             <div class='detailed'></div> | 
 |  |  |             <button></button> | 
 |  |  |         </div> | 
 |  |  |         <form> | 
 |  |  |             <!-- 堆垛机号 --> | 
 |  |  |             <div class="form-item"> | 
 |  |  |                 <div class="form-item-label" style> | 
 |  |  |                     <span>堆垛机号:</span> | 
 |  |  |                 </div> | 
 |  |  |                 <div class="form-item-input"> | 
 |  |  |                     <input type="text" name="crnNo" value=""> | 
 |  |  |                 </div> | 
 |  |  |             </div> | 
 |  |  |             <!-- 工作号 --> | 
 |  |  |             <div class="form-item"> | 
 |  |  |                 <div class="form-item-label"> | 
 |  |  |                     <span>工作号:</span> | 
 |  |  |                 </div> | 
 |  |  |                 <div class="form-item-input"> | 
 |  |  |                     <input type="text" name="workNo" value=""> | 
 |  |  |                 </div> | 
 |  |  |             </div> | 
 |  |  |             <!-- 站源 --> | 
 |  |  |             <div class="form-item"> | 
 |  |  |                 <div class="form-item-label"> | 
 |  |  |                     <span>站源:</span> | 
 |  |  |                 </div> | 
 |  |  |                 <div class="form-item-input"> | 
 |  |  |                     <input type="text" name="sourceStaNo" value=""> | 
 |  |  |                 </div> | 
 |  |  |             </div> | 
 |  |  |             <!-- 目标站 --> | 
 |  |  |             <div class="form-item"> | 
 |  |  |                 <div class="form-item-label"> | 
 |  |  |                     <span>目标站:</span> | 
 |  |  |                 </div> | 
 |  |  |                 <div class="form-item-input"> | 
 |  |  |                     <input type="text" name="staNo" value=""> | 
 |  |  |                 </div> | 
 |  |  |             </div> | 
 |  |  |             <!-- 工作状态 --> | 
 |  |  |             <div class="form-item"> | 
 |  |  |                 <div class="form-item-label"> | 
 |  |  |                     <span>工作状态:</span> | 
 |  |  |                 </div> | 
 |  |  |                 <div class="form-item-input"> | 
 |  |  |                     <input type="text" name="wrkSts" value=""> | 
 |  |  |                 </div> | 
 |  |  |             </div> | 
 |  |  |             <!-- 出入类型 --> | 
 |  |  |             <div class="form-item"> | 
 |  |  |                 <div class="form-item-label"> | 
 |  |  |                     <span>出入类型:</span> | 
 |  |  |                 </div> | 
 |  |  |                 <div class="form-item-input"> | 
 |  |  |                     <input type="text" name="ioType" value=""> | 
 |  |  |                 </div> | 
 |  |  |             </div> | 
 |  |  |             <!-- 源库位 --> | 
 |  |  |             <div class="form-item"> | 
 |  |  |                 <div class="form-item-label"> | 
 |  |  |                     <span>源库位:</span> | 
 |  |  |                 </div> | 
 |  |  |                 <div class="form-item-input"> | 
 |  |  |                     <input type="text" name="sourceLocNo" value=""> | 
 |  |  |                 </div> | 
 |  |  |             </div> | 
 |  |  |             <!-- 目标库位 --> | 
 |  |  |             <div class="form-item"> | 
 |  |  |                 <div class="form-item-label"> | 
 |  |  |                     <span>目标库位:</span> | 
 |  |  |                 </div> | 
 |  |  |                 <div class="form-item-input"> | 
 |  |  |                     <input type="text" name="locNo" value=""> | 
 |  |  |                 </div> | 
 |  |  |             </div> | 
 |  |  |             <!-- 堆垛机状态 --> | 
 |  |  |             <div class="form-item"> | 
 |  |  |                 <div class="form-item-label"> | 
 |  |  |                     <span>堆垛机状态:</span> | 
 |  |  |                 </div> | 
 |  |  |                 <div class="form-item-input"> | 
 |  |  |                     <input type="text" name="crnStatus" value=""> | 
 |  |  |                 </div> | 
 |  |  |             </div> | 
 |  |  |             <!-- 异常 --> | 
 |  |  |             <div class="form-item"> | 
 |  |  |                 <div class="form-item-label"> | 
 |  |  |                     <span>异常:</span> | 
 |  |  |                 </div> | 
 |  |  |                 <div class="form-item-input"> | 
 |  |  |                     <input type="text" name="error" value=""> | 
 |  |  |                 </div> | 
 |  |  |             </div> | 
 |  |  |         </form> | 
 |  |  |     </div> | 
 |  |  |  | 
 |  |  |     <!-- 输送设备弹窗 --> | 
 |  |  |     <div id="siteWindow" style="display: none;" class="animate__animated animate__fadeIn"> | 
 |  |  |         <!-- 表头 --> | 
 |  |  |         <div id="siteWindow-head"> | 
 |  |  |             <div class='detailed'></div> | 
 |  |  |             <button></button> | 
 |  |  |         </div> | 
 |  |  |         <form> | 
 |  |  |             <!-- 设备号 --> | 
 |  |  |             <div class="form-item"  > | 
 |  |  |                 <div class="form-item-label"> | 
 |  |  |                     <span>设备号:</span> | 
 |  |  |                 </div> | 
 |  |  |                 <div class="form-item-input"> | 
 |  |  |                     <input type="text" name="siteId" value=""> | 
 |  |  |                 </div> | 
 |  |  |             </div> | 
 |  |  |             <!-- 工作号 --> | 
 |  |  |             <div class="form-item"> | 
 |  |  |                 <div class="form-item-label"> | 
 |  |  |                     <span>工作号:</span> | 
 |  |  |                 </div> | 
 |  |  |                 <div class="form-item-input"> | 
 |  |  |                     <input type="text" name="workNo" value=""> | 
 |  |  |                 </div> | 
 |  |  |             </div> | 
 |  |  |             <!-- 工作状态 --> | 
 |  |  |             <div class="form-item"> | 
 |  |  |                 <div class="form-item-label"> | 
 |  |  |                     <span>工作状态:</span> | 
 |  |  |                 </div> | 
 |  |  |                 <div class="form-item-input"> | 
 |  |  |                     <input type="text" name="wrkSts" value=""> | 
 |  |  |                 </div> | 
 |  |  |             </div> | 
 |  |  |             <!-- 自动 --> | 
 |  |  |             <div class="form-item-checkbox"> | 
 |  |  |                 <div class="form-item-label-checkbox"> | 
 |  |  |                     <span>自动</span> | 
 |  |  |                 </div> | 
 |  |  |                 <div class="form-item-input-checkbox"> | 
 |  |  |                     <input type="checkbox" name="autoing"> | 
 |  |  |                 </div> | 
 |  |  |             </div> | 
 |  |  |             <!-- 有物 --> | 
 |  |  |             <div class="form-item-checkbox"> | 
 |  |  |                 <div class="form-item-label-checkbox"> | 
 |  |  |                     <span>有物</span> | 
 |  |  |                 </div> | 
 |  |  |                 <div class="form-item-input-checkbox"> | 
 |  |  |                     <input type="checkbox" name="loading"> | 
 |  |  |                 </div> | 
 |  |  |             </div> | 
 |  |  |             <!-- 能入 --> | 
 |  |  |             <div class="form-item-checkbox"> | 
 |  |  |                 <div class="form-item-label-checkbox"> | 
 |  |  |                     <span>能入</span> | 
 |  |  |                 </div> | 
 |  |  |                 <div class="form-item-input-checkbox"> | 
 |  |  |                     <input type="checkbox" name="canining"> | 
 |  |  |                 </div> | 
 |  |  |             </div> | 
 |  |  |             <!-- 能出 --> | 
 |  |  |             <div class="form-item-checkbox"> | 
 |  |  |                 <div class="form-item-label-checkbox"> | 
 |  |  |                     <span>能出</span> | 
 |  |  |                 </div> | 
 |  |  |                 <div class="form-item-input-checkbox"> | 
 |  |  |                     <input type="checkbox" name="canouting"> | 
 |  |  |                 </div> | 
 |  |  |             </div> | 
 |  |  |             <!-- 出入类型 --> | 
 |  |  |             <div class="form-item"> | 
 |  |  |                 <div class="form-item-label"> | 
 |  |  |                     <span>出入类型:</span> | 
 |  |  |                 </div> | 
 |  |  |                 <div class="form-item-input"> | 
 |  |  |                     <input type="text" name="ioType" value=""> | 
 |  |  |                 </div> | 
 |  |  |             </div> | 
 |  |  |             <!-- 源站 --> | 
 |  |  |             <div class="form-item"> | 
 |  |  |                 <div class="form-item-label"> | 
 |  |  |                     <span>源站:</span> | 
 |  |  |                 </div> | 
 |  |  |                 <div class="form-item-input"> | 
 |  |  |                     <input type="text" name="sourceStaNo" value=""> | 
 |  |  |                 </div> | 
 |  |  |             </div> | 
 |  |  |             <!-- 目标站 --> | 
 |  |  |             <div class="form-item"> | 
 |  |  |                 <div class="form-item-label"> | 
 |  |  |                     <span>目标站:</span> | 
 |  |  |                 </div> | 
 |  |  |                 <div class="form-item-input"> | 
 |  |  |                     <input type="text" name="staNo" value=""> | 
 |  |  |                 </div> | 
 |  |  |             </div> | 
 |  |  |             <!-- 源库位 --> | 
 |  |  |             <div class="form-item"> | 
 |  |  |                 <div class="form-item-label"> | 
 |  |  |                     <span>源库位:</span> | 
 |  |  |                 </div> | 
 |  |  |                 <div class="form-item-input"> | 
 |  |  |                     <input type="text" name="sourceLocNo" value=""> | 
 |  |  |                 </div> | 
 |  |  |             </div> | 
 |  |  |             <!-- 目标库位 --> | 
 |  |  |             <div class="form-item"> | 
 |  |  |                 <div class="form-item-label"> | 
 |  |  |                     <span>目标库位:</span> | 
 |  |  |                 </div> | 
 |  |  |                 <div class="form-item-input"> | 
 |  |  |                     <input type="text" name="locNo" value=""> | 
 |  |  |                 </div> | 
 |  |  |             </div> | 
 |  |  |  | 
 |  |  |     <!-- 左输送线 --> | 
 |  |  |     <!-- 第一列(宽度 100px)--> | 
 |  |  |     <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> | 
 |  |  |         <div id="site-4" class="site" style="width: 80px; height: 60px;line-height: 60px">4</div> | 
 |  |  |         <div id="site-5" class="site" style="width: 80px; height: 50px;line-height: 50px">5</div> | 
 |  |  |         <div id="site-6" class="site" >6</div> | 
 |  |  |         <div id="site-7" class="site" style="width: 80px; height: 68px;line-height: 68px">7</div> | 
 |  |  |         <div id="site-8" class="site" style="width: 80px; height: 42px;line-height: 40px">8</div> | 
 |  |  |         <div id="site-9" class="site" >9</div> | 
 |  |  |         </form> | 
 |  |  |     </div> | 
 |  |  |     <!-- 第二列(宽度 100px) --> | 
 |  |  |     <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> | 
 |  |  |         <div id="site-23" class="site" >23</div> | 
 |  |  |         <div id="site-22" class="site" style="width: 80px; height: 50px;line-height: 50px">22</div> | 
 |  |  |         <div id="site-20" class="site" >20</div> | 
 |  |  |         <div id="site-19" class="site" style="width: 80px;">19</div> | 
 |  |  |         <div id="site-17" class="site" >17</div> | 
 |  |  |         <div id="site-16" class="site" style="width: 80px; height: 35px;line-height: 35px">16</div> | 
 |  |  |         <div id="site-15" class="site" style="width: 80px; height: 35px;line-height: 35px">15</div> | 
 |  |  |         <div id="site-13" class="site" >13</div> | 
 |  |  |         <div id="site-12" class="site" style="width: 80px;">12</div> | 
 |  |  |         <div id="site-10" class="site" >10</div> | 
 |  |  |     </div> | 
 |  |  |     <!-- 第三列(宽度 100px)--> | 
 |  |  |     <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 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> | 
 |  |  |         <div id="site-25" class="site" >25</div> | 
 |  |  |     </div> | 
 |  |  |  | 
 |  |  |     <!-- 货架 + 堆垛机 + 入库站点 + 出库站点 --> | 
 |  |  |     <div class="main-part"> | 
 |  |  |         <!--第二排--> | 
 |  |  |         <div class="lane"> | 
 |  |  |             <span class="row-no">2#</span> | 
 |  |  |             <!-- 货架 --> | 
 |  |  |             <div class="stock-group"> | 
 |  |  |                 <div class="site site-none">    </div> | 
 |  |  |                 <button class="item">1</button> | 
 |  |  |                 <button class="item">2</button> | 
 |  |  |                 <button class="item">3</button> | 
 |  |  |                 <button class="item">4</button> | 
 |  |  |                 <button class="item">5</button> | 
 |  |  |                 <button class="item">6</button> | 
 |  |  |                 <button class="item">7</button> | 
 |  |  |                 <button class="item">8</button> | 
 |  |  |                 <button class="item">9</button> | 
 |  |  |                 <button class="item">10</button> | 
 |  |  |                 <button class="item">11</button> | 
 |  |  |                 <button class="item">12</button> | 
 |  |  |                 <button class="item">13</button> | 
 |  |  |                 <button class="item">14</button> | 
 |  |  |                 <button class="item">15</button> | 
 |  |  |                 <button class="item">16</button> | 
 |  |  |                 <button class="item">17</button> | 
 |  |  |                 <button class="item">18</button> | 
 |  |  |                 <button class="item">19</button> | 
 |  |  |                 <button class="item">20</button> | 
 |  |  |                 <button class="item">21</button> | 
 |  |  |                 <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">    </div> | 
 |  |  |             </div> | 
 |  |  |             <div class="stock-group"> | 
 |  |  |                 <div id="site-21" class="site">21</div> | 
 |  |  |                 <button class="item">1</button> | 
 |  |  |                 <button class="item">2</button> | 
 |  |  |                 <button class="item">3</button> | 
 |  |  |                 <button class="item">4</button> | 
 |  |  |                 <button class="item">5</button> | 
 |  |  |                 <button class="item">6</button> | 
 |  |  |                 <button class="item">7</button> | 
 |  |  |                 <button class="item">8</button> | 
 |  |  |                 <button class="item">9</button> | 
 |  |  |                 <button class="item">10</button> | 
 |  |  |                 <button class="item">11</button> | 
 |  |  |                 <button class="item">12</button> | 
 |  |  |                 <button class="item">13</button> | 
 |  |  |                 <button class="item">14</button> | 
 |  |  |                 <button class="item">15</button> | 
 |  |  |                 <button class="item">16</button> | 
 |  |  |                 <button class="item">17</button> | 
 |  |  |                 <button class="item">18</button> | 
 |  |  |                 <button class="item">19</button> | 
 |  |  |                 <button class="item">20</button> | 
 |  |  |                 <button class="item">21</button> | 
 |  |  |                 <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">    </div> | 
 |  |  |             </div> | 
 |  |  |             <!-- 堆垛机 --> | 
 |  |  |             <div class="crn"> | 
 |  |  |                 <hr class="pathway"> | 
 |  |  |                 <div id="crn1" class="machine"></div> | 
 |  |  |             </div> | 
 |  |  |             <!-- 货架 --> | 
 |  |  |             <div class="stock-group"> | 
 |  |  |                 <div id="site-18" class="site">18</div> | 
 |  |  |                 <button class="item">1</button> | 
 |  |  |                 <button class="item">2</button> | 
 |  |  |                 <button class="item">3</button> | 
 |  |  |                 <button class="item">4</button> | 
 |  |  |                 <button class="item">5</button> | 
 |  |  |                 <button class="item">6</button> | 
 |  |  |                 <button class="item">7</button> | 
 |  |  |                 <button class="item">8</button> | 
 |  |  |                 <button class="item">9</button> | 
 |  |  |                 <button class="item">10</button> | 
 |  |  |                 <button class="item">11</button> | 
 |  |  |                 <button class="item">12</button> | 
 |  |  |                 <button class="item">13</button> | 
 |  |  |                 <button class="item">14</button> | 
 |  |  |                 <button class="item">15</button> | 
 |  |  |                 <button class="item">16</button> | 
 |  |  |                 <button class="item">17</button> | 
 |  |  |                 <button class="item">18</button> | 
 |  |  |                 <button class="item">19</button> | 
 |  |  |                 <button class="item">20</button> | 
 |  |  |                 <button class="item">21</button> | 
 |  |  |                 <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">    </div> | 
 |  |  |             </div> | 
 |  |  |             <div class="stock-group"> | 
 |  |  |                 <div class="site site-none">    </div> | 
 |  |  |                 <button class="item">1</button> | 
 |  |  |                 <button class="item">2</button> | 
 |  |  |                 <button class="item">3</button> | 
 |  |  |                 <button class="item">4</button> | 
 |  |  |                 <button class="item">5</button> | 
 |  |  |                 <button class="item">6</button> | 
 |  |  |                 <button class="item">7</button> | 
 |  |  |                 <button class="item">8</button> | 
 |  |  |                 <button class="item">9</button> | 
 |  |  |                 <button class="item">10</button> | 
 |  |  |                 <button class="item">11</button> | 
 |  |  |                 <button class="item">12</button> | 
 |  |  |                 <button class="item">13</button> | 
 |  |  |                 <button class="item">14</button> | 
 |  |  |                 <button class="item">15</button> | 
 |  |  |                 <button class="item">16</button> | 
 |  |  |                 <button class="item">17</button> | 
 |  |  |                 <button class="item">18</button> | 
 |  |  |                 <button class="item">19</button> | 
 |  |  |                 <button class="item">20</button> | 
 |  |  |                 <button class="item">21</button> | 
 |  |  |                 <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">    </div> | 
 |  |  |             </div> | 
 |  |  |         </div> | 
 |  |  |  | 
 |  |  |         <!--第一排--> | 
 |  |  |         <div class="lane"> | 
 |  |  |             <!-- 货架 --> | 
 |  |  |             <div class="stock-group"> | 
 |  |  |                 <div class="site site-none">    </div> | 
 |  |  |                 <button class="item">1</button> | 
 |  |  |                 <button class="item">2</button> | 
 |  |  |                 <button class="item">3</button> | 
 |  |  |                 <button class="item">4</button> | 
 |  |  |                 <button class="item">5</button> | 
 |  |  |                 <button class="item">6</button> | 
 |  |  |                 <button class="item">7</button> | 
 |  |  |                 <button class="item">8</button> | 
 |  |  |                 <button class="item">9</button> | 
 |  |  |                 <button class="item">10</button> | 
 |  |  |                 <button class="item">11</button> | 
 |  |  |                 <button class="item">12</button> | 
 |  |  |                 <button class="item">13</button> | 
 |  |  |                 <button class="item">14</button> | 
 |  |  |                 <button class="item">15</button> | 
 |  |  |                 <button class="item">16</button> | 
 |  |  |                 <button class="item">17</button> | 
 |  |  |                 <button class="item">18</button> | 
 |  |  |                 <button class="item">19</button> | 
 |  |  |                 <button class="item">20</button> | 
 |  |  |                 <button class="item">21</button> | 
 |  |  |                 <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">    </div> | 
 |  |  |             </div> | 
 |  |  |             <div class="stock-group"> | 
 |  |  |                 <div id="site-14" class="site">14</div> | 
 |  |  |                 <button class="item">1</button> | 
 |  |  |                 <button class="item">2</button> | 
 |  |  |                 <button class="item">3</button> | 
 |  |  |                 <button class="item">4</button> | 
 |  |  |                 <button class="item">5</button> | 
 |  |  |                 <button class="item">6</button> | 
 |  |  |                 <button class="item">7</button> | 
 |  |  |                 <button class="item">8</button> | 
 |  |  |                 <button class="item">9</button> | 
 |  |  |                 <button class="item">10</button> | 
 |  |  |                 <button class="item">11</button> | 
 |  |  |                 <button class="item">12</button> | 
 |  |  |                 <button class="item">13</button> | 
 |  |  |                 <button class="item">14</button> | 
 |  |  |                 <button class="item">15</button> | 
 |  |  |                 <button class="item">16</button> | 
 |  |  |                 <button class="item">17</button> | 
 |  |  |                 <button class="item">18</button> | 
 |  |  |                 <button class="item">19</button> | 
 |  |  |                 <button class="item">20</button> | 
 |  |  |                 <button class="item">21</button> | 
 |  |  |                 <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">    </div> | 
 |  |  |             </div> | 
 |  |  |             <!-- 堆垛机 --> | 
 |  |  |             <div class="crn"> | 
 |  |  |                 <hr class="pathway"> | 
 |  |  |                 <div id="crn2" class="machine"></div> | 
 |  |  |             </div> | 
 |  |  |             <!-- 货架 --> | 
 |  |  |             <div class="stock-group"> | 
 |  |  |                 <div id="site-11" class="site">11</div> | 
 |  |  |                 <button class="item">1</button> | 
 |  |  |                 <button class="item">2</button> | 
 |  |  |                 <button class="item">3</button> | 
 |  |  |                 <button class="item">4</button> | 
 |  |  |                 <button class="item">5</button> | 
 |  |  |                 <button class="item">6</button> | 
 |  |  |                 <button class="item">7</button> | 
 |  |  |                 <button class="item">8</button> | 
 |  |  |                 <button class="item">9</button> | 
 |  |  |                 <button class="item">10</button> | 
 |  |  |                 <button class="item">11</button> | 
 |  |  |                 <button class="item">12</button> | 
 |  |  |                 <button class="item">13</button> | 
 |  |  |                 <button class="item">14</button> | 
 |  |  |                 <button class="item">15</button> | 
 |  |  |                 <button class="item">16</button> | 
 |  |  |                 <button class="item">17</button> | 
 |  |  |                 <button class="item">18</button> | 
 |  |  |                 <button class="item">19</button> | 
 |  |  |                 <button class="item">20</button> | 
 |  |  |                 <button class="item">21</button> | 
 |  |  |                 <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">    </div> | 
 |  |  |             </div> | 
 |  |  |             <div class="stock-group"> | 
 |  |  |                 <div class="site site-none">    </div> | 
 |  |  |                 <button class="item">1</button> | 
 |  |  |                 <button class="item">2</button> | 
 |  |  |                 <button class="item">3</button> | 
 |  |  |                 <button class="item">4</button> | 
 |  |  |                 <button class="item">5</button> | 
 |  |  |                 <button class="item">6</button> | 
 |  |  |                 <button class="item">7</button> | 
 |  |  |                 <button class="item">8</button> | 
 |  |  |                 <button class="item">9</button> | 
 |  |  |                 <button class="item">10</button> | 
 |  |  |                 <button class="item">11</button> | 
 |  |  |                 <button class="item">12</button> | 
 |  |  |                 <button class="item">13</button> | 
 |  |  |                 <button class="item">14</button> | 
 |  |  |                 <button class="item">15</button> | 
 |  |  |                 <button class="item">16</button> | 
 |  |  |                 <button class="item">17</button> | 
 |  |  |                 <button class="item">18</button> | 
 |  |  |                 <button class="item">19</button> | 
 |  |  |                 <button class="item">20</button> | 
 |  |  |                 <button class="item">21</button> | 
 |  |  |                 <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">    </div> | 
 |  |  |             </div> | 
 |  |  |             <span class="row-no">1#</span> | 
 |  |  |         </div> | 
 |  |  |     </div> | 
 |  |  | </main> | 
 |  |  |  | 
 |  |  | <!-- 弹窗 --> | 
 |  |  | <!-- 输送设备弹窗 --> | 
 |  |  | <div id="siteWindow" style="display: none"> | 
 |  |  |     <form> | 
 |  |  |         <!-- 第一行 --> | 
 |  |  |         <div class="form-item" style="width: 25%"> | 
 |  |  |             <div class="form-item-label"> | 
 |  |  |                 <span>设备号</span> | 
 |  |  |             </div> | 
 |  |  |             <div class="form-item-input"> | 
 |  |  |                 <input type="text" name="devpNo" value="12" disabled="disabled" style="width: 4rem"> | 
 |  |  |             </div> | 
 |  |  |         </div> | 
 |  |  |         <div class="form-item" style="width: 25%"> | 
 |  |  |             <div class="form-item-label"> | 
 |  |  |                 <span>工作号</span> | 
 |  |  |             </div> | 
 |  |  |             <div class="form-item-input"> | 
 |  |  |                 <input type="text" name="workNo" value="9998" disabled="disabled" style="width: 4rem"> | 
 |  |  |             </div> | 
 |  |  |         </div> | 
 |  |  |         <div class="form-item" style="width: 45%"> | 
 |  |  |             <div class="form-item-label"> | 
 |  |  |                 <span>工作状态</span> | 
 |  |  |             </div> | 
 |  |  |             <div class="form-item-input"> | 
 |  |  |                 <input type="text" name="workStatus" value="2.设备上移动" disabled="disabled" style="width: 10rem"> | 
 |  |  |             </div> | 
 |  |  |         </div> | 
 |  |  |  | 
 |  |  |         <!-- 第二行 --> | 
 |  |  |         <div class="form-item" style="width: 20%"> | 
 |  |  |             <div class="form-item-label"> | 
 |  |  |                 <span>自动</span> | 
 |  |  |             </div> | 
 |  |  |             <div class="form-item-input"> | 
 |  |  |                 <input type="checkbox" name="auto" disabled="disabled" style="width: 1rem" checked> | 
 |  |  |             </div> | 
 |  |  |         </div> | 
 |  |  |         <div class="form-item" style="width: 20%"> | 
 |  |  |             <div class="form-item-label"> | 
 |  |  |                 <span>有物</span> | 
 |  |  |             </div> | 
 |  |  |             <div class="form-item-input"> | 
 |  |  |                 <input type="checkbox" name="loading" disabled="disabled" style="width: 1rem" checked> | 
 |  |  |             </div> | 
 |  |  |         </div> | 
 |  |  |          <div class="form-item" style="width: 20%"> | 
 |  |  |              <div class="form-item-label"> | 
 |  |  |                  <span>能入</span> | 
 |  |  |              </div> | 
 |  |  |              <div class="form-item-input"> | 
 |  |  |                  <input type="checkbox" name="canining" disabled="disabled" style="width: 1rem" checked> | 
 |  |  |              </div> | 
 |  |  |          </div> | 
 |  |  |          <div class="form-item" style="width: 20%"> | 
 |  |  |              <div class="form-item-label"> | 
 |  |  |                  <span>能出</span> | 
 |  |  |              </div> | 
 |  |  |              <div class="form-item-input"> | 
 |  |  |                  <input type="checkbox" name="canouting" disabled="disabled" style="width: 1rem" checked> | 
 |  |  |              </div> | 
 |  |  |         </div> | 
 |  |  |  | 
 |  |  |         <!-- 第三行 --> | 
 |  |  |         <div class="form-item" style="width: 40%"> | 
 |  |  |             <div class="form-item-label"> | 
 |  |  |                 <span>出入类型</span> | 
 |  |  |             </div> | 
 |  |  |             <div class="form-item-input"> | 
 |  |  |                 <input type="text" name="ioType" value="1.入库" disabled="disabled" style="width: 8rem"> | 
 |  |  |             </div> | 
 |  |  |         </div> | 
 |  |  |         <div class="form-item" style="width: 25%"> | 
 |  |  |             <div class="form-item-label"> | 
 |  |  |                 <span>源站</span> | 
 |  |  |             </div> | 
 |  |  |             <div class="form-item-input"> | 
 |  |  |                 <input type="text" name="sourceStaNo" value="2303" disabled="disabled" style="width: 4rem"> | 
 |  |  |             </div> | 
 |  |  |         </div> | 
 |  |  |         <div class="form-item" style="width: 25%"> | 
 |  |  |             <div class="form-item-label"> | 
 |  |  |                 <span>目标站</span> | 
 |  |  |             </div> | 
 |  |  |             <div class="form-item-input"> | 
 |  |  |                 <input type="text" name="staNo" value="2410" disabled="disabled" style="width: 4rem"> | 
 |  |  |             </div> | 
 |  |  |         </div> | 
 |  |  |  | 
 |  |  |         <!-- 第四行 --> | 
 |  |  |         <div class="form-item" style="width: 40%"> | 
 |  |  |             <div class="form-item-label"> | 
 |  |  |                 <span>源库位</span> | 
 |  |  |             </div> | 
 |  |  |             <div class="form-item-input"> | 
 |  |  |                 <input type="text" name="sourceStock" value="" disabled="disabled" style="width: 8rem"> | 
 |  |  |             </div> | 
 |  |  |         </div> | 
 |  |  |         <div class="form-item" style="width: 40%"> | 
 |  |  |             <div class="form-item-label"> | 
 |  |  |                 <span>目标库位</span> | 
 |  |  |             </div> | 
 |  |  |             <div class="form-item-input"> | 
 |  |  |                 <input type="text" name="stock" value="" style="width: 8rem"> | 
 |  |  |             </div> | 
 |  |  |         </div> | 
 |  |  |     </form> | 
 |  |  | </div> | 
 |  |  |  | 
 |  |  | <!-- 堆垛机弹窗 --> | 
 |  |  | <div id="crnWindow" style="display: none"> | 
 |  |  |     <form> | 
 |  |  |         <!-- 第一行 --> | 
 |  |  |         <div class="form-item" style="width: 23%"> | 
 |  |  |             <div class="form-item-label"  style="width: 87px"> | 
 |  |  |                 <span>堆垛机号</span> | 
 |  |  |             </div> | 
 |  |  |             <div class="form-item-input"> | 
 |  |  |                 <input type="text" name="crnNo" value="12" disabled="disabled" style="width: 3rem"> | 
 |  |  |             </div> | 
 |  |  |         </div> | 
 |  |  |         <div class="form-item" style="width: 25%"> | 
 |  |  |             <div class="form-item-label"> | 
 |  |  |                 <span>工作号</span> | 
 |  |  |             </div> | 
 |  |  |             <div class="form-item-input"> | 
 |  |  |                 <input type="text" name="workNo" value="9998" disabled="disabled" style="width: 5rem"> | 
 |  |  |             </div> | 
 |  |  |         </div> | 
 |  |  |         <div class="form-item" style="width: 23%"> | 
 |  |  |             <div class="form-item-label"> | 
 |  |  |                 <span>源站</span> | 
 |  |  |             </div> | 
 |  |  |             <div class="form-item-input"> | 
 |  |  |                 <input type="text" name="sourceStaNo" value="2303" disabled="disabled" style="width: 4rem"> | 
 |  |  |             </div> | 
 |  |  |         </div> | 
 |  |  |         <div class="form-item" style="width: 25%"> | 
 |  |  |             <div class="form-item-label"> | 
 |  |  |                 <span>目标站</span> | 
 |  |  |             </div> | 
 |  |  |             <div class="form-item-input"> | 
 |  |  |                 <input type="text" name="staNo" value="2410" disabled="disabled" style="width: 4rem"> | 
 |  |  |             </div> | 
 |  |  |         </div> | 
 |  |  |  | 
 |  |  |         <!-- 第二行 --> | 
 |  |  |         <div class="form-item" style="width: 45%"> | 
 |  |  |             <div class="form-item-label" style="width: 87px"> | 
 |  |  |                 <span>工作状态</span> | 
 |  |  |             </div> | 
 |  |  |             <div class="form-item-input"> | 
 |  |  |                 <input type="text" name="workStatus" value="2.设备上移动" disabled="disabled" style="width: 10rem"> | 
 |  |  |             </div> | 
 |  |  |         </div> | 
 |  |  |         <div class="form-item" style="width: 45%"> | 
 |  |  |             <div class="form-item-label"> | 
 |  |  |                 <span>出入类型</span> | 
 |  |  |             </div> | 
 |  |  |             <div class="form-item-input"> | 
 |  |  |                 <input type="text" name="ioType" value="1.入库" disabled="disabled" style="width: 10rem"> | 
 |  |  |             </div> | 
 |  |  |         </div> | 
 |  |  |  | 
 |  |  |         <!-- 第三行 --> | 
 |  |  |         <div class="form-item" style="width: 45%"> | 
 |  |  |             <div class="form-item-label" style="width: 87px"> | 
 |  |  |                 <span>源库位</span> | 
 |  |  |             </div> | 
 |  |  |             <div class="form-item-input"> | 
 |  |  |                 <input type="text" name="sourceStock" value="" disabled="disabled" style="width: 10rem"> | 
 |  |  |             </div> | 
 |  |  |         </div> | 
 |  |  |         <div class="form-item" style="width: 45%"> | 
 |  |  |             <div class="form-item-label"> | 
 |  |  |                 <span>目标库位</span> | 
 |  |  |             </div> | 
 |  |  |             <div class="form-item-input"> | 
 |  |  |                 <input type="text" name="stock" value="" disabled="disabled" style="width: 10rem"> | 
 |  |  |             </div> | 
 |  |  |         </div> | 
 |  |  |  | 
 |  |  |         <!-- 第四行 --> | 
 |  |  |         <div class="form-item" style="width: 95%"> | 
 |  |  |             <div class="form-item-label"> | 
 |  |  |                 <span>堆垛机状态</span> | 
 |  |  |             </div> | 
 |  |  |             <div class="form-item-input"> | 
 |  |  |                 <input type="text" name="crnStatus" disabled="disabled" style="width: 25rem"> | 
 |  |  |             </div> | 
 |  |  |         </div> | 
 |  |  |         <div class="form-item" style="width: 95%"> | 
 |  |  |             <div class="form-item-label" style="width: 87px"> | 
 |  |  |                 <span>异常</span> | 
 |  |  |             </div> | 
 |  |  |             <div class="form-item-input"> | 
 |  |  |                 <input type="text" name="error" disabled="disabled" style="width: 25rem"> | 
 |  |  |             </div> | 
 |  |  |         </div> | 
 |  |  |     </form> | 
 |  |  | </div> | 
 |  |  |  | 
 |  |  | </body> | 
 |  |  | </html> | 
 |  |  | <script> | 
 |  |  |     var systemRunning = true; | 
 |  |  |     var tData = [] | 
 |  |  |     var tData1 = [] | 
 |  |  |     var tData2 = [] | 
 |  |  |     var tData3 = [] | 
 |  |  |     function getCodeData(){ | 
 |  |  |         $.ajax({ | 
 |  |  |             url:baseUrl +'/console/barcode/output/site', | 
 |  |  |             method:'GET', | 
 |  |  |             success:function (res) { | 
 |  |  |                 if(res.code === 200){ | 
 |  |  |                     tData = eval(res.data); | 
 |  |  |                     if(tData.length<=5){ | 
 |  |  |                         tData1 = tData | 
 |  |  |                     } else if (tData.length<=10){ | 
 |  |  |                         tData1 = tData.slice(0,5) | 
 |  |  |                         // tData.splice(0,4) | 
 |  |  |                         tData2 = tData.splice(5,10) | 
 |  |  |                     } else if(tData.length<=15){ | 
 |  |  |                         tData1 = tData.slice(0,5) | 
 |  |  |                         tData2 = tData.slice(5,10) | 
 |  |  |                         // tData.splice(0,10) | 
 |  |  |                         tData3 = tData.slice(10,15) | 
 |  |  |                     } else { | 
 |  |  |                         tData1 = tData.slice(0,5) | 
 |  |  |                         tData2 = tData.slice(5,10) | 
 |  |  |                         tData3 = tData.slice(10,15) | 
 |  |  |                         // tData = tData.slice(-15) | 
 |  |  |                         // tData1 = tData.slice(-15) | 
 |  |  |                         // tData2 = tData.slice(-10) | 
 |  |  |                         // tData3 = tData.slice(-5) | 
 |  |  |  | 
 |  |  |                     } | 
 |  |  |                 } | 
 |  |  |             } | 
 |  |  |         }) | 
 |  |  |     } | 
 |  |  |     setInterval(function () { | 
 |  |  |         getCodeData(); | 
 |  |  |         renderBarCode(); | 
 |  |  |     }, 1000) | 
 |  |  |  | 
 |  |  |  | 
 |  |  |     function renderBarCode() { | 
 |  |  |         for (var i = 0;i<tData1.length;i++){ | 
 |  |  |             var str1 = '<li><span>' + tData1[i].barcode + '</span><span class="right">' + tData1[i].time + '</span></li>' | 
 |  |  |             $('#barcode1').append(str1) | 
 |  |  |         } | 
 |  |  |         for(var j = 0;j<tData2.length;j++){ | 
 |  |  |             var str2 = '<li><span>' + tData2[j].barcode + '</span><span class="right">' + tData2[j].time + '</span></li>' | 
 |  |  |             $('#barcode2').append(str2) | 
 |  |  |         } | 
 |  |  |         for(var k = 0;k<tData3.length;k++){ | 
 |  |  |             var str3 = '<li><span>' + tData3[k].barcode + '</span><span class="right">' + tData3[k].time + '</span></li>' | 
 |  |  |             $('#barcode3').append(str3) | 
 |  |  |         } | 
 |  |  |     } | 
 |  |  |  | 
 |  |  |     // 小车偏移动画 | 
 |  |  |     function carAnimate(id, target) { | 
 |  |  |         if (id === 1000) { | 
 |  |  |             let targetTop = 130; | 
 |  |  |             switch (target) { | 
 |  |  |                 case 110: | 
 |  |  |                     targetTop += 0; | 
 |  |  |                     break; | 
 |  |  |                 case 109: | 
 |  |  |                     targetTop += 60; | 
 |  |  |                     break; | 
 |  |  |                 case 108: | 
 |  |  |                     targetTop += 100; | 
 |  |  |                     break; | 
 |  |  |                 case 107: | 
 |  |  |                     targetTop += 180; | 
 |  |  |                     break; | 
 |  |  |                 case 106: | 
 |  |  |                     targetTop += 220; | 
 |  |  |                     break; | 
 |  |  |                 default: | 
 |  |  |                     return; | 
 |  |  |             } | 
 |  |  |             $("#site-" + id).animate({top: targetTop+'px'}, 1000); | 
 |  |  |         } else if (id === 2000) { | 
 |  |  |             let targetTop = 130; | 
 |  |  |             switch (target) { | 
 |  |  |                 case 226: | 
 |  |  |                     targetTop += 0; | 
 |  |  |                     break; | 
 |  |  |                 case 225: | 
 |  |  |                     targetTop += 60; | 
 |  |  |                     break; | 
 |  |  |                 case 224: | 
 |  |  |                     targetTop += 100; | 
 |  |  |                     break; | 
 |  |  |                 case 223: | 
 |  |  |                     targetTop += 180; | 
 |  |  |                     break; | 
 |  |  |                 case 222: | 
 |  |  |                     targetTop += 220; | 
 |  |  |                     break; | 
 |  |  |                 case 214: | 
 |  |  |                     targetTop += 280; | 
 |  |  |                     break; | 
 |  |  |                 case 220: | 
 |  |  |                     targetTop += 320; | 
 |  |  |                     break; | 
 |  |  |                 default: | 
 |  |  |                     return; | 
 |  |  |             } | 
 |  |  |             $("#site-" + id).animate({top: targetTop+'px'}, 1000); | 
 |  |  |         } | 
 |  |  |     } | 
 |  |  | </script> | 
 |  |  | <script type="text/javascript"> | 
 |  |  |     // 弹窗站点信息 | 
 |  |  |     $('.site').on('click',function(){ | 
 |  |  |         var id = this.id.split("-")[1]; | 
 |  |  |         $("#siteWindow").attr("style","display:block;");//显示div | 
 |  |  |         $("#crnWindow").attr("style","display:none;"); | 
 |  |  |         $(".detailed").empty(); | 
 |  |  |         $('.detailed').append(id+'站点详细信息'); | 
 |  |  |         $.ajax({ | 
 |  |  |             url:baseUrl+"/console/site/detail", | 
 |  |  |             headers:{ | 
 |  |  |                 'token': localStorage.getItem('token') | 
 |  |  |             }, | 
 |  |  |             data:{ | 
 |  |  |                 siteId: id | 
 |  |  |             }, | 
 |  |  |             method:'post', | 
 |  |  |             success:function (res) { | 
 |  |  |                 for (var val in res.data) { | 
 |  |  |                     var find = $("#siteWindow").find(":input[name='" + val + "']"); | 
 |  |  |                     if (find[0].type==='text') { | 
 |  |  |                         find.val(res.data[val]); | 
 |  |  |                     } else if (find[0].type === 'checkbox') { | 
 |  |  |                         find.attr("checked", res.data[val] === 'Y'); | 
 |  |  |                     } | 
 |  |  |                 } | 
 |  |  |             } | 
 |  |  |  | 
 |  |  |         }) | 
 |  |  |  | 
 |  |  |     }); | 
 |  |  |     // 堆垛机信息 | 
 |  |  |     $('.machine').on('click',function(){ | 
 |  |  |         var id = this.id.split("-")[1]; | 
 |  |  |         $("#crnWindow").attr('style','display:block;'); | 
 |  |  |         $("#siteWindow").attr("style","display:none;"); | 
 |  |  |         $('.detailed').empty(); | 
 |  |  |         $('.detailed').append(id+'号堆垛机'); | 
 |  |  |         $.ajax({ | 
 |  |  |             url:baseUrl+"/console/crn/detail", | 
 |  |  |             headers:{ | 
 |  |  |                 'token': localStorage.getItem('token') | 
 |  |  |             }, | 
 |  |  |             data:{ | 
 |  |  |                 crnNo: id | 
 |  |  |             }, | 
 |  |  |             method:'post', | 
 |  |  |             success:function (res) { | 
 |  |  |                 for (var val in res.data) { | 
 |  |  |                     var find = $("#crnWindow").find(":input[name='" + val + "']"); | 
 |  |  |                     if (find[0].type==='text') { | 
 |  |  |                         find.val(res.data[val]); | 
 |  |  |                     } else if (find[0].type === 'checkbox') { | 
 |  |  |                         find.attr("checked", res.data[val] === 'Y'); | 
 |  |  |                     } | 
 |  |  |                 } | 
 |  |  |             } | 
 |  |  |  | 
 |  |  |         }) | 
 |  |  |  | 
 |  |  |     }) | 
 |  |  |     // 弹窗关闭 | 
 |  |  |     $('button').on('click',function(){ | 
 |  |  |         $('#siteWindow').attr('style','display:none') | 
 |  |  |         $('#crnWindow').attr('style','display:none') | 
 |  |  |     }) | 
 |  |  |  | 
 |  |  |  | 
 |  |  |  | 
 |  |  |     var crn1Position = 0; | 
 |  |  |     var crn2Position = 0; | 
 |  |  |     var crn3Position = 0; | 
 |  |  |     var crn4Position = 0; | 
 |  |  |     var crn5Position = 0; | 
 |  |  |  | 
 |  |  |     // 初始化 | 
 |  |  |     getSitesInfo(); | 
 |  |  |     getCrnInfo(); | 
 |  |  |     getSystemRunningStatus(); | 
 |  |  |     getBarcodeInfo(); | 
 |  |  |     getScaleInfo(); | 
 |  |  |     // 实时访问 | 
 |  |  |     setInterval(function () { | 
 |  |  |         getCrnInfo(); | 
 |  |  |         getSystemRunningStatus(); | 
 |  |  |     }, 500); | 
 |  |  |         getBarcodeInfo(); | 
 |  |  |         getScaleInfo(); | 
 |  |  |     }, 1000); | 
 |  |  |     setInterval(function () { | 
 |  |  |         getSitesInfo(); | 
 |  |  |     }, 3000); | 
 |  |  |  | 
 |  |  |     // 系统运行开关 | 
 |  |  |     function systemSwitch() { | 
 |  |  |         if (systemRunning){ | 
 |  |  |         if (parent.systemRunning){ | 
 |  |  |             layer.prompt({title: '请输入口令,并停止 WCS 系统', formType: 1,   shadeClose: true}, function(pass, idx){ | 
 |  |  |                 layer.close(idx); | 
 |  |  |                 doSwitch(0, pass); | 
 |  |  |                 doSwitch(0, pass); // 停止wcs系统 | 
 |  |  |             }); | 
 |  |  |         } else { | 
 |  |  |             doSwitch(1) | 
 |  |  |             doSwitch(1); // 启动wcs系统 | 
 |  |  |         } | 
 |  |  |  | 
 |  |  |     } | 
 |  |  |  | 
 |  |  |     // 请求服务器控制wcs系统运行状态 | 
 |  |  | 
 |  |  |             }, | 
 |  |  |             method: 'POST', | 
 |  |  |             success: function (res) { | 
 |  |  |                 layer.close(index); | 
 |  |  |                 if (res.code === 200){ | 
 |  |  |                     layer.close(index); | 
 |  |  |                     if (res.data.status) { | 
 |  |  |                         $('#system-icon').attr("class", "system-icon-open"); | 
 |  |  |                         $('#system-run-desc').html("系统运行中..."); | 
 |  |  |                         systemRunning = true; | 
 |  |  |                         parent.systemRunning = true; | 
 |  |  |                     } else { | 
 |  |  |                         $('#system-icon').attr("class", "system-icon-close"); | 
 |  |  |                         $('#system-run-desc').html("系统已停止!"); | 
 |  |  |                         systemRunning = false; | 
 |  |  |                         parent.systemRunning = false; | 
 |  |  |                     } | 
 |  |  |                 } else if (res.code === 403){ | 
 |  |  |                     top.location.href = baseUrl+"/login"; | 
 |  |  |                     parent.location.href = baseUrl+"/login"; | 
 |  |  |                 }  else { | 
 |  |  |                     alert(res.msg); | 
 |  |  |                     console.log(res.msg); | 
 |  |  |  | 
 |  |  |                 } | 
 |  |  |             } | 
 |  |  |         }); | 
 |  |  | 
 |  |  |                     if (res.data.status) { | 
 |  |  |                         $('#system-icon').attr("class", "system-icon-open"); | 
 |  |  |                         $('#system-run-desc').html("系统运行中..."); | 
 |  |  |                         systemRunning = true; | 
 |  |  |                         parent.systemRunning = true; | 
 |  |  |                     } else { | 
 |  |  |                         $('#system-icon').attr("class", "system-icon-close"); | 
 |  |  |                         $('#system-run-desc').html("系统已停止!"); | 
 |  |  |                         systemRunning = false; | 
 |  |  |                         parent.systemRunning = false; | 
 |  |  |                     } | 
 |  |  |                 } else if (res.code === 403){ | 
 |  |  |                     top.location.href = baseUrl+"/login"; | 
 |  |  |                     parent.location.href = baseUrl+"/login"; | 
 |  |  |                 }  else { | 
 |  |  |                     alert(res.msg); | 
 |  |  |                     console.log(res.msg); | 
 |  |  |                 } | 
 |  |  |             } | 
 |  |  |         }); | 
 |  |  | 
 |  |  |                 if (res.code === 200){ | 
 |  |  |                     var sites = res.data; | 
 |  |  |                     for (var i = 0; i < sites.length; i++){ | 
 |  |  |                         $("#site-"+sites[i].siteId).attr("class", "site " + sites[i].siteStatus); | 
 |  |  |                         var siteEl = $("#site-"+sites[i].siteId); | 
 |  |  |                         siteEl.attr("class", "site " + sites[i].siteStatus); | 
 |  |  |                         if (sites[i].workNo != null && sites[i].workNo>0) { | 
 |  |  |                             siteEl.html(sites[i].siteId + "[" + sites[i].workNo + "]"); | 
 |  |  |                         } else { | 
 |  |  |                             siteEl.html(sites[i].siteId); | 
 |  |  |                         } | 
 |  |  |                         if (i+1===8) { | 
 |  |  |                             carAnimate(i+1, Number(sites[i].nearbySta)); | 
 |  |  |                         } | 
 |  |  |                     } | 
 |  |  |                 } else if (res.code === 403){ | 
 |  |  |                     top.location.href = baseUrl+"/login"; | 
 |  |  |                     parent.location.href = baseUrl+"/login"; | 
 |  |  |                 }  else { | 
 |  |  |                     alert(res.msg); | 
 |  |  |                     console.log(res.msg); | 
 |  |  |                 } | 
 |  |  |             } | 
 |  |  |         }); | 
 |  |  | 
 |  |  |                 if (res.code === 200){ | 
 |  |  |                     var crns = res.data; | 
 |  |  |                     for (var i = 0; i < crns.length; i++){ | 
 |  |  |                         crnAnimate(crns[i].crnId, crns[i].offset); | 
 |  |  |                         var crnEl = $("#crn-"+crns[i].crnId); | 
 |  |  |                         crnEl.attr("class", "machine " + crns[i].crnStatus); | 
 |  |  |                         var unit = ($('.item').eq(0).width()+4)/2; | 
 |  |  |                         crnEl.animate({left: (crns[i].bay * unit + 25) +'px'}, 1000); | 
 |  |  |                     } | 
 |  |  |                 } else if (res.code === 403){ | 
 |  |  |                     top.location.href = baseUrl+"/login"; | 
 |  |  |                     parent.location.href = baseUrl+"/login"; | 
 |  |  |                 }  else { | 
 |  |  |                     alert(res.msg); | 
 |  |  |                     console.log(res.msg); | 
 |  |  |                 } | 
 |  |  |             } | 
 |  |  |         }); | 
 |  |  | 
 |  |  |             method: 'POST', | 
 |  |  |             success: function (res) { | 
 |  |  |                 if (res.code === 200){ | 
 |  |  |  | 
 |  |  |                     var barcodes = res.data; | 
 |  |  |                     for (var i = 0; i < barcodes.length; i++){ | 
 |  |  |                         $("#code-decoder-data-"+barcodes[i].barcodeId).html(barcodes[i].codeValue); | 
 |  |  |                     } | 
 |  |  |                 } else if (res.code === 403){ | 
 |  |  |                     top.location.href = baseUrl+"/login"; | 
 |  |  |                     parent.location.href = baseUrl+"/login"; | 
 |  |  |                 }  else { | 
 |  |  |                     alert(res.msg); | 
 |  |  |                     console.log(res.msg); | 
 |  |  |                 } | 
 |  |  |             } | 
 |  |  |         }); | 
 |  |  |     } | 
 |  |  |  | 
 |  |  |     // 磅秤实时数据获取 | 
 |  |  |     function getScaleInfo(){ | 
 |  |  |         $.ajax({ | 
 |  |  |             url: baseUrl+ "/console/latest/data/scale", | 
 |  |  |             headers: {'token': localStorage.getItem('token')}, | 
 |  |  |             method: 'POST', | 
 |  |  |             success: function (res) { | 
 |  |  |  | 
 |  |  |                 if (res.code === 200){ | 
 |  |  |                     var sclaes = res.data; | 
 |  |  |                     for (var i = 0; i < sclaes.length; i++){ | 
 |  |  |                         console.log(sclaes[i].scaleId + ":" + sclaes[i].value) | 
 |  |  |                         $("#scale-data-"+sclaes[i].scaleId).text(sclaes[i].value); | 
 |  |  |                     } | 
 |  |  |                 } else if (res.code === 403){ | 
 |  |  |                     parent.location.href = baseUrl+"/login"; | 
 |  |  |                 }  else { | 
 |  |  |                     console.log(res.msg); | 
 |  |  |                 } | 
 |  |  |             } | 
 |  |  |         }); | 
 |  |  | 
 |  |  |     function crnAnimate(id, leftVal) { | 
 |  |  |         switch (id) { | 
 |  |  |             case 1: | 
 |  |  |                 $("#crn1").animate({left: leftVal+'px'}, 1000); | 
 |  |  |                 $("#crn-1").animate({left: leftVal+'px'}, 1000); | 
 |  |  |                 crn1Position = leftVal; | 
 |  |  |                 break; | 
 |  |  |             case 2: | 
 |  |  |                 $("#crn2").animate({left: leftVal+'px'}, 1000); | 
 |  |  |                 $("#crn-2").animate({left: leftVal+'px'}, 1000); | 
 |  |  |                 crn2Position = leftVal; | 
 |  |  |                 break; | 
 |  |  |             case 3: | 
 |  |  |                 $("#crn-3").animate({left: leftVal+'px'}, 1000); | 
 |  |  |                 crn3Position = leftVal; | 
 |  |  |                 break; | 
 |  |  |             case 4: | 
 |  |  |                 $("#crn-4").animate({left: leftVal+'px'}, 1000); | 
 |  |  |                 crn4Position = leftVal; | 
 |  |  |                 break; | 
 |  |  |             case 5: | 
 |  |  |                 $("#crn-5").animate({left: leftVal+'px'}, 1000); | 
 |  |  |                 crn5Position = leftVal; | 
 |  |  |                 break; | 
 |  |  |             default: | 
 |  |  |                 break | 
 |  |  | 
 |  |  |     // 页面点击事件监听 --------------------------------------------------------- | 
 |  |  |  | 
 |  |  |     // 输送设备点击事件 | 
 |  |  |     $('.site').on('click', function () { | 
 |  |  |         layer.open({ | 
 |  |  |             title: "1204站点信息", | 
 |  |  |             closeBtn: 0, | 
 |  |  |             skin: 'layui-layer-lan', | 
 |  |  |             offset: '180px', | 
 |  |  |             type: 1, | 
 |  |  |             shadeClose: true, | 
 |  |  |             content: $('#siteWindow'), | 
 |  |  |             area: ['35rem', '18rem'], | 
 |  |  |             btn: ['确定', '关闭'], | 
 |  |  |             yes: function(index, layero){ | 
 |  |  |                 layer.close(index); | 
 |  |  |                 alert(1); | 
 |  |  |             } | 
 |  |  |         }); | 
 |  |  |     }); | 
 |  |  |     // $('.site').on('click', function () { | 
 |  |  |     //    var id = this.id.split("-")[1]; | 
 |  |  |     //    if (id === undefined) { | 
 |  |  |     //       return; | 
 |  |  |     //    } | 
 |  |  |     //    layer.open({ | 
 |  |  |     //       title: id + " 站点信息详情", | 
 |  |  |     //       closeBtn: 0, | 
 |  |  |     //       skin: 'layui-layer-lan', | 
 |  |  |     //       offset: '180px', | 
 |  |  |     //       type: 1, | 
 |  |  |     //       shadeClose: true, | 
 |  |  |     //       content: $('#siteWindow'), | 
 |  |  |     //       area: ['35rem', '18rem'], | 
 |  |  |     //       btn: ['确定', '关闭'], | 
 |  |  |     //       success: function(layero, index){ | 
 |  |  |     //          http.post(baseUrl+"/console/site/detail", {siteId: id}, function (res) { | 
 |  |  |     //             for (var val in res.data) { | 
 |  |  |     //                var find = $("#siteWindow").find(":input[name='" + val + "']"); | 
 |  |  |     //                if (find[0].type==='text') { | 
 |  |  |     //                   find.val(res.data[val]); | 
 |  |  |     //                } else if (find[0].type === 'checkbox') { | 
 |  |  |     //                   find.attr("checked", res.data[val] === 'Y'); | 
 |  |  |     //                } | 
 |  |  |     //             } | 
 |  |  |     //          }) | 
 |  |  |     //       }, | 
 |  |  |     //       end: function () { | 
 |  |  |     //          $(':input', $("#siteWindow")).val('').removeAttr('checked').removeAttr('selected'); | 
 |  |  |     //       } | 
 |  |  |     //    }); | 
 |  |  |     // }); | 
 |  |  |  | 
 |  |  |     // 堆垛机点击事件 | 
 |  |  |     $('.machine').on('click', function () { | 
 |  |  |         layer.open({ | 
 |  |  |             title: "1号堆垛机", | 
 |  |  |             skin: 'layui-layer-lan', | 
 |  |  |             closeBtn: 0, | 
 |  |  |             type: 1, | 
 |  |  |             offset: '150px', | 
 |  |  |             shadeClose: true, | 
 |  |  |             content: $("#crnWindow"), | 
 |  |  |             area: ['40rem', '20rem'], | 
 |  |  |             btn: ['确定', '关闭'], | 
 |  |  |             yes: function(index, layero){ | 
 |  |  |                 layer.close(index); | 
 |  |  |                 alert(1); | 
 |  |  |     // $('.machine').on('click', function () { | 
 |  |  |     //    var id = this.id.split("-")[1]; | 
 |  |  |     //    layer.open({ | 
 |  |  |     //       title: id+"号堆垛机", | 
 |  |  |     //       skin: 'layui-layer-lan', | 
 |  |  |     //       closeBtn: 0, | 
 |  |  |     //       type: 1, | 
 |  |  |     //       offset: '150px', | 
 |  |  |     //       shadeClose: true, | 
 |  |  |     //       content: $("#crnWindow"), | 
 |  |  |     //       area: ['40rem', '20rem'], | 
 |  |  |     //       btn: ['确定', '关闭'], | 
 |  |  |     //       success: function(layero, index){ | 
 |  |  |     //          http.post(baseUrl+"/console/crn/detail", {crnNo: id}, function (res) { | 
 |  |  |     //             for (var val in res.data) { | 
 |  |  |     //                var find = $("#crnWindow").find(":input[name='" + val + "']"); | 
 |  |  |     //                if (find[0].type==='text') { | 
 |  |  |     //                   find.val(res.data[val]); | 
 |  |  |     //                } else if (find[0].type === 'checkbox') { | 
 |  |  |     //                   find.attr("checked", res.data[val] === 'Y'); | 
 |  |  |     //                } | 
 |  |  |     //             } | 
 |  |  |     //          }) | 
 |  |  |     //       }, | 
 |  |  |     //       end: function () { | 
 |  |  |     //          $(':input', $("#crnWindow")).val('').removeAttr('checked').removeAttr('selected'); | 
 |  |  |     //       } | 
 |  |  |     //    }); | 
 |  |  |     // }); | 
 |  |  |  | 
 |  |  |  | 
 |  |  |     // 小车偏移动画 | 
 |  |  |     function carAnimate(id, target) { | 
 |  |  |         var targetTop = 122; | 
 |  |  |         if (id === 8) { | 
 |  |  |             switch (target) { | 
 |  |  |                 case 1: | 
 |  |  |                     targetTop += 160; | 
 |  |  |                     break; | 
 |  |  |                 case 2: | 
 |  |  |                     targetTop += 140; | 
 |  |  |                     break; | 
 |  |  |                 case 3: | 
 |  |  |                     targetTop += 80; | 
 |  |  |                     break; | 
 |  |  |                 case 4: | 
 |  |  |                     targetTop += 40; | 
 |  |  |                     break; | 
 |  |  |                 case 7: | 
 |  |  |                     targetTop += 0; | 
 |  |  |                     break; | 
 |  |  |                 default: | 
 |  |  |                     return; | 
 |  |  |             } | 
 |  |  |         }); | 
 |  |  |     }); | 
 |  |  |         } else { | 
 |  |  |             return; | 
 |  |  |         } | 
 |  |  |         $("#site-" + id).animate({top: targetTop+'px'}, 1000); | 
 |  |  |     } | 
 |  |  |  | 
 |  |  |  | 
 |  |  |      //楼层切换按钮 | 
 |  |  |     function changFloor(x) { | 
 |  |  |         switch (x) { | 
 |  |  |             case 1: | 
 |  |  |                 $('#fool1').css("display","block") | 
 |  |  |                 $('#fool2').css("display","none") | 
 |  |  |                 $('#fool3').css("display","none") | 
 |  |  |                 return | 
 |  |  |             case 2: | 
 |  |  |                 $('#fool1').css("display","none") | 
 |  |  |                 $('#fool2').css("display","block") | 
 |  |  |                 $('#fool3').css("display","none") | 
 |  |  |                 return | 
 |  |  |             case 3: | 
 |  |  |                 $('#fool1').css("display","none") | 
 |  |  |                 $('#fool2').css("display","none") | 
 |  |  |                 $('#fool3').css("display","block") | 
 |  |  |                 return | 
 |  |  |             default: | 
 |  |  |                 return; | 
 |  |  |  | 
 |  |  |         } | 
 |  |  |     } | 
 |  |  |  | 
 |  |  | </script> | 
 |  |  | </html> |