下发参数 弹框修改 2023-8-28

haoxuan

2023-08-28 4436c040d89980c8624f88cd4876c808806c414f

下发参数 弹框修改 2023-8-28

 public/error.png

 src/api/home/index.js

@@ -98,6 +98,7 @@
  return request({
    url: `v1/task/sendProcessParams/${data.id}`,
    method: "post",
    loadingFlag:true,
    data,
  });
};
@@ -106,6 +107,7 @@
export const setProductNumber = (data) => {
  return request({
    url: 'v1/plc/setProductNumber',
    loadingFlag:true,
    method: "post",
    data,
  });

 src/components/AddControl.vue

@@ -104,13 +104,7 @@
          }
        }) 
      }else{
        this.$confirm( "当前设备没有工序!", "提示", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning",
        })
          .then(() => {})
          .catch(() => {});
        this.$message.error("当前设备没有工序！");
       
      }
    },

 src/components/AddIssue.vue

@@ -28,7 +28,17 @@
              生产数量：<span>{{ taskData.Order.amount || 0 }}</span>
            </div>
          </div>
          <div class="title-auto-box">
          <template v-if="messageError">
            <div class="error-t">
              <img src="../../public/error.png" />
            </div>
            <div class="error-m">
              {{ messageError }}
            </div>
            <div class="font_size_20 color_fff" style="text-align:center;width:100%;margin:10px 0;">请重试</div>
          </template>
          <template v-else>
            <div class="title-auto-box">
            <div class="title-box margin_bottom_20">
              <div class="title-item">
                订单编号：{{ taskData.Order.orderId || "" }}
@@ -97,7 +107,7 @@
                margin-top: 10px;
              "
            >
              请确认生产安全！
              {{ message }}
            </div>
            <div class="progress-item">
              <span>{{ parseInt(num/60*100) }}%</span>
@@ -112,6 +122,8 @@
                ></el-progress>
                </div>
          </div>
          </template>
          
          <!-- <div class="circel-text">
         <div class="circel-text-b">
          生产数量：<span>{{ Order.amount||0 }}</span>{{ Order.unit||'' }}
@@ -120,6 +132,12 @@
        </div>
      </div>
      <div slot="footer" class="dialog-footer tac" style="overflow: hidden">
        <template v-if="messageError">
          <div class="btn" style="margin-left:220px;"  @click="confirmClick2">
            <img src="../../public/confirm3.png" />
          </div>
        </template>
        <template v-else>
        <div class="btn" @click="closeClick">
          <img src="../../public/btn1.png" />
        </div>
@@ -132,13 +150,18 @@
        <div class="btn" v-if="showBtn==3" @click="onSubmit()">
          <img src="../../public/confirm1.png" />
        </div>
        </template>
        
      </div>
      <!-- <ErrorIssue ref="error" :messageError="messageError" @shutdown="shutdown"/> -->
    </div>
  </el-dialog>
  
</template>

<script>
import { startTask, setProductNumber,sendProcessParams } from "@/api/home/index"; // 产线
// import ErrorIssue from "@/components/ErrorIssue";
export default {
  components: {},
  props: {
@@ -167,7 +190,9 @@
      showBtn:1,
      num:0,
      timer:null,
     
      message:'请确认生产安全！',
      messageError:'',
      resParams:{},
    };
  },
  mounted() {
@@ -185,9 +210,14 @@
    }
  },
  methods: {
    confirmClick2(){
      this.messageError=''
    },
    confirmClick1(){
      
      this.num=0;
      this.showBtn=2;
      this.message='请确认生产安全！',
      this.timer=setInterval(()=>{
       this.num=this.num+1;
      },1000)
@@ -206,7 +236,7 @@
        this.showBtn= 1;
        this.islook=true;
      }else{
        this.islook=false;
        this.islook=true;
      }
    },
    getDateObj(date, fmt) {
@@ -247,23 +277,51 @@
        return "";
      }
    },
  
    onSubmit() {
      if(this.taskData.Procedure.ID){
        this.message='参数下发中...',
        this.num=0
        this.timer=setInterval(()=>{
         this.num=this.num+1;
         if(this.num==60||this.resParams){
          this.num=60
          this.getCode(this.resParams)

         }
        },1000)
        
        sendProcessParams({id:this.taskData.Procedure.ID}).then(res=>{
          if(res.code==200){
            setProductNumber().then((res) => {
              if (res.code == 200) {
                this.$message.success("下发成功！");
                // this.$message.success("下发生产数量成功！");
                this.$emit("getSetProductNumber");
                this.shutdown();
              }
              this.resParams=res;
              
            });
          }else{
            this.resParams=res;
          }
        })
     
      }
      
    },
    getCode(res){
      if (res.code == 200) {
                if(this.num==60){
                  this.messageError='下发成功！'
                  clearInterval(this.timer)
                  this.num=60;
                  this.showBtn=2;
                  this.message='请确认生产安全！'
                  // this.$message.success("下发生产数量成功！");
                }
              }else{
                this.messageError=res.msg?res.msg:'抱歉，工序下发失败！'
                clearInterval(this.timer)
                this.num=60;
                  this.showBtn=2;
                  this.message='请确认生产安全！'
              }
    },
    shutdown() {
      this.islook = false;
@@ -287,6 +345,9 @@
.color_4efefa {
  color: #4efefa !important;
}
.color_fff{
  color:#fff;
}
.font_size_20 {
  font-size: 20px !important;
}
@@ -308,6 +369,7 @@
      width: 55%;
    }
  }
  
  .title-bng {
    height: 42px;
    line-height: 42px;
@@ -323,6 +385,21 @@
    width: 100% !important;
  }
}
.error-t{
    width:120px;
    margin:50px auto 40px;
    img{
      width:100%;
      display:inline-block;
    }
  }
  .error-m{
    line-height:35px;
    font-size:26px;
    color:#fff;
    margin-bottom:20px;
    text-align:center;
  }
::v-deep .el-dialog {
  background: transparent;
}

 src/components/ErrorIssue.vue

New file
@@ -0,0 +1,241 @@
<template>
  <!-- top="10vh" -->
  <el-dialog
    :close-on-click-modal="false"
    :visible.sync="islook"
    width="300px"
    top="28vh"
    class="add-event-dialog"
    :show-close="false"
  >
    <div class="tank-box">
      <div slot="title" class="tac drawerHeader">提示</div>
      <div class="dialog-content-box">
        <div
          style="
            margin: 0 auto;
            width: 100%;
            height: 100%;
            overflow: hidden;
            margin-bottom: 30px;
            text-align: left;
          "
        >
          <div class="title-box margin_bottom_13 color_4efefa font_size_17">
            
              {{ messageError  }}下发失败！ddddd 
           
          </div>
        </div>
      </div>
      <div slot="footer" class="dialog-footer tac" style="overflow: hidden">
       
        <div class="btn"  @click="shutdown">
          <img src="../../public/confirm3.png" />
        </div>
      </div>
    </div>
  </el-dialog>
</template>

<script>


export default {
  components: {},
  props: {
    messageError: {
      type: [String],
      default: '下发失败！',
    },
  },
  data() {
    return {
      islook: true,
      
    };
  },
  mounted() {
   
  },
  watch: {
   
  },
  methods: {
    shutdown() {
      this.islook = false;
      this.$emit('shutdown')
    },
  },
};
</script>

<style lang="scss" scoped>
.tank-box {
  width: 300px;
  height: 322px;
  padding: 0 20px;
  background: url("../../public/tank.png") no-repeat center center / cover;
  position: relative;
  .dialog-footer {
    position: absolute;
    bottom: 20px;
  }
}
.color_4efefa {
  color: #4efefa !important;
}
.font_size_16 {
  font-size: 16px !important;
}
.margin_bottom_13 {
  margin-bottom: 13px;
}
.title-box {
  width: 100%;
  height: auto;
  overflow: hidden;
  line-height:30px;
  text-align:center;
  }
::v-deep .el-dialog {
  background: transparent;
}
::v-deep .el-dialog__header {
  padding: 0 !important;
}
::v-deep .el-dialog__body {
  padding: 0 !important;
}
.btn {
  width: 160px;
  height: auto;
  float: left;
  display: inline-block;
  img {
    width: 100%;
  }
  &:nth-of-type(1) {
    margin-right: 30px;
    margin-left: 80px;
  }
}
::v-deep .el-tabs__content {
  height: calc(100% - 55px);
  overflow-y: auto;
}
.circel {
  width: 100px;
  height: 100px;
  border-radius: 50%;
  border: 2px solid rgba(12, 79, 218, 1);
  position: relative;
  float: left;
  .circel-two {
    width: 75px;
    height: 75px;
    position: absolute;
    top: 11px;
    left: 11px;
    border-radius: 50%;
    border: 2px solid rgba(12, 79, 218, 1);
  }
}
.circel-text {
  color: #fff;
  margin-left: 20px;
  .circel-text-t {
    font-size: 18px;
    line-height: 40px;
  }
  .circel-text-b {
    font-weight: 700;
    font-size: 14px;

    span {
      color: rgba(12, 79, 218, 1);
      font-size: 38px;
      margin-right: 10px;
    }
  }
}
.color_red {
  width: 100%;
  margin: 0 auto;
  text-align: center;
  font-size: 14px;
  margin-bottom: 25px;
}
.form-item {
  width: calc(50% - 20px);
  float: left;
  &:nth-child(odd) {
    margin-right: 20px;
  }
}
.form-item-two {
  width: calc(50% - 20px);
  float: left;
  &:nth-of-type(odd) {
    margin-right: 20px;
  }
}
.form-item-three {
  width: calc(100% - 20px);
  float: left;
}
.form-item-check {
  width: calc(33% - 40px);
  float: left;
  &:nth-of-type(odd) {
    margin-right: 20px;
  }
}
.title {
  width: 100%;
}
.dialog-content-box {
  height: calc(100% - 200px);
  // overflow: hidden;
  padding: 50px 20px 20px;
  .el-form {
    overflow: hidden;
  }
  .title-auto-box {
    height: calc(100% - 150px);
    overflow: auto;
  }
  
}
.num-identify {
  padding: 5px 8px;
  background-color: rgba(255, 153, 0, 1);
  border-radius: 6px;
  font-size: 14px;
  color: #fff;
  font-weight: 600;
}
.drawerHeader {
  font-weight: 700;
  font-size: 14px;
  text-align: center;
  color: #fff;
  height: 22px;
  line-height: 22px;
  .identify {
    width: 80px;
    height: 25px;
    line-height: 25px;
    text-align: center;
    border: 1px solid rgba(255, 153, 0, 1);
    border-radius: 6px;
    font-size: 16px;
    color: rgba(255, 153, 0, 1);
    transform: rotate(15deg);
    font-weight: 600;
    margin-right: 100px;
    margin-top: 12px;
    float: right;
  }
}
</style>

 src/utils/request.js

@@ -38,20 +38,20 @@
      return res.data ? res.data : {};
    } else {
      if(!res.config.loadingFlag){
        // Message({
        //   // message: res.data.msg==res.data.data?res.data.data:res.data.msg+','+res.data.data,
        //   message: res.data.msg,
        //   type: 'error',
        //   duration: 5 * 1000
        // })
        MessageBox.confirm( res.data.msg+"?", "提示", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning",
        Message({
          // message: res.data.msg==res.data.data?res.data.data:res.data.msg+','+res.data.data,
          message: res.data.msg,
          type: 'error',
          duration: 5 * 1000
        })
          .then(() => {
          })
          .catch(() => {});
        // MessageBox.confirm( res.data.msg+"?", "提示", {
        //   confirmButtonText: "确定",
        //   cancelButtonText: "取消",
        //   type: "warning",
        // })
        //   .then(() => {
        //   })
        //   .catch(() => {});
      }
      return res.data ? res.data : {};
    }
@@ -65,18 +65,18 @@
    } else if (message.includes('Request failed with status code')) {
      message = '系统接口' + message.substr(message.length - 3) + '异常'
    }
    // Message({
    //   message: message,
    //   type: 'error',
    //   duration: 5 * 1000
    // })
    MessageBox.confirm( message+"?", "提示", {
      confirmButtonText: "确定",
      cancelButtonText: "取消",
      type: "warning",
    Message({
      message: message,
      type: 'error',
      duration: 5 * 1000
    })
      .then(() => {})
      .catch(() => {});
    // MessageBox.confirm( message+"?", "提示", {
    //   confirmButtonText: "确定",
    //   cancelButtonText: "取消",
    //   type: "warning",
    // })
    //   .then(() => {})
    //   .catch(() => {});
    return Promise.reject(error)
  }
)

 src/views/visualization.vue

@@ -737,13 +737,8 @@
      if (Object.keys(this.taskData).length > 0 && this.taskData.Procedure.ID) {
        this.$refs.control.islook = true;
      } else {
        this.$confirm( "当前设备没有工序!", "提示", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning",
        })
          .then(() => {})
          .catch(() => {});
        this.$message.error("当前设备没有工序！");
       
      }
    },
    // 右侧完成
@@ -757,13 +752,7 @@
          }
        });
      } else {
        this.$confirm( "当前设备没有工序!", "提示", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning",
        })
          .then(() => {})
          .catch(() => {});
        this.$message.error("当前设备没有工序！");
      }
    },
    getRandomNumber(min, max) {