| | |
| | | <button class="floorBtn btn-16" onclick="changFloor(this,3)" style="margin-top: 250px">3F</button> |
| | | <button class="floorBtn btn-16" onclick="changFloor(this,4)" style="margin-top: 300px">4F</button> |
| | | </div> |
| | | <button class="floorBtn btn-16" onclick="testMove()" style="margin-top: 350px">测试移动车</button> |
| | | <button class="floorBtn btn-16" onclick="testMove()" style="margin-top: 350px;font-size: 14px;">测试移动车</button> |
| | | <button class="floorBtn btn-16" onclick="resetMap()" style="margin-top: 400px;font-size: 14px;">重置地图</button> |
| | | |
| | | <!-- 货架 + 堆垛机 + 入库站点 --> |
| | | <div class="main-part"> |
| | |
| | | <!-- 四向穿梭车状态 --> |
| | | <div class="line-status"> |
| | | <div class="body-head">穿梭车状态</div> |
| | | <div class="state"> |
| | | <span>四向穿梭车 1</span> |
| | | <span class="state-ss shuttle-idle">空闲</span> |
| | | </div> |
| | | <div class="state"> |
| | | <span>四向穿梭车 2</span> |
| | | <span class="state-ss shuttle-idle">空闲</span> |
| | | <div id="shuttle-status-box"> |
| | | </div> |
| | | <div class="button"><span>所有状态</span></div> |
| | | <div class="button item-group"> |
| | |
| | | <span class="shuttle-charging">充电中</span> |
| | | <span class="shuttle-charging-waiting">充电任务等待确认</span> |
| | | <span class="shuttle-fixing">故障修复中</span> |
| | | <span class="shuttle-offline">离线</span> |
| | | </div> |
| | | </div> |
| | | <!-- 提升机状态 --> |
| | | <div class="line-status"> |
| | | <div class="body-head">提升机状态</div> |
| | | <div class="state states"> |
| | | <span>提升机</span> |
| | | <span class="state-ss shuttle-idle">空闲</span> |
| | | <div id="lift-status-box"> |
| | | |
| | | </div> |
| | | <div class="button"><span>所有状态</span></div> |
| | | <div class="button item-group"> |
| | | <span class="lift-idle">空闲</span> |
| | | <span class="lift-working">作业中</span> |
| | | <span class="lift-waiting">等待确认</span> |
| | | <span class="lift-offline">离线</span> |
| | | </div> |
| | | </div> |
| | | <!-- 输送线状态 --> |
| | |
| | | |
| | | setInterval(() => { |
| | | getShuttleStateInfo() |
| | | getLiftStateInfo() |
| | | },1000) |
| | | |
| | | // 提升机信息表获取 |
| | | function getLiftStateInfo() { |
| | | $.ajax({ |
| | | url: baseUrl+ "/lift/table/lift/state", |
| | | headers: {'token': localStorage.getItem('token')}, |
| | | method: 'POST', |
| | | success: function (res) { |
| | | $("#lift-status-box").empty() |
| | | res.data.forEach((item,index) => { |
| | | let liftStatusClass = "lift-idle" |
| | | switch (item.status) { |
| | | case 1://空闲 |
| | | liftStatusClass = "lift-idle"; |
| | | break |
| | | case 2://作业中 |
| | | liftStatusClass = "lift-working"; |
| | | break |
| | | case 3://等待确认 |
| | | liftStatusClass = "lift-waiting"; |
| | | break |
| | | case 4://离线 |
| | | liftStatusClass = "lift-offline"; |
| | | break |
| | | default: |
| | | liftStatusClass = "lift-idle" |
| | | } |
| | | let liftStatus = '<div class="state states">' + |
| | | '<span>提升机 ' + item.liftNo + '</span>' + |
| | | '<span class="state-ss ' + liftStatusClass + '">' + item.protocolStatus$ + '</span></div>'; |
| | | $("#lift-status-box").append(liftStatus) |
| | | |
| | | }) |
| | | } |
| | | }); |
| | | } |
| | | |
| | | // 四向穿梭车信息表获取 |
| | | function getShuttleStateInfo() { |
| | |
| | | headers: {'token': localStorage.getItem('token')}, |
| | | method: 'POST', |
| | | success: function (res) { |
| | | $("#shuttle-status-box").empty() |
| | | res.data.forEach((item,index) => { |
| | | let shuttleStatusClass = "shuttle-idle" |
| | | switch (item.status) { |
| | | case 1://空闲 |
| | | shuttleStatusClass = "shuttle-idle"; |
| | | break |
| | | case 2://作业中 |
| | | shuttleStatusClass = "shuttle-working"; |
| | | break |
| | | case 3://等待确认 |
| | | shuttleStatusClass = "shuttle-waiting"; |
| | | break |
| | | case 4://充电中 |
| | | shuttleStatusClass = "shuttle-charging"; |
| | | break |
| | | case 5://充电任务等待确认 |
| | | shuttleStatusClass = "shuttle-charging-waiting"; |
| | | break |
| | | case 6://故障修复中 |
| | | shuttleStatusClass = "shuttle-fixing"; |
| | | break |
| | | case 7://离线 |
| | | shuttleStatusClass = "shuttle-offline"; |
| | | break |
| | | default: |
| | | shuttleStatusClass = "shuttle-offline" |
| | | } |
| | | let shuttleStatus = '<div class="state">' + |
| | | '<span>四向穿梭车 ' + item.shuttleNo + '</span>' + |
| | | '<span class="state-ss ' + shuttleStatusClass + '">' + item.status$ + '</span></div>'; |
| | | $("#shuttle-status-box").append(shuttleStatus) |
| | | |
| | | if(item.locNoLev != currentLev){ |
| | | //四向穿梭车楼层和当前地图楼层不一致,删除该车辆 |
| | | $("#sxcar-" + item.shuttleNo).remove() |
| | |
| | | |
| | | //初始化地图 |
| | | function initMap(lev) { |
| | | getMap(lev) |
| | | |
| | | $.ajax({ |
| | | url: baseUrl+ "/shuttle/table/shuttle/state", |
| | | headers: {'token': localStorage.getItem('token')}, |
| | | method: 'POST', |
| | | success: function (res) { |
| | | res.data.forEach((item,index) => { |
| | | if(lev == item.locNoLev){ |
| | | let carBox = '<div class="sxcar" id="sxcar-' + item.shuttleNo + '"></div>' |
| | | $("#mapDataId").append(carBox) |
| | | } |
| | | }) |
| | | } |
| | | }); |
| | | } |
| | | |
| | | //获取地图数据 |
| | | function getMap(lev) { |
| | | //母轨道第一次索引,用于定位小车 |
| | | let firstMotherIndex = [0,0]; |
| | | $("#mapDataId").empty() |
| | | $.ajax({ |
| | | type:"get", |
| | | url: baseUrl + "/static/js/map.json", |
| | | success: (data) => { |
| | | // url: baseUrl + "/static/js/map_" + lev + ".json", |
| | | url: baseUrl + "/console/map/" + lev + "/auth", |
| | | headers: {'token': localStorage.getItem('token')}, |
| | | success: (res) => { |
| | | let data = res.data |
| | | mapData = data |
| | | let content = "" |
| | | data.forEach((rowData,index) => { |
| | |
| | | if(!(idx == 0 || rowData.length - 1 == idx)){ |
| | | let col; |
| | | switch (colData.value){ |
| | | case -999: |
| | | col = '<button class="item" style="background:#f83333;color: #fff;">' + idx + '</button>'; |
| | | break; |
| | | case -1: |
| | | col = '<button class="item" style="visibility: hidden">' + idx + '</button>'; |
| | | break; |
| | |
| | | break; |
| | | case 4: |
| | | //站点 |
| | | if (lev == 1) { |
| | | let data = colData.data; |
| | | col = '<div id="site-' + data + '" class="site">' + data + '(9991)</div>'; |
| | | }else { |
| | | //其他楼层只有提升机能显示 |
| | | let data = colData.data; |
| | | if (data == 109) {//其他楼层只有提升机能显示 |
| | | col = '<div id="site-' + data + '" class="site">' + data + '(9991)</div>'; |
| | | }else { |
| | | col = '<div style="visibility: hidden" id="site-' + data + '" class="site">' + data + '(9991)</div>'; |
| | | } |
| | | } |
| | | var data = colData.data; |
| | | col = '<div id="site-' + data + '" class="site">' + data + '(9991)</div>'; |
| | | break; |
| | | case 5: |
| | | //充电桩 |
| | | col = '<button class="item" style="font-size: 24px">⚡</button>'; |
| | | break; |
| | | default: |
| | | col = '<button class="item">' + idx + '</button>'; |
| | |
| | | $("#mapDataId").append(content) |
| | | } |
| | | }) |
| | | |
| | | $.ajax({ |
| | | url: baseUrl+ "/shuttle/table/shuttle/state", |
| | | headers: {'token': localStorage.getItem('token')}, |
| | | method: 'POST', |
| | | success: function (res) { |
| | | res.data.forEach((item,index) => { |
| | | if(lev == item.locNoLev){ |
| | | let carBox = '<div class="sxcar" id="sxcar-' + item.shuttleNo + '"></div>' |
| | | $("#mapDataId").append(carBox) |
| | | } |
| | | }) |
| | | } |
| | | }); |
| | | } |
| | | |
| | | //将地图数据转换成int二维数组(后续用于请求计算路径时携带地图数据参数使用) |
| | |
| | | moveCar(1, item.x, item.y); |
| | | }) |
| | | |
| | | } |
| | | |
| | | /** |
| | | * 重置地图 |
| | | */ |
| | | function resetMap() { |
| | | $.ajax({ |
| | | url:baseUrl+"/console/map/resetMap/auth", |
| | | headers:{ |
| | | 'token': localStorage.getItem('token') |
| | | }, |
| | | data:{}, |
| | | method:'get', |
| | | success:function (res) { |
| | | layer.msg('重置完成'); |
| | | } |
| | | }) |
| | | } |
| | | |
| | | // 小车偏移动画 |
| | |
| | | success: function (res) { |
| | | if (res.code === 200){ |
| | | if (res.data.status) { |
| | | $('#system-icon').attr("class", "system-icon-open"); |
| | | $('#system-toggle-checked').attr("checked", true); |
| | | $('#system-run-desc').html("系统运行中..."); |
| | | parent.systemRunning = true; |
| | | } else { |
| | | $('#system-icon').attr("class", "system-icon-close"); |
| | | $('#system-toggle-checked').attr("checked", false); |
| | | $('#system-run-desc').html("系统已停止!"); |
| | | parent.systemRunning = false; |
| | | } |
| | |
| | | } |
| | | } |
| | | }); |
| | | } |
| | | |
| | | // 堆垛机偏移动画 |
| | | function crnAnimate(id, leftVal) { |
| | | switch (id) { |
| | | case 1: |
| | | $("#crn-1").animate({left: leftVal+'px'}, 1000); |
| | | crn1Position = leftVal; |
| | | break; |
| | | case 2: |
| | | $("#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 |
| | | } |
| | | } |
| | | |
| | | // 小车偏移动画 |