| <!DOCTYPE html> | 
| <html lang="en"> | 
| <head> | 
|     <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/pipeline.css"> | 
|     <script type="text/javascript" src="../static/js/jquery/jquery-3.3.1.min.js"></script> | 
|     <script type="text/javascript" src="../static/js/common.js"></script> | 
|     <script type="text/javascript" src="../static/js/layer/layer.js"></script> | 
|     <style> | 
|   | 
|     </style> | 
| </head> | 
| <body> | 
| <main> | 
|     <!-- plc异常日志监控版 --> | 
|     <div id="plc-error" class="main-board" style="padding-left: 10px"> | 
|         <!-- 头部 --> | 
|         <div class="plc-log-header"> | 
| <!--            <div style="height: 40%">--> | 
| <!--                <span>东侧PLC执行指令</span>--> | 
| <!--            </div>--> | 
| <!--            <div style="height: 40%">--> | 
| <!--                <span>西侧PLC执行指令</span>--> | 
| <!--            </div>--> | 
|             <div> | 
|                 <span style="color: #1E9FFF">PLC异常信息表:</span> | 
|             </div> | 
|         </div> | 
|         <!-- 主体 --> | 
|         <div class="plc-log-body"> | 
|             <table id="plc-error-table"> | 
|                 <thead> | 
|                     <tr> | 
|                         <th style="width: 200px">序号</th> | 
|                         <th style="width: 400px">PLC错误描述</th> | 
|                         <th style="width: 400px">异常</th> | 
|                     </tr> | 
|                 </thead> | 
|                 <tbody> | 
|   | 
|                 </tbody> | 
|             </table> | 
|         </div> | 
|     </div> | 
|   | 
|     <!-- 站点状态数据监控版 --> | 
|     <div id="site-monitor" class="main-board"> | 
|         <!-- 表格 --> | 
|         <table id="site-table"> | 
|             <!-- 表头 --> | 
|             <thead> | 
|                 <tr> | 
|                     <th>站号</th> | 
|                     <th>工作号</th> | 
|                     <th>自动</th> | 
|                     <th>有物</th> | 
|                     <th>可入</th> | 
|                     <th>可出</th> | 
|                     <th>需求1</th> | 
|                     <th>空板信号</th> | 
|                     <th>目标站</th> | 
|                 </tr> | 
|             </thead> | 
|             <!-- 表格内容 --> | 
|             <tbody></tbody> | 
|         </table> | 
|     </div> | 
| </main> | 
| <footer> | 
|     <textarea id="output"></textarea> | 
| </footer> | 
|   | 
| <div id="site-detl" style="display: none"> | 
|     <form> | 
|         <div class="form-item"> | 
|             <label class="form-label">站号:</label> | 
|             <div class="form-input"> | 
|                 <input id="siteId" name="siteId" class="layui-input" lay-verify="required|number" autocomplete="off" disabled="disabled"> | 
|             </div> | 
|         </div> | 
|         <div class="form-item"> | 
|             <label class="form-label">工作号:</label> | 
|             <div class="form-input"> | 
|                 <input id="workNo" name="workNo" type="number" class="layui-input" lay-verify="number" autocomplete="off"> | 
|             </div> | 
|         </div> | 
|         <div class="form-item"> | 
|             <label class="form-label">目标站:</label> | 
|             <div class="form-input"> | 
|                 <input id="staNo" name="staNo" type="number" class="layui-input" lay-verify="number" autocomplete="off"> | 
|             </div> | 
|         </div> | 
|         <div class="form-item form-button-container"> | 
|             <button class="form-button" id="save">保存</button> | 
|             <button class="form-button" id="cancel" style="background-color: #D0D0D0">取消</button> | 
|         </div> | 
|     </form> | 
| </div> | 
| </body> | 
| <script> | 
|     // 初始化 | 
|     // 空白行数 | 
|     var plcErrorTableBlankRows = 0; | 
|     var siteTableBlankRows = 0; | 
|     // 实际行数 | 
|     var plcErrorTableFullRows = 0; | 
|     var siteTableFullRows = 0; | 
|     var outputDom = document.getElementById("output"); | 
|     $(document).ready(function() { | 
|         initPlcErrorTable(); | 
|         getPlcError(); | 
|         initSiteTable(); | 
|         getSite(); | 
|     }); | 
|     // 实时访问 | 
|     setInterval(function () { | 
|         getPlcError(); | 
|         getSite(); | 
|     }, 1000); | 
|     setInterval(function () { | 
|         getSiteOutput(); | 
|     },500); | 
|   | 
|     // plc异常信息表获取 | 
|     function getPlcError() { | 
|         var tableEl = $('#plc-error-table'); | 
|         tableEl.children("tr").children("td").html(""); | 
|         $.ajax({ | 
|             url: baseUrl+ "/site/table/plc/errors", | 
|             headers: {'token': localStorage.getItem('token')}, | 
|             method: 'POST', | 
|             success: function (res) { | 
|                 if (res.code === 200){ | 
|                     var table = res.data; | 
|                     for (var i=1;i<=table.length;i++){ | 
|                         var tr = tableEl.find("tr").eq(i); | 
|                         tr.children("td").eq(0).html(table[i-1].no); | 
|                         tr.children("td").eq(1).html(table[i-1].plcDesc); | 
|                         tr.children("td").eq(2).html(table[i-1].error); | 
|                     } | 
|                 } else if (res.code === 403){ | 
|                     window.location.href = baseUrl+"/login"; | 
|                 }  else { | 
|                     alert(res.msg); | 
|                 } | 
|             } | 
|         }); | 
|     } | 
|   | 
|     // 站点信息表获取 | 
|     function getSite() { | 
|         var tableEl = $('#site-table'); | 
|         $.ajax({ | 
|             url: baseUrl+ "/site/table/site", | 
|             headers: {'token': localStorage.getItem('token')}, | 
|             method: 'POST', | 
|             success: function (res) { | 
|                 if (res.code === 200){ | 
|                     var table = res.data; | 
|                     if (table.length > siteTableBlankRows && table.length !== siteTableFullRows) { | 
|                         initSiteTable(table.length-siteTableBlankRows); | 
|                         siteTableFullRows = table.length; | 
|                     } | 
|                     for (var i=1;i<=table.length;i++){ | 
|                         var tr = tableEl.find("tr").eq(i); | 
|                         setVal(tr.children("td").eq(0), table[i-1].devNo); | 
|                         setVal(tr.children("td").eq(1), table[i-1].workNo); | 
|                         setVal(tr.children("td").eq(2), table[i-1].autoing); | 
|                         setVal(tr.children("td").eq(3), table[i-1].loading); | 
|                         setVal(tr.children("td").eq(4), table[i-1].inEnable); | 
|                         setVal(tr.children("td").eq(5), table[i-1].outEnable); | 
|                         setVal(tr.children("td").eq(6), table[i-1].inreq1); | 
|                         setVal(tr.children("td").eq(7), table[i-1].emptyMk); | 
|                         setVal(tr.children("td").eq(8), table[i-1].staNo); | 
|                     } | 
|                 } else if (res.code === 403){ | 
|                     window.location.href = baseUrl+"/login"; | 
|                 }  else { | 
|                     alert(res.msg); | 
|                 } | 
|             } | 
|         }); | 
|     } | 
|   | 
|     // 输送设备日志输出 | 
|     function getSiteOutput() { | 
|         $.ajax({ | 
|             url: baseUrl + "/site/output/site", | 
|             headers: {'token': localStorage.getItem('token')}, | 
|             method: 'POST', | 
|             success: function (res) { | 
|                 if (res.code === 200) { | 
|                     output(res.data); | 
|                 } else if (res.code === 403) { | 
|                     window.location.href = baseUrl + "/login"; | 
|                 } else { | 
|                     alert(res.msg); | 
|                 } | 
|             } | 
|         }) | 
|     } | 
|   | 
|     // 日志输出框 | 
|     function output(content){ | 
|         outputDom.value += content; | 
|         outputDom.scrollTop = outputDom.scrollHeight; | 
|     } | 
|   | 
|     // ------------------------------------------------------------------------------------------------ | 
|   | 
|     // plc异常空白表格渲染 | 
|     function initPlcErrorTable(row) { | 
|         var line; | 
|         if (row === undefined){ | 
|             var one = $('#plc-error-table thead').height(); | 
|             var total = $('.plc-log-body').height(); | 
|             var count = total / one; | 
|             count = parseInt(count) - 1; | 
|             plcErrorTableBlankRows = count; | 
|             line = count; | 
|         } else { | 
|             line = row; | 
|         } | 
|         var html = ""; | 
|         for (var i = 0; i < line; i ++){ | 
|             html += " <tr>\n" + | 
|                 "       <td></td>\n" + | 
|                 "       <td></td>\n" + | 
|                 "       <td></td>\n" + | 
|                 "     </tr>\n"; | 
|         } | 
|         $('#plc-error-table tbody').after(html); | 
|     } | 
|   | 
|     // 站点空白表格渲染 | 
|     function initSiteTable(row) { | 
|         var line; | 
|         if (row === undefined){ | 
|             var one = $('#site-table thead').height(); | 
|             var total = $('#site-monitor').height(); | 
|             var count = total / one; | 
|             count = parseInt(count) - 1; | 
|             siteTableBlankRows = count; | 
|             line = count; | 
|         } else { | 
|             line = row; | 
|         } | 
|         var html = ""; | 
|         for (var i = 0; i < line; i ++){ | 
|             html += " <tr>\n" + | 
|                 "       <td></td>\n" + | 
|                 "       <td></td>\n" + | 
|                 "       <td></td>\n" + | 
|                 "       <td></td>\n" + | 
|                 "       <td></td>\n" + | 
|                 "       <td></td>\n" + | 
|                 "       <td></td>\n" + | 
|                 "       <td></td>\n" + | 
|                 "       <td></td>\n" + | 
|                 "     </tr>\n"; | 
|         } | 
|         $('#site-table tbody').after(html); | 
|     } | 
|   | 
|     // 详情操作 ------------------------------------------------------------------------- | 
|     var layerDetl; | 
|     $(document).on('dblclick ','#site-table tr', function () { | 
|         var siteId = $(this).children("td").eq(0).html(); | 
|         if (siteId !== null && siteId !== "") { | 
|             layerDetl = layer.open({ | 
|                 type: 1, | 
|                 title: false, | 
|                 shadeClose: true, | 
|                 offset: 'rt', | 
|                 anim: 5, | 
|                 shade: [0], | 
|                 area: ['340px', '215px'], | 
|                 closeBtn: 0, | 
|                 content: $("#site-detl"), | 
|                 success: function(layero, index){ | 
|                     http.get(baseUrl+ "/site/detl/"+siteId, null, function (res) { | 
|                         $('#siteId').val(siteId); | 
|                         $('#workNo').val(res.data.workNo); | 
|                         $('#staNo').val(res.data.staNo); | 
|                     }) | 
|                 }, | 
|                 end: function () { | 
|                     $('#siteId').val(""); | 
|                     $('#workNo').val(""); | 
|                     $('#staNo').val(""); | 
|                 } | 
|             }) | 
|         } | 
|     }); | 
|   | 
|     $(document).on('click ','#save', function () { | 
|         http.post(baseUrl+ "/site//detl/update", { | 
|             siteId: $('#siteId').val(), | 
|             workNo: $('#workNo').val(), | 
|             staNo:  $('#staNo').val() | 
|         }, function (res) { | 
|             layer.msg("修改成功",{icon: 1,}); | 
|         }) | 
|     }) | 
|     $(document).on('click ','#cancel', function () { | 
|         $('#siteId').val(""); | 
|         $('#workNo').val(""); | 
|         $('#staNo').val(""); | 
|         layer.close(layerDetl); | 
|     }) | 
|   | 
| </script> | 
| </html> |