huangxiaoqiang
2025-07-30 4110b7475eccf48283ff22c0e4545850849d445d
ÏîÄ¿´úÂë/WCS/WIDESEAWCS_Client/src/views/Home.vue
@@ -1,4 +1,7 @@
<template>
   <div>
      111
   </div>
   <div class="title">
      <el-row :gutter="20" style="height:100%">
         <el-col :span="8">
@@ -8,8 +11,10 @@
               <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 :class="updateRGVOne()" :style="{ marginTop: RGV01.LevelPoint + 'px' }"
                        @click="mouseClickRGVFirst">1</div>
                     <div :class="updateRGVTwo()" :style="{ marginTop: RGV02.LevelPoint + 'px' }"
                        @click="mouseClickSecond">2</div>
                  </div>
               </el-col>
               <el-col :span="8">
@@ -18,7 +23,8 @@
                        <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" />
                              :positionY="line.positionY" :condition="line.condition"
                              url="api/Equipment/GetLineInfoByNo" />
                        </div>
                     </div>
                     <div style="margin-top: 118px;"></div>
@@ -26,7 +32,8 @@
                        <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" />
                              :positionY="line.positionY" :condition="line.condition"
                              url="api/Equipment/GetLineInfoByNo" />
                        </div>
                     </div>
                     <div style="margin-top: 115px;"></div>
@@ -34,7 +41,8 @@
                        <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" />
                              :positionY="line.positionY" :condition="line.condition"
                              url="api/Equipment/GetLineInfoByNo" />
                        </div>
                     </div>
                     <div style="margin-top: 112px;"></div>
@@ -100,57 +108,6 @@
               </div>
            </div>
         </el-col>
         <!-- <el-col :span="8">
            <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: 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">
@@ -167,9 +124,110 @@
         </el-col>
      </el-row>
   </div>
   <el-dialog v-model="RGVFirst" title="RGV信息查看" :before-close="handleClose">
      <el-form ref="$form" :model="StackerCrane" label-position="left" label-width="120px" size="medium">
         <el-row :gutter="20" type="flex" justify="start" align="top" tag="div">
            <el-col :span="12" :offset="0" :push="0" :pull="0" tag="div">
               <el-form-item label="设备编号:">
                  <!-- <el-input v-model="equipNo"></el-input> -->
                  <j-el-description :value="RGV01.DeviceName" type="primary" ellipsis></j-el-description>
               </el-form-item>
            </el-col>
            <el-col :span="12" :offset="0" :push="0" :pull="0" tag="div">
               <el-form-item label="设备状态:">
                  <j-el-description :value="RGV01.Fault" type="primary" ellipsis></j-el-description>
               </el-form-item>
            </el-col>
         </el-row>
         <el-row :gutter="20" type="flex" justify="start" align="top" tag="div">
            <el-col :span="12" :offset="0" :push="0" :pull="0" tag="div">
               <el-form-item label="工作模式:">
                  <j-el-description :value="RGV01.Automatic" type="primary" ellipsis></j-el-description>
               </el-form-item>
            </el-col>
            <el-col :span="12" :offset="0" :push="0" :pull="0" tag="div">
               <el-form-item label="任务号:">
                  <j-el-description :value="RGV01.CurrentTaskNum" type="primary" ellipsis></j-el-description>
               </el-form-item>
            </el-col>
         </el-row>
         <el-row :gutter="20" type="flex" justify="start" align="top" tag="div" style="margin-bottom: 10px;">
            <el-col :span="12" :offset="0" :push="0" :pull="0" tag="div">
               <el-form-item label="作业状态:">
                  <j-el-description :value="RGV01.Running" type="primary" ellipsis></j-el-description>
               </el-form-item>
            </el-col>
            <el-col :span="12" :offset="0" :push="0" :pull="0" tag="div">
               <el-form-item label="当前水平位置:">
                  <j-el-description :value="RGV01.LevelPoint" type="primary" ellipsis></j-el-description>
               </el-form-item>
            </el-col>
         </el-row>
         <el-divider />
         <h4 style="margin-bottom: 50px;">手动操作</h4>
         <el-form ref="form" :model="formFirst" label-width="90px">
            <el-row :gutter="20" type="flex" justify="start" align="top" tag="div">
               <el-col :span="16" :offset="0" :push="0" :pull="0" tag="div">
                  <el-form-item label="任务命令" prop="TargetAddress">
                     <el-select size="large" v-model="formFirst.TaskType" placeholder="请选择任务命令">
                        <el-option label="入库" value="17" />
                        <el-option label="出库" value="18" />
                        <el-option label="移库" value="20" />
                        <el-option label="取货" value="24" />
                        <el-option label="放货" value="48" />
                     </el-select>
                  </el-form-item>
               </el-col>
            </el-row>
            <el-row :gutter="20" type="flex" justify="start" align="top" tag="div">
               <el-col :span="16" :offset="0" :push="0" :pull="0" tag="div">
                  <el-form-item label="起点行列层:">
                     <el-input size="large" v-model="formFirst.SourceAddress" style="width: 800px"
                        placeholder="请输入起点行列层" />
                  </el-form-item>
               </el-col>
            </el-row>
            <el-row :gutter="20" type="flex" justify="start" align="top" tag="div">
               <el-col :span="16" :offset="0" :push="0" :pull="0" tag="div">
                  <el-form-item label="终点行列层:">
                     <el-input size="large" v-model="formFirst.TargetAddress" style="width: 800px"
                        placeholder="请输入终点行列层" />
                  </el-form-item>
               </el-col>
            </el-row>
         </el-form>
         <el-divider />
         <el-row :gutter="20" type="flex" justify="start" align="top" tag="div">
            <el-col :span="8" :offset="0" :push="0" :pull="0" tag="div">
               <el-button type="primary" size="small" plain @click="start">
                  <i class="el-icon-check">启动</i>
               </el-button>
            </el-col>
            <el-col :span="8" :offset="0" :push="0" :pull="0" tag="div">
               <el-button type="warning" size="small" plain @click="reset">
                  <i class="el-icon-check">复位</i>
               </el-button>
            </el-col>
            <el-col :span="8" :offset="0" :push="0" :pull="0" tag="div">
               <el-button type="danger" size="small" plain @click="emergencyStop">
                  <i class="el-icon-check">急停</i>
               </el-button>
            </el-col>
         </el-row>
      </el-form>
      <template #footer>
         <div class="dialog-footer">
            <el-button @click="RGVFirst = false">取消</el-button>
            <el-button type="primary" @click="RGVFirst = false">
               ç¡®è®¤
            </el-button>
         </div>
      </template>
   </el-dialog>
</template>
<script>
@@ -179,7 +237,7 @@
import LineInfoCopy from "./LineInfocopy.vue";
import LineComponent from './LineComponent.vue';
import eventBus from "../uitils/eventBus";
import JElDescription from "./JElDescription";
export default {
   data() {
@@ -542,7 +600,12 @@
            CurrentTaskNum: "",
            Running: "",
            DeviceName: "",
            DeviceCOde: "",
            StackerAlarm:"",
         },
         RGVFirst: false,
         RGVSecond: false,
         RGVThird: false,
         xValue1: 0,
         xValue2: 0,
         xValue3: 0,
@@ -551,38 +614,45 @@
         xValue6: 0,
         timer1: null, // å®šæ—¶å™¨å˜é‡
         timer2: null, // å®šæ—¶å™¨å˜é‡
         RGV01:{
         RGV01: {
            Automatic: "",
            Fault: "",
            LevelPoint:0,
            LevelPoint: 0,
            CurrentTaskNum: "",
            Running: "",
            DeviceName: "",
            DeviceCode:"RGV01",
            DeviceCode: "RGV01",
         },
         RGV02:{
         RGV02: {
            Automatic: "",
            Fault: "",
            LevelPoint:1280,
            LevelPoint: 1280,
            CurrentTaskNum: "",
            Running: "",
            DeviceName: "",
            DeviceCode:"RGV02",
            DeviceCode: "RGV02",
         },
         RGV03:{
         RGV03: {
            Automatic: "",
            Fault: "",
            LevelPoint:0,
            LevelPoint: 0,
            CurrentTaskNum: "",
            Running: "",
            DeviceName: "",
            DeviceCode:"",
            DeviceCode: "",
         },
         formFirst: {
            TaskType: "",
            SourceAddress: "",
            TargetAddress: "",
            DeviceCode: "",
         },
      };
   },
   components: {
      LineInfoCopy,
      LineComponent,
      JElDescription,
   },
   methods: {
      groupedLines(linescopy) {
@@ -599,42 +669,51 @@
         });
         return Object.values(groups);
      },
      updateRGVOne(){
        if(this.RGV01.Automatic&&!this.RGV01.Fault&&!this.RGV01.Running){
          return 'dot-Automatic ';
        }
        else if(!this.RGV01.Fault&&this.RGV01.Running){
          return 'dot-Running ';
        }else if(this.RGV01.Fault){
          return 'dot-Fault ';
        }else{
          return 'dot-Fault ';
        }
      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 ';
         }
      },
      updateRGVTwo(){
        if(this.RGV02.Automatic&&!this.RGV02.Fault&&!this.RGV02.Running){
          return 'dot-Automatic ';
        }
        else if(!this.RGV02.Fault&&this.RGV02.Running){
          return 'dot-Running ';
        }else if(this.RGV02.Fault){
          return 'dot-Fault ';
        }else{
          return 'dot-Fault ';
        }
      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 ';
         }
      },
      updateRGV03(){
        if(this.RGV03.Automatic&&!this.RGV03.Fault&&!this.RGV03.Running){
          return 'dot-Automatic ';
        }
        else if(!this.RGV03.Fault&&this.RGV03.Running){
          return 'dot-Running ';
        }else if(this.RGV03.Fault){
          return 'dot-Fault ';
        }else{
          return 'dot-Fault ';
        }
      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 ';
         }
      },
      mouseClickRGVFirst() {
         this.fullscreenLoading = true;
         this.RGVFirst = true;
         this.fullscreenLoading = false;
      }, mouseClickSecond() {
         this.fullscreenLoading = true;
         this.RGVSecond = true;
         this.fullscreenLoading = false;
      }
   },
   computed: {
@@ -643,7 +722,7 @@
   },
   created() {
      eventBus.on('stackerData', eventData => {
         const stackerComponentsMap = {
            "SC01": 'stacker1',
            "SC02": 'stacker2',
@@ -654,13 +733,16 @@
         };
         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.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.StackerCrane.DeviceCode = eventData.data.deviceCode;
            this.StackerCrane.StackerAlarm = eventData.data.stackerAlarm;
            this.$nextTick(() => {
               this.$refs[componentKey].moveDot(this.StackerCrane);
            });
@@ -668,26 +750,25 @@
      });
      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;
         if (eventData.data.deviceCode == "RGV01") {
            this.RGV01.Automatic = x.Automatic == null ? "故障" : x.Automatic;
            this.RGV01.Fault = x.Fault == null ? "故障" : x.Fault;
            this.RGV01.Running = x.Running == null ? "故障" : x.Running;
            this.RGV01.LevelPoint = x.LevelPoint;
            this.RGV01.DeviceName = x.DeviceName;
         } else if (eventData.data.deviceCode == "RGV02") {
            this.RGV02.Automatic = x.Automatic == null ? "故障" : x.Automatic;
            this.RGV02.Fault = x.Fault == null ? "故障" : x.Fault;
            this.RGV02.Running = x.Running == null ? "故障" : x.Running;
            this.RGV02.LevelPoint = x.LevelPoint;
            this.RGV02.DeviceName = x.DeviceName;
         } else if (eventData.data.deviceCode == "RGV03") {
            this.RGV03.Automatic = x.Automatic == null ? "故障" : x.Automatic;
            this.RGV03.Fault = x.Fault == null ? "故障" : x.Fault;
            this.RGV03.Running = x.Running == null ? "故障" : x.Running;
            this.RGV03.LevelPoint = x.LevelPoint;
            this.RGV03.DeviceName = x.DeviceName;
         }
      });
@@ -759,52 +840,54 @@
   color: rgba(0, 195, 255, 0.822);
   margin-bottom: 12px;
}
.dot-Running {
  position: absolute;
  top: -5px;
  width: 20px;
   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;
   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;
   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;
   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;
   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;
   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;
}
@@ -813,9 +896,10 @@
   height: 1280px;
   background-color: #ecf5ff;
   width: 20px;
   top:30px;
   left:200px
   top: 30px;
   left: 200px
}
.RGVline {
   position: absolute;
   top: 0;
@@ -824,6 +908,7 @@
   height: 2px;
   background-color: #a0cfff;
}
.line {
   position: absolute;
   top: 0;
@@ -832,4 +917,7 @@
   height: 2px;
   background-color: #a0cfff;
}
</style>
:deep(.j-el-description) {
   background-color: #e40e0e;
}</style>