开始生产的接口变化

haoxuan

2023-09-20 f5cbbd5e6ecf6ba16523cdea205572f52e7643ae

 src/views/visualization.vue

@@ -1,7 +1,7 @@

<template>
  <div class="home">
    <!-- v-if="Object.keys(taskData).length > 0 && taskData.Procedure.ID" -->
    <!--  -->
    <template v-if="Tasks&&Tasks.length>0">
      <div class="left">
        <p class="title">
@@ -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>
@@ -44,13 +45,13 @@
            <span class="title-item"
              >工单编号:
              <span class="color_4efefa">{{
                taskData.Order.workOrderId || ""
                taskData.Order.workOrderId || "--"
              }}</span>
            </span>
            <span class="title-item"
              >当前工序:
              <span class="color_4efefa">{{
                taskData.Procedure.procedure.procedureName || ""
                taskData.Procedure.procedure.procedureName || "--"
              }}</span>
            </span>
            <span class="title-item"
@@ -74,8 +75,8 @@
              </span>
            </span> -->
          </div>
          <div class="gongx" v-if="taskData.AllProcedures">
          <el-steps :active="taskData.CurrentProcedureIndex?taskData.CurrentProcedureIndex:0"  finish-status="success" class="steps">
          <div class="gongx">
          <el-steps v-if="taskData.AllProcedures" :active="taskData.CurrentProcedureIndex?taskData.CurrentProcedureIndex:0"  finish-status="success" class="steps">
            <el-step icon="" :title="item" v-for="(item,index) in taskData.AllProcedures" :key="index"></el-step>
          </el-steps>
        </div>
@@ -198,7 +199,7 @@
                    <div class="card_content">
                      <div class="card_contentLeft">{{ list.materialId }}</div>
                    </div>
                    <div class="card_top">
                    <div class="card-top-input-out-l">
                      <div>
                        <!-- 设备12<i
                            style="font-size: 14px"
@@ -208,7 +209,7 @@
                        {{ list.materialName }}
                      </div>
                    </div>
                    <div class="card_top2">
                    <div class="card-top-input-out-r">
                      <div style="line-height: 45px; text-align: center">
                        {{ list.amount }} {{ list.unit }}
                      </div>
@@ -218,7 +219,7 @@
                  </div>
                </el-carousel-item>
              </el-carousel>
              <el-button type="primary" class="color_f70f83">
              <el-button type="primary" class="color_f70f83 bottom-box-btn">
                <i class="el-icon-phone-outline" />物料呼叫</el-button
              >
            </div>
@@ -246,8 +247,16 @@
                  >
                    <template v-if="list.name == '工序'">
                      <div class="card_content">
                        <div class="card_contentLeft color_blue">
                          {{ list.deviceName }}
                        <div class="card_contentLeft color_blue font_dian">
                          <!-- {{ list.deviceName }} -->
                          <el-popover
                          width="200"
                          :content="list.deviceName"
                          placement="top-start"
                          trigger="click"
                        >
                          <span slot="reference">{{ list.deviceName }}</span>
                        </el-popover>
                          <!-- <span style="float: right">6m/s</span> -->
                        </div>
                      </div>
@@ -299,8 +308,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;
@@ -319,7 +328,7 @@
              <p
                style="font-size: 22px; margin-left: 12px; margin-top: 50px"
              ></p>
              <div class="right-small-btn">
              <div class="right-small-btn bottom-box-btn">
                <el-button type="primary"> 打印</el-button>
                <el-popover
                  placement="top-end"
@@ -376,53 +385,32 @@
                          {{ list.materialId }}
                        </div>
                      </div>
                      <div class="card_top">
                      <div class="card-top-input-out-l">
                        <div>
                          {{ list.materialName }}
                          <!-- 设备12<i
                            style="font-size: 14px"
                            class="el-icon-right font-arrow-20"
                          ></i>
                          设备13 -->
                        </div>
                      </div>
                      <div class="card_top2">
                      <div class="card-top-input-out-r">
                        <div style="line-height: 45px; text-align: center">
                          {{ list.amount }} {{ list.unit }}
                        </div>
                        <!-- <span class="card-top-r-t">生产完成</span>
                        <span class="card-top-r-b">12月28日 08:24</span> -->
                      </div>
                      <!-- <div class="card-info-box">预计10分钟送达</div> -->
                    </div>
                    <!-- <div class="card">
                      <div class="card_content">
                        <div class="card_contentLeft color_green">
                          包号:G22122304 100吨
                        </div>
                      </div>
                      <div class="card_top">
                        <div>
                          设备12<i
                            style="font-size: 14px"
                            class="el-icon-right font-arrow-20"
                          ></i>
                          设备13
                        </div>
                      </div>
                      <div class="card_top-2">
                        <span class="card-top-r-t">生产完成</span>
                        <span class="card-top-r-b">12月28日 08:24</span>
                      </div>
                    </div> -->
                  </div>
                </el-carousel-item>
              </el-carousel>
              <el-button type="primary" class="color_f70f83">
              <el-button type="primary" class="color_f70f83 bottom-box-btn">
                <i class="el-icon-phone-outline" />运输呼叫</el-button
              >
            </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">
@@ -444,7 +432,7 @@
          设备状态:
          <!-- 1断开2生产3待机 -->
          <span style="position: relative"
            >
           v-if="plcStatus" >
            <img v-if="plcStatus == 1" src="../../public/duan.png" />
            <img v-else src="../../public/lian.png" />
            <!-- <span class="yuandian"></span> -->
@@ -477,9 +465,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%;
@@ -504,7 +495,7 @@
        </div>
      </div>
    </template>
    <!-- v-else -->
    <!--  -->
    <template v-else>
      <div class="home-img-box">
        <div class="bg-title">
@@ -671,7 +662,7 @@
      procInfoTimer: null,
      cutdownTimer: null,
      TaskCount:0,
      plcStatus:1,
      plcStatus:0,
      isTipShow:false,
    };
  },
@@ -799,11 +790,11 @@
      return d;
    },
    setInterCard(value, name, i) {
      if (this.Tasks[i].Procedure.procedure[value]) {
      if (this.Tasks[i].Procedure.procedure[value]!=null) {
        let height = 200;
        let num = 1;
        if (this.$refs[name]) {
          height = this.$refs[name].$el.offsetHeight;
          height = this.$refs[name].$el?this.$refs[name].$el.offsetHeight:200;
          num = Math.floor(height / 80);
        }
        let inputMaterials = JSON.parse(
@@ -839,8 +830,24 @@
          procedure: { inputMaterials: [], outputMaterials: [], workers: [] },
        },
        inputMaterials: [],
        outputMaterials: [],
        procedureList: [],
        outputMaterials: [
            // [
            //   {
            //    materialId:11111,
            //    materialName:'272大家啊放假了卡艰苦奋斗垃圾发快递垃圾反馈来得及克隆',
            //    amount:100,
            //    unit:'件'
            //   }
            // ]
        ],
        procedureList: [
        //  [ 
        //     {
        //       name:"工序",
        //       deviceName:'1111dhafjdhajkhf jkdahjkf打法即可打開鏈接肯德基啊看來jdad大风京东卡老司机番窠倒臼开了房金阿奎第十六届反馈拉德斯基k打卡机阿珂附件打开了点击阿里卡减肥的卡拉胶开了房大街上克隆fk啦大家防空雷達數據看i'
        //     },
        //   ]
        ],
      };
      this.Tasks = [];
      getTaskInfo({ page: 1, pageSize: this.activeName }).then((res) => {
@@ -852,16 +859,9 @@
           })
          }
          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) {
            if (this.activeName == 1) {
              this.Tasks.push(object);
            } else {
              this.Tasks.push(object);
              this.Tasks.push(object);
            }
          }
          for (let i in this.Tasks) {
            this.Tasks[i].procedureList = [];
            this.Tasks[i].inputMaterials = [];
@@ -899,9 +899,17 @@
              if (!this.procInfoTimer) {
                this.procInfoTimer = setInterval(() => {
                  this.getProgressInfo();
                }, 9000);
                }, 3000);
          }
        }
          if (this.Tasks.length == 0) {
            if (this.activeName == 1) {
              this.Tasks.push(object);
            } else {
              this.Tasks.push(object);
              this.Tasks.push(object);
            }
          }
        if (res.code != 200 || this.Tasks.length == 0) {
          this.getcountdown();
          // 控制重新请求getTaskInfo, 只开启一个定时器
@@ -912,6 +920,9 @@
          }
        }
      });
      
      // this.Tasks.push(object)
      // this.Tasks.push(object)
    },
    getStartArr(){
      for (let i in this.Tasks) {
@@ -924,17 +935,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:0
            }
          });
        }
      }
      
    },
@@ -986,6 +999,21 @@
</script>

<style lang="scss">
.tooltip-width-200{
  width:200px;
  line-height:1.3!important;
}
.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);
@@ -1001,6 +1029,9 @@
  .bottom {
    height: calc(100% - 410px);
  }
  .font_size_20px{
    font-size:20px!important;
  }
}
.active-two {
  width: calc(50% - 10px);
@@ -1013,6 +1044,7 @@
    box-sizing: border-box;
    border-right: 1px solid #eee;
  }
  
  .small_title {
    margin-bottom: 30px;
  }
@@ -1250,14 +1282,21 @@
  }
  .card-box {
    width: 100%;
    height: calc(100% - 50px - 50px);
    height: calc(100% - 50px - 40px);
    // height:300px;
    .el-carousel__container{
      overflow-y:auto;
    }
    // .el-carousel__item{
    //   min-height:116px;
    // }
    .el-carousel__item{
    //  height:auto;
     min-height:160px;
    }
  }
  .bottom-box-btn{
    width:calc(100% - 20px);
    position:absolute;
    bottom:10px;
    left:10px;
  }
}

@@ -1324,11 +1363,12 @@
      align-content: center;
      justify-content: space-around;
      align-items: center;
      overflow:hidden;
      .title-item {
        width: calc(33.333% - 50px);
        width: calc((100% - 50px)/3);
        float: left;
        margin-right: 10px;
        padding: 15px 20px;
        padding: 10px 5px;
        text-align: center;
        border-radius: 4px;
        display: inline-block;
@@ -1420,10 +1460,10 @@
        // border: 1px solid #ccc;
        background: #6b83ff;
        border-radius: 5px;
        margin-top: 20px;
        margin-top: 10px;
        color: #333;
        position: relative;
        .card_top-2,
        .card_top-2,.card-top-input-out-r,
        .card_top-3 {
          width: 50%;
          height: 45px;
@@ -1465,7 +1505,7 @@
          }
        }

        .card_top,
        .card_top,.card-top-input-out-l,
        .card_top-4 {
          width: 50%;
          height: 45px;
@@ -1474,10 +1514,8 @@
          color: #fff;
          font-size: 12px;
          line-height: 45px;
          float: left;

          > div {
            margin-left: 12px;
            padding-left: 12px;
            position: relative;
            p {
              position: absolute;
@@ -1487,15 +1525,32 @@
            }
          }
        }
        .card_top{
          float: left;
        }
        .card-top-input-out-l{
          float:left;
          width:65%;
          line-height:20px;
          vertical-align: middle;
          display:flex;
          justify-content:space-around;
          align-items:center;
        }
        .card-top-input-out-r{
          width:35%;
        }
        .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;
@@ -1522,6 +1577,12 @@
            border-radius: 5px 5px 0 0;
            background: rgb(19, 35, 90);
          }
          .font_dian{
            -webkit-box-orient:vertical;
            overflow:hidden;
            text-overflow:ellipsis;
            white-space:nowrap;
          }

          .card_contentRight {
            width: 100%;