2个任务的时候 显示无任务图标

haoxuan

2023-09-15 161c265ed69fc7efb7f4abf8de15c4915d7c282d

 src/views/visualization.vue

@@ -1,8 +1,8 @@

<template>
  <div class="home">
    <!-- v-if="Object.keys(taskData).length > 0 && taskData.Procedure.ID" -->
    <template>
    <!--  -->
    <template v-if="Tasks&&Tasks.length>0">
      <div class="left">
        <p class="title">
          <span
@@ -27,7 +27,7 @@
            style="float: right;margin-right:20px;font-size:28px;line-height:25px;"
            @click="taskClick"
          >
          <el-badge :value="TaskCount"  :class="TaskCount==0?'item color_666':'item color_fff'">
          <el-badge :value="TaskCount"  :class="(TaskCount==0||isTipShow)?'item color_666':'item color_fff'">
            <i   class="el-icon-chat-dot-round" />
          </el-badge>
        </span>
@@ -37,6 +37,7 @@
          v-for="(taskData, index) in Tasks"
          :key="index"
        >
        <template v-if="taskData">
          <div class="gong-date">
            工序运行时间：{{ getFormatTime(taskData.Procedure.startTime) }}
          </div>
@@ -152,8 +153,10 @@
                        ? parseInt(
                            (taskData.finishNumber / taskData.Order.amount) *
                              100
                          )
                        : 0
                        )>100?100:parseInt(
                            (taskData.finishNumber / taskData.Order.amount) *
                              100
                        ): 0
                    "
                  ></el-progress>
                </el-descriptions-item>
@@ -274,7 +277,11 @@
                                    (taskData.finishNumber /
                                      taskData.Order.amount) *
                                      100
                                  )
                                )>100?100:parseInt(
                                    (taskData.finishNumber /
                                      taskData.Order.amount) *
                                      100
                                )
                                : 0
                            "
                            :show-text="false"
@@ -293,8 +300,8 @@
                      <!-- <div class="card_content">
                        
                      </div> -->
                      <div class="card_top-4">
                        <div>工艺编号：{{ list.number }}</div>
                      <div :class="activeName==1?'card_top-4 font_size_20px':'card_top-4'">
                        <div>工艺编号：<div >{{ list.number }}</div></div>
                        <!-- <div
                          style="
                            font-size: 14px;
@@ -417,6 +424,13 @@
              >
            </div>
          </div>
        </template>
          <!-- 2个任务的时候，第二个任务为空的时候显示 -->
          <template
              v-if="activeName == 2 &&(!taskData||Object.keys(taskData).length==0)"
            >
            <el-empty description="暂无任务..."></el-empty>
          </template>
        </div>
      </div>
      <div class="right">
@@ -471,9 +485,12 @@
                style="font-size: 20px; font-weight: 600; margin-right: 10px"
                >{{ item.workerName || "" }}</span
              >
              <span>{{ item.phoneNum || "" }}</span>
              <!-- <span>{{ item.phoneNum || "" }}</span> -->
              <span class="color_yellow"><i class="el-icon-star-on" /><i class="el-icon-star-on" /><i class="el-icon-star-on" /><i class="el-icon-star-on" /><i class="el-icon-star-on" /></span>
            </dl>
           
          </div>
         
          <!-- <div
            style="
              width: 100%;
@@ -498,8 +515,8 @@
        </div>
      </div>
    </template>
    <!-- v-else -->
    <template>
    <!--  -->
    <template v-else>
      <div class="home-img-box">
        <div class="bg-title">
          <img src="../../public/bg-title.png" />
@@ -539,6 +556,7 @@
      :taskData="taskData"
      :Order="taskData.Order"
      @getSetProductNumber="getTaskInfo"
      @isTip="isTip"
    />
  </div>
</template>
@@ -566,7 +584,7 @@
  },
  data() {
    return {
      activeName: 1,
      activeName: 2,
      progress: 70, //进度
      passrate: 30, //合格率
      production: 25, //生产中
@@ -665,6 +683,7 @@
      cutdownTimer: null,
      TaskCount:0,
      plcStatus:1,
      isTipShow:false,
    };
  },
  mounted() {
@@ -688,6 +707,9 @@
      }else{
        this.$message.error('目前没有任务！')
      }
    },
    isTip(val){
      this.isTipShow=val
    },
    cutClick(val) {
      this.activeName = val;
@@ -841,6 +863,7 @@
           })
          }
          this.Tasks = res.data.Tasks ? res.data.Tasks : [];
          
          this.TaskCount=res.data.TaskCount?res.data.TaskCount:0
          this.workers=res.data.workers?res.data.workers:[]
          if (this.Tasks.length == 0) {
@@ -900,6 +923,10 @@
            }, 60000);
          }
        }
        debugger
        if(this.activeName==2){
            this.Tasks[1]=null
        }
      });
    },
    getStartArr(){
@@ -913,17 +940,19 @@
    },
    getProgressInfo() {
      for (let i in this.Tasks){
        getProgress({
          position: Number(i),
          procedureId: this.Tasks[i].Procedure.ID,
        }).then((res) => {
          if (res.code == 200) {
            this.Tasks[i].finishNumber = res.data.finishNumber
              ? res.data.finishNumber
              : 0;
              this.plcStatus=res.data.plcStatus?res.data.plcStatus:1
          }
        });
        if(this.Tasks[i].Procedure.ID){
          getProgress({
            position: Number(i),
            procedureId: this.Tasks[i].Procedure.ID,
          }).then((res) => {
            if (res.code == 200) {
              this.Tasks[i].finishNumber = res.data.finishNumber
                ? res.data.finishNumber
                : 0;
                this.plcStatus=res.data.plcStatus?res.data.plcStatus:1
            }
          });
        }
      }
      
    },
@@ -975,6 +1004,17 @@
</script>

<style lang="scss">
.color_yellow{
  color:yellow;
}
.el-empty{
  height:100%;
  .el-empty__description p{
    font-size:16px!important;
    color:#fff!important;
  }
}

.active-one {
  width: 100%;
  height: calc(100% - 100px);
@@ -990,6 +1030,9 @@
  .bottom {
    height: calc(100% - 410px);
  }
  .font_size_20px{
    font-size:20px!important;
  }
}
.active-two {
  width: calc(50% - 10px);
@@ -1002,6 +1045,7 @@
    box-sizing: border-box;
    border-right: 1px solid #eee;
  }
  
  .small_title {
    margin-bottom: 30px;
  }
@@ -1463,8 +1507,6 @@
          color: #fff;
          font-size: 12px;
          line-height: 45px;
          float: left;

          > div {
            margin-left: 12px;
            position: relative;
@@ -1476,15 +1518,20 @@
            }
          }
        }
        .card_top{
          float: left;
        }
        .card_top-4 {
          width: calc(100% - 20px);
          padding: 0 10px;
          height: 70px;

          line-height: 70px;
          padding: 10px 10px;
          color: #fff;
          background: rgb(19, 35, 90);
          font-size: 20px;
          font-size: 14px;
          height:50px;
          line-height: 25px;
          >div{
            margin-left:0px;
          }
        }
        .card-info-box {
          position: absolute;