#

Junjie

6 天以前 a5074b41b5e97e22c912e44350214a838f031831

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

@@ -86,6 +86,7 @@
    let pixiCrnMap = new Map();
    let pixiShelfMap = new Map();
    let pixiTrackMap = new Map();
    let crnList = [];
    let objectsContainer;
    let objectsContainer2;
    let graphicsShelf;
@@ -148,13 +149,9 @@
            that.getMap(this.currentLev)
          }, 1000);

          // this.consoleInterval = setInterval(() => {
          //   this.getMap(this.currentLev) //获取实时地图数据
          //   this.getShuttleStateInfo() //获取四向穿梭车信息
          //   this.getLiftStateInfo() //获取提升机信息
          //   this.getSiteInfo() //获取输送站点数据
          //   // this.getCodeData()//获取条码
          // }, 1000)
          this.consoleInterval = setInterval(() => {
            this.getCrnInfo() //获取堆垛机数据
          }, 1000)

        },
        initLev() {
@@ -226,7 +223,7 @@
          // 从Graphics对象创建一个纹理
          // graphicsShelf = pixiApp.renderer.generateTexture(getContainer('shelf'));
          // graphicsDevp = pixiApp.renderer.generateTexture(getContainer('devp'));
          graphicsCrn = createCrnTexture(25,25);
          // graphicsCrn = createCrnTexture(40,40);
          graphicsCrnTrack = createTrackTexture(25,25);

          // 创建一个容器来管理大批量的显示对象
@@ -351,7 +348,7 @@

          map.forEach((item, index) => {
            for(let idx = 0;idx < item.length;idx++){
              let val = item[idx];
              let val = item[idx]
              let cellWidth = val.cellWidth / 40;
              let cellHeight = val.cellHeight / 8;

@@ -377,12 +374,11 @@
              if(val.colSpan  > 1) {
                for(let i = 1;i < val.colSpan;i++){
                  let nextMerge = map[index][idx + i];
                  if(nextMerge.type != 'merge'){
                    continue;
                  }
                  if (!nextMerge) { continue; }
                  
                  let mergeCellWidth = nextMerge.cellWidth / 40;
                  mergeWidth += mergeCellWidth;
                  nextMerge.isMergedPart = true;
                }
                
                val.width = mergeWidth;
@@ -400,13 +396,31 @@

          map.forEach((row, rowIndex) => {
            let xCursor = 0;
            let anchorX = 0;
            for (let colIndex = 0; colIndex < row.length; colIndex++) {
              let val = row[colIndex];

              let cellWidth = val.width;
              let cellHeight = val.height;

              if (val.isMergedPart) {
                val.posX = anchorX;
                val.posY = yOffsets[rowIndex];
                continue;
              }

              val.posX = xCursor;
              val.posY = yOffsets[rowIndex];
              anchorX = xCursor;

              if (val.colSpan > 1) {
                for (let i = 1; i < val.colSpan; i++) {
                  const next = row[colIndex + i];
                  if (!next) { break; }
                  next.posX = anchorX;
                  next.posY = yOffsets[rowIndex];
                }
              }

              xCursor += cellWidth;
            }
@@ -446,6 +460,41 @@
            }
          });

          crnList.forEach((item) => {
            if(graphicsCrn == null) {
              graphicsCrn = createCrnTexture(item.width * 0.9,item.height * 0.9);
            }
            let sprite = new PIXI.Sprite(graphicsCrn);
            const deviceNo = getDeviceNo(item.value);
            const taskNo = getTaskNo(item.value);
            const style = new PIXI.TextStyle({ fontFamily: 'Arial', fontSize: 12, fill: '#ffffff', stroke: '#000000', strokeThickness: 2 });
            const txt = taskNo > 0 ? (deviceNo + "(" + taskNo + ")") : String(deviceNo);
            const text = new PIXI.Text(txt, style);
            text.anchor.set(0.5);
            text.position.set(sprite.width / 2, sprite.height / 2);
            sprite.addChild(text);
            sprite.textObj = text;
            sprite.zIndex = 1;

            sprite.position.set(item.posX, item.posY);
            sprite.interactive = true; // 必须要设置才能接收事件
            sprite.buttonMode = true; // 让光标在hover时变为手型指针

            let rowIndexForCrn = 0;
            for (let r = 0; r < map.length; r++) {
              if (map[r].length > 0) {
                const rowY = map[r][0].posY;
                if (Math.abs(rowY - item.posY) < 0.5) {
                  rowIndexForCrn = r;
                  break;
                }
              }
            }
            sprite.rowIndex = rowIndexForCrn;

            pixiCrnMap.set(parseInt(deviceNo), sprite);
            objectsContainer2.addChild(sprite);
          })
          

          //视角居中
@@ -692,6 +741,96 @@
            }
          })
        },
        getCrnInfo() {
          let that = this
          //获取堆垛机数据
          $.ajax({
            url: baseUrl + "/console/latest/data/crn",
            headers: {'token': localStorage.getItem('token')},
            method: 'POST',
            success: function (res) {
              if (res.code === 200) {
                var crns = res.data;
                for (var i = 0; i < crns.length; i++) {
                  const id = parseInt(crns[i].crnId);
                  const sprite = pixiCrnMap.get(id);
                  if (!sprite) { continue; }

                  const taskNo = crns[i].taskNo;
                  if (taskNo != null && taskNo > 0) {
                    sprite.textObj.text = id + "(" + taskNo + ")";
                  } else {
                    sprite.textObj.text = String(id);
                  }

                  const status = crns[i].crnStatus;
                  if (status === "machine-auto") {
                    sprite.tint = 0x21BA45;
                  } else if (status === "machine-un-auto") {
                    sprite.tint = 0xBBBBBB;
                  } else if (status === "machine-error") {
                    sprite.tint = 0xDB2828;
                  } else if (status === "machine-p-move") {
                    sprite.tint = 0xF2C037;
                  } else {
                    sprite.tint = 0xFFFFFF;
                  }

                  let bay = parseInt(crns[i].bay, 10);
                  if (isNaN(bay) || bay < 1 || bay === -2) {
                    bay = 1;
                  }

                  let rowIndex = (sprite.rowIndex != null) ? sprite.rowIndex : -1;
                  if (rowIndex === -1) {
                    for (let r = 0; r < that.map.length; r++) {
                      if (that.map[r].length > 0) {
                        const rowY = that.map[r][0].posY;
                        if (Math.abs(rowY - sprite.y) < 0.5) {
                          rowIndex = r;
                          break;
                        }
                      }
                    }
                    if (rowIndex === -1) { rowIndex = 0; }
                  }

                  let targetCell = null;
                  let crnCount = 0;
                  for (let c = 0; c < that.map[rowIndex].length; c++) {
                    const cell = that.map[rowIndex][c];
                    if (cell && cell.type === 'crn') {
                      crnCount++;
                      if (crnCount === bay) {
                        targetCell = cell;
                        break;
                      }
                    }
                  }
                  if (!targetCell) {
                    for (let c = that.map[rowIndex].length - 1; c >= 0; c--) {
                      const cell = that.map[rowIndex][c];
                      if (cell && cell.type === 'crn') {
                        targetCell = cell;
                        break;
                      }
                    }
                  }
                  if (!targetCell) { continue; }

                  const targetX = targetCell.posX + (targetCell.width - sprite.width) / 2;

                  gsap.killTweensOf(sprite);
                  gsap.to(sprite, { x: targetX, duration: 0.5, ease: "power1.inOut" });
                }
              } else if (res.code === 403) {
                parent.location.href = baseUrl + "/login";
              } else {
                console.log(res.msg);
              }
            }
          });
        },
      }
    })

@@ -834,22 +973,11 @@
          pixiStaMap.set(parseInt(siteId), sprite);
        }
      } else if (item.type == 'crn') {
        if (getDeviceNo(value) == -1) {
          sprite = createTrackSprite(item.width, item.height);
          sprite.zIndex = 0;
        } else {
          sprite = new PIXI.Sprite(graphicsCrn);
          const deviceNo = getDeviceNo(value);
          const taskNo = getTaskNo(value);
          const style = new PIXI.TextStyle({ fontFamily: 'Arial', fontSize: 12, fill: '#ffffff', stroke: '#000000', strokeThickness: 2 });
          const txt = taskNo > 0 ? (deviceNo + "(" + taskNo + ")") : String(deviceNo);
          const text = new PIXI.Text(txt, style);
          text.anchor.set(0.5);
          text.position.set(sprite.width / 2, sprite.height / 2);
          sprite.addChild(text);
          sprite.textObj = text;
          pixiCrnMap.set(parseInt(deviceNo), sprite);
          sprite.zIndex = 1;
        sprite = createTrackSprite(item.width, item.height);
        sprite.zIndex = 0;

        if(getDeviceNo(value) > 0){
          crnList.push(item);
        }
      } else {
        return null;