feat: 看板bug修复

songshankun

2023-10-23 c36d7594f155a079a80ef8b697219695184cea31

feat: 看板bug修复

1. 修复点击完成按钮弹窗中的取消按钮不自动关闭弹窗的问题
2. 调整任务数据的目标数和加工数来源, 改为从plc终端中读取
3. 调整工艺模型对应图标
4. 修复生产准备倒计时未换行的问题
5. 取消加工数目标数单位的展示
6. 设备状态修改为根据当前通道展示状态(左/右/双通道)展示对应的设备状态(左/右/双设备同时)
7. 修复当前通道没有任务的情况下进度条展示为100%的问题
8. 工序区状态展示,添加新状态"待机"展示

 public/setting.png

 src/components/TaskControlModal.vue

@@ -136,8 +136,12 @@
                    </div>
                  </template>
                  <div class="gif-right">
                    ----- 剩余时间 -----
                    <span>00:00:{{ 30 - Number(num) < 10 ? 0 : '' }}{{ 30 - Number(num) }}</span>
                    <div>
                      ----- 剩余时间 -----
                    </div>
                    <div>
                      <span>00:00:{{ 30 - Number(num) < 10 ? 0 : '' }}{{ 30 - Number(num) }}</span>
                    </div>
                  </div>
                </div>
                {{ message }}

 src/views/visualization.vue

@@ -104,7 +104,8 @@
                      style="font-size: 35px; font-weight: 600"
                      class="color_green"
                    >
                      {{ processingStatistics(taskData).finishNumber }}{{ taskData.Order.unit }}
                      {{ processingStatistics(taskData).finishNumber }}
<!--                      {{ taskData.Order.unit }}-->
                    </dd>
                  </dl>
                </div>
@@ -117,7 +118,8 @@
                      style="font-size: 35px; font-weight: 600"
                      class="color_green"
                    >
                      {{ processingStatistics(taskData).totalNumber }}{{ taskData.Order.unit }}
                      {{ processingStatistics(taskData).totalNumber }}
<!--                      {{ taskData.Order.unit }}-->
                    </dd>
                  </dl>
                </div>
@@ -125,8 +127,8 @@
            </div>
            <div class="content_right">
              <div class="gif" v-if="taskData.Procedure.ID" @click="processModelClick(taskData,index)">
                    <img v-if="taskData.isUpdateIcon"  src="../../public/shan.gif" />
                    <span v-else class="yuandian"></span>
                    <img class="blink" v-if="taskData.isUpdateIcon"  src="../../public/shan.gif" />
                    <span v-else class="tip"></span>
               </div>
              <el-descriptions :column="(activeName == 1||activeName == 3) ? 2 : 1" :colon="true">
                <el-descriptions-item label="产品名称">{{
@@ -304,7 +306,7 @@
                      </div>
                      <div class="card_top-2">
                        <div style="line-height: 45px; text-align: center">
                          {{ taskData.Procedure.Status==3?'生产完成':'生产中' }}
                          {{ taskData?.plcStatus === 3 ? '待机' : (taskData.Procedure.Status==3?'生产完成':'生产中') }}
                        </div>
                        <!-- <span class="card-top-r-t">完成进度：50%</span>
                          <span class="card-top-r-b">12月28日 08:24</span> -->
@@ -354,10 +356,11 @@
                  class="button-finish"
                  v-model="finishShow['finishShow&'+index]"
                  trigger="click"
                  :ref="'popoverRef_' + index"
                >
                  <p><i class="el-icon-error" style="color:red;margin-right:5px;"/>请确认是否已完成该生产任务?</p>
                  <div style="text-align: right; margin: 0">
                    <el-button size="mini" @click="finishShow['finishShow&'+index] = false">
                    <el-button size="mini" @click="closePopover(index)">
                      取消</el-button
                    >
                    <el-button
@@ -465,26 +468,28 @@
        </div>
        <div class="right-top-m">
          设备状态:
          <!-- 1断开2生产3待机 -->
          <span style="position: relative" v-if="plcStatus" >
            <el-popover
              v-if="plcStatus == 1&&plcNotConnected"
              width="180"
              :content="plcNotConnected"
              placement="top-end"
              trigger="click"
            >
              <span slot="reference">
                <img  src="../../public/duan.png" />
                断开
          <template v-for="(plcStatus, channel) in displayPLCStatus">
             <!-- 1断开2生产3待机 -->
            <span class="plc-status" style="position: relative" v-if="plcStatus">
              <el-popover
                v-if="plcStatus === 1&&plcNotConnected"
                width="180"
                :content="plcNotConnected"
                placement="top-end"
                trigger="click"
              >
                <span slot="reference">
                  <img src="../../public/duan.png"/>
                  断开
                </span>
              </el-popover>
              <span v-else>
                <img v-if="plcStatus === 1&&!plcNotConnected" src="../../public/duan.png"/>
                <img v-else src="../../public/lian.png"/>
                {{ plcStatus === 1 ? '断开' : (plcStatus === 2 ? '生产中' : '待机') }}
              </span>
            </el-popover>
            <span v-else>
              <img  v-if="plcStatus == 1&&!plcNotConnected"  src="../../public/duan.png" />
              <img  v-else src="../../public/lian.png" />
              {{ plcStatus==1?'断开':(plcStatus==2?'生产中':'待机') }}
            </span>
          </span>
          </template>
        </div>
        <div class="right-top-m-btn">
          <!-- <el-button type="primary" @click="controlClick"> 控制</el-button> -->
@@ -726,7 +731,7 @@
      cutdownTimer: null,
      ProcessModelTimer: null,
      TaskCount:0,
      plcStatus:0,
      PLCStatusMap:{0:0,1:0},
      isTipShow:false,
      // isFinsh:0,
      safeProduce:'',
@@ -781,24 +786,31 @@
    //   }
    // }
  },
  methods: {
    processingStatistics(taskData){
      const status = taskData?.Procedure?.Status;
      // 如果status = 2 加工中, 则加工数和目标数应取轮询接口中的 finishNumber 和 totalNumber
      // 如果status = 1 未开始, 目标数 取 taskData.Order.amount  加工数取 0
      // 如果status = 3 已完成, 目标数和加工数都取 amount
      let finishNumber = 0;
      let totalNumber = 0;
      if (status === 1){
        totalNumber = taskData?.Order?.amount ?? 0
        finishNumber = 0
      }else if (status === 2){
        totalNumber = taskData?.totalNumber ?? 0
        finishNumber = taskData?.finishNumber ?? 0
      }else if (status === 3){
        totalNumber = taskData?.Order?.amount  ?? 0
        finishNumber = taskData?.Order?.amount ?? 0
  computed:{
    displayPLCStatus(){
      let PLCStatus = []
      if (this.activeName===1){
        PLCStatus =[this.PLCStatusMap[0]]
      }else if (this.activeName===2){
        PLCStatus =[this.PLCStatusMap[0],this.PLCStatusMap[1]]
      }else if (this.activeName===3){
        PLCStatus =[this.PLCStatusMap[1]]
      }else {
        return []
      }

      return PLCStatus
    }
  },
  methods: {
    /**
     * 从任务中获取加工数和目标数
     * @param taskData
     * @return {{totalNumber: number, finishNumber: number}}
     */
    processingStatistics(taskData){
      const totalNumber = taskData?.totalNumber ?? 0
      const finishNumber = taskData?.finishNumber ?? 0

      return {
        /** 目标数 */
@@ -809,10 +821,13 @@
    },
    /**
     * 计算生产进度
     * @param statistics
     * @param {{totalNumber: number, finishNumber: number}} statistics
     * @return {number}  进度,0~100
     */
    calculateProgress(statistics){
      if (statistics.finishNumber === 0){
        return 0
      }
      if (statistics.finishNumber === statistics.totalNumber){
        return 100
      }
@@ -1152,6 +1167,7 @@
            this.TasksCopy[i].outputMaterials = [];
            this.TasksCopy[i].finishNumber = 0;
            this.TasksCopy[i].totalNumber = 0;
            this.TasksCopy[i].plcStatus = 0;
            this.TasksCopy[i].number=0;
            this.TasksCopy[i].isUpdateIcon=false;
            this.finishShow['finishShow&'+i]=false
@@ -1268,7 +1284,8 @@
            if (res.code == 200) {
              this.TasksCopy[i].finishNumber = res.data?.finishNumber ?? 0;
              this.TasksCopy[i].totalNumber = res.data?.totalNumber ?? 0;
              this.plcStatus = res.data?.plcStatus ?? 0
              this.TasksCopy[i].plcStatus = res.data?.plcStatus ?? 0
              this.PLCStatusMap[i] = res.data?.plcStatus ?? 0
            }
            this.resprocInfoTimer=res;
          });
@@ -1311,6 +1328,15 @@
      } else {
        this.$message.error("当前设备没有工序！");
      }
    },

    /**
     * 关闭 tooltip
     * @param index
     */
    closePopover(index){
      this.finishShow['finishShow&'+index] = false
      this.$refs?.['popoverRef_' + index]?.[0]?.doClose()
    },
    getRandomNumber(min, max) {
      return Math.floor(Math.random() * (max - min + 1) + min);
@@ -1602,6 +1628,28 @@
        // margin-top:-5px;
        vertical-align: middle;
      }


.tip {
  display:inline-block;
  // background: #15d815;
  background:red;
  border-radius: 50%;
  // margin-top:-5px;
  vertical-align: middle;
}
.blink{
  display: inline-block;
  width: 14px;
  height: 14px;
}
.tip, .blink{
  position: absolute;
  top: -6px;
  right: -6px;
  width: 14px;
  height: 14px;
}
.bottom_list {
  position: relative;
  padding: 10px;
@@ -1810,15 +1858,18 @@
        border-radius: 6px;
        position:relative;
        .gif{
          background: url("../../public/setting.png") no-repeat;
          background-size:100% 100%;
          position:absolute;
          right:15px;
          top:10px;
          width:35px;
          height: 35px;
          vertical-align: middle;
          cursor:pointer;
          img{
            width:100%;
          }
          //img{
          //  width:100%;
          //}
        }
        // background: #233b9e;
        .el-descriptions-row{
@@ -2190,4 +2241,24 @@
    padding: 12px;
  }
}
.plc-status{
  margin-right: 24px;
  position: relative;
  display: inline-block;
  height: 50px;
  &:after{
    content: '';
    position: absolute;
    top: 50%;
    right: -12px;
    margin-top: -15px;
    border-right: 2px solid #ffffff;
    height: 30px;
  }
}
.plc-status:last-child{
  &:after{
    display: none;
  }
}
</style>