#

zzgtfwq

昨天 4654f843e10a00044778efe04f961d6541e33105

 src/main/webapp/views/deviceOperate/wcsOperate.html

@@ -48,23 +48,15 @@
      <svg class="container"
          viewBox="0 0 1200 850"
          preserveAspectRatio="xMidYMid meet">
         <path d="M 1200,750
                        L 1200,100
                        C 1200,100 1200,50 1150,50
                        C 1150,50 1100,50 1100,100
                        L 1100,700
                        C 1100,700 1100,750 1050,750
                        L 60,750
                        C 60,750 10,750 10,800
                        C 10,800 10,850 60,850
                        L 1100,850
                        C 1100,850 1200,850 1200,750"
         <path d="M 100,225 L 1100,225"
              style="fill:none; stroke:blue; stroke-width:3; stroke-dasharray:10,1;"/>
         <path d="M 100,625 L 1100,625"
              style="fill:none; stroke:blue; stroke-width:3; stroke-dasharray:10,1;"/>
      </svg>

      <div v-for="station in tableDataDev" class="station" :style="{
                top: convertToCSSPosition(station.valueX, station.valueY).y + 'px',
                left: convertToCSSPosition(station.valueX, station.valueY).x + 'px',
                top: convertToCSSPosition2(station.index,station.valueX, station.valueY).y + 'px',
                left: convertToCSSPosition2(station.index,station.valueX, station.valueY).x + 'px',
                backgroundColor: station.modeColor}">
         <div class="corner corner-tl"></div>
         <div class="corner corner-tr"></div>
@@ -84,7 +76,7 @@
   </div>

   <!-- Left Task Bar -->
   <div class="task-bar-left left-task-bar" >
   <!--<div class="task-bar-left left-task-bar" >
      <div>
         <el-tooltip :content="'Switch value: ' + valueLeft" placement="top">
            <el-switch
@@ -133,10 +125,10 @@
                  prop="crnEndTime"
                  label="执行结束时间">
            </el-table-column>
            <!--                    <el-table-column-->
            <!--                            prop="modiTime"-->
            <!--                            label="更新时间">-->
            <!--                    </el-table-column>-->
            &lt;!&ndash;                    <el-table-column&ndash;&gt;
            &lt;!&ndash;                            prop="modiTime"&ndash;&gt;
            &lt;!&ndash;                            label="更新时间">&ndash;&gt;
            &lt;!&ndash;                    </el-table-column>&ndash;&gt;
            <el-table-column
                  prop="rgvSts"
                  label="RGV状态">
@@ -213,7 +205,7 @@
      </div>
   </div>

   <!-- Right Task Bar -->
   &lt;!&ndash; Right Task Bar &ndash;&gt;
   <div class="task-bar-right right-task-bar">
      <div>
         <el-tooltip :content="'Switch value: ' + valueRight" placement="top">
@@ -298,7 +290,7 @@
            </el-table-column>
         </el-table>
      </div>
   </div>
   </div>-->
</div>

<script>
@@ -377,7 +369,7 @@
         mappedStations() {
            return this.tableDataDev.map(station => ({
               ...station,
               position: this.convertToCSSPosition(station.valueX, station.valueY)
               position: this.convertToCSSPosition2(station.index,station.valueX, station.valueY)
            }));
         }
      },
@@ -468,6 +460,48 @@
            };
         },

         // 坐标转换函数
         convertToCSSPosition2(devNo,svgX, svgY) {
            const svgWidth = 1200;  // SVG 原始宽度
            let svgWidthR = 0;  //
            const svgHeight = 850; // SVG 原始高度
            let svgHeightR = 0; //
            if (svgX>svgWidth/2){
               svgWidthR = (((svgX-svgWidth/2)/svgWidth) * this.containerSize.width) + this.bodySize.width/2 - this.bodySize.width*((1-0.52)/2);
            } else {
               svgWidthR = this.bodySize.width/2 - (((svgWidth/2 - svgX)/svgWidth) * this.containerSize.width)  - this.bodySize.width*((1-0.52)/2);
            }
            if (svgY>svgHeight/2){
               svgHeightR = (((svgY-svgHeight/2)/svgHeight) * this.containerSize.height) + this.bodySize.height/2 - this.bodySize.height*((1-0.72)/2);
            } else {
               svgHeightR = this.bodySize.height/2 - (((svgHeight/2 - svgY)/svgHeight) * this.containerSize.height)  - this.bodySize.height*((1-0.72)/2);
            }
            svgHeightR = svgHeightR-60;
            if(devNo>200){
               if (devNo>216){
                  svgHeightR = svgHeightR+80;
               }
            } else {
               if (devNo>116){
                  svgHeightR = svgHeightR+80;
               } else {
                  if(devNo === 114 || devNo === 112 ){
                     svgWidthR = svgWidthR-20;
                  } else {
                     svgWidthR = svgWidthR+40;
                  }

               }
            }
            if(devNo === 116){
               svgHeightR = svgHeightR-35;
            }
            return {
               x: svgWidthR,
               y: svgHeightR
            };
         },

         handleZoom(e) {
            const scaleDelta = e.deltaY > 0 ? 0.9 : 1.1;
            const currentScale = this.scale || 1;