#websocket

Junjie

2023-10-31 d2fd7cfc1a426baabe4fac47f88b4db03432e22b

 src/main/webapp/views/console.html

@@ -342,6 +342,7 @@
               consoleInterval: null,//定时器存储变量
               codeList1: [],//条码List
               codeList2: [],//条码List
               ws: null,
            },
            created() {
               this.init()
@@ -351,6 +352,12 @@
            },
            methods: {
               init() {
                  this.ws = new WebSocket("ws://" + window.location.host + baseUrl + "/console/websocket");
                  this.ws.onopen = this.webSocketOnOpen
                  this.ws.onerror = this.webSocketOnError
                  this.ws.onmessage = this.webSocketOnMessage
                  this.ws.onclose = this.webSocketClose

                  this.getMap(this.currentLev)
                  this.getSystemRunningStatus() //获取系统运行状态

@@ -364,22 +371,20 @@
               },
               //获取地图数据
               getMap(lev) {
                  $.ajax({
                     type: "get",
                     url: baseUrl + "/console/map/" + lev + "/auth",
                     headers: {
                        'token': localStorage.getItem('token')
                     },
                     success: (res) => {
                        let data = res.data
                        let tmp = []
                        for (let i = 1; i < data.length - 1; i++) {
                           tmp.push(data[i])
                        }
                        // console.log(tmp)
                        this.map = tmp
                     }
                  })
                  this.sendWs(JSON.stringify({
                     "url": "/console/map/auth",
                     "data": lev
                  }))
               },
               setMap(res) {
                  //获取地图数据
                  let data = res.data
                  let tmp = []
                  for (let i = 1; i < data.length - 1; i++) {
                     tmp.push(data[i])
                  }
                  // console.log(tmp)
                  this.map = tmp
               },
               openSite(id) {
                  this.siteWindow = true; //打开站点信息弹窗
@@ -409,29 +414,26 @@
               },
               getSiteInfo() {
                  //获取输送站点数据
                  $.ajax({
                     url: baseUrl+ "/console/latest/data/site",
                     headers: {'token': localStorage.getItem('token')},
                     method: 'POST',
                     success: function (res) {
                        if (res.code === 200){
                           var sites = res.data;
                           for (var i = 0; i < sites.length; i++){
                              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);
                              }
                           }
                        } else if (res.code === 403){
                           parent.location.href = baseUrl+"/login";
                        }  else {
                           console.log(res.msg);
                  this.sendWs("{\"url\":\"/console/latest/data/site\",\"data\":{}}")
               },
               setSiteInfo(res) {
                  //获取输送站点数据
                  if (res.code === 200){
                     var sites = res.data;
                     for (var i = 0; i < sites.length; i++){
                        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);
                        }
                     }
                  });
                  } else if (res.code === 403){
                     parent.location.href = baseUrl+"/login";
                  }  else {
                     console.log(res.msg);
                  }
               },
               changFloor(lev) {
                  this.currentLev = lev
@@ -439,53 +441,41 @@
                  this.getMap(lev)
               },
               getShuttleStateInfo() {
                  this.sendWs("{\"url\":\"/shuttle/table/shuttle/state\",\"data\":{}}")
               },
               setShuttleStateInfo(res) {
                  // 四向穿梭车信息表获取
                  let that = this
                  $.ajax({
                     url: baseUrl + "/shuttle/table/shuttle/state",
                     headers: {
                        'token': localStorage.getItem('token')
                     },
                     method: 'POST',
                     success: function(res) {
                        if (res.code == 200) {
                           let currentLevShuttle = []//当前楼层小车集合
                           res.data.forEach((item,idx) => {
                              if (item != null && item.point != undefined && item.point != null) {
                                 if (item.point.z == that.currentLev) {
                                    currentLevShuttle.push(item);
                                 }
                              }
                           })
                           that.currentLevShuttleList = currentLevShuttle
                           that.shuttleList = res.data

                           if (that.shuttleColorList.length == 0) {
                              let colorList = []//随机小车颜色
                              res.data.forEach((item,idx) => {
                                 colorList[item.shuttleNo] = that.colorRGB()
                              })
                              that.shuttleColorList = colorList
                  if (res.code == 200) {
                     let currentLevShuttle = []//当前楼层小车集合
                     res.data.forEach((item,idx) => {
                        if (item != null && item.point != undefined && item.point != null) {
                           if (item.point.z == that.currentLev) {
                              currentLevShuttle.push(item);
                           }
                        }
                     })
                     that.currentLevShuttleList = currentLevShuttle
                     that.shuttleList = res.data

                     if (that.shuttleColorList.length == 0) {
                        let colorList = []//随机小车颜色
                        res.data.forEach((item,idx) => {
                           colorList[item.shuttleNo] = that.colorRGB()
                        })
                        that.shuttleColorList = colorList
                     }
                  });
                  }
               },
               getLiftStateInfo() {
                  // 提升机信息表获取
                  let that = this
                  $.ajax({
                     url: baseUrl + "/lift/table/lift/state",
                     headers: {
                        'token': localStorage.getItem('token')
                     },
                     method: 'POST',
                     success: function(res) {
                        if (res.code == 200) {
                           that.liftList = res.data
                        }
                     }
                  });
                  this.sendWs("{\"url\":\"/lift/table/lift/state\",\"data\":{}}")
               },
               setLiftStateInfo(res) {
                  // 提升机信息表获取
                  if (res.code == 200) {
                     this.liftList = res.data
                  }
               },
               systemSwitch() {
                  // 系统开关
@@ -664,22 +654,49 @@
                  })
               },
               getCodeData(){
                  let that = this
                  $.ajax({
                     url:baseUrl +'/console/barcode/output/site',
                     method:'GET',
                     success:function (res) {
                        if(res.code === 200){
                           let data = JSON.parse(res.data)
                           if (data.length <= 5) {
                              that.codeList1 = data;
                           } else {
                              that.codeList1 = data.slice(0, 5);
                              that.codeList2 = data.splice(5, 10);
                           }
                        }
                  this.sendWs(JSON.stringify({
                     "url": "/console/barcode/output/site",
                     "data": {}
                  }))
               },
               setCodeData(res) {
                  if(res.code === 200){
                     let data = JSON.parse(res.data)
                     if (data.length <= 5) {
                        this.codeList1 = data;
                     } else {
                        this.codeList1 = data.slice(0, 5);
                        this.codeList2 = data.splice(5, 10);
                     }
                  })
                  }
               },
               webSocketOnOpen(e) {
                  console.log("open");
               },
               webSocketOnError(e) {
                  console.log(e);
               },
               webSocketOnMessage(e) {
                  const result = JSON.parse(e.data);
                  if (result.url == "/shuttle/table/shuttle/state") {
                     this.setShuttleStateInfo(JSON.parse(result.data))
                  }else if (result.url == "/lift/table/lift/state") {
                     this.setLiftStateInfo(JSON.parse(result.data))
                  }else if (result.url == "/console/latest/data/site") {
                     this.setSiteInfo(JSON.parse(result.data))
                  }else if (result.url == "/console/map/auth") {
                     this.setMap(JSON.parse(result.data))
                  }else if (result.url == "/console/barcode/output/site") {
                     this.setCodeData(JSON.parse(result.data))
                  }
               },
               webSocketClose(e) {
                  console.log("close");
               },
               sendWs(message) {
                  if (this.ws.readyState == WebSocket.OPEN) {
                     this.ws.send(message)
                  }
               }
            }
         })