zy-wcs.git - Gitblit

	src/main/java/com/zy/asrs/controller/ConsoleController.java	1 ●●●●● 补丁 \| 查看 \| 原始文档 \| blame \| 历史
	src/main/java/com/zy/asrs/domain/vo/RgvLatestDataVo.java	2 ●●●●● 补丁 \| 查看 \| 原始文档 \| blame \| 历史
	src/main/webapp/views/watch/console2.html	1979 ●●●●● 补丁 \| 查看 \| 原始文档 \| blame \| 历史
 src/main/java/com/zy/asrs/controller/ConsoleController.java

@@ -221,6 +221,7 @@
            }
            RgvLatestDataVo vo = new RgvLatestDataVo();
            vo.setRgvNo(rgvProtocol.getRgvNo());
            vo.setTaskNo(rgvProtocol.getTaskNo());
            vo.setTrackSiteNo(String.valueOf(rgvProtocol.getRgvPos()));
            vo.setRgvStatus(RgvStatusType.get(rgvProtocol.getStatus()));
            vos.add(vo);

 src/main/java/com/zy/asrs/domain/vo/RgvLatestDataVo.java

@@ -8,6 +8,8 @@

    private Integer rgvNo;

    private Integer taskNo;

    private String trackSiteNo;

    private RgvStatusType rgvStatus;

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

@@ -1,5 +1,6 @@
<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <title>库位地图</title>
@@ -16,933 +17,1205 @@
  <script src="../../static/js/gsap.min.js"></script>
  <script src="../../static/js/pixi-legacy.min.js"></script>
  <style>
    *{
    * {
      margin: 0;
      padding: 0;
    }
  </style>
</head>

<body>
<div id="app">
  <div id="pixiView">
  <div id="app">
    <div id="pixiView">

    </div>

    <!--输出操作和FPS-->
    <div style="position: absolute;top: 20px;right: 50px;">
      <div>FPS:{{mapFps}}</div>
      <el-button @click="drawer = true">操作</el-button>
    </div>

    <el-drawer title="操作区域" :visible.sync="drawer" :with-header="true" :modal="false">
      <div class="floorBtnBox" v-for="(lev,idx) in floorList">
        <el-button :style="{background:currentLev === lev ? '#7DCDFF':''}"
          @click="changeFloor(lev)">{{lev}}F</el-button>
      </div>
    </el-drawer>

    <el-drawer title="库位详情" :visible.sync="drawerLocNo" :with-header="true" :modal="false">
      <div v-if="drawerLocNoData!=null">
        <div style="margin: 10px;">
          <div style="margin-top: 5px;">排：{{drawerLocNoData.row}}</div>
          <div style="margin-top: 5px;">列：{{drawerLocNoData.bay}}</div>
          <div style="margin-top: 5px;">层：{{drawerLocNoData.lev}}</div>
          <div style="margin-top: 5px;">库位号：{{drawerLocNoData.locNo}}</div>
          <div style="margin-top: 5px;">库位状态：{{drawerLocNoData.locSts}}</div>
        </div>
      </div>
    </el-drawer>

    <el-drawer title="站点信息" :visible.sync="drawerSta" :with-header="true" :modal="false">
      <div v-if="drawerStaData!=null">
        <div style="margin: 10px;">
          <div style="margin-top: 5px;">站点：{{drawerStaData.siteId}}</div>
          <div style="margin-top: 5px;">工作号：{{drawerStaData.workNo}}</div>
          <div style="margin-top: 5px;">工作状态：{{drawerStaData.wrkSts}}</div>
          <div style="margin-top: 5px;">工作类型：{{drawerStaData.ioType}}</div>
          <div style="margin-top: 5px;">源站：{{drawerStaData.sourceStaNo}}</div>
          <div style="margin-top: 5px;">目标站：{{drawerStaData.staNo}}</div>
          <div style="margin-top: 5px;">源库位：{{drawerStaData.sourceLocNo}}</div>
          <div style="margin-top: 5px;">目标库位：{{drawerStaData.locNo}}</div>
          <div style="margin-top: 5px;">自动：{{drawerStaData.autoing}}</div>
          <div style="margin-top: 5px;">有物：{{drawerStaData.loading}}</div>
          <div style="margin-top: 5px;">能入：{{drawerStaData.canining}}</div>
          <div style="margin-top: 5px;">能出：{{drawerStaData.canouting}}</div>
          <div style="margin-top: 5px;">能出：{{drawerStaData.canouting}}</div>
        </div>
      </div>
    </el-drawer>

  </div>
  <script>
    let pixiApp;
    let pixiStageList = [];
    let pixiShuttleMap = new Map();
    let pixiShuttleMoveAdvancePathMap = new Map();
    let pixiShuttleMoveAdvancePathList = [];
    let pixiStaMap = new Map();
    let pixiCrnMap = new Map();
    let pixiRgvMap = new Map();
    let pixiShelfMap = new Map();
    let pixiTrackMap = new Map();
    let pixiDevpTextureMap = new Map();
    let crnList = [];
    let rgvList = [];
    let objectsContainer;
    let objectsContainer2;
    let graphicsCrn;
    let graphicsCrnTrack;
    let graphicsRgvTrack;
    let graphicsRgv;
    let ws;

  <!--输出操作和FPS-->
  <div style="position: absolute;top: 20px;right: 50px;">
    <div>FPS:{{mapFps}}</div>
    <el-button @click="drawer = true">操作</el-button>
  </div>

  <el-drawer
          title="操作区域"
          :visible.sync="drawer"
          :with-header="true"
          :modal="false"
  >
    <div class="floorBtnBox" v-for="(lev,idx) in floorList">
      <el-button :style="{background:currentLev === lev ? '#7DCDFF':''}" @click="changeFloor(lev)">{{lev}}F</el-button>
    </div>
  </el-drawer>

  <el-drawer
          title="库位详情"
          :visible.sync="drawerLocNo"
          :with-header="true"
          :modal="false"
  >
    <div v-if="drawerLocNoData!=null">
      <div style="margin: 10px;">
        <div style="margin-top: 5px;">排：{{drawerLocNoData.row}}</div>
        <div style="margin-top: 5px;">列：{{drawerLocNoData.bay}}</div>
        <div style="margin-top: 5px;">层：{{drawerLocNoData.lev}}</div>
        <div style="margin-top: 5px;">库位号：{{drawerLocNoData.locNo}}</div>
        <div style="margin-top: 5px;">库位状态：{{drawerLocNoData.locSts}}</div>
      </div>
    </div>
  </el-drawer>

  <el-drawer
          title="小车信息"
          :visible.sync="drawerShuttle"
          :with-header="true"
          :modal="false"
  >
    <div v-if="drawerShuttleData!=null">
      <div style="margin: 10px;">
        <div style="margin-top: 5px;">小车：{{drawerShuttleData.shuttleNo}}</div>
        <div style="margin-top: 5px;">工作号：{{drawerShuttleData.wrkNo}}</div>
        <div style="margin-top: 5px;">状态：{{drawerShuttleData}}</div>
      </div>
    </div>
  </el-drawer>

  <el-drawer
          title="站点信息"
          :visible.sync="drawerSta"
          :with-header="true"
          :modal="false"
  >
    <div v-if="drawerStaData!=null">
      <div style="margin: 10px;">
        <div style="margin-top: 5px;">站点：{{drawerStaData.siteId}}</div>
        <div style="margin-top: 5px;">工作号：{{drawerStaData.workNo}}</div>
        <div style="margin-top: 5px;">工作状态：{{drawerStaData.wrkSts}}</div>
        <div style="margin-top: 5px;">工作类型：{{drawerStaData.ioType}}</div>
        <div style="margin-top: 5px;">源站：{{drawerStaData.sourceStaNo}}</div>
        <div style="margin-top: 5px;">目标站：{{drawerStaData.staNo}}</div>
        <div style="margin-top: 5px;">源库位：{{drawerStaData.sourceLocNo}}</div>
        <div style="margin-top: 5px;">目标库位：{{drawerStaData.locNo}}</div>
        <div style="margin-top: 5px;">自动：{{drawerStaData.autoing}}</div>
        <div style="margin-top: 5px;">有物：{{drawerStaData.loading}}</div>
        <div style="margin-top: 5px;">能入：{{drawerStaData.canining}}</div>
        <div style="margin-top: 5px;">能出：{{drawerStaData.canouting}}</div>
        <div style="margin-top: 5px;">能出：{{drawerStaData.canouting}}</div>
      </div>
    </div>
  </el-drawer>

  <el-drawer
          title="提升机信息"
          :visible.sync="drawerLift"
          :with-header="true"
          :modal="false"
  >
    <div v-if="drawerLiftData!=null">
      <div style="margin: 10px;">
        <div style="margin-top: 5px;">提升机：{{liftList[drawerLiftData-1].liftNo}}</div>
        <div style="margin-top: 5px;">工作号：{{liftList[drawerLiftData-1].taskNo}}</div>
        <div style="margin-top: 5px;">状态：{{liftList[drawerLiftData-1]}}</div>
      </div>
    </div>
  </el-drawer>

</div>
<script>
  let width = 25;
  let height = 25;
  let pixiApp;
  let pixiStageList = [];
  let pixiShuttleMap = new Map();
  let pixiShuttleMoveAdvancePathMap = new Map();
  let pixiShuttleMoveAdvancePathList = [];
  let pixiShuttleLockPathMap = new Map();
  let pixiStaMap = new Map();
  let objectsContainer;
  let objectsContainer2;
  let objectsContainer3;
  let graphics0;
  let graphics3;
  let graphics4;
  let graphics5;
  let graphics9;
  let graphics67;
  let graphicsLock;
  let ws;

  var app = new Vue({
    el: '#app',
    data: {
      map: [],
      currentLev: 1,
      floorList: [], //当前项目楼层
      currentLevShuttleList: [],//当前楼层四向穿梭车集合
      shuttleColorList: [],//四向穿梭车颜色集合
      drawer: false,
      drawerLocNo: false,
      drawerLocNoData: null,
      drawerLocDetls: [],
      reloadMap: true,
      mapFps: 0,
      drawerShuttle: false,
      drawerShuttleData: null,
      currentLevStaList: [],//当前楼层站点list
      reloadSta: true,
      drawerSta: false,
      drawerStaData: null,
      drawerLift: false,
      drawerLiftData: null,
      liftList: [],
    },
    mounted() {
      this.init()
      this.createMap()
    },
    watch: {
      map: {
        deep: true,
        handler(val) {

        }
    var app = new Vue({
      el: '#app',
      data: {
        map: [],
        currentLev: 1,
        floorList: [], //当前项目楼层
        drawer: false,
        drawerLocNo: false,
        drawerLocNoData: null,
        drawerLocDetls: [],
        mapFps: 0,
        currentLevStaList: [],//当前楼层站点list
        drawerSta: false,
        drawerStaData: null,
      },
      drawerLocNo: {
        deep: true,
        handler(val) {
          if (!val) {
            var sprite = pixiStageList[this.drawerLocNoData.x][this.drawerLocNoData.y];
            updateColor(sprite, 0xFFFFFF);//恢复颜色
      mounted() {
        this.init()
        this.createMap()
      },
      watch: {
        map: {
          deep: true,
          handler(val) {

          }
        }
      }
    },
    methods: {
      init(){
        let that = this
        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.initLev()//初始化楼层信息
        setTimeout(() => {
          that.getMap(this.currentLev)
        }, 1000);

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

      },
      initLev(){
        let that = this
        $.ajax({
          url: baseUrl + "/console/map/lev/list",
          headers: {
            'token': localStorage.getItem('token')
          },
          data: {},
          method: 'get',
          success: function(res) {
            if (res.code === 200) {
              that.floorList = res.data;
            } else if (res.code === 403) {
              parent.location.href = baseUrl + "/login";
            } else {
              that.$message({
                message: res.msg,
                type: 'error'
              });
        },
        drawerLocNo: {
          deep: true,
          handler(val) {
            if (!val) {
              var sprite = pixiStageList[this.drawerLocNoData.x][this.drawerLocNoData.y];
              updateColor(sprite, 0xFFFFFF);//恢复颜色
            }
          }
        });
        }
      },
      //获取地图数据
      getMap(lev) {
        let that = this;
      methods: {
        init() {
          let that = this
          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.initLev()//初始化楼层信息
          setTimeout(() => {
            that.getMap(this.currentLev)
          }, 1000);

          this.consoleInterval = setInterval(() => {
            this.getCrnInfo() //获取堆垛机数据
            this.getSiteInfo() //获取输送站点数据
            this.getRgvInfo() //获取Rgv数据
          }, 1000)

        },
        initLev() {
          let that = this
          $.ajax({
              url: baseUrl + "/console/map/" + lev + "/auth",
              headers: {
                  'token': localStorage.getItem('token')
              },
              data: {},
              method: 'get',
              success: function(res) {
                //获取地图数据
                let data = res.data
                that.createMapData(data)
            url: baseUrl + "/console/map/lev/list",
            headers: {
              'token': localStorage.getItem('token')
            },
            data: {},
            method: 'get',
            success: function (res) {
              if (res.code === 200) {
                that.floorList = res.data;
              } else if (res.code === 403) {
                parent.location.href = baseUrl + "/login";
              } else {
                that.$message({
                  message: res.msg,
                  type: 'error'
                });
              }
            }
          });
        },
        //获取地图数据
        getMap(lev) {
          let that = this;
          $.ajax({
            url: baseUrl + "/basMap/lev/" + this.currentLev + "/auth",
            headers: {
              'token': localStorage.getItem('token')
            },
            data: {},
            method: 'get',
            success: function (res) {
              //获取地图数据
              let data = res.data
              let mapData = JSON.parse(data)
              that.createMapData(mapData)
            }
          })
      },
      changeFloor(lev) {
        this.currentLev = lev
        this.currentLevShuttleList = []
        this.reloadMap = true
        this.reloadSta = true
        this.getMap(lev)
        },
        changeFloor(lev) {
          this.currentLev = lev
          this.currentLevShuttleList = []
          this.getMap(lev)

        //清空占用路径
        objectsContainer3.removeChildren();
        pixiShuttleLockPathMap = new Map();
          //清空预计路径
          objectsContainer2.removeChildren();
          pixiShuttleMoveAdvancePathMap = new Map();
          pixiShuttleMoveAdvancePathList = []
        },
        createMap() {
          //Create a Pixi Application
          pixiApp = new PIXI.Application({
            // width: 1500,
            // height: 800,
            backgroundColor: 0xF5F7F9FF,
            resizeTo: window
          });
          //Add the canvas that Pixi automatically created for you to the HTML document
          $("#pixiView").append(pixiApp.view)

        //清空预计路径
        objectsContainer2.removeChildren();
        pixiShuttleMoveAdvancePathMap = new Map();
        pixiShuttleMoveAdvancePathList = []
      },
      createMap(){
        //Create a Pixi Application
        pixiApp = new PIXI.Application({
          // width: 1500,
          // height: 800,
          backgroundColor: 0xF5F7F9FF,
          resizeTo: window
        });
        //Add the canvas that Pixi automatically created for you to the HTML document
        $("#pixiView").append(pixiApp.view)
          //加载小车资源
          pixiApp.loader.add('shuttle', '../static/images/sxcar.png');

        //加载小车资源
        pixiApp.loader.add('shuttle', '../static/images/sxcar.png');
          // 从Graphics对象创建一个纹理
          graphicsCrnTrack = createTrackTexture(25,25);
          graphicsRgvTrack = createTrackTexture(25,25);

        // 从Graphics对象创建一个纹理
            graphicsF = pixiApp.renderer.generateTexture(getContainer(1000));
        graphics0 = pixiApp.renderer.generateTexture(getContainer(0));
        graphics3 = pixiApp.renderer.generateTexture(getContainer(3));
        graphics4 = pixiApp.renderer.generateTexture(getContainer(4));
        graphics5 = pixiApp.renderer.generateTexture(getContainer(5));
        graphics9 = pixiApp.renderer.generateTexture(getContainer(9));
        graphics67 = pixiApp.renderer.generateTexture(getContainer(67));
        graphicsLock = pixiApp.renderer.generateTexture(getContainer(-999));
          // 创建一个容器来管理大批量的显示对象
          objectsContainer = new PIXI.Container();
          pixiApp.stage.addChild(objectsContainer);

        // 创建一个容器来管理大批量的显示对象
        objectsContainer = new PIXI.Container();
        pixiApp.stage.addChild(objectsContainer);
          // 创建一个容器来管理大批量的显示对象
          objectsContainer2 = new PIXI.Container();
          pixiApp.stage.addChild(objectsContainer2);

        // 创建一个容器来管理大批量的显示对象
        objectsContainer2 = new PIXI.Container();
        pixiApp.stage.addChild(objectsContainer2);
          pixiApp.stage.sortableChildren = true;
          objectsContainer.sortableChildren = true;
          objectsContainer2.sortableChildren = true;
          objectsContainer.zIndex = 10;
          objectsContainer2.zIndex = 20;

        // 创建一个容器来管理大批量的显示对象
        objectsContainer3 = new PIXI.Container();
        pixiApp.stage.addChild(objectsContainer3);

        //*******************拖动画布*******************
        let stageOriginalPos;
        let mouseDownPoint;
        let touchBlank = false;
        pixiApp.renderer.plugins.interaction.on(
                'pointerdown',
                (event) => {
                  const globalPos = event.data.global;
                  // 记录下stage原来的位置
                  stageOriginalPos = [pixiApp.stage.position._x, pixiApp.stage.position._y];
                  // 记录下mouse down的位置
                  mouseDownPoint = [globalPos.x, globalPos.y];
                  if (!event.target) {
                    // 点到了画布的空白位置
                    touchBlank = true;
                  }
                }
        );

        pixiApp.renderer.plugins.interaction.on(
                'pointermove',
                (event) => {
                  const globalPos = event.data.global;

                  if (touchBlank) {
                    // 拖拽画布
                    const dx = globalPos.x - mouseDownPoint[0];
                    const dy = globalPos.y - mouseDownPoint[1];
                    pixiApp.stage.position.set(
                            stageOriginalPos[0] + dx,
                            stageOriginalPos[1] + dy
                    );
                  }
                }
        );

        pixiApp.renderer.plugins.interaction.on(
                'pointerup',
                (event) => {
                  touchBlank = false;
                }
        );
        //*******************拖动画布*******************

        //*******************缩放画布*******************
        pixiApp.view.addEventListener('wheel', (event) => {
          event.stopPropagation();
          event.preventDefault();
          // 因为画布是充满视窗的，所以clientX等于mouse point在renderer上的x坐标
          const globalPos = [event.clientX, event.clientY];
          const delta = event.deltaY;
          const oldZoom = pixiApp.stage.scale.x;
          let newZoom = oldZoom * 0.999 ** delta;

          // const oldStageMatrix = app.stage.localTransform.clone();
          // const oldStagePos = oldStageMatrix.applyInverse(pointerGlobalPos);
          const oldStagePos = globalPos;
          const dx = oldStagePos[0] * oldZoom - oldStagePos[0] * newZoom;
          const dy = oldStagePos[1] * oldZoom - oldStagePos[1] * newZoom;

          pixiApp.stage.setTransform(
                  pixiApp.stage.position.x + dx,
                  pixiApp.stage.position.y + dy,
                  newZoom,
                  newZoom,
                  0,
                  0,
                  0,
                  0,
                  0
          //*******************拖动画布*******************
          let stageOriginalPos;
          let mouseDownPoint;
          let touchBlank = false;
          pixiApp.renderer.plugins.interaction.on(
            'pointerdown',
            (event) => {
              const globalPos = event.data.global;
              // 记录下stage原来的位置
              stageOriginalPos = [pixiApp.stage.position._x, pixiApp.stage.position._y];
              // 记录下mouse down的位置
              mouseDownPoint = [globalPos.x, globalPos.y];
              if (!event.target) {
                // 点到了画布的空白位置
                touchBlank = true;
              }
            }
          );

        });
        //*******************缩放画布*******************
          pixiApp.renderer.plugins.interaction.on(
            'pointermove',
            (event) => {
              const globalPos = event.data.global;

        //*******************FPS*******************
        var g_Time=0;
        pixiApp.ticker.add((delta) => {
          var timeNow = (new Date()).getTime();
          var timeDiff = timeNow - g_Time;
          g_Time = timeNow;
          var fps = 1000 / timeDiff;
          this.mapFps = parseInt(fps)
        });
        //*******************FPS*******************
              if (touchBlank) {
                // 拖拽画布
                const dx = globalPos.x - mouseDownPoint[0];
                const dy = globalPos.y - mouseDownPoint[1];
                pixiApp.stage.position.set(
                  stageOriginalPos[0] + dx,
                  stageOriginalPos[1] + dy
                );
              }
            }
          );

      },
      createMapData(map) {
        if (this.reloadMap) {
          this.reloadMap = false
          pixiApp.renderer.plugins.interaction.on(
            'pointerup',
            (event) => {
              touchBlank = false;
            }
          );
          //*******************拖动画布*******************

          //*******************缩放画布*******************
          pixiApp.view.addEventListener('wheel', (event) => {
            event.stopPropagation();
            event.preventDefault();
            const sx = event.clientX;
            const sy = event.clientY;
            const oldZoom = pixiApp.stage.scale.x;
            const delta = event.deltaY;
            let newZoom = oldZoom * 0.999 ** delta;
            const worldX = (sx - pixiApp.stage.position.x) / oldZoom;
            const worldY = (sy - pixiApp.stage.position.y) / oldZoom;
            const newPosX = sx - worldX * newZoom;
            const newPosY = sy - worldY * newZoom;
            pixiApp.stage.setTransform(newPosX, newPosY, newZoom, newZoom, 0, 0, 0, 0, 0);

          });
          //*******************缩放画布*******************

          //*******************FPS*******************
          var g_Time = 0;
          pixiApp.ticker.add((delta) => {
            var timeNow = (new Date()).getTime();
            var timeDiff = timeNow - g_Time;
            g_Time = timeNow;
            var fps = 1000 / timeDiff;
            this.mapFps = parseInt(fps)
          });
          //*******************FPS*******************

        },
        createMapData(map) {
          pixiStageList = [map.length]//初始化列表
          pixiStaMap = new Map();//重置
          objectsContainer.removeChildren()
          map.forEach((item,index) => {
            pixiStageList[index] = [item.length]
            for (let idx = 0; idx < item.length; idx++) {

          let bayHeightList = this.initHeight(map);
          let bayWidthList = this.initWidth(map)
          map.forEach((item, index) => {
            for(let idx = 0;idx < item.length;idx++){
              let val = item[idx];
              if(val.cellHeight == undefined || val.cellHeight === ''){
                val.cellHeight = bayHeightList[index];
              }
              if(val.cellWidth == undefined || val.cellWidth === ''){
                val.cellWidth = bayWidthList[idx];
              }
            }
          })

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

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

              let mergeHeight = cellHeight;
              if(val.rowSpan  > 1) {
                for(let i = 1;i < val.rowSpan;i++){
                  let nextMerge = map[index + i][idx];
                  if(nextMerge.type != 'merge'){
                    continue;
                  }
                  
                  let mergeCellHeight = nextMerge.cellHeight / 8;
                  mergeHeight += mergeCellHeight;
                }
                
                val.height = mergeHeight;
              }

              let mergeWidth = cellWidth;
              if(val.colSpan  > 1) {
                for(let i = 1;i < val.colSpan;i++){
                  let nextMerge = map[index][idx + i];
                  if (!nextMerge) { continue; }
                  
                  let mergeCellWidth = nextMerge.cellWidth / 40;
                  mergeWidth += mergeCellWidth;
                  nextMerge.isMergedPart = true;
                }
                
                val.width = mergeWidth;
              }
            }
          })

          const rowHeightScaled = bayHeightList.map(h => (h != null && h !== -1) ? (h / 8) : (height));
          let yOffsets = [];
          let yCursor = 0;
          for (let r = 0; r < map.length; r++) {
            yOffsets[r] = yCursor;
            yCursor += (rowHeightScaled[r] || 0);
          }

          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;
              }

              let sprite = getSprite(val.value, idx * width, index * height, val, (e) => {
                if (val.value == 4) {
                  //站点
                  this.openDrawerSta(val)
                } else if (val.value == 67) {
                  //提升机
                  this.openDrawerLift(val)
                } else {
                  //库位
                  this.rightEvent(index, idx, e);
                  updateColor(sprite, 0x9900ff);
              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;
            }
          })

          map.forEach((item, index) => {
            pixiStageList[index] = [item.length]
            for (let idx = 0; idx < item.length; idx++) {
              let val = item[idx]

              // 跳过合并单元格的占位符
              if (val.type === 'merge') {
                continue;
              }

              if (val.type == undefined || val.type === 'none') {
                continue;
              }

              let sprite = getSprite(val, (e) => {
                // if (val.value == 4) {
                //   //站点
                //   this.openDrawerSta(val)
                // } else {
                //   //库位
                //   this.rightEvent(index, idx, e);
                //   updateColor(sprite, 0x9900ff);
                // }
              });

              if (val.value == 4) {
                // 创建文本对象
                const style = new PIXI.TextStyle({
                  fontFamily: 'Arial',
                  fontSize: 10,
                  fill: '#000000',
                });
                const text = new PIXI.Text(val.data, style);
                text.anchor.set(0.5); // 设置文本锚点为中心点
                text.position.set(sprite.width / 2, sprite.height / 2); // 将文本位置设置为Graphics对象的中心点
                // 将文本对象添加到Graphics对象中
                sprite.addChild(text);
                sprite.textObj = text;
                pixiStaMap.set(parseInt(val.data), sprite);//站点数据添加到map中
              }else if (val.value == 67) {
                // 创建提升机文本对象
                const style = new PIXI.TextStyle({
                  fontFamily: 'Arial',
                  fontSize: 10,
                  fill: '#000000',
                });
                const text = new PIXI.Text(val.data, style);
                text.anchor.set(0.5); // 设置文本锚点为中心点
                text.position.set(sprite.width / 2, sprite.height / 2); // 将文本位置设置为Graphics对象的中心点
                // 将文本对象添加到Graphics对象中
                sprite.addChild(text);
                sprite.textObj = text;
                pixiStaMap.set(parseInt(val.data), sprite);//站点数据添加到map中
              if (sprite == null) {
                continue;
              }

              if (val.value == -999) {
                pixiShuttleLockPathMap.set(val.locNo, sprite);
                objectsContainer3.addChild(sprite);
              }else {
                objectsContainer.addChild(sprite);
              }
              objectsContainer.addChild(sprite);
              pixiStageList[index][idx] = sprite
            }
          });

          //视角居中
          let containerWidth = (pixiApp.view.width - objectsContainer.width) / 2;
          let containerHeight = (pixiApp.view.height - objectsContainer.height) / 2;
          pixiApp.stage.position.set(containerWidth, containerHeight);
        }else {
          let diff = this.findDiffList(this.map, map);
          diff.forEach((item, index) => {
            //获取old元素
            let oldSprite = pixiStageList[item.x][item.y]
            if (item.originData == -999) {
              //移除old路径元素
              objectsContainer3.removeChild(oldSprite);
            }else {
              //移除old元素
              objectsContainer.removeChild(oldSprite);
          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;

            let sprite = getSprite(item.data, item.y * width, item.x * height, item, (e) => {
              this.rightEvent(item.x, item.y, e);
              updateColor(sprite, 0x9900ff);
            });
            sprite.position.set(item.posX, item.posY);
            sprite.interactive = true; // 必须要设置才能接收事件
            sprite.buttonMode = true; // 让光标在hover时变为手型指针

            if (item.data == -999) {
              //添加路径元素
              objectsContainer3.addChild(sprite);
            }else {
              //添加元素
              objectsContainer.addChild(sprite);
            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;

            //保存新元素
            pixiStageList[item.x][item.y] = sprite
          });
        }

        this.map = map;
      },
      rightEvent(x, y, e) {
        this.drawerLocNo = true
        this.drawerLocNoData =  {x:x, y: y, z: this.currentLev, locNo: this.map[x][y].locNo,
            locSts: this.map[x][y].locSts,row:this.map[x][y].row, bay: this.map[x][y].bay, lev: this.currentLev};
      },
      findDiffList(arr1, arr2) {
        let diff = []
        arr1.forEach((item,index) => {
          item.forEach((val,idx) => {
            if(val.value != arr2[index][idx].value){
              diff.push({
                x: index,
                y: idx,
                data: arr2[index][idx].value,
                originData: val.value,
                locSts: val.locSts
              })
            }
            pixiCrnMap.set(parseInt(deviceNo), sprite);
            objectsContainer2.addChild(sprite);
          })
        })

        return diff;
      },
      findShuttleDiffList(list1, list2) {
        //检测集合1里面的小车是否在集合2中有变动
        if (list1.length == 0) {
          return false;//集合为空
        }
        if (list1.length != list2.length) {
          return false;//两个集合长度不一致
        }
          rgvList.forEach((item) => {
            if(graphicsRgv == null) {
              graphicsRgv = createRgvTexture(item.width * 0.9,item.height * 0.9);
            }
            let sprite = new PIXI.Sprite(graphicsRgv);
            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时变为手型指针
            pixiRgvMap.set(parseInt(deviceNo), sprite);
            objectsContainer2.addChild(sprite);
          })

        let flag = false;
        list1.forEach((item,index) => {
          for (var i = 0; i < list2.length; i++) {
            if (item.shuttleNo == list2[i].shuttleNo) {
              flag = true;
          const b1 = objectsContainer.getLocalBounds();
          const b2 = objectsContainer2.getLocalBounds();
          const minX = Math.min(b1.x, b2.x);
          const minY = Math.min(b1.y, b2.y);
          const maxX = Math.max(b1.x + b1.width, b2.x + b2.width);
          const maxY = Math.max(b1.y + b1.height, b2.y + b2.height);
          const contentW = Math.max(0, maxX - minX);
          const contentH = Math.max(0, maxY - minY);
          const vw = pixiApp.view.width;
          const vh = pixiApp.view.height;
          let scale = Math.min(vw / contentW, vh / contentH) * 0.95;
          if (!isFinite(scale) || scale <= 0) { scale = 1; }
          const posX = (vw - contentW * scale) / 2 - minX * scale;
          const posY = (vh - contentH * scale) / 2 - minY * scale;
          pixiApp.stage.setTransform(posX, posY, scale, scale, 0, 0, 0, 0, 0);

          this.map = map;
        },
        initWidth(map) {
          let maxRow = map.length;
          let maxBay = map[0].length;

          let bayWidthList = [];
          for(let bay = 0;bay < maxBay;bay++){
            let bayWidth = -1;
            for(let row = 0;row < maxRow;row++){
              let val = map[row][bay];
              if (val.cellWidth == undefined || val.cellWidth === '') {
                continue;
              }
              bayWidth = Math.max(bayWidth, val.cellWidth);
              break;
            }
            bayWidthList.push(bayWidth);
          }
        });
          return bayWidthList;
        },
        initHeight(map) {
          let maxRow = map.length;
          let maxBay = map[0].length;

        return flag;
      },
      findShuttlePathDiffList(list1, list2) {
        //检测集合1里面的小车预计路径是否在集合2中有变动
        if (list1.length == 0) {
          return false;//集合为空
        }
        if (list1.length != list2.length) {
          return false;//两个集合长度不一致
        }

        for (var index = 0; index < list1.length; index++) {
          let item = list1[index];
          for (var i = 0; i < list2.length; i++) {
            if (item.shuttleNo != list2[i].shuttleNo) {
              continue;//找不到小车号
          let bayHeightList = [];
          for(let row = 0;row < maxRow;row++){
            let bayHeight = -1;
            for(let bay = 0;bay < maxBay;bay++){
              let val = map[row][bay];
              if (val.cellHeight == undefined || val.cellHeight === '') {
                continue;
              }
              bayHeight = Math.max(bayHeight, val.cellHeight);
              break;
            }

            if (item.moveAdvancePath == null) {
              item.moveAdvancePath = [];
            }

            if (list2[i].moveAdvancePath == null) {
              list2[i].moveAdvancePath = [];
            }

            if (!(item.moveAdvancePath.length == list2[i].moveAdvancePath.length)) {
              return false;//小车预计路径长度不一致
            }
            bayHeightList.push(bayHeight);
          }
        }
        return true;
      },
      checkStaInListDiff(sta, list) {
        //检测站点是否在集合中有变动
        if (list.length == 0) {
          return false;//集合为空
        }

        let tmp = null;
        for (var i = 0; i < list.length; i++) {
          if (sta.siteId == list[i].siteId) {
            tmp = list[i];//找到相同站点
            break
          return bayHeightList;
        },
        rightEvent(x, y, e) {
          this.drawerLocNo = true
          this.drawerLocNoData = {
            x: x, y: y, z: this.currentLev, locNo: this.map[x][y].locNo,
            locSts: this.map[x][y].locSts, row: this.map[x][y].row, bay: this.map[x][y].bay, lev: this.currentLev
          };
        },
        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/locMap/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 (ws.readyState == WebSocket.OPEN) {
            ws.send(message)
          }
        },
        setSiteInfo(res) {
          let sites = Array.isArray(res) ? res : (res && res.code === 200 ? res.data : null);
          if (res && !Array.isArray(res)) {
            if (res.code === 403) { parent.location.href = baseUrl + "/login"; return; }
            if (res.code !== 200) { console.log(res.msg); return; }
          }
          if (!sites) { return; }
          this.currentLevStaList = sites;
          sites.forEach((item) => {
            let id = item.siteId != null ? item.siteId : item.stationId;
            let status = item.siteStatus != null ? item.siteStatus : item.stationStatus;
            let workNo = item.workNo != null ? item.workNo : item.taskNo;
            if (id == null) { return; }
            let sta = pixiStaMap.get(parseInt(id));
            if (sta == undefined) { return; }
            if (workNo != null && workNo > 0) {
              sta.textObj.text = id + "(" + workNo + ")";
            } else {
              sta.textObj.text = String(id);
            }
            if (sta.statusObj) {
              objectsContainer.removeChild(sta.statusObj);
              sta.statusObj = null;
              if (sta.textObj.parent !== sta) {
                sta.addChild(sta.textObj);
                sta.textObj.position.set(sta.width / 2, sta.height / 2);
              }
            }

        if (tmp == null) {
          return false;//没有找到相同站点
        }

        if (sta.siteStatus != tmp.siteStatus) {
          return false;//站点状态不相同
        }

        if (sta.workNo != tmp.workNo) {
          return false;//站点工作号不相同
        }

        return true;//无变化
      },
      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/locMap/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 (ws.readyState == WebSocket.OPEN) {
          ws.send(message)
        }
      },
      colorRGB(){
        //随机颜色
        const r = Math.floor(Math.random()*256);
        const g = Math.floor(Math.random()*256);
        const b = Math.floor(Math.random()*256);
        return `rgb(${r},${g},${b})`;
      },
      updateShuttleXY(item) {
        const shuttle = pixiShuttleMap.get(item.shuttleNo);
        if (shuttle.updateMoveStatus) {//动画执行完成才可继续执行动画
          shuttle.updateMoveStatus = false;//动画执行中
          // 计算两点之间的距离1
          const distance = Math.sqrt(Math.pow((item.wcsPoint.x * width) - shuttle.x, 2) + Math.pow((item.wcsPoint.y * height) - shuttle.y, 2));
          gsap.killTweensOf(shuttle); // 杀死所有针对".class"的动画
          gsap.to(shuttle, {
            x: (item.wcsPoint.y - 0) * width, // 目标位置
            y: (item.wcsPoint.x - 1) * height, // 目标位置
            duration: 0.2, // 动画持续时间（秒）
            ease: "power1.inOut", // 缓动类型
            onComplete: () => {
              shuttle.updateMoveStatus = true;//动画执行完成
            if (status === "site-auto") {
              updateColor(sta, 0x78ff81);
            } else if (status === "site-auto-run" || status === "site-auto-run-id") {
              updateColor(sta, 0xfa51f6);
            } else if (status === "site-unauto") {
              updateColor(sta, 0xb8b8b8);
            } else if (status === "machine-pakin") {
              updateColor(sta, 0x30bffc);
            } else if (status === "machine-pakout") {
              updateColor(sta, 0x97b400);
            } else {
              updateColor(sta, 0xb8b8b8);
            }
          });
        }
      },
      getSiteInfo() {
        //获取输送站点数据
        this.sendWs(JSON.stringify({
          "url": "/console/latest/data/site",
          "data": {}
        }))
      },
      setSiteInfo(res) {
        // var test = "{\"msg\":\"操作成功\",\"code\":200,\"data\":[{\"siteId\":\"300\",\"siteStatus\":\"site-auto\",\"workNo\":0},{\"siteId\":\"301\",\"siteStatus\":\"site-auto\",\"workNo\":0},{\"siteId\":\"302\",\"siteStatus\":\"site-auto\",\"workNo\":0},{\"siteId\":\"303\",\"siteStatus\":\"site-auto\",\"workNo\":0},{\"siteId\":\"304\",\"siteStatus\":\"site-auto\",\"workNo\":0},{\"siteId\":\"305\",\"siteStatus\":\"site-auto\",\"workNo\":0},{\"siteId\":\"306\",\"siteStatus\":\"site-auto\",\"workNo\":0},{\"siteId\":\"307\",\"siteStatus\":\"site-auto\",\"workNo\":0},{\"siteId\":\"308\",\"siteStatus\":\"site-auto\",\"workNo\":0},{\"siteId\":\"309\",\"siteStatus\":\"site-auto\",\"workNo\":0},{\"siteId\":\"310\",\"siteStatus\":\"site-auto\",\"workNo\":0},{\"siteId\":\"311\",\"siteStatus\":\"site-auto\",\"workNo\":0},{\"siteId\":\"312\",\"siteStatus\":\"site-auto\",\"workNo\":0},{\"siteId\":\"313\",\"siteStatus\":\"site-auto\",\"workNo\":0},{\"siteId\":\"314\",\"siteStatus\":\"site-auto\",\"workNo\":0},{\"siteId\":\"315\",\"siteStatus\":\"site-auto\",\"workNo\":0},{\"siteId\":\"316\",\"siteStatus\":\"site-auto-run\",\"workNo\":0},{\"siteId\":\"317\",\"siteStatus\":\"site-auto\",\"workNo\":0},{\"siteId\":\"318\",\"siteStatus\":\"site-auto\",\"workNo\":0},{\"siteId\":\"319\",\"siteStatus\":\"site-auto\",\"workNo\":0},{\"siteId\":\"320\",\"siteStatus\":\"site-auto\",\"workNo\":0},{\"siteId\":\"321\",\"siteStatus\":\"site-auto\",\"workNo\":0},{\"siteId\":\"322\",\"siteStatus\":\"site-auto-run\",\"workNo\":0},{\"siteId\":\"323\",\"siteStatus\":\"site-auto\",\"workNo\":0},{\"siteId\":\"324\",\"siteStatus\":\"site-auto-run\",\"workNo\":0},{\"siteId\":\"325\",\"siteStatus\":\"site-auto\",\"workNo\":0},{\"siteId\":\"326\",\"siteStatus\":\"site-auto-id\",\"workNo\":5451},{\"siteId\":\"327\",\"siteStatus\":\"site-auto\",\"workNo\":0},{\"siteId\":\"200\",\"siteStatus\":\"site-auto\",\"workNo\":0},{\"siteId\":\"328\",\"siteStatus\":\"site-auto\",\"workNo\":0},{\"siteId\":\"201\",\"siteStatus\":\"site-auto\",\"workNo\":0},{\"siteId\":\"329\",\"siteStatus\":\"site-auto\",\"workNo\":0},{\"siteId\":\"202\",\"siteStatus\":\"site-auto\",\"workNo\":0},{\"siteId\":\"330\",\"siteStatus\":\"site-auto\",\"workNo\":0},{\"siteId\":\"203\",\"siteStatus\":\"site-auto\",\"workNo\":0},{\"siteId\":\"331\",\"siteStatus\":\"site-auto\",\"workNo\":0},{\"siteId\":\"204\",\"siteStatus\":\"site-auto\",\"workNo\":0},{\"siteId\":\"332\",\"siteStatus\":\"site-auto\",\"workNo\":0},{\"siteId\":\"205\",\"siteStatus\":\"site-auto\",\"workNo\":0},{\"siteId\":\"333\",\"siteStatus\":\"site-auto\",\"workNo\":0},{\"siteId\":\"334\",\"siteStatus\":\"site-auto\",\"workNo\":0},{\"siteId\":\"335\",\"siteStatus\":\"site-auto\",\"workNo\":0},{\"siteId\":\"336\",\"siteStatus\":\"site-auto\",\"workNo\":0},{\"siteId\":\"337\",\"siteStatus\":\"site-auto\",\"workNo\":0},{\"siteId\":\"338\",\"siteStatus\":\"site-auto-run\",\"workNo\":0},{\"siteId\":\"339\",\"siteStatus\":\"site-auto-run-id\",\"workNo\":5447},{\"siteId\":\"340\",\"siteStatus\":\"site-auto\",\"workNo\":0},{\"siteId\":\"341\",\"siteStatus\":\"site-auto\",\"workNo\":0},{\"siteId\":\"342\",\"siteStatus\":\"site-auto\",\"workNo\":0},{\"siteId\":\"343\",\"siteStatus\":\"site-auto-run\",\"workNo\":0},{\"siteId\":\"344\",\"siteStatus\":\"site-auto\",\"workNo\":0},{\"siteId\":\"345\",\"siteStatus\":\"site-auto\",\"workNo\":0},{\"siteId\":\"346\",\"siteStatus\":\"site-auto\",\"workNo\":0},{\"siteId\":\"100\",\"siteStatus\":\"site-auto-run-id\",\"workNo\":8851},{\"siteId\":\"101\",\"siteStatus\":\"site-auto-run-id\",\"workNo\":8855},{\"siteId\":\"102\",\"siteStatus\":\"site-auto\",\"workNo\":0},{\"siteId\":\"103\",\"siteStatus\":\"site-auto\",\"workNo\":0},{\"siteId\":\"104\",\"siteStatus\":\"site-auto-run\",\"workNo\":0},{\"siteId\":\"105\",\"siteStatus\":\"site-auto\",\"workNo\":0}]}";
        // res = JSON.parse(test)
        //获取输送站点数据
        if (res.code === 200){
          var sites = res.data;
          if (this.reloadSta && pixiStaMap.size > 0) {
            //重新渲染所有输送站点
            this.currentLevStaList = sites;
            this.reloadSta = false;
            sites.forEach((item, index) => {
              let sta = pixiStaMap.get(parseInt(item.siteId));
              if (sta != undefined) {
                if (item.workNo > 0) {
                  sta.textObj.text = item.siteId + "(" + item.workNo + ")";
                }

                //创建遮罩层
                if (item.siteStatus == "site-auto") {
                  //自动状态，移除遮罩层
                  if (sta.statusObj != null) {
                    objectsContainer.removeChild(sta.statusObj)
                    sta.statusObj = null;
                  }
                }else if (item.siteStatus == "site-auto-run" || item.siteStatus == "site-auto-run-id") {
                  //自动有物
                  let graphics = getGraphics(0xfa51f6, width, height, sta.x, sta.y);
                  graphics.addChild(sta.textObj);//继承文字信息
                  sta.statusObj = graphics;
                  objectsContainer.addChild(graphics);
                }else if (item.siteStatus == "site-unauto") {
                  //非自动
                  let graphics = getGraphics(0xb8b8b8, width, height, sta.x, sta.y);
                  graphics.addChild(sta.textObj);//继承文字信息
                  sta.statusObj = graphics;
                  objectsContainer.addChild(graphics);
                }
              }
            });
          } else {
            //检测不相同站点进行局部更新
            this.currentLevStaList.forEach((item, index) => {
              let result = this.checkStaInListDiff(item, sites);
              if (!result) {
                //需要更新
                let sta = pixiStaMap.get(parseInt(item.siteId));
                if (item.workNo > 0) {
                  sta.textObj.text = item.siteId + "(" + item.workNo + ")";
                }else {
                  sta.textObj.text = item.siteId;
                }

                //创建遮罩层
                if (item.siteStatus == "site-auto") {
                  //自动状态，移除遮罩层
                  if (sta.statusObj != null) {
                    objectsContainer.removeChild(sta.statusObj)
                    sta.statusObj = null;
                  }
                }else if (item.siteStatus == "site-auto-run") {
                  //自动有物
                  let graphics = getGraphics(0xfa51f6, width, height, sta.x, sta.y);
                  graphics.addChild(sta.textObj);//继承文字信息
                  sta.statusObj = graphics;
                  objectsContainer.addChild(graphics);
                }else if (item.siteStatus == "site-unauto") {
                  //非自动
                  let graphics = getGraphics(0xb8b8b8, width, height, sta.x, sta.y);
                  graphics.addChild(sta.textObj);//继承文字信息
                  sta.statusObj = graphics;
                  objectsContainer.addChild(graphics);
                }
              }
            });
          }
        } else if (res.code === 403){
          parent.location.href = baseUrl+"/login";
        }  else {
          console.log(res.msg);
        }
      },
      openDrawerSta(data) {
        let that = this
        this.drawerSta = true;
        $.ajax({
          url: baseUrl + "/console/site/detail",
          headers: {
            'token': localStorage.getItem('token')
          },
          data: {
            siteId: data.data
          },
          method: 'post',
          success: function(res) {
            //解析数据
            let siteInfo = res.data;
            if (res.code == 200) {
              that.drawerStaData = siteInfo;
            }
          }
        })
      },
      openDrawerLift(data) {
        this.drawerLift = true;
        this.drawerLiftData = parseInt(data.data)
      },
      getLiftStateInfo() {
        // 提升机信息表获取
        this.sendWs(JSON.stringify({
          "url": "/lift/table/lift/state",
          "data": {}
        }))
      },
      setLiftStateInfo(res) {
        // 提升机信息表获取
        if (res.code == 200) {
          this.liftList = res.data
        }
      },
      addMoveAdvancePath(moveAdvancePath, shuttleNo) {//添加预计路径
        let that = this;
        moveAdvancePath.forEach((path, idx) => {
          let locNo = this.map[path.x, path.y];
          if (!pixiShuttleMoveAdvancePathMap.has(locNo)) {
            let graphics = getGraphics(0x9966ff, width, height, path.y * width, (path.x - 1) * height);
            let shuttleNos = [shuttleNo];
            // 创建文本对象
            const style = new PIXI.TextStyle({
              fontFamily: 'Arial',
              fontSize: 10,
              fill: '#000000',
            });
            const text = new PIXI.Text(JSON.stringify(shuttleNos), style);
            text.anchor.set(0.5); // 设置文本锚点为中心点
            text.position.set(graphics.width / 2, graphics.height / 2); // 将文本位置设置为Graphics对象的中心点
            // 将文本对象添加到Graphics对象中
            graphics.addChild(text);
            graphics.textObj = text;
            objectsContainer2.addChild(graphics)
            pixiShuttleMoveAdvancePathMap.set(locNo, {
              path: path,
              sprite: graphics,
              textObj: text,
              shuttleNos: shuttleNos
            })

            if (pixiShuttleMoveAdvancePathList[shuttleNo] == null) {
              let locNos = new Set()
              locNos.add(locNo);
              pixiShuttleMoveAdvancePathList[shuttleNo] = locNos;
            }else {
              pixiShuttleMoveAdvancePathList[shuttleNo].add(locNo);
            }
          }else {
            let pathMap = pixiShuttleMoveAdvancePathMap.get(locNo)
            let shuttleNos = pathMap.shuttleNos;
            shuttleNos.push(shuttleNo);
            pathMap.textObj.text = JSON.stringify(shuttleNos);
            pixiShuttleMoveAdvancePathMap.set(locNo, pathMap);
            if (pixiShuttleMoveAdvancePathList[shuttleNo] == null) {
              let locNos = new Set()
              locNos.add(locNo);
              pixiShuttleMoveAdvancePathList[shuttleNo] = locNos;
            }else {
              pixiShuttleMoveAdvancePathList[shuttleNo].add(locNo);
            }
          }
        });
      },
      removeMoveAdvancePath(shuttleNo) {//删除预计路径
        let locNos = pixiShuttleMoveAdvancePathList[shuttleNo];
        if (locNos != null) {
          locNos.forEach((locNo,index) => {
            let pathMap = pixiShuttleMoveAdvancePathMap.get(locNo);
            if (pathMap != null) {
              let shuttleNos = pathMap.shuttleNos;
              let shuttleNosNew = [];
              shuttleNos.forEach((shuttle, idx) => {
                if (shuttle != shuttleNo) {
                  shuttleNosNew.push(shuttle);
                }
              });

              if (shuttleNosNew.length === 0) {
                //预计路径没有小车，直接删除路径
                objectsContainer2.removeChild(pathMap.sprite);
                pixiShuttleMoveAdvancePathMap.delete(locNo)
              }else {
                //预计路径存在其他小车，更新文字信息
                pathMap.textObj.text = JSON.stringify(shuttleNosNew);
                pathMap.shuttleNos = shuttleNosNew;
                pixiShuttleMoveAdvancePathMap.set(locNo, pathMap);
        },
        openDrawerSta(data) {
          let that = this
          this.drawerSta = true;
          $.ajax({
            url: baseUrl + "/console/site/detail",
            headers: {
              'token': localStorage.getItem('token')
            },
            data: {
              siteId: data.data
            },
            method: 'post',
            success: function (res) {
              //解析数据
              let siteInfo = res.data;
              if (res.code == 200) {
                that.drawerStaData = siteInfo;
              }
            }
          })
        }
      },
    }
  })
        },
        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; }

  function getContainer(value) {
    let graphics = new PIXI.Graphics();
    if (value === 0) {
      graphics.beginFill(0x55aaff);
    } else if (value === 3) {//母轨道
      graphics.beginFill(0x00ff7f);
      graphics.visible = true;
    } else if (value === 4) {//站点
      graphics.beginFill(0xffff00);
      graphics.visible = true;
    } else if (value === 5) {//充电桩
      graphics.beginFill(0xffaa7f);
      graphics.visible = true;
    } else if (value === 9) {//轨迹
      graphics.beginFill(0xff0000);
    }else if (value === 67) {//提升机
      graphics.beginFill(0xaaffff);
    }else if (value === -999) {//路径锁定
      graphics.beginFill(0xf83333);
    }else if (value === 1000) {//满库位
      graphics.beginFill(0xf83333);
    }
    graphics.lineStyle(1, 0xffffff, 1);
    graphics.drawRect(0, 0, width, height);
    graphics.endFill();
                  const taskNo = crns[i].taskNo;
                  if (taskNo != null && taskNo > 0) {
                    sprite.textObj.text = id + "(" + taskNo + ")";
                  } else {
                    sprite.textObj.text = String(id);
                  }

    return graphics;
  }
                  const status = crns[i].crnStatus;
                  const statusColor = getCrnStatusColor(status);
                  updateCrnTextureColor(sprite, statusColor);

  function getGraphics(color, width, height, x, y) {
    let graphics = new PIXI.Graphics();
    graphics.beginFill(color);
    graphics.lineStyle(1, 0xffffff, 1);
    graphics.drawRect(0, 0, width, height);
    graphics.position.set(x, y);
    graphics.endFill();
    return graphics;
  }
                  let bay = parseInt(crns[i].bay, 10);
                  if (isNaN(bay) || bay < 1 || bay === -2) {
                    bay = 1;
                  }

  function getSprite(value, x, y, item, pointerDownEvent) {
    let sprite;
    if (value == 0) {
      if(item.locSts == 'O') {
        sprite = new PIXI.Sprite(graphics0);
      }else if(item.locSts == 'F') {
        sprite = new PIXI.Sprite(graphicsF);
      }else {
        sprite = new PIXI.Sprite(graphics0);
                  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);
              }
            }
          });
        },
        getSiteInfo() {
          let that = this;
          $.ajax({
            url: baseUrl + "/console/latest/data/station",
            headers: {'token': localStorage.getItem('token')},
            method: 'POST',
            success: function (res) {
              that.setSiteInfo(res);
            }
          });
        },
        getRgvInfo() {
          let that = this
          //获取RGV数据
          $.ajax({
            url: baseUrl + "/console/latest/data/rgv",
            headers: {'token': localStorage.getItem('token')},
            method: 'POST',
            success: function (res) {
              if (res.code === 200) {
                const rgvs = res.data;
                for (let i = 0; i < rgvs.length; i++) {
                  const id = parseInt(rgvs[i].rgvNo, 10);
                  const sprite = pixiRgvMap.get(id);
                  if (!sprite) { continue; }

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

                  const statusColor = getRgvStatusColor(rgvs[i].rgvStatus);
                  updateRgvTextureColor(sprite, statusColor);

                  let trackSiteNo = parseInt(rgvs[i].trackSiteNo, 10);
                  if (!trackSiteNo || trackSiteNo <= 0) { continue; }

                  let 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;
                  for (let c = 0; c < that.map[rowIndex].length; c++) {
                    const cell = that.map[rowIndex][c];
                    if (!cell || cell.type !== 'rgv') { continue; }
                    const ts = getTrackSiteNo(cell.value);
                    if (ts === trackSiteNo) {
                      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 === 'rgv') {
                        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);
              }
            }
          });
        },
      }
    } else if (value == 3) {
      sprite = new PIXI.Sprite(graphics3);
    } else if (value == 4) {
      sprite = new PIXI.Sprite(graphics4);
    } else if (value == 5) {
      sprite = new PIXI.Sprite(graphics5);
    } else if (value == 9) {
      sprite = new PIXI.Sprite(graphics9);
    } else if (value == 67) {
      sprite = new PIXI.Sprite(graphics67);
    } else if (value == -999) {
      sprite = new PIXI.Sprite(graphicsLock);
    } else {
      sprite = new PIXI.Sprite(graphics0);
    }
    sprite.position.set(x, y);
    sprite.interactive = true; // 必须要设置才能接收事件
    sprite.buttonMode = true; // 让光标在hover时变为手型指针

    sprite.on('pointerdown', (e) => {
      pointerDownEvent(e)
    })

    return sprite;
    function createShelfSprite(width, height) {
      let idx = width + "-" + height;
      let texture = pixiShelfMap.get(idx);
      if (texture == undefined) {
        let graphics = getContainer('shelf', width, height);
        texture = pixiApp.renderer.generateTexture(graphics);
        pixiShelfMap.set(idx, texture);
      }
      return new PIXI.Sprite(texture);
    }

    function createTrackSprite(width, height) {
      let idx = width + "-" + height;
      let texture = pixiTrackMap.get(idx);
      if (texture == undefined) {
        texture = createTrackTexture(width, height);
        pixiTrackMap.set(idx, texture);
      }
      return new PIXI.Sprite(texture);
    }

    function getContainer(type, width, height) {
      let graphics = new PIXI.Graphics();
      let drawBorder = true;
      if (type == 'shelf') {
        graphics.beginFill(0xb6e2e2);
      } else if (type == 'devp') {
        graphics.beginFill(0x00ff7f);
        graphics.visible = true;
      } else if (type == 'crn') {
        graphics.beginFill(0xaaffff);
      }
      if (drawBorder) {
        graphics.lineStyle(1, 0xffffff, 1);
        graphics.drawRect(0, 0, width, height);
      }
      graphics.endFill();

      return graphics;
    }

    function createTrackTexture(width, height) {
      const g = new PIXI.Graphics();
      const t = Math.max(2, Math.round(height * 0.08));
      const gap = Math.round(height * 0.30);
      const mid = Math.round(height / 2);
      const y1 = mid - Math.round(gap / 2);
      const y2 = mid + Math.round(gap / 2);
      const tHalf = Math.round(t / 2);
      const topRailTopY = y1 - tHalf;
      const bottomRailTopY = y2 - tHalf;
      g.beginFill(0x666666);
      g.drawRect(0, topRailTopY, width, t);
      g.drawRect(0, bottomRailTopY, width, t);
      g.endFill();
      g.beginFill(0x777777);
      const sTop = topRailTopY + t;
      const sBottom = bottomRailTopY;
      const sHeight = Math.max(1, sBottom - sTop);
      for (let i = 0; i < width; i += 5) {
        g.drawRect(i, sTop, 2, sHeight);
      }
      g.endFill();
      const rt = PIXI.RenderTexture.create({ width: width, height: height });
      pixiApp.renderer.render(g, rt);
      return rt;
    }

    function createCrnTexture(width, height) {
      const g = new PIXI.Graphics();
      const yTop = Math.round(height * 0.1);
      let deviceWidth  = width * 2;

      g.beginFill(0x999999);
      g.drawRect(2, yTop, 3, height - yTop - 2);
      g.drawRect(deviceWidth - 5, yTop, 3, height - yTop - 2);
      g.endFill();
      g.beginFill(0x999999);
      g.drawRect(0, yTop, deviceWidth, 3);
      g.endFill();
      const cabW = Math.round(deviceWidth * 0.68);
      const cabH = Math.round(height * 0.38);
      const cabX = Math.round((deviceWidth - cabW) / 2);
      const cabY = Math.round(height * 0.52 - cabH / 2);
      g.beginFill(0x245a9a);
      g.drawRect(cabX, cabY, cabW, cabH);
      g.endFill();
      const winW = Math.round(cabW * 0.6);
      const winH = Math.round(cabH * 0.45);
      const winX = cabX + Math.round((cabW - winW) / 2);
      const winY = cabY + Math.round((cabH - winH) / 2);
      g.beginFill(0xd0e8ff);
      g.drawRect(winX, winY, winW, winH);
      g.endFill();
      const forkW = Math.round(deviceWidth * 0.8);
      const forkH = Math.max(2, Math.round(height * 0.08));
      const forkX = Math.round((deviceWidth - forkW) / 2);
      const forkY = cabY + cabH;
      g.beginFill(0x666666);
      g.drawRect(forkX, forkY, forkW, forkH);
      g.endFill();
      const rt = PIXI.RenderTexture.create({ width: deviceWidth, height: height });
      pixiApp.renderer.render(g, rt);
      return rt;
    }

    function createCrnTextureColoredDevice(deviceWidth, height, color) {
      const g = new PIXI.Graphics();
      const yTop = Math.round(height * 0.1);
      g.beginFill(0x999999);
      g.drawRect(2, yTop, 3, height - yTop - 2);
      g.drawRect(deviceWidth - 5, yTop, 3, height - yTop - 2);
      g.endFill();
      g.beginFill(0x999999);
      g.drawRect(0, yTop, deviceWidth, 3);
      g.endFill();
      const cabW = Math.round(deviceWidth * 0.68);
      const cabH = Math.round(height * 0.38);
      const cabX = Math.round((deviceWidth - cabW) / 2);
      const cabY = Math.round(height * 0.52 - cabH / 2);
      g.beginFill(color);
      g.drawRect(cabX, cabY, cabW, cabH);
      g.endFill();
      const winW = Math.round(cabW * 0.6);
      const winH = Math.round(cabH * 0.45);
      const winX = cabX + Math.round((cabW - winW) / 2);
      const winY = cabY + Math.round((cabH - winH) / 2);
      g.beginFill(0xd0e8ff);
      g.drawRect(winX, winY, winW, winH);
      g.endFill();
      const forkW = Math.round(deviceWidth * 0.8);
      const forkH = Math.max(2, Math.round(height * 0.08));
      const forkX = Math.round((deviceWidth - forkW) / 2);
      const forkY = cabY + cabH;
      g.beginFill(0x666666);
      g.drawRect(forkX, forkY, forkW, forkH);
      g.endFill();
      const rt = PIXI.RenderTexture.create({ width: deviceWidth, height: height });
      pixiApp.renderer.render(g, rt);
      return rt;
    }

    function createDevpTextureColoredRect(width, height, color) {
      const g = new PIXI.Graphics();
      g.beginFill(color);
      g.lineStyle(1, 0xffffff, 1);
      g.drawRect(0, 0, width, height);
      g.endFill();
      const rt = PIXI.RenderTexture.create({ width: width, height: height });
      pixiApp.renderer.render(g, rt);
      return rt;
    }

    function createRgvTexture(width, height) {
      const g = new PIXI.Graphics();
      const bodyW = Math.round(width * 0.8);
      const bodyH = Math.round(height * 0.55);
      const bodyX = Math.round((width - bodyW) / 2);
      const bodyY = Math.round((height - bodyH) / 2);
      g.beginFill(0x245a9a);
      g.drawRect(bodyX, bodyY, bodyW, bodyH);
      g.endFill();
      const winW = Math.round(bodyW * 0.55);
      const winH = Math.round(bodyH * 0.45);
      const winX = bodyX + Math.round((bodyW - winW) / 2);
      const winY = bodyY + Math.round((bodyH - winH) / 2);
      g.beginFill(0xd0e8ff);
      g.drawRect(winX, winY, winW, winH);
      g.endFill();
      const wheelW = Math.max(2, Math.round(width * 0.12));
      const wheelH = Math.max(2, Math.round(height * 0.1));
      const wheelY = bodyY + bodyH;
      const wheelGap = Math.round((width - wheelW * 2) / 3);
      const wheelX1 = wheelGap;
      const wheelX2 = width - wheelGap - wheelW;
      g.beginFill(0x333333);
      g.drawRect(wheelX1, wheelY - Math.round(wheelH / 2), wheelW, wheelH);
      g.drawRect(wheelX2, wheelY - Math.round(wheelH / 2), wheelW, wheelH);
      g.endFill();
      const rt = PIXI.RenderTexture.create({ width: width, height: height });
      pixiApp.renderer.render(g, rt);
      return rt;
    }

    function createRgvTextureColoredDevice(width, height, color) {
      const g = new PIXI.Graphics();
      const bodyW = Math.round(width * 0.8);
      const bodyH = Math.round(height * 0.55);
      const bodyX = Math.round((width - bodyW) / 2);
      const bodyY = Math.round((height - bodyH) / 2);
      g.beginFill(color);
      g.drawRect(bodyX, bodyY, bodyW, bodyH);
      g.endFill();
      const winW = Math.round(bodyW * 0.55);
      const winH = Math.round(bodyH * 0.45);
      const winX = bodyX + Math.round((bodyW - winW) / 2);
      const winY = bodyY + Math.round((bodyH - winH) / 2);
      g.beginFill(0xd0e8ff);
      g.drawRect(winX, winY, winW, winH);
      g.endFill();
      const wheelW = Math.max(2, Math.round(width * 0.12));
      const wheelH = Math.max(2, Math.round(height * 0.1));
      const wheelY = bodyY + bodyH;
      const wheelGap = Math.round((width - wheelW * 2) / 3);
      const wheelX1 = wheelGap;
      const wheelX2 = width - wheelGap - wheelW;
      g.beginFill(0x333333);
      g.drawRect(wheelX1, wheelY - Math.round(wheelH / 2), wheelW, wheelH);
      g.drawRect(wheelX2, wheelY - Math.round(wheelH / 2), wheelW, wheelH);
      g.endFill();
      const rt = PIXI.RenderTexture.create({ width: width, height: height });
      pixiApp.renderer.render(g, rt);
      return rt;
    }

    function updateRgvTextureColor(sprite, color) {
      const tex = createRgvTextureColoredDevice(sprite.width, sprite.height, color);
      sprite.texture = tex;
    }

    function updateCrnTextureColor(sprite, color) {
      const tex = createCrnTextureColoredDevice(sprite.width, sprite.height, color);
      sprite.texture = tex;
    }

    function getCrnStatusColor(status) {
      if (status === "machine-auto") { return 0x21BA45; }
      if (status === "machine-un-auto") { return 0xBBBBBB; }
      if (status === "machine-error") { return 0xDB2828; }
      if (status === "machine-pakin") { return 0x30bffc; }
      if (status === "machine-pakout") { return 0x97b400; }
      return 0xBBBBBB;
    }

    function getRgvStatusColor(status) {
      if (status === "idle") { return 0x21BA45; }
      if (status === "working") { return 0xffd60b; }
      if (status === "waiting") { return 0xffd60b; }
      if (status === "fetching") { return 0xffd60b; }
      if (status === "putting") { return 0xffd60b; }
      return 0xb8b8b8;
    }

    function getGraphics(color, width, height, x, y) {
      let graphics = new PIXI.Graphics();
      graphics.beginFill(color);
      graphics.lineStyle(1, 0xffffff, 1);
      graphics.drawRect(0, 0, width, height);
      graphics.position.set(x, y);
      graphics.endFill();
      return graphics;
    }

    function getSprite(item, pointerDownEvent) {
      let sprite;
      let value = item.value;
      if (item.type == 'shelf') {
        sprite = createShelfSprite(item.width, item.height);
      } else if (item.type == 'devp') {
        const graphics = getContainer('devp', item.width, item.height);
        const texture = pixiApp.renderer.generateTexture(graphics);
        sprite = new PIXI.Sprite(texture);
        sprite._kind = 'devp';
        let siteId = getStationId(value);
        if (siteId === -1) {
          siteId = item.data;
        }
        const style = new PIXI.TextStyle({ fontFamily: 'Arial', fontSize: 10, fill: '#ffffff', stroke: '#000000', strokeThickness: 2 });
        const text = new PIXI.Text(String(siteId), style);
        text.anchor.set(0.5);
        text.position.set(sprite.width / 2, sprite.height / 2);
        sprite.addChild(text);
        sprite.textObj = text;
        if (siteId != null && siteId !== -1) {
          pixiStaMap.set(parseInt(siteId), sprite);
        }
      } else if (item.type == 'crn') {
        sprite = createTrackSprite(item.width, item.height);
        sprite.zIndex = 0;

        if(getDeviceNo(value) > 0){
          crnList.push(item);
        }
      } else if (item.type == 'rgv') {
        sprite = createTrackSprite(item.width, item.height);
        sprite.zIndex = 0;

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

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

      sprite.on('pointerdown', (e) => {
        pointerDownEvent(e)
      })

      return sprite;
    }

    /**
     * 更新颜色
     */
    function updateColor(sprite, color) {
      if (sprite && sprite._kind === 'devp') {
        const key = sprite.width + '-' + sprite.height + '-' + color;
        let texture = pixiDevpTextureMap.get(key);
        if (!texture) {
          texture = createDevpTextureColoredRect(Math.round(sprite.width), Math.round(sprite.height), color);
          pixiDevpTextureMap.set(key, texture);
        }
        const textObj = sprite.textObj;
        sprite.texture = texture;
        if (textObj) {
          if (textObj.parent !== sprite) { sprite.addChild(textObj); }
          textObj.position.set(sprite.width / 2, sprite.height / 2);
        }
        return;
      }
      sprite.tint = color;
    }

    function isJson(str) {
      try {
        JSON.parse(str);
        return true;
      } catch (e) {
        return false;
      }
    }

  function getDeviceNo(obj) {
    if (this.isJson(obj)) {
      let data = JSON.parse(obj)
      if (data.deviceNo == null || data.deviceNo == undefined) {
        return -1;
      }
      return data.deviceNo;
    } else {
      return -1;
    }
  }

  /**
   * 更新颜色
   */
  function updateColor(sprite, color) {
    // graphics.clear()
    // graphics.beginFill(color);
    // graphics.drawRect(0, 0, width, height);
    sprite.tint = color;
  function getTaskNo(obj) {
    if (this.isJson(obj)) {
      let data = JSON.parse(obj)
      if (data.taskNo == null || data.taskNo == undefined) {
        return -1;
      }
      return data.taskNo;
    } else {
      return -1;
    }
  }

</script>
    function getStationId(obj) {
      if (this.isJson(obj)) {
        let data = JSON.parse(obj)
        if (data.stationId == null || data.stationId == undefined) {
          return -1;
        }
        return data.stationId;
      } else {
        return -1;
      }
    }

    function getTrackSiteNo(obj) {
      if (this.isJson(obj)) {
        let data = JSON.parse(obj)
        if (data.trackSiteNo == null || data.trackSiteNo == undefined) {
          return -1;
        }
        return data.trackSiteNo;
      } else {
        return -1;
      }
    }

  </script>
</body>
</html>
</html>
			@@ -221,6 +221,7 @@
			}
			RgvLatestDataVo vo = new RgvLatestDataVo();
			vo.setRgvNo(rgvProtocol.getRgvNo());
			vo.setTaskNo(rgvProtocol.getTaskNo());
			vo.setTrackSiteNo(String.valueOf(rgvProtocol.getRgvPos()));
			vo.setRgvStatus(RgvStatusType.get(rgvProtocol.getStatus()));
			vos.add(vo);
			@@ -8,6 +8,8 @@

			private Integer rgvNo;

			private Integer taskNo;

			private String trackSiteNo;

			private RgvStatusType rgvStatus;