<template>
  <div v-loading="loading">
    <el-form
      :model="ruleForm"
      :rules="rules"
      status-icon
      :size="'mini'"
      ref="ruleForm"
      label-width="110px"
      class="demo-ruleForm"
    >
      <el-row>
        <el-col :span="8">
          <el-form-item label="计划入库总数">
            <el-input
              placeholder="计划入库总数"
              disabled
              v-model="ruleForm.send_num"
              maxlength="100"
            >
            </el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="实际入库总数" prop="wsm_num">
            <el-input
              placeholder="实际入库总数"
              v-model="ruleForm.wsm_num"
              maxlength="100"
            >
            </el-input>
          </el-form-item>
        </el-col>

        <el-col :span="8" style="text-align: right; padding: 0 0 10px 0">
          <el-button :size="'mini'" type="primary" @click="submitForm">保 存 </el-button>
        </el-col>
      </el-row>
    </el-form>
  </div>
</template>
<script>
import asyncRequest from "@/apis/service/purchaseIn/wsmInOrder";
import resToken from "@/mixins/resToken";
import { isMobile, isLicense, isnumber, isPhone } from "@/utils/validate";
export default {
  name: "wsmInOrderAdd",
  props: ["id", "sitem", "newTime", "modelSitem"],
  mixins: [resToken],
  computed: {
    powers() {
      const { btnList } = this.$store.getters;
      const tran = btnList.find((item) => item.menu_route == "wsmInOrderDetail") || {};
      const { action } = tran ?? {};
      return action ?? [];
    },
    ppowers() {
      const tran =
        this.$store.getters.roleProcess.find((i) => i.process_type === "RKD") || {};
      const { action } = tran ?? {};
      return action ?? [];
    },
  },
  data() {
    const validateWeight = (rule, value, callback) => {
      if (value === "") {
        callback(new Error("不能为空!"));
      } else {
        if (!isnumber(value)) {
          callback(new Error("仅支持整数!"));
        } else {
          callback();
        }
      }
    };
    const validatemobile = (rule, value, callback) => {
      if (value !== "") {
        if (isPhone(value) || isMobile(value)) {
          callback();
        } else {
          callback(new Error("联系电话格式不正确！"));
        }
      } else {
        callback(new Error("请输入收货联系电话！"));
      }
    };
    return {
      loading: true,
      status: "",
      showModel: false,
      modelAllnum: "",
      modelitem: null,
      modelId: "",
      ruleForm: {
        send_num: "",
        wsm_num: "",
      },
      rules: {
        wsm_num: {
          required: true,
          validator: validateWeight,
          trigger: "blur",
        },
      },
    };
  },
  watch: {
    newTime: function (val) {
      if (val) {
        this.initForm();
      }
    },
  },
  mounted() {
    this.initForm();
  },
  methods: {
    async initForm() {
      this.loading = true;

      await this.resetForm();
      this.loading = false;
    },
    //初始化表单
    async resetForm() {
      await this.$nextTick(() => {
        if (this.$refs.ruleForm) {
          this.$refs.ruleForm.resetFields();
          this.$refs.ruleForm.clearValidate();
          const { wsm_in_code, send_num } = this.sitem;
          const { wsm_num } = this.sitem.return;

          this.status = status;
          this.ruleForm = {
            wsm_in_code: wsm_in_code || "",
            send_num: send_num || "0",
            wsm_num: wsm_num || "0",
          };
        }
        if (this.$refs.tableForm) {
          this.$refs.tableForm.resetFields();
          this.$refs.tableForm.clearValidate();

          const { checkinfo } = this.sitem;
          this.tableForm = {
            error_list: checkinfo || [],
          };
        }
      });
    },
    addError(index) {
      this.modelAllnum = "2";
      this.modelitem = index === -1 ? {} : this.tableForm.error_list[index];
      this.modelId = index;
      this.showModel = true;
    },

    // 保存更改
    async submitForm() {
      await this.$refs.ruleForm.validate(async (valid) => {
        if (valid) {
          if (this.loading) {
            return;
          }
          this.loading = true;
          const { send_num, wsm_num } = this.ruleForm;
          if (parseInt(send_num) < parseInt(wsm_num)) {
            this.$message.warning("实际入库总数不能大于计划入库总数！");
            this.loading = false;
            return;
          }

          const { code, data, message } = await asyncRequest.status(this.ruleForm);
          this.loading = false;
          if (code === 0) {
            this.$notify.success({
              title: "提交成功",
              message: "",
            });
            this.$emit("refresh"); //抛出事件给详情页。
          } else if (code >= 100 && code <= 104) {
            await this.logout();
          } else {
            this.$message.warning(message);
          }
        } else {
          console.log("error submit!!");
          return false;
        }
      });
    },
  },
};
</script>

<style lang="scss" scoped>
.stockInDetail {
  .el-table-column-error_img-ul {
    position: relative;
    box-sizing: border-box;
    li {
      float: left;
      border: 1px solid #dfe6ec;
      margin: 0px 2px 2px 0px;
      box-sizing: border-box;
      img {
        display: inline-block;
        box-sizing: border-box;
        width: 50px;
        vertical-align: top;
        height: 32px;
        &:hover {
          cursor: pointer;
        }
      }
    }
  }
}
</style>
