#

Junjie

3 天以前 08cd84454ec525569c606e81a643fa8dc5759a35

#

 src/main/webapp/components/MapCanvas.js

@@ -14,6 +14,10 @@
      currentLev: 1,
      mapFps: 0,
      ws: null,
      wsReconnectTimer: null,
      wsReconnectAttempts: 0,
      wsReconnectBaseDelay: 1000,
      wsReconnectMaxDelay: 15000,
      pixiApp: null,
      pixiStageList: [],
      pixiStaMap: new Map(),
@@ -46,11 +50,7 @@
    mounted() {
    this.currentLev = this.lev || 1;
    this.createMap();
    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.connectWs();
    
    setTimeout(() => {
      this.getMap(this.currentLev);
@@ -67,6 +67,8 @@
    if (this.timer) { clearInterval(this.timer); }
    if (this.pixiApp) { this.pixiApp.destroy(true, { children: true }); }
    window.removeEventListener('resize', this.resizeToContainer);
    if (this.wsReconnectTimer) { clearTimeout(this.wsReconnectTimer); this.wsReconnectTimer = null; }
    if (this.ws && (this.ws.readyState === WebSocket.OPEN || this.ws.readyState === WebSocket.CONNECTING)) { try { this.ws.close(); } catch (e) {} }
  },
  watch: {
    lev(newLev) {
@@ -221,9 +223,25 @@
      this.getMap();
    },
    createMapData(map) {
      this.pixiStageList = [map.length];
      this.pixiStaMap = new Map();
      if (window.gsap) {
        this.pixiStaMap && this.pixiStaMap.forEach((s) => { try { window.gsap.killTweensOf(s); } catch (e) {} });
        this.pixiCrnMap && this.pixiCrnMap.forEach((s) => { try { window.gsap.killTweensOf(s); } catch (e) {} });
        this.pixiDualCrnMap && this.pixiDualCrnMap.forEach((s) => { try { window.gsap.killTweensOf(s); } catch (e) {} });
        this.pixiRgvMap && this.pixiRgvMap.forEach((s) => { try { window.gsap.killTweensOf(s); } catch (e) {} });
      }
      this.objectsContainer.removeChildren();
      this.objectsContainer2.removeChildren();
      if (this.tracksContainer) { this.tracksContainer.removeChildren(); }
      if (this.shelvesContainer) { this.shelvesContainer.removeChildren(); }
      this.crnList = [];
      this.dualCrnList = [];
      this.rgvList = [];
      this.pixiCrnMap = new Map();
      this.pixiDualCrnMap = new Map();
      this.pixiRgvMap = new Map();
      this.pixiStaMap = new Map();
      this.pixiStageList = [];
      this.pixiStageList = [map.length];
      const bayHeightList = this.initHeight(map);
      const bayWidthList = this.initWidth(map);
      map.forEach((item, index) => {
@@ -692,8 +710,12 @@
      this.createMapData(JSON.parse(res.data));
    },
    webSocketOnOpen(e) {
      if (this.wsReconnectTimer) { clearTimeout(this.wsReconnectTimer); this.wsReconnectTimer = null; }
      this.wsReconnectAttempts = 0;
      this.getMap(this.currentLev);
    },
    webSocketOnError(e) {
      this.scheduleReconnect();
    },
    webSocketOnMessage(e) {
      const result = JSON.parse(e.data);
@@ -710,12 +732,32 @@
      }
    },
    webSocketClose(e) {
      this.scheduleReconnect();
    },
    sendWs(message) {
      if (this.ws && this.ws.readyState === WebSocket.OPEN) {
        this.ws.send(message);
      }
    },
    connectWs() {
      if (this.ws && (this.ws.readyState === WebSocket.OPEN || this.ws.readyState === WebSocket.CONNECTING)) { return; }
      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;
    },
    scheduleReconnect() {
      if (this.wsReconnectTimer) { return; }
      const attempt = this.wsReconnectAttempts + 1;
      const jitter = Math.floor(Math.random() * 300);
      const delay = Math.min(this.wsReconnectMaxDelay, this.wsReconnectBaseDelay * Math.pow(2, this.wsReconnectAttempts)) + jitter;
      this.wsReconnectTimer = setTimeout(() => {
        this.wsReconnectTimer = null;
        this.wsReconnectAttempts = attempt;
        this.connectWs();
      }, delay);
    },
    createShelfSprite(width, height) {
      let idx = width + "-" + height;
      let texture = this.pixiShelfMap.get(idx);

 src/main/webapp/views/watch/console.html

@@ -82,12 +82,20 @@
                    rgvParam: {
                        rgvNo: 0
                    },
                    locMastData: []//库位数据
                    locMastData: [],//库位数据
                    wsReconnectTimer: null,
                    wsReconnectAttempts: 0,
                    wsReconnectBaseDelay: 1000,
                    wsReconnectMaxDelay: 15000
                },
                created() {
                    this.init()
                },
                mounted() {
                },
                beforeDestroy() {
                    if (this.wsReconnectTimer) { clearTimeout(this.wsReconnectTimer); this.wsReconnectTimer = null; }
                    if (ws && (ws.readyState === WebSocket.OPEN || ws.readyState === WebSocket.CONNECTING)) { try { ws.close(); } catch (e) {} }
                },
                watch: {

@@ -100,12 +108,17 @@
                    },
                    webSocketOnOpen() {
                        console.log("WebSocket连接成功");
                        if (this.wsReconnectTimer) { clearTimeout(this.wsReconnectTimer); this.wsReconnectTimer = null; }
                        this.wsReconnectAttempts = 0;
                        this.getMap();
                    },
                    webSocketOnError() {
                        console.log("WebSocket连接发生错误");
                        this.scheduleWsReconnect();
                    },
                    webSocketClose() {
                        console.log("WebSocket连接关闭");
                        this.scheduleWsReconnect();
                    },
                    webSocketOnMessage(e) {
                        const result = JSON.parse(e.data);
@@ -140,15 +153,30 @@
                        }))
                    },
                    init() {
                        this.connectWs();

                        this.getSystemRunningStatus() //获取系统运行状态
                        this.getLevList() //获取地图层级列表
                        this.getLocMastData() //获取库位数据
                    },
                    connectWs() {
                        if (ws && (ws.readyState === WebSocket.OPEN || ws.readyState === WebSocket.CONNECTING)) { return; }
                        ws = new WebSocket("ws://" + window.location.host + baseUrl + "/console/websocket");
                        ws.onopen = this.webSocketOnOpen;
                        ws.onerror = this.webSocketOnError;
                        ws.onmessage = this.webSocketOnMessage;
                        ws.onclose = this.webSocketClose;

                        this.getSystemRunningStatus() //获取系统运行状态
                        this.getLevList() //获取地图层级列表
                        this.getLocMastData() //获取库位数据
                    },
                    scheduleWsReconnect() {
                        if (this.wsReconnectTimer) { return; }
                        const attempt = this.wsReconnectAttempts + 1;
                        const jitter = Math.floor(Math.random() * 300);
                        const delay = Math.min(this.wsReconnectMaxDelay, this.wsReconnectBaseDelay * Math.pow(2, this.wsReconnectAttempts)) + jitter;
                        this.wsReconnectTimer = setTimeout(() => {
                            this.wsReconnectTimer = null;
                            this.wsReconnectAttempts = attempt;
                            this.connectWs();
                        }, delay);
                    },
                    getLevList() {
                        let that = this;