haoxuan
2023-10-08 e51c1799ce6e4f0a3d84ceb8870cc58507c5f422
src/views/visualization.vue
@@ -275,11 +275,12 @@
                  v-for="(item, index) in taskData.procedureList"
                >
                  <div
                    class="card"
                    :key="index2"
                    v-for="(list, index2) in item"
                  >
                    <template v-if="list.name == '工序'">
                    <div
                      class="card"
                      v-if="list.name == '工序'">
                      <div class="card_content">
                        <div class="card_contentLeft color_blue font_dian">
                          <!-- {{ list.deviceName }} -->
@@ -337,24 +338,34 @@
                        <!-- <span class="card-top-r-t">完成进度:50%</span>
                          <span class="card-top-r-b">12月28日 08:24</span> -->
                      </div>
                    </template>
                    <template v-else>
                      <!-- <div class="card_content">
                      </div> -->
                      <div :class="(activeName==1||activeName == 3)?'card_top-4 font_size_20px':'card_top-4'">
                        <div>工艺编号:<div >{{ list.number }}</div></div>
                        <!-- <div
                          style="
                            font-size: 14px;
                            color: #cfcfcf;
                            line-height: 20px;
                          "
                    </div>
                    <div v-else class="process-params">
                      <div class="process-params-title">
                        <el-popover
                          width="200"
                          :content="list.number"
                          placement="top-start"
                          trigger="click"
                        >
                          工艺的具体信息请点击控制查看!
                        </div> -->
                          <span slot="reference">工艺编号:{{ list.number }}</span>
                        </el-popover>
                      </div>
                    </template>
                      <div class="process-params-value">
                        <!-- 工艺参数-->
                        {{mergeProcessParams(taskData.Arr)}}
                      </div>
                      <!-- <div
                        style="
                          font-size: 14px;
                          color: #cfcfcf;
                          line-height: 20px;
                        "
                      >
                        工艺的具体信息请点击控制查看!
                      </div> -->
                    </div>
                  </div>
                </el-carousel-item>
              </el-carousel>
@@ -461,7 +472,7 @@
          <template
              v-if="activeName == 2 &&(!taskData||Object.keys(taskData).length==0)"
            >
            <el-empty description="暂无任务..."></el-empty>
          </template>
        </div>
@@ -533,9 +544,9 @@
              <!-- <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%;
@@ -591,19 +602,14 @@
          </div>
        </div>
      </div>
    </template> -->
    <!-- 控制的弹框 -->
    <AddControl ref="control" :Arr="Arr" />
    <!-- 控制的弹框 -->
    <AddIssue
    <TaskControlModal
      ref="control"
      :Arr="Arr"
      :activeName="activeName"
      :ArrError="ArrError"
      :safeProduce="safeProduce"
      :taskData="taskData"
      :Order="taskData.Order"
      @getSetProductNumber="reloadPage"
      @isTip="isTip"
    />
@@ -632,8 +638,10 @@
import AddControl from "../components/AddControl.vue";
import AddIssue from "../components/AddIssue.vue";
import ProcessModel from  "../components/ProcessModel.vue";
import TaskControlModal from "@/components/TaskControlModal.vue";
export default {
  components: {
    TaskControlModal,
    Card,
    Knowledge,
    AddControl,
@@ -642,6 +650,7 @@
  },
  data() {
    return {
      pollingTaskCountTimer: null,
      activeName: 1,
      progress: 70, //进度
      passrate: 30, //合格率
@@ -779,6 +788,12 @@
      this.getDate2();
    }, 5000);
    this.getTaskInfo();
    this.getTaskCountStatistics()
  },
  beforeDestroy() {
    clearTimeout(this.pollingTaskCountTimer)
    clearTimeout(this.procInfoTimer)
    clearTimeout(this.ProcessModelTimer)
  },
  watch:{
    // isFinsh(){
@@ -788,6 +803,7 @@
    // }
  },
  methods: {
    getModelList(){
      this.resResult=null
      for (let i in this.TasksCopy){
@@ -833,10 +849,17 @@
        }, 10000)
      }
    },
    mergeProcessParams(params){
      if (params?.length){
        return params.map(ele=> `${ele.Key}: ${ele.Value}`).join(' ')
      }else{
        return ''
      }
    },
    taskClick(){
      if(this.TaskCount>0){
        this.getStartArr()
        this.$refs.control.islook=true
        // this.getStartArr()
        this.$refs.control.show=true
      }else{
        this.$message({
          message:'目前没有任务!',
@@ -892,6 +915,8 @@
        }
      });
    },
    getDateObj(date, fmt) {
      if (/(y+)/.test(fmt)) {
@@ -955,7 +980,7 @@
        let String=now-date*1000;
        let seconds=Math.floor(String/1000)
        let minutes=Math.floor(seconds/60)
        let days=Math.floor(String/1000/60/60/24)
        let hours=Math.floor(minutes/60)-days*24
        let m=minutes-days*24*60-hours*60
@@ -1006,6 +1031,25 @@
      }
    },
    /**
     * 轮询获取任务数量
     */
    getTaskCountStatistics(){
      getTaskInfo({taskMode:1}).then((res) => {
        if (res.code === 200&&res.data) {
          this.TaskCount=res.data?.TaskCount ?? 0
        }
      },err=>{
        this.TaskCount = 0
        console.error(err)
      }).finally(()=>{
        this.pollingTaskCountTimer = setTimeout(()=>{
          this.getTaskCountStatistics()
        //   20秒一次轮询
        },20000)
      });
    },
    getTaskInfo(val) {
      this.Tasks = [];
      this.TasksCopy=[]
@@ -1018,14 +1062,14 @@
           })
          }
          this.TasksCopy = res.data.Tasks ? res.data.Tasks : [];
          this.safeProduce=res.data.Prompt.safeProduce?res.data.Prompt.safeProduce:''
          // this.safeProduce=res.data.Prompt.safeProduce?res.data.Prompt.safeProduce:''
          this.plcNotConnected=res.data.Prompt.plcNotConnected?res.data.Prompt.plcNotConnected:''
          this.ChannelAmount=res.data.ChannelAmount?res.data.ChannelAmount:1
          // if(this.ChannelAmount>1 &&this.TasksCopy.length<2){
          //   this.TasksCopy.push(this.object)
          // }
          this.TaskCount=res.data.TaskCount?res.data.TaskCount:0
          if ((this.TasksCopy.length ==0 )||!this.TasksCopy) {
            if (this.activeName == 1||this.activeName == 3) {
              this.TasksCopy.push(this.object);
@@ -1053,7 +1097,7 @@
                ...this.TasksCopy[i].Procedure.procedure,
              },
            ]);
            if (this.TasksCopy[i].Procedure.ID) {
              startTask({ id: this.TasksCopy[i].Procedure.ID }).then((res) => {
                if (res.code == 200) {
@@ -1062,7 +1106,7 @@
                  this.TasksCopy[i].procedureList[0].push({
                    number: res.data.Number,
                  });
                  // this.TasksCopy[i].Arr=res.data.Params ? res.data.Params : []
                  this.TasksCopy[i].Arr=res.data.Params ? res.data.Params : []
                  // this.isFinsh=Number(i)+1
                }
              });
@@ -1192,7 +1236,7 @@
 background:#12234a!important;
 color:#fff!important;
 border-color: #09e5ed !important;
 .popper__arrow::after{
  border-top-color:#09e5ed !important;
 }
@@ -1241,7 +1285,7 @@
    box-sizing: border-box;
    border-right: 1px solid #eee;
  }
  .small_title {
    margin-bottom: 30px;
  }
@@ -1297,7 +1341,7 @@
      font-size:14px;
    }
  }
  .el-step{
    .el-step__icon{
     background:#00cc66;
@@ -1495,8 +1539,7 @@
      overflow-y:auto;
    }
    .el-carousel__item{
    //  height:auto;
     min-height:160px;
      height:auto;
    }
  }
  .bottom-box-btn{
@@ -1504,6 +1547,10 @@
    position:absolute;
    bottom:10px;
    left:10px;
    .el-button{
      height: 40px;
    }
  }
}
@@ -1511,7 +1558,6 @@
  font-size: 20px;
}
.right-small-btn {
  margin-top: 10px;
  width: calc(100% - 20px);
  margin: 0 auto;
  position: absolute;
@@ -1820,7 +1866,7 @@
            border-radius: 5px 5px 0 0;
            background: rgb(19, 35, 90);
          }
          .card_contentRight {
            width: 100%;
@@ -1962,7 +2008,7 @@
      .right-base-btn {
        width: 100%;
        position: absolute;
        bottom: 0;
        bottom: 24px;
        left: 0;
        .el-button--primary {
          width: 100%;
@@ -1972,6 +2018,10 @@
          color: #fff;
          font-weight: 700;
          font-size: 18px;
          height: 40px;
          display: flex;
          align-items: center;
          justify-content: center;
        }
      }
      // .call {
@@ -1997,4 +2047,23 @@
  font-weight: 700 !important;
  font-size: 16px;
}
.process-params{
  margin-top: 10px;
  border-radius: 5px;
  overflow: hidden;
  color: #fff;
  font-size: 12px;
  &-title{
    height: 25px;
    padding: 0 5px;
    background-color: #13235a;
    line-height: 25px;
  }
  &-value{
    background-color: #6b83ff;
    min-height: 45px;
    box-sizing: border-box;
    padding: 12px;
  }
}
</style>