huangxiaoqiang
2025-07-29 f23e0326aa05a1c5b47d4aec4c06e73d0d86b8e7
ÏîÄ¿´úÂë/WCS/WIDESEAWCS_Client/src/views/Home.vue
@@ -1,572 +1,586 @@
<template>
   <div>
      111
   </div>
   <div class="title">
      <el-row  style="height:100%">
      <el-col :span="16">
      <el-row :gutter="20" style="height:100%">
         <el-col :span="8">
            <span style="position: relative; top: 100px;left: 30px;">第一层</span>
            <el-row :gutter="20" style="height:1000px">
               <el-col :span="8"></el-col>
               <el-col :span="8">
                  <div class="line-container">
                     <div class="RGVline"></div>
                     <div :class="updateRGVOne()" :style="{ marginTop: RGV01.LevelPoint + 'px' }" ref="childDot" @click="mouseClick">1</div>
                     <div :class="updateRGVTwo()" :style="{ marginTop: RGV02.LevelPoint + 'px' }" ref="childDot" @click="mouseClick">2</div>
                  </div>
               </el-col>
               <el-col :span="8">
                  <div>
                     <div v-for="(group, index) in groupedLines(linescopy1)" :key="index">
                        <div class="positionY-group">
                           <LineInfoCopy v-for="(line, lineIndex) in group.lines" :key="lineIndex"
                              :equipNo="line.equipNo" :imgType="line.imgType" :positionX="line.positionX"
                              :positionY="line.positionY" :condition="line.condition" />
                        </div>
                     </div>
                     <div style="margin-top: 118px;"></div>
                     <div v-for="(group, index) in groupedLines(linescopy2)" :key="index">
                        <div class="positionY-group">
                           <LineInfoCopy v-for="(line, lineIndex) in group.lines" :key="lineIndex"
                              :equipNo="line.equipNo" :imgType="line.imgType" :positionX="line.positionX"
                              :positionY="line.positionY" :condition="line.condition" />
                        </div>
                     </div>
                     <div style="margin-top: 115px;"></div>
                     <div v-for="(group, index) in groupedLines(linescopy3)" :key="index">
                        <div class="positionY-group">
                           <LineInfoCopy v-for="(line, lineIndex) in group.lines" :key="lineIndex"
                              :equipNo="line.equipNo" :imgType="line.imgType" :positionX="line.positionX"
                              :positionY="line.positionY" :condition="line.condition" />
                        </div>
                     </div>
                     <div style="margin-top: 112px;"></div>
                     <div v-for="(group, index) in groupedLines(linescopy4)" :key="index">
                        <div class="positionY-group">
                           <LineInfoCopy v-for="(line, lineIndex) in group.lines" :key="lineIndex"
                              :equipNo="line.equipNo" :imgType="line.imgType" :positionX="line.positionX"
                              :positionY="line.positionY" :condition="line.condition" />
                        </div>
                     </div>
                     <div style="margin-top: 109px;"></div>
                     <div v-for="(group, index) in groupedLines(linescopy5)" :key="index">
                        <div class="positionY-group">
                           <LineInfoCopy v-for="(line, lineIndex) in group.lines" :key="lineIndex"
                              :equipNo="line.equipNo" :imgType="line.imgType" :positionX="line.positionX"
                              :positionY="line.positionY" :condition="line.condition" />
                        </div>
                     </div>
                     <div style="margin-top: 107px;"></div>
                     <div v-for="(group, index) in groupedLines(linescopy6)" :key="index">
                        <div class="positionY-group">
                           <LineInfoCopy v-for="(line, lineIndex) in group.lines" :key="lineIndex"
                              :equipNo="line.equipNo" :imgType="line.imgType" :positionX="line.positionX"
                              :positionY="line.positionY" :condition="line.condition" />
                        </div>
                     </div>
                  </div>
               </el-col>
            </el-row>
         </el-col>
         <el-col :span="8">
            <!-- å †åž›æœº -->
            <div style="position: relative; top: 50px;">
               <div class="stackerDiv">
                  <div class="stackDivName">一号堆垛机</div>
                  <LineComponent :x="xValue1" ref="lineComponent1" :equipNo="1"></LineComponent>
                  <LineComponent :x="xValue1" ref="stacker1" :equipNo="SC01"></LineComponent>
               </div>
               <el-divider></el-divider>
               <div class="stackerDiv">
                  <div class="stackDivName">二号堆垛机</div>
                  <LineComponent :x="xValue2" ref="lineComponent2" :equipNo="2"></LineComponent>
                  <LineComponent :x="xValue2" ref="stacker2" :equipNo="SC02"></LineComponent>
               </div>
          <div class="stackerDiv">
               <el-divider></el-divider>
               <div class="stackerDiv">
                  <div class="stackDivName">三号堆垛机</div>
                  <LineComponent :x="xValue2" ref="lineComponent2" :equipNo="2"></LineComponent>
                  <LineComponent :x="xValue3" ref="stacker3" :equipNo="SC03"></LineComponent>
               </div>
          <div class="stackerDiv">
               <el-divider></el-divider>
               <div class="stackerDiv">
                  <div class="stackDivName">四号堆垛机</div>
                  <LineComponent :x="xValue2" ref="lineComponent2" :equipNo="2"></LineComponent>
                  <LineComponent :x="xValue4" ref="stacker4" :equipNo="SC04"></LineComponent>
               </div>
               <el-divider></el-divider>
               <div class="stackerDiv">
                  <div class="stackDivName">五号堆垛机</div>
                  <LineComponent :x="xValue5" ref="stacker5" :equipNo="SC05"></LineComponent>
               </div>
               <el-divider></el-divider>
               <div class="stackerDiv">
                  <div class="stackDivName">六号堆垛机</div>
                  <LineComponent :x="xValue6" ref="stacker6" :equipNo="SC06"></LineComponent>
               </div>
            </div>
         </el-col>
      </el-row>
      <el-row :gutter="20" class="cardWidthrow">
      <el-col :span="7">
            <div class="cardWidth">
               <div>
                  <span style="position: relative; top: 100px;left: 10px;">第一层前</span>
                  <div v-for="(group, index) in groupedLines(linescopy1)" :key="index">
                     <div class="positionY-group">
                        <LineInfoCopy v-for="(line, lineIndex) in group.lines" :key="lineIndex"
                           :equipNo="line.equipNo" :imgType="line.imgType" :positionX="line.positionX"
                           :positionY="line.positionY"
                           :condition="line.condition" />
                     </div>
                  </div>
               </div>
               <!-- <el-divider class="divider"></el-divider>
               <div>
                  <span style="position: relative; top: 120px;left: 30px;">第二层</span>
                  <div v-for="(group, index) in groupedLines(linescopy2)" :key="index">
                     <div class="positionY-group">
                        <LineInfoCopy v-for="(line, lineIndex) in group.lines" :key="lineIndex"
                           :equipNo="line.equipNo" :imgType="line.imgType" :positionX="line.positionX"
                           :positionY="line.positionY" url="api/Equipment/GetLineInfoByNo"
                           :condition="line.condition" />
                     </div>
                  </div>
               </div>
               <el-divider class="divider"></el-divider>
               <div>
                  <span style="position: relative; top: 120px;left: 30px;">第三层</span>
                  <div v-for="(group, index) in groupedLines(linescopy3)" :key="index">
                     <div class="positionY-group">
                        <LineInfoCopy v-for="(line, lineIndex) in group.lines" :key="lineIndex"
                           :equipNo="line.equipNo" :imgType="line.imgType" :positionX="line.positionX"
                           :positionY="line.positionY" url="api/Equipment/GetLineInfoByNo"
                           :condition="line.condition" />
                     </div>
                  </div>
               </div> -->
            </div>
         </el-col>
         <!-- <el-col :span="12">
         <!-- <el-col :span="8">
            <div>
               <span style="position: relative; top: 120px;left: 30px;">第四层</span>
               <div v-for="(group, index) in groupedLines(linescopy4)" :key="index">
               <div v-for="(group, index) in groupedLines(linescopy3)" :key="index">
                  <div class="positionY-group">
                     <LineInfoCopy v-for="(line, lineIndex) in group.lines" :key="lineIndex"
                        :equipNo="line.equipNo" :imgType="line.imgType" :positionX="line.positionX"
                        :positionY="line.positionY" url="api/Equipment/GetLineInfoByNo"
                        :condition="line.condition" />
                     <LineInfoCopy v-for="(line, lineIndex) in group.lines" :key="lineIndex" :equipNo="line.equipNo"
                        :imgType="line.imgType" :positionX="line.positionX" :positionY="line.positionY"
                        url="api/Equipment/GetLineInfoByNo" :condition="line.condition" />
                  </div>
               </div>
            </div>
         </el-col>
         <el-col :span="12">
            <div>
               <span style="position: relative; top: 120px;left: 30px;">第五层</span>
               <div v-for="(group, index) in groupedLines(linescopy5)" :key="index">
               <div style="margin-top: 105px;"></div>
               <div v-for="(group, index) in groupedLines(linescopy3)" :key="index">
                  <div class="positionY-group">
                     <LineInfoCopy v-for="(line, lineIndex) in group.lines" :key="lineIndex"
                        :equipNo="line.equipNo" :imgType="line.imgType" :positionX="line.positionX"
                        :positionY="line.positionY" url="api/Equipment/GetLineInfoByNo"
                        :condition="line.condition" />
                     <LineInfoCopy v-for="(line, lineIndex) in group.lines" :key="lineIndex" :equipNo="line.equipNo"
                        :imgType="line.imgType" :positionX="line.positionX" :positionY="line.positionY"
                        url="api/Equipment/GetLineInfoByNo" :condition="line.condition" />
                  </div>
               </div>
               <div style="margin-top: 105px;"></div>
               <div v-for="(group, index) in groupedLines(linescopy3)" :key="index">
                  <div class="positionY-group">
                     <LineInfoCopy v-for="(line, lineIndex) in group.lines" :key="lineIndex" :equipNo="line.equipNo"
                        :imgType="line.imgType" :positionX="line.positionX" :positionY="line.positionY"
                        url="api/Equipment/GetLineInfoByNo" :condition="line.condition" />
                  </div>
               </div>
               <div style="margin-top: 105px;"></div>
               <div v-for="(group, index) in groupedLines(linescopy3)" :key="index">
                  <div class="positionY-group">
                     <LineInfoCopy v-for="(line, lineIndex) in group.lines" :key="lineIndex" :equipNo="line.equipNo"
                        :imgType="line.imgType" :positionX="line.positionX" :positionY="line.positionY"
                        url="api/Equipment/GetLineInfoByNo" :condition="line.condition" />
                  </div>
               </div>
               <div style="margin-top: 100px;"></div>
               <div v-for="(group, index) in groupedLines(linescopy3)" :key="index">
                  <div class="positionY-group">
                     <LineInfoCopy v-for="(line, lineIndex) in group.lines" :key="lineIndex" :equipNo="line.equipNo"
                        :imgType="line.imgType" :positionX="line.positionX" :positionY="line.positionY"
                        url="api/Equipment/GetLineInfoByNo" :condition="line.condition" />
                  </div>
               </div>
               <div style="margin-top: 100px;"></div>
               <div v-for="(group, index) in groupedLines(linescopy3)" :key="index">
                  <div class="positionY-group">
                     <LineInfoCopy v-for="(line, lineIndex) in group.lines" :key="lineIndex" :equipNo="line.equipNo"
                        :imgType="line.imgType" :positionX="line.positionX" :positionY="line.positionY"
                        url="api/Equipment/GetLineInfoByNo" :condition="line.condition" />
                  </div>
               </div>
            </div>
         </el-col> -->
      </el-row>
      <el-row :gutter="20" class="cardWidthrow">
         <el-col :span="12">
            <div>
               <span style="position: relative; top: 120px;left: 30px;">第二层</span>
               <div v-for="(group, index) in groupedLines(linescopy4)" :key="index">
                  <div class="positionY-group">
                     <LineInfoCopy v-for="(line, lineIndex) in group.lines" :key="lineIndex" :equipNo="line.equipNo"
                        :imgType="line.imgType" :positionX="line.positionX" :positionY="line.positionY"
                        url="api/Equipment/GetLineInfoByNo" :condition="line.condition" />
                  </div>
               </div>
            </div>
         </el-col>
      </el-row>
   </div>
</template>
<script>
import { ref, reactive } from "vue";
import { onMounted, ref, reactive } from "vue";
// import StackerInfo from "./StackerInfo.vue";
// import LineInfo from "./LineInfo.vue";
import LineInfoCopy from "./LineInfocopy.vue";
import LineComponent from './LineComponent.vue';
import eventBus from "../uitils/eventBus";
export default {
   data() {
      return {
         //#region ç¬¬ä¸€å±‚
         linescopy1: [
            //#region ç¬¬ä¸€æŽ’
            {
               equipNo: "1103",
               equipNo: "1005",
               imgType: "1",
               positionX: 1,
               positionY: 1,
               positionX: 0.6,
               positionY: 8,
               condition: false,
            },
            {
               equipNo: "1102",
               equipNo: "1006",
               imgType: "1",
               positionX: 2,
               positionY: 1,
               positionX: 0.6,
               positionY: 8,
               condition: false,
            },
            {
               equipNo: "2103",
               imgType: "1",
               positionX: 2,
               positionY: 1,
               condition: false,
            },
            // {
            //    equipNo: "2102",
            //    imgType: "1",
            //    positionX: 5,
            //    positionY: 1,
            //    condition: false,
            // },
            //#endregion
            //#region ç¬¬äºŒæŽ’
            {
               equipNo: "1104",
               equipNo: "1007",
               imgType: "1",
               positionX: 1,
               positionY: 4,
               positionX: 0.6,
               positionY: 20,
               condition: false,
            },
            {
               equipNo: "1101",
               equipNo: "1008",
               imgType: "1",
               positionX: 2,
               positionY: 4,
               positionX: 0.6,
               positionY: 20,
               condition: false,
            }, {
               equipNo: "2002",
               imgType: "1",
               positionX: 26,
               positionY: 8,
               condition: false,
            },
            {
               equipNo: "2104",
               equipNo: "2001",
               imgType: "1",
               positionX: 2,
               positionY: 4,
               positionX: 26,
               positionY: 8,
               condition: false,
            },
            // {
            //    equipNo: "2101",
            //    imgType: "1",
            //    positionX: 5,
            //    positionY: 2,
            //    condition: false,
            // },
            //#endregion
            {
               equipNo: "2004",
               imgType: "1",
               positionX: 26,
               positionY: 20,
               condition: false,
            },
            {
               equipNo: "2003",
               imgType: "1",
               positionX: 26,
               positionY: 20,
               condition: false,
            },
         ],
         //#endregion
         //#region ç¬¬äºŒå±‚
         linescopy2: [
            //#region ç¬¬ä¸€æŽ’
            {
               equipNo: "1204",
               equipNo: "1009",
               imgType: "1",
               positionX: 1,
               positionY: 1,
               positionX: 0.6,
               positionY: 8,
               condition: false,
            },
            {
               equipNo: "1203",
               equipNo: "1010",
               imgType: "1",
               positionX: 2,
               positionY: 1,
               positionX: 0.6,
               positionY: 8,
               condition: false,
            },
            {
               equipNo: "2204",
               imgType: "1",
               positionX: 4,
               positionY: 1,
               condition: false,
            },
            {
               equipNo: "2203",
               imgType: "1",
               positionX: 5,
               positionY: 1,
               condition: false,
            },
            //#endregion
            //#region ç¬¬äºŒæŽ’
            {
               equipNo: "1205",
               equipNo: "1011",
               imgType: "1",
               positionX: 1,
               positionY: 2,
               positionX: 0.6,
               positionY: 20,
               condition: false,
            },
            {
               equipNo: "1202",
               equipNo: "1012",
               imgType: "1",
               positionX: 2,
               positionY: 2,
               positionX: 0.6,
               positionY: 20,
               condition: false,
            }, {
               equipNo: "2006",
               imgType: "1",
               positionX: 26,
               positionY: 8,
               condition: false,
            },
            {
               equipNo: "2205",
               equipNo: "2005",
               imgType: "1",
               positionX: 4,
               positionY: 2,
               positionX: 26,
               positionY: 8,
               condition: false,
            },
            {
               equipNo: "2202",
               equipNo: "2008",
               imgType: "1",
               positionX: 5,
               positionY: 2,
               condition: false,
            },
            //#endregion
            //#region ç¬¬ä¸‰æŽ’
            {
               equipNo: "1206",
               imgType: "1",
               positionX: 1,
               positionY: 3,
               positionX: 26,
               positionY: 20,
               condition: false,
            },
            {
               equipNo: "1201",
               equipNo: "2007",
               imgType: "1",
               positionX: 2,
               positionY: 3,
               positionX: 26,
               positionY: 20,
               condition: false,
            },
            {
               equipNo: "2205",
               imgType: "1",
               positionX: 4,
               positionY: 3,
               condition: false,
            },
            {
               equipNo: "2201",
               imgType: "1",
               positionX: 5,
               positionY: 3,
               condition: false,
            },
            //#endregion
         ],
         //#endregion
         //#region ç¬¬ä¸‰å±‚
         linescopy3: [
            //#region ç¬¬ä¸€æŽ’
            {
               equipNo: "1304",
               equipNo: "1017",
               imgType: "1",
               positionX: 1,
               positionY: 1,
               positionX: 0.6,
               positionY: 8,
               condition: false,
            },
            {
               equipNo: "1303",
               equipNo: "1018",
               imgType: "1",
               positionX: 2,
               positionY: 1,
               positionX: 0.6,
               positionY: 8,
               condition: false,
            },
            {
               equipNo: "2304",
               imgType: "1",
               positionX: 4,
               positionY: 1,
               condition: false,
            },
            {
               equipNo: "2303",
               imgType: "1",
               positionX: 5,
               positionY: 1,
               condition: false,
            },
            //#endregion
            //#region ç¬¬äºŒæŽ’
            {
               equipNo: "1305",
               equipNo: "1019",
               imgType: "1",
               positionX: 1,
               positionY: 2,
               positionX: 0.6,
               positionY: 20,
               condition: false,
            },
            {
               equipNo: "1302",
               equipNo: "1020",
               imgType: "1",
               positionX: 2,
               positionY: 2,
               positionX: 0.6,
               positionY: 20,
               condition: false,
            }, {
               equipNo: "2010",
               imgType: "1",
               positionX: 26,
               positionY: 8,
               condition: false,
            },
            {
               equipNo: "2305",
               equipNo: "2009",
               imgType: "1",
               positionX: 4,
               positionY: 2,
               positionX: 26,
               positionY: 8,
               condition: false,
            },
            {
               equipNo: "2302",
               equipNo: "2012",
               imgType: "1",
               positionX: 5,
               positionY: 2,
               condition: false,
            },
            //#endregion
            //#region ç¬¬ä¸‰æŽ’
            {
               equipNo: "1306",
               imgType: "1",
               positionX: 1,
               positionY: 3,
               positionX: 26,
               positionY: 20,
               condition: false,
            },
            {
               equipNo: "1301",
               equipNo: "2011",
               imgType: "1",
               positionX: 2,
               positionY: 3,
               positionX: 26,
               positionY: 20,
               condition: false,
            },
            {
               equipNo: "2305",
               imgType: "1",
               positionX: 4,
               positionY: 3,
               condition: false,
            },
            {
               equipNo: "2301",
               imgType: "1",
               positionX: 5,
               positionY: 3,
               condition: false,
            },
            //#endregion
         ],
         //#endregion
         //#region ç¬¬å››å±‚
         linescopy4: [
            //#region ç¬¬ä¸€æŽ’
            {
               equipNo: "1404",
               equipNo: "1021",
               imgType: "1",
               positionX: 1,
               positionY: 1,
               positionX: 0.6,
               positionY: 8,
               condition: false,
            },
            {
               equipNo: "1403",
               equipNo: "1022",
               imgType: "1",
               positionX: 2,
               positionY: 1,
               positionX: 0.6,
               positionY: 8,
               condition: false,
            },
            {
               equipNo: "2404",
               imgType: "1",
               positionX: 4,
               positionY: 1,
               condition: false,
            },
            {
               equipNo: "2403",
               imgType: "1",
               positionX: 5,
               positionY: 1,
               condition: false,
            },
            //#endregion
            //#region ç¬¬äºŒæŽ’
            {
               equipNo: "1405",
               equipNo: "1023",
               imgType: "1",
               positionX: 1,
               positionY: 2,
               positionX: 0.6,
               positionY: 20,
               condition: false,
            },
            {
               equipNo: "1402",
               equipNo: "1024",
               imgType: "1",
               positionX: 2,
               positionY: 2,
               positionX: 0.6,
               positionY: 20,
               condition: false,
            }, {
               equipNo: "2014",
               imgType: "1",
               positionX: 26,
               positionY: 8,
               condition: false,
            },
            {
               equipNo: "2405",
               equipNo: "2013",
               imgType: "1",
               positionX: 4,
               positionY: 2,
               positionX: 26,
               positionY: 8,
               condition: false,
            },
            {
               equipNo: "2402",
               equipNo: "2016",
               imgType: "1",
               positionX: 5,
               positionY: 2,
               condition: false,
            },
            //#endregion
            //#region ç¬¬ä¸‰æŽ’
            {
               equipNo: "1406",
               imgType: "1",
               positionX: 1,
               positionY: 3,
               positionX: 26,
               positionY: 20,
               condition: false,
            },
            {
               equipNo: "1401",
               equipNo: "2015",
               imgType: "1",
               positionX: 2,
               positionY: 3,
               positionX: 26,
               positionY: 20,
               condition: false,
            },
            {
               equipNo: "2405",
               imgType: "1",
               positionX: 4,
               positionY: 3,
               condition: false,
            },
            {
               equipNo: "2401",
               imgType: "1",
               positionX: 5,
               positionY: 3,
               condition: false,
            },
            //#endregion
         ],
         //#endregion
         //#region ç¬¬äº”层
         linescopy5: [
            //#region ç¬¬ä¸€æŽ’
            {
               equipNo: "1504",
               equipNo: "1031",
               imgType: "1",
               positionX: 1,
               positionY: 1,
               positionX: 0.6,
               positionY: 8,
               condition: false,
            },
            {
               equipNo: "1503",
               equipNo: "1032",
               imgType: "1",
               positionX: 2,
               positionY: 1,
               positionX: 0.6,
               positionY: 8,
               condition: false,
            },
            {
               equipNo: "2504",
               imgType: "1",
               positionX: 4,
               positionY: 1,
               condition: false,
            },
            {
               equipNo: "2503",
               imgType: "1",
               positionX: 5,
               positionY: 1,
               condition: false,
            },
            //#endregion
            //#region ç¬¬äºŒæŽ’
            {
               equipNo: "1505",
               equipNo: "1033",
               imgType: "1",
               positionX: 1,
               positionY: 2,
               positionX: 0.6,
               positionY: 20,
               condition: false,
            },
            {
               equipNo: "1502",
               equipNo: "1034",
               imgType: "1",
               positionX: 2,
               positionY: 2,
               positionX: 0.6,
               positionY: 20,
               condition: false,
            }, {
               equipNo: "2018",
               imgType: "1",
               positionX: 26,
               positionY: 8,
               condition: false,
            },
            {
               equipNo: "2505",
               equipNo: "2017",
               imgType: "1",
               positionX: 4,
               positionY: 2,
               positionX: 26,
               positionY: 8,
               condition: false,
            },
            {
               equipNo: "2502",
               equipNo: "2020",
               imgType: "1",
               positionX: 5,
               positionY: 2,
               condition: false,
            },
            //#endregion
            //#region ç¬¬ä¸‰æŽ’
            {
               equipNo: "1506",
               imgType: "1",
               positionX: 1,
               positionY: 3,
               positionX: 26,
               positionY: 20,
               condition: false,
            },
            {
               equipNo: "1501",
               equipNo: "2019",
               imgType: "1",
               positionX: 2,
               positionY: 3,
               positionX: 26,
               positionY: 20,
               condition: false,
            },
            {
               equipNo: "2505",
               imgType: "1",
               positionX: 4,
               positionY: 3,
               condition: false,
            },
            {
               equipNo: "2501",
               imgType: "1",
               positionX: 5,
               positionY: 3,
               condition: false,
            },
            //#endregion
         ],
         //#endregion
         linescopy6: [
            {
               equipNo: "1035",
               imgType: "1",
               positionX: 0.6,
               positionY: 8,
               condition: false,
            },
            {
               equipNo: "1036",
               imgType: "1",
               positionX: 0.6,
               positionY: 8,
               condition: false,
            },
            {
               equipNo: "1037",
               imgType: "1",
               positionX: 0.6,
               positionY: 20,
               condition: false,
            },
            {
               equipNo: "1038",
               imgType: "1",
               positionX: 0.6,
               positionY: 20,
               condition: false,
            }, {
               equipNo: "2022",
               imgType: "1",
               positionX: 26,
               positionY: 8,
               condition: false,
            },
            {
               equipNo: "2021",
               imgType: "1",
               positionX: 26,
               positionY: 8,
               condition: false,
            },
            {
               equipNo: "2024",
               imgType: "1",
               positionX: 26,
               positionY: 20,
               condition: false,
            },
            {
               equipNo: "2023",
               imgType: "1",
               positionX: 26,
               positionY: 20,
               condition: false,
            },
         ],
         StackerCrane: {
            Automatic: "",
            Fault: "",
            CurrentLayer: "",
            CurrentRow: "1",
            CurrentColumn: "",
            CurrentTaskNum: "",
            Running: "",
            DeviceName: "",
         },
         xValue1: 0,
         xValue2: 0,
         xValue3: 0,
         xValue4: 0,
         xValue5: 0,
         xValue6: 0,
         timer1: null, // å®šæ—¶å™¨å˜é‡
         timer2: null, // å®šæ—¶å™¨å˜é‡
         result1: 0,
         result1: 1,
         RGV01:{
            Automatic: "",
            Fault: "",
            LevelPoint:0,
            CurrentTaskNum: "",
            Running: "",
            DeviceName: "",
            DeviceCode:"RGV01",
         },
         RGV02:{
            Automatic: "",
            Fault: "",
            LevelPoint:1280,
            CurrentTaskNum: "",
            Running: "",
            DeviceName: "",
            DeviceCode:"RGV02",
         },
         RGV03:{
            Automatic: "",
            Fault: "",
            LevelPoint:0,
            CurrentTaskNum: "",
            Running: "",
            DeviceName: "",
            DeviceCode:"",
         },
      };
   },
   components: {
@@ -588,158 +602,119 @@
         });
         return Object.values(groups);
      },
      async increase() {
         this.xValue1 += 100;
         this.xValue2 += 100;
         // let abc = this.xValue + 100;
         // for (this.xValue; this.xValue < abc; this.xValue++) {
         //   await this.delay(10);
         if (this.xValue1 > 1120) {
            this.xValue1 = 1120;
            this.xValue2 = 1120;
         }
         this.$nextTick(() => {
            this.$refs.lineComponent1.moveDot(this.xValue1);
         });
         this.$nextTick(() => {
            this.$refs.lineComponent2.moveDot(this.xValue2);
         });
         // }
      updateRGVOne(){
        if(this.RGV01.Automatic=="联机模式"&&this.RGV01.Fault!="故障"&&this.RGV01.Running=="待机"){
          return 'dot-Automatic ';
        }
        else if(this.RGV01.Automatic=="联机模式"&&this.RGV01.Fault!="故障"&&this.RGV01.Running=="运行中"){
          return 'dot-Running ';
        }else if(this.RGV01.Fault=="故障"){
          return 'dot-Fault ';
        }else{
          return 'dot-Fault ';
        }
      },
      async decrease() {
         this.xValue1 -= 100;
         this.xValue2 -= 100;
         if (this.xValue1 < 0) {
            this.xValue1 = 0;
            this.xValue2 = 0;
         }
         // let abc = this.xValue - 100;
         // for (this.xValue; this.xValue > abc; this.xValue--) {
         //   await this.delay(10);
         this.$nextTick(() => {
            this.$refs.lineComponent1.moveDot(this.xValue1);
         });
         this.$nextTick(() => {
            this.$refs.lineComponent2.moveDot(this.xValue2);
         });
         // }
      updateRGVTwo(){
         if(this.RGV02.Automatic=="联机模式"&&this.RGV02.Fault!="故障"&&this.RGV02.Running=="待机"){
          return 'dot-Automatic ';
        }
        else if(this.RGV02.Automatic=="联机模式"&&this.RGV01.Fault!="故障"&&this.RGV02.Running=="运行中"){
          return 'dot-Running ';
        }else if(this.RGV02.Fault=="故障"){
          return 'dot-Fault ';
        }else{
          return 'dot-Fault ';
        }
      },
      delay(ms) {
         return new Promise(resolve => setTimeout(resolve, ms));
      updateRGV03(){
         if(this.RGV03.Automatic=="联机模式"&&this.RGV03.Fault!="故障"&&this.RGV03.Running=="待机"){
          return 'dot-Automatic ';
        }
        else if(this.RGV03.Automatic=="联机模式"&&this.RGV03.Fault!="故障"&&this.RGV03.Running=="运行中"){
          return 'dot-Running ';
        }else if(this.RGV03.Fault=="故障"){
          return 'dot-Fault ';
        }else{
          return 'dot-Fault ';
        }
      },
      startTimer() {
         // å¼€å¯å®šæ—¶å™¨ï¼Œæ¯3秒执行一次
         this.timer1 = setInterval(() => {
            // æ‰§è¡Œå®šæ—¶å™¨çš„æ“ä½œ
            this.methodofexecution(1)
            if (this.result1 <= 0) {
               this.result1 = 0
            }
            this.$nextTick(() => {
               this.$refs.lineComponent1.moveDot(this.result1);
            });
         }, 3000);
         // å¼€å¯å®šæ—¶å™¨ï¼Œæ¯3秒执行一次
         this.timer2 = setInterval(() => {
            // æ‰§è¡Œå®šæ—¶å™¨çš„æ“ä½œ
            this.methodofexecution(2)
            if (this.result2 <= 0) {
               this.result2 = 0
            }
            this.$nextTick(() => {
               this.$refs.lineComponent2.moveDot(this.result2);
            });
         }, 3000);
      },
      stopTimer() {
         // å…³é—­å®šæ—¶å™¨
         clearInterval(this.timer1);
         clearInterval(this.timer2);
      },
      //获取并计算堆垛机位置
      methodofexecution(equipNo, data, x) {
         if (x) {
            let WalkingLaserValue = data.r_Stack_WalkingLaserValue;
            let Value = ((WalkingLaserValue - 1200) / 50) + 10
            if (equipNo === 1) {
               this.result1 = Value
            }
            else if (equipNo === 2) {
               this.result2 = Value
            }
         } else {
            // this.$message({
            //    type: "error",
            //    message: "x.message",
            // });
         }
      }
   },
   computed: {
   },
   mounted() {
      // åˆå§‹åŒ–页面时开启定时器
      // this.startTimer();
      // // ç›‘听路由变化
      // this.$router.beforeEach((to, from, next) => {
      //   this.stopTimer(); // å…³é—­å®šæ—¶å™¨
      //   next(); // ç»§ç»­è·¯ç”±å¯¼èˆª
      // });
   },
   created() {
      eventBus.on('stackerData', eventData => {
         // æ›´æ–°ç»„件的数据
         this.methodofexecution(parseInt(eventData.plcName, 10), eventData.data, true)
         const lineComponentsMap = {
            1: 'lineComponent1',
            2: 'lineComponent2',
         const stackerComponentsMap = {
            "SC01": 'stacker1',
            "SC02": 'stacker2',
            "SC03": 'stacker3',
            "SC04": 'stacker4',
            "SC05": 'stacker5',
            "SC06": 'stacker6',
         };
         const resultsMap = {
            1: this.result1,
            2: this.result2,
         };
         const componentKey = lineComponentsMap[eventData.plcName];
         const result = resultsMap[eventData.plcName];
         if (componentKey && result !== undefined) {
         const componentKey = stackerComponentsMap[eventData.data.deviceCode];
         if (componentKey) {
            this.StackerCrane.Automatic=eventData.data.automatic;
            this.StackerCrane.Fault=eventData.data.fault;
            this.StackerCrane.Running=eventData.data.running;
            this.StackerCrane.CurrentColumn=eventData.data.currentColumn;
            this.StackerCrane.CurrentLayer=eventData.data.currentLayer;
            this.StackerCrane.LevelPoint=eventData.data.levelPoint;
            this.StackerCrane.DeviceName=eventData.data.deviceName;
            this.$nextTick(() => {
               this.$refs[componentKey].moveDot(result);
               this.$refs[componentKey].moveDot(this.StackerCrane);
            });
         }
      });
      eventBus.on('RGVData', eventData => {
         if(eventData.data.deviceCode=="RGV01"){
            this.RGV01.Automatic=eventData.data.automatic;
            this.RGV01.Fault=eventData.data.fault;
            this.RGV01.Running=eventData.data.running;
            this.RGV01.LevelPoint=eventData.data.levelPoint;
            this.RGV01.DeviceName=eventData.data.deviceName;
            console.log(this.RGV01.LevelPoint)
         }else if(eventData.data.deviceCode=="RGV02"){
            this.RGV02.Automatic=eventData.data.automatic;
            this.RGV02.Fault=eventData.data.fault;
            this.RGV02.Running=eventData.data.running;
            this.RGV02.LevelPoint=eventData.data.levelPoint;
            this.RGV02.DeviceName=eventData.data.deviceName;
         }else if(eventData.data.deviceCode=="RGV03"){
            this.RGV03.Automatic=eventData.data.automatic;
            this.RGV03.Fault=eventData.data.fault;
            this.RGV03.Running=eventData.data.running;
            this.RGV03.LevelPoint=eventData.data.levelPoint;
            this.RGV03.DeviceName=eventData.data.deviceName;
         }
      });
      eventBus.on("LineData", eventData => {
         const stationMap = {
            "11": this.linescopy1,
            "10": this.linescopy1,
            "12": this.linescopy2,
            "22": this.linescopy2,
            "13": this.linescopy3,
            "23": this.linescopy3,
            "14": this.linescopy4,
            "24": this.linescopy4,
            "15": this.linescopy5,
            "25": this.linescopy5
            "SC01": this.linescopy1,
            "SC02": this.linescopy2,
            "SC03": this.linescopy3,
            "SC04": this.linescopy4,
            "SC05": this.linescopy5,
            "SC06": this.linescopy6,
            "SC07": this.linescopy7,
         };
         var station = eventData.station_code;
         var layer = station.substring(0, 2);
         if (stationMap[layer]) {
            stationMap[layer].forEach((line) => {
         var station = eventData.stationChildCode;
         if (stationMap[eventData.roadway]) {
            stationMap[eventData.roadway].forEach((line) => {
               if (line.equipNo === station) {
                  line.condition = eventData.r_Line_HasPallet === 1;
                  line.condition = eventData.inStock;
               }
            })
         }
      })
      for (let i = 1; i < 6; i++) {
         this.methodofexecution(i, null, false)
      }
   },
};
</script>
@@ -749,8 +724,7 @@
  margin-bottom: 10px;
} */
.title {
   height: 800px;
  margin-left: 20px;
   height: 1500px;
}
.cardWidth {
@@ -779,7 +753,7 @@
.stackerDiv {
   border: 1px solid rgba(0, 195, 255, 0.822);
   width: 1600px;
   width: 980px;
   padding-left: 3px;
}
@@ -788,4 +762,77 @@
   color: rgba(0, 195, 255, 0.822);
   margin-bottom: 12px;
}
.dot-Running {
  position: absolute;
  top: -5px;
  width: 20px;
   height: 20px;
  border-radius: 50%;
  background-color: #409eff;
  transition: transform 0.3s ease;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 9px;
  font-weight: bold;
  color: white;
}
.dot-Automatic {
  position: absolute;
  top: -5px;
  width: 20px;
   height: 20px;
  border-radius: 50%;
  background-color: #0df705;
  transition: transform 0.3s ease;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 9px;
  font-weight: bold;
  color: white;
}
.dot-Fault {
  position: absolute;
  top: -5px;
  width: 20px;
   height: 20px;
   /* right:0px; */
  border-radius: 50%;
  background-color: #f80410;
  transition: transform 0.3s ease;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 9px;
  font-weight: bold;
  color: white;
}
.line-container {
   position: relative;
   height: 1280px;
   background-color: #ecf5ff;
   width: 20px;
   top:30px;
   left:200px
}
.RGVline {
   position: absolute;
   top: 0;
   left: 0;
   right: 0;
   height: 2px;
   background-color: #a0cfff;
}
.line {
   position: absolute;
   top: 0;
   left: 0;
   right: 0;
   height: 2px;
   background-color: #a0cfff;
}
</style>