<template>
  <!-- 添加或修改项目信息对话框 -->
  <el-dialog
    title="追加批次"
    v-model="visible"
    width="500px"
    append-to-body
    draggable
  >
    <div class="form-container">
      <el-form
        ref="addLotRef"
        class="master-container"
        v-loading="loading"
        :model="form"
        label-width="100px"
        :rules="rules"
      >
        <el-row :gutter="20">
          <el-col :span="18">
            <el-form-item label="追加批次数量" label-width="120px" prop="lotNumber">
              <el-input-number
                v-model="form.lotNumber"
                style="width: 300px"
                :min="0"
                :precision="0"
                controls-position="right"
                @keydown.enter.prevent
                @input="(val) => {handleUpdateLotNumber(val)}"
                placeholder="请输入追加批次数量"
              />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="20">
          <el-col :span="24">
            <el-form-item label="新生成批号" label-width="120px" prop="newLots">
              <el-input
                type="textarea"
                v-model.trim="form.newLots"
                :disabled="true"
                style="width: 710px"
              />
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
    </div>
    <template #footer>
      <el-button type="primary" icon="Check"  @click="handleSave"
        >确定</el-button
      >
    </template>
  </el-dialog>
</template>
<script setup>
import { onMounted, ref } from "vue";
const { proxy } = getCurrentInstance();
const emit = defineEmits(["handleAddLotNum"]);
/**工艺版本变更变量 */
const loading = ref(false);
const visible = ref(false);
const lastLot = ref({})
const validateLotNumber = (rule, value, callback) => {
  const min = 0;
if (value <= min) {
    callback(new Error("当前追加批数应大于0"));
  } else {
    callback();
  }
};
/**查询对象 */
const data = reactive({
  form:{},
  rules: {
    lotNumber: [
      { required: true, message: "追加批数不能为空", trigger: "blur" },
      { validator: validateLotNumber, trigger: "blur" }
    ]
  },
});
const {  form, rules } = toRefs(data);

/***********************  方法区  ****************************/
/** 打开抽屉 */
const open = (data) => {
  reset();
  lastLot.value = data
  console.log(lastLot.value)
  visible.value = true;
};

/** 表单重置 */
const reset = () => {
  form.value = {
    lotNumber: null,
    newLots: null
  };
  proxy.resetForm("addLotRef");
};
/**生成批数变化*/
function handleUpdateLotNumber(val) {
  form.value.lotNumber = val
  console.log(form.value.lotNumber)
    //查询该计划单最后一个批数(排除分批的批次)
        var partOne = lastLot.value.substring(0, 8);
        var partTwo = lastLot.value.substring(8, 11);
        //获取生成批号
        var prefix = partTwo.replace(/[0-9]/g, "");
        var number = parseInt(partTwo.match(/[0-9]+/)[0]);
        var numbers = [];
        let currentNumber = number;
        console.log(form.value.lotNumber)
        for (let i = 0; i < form.value.lotNumber; i++) {
          var newNumber = currentNumber + (i + 1);
          numbers.push(
            prefix +
              newNumber
                .toString()
                .padStart(partTwo.match(/[0-9]+/)[0].length, "0")
          );
          if(newNumber  == 1000) {
              proxy.$modal.msgError("生成批数最多是" + i+",请重新输入");
              form.value.lotNumber = null
              form.value.newLots = null
              return
          }
        }
        var lots = [];
        for (let i = 0; i < numbers.length; i++) {
          lots.push(partOne + numbers[i] + "0");
        }
        form.value.newLots = lots;
        console.log(lots)
}
//批次带回
const handleSave = () => {
  proxy.$refs["addLotRef"].validate((valid) => {
    if (valid) {
      emit("handleAddLotNum", form.value.newLots);
      visible.value = false;
      reset();
    }
  });
};
/** 取消按钮 */
const handleCancel = () => {
  visible.value = false;
  reset();
};

/** 暴露给父组件的方法 */
defineExpose({
  open,
});
</script>
