<template>
  <div class="customer-css">
    <el-dialog :title="titleCon" v-drag v-bind="$attrs" v-on="$listeners"
               width="405px" style="height: 310px;" class="customer-dialog">
      <el-container style="height: 135px;">
        <el-form :inline="true" label-position="top" label-width="80px">
            <!-- 换材料 -->
            <el-container>
              <fieldset class="customer-fieldset" style="width: 165px;">
                <legend>换材料</legend>
                <!-- 材料卷号 序号 -->
                <!-- 材料卷号和BOM序号 -->
                <el-row>
                  <el-col :span="16">
                    <el-form-item :label="'材料卷号:'">
                      <el-input ref="rmRollNo" @keyup.native="recordTime"
                                @keyup.enter.native="checkRmRollNoBun"
                                v-model="pageData.rmRollNo"
                                style="width: 120px">
                      </el-input>
                    </el-form-item>
                  </el-col>
                </el-row>
                <el-row>
                  <el-col :span="16">
                    <el-form-item :label="'BOM 序号:'">
                      <el-input v-model="pageData.bomItemNo" readonly style="width: 120px"></el-input>
                    </el-form-item>
                  </el-col>
                </el-row>
              </fieldset>
            </el-container>

            <!-- 停机信息 -->
            <el-container style="margin-left: 170px; margin-top: -120px;">
              <fieldset class="customer-fieldset" style="width: 210px;">
                <legend>停机</legend>
                <!-- 原工具信息 -->
                <el-row>
                  <el-col :span="12">
                    <el-form-item class="customer-item" label="开始时间:">
                      <el-date-picker v-model="pageData.reportDate" format="yyyy-MM-dd"
                                      value-format="yyyy-MM-dd"  style="width: 100px;"></el-date-picker>
                    </el-form-item>
                  </el-col>
                  <el-col :span="12">
                    <el-form-item class="customer-item" label=" ">
                      <el-time-picker v-model="pageData.reportTime" format="HH:mm:ss"
                                      value-format="HH:mm:ss"  style="width: 80px;"></el-time-picker>
                    </el-form-item>
                  </el-col>
                </el-row>
                <el-row>
                  <el-col :span="12">
                    <el-form-item class="customer-item" label="时长:">
                      <el-input v-model="pageData.downTimeQty" @blur="changeTimeQty"type="number" style="width: 100px;" ></el-input>
                    </el-form-item>
                  </el-col>
                </el-row>
              </fieldset>
            </el-container>

          </el-form>
      </el-container>
      <span slot="footer" class="dialog-footer">
        <el-button type="primary" @click="connectMaterialRollBun">确 定</el-button>
        <el-button type="primary" @click="closeDialog">关闭</el-button>
      </span>
    </el-dialog>
  </div>
</template>

<script>
import {
  checkConnectMaterialRoll,
  connectMaterialRoll,
}
  from '@/api/yieldReport/com_replace_material.js';
export default {
  name: "com_defect_roll",
  data() {
    return {
      titleCon: '换料',
      timeArray: [],
      scheduleData: {
        site: this.$store.state.user.site,
        username: this.$store.state.user.name,
        seqNo: '',
        orderNo: '',
        itemNo: 0,
        partNo: '',
        workCenterNo: '',
        workCenterDesc: '',
        resourceDesc: '',
        rollNo: '',
        partDesc: '',
        planStartTime: '',
        planFinishTime: '',
        qtyRequiredOriginal: 0,
        scheduledDate: '',
        shiftNo: '',
        preItemDesc: '',
        nextItemDesc: '',
        nextItemNo: 0,
        operatorId: '',
        functionName: '',
        currentRollFlag: false
      },
      pageData: {
        site: this.$store.state.user.site,
        username: this.$store.state.user.name,
        orderNo: '',
        itemNo: '',
        seqNo: '',
        rollNo: '',
        operatorId: '',
        histSeqNo: 0,
        bomItemNo: -1,
        rmRollNo: '',
        oriRmRollNo: '',
        reportDate: '',
        reportTime: '',
        downTimeQty: 0,
        consumeQty: 0,
        oriConsumeQty: 0,
        totalConsumeQty: 0,
        checkFlag: false,
      },
      operatorData: {
        site: this.$store.state.user.site,
        username: this.$store.state.user.name,
        operatorId: '',
        operatorName: '',
        status: '',
        seqNo: '',
        showFlag: false
      },
      oriMaterialData: {
        site: this.$store.state.user.site,
        username: this.$store.state.user.name,
        orderNo: '',
        itemNo: 0,
        seqNo: '',
        histSeqNo: '',
        rmRollNo: '',
      },
      dataListLoading: false,
    }
  },
  methods: {

    //初始化组件的参数
    init(scheduleData, operatorData, oriMaterialData) {
      //初始化参数
      this.scheduleData = scheduleData;
      this.oriMaterialData = oriMaterialData;
      //初始化操作员对象
      this.operatorData = JSON.parse(JSON.stringify(operatorData));
      //设置参数
      this.pageData.orderNo = scheduleData.orderNo;
      this.pageData.itemNo = scheduleData.itemNo;
      this.pageData.seqNo = scheduleData.seqNo;
      this.pageData.rollNo = scheduleData.rollNo;
      this.pageData.operatorId = operatorData.operatorId;
      this.pageData.histSeqNo = oriMaterialData.histSeqNo;
      this.pageData.oriRmRollNo = oriMaterialData.rmRollNo;
      this.pageData.bomItemNo = oriMaterialData.sAPBOMItemNo;
      //重置时间
      this.pageData.reportDate = this.dayjs(new Date()).format('YYYY-MM-DD');
      this.pageData.reportTime = this.dayjs(new Date()).format('HH:mm:ss');
      this.pageData.downTimeQty = 0;
      this.pageData.rmRollNo = '';
      //自动获取焦点
      this.$nextTick(() => {
        this.$refs.rmRollNo.focus();
      });
      //重置校验的标记
      this.pageData.checkFlag = false;
    },

    /*关闭modal*/
    closeDialog(){
      //刷新报工的页面
      this.$emit('refreshPageData');
      //关闭当前的页面
      this.$emit('update:visible', false);
    },

    /*记录每一次录入字符串的时间*/
    recordTime(){
      //判断是否清掉所有的内容
      if(this.pageData.rmRollNo.trim().length === 0){
        this.timeArray = [];
      }else{
        this.timeArray.push(new Date().getTime());
      }
    },

    /*验证时长的参数*/
    changeTimeQty(){
      let downTimeQty = this.pageData.downTimeQty;
      if(downTimeQty <= 0){
        this.$message.error('时长必须大于0!');
        return false;
      }
    },

    /*检查材料卷号的数据*/
    checkRmRollNoBun() {
      //首先判断时间是否超过100毫秒
      let len = this.timeArray.length;
      let timeDiff = this.timeArray[len - 1] - this.timeArray[0];
      //判断时间是否在范围之内
      if(timeDiff > 1000){
       // this.$message.error('请扫码输入!');
        //return false;
      }
      //判断null和空字符串
      if (this.pageData.rmRollNo == null || this.pageData.rmRollNo === '') {
        this.$message.error('材料卷号不能为空!');
        return false;
      }else{
        this.pageData.rmRollNo = this.pageData.rmRollNo.trim();
      }
      //调用方法检查材料的数据(验证通过调用检查的方法)
      this.checkConnectRmRollNoOperation();
    },

    /*检查新的工具实例信息*/
    checkConnectRmRollNoOperation(){
      /*调用检查的方法检验下*/
      checkConnectMaterialRoll(this.pageData).then(({data}) => {
        //判断是否存在异常
        if(data.code == 500){
          this.$message.error(data.msg);
        }else{
          this.pageData.checkFlag = true;
        }
      });
    },

    /*接料操作*/
    connectMaterialRollBun(){
      let downTimeQty = this.pageData.downTimeQty;
      if(downTimeQty <= 0){
        this.$message.error('时长必须大于0!');
        return false;
      }
      connectMaterialRoll(this.pageData).then(({data}) => {
        //判断是否存在异常
        if(data.code == 500){
          this.$message.error(data.msg);
        }else{
          //先提示 后关闭
          this.$message.success(data.msg);
         //关闭当前的页面
          this.closeDialog();
        }
      });
    },

  },
  created() {
    // this.factoryList()
    // this.getLanguageList()
  }
}

</script>

<style scoped lang="scss">


</style>
