| | |
| | | <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 class="system-icon"></div> |
| | | <span>系统运行中...</span> |
| | | <div id="system-icon" class="system-icon-open" onclick="systemSwitch()"></div> |
| | | <span id="system-run-desc">系统运行中...</span> |
| | | </div> |
| | | |
| | | <!-- 信息展示 --> |
| | |
| | | </div> |
| | | </div> |
| | | </div> |
| | | |
| | | <!--分割线--> |
| | | <!--<hr class="header-hr">--> |
| | | </header> |
| | | <main> |
| | | |
| | |
| | | <span class="row-no">1#</span> |
| | | </div> |
| | | </div> |
| | | |
| | | <!-- 右输送线 --> |
| | | <!--<input id="val" type="text">--> |
| | | <!--<button id="animate">animate</button>--> |
| | | </main> |
| | | |
| | | <!-- 弹窗 --> |
| | | <!-- 输送设备弹窗 --> |
| | | <div id="siteWindow" style="display: none"> |
| | | <form> |
| | | <label>设备号<input type="text" name="devpNo" value="12" disabled="disabled"></label> |
| | | <label>工作号<input type="text" name="workNo" value="9998" disabled="disabled"></label> |
| | | <label>工作状态<input type="text" name="workStatus" value="2.设备上移动" disabled="disabled"></label> |
| | | <label>自动<input type="checkbox" name="auto" disabled="disabled" checked></label> |
| | | <label>有物<input type="checkbox" name="loading" disabled="disabled" checked></label> |
| | | <label>能入<input type="checkbox" name="canining" disabled="disabled" checked></label> |
| | | <label>能出<input type="checkbox" name="canouting" disabled="disabled" checked></label> |
| | | <label>出入类型<input type="text" name="ioType" value="1.入库" disabled="disabled"></label> |
| | | <label>源站<input type="text" name="sourceStaNo" value="2303" disabled="disabled"></label> |
| | | <label>目标站<input type="text" name="staNo" value="2410" disabled="disabled"></label> |
| | | <label>源库位<input type="text" name="sourceStock" value="" disabled="disabled"></label> |
| | | <label>目标库位<input type="text" name="stock" value="" disabled="disabled"></label> |
| | | </form> |
| | | </div> |
| | | <!-- 堆垛机弹窗 --> |
| | | <div id="crnWindow" style="display: none"> |
| | | <label>堆垛机号<input type="text" name="crnNo" value="12" disabled="disabled"></label> |
| | | <label>工作号<input type="text" name="workNo" value="9998" disabled="disabled"></label> |
| | | <label>源站<input type="text" name="sourceStaNo" value="2303" disabled="disabled"></label> |
| | | <label>目标站<input type="text" name="staNo" value="2410" disabled="disabled"></label> |
| | | <label>工作状态<input type="text" name="workStatus" value="2.设备上移动" disabled="disabled"></label> |
| | | <label>出入类型<input type="text" name="ioType" value="1.入库" disabled="disabled"></label> |
| | | <label>源库位<input type="text" name="sourceStock" value="" disabled="disabled"></label> |
| | | <label>目标库位<input type="text" name="stock" value="" disabled="disabled"></label> |
| | | <label>堆垛机状态<input type="text" name="crnStatus" disabled="disabled"></label> |
| | | <label>异常<input type="text" name="error" disabled="disabled" checked></label> |
| | | </div> |
| | | |
| | | </body> |
| | | <script> |
| | | |
| | | var systemRunning = true; |
| | | var crn1Position = 0; |
| | | var crn2Position = 0; |
| | | // 初始化 |
| | |
| | | getCrnInfo(); |
| | | // 实时访问 |
| | | setInterval(function () { |
| | | getSitesInfo(); |
| | | getCrnInfo(); |
| | | }, 500); |
| | | setInterval(function () { |
| | | getSitesInfo(); |
| | | }, 3000); |
| | | |
| | | // 系统运行开关 |
| | | function systemSwitch() { |
| | | if (systemRunning){ |
| | | layer.prompt({title: '请输入口令,并停止 WCS 系统', formType: 1}, function(pass, idx){ |
| | | layer.close(idx); |
| | | if ("123"!==pass){ |
| | | alert("口令错误"); |
| | | return; |
| | | } |
| | | var index = null; |
| | | index = layer.load(1, { |
| | | shade: [0.1,'#fff'] |
| | | }); |
| | | setTimeout(function () { |
| | | if (systemRunning){ |
| | | $('#system-icon').attr("class", "system-icon-close"); |
| | | $('#system-run-desc').html("系统已停止!"); |
| | | systemRunning = false; |
| | | } else { |
| | | $('#system-icon').attr("class", "system-icon-open"); |
| | | $('#system-run-desc').html("系统运行中..."); |
| | | systemRunning = true; |
| | | } |
| | | layer.close(index); |
| | | }, 2000); |
| | | }); |
| | | |
| | | } else { |
| | | var index = null; |
| | | index = layer.load(1, { |
| | | shade: [0.1,'#fff'] |
| | | }); |
| | | setTimeout(function () { |
| | | if (systemRunning){ |
| | | $('#system-icon').attr("class", "system-icon-close"); |
| | | $('#system-run-desc').html("系统已停止!"); |
| | | systemRunning = false; |
| | | } else { |
| | | $('#system-icon').attr("class", "system-icon-open"); |
| | | $('#system-run-desc').html("系统运行中..."); |
| | | systemRunning = true; |
| | | } |
| | | layer.close(index); |
| | | }, 2000); |
| | | } |
| | | } |
| | | |
| | | // 输送设备实时数据获取 |
| | | function getSitesInfo(){ |
| | |
| | | success: function (res) { |
| | | if (res.code === 200){ |
| | | var crns = res.data; |
| | | console.log(crns); |
| | | for (var i = 0; i < crns.length; i++){ |
| | | crnAnimate(crns[i].crnId, crns[i].offset); |
| | | } |
| | |
| | | } |
| | | } |
| | | |
| | | // 页面点击事件监听 --------------------------------------------------------- |
| | | |
| | | $('.item').on('click', function () { |
| | | // 输送设备点击事件 |
| | | $('.site').on('click', function () { |
| | | layer.open({ |
| | | title: "1204站点信息", |
| | | closeBtn: 0, |
| | | skin: 'layui-layer-lan', |
| | | offset: '180px', |
| | | type: 1, |
| | | shadeClose: true, //点击遮罩关闭层 |
| | | content: 'text' |
| | | shadeClose: true, |
| | | content: $('#siteWindow'), |
| | | area: ['30rem', '18rem'], |
| | | btn: ['确定', '关闭'] |
| | | }); |
| | | }); |
| | | $('#animate').click(function () { |
| | | crnAnimate(1, $('#val').val()); |
| | | |
| | | // 堆垛机点击事件 |
| | | $('.machine').on('click', function () { |
| | | layer.open({ |
| | | title: "1号堆垛机", |
| | | skin: 'layui-layer-lan', |
| | | closeBtn: 0, |
| | | type: 1, |
| | | offset: '180px', |
| | | shadeClose: true, |
| | | content: $("#crnWindow"), |
| | | area: ['30rem', '18rem'], |
| | | btn: ['确定', '关闭'] |
| | | }); |
| | | }); |
| | | |
| | | </script> |