<template>
  <el-form
    ref="ruleForm"
    :loading="loading"
    :model="ruleForm"
    status-icon
    :size="'mini'"
    :rules="rules"
    label-width="88px"
    style="width: 100%"
    class="demo-ruleForm"
  >
    <el-row v-show="ruleForm.state == '0'">
      <el-col :span="6"
        ><el-form-item label="审核状态" prop="state">
          <el-select
            v-model="ruleForm.state"
            placeholder="审核状态"
            style="width: 100%"
            :disabled="!(status === '3' && ppowers.some((i) => i == '3'))"
            @change="stateChange"
          >
            <el-option
              v-for="item in stateList"
              :key="item.value"
              :label="item.label"
              :value="item.value"
              :disabled="item.disabled"
            >
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="驳回节点" prop="rebut">
          <el-select
            v-model="ruleForm.rebut"
            placeholder="驳回节点"
            style="width: 100%"
            :disabled="!(status === '3' && ppowers.some((i) => i == '3'))"
          >
            <el-option
              v-for="item in statusList"
              :key="item.value"
              :label="item.label"
              :value="item.value"
              :disabled="item.disabled"
            >
            </el-option>
          </el-select>
        </el-form-item>
      </el-col>

      <el-col :span="16">
        <el-form-item label="审核备注" prop="status_remark">
          <el-input
            type="textarea"
            placeholder="请输入审核备注"
            v-model="ruleForm.status_remark"
            :disabled="!(status === '3' && ppowers.some((i) => i == '3'))"
            maxlength="250"
            :autosize="{ minRows: 3, maxRows: 3 }"
            show-word-limit
          />
        </el-form-item>
      </el-col>
      <el-col :span="2" class="fr" v-if="status === '3' && ppowers.some((i) => i == '3')">
        <el-form-item class="fr">
          <el-button v-if="!isDetail" :size="'mini'" type="primary" @click="submitForm"
            >保 存
          </el-button>
        </el-form-item>
      </el-col>
    </el-row>
    <el-row v-show="ruleForm.state !== '0'">
      <el-col :span="6"
        ><el-form-item label="审核状态" prop="state">
          <el-select
            v-model="ruleForm.state"
            placeholder="审核状态"
            style="width: 100%"
            :disabled="!(status === '3' && ppowers.some((i) => i == '3'))"
            @change="stateChange"
          >
            <el-option
              v-for="item in stateList"
              :key="item.value"
              :label="item.label"
              :value="item.value"
              :disabled="item.disabled"
            >
            </el-option>
          </el-select>
        </el-form-item>
      </el-col>

      <el-col :span="6">
        <el-form-item label="可销售入库数量" prop="can_sell_num" label-width="125px">
          <digital-input
            :values="ruleForm.can_sell_num"
            :placeholder="'可销售入库数量'"
            :min="0"
            :max="100000000000"
            :disabled="!(status === '3' && ppowers.some((i) => i == '3'))"
            :size="'mini'"
            :position="'right'"
            :precision="0"
            :controls="false"
            :append="''"
            @reschange="num_change($event, 'can_sell_num')"
          /> </el-form-item
      ></el-col>
      <el-col :span="6">
        <el-form-item label="次品入库数量" prop="defective_num" label-width="120px">
          <digital-input
            :values="ruleForm.defective_num"
            :placeholder="'次品入库数量'"
            :min="0"
            :max="100000000000"
            :disabled="!(status === '3' && ppowers.some((i) => i == '3'))"
            :size="'mini'"
            :position="'right'"
            :precision="0"
            :controls="false"
            :append="''"
            @reschange="num_change($event, 'defective_num')" /></el-form-item
      ></el-col>
      <el-col :span="6">
        <el-form-item label="丢失数量" prop="loss_num">
          <digital-input
            :values="ruleForm.loss_num"
            :placeholder="'丢失数量'"
            :min="0"
            :size="'mini'"
            :disabled="!(status === '3' && ppowers.some((i) => i == '3'))"
            :max="100000000000"
            :position="'right'"
            :precision="0"
            :controls="false"
            :append="''"
            @reschange="num_change($event, 'loss_num')"
          />
        </el-form-item>
      </el-col>

      <el-col :span="8">
        <el-form-item
          label="可销售入库仓库"
          prop="companyNo"
          label-width="130px"
          required
        >
          <search-work-company
            :value="ruleForm.companyNo"
            :placeholder="'业务公司'"
            :disabled="true"
            :size="'mini'"
            :isDetail="false"
            @searchChange="company_idsearchChange"
          />
        </el-form-item>
      </el-col>
      <el-col :span="8">
        <el-form-item label="" prop="can_sell_wsm_com" label-width="10px">
          <search-supplier
            :size="'mini'"
            :value="ruleForm.can_sell_wsm_com"
            :disabled="!(status === '3' && ppowers.some((i) => i == '3'))"
            :placeholder="'仓库所在公司'"
            :names="ruleForm.can_sell_wsm_com_name"
            :isDetail="true"
            @searchChange="supplierChange($event, 'can_sell_wsm_com')"
          />
        </el-form-item>
      </el-col>
      <el-col :span="8">
        <el-form-item prop="can_sell_wsm" label-width="10px">
          <search-stock
            :size="'mini'"
            :value="ruleForm.can_sell_wsm"
            :placeholder="'可销售入库仓库'"
            :disabled="!(status === '3' && ppowers.some((i) => i == '3'))"
            :isDetail="true"
            :isRelation="true"
            :wsmtype="'5'"
            :names="ruleForm.can_sell_wsm_name"
            :companyNo="ruleForm.companyNo"
            :companyCode="ruleForm.can_sell_wsm_com_code"
            @searchChange="stockChange($event, 'can_sell_wsm')"
          />
        </el-form-item>
      </el-col>
      <el-col :span="8">
        <el-form-item label="次品入库仓库" prop="companyNo" required label-width="130px">
          <search-work-company
            :value="ruleForm.companyNo"
            :placeholder="'业务公司'"
            :disabled="true"
            :size="'mini'"
            :isDetail="true"
            @searchChange="company_idsearchChange"
          />
        </el-form-item>
      </el-col>
      <el-col :span="8">
        <el-form-item label="" prop="defective_wsm_com" label-width="10px">
          <search-supplier
            :size="'mini'"
            :value="ruleForm.defective_wsm_com"
            :disabled="!(status === '3' && ppowers.some((i) => i == '3'))"
            :placeholder="'仓库所在公司'"
            :names="ruleForm.defective_wsm_com_name"
            :isDetail="true"
            @searchChange="supplierChange($event, 'defective_wsm_com')"
          />
        </el-form-item>
      </el-col>
      <el-col :span="8">
        <el-form-item prop="defective_wsm" label-width="10px">
          <search-stock
            :size="'mini'"
            :value="ruleForm.defective_wsm"
            :placeholder="'次品入库仓库'"
            :disabled="!(status === '3' && ppowers.some((i) => i == '3'))"
            :isDetail="true"
            :isRelation="true"
            :wsmtype="'4'"
            :names="ruleForm.defective_wsm_name"
            :companyNo="ruleForm.companyNo"
            :companyCode="ruleForm.defective_wsm_com_code"
            @searchChange="stockChange($event, 'defective_wsm')"
          />
        </el-form-item>
      </el-col>
      <el-col
        :span="24"
        style="text-align: right; padding: 0 0 15px 0"
        v-if="status === '3' && ppowers.some((i) => i == '3')"
      >
        <el-button type="primary" @click="submitForm" size="mini">保 存</el-button>
      </el-col>
    </el-row>
  </el-form>
</template>
<script>
import asyncRequest from "@/apis/service/sellOut/returnOrder";
import resToken from "@/mixins/resToken";
import { mapGetters } from "vuex";

export default {
  name: "sellAfterApplyDetail",
  props: ["id", "newTime", "sitem"],
  mixins: [resToken],
  computed: {
    ...mapGetters(["business_companyNo"]),
  },
  computed: {
    powers() {
      const tran =
        this.$store.getters.btnList.find(
          (item) => item.menu_route == "returnOrderDetail"
        ) || {};
      const { action } = tran ?? {};
      return action ?? [];
    },
    ppowers() {
      const tran =
        this.$store.getters.roleProcess.find((i) => i.process_type === "CKTHD") || {};
      const { action } = tran ?? {};
      return action ?? [];
    },
  },
  data() {
    return {
      loading: false,
      status: "", //存储详情接口返的状态
      return_num: "0",
      stateList: [
        {
          value: "1",
          label: "通过",
        },
        {
          value: "0",
          label: "驳回",
        },
      ],
      statusList: [
        { value: "1", label: "退货商品验收" },
        { value: "2", label: "退货验收审核" },
      ],
      showModelThis: this.showModel,
      return_tag: "",
      ruleForm: {
        thNo: "",
        state: "1",
        rebut: "",
        status_remark: "",
        companyNo: "",
        can_sell_num: "0",
        can_sell_wsm_com: [],
        can_sell_wsm_com_code: "",
        can_sell_wsm_com_name: "",
        can_sell_wsm: [],
        can_sell_wsm_code: "",
        can_sell_wsm_name: "",
        defective_num: "0",
        defective_wsm_com: [],
        defective_wsm_com_code: "",
        defective_wsm_com_name: "",
        defective_wsm: [],
        defective_wsm_code: "",
        defective_wsm_name: "",
        loss_num: "0",
      },
      rulesThis: this.rules,
      // 验证规则
      rules: {
        state: [
          {
            required: true,
            trigger: "change",
            message: "请选择审核状态",
          },
        ],
        rebut: [
          {
            required: true,
            trigger: "change",
            message: "请选择驳回节点",
          },
        ],
        status_remark: [
          {
            required: true,
            trigger: "blur",
            message: "请输入退回备注",
          },
        ],
        can_sell_num: [
          {
            required: true,
            trigger: "blur",
            message: "请输入可销售入库数量",
          },
        ],
        defective_num: [
          {
            required: true,
            trigger: "blur",
            message: "请输入次品入库数量",
          },
        ],
        loss_num: [
          {
            required: true,
            trigger: "blur",
            message: "请输入丢失数量",
          },
        ],
        can_sell_wsm_com: [
          {
            type: "array",
            required: true,
            trigger: "change",
            message: "请选择可销售仓库所在公司",
          },
        ],
        can_sell_wsm: [
          {
            type: "array",
            required: true,
            trigger: "change",
            message: "请选择可销售入库仓库",
          },
        ],
        defective_wsm_com: [
          {
            type: "array",
            required: true,
            trigger: "change",
            message: "请选择次品仓库所在公司",
          },
        ],
        defective_wsm: [
          {
            type: "array",
            required: true,
            trigger: "change",
            message: "请选择次品入库仓库",
          },
        ],
      },
    };
  },

  watch: {
    newTime: function (val) {
      if (val) {
        this.initForm();
      }
    },
  },
  mounted() {
    this.initForm();
  },
  methods: {
    async initForm() {
      this.loading = true;
      this.status = "";
      this.rulesThis = this.rules;
      await this.resetForm();
      this.loading = false;
    },

    async resetForm() {
      // 重置
      await this.$nextTick(() => {
        if (this.$refs.ruleForm) {
          this.$refs.ruleForm.resetFields();
          this.$refs.ruleForm.clearValidate();
          const {
            status,
            thNo,
            return_wsm,
            return_num,
            can_sell_wsm_com,
            companyNo,
            can_sell_wsm_name,
            defective_wsm,
            can_sell_wsm,
            can_sell_wsm_supplierNo,
            can_sell_wsm_supplier,
            defective_wsm_supplierNo,
            defective_wsm_supplier,
            can_sell_num,
            defective_num,
            defective_wsm_name,
            status_remark,
            loss_num,
          } = this.sitem;

          this.status = status;
          this.return_num = return_num;
          this.ruleForm = {
            thNo: thNo || "",

            state: status === "4" ? "1" : "1",
            rebut: "",
            status_remark: status_remark || "",
            companyNo: companyNo || this.business_companyNo || "",
            can_sell_num: can_sell_num || "0",
            can_sell_wsm_com: can_sell_wsm_supplierNo ? [can_sell_wsm_supplierNo] : [],
            can_sell_wsm_com_code: can_sell_wsm_supplierNo || "",
            can_sell_wsm_com_name: can_sell_wsm_supplier || "",
            can_sell_wsm: can_sell_wsm ? [can_sell_wsm] : [],
            can_sell_wsm_code: can_sell_wsm || "",
            can_sell_wsm_name: can_sell_wsm_name || "",
            defective_num: defective_num || "0",
            defective_wsm_com: defective_wsm_supplierNo ? [defective_wsm_supplierNo] : [],
            defective_wsm_com_code: defective_wsm_supplierNo || "",
            defective_wsm_com_name: defective_wsm_supplier || "",
            defective_wsm: defective_wsm ? [defective_wsm] : [],
            defective_wsm_code: defective_wsm || "",
            defective_wsm_name: defective_wsm_name || "",
            loss_num: loss_num || "0",
          };
          // console.log(this.ruleForm);
          this.stateChange();
        }
      });
    },
    stateChange() {
      const { state } = this.ruleForm;
      this.rulesThis.can_sell_num[0].required = state === "1";
      this.rulesThis.defective_num[0].required = state === "1";
      this.rulesThis.loss_num[0].required = state === "1";
      this.rulesThis.can_sell_wsm_com[0].required = state === "1";
      this.rulesThis.can_sell_wsm[0].required = state === "1";

      this.rulesThis.defective_wsm_com[0].required = state === "1";
      this.rulesThis.defective_wsm[0].required = state === "1";

      this.rulesThis.rebut[0].required = state !== "1";
      this.rulesThis.status_remark[0].required = state !== "1";
    },
    num_change(e, key) {
      this.ruleForm[key] = e + "";
      this.$refs.ruleForm.validateField(key);
    },
    async submitForm() {
      await this.$refs.ruleForm.validate(async (valid) => {
        if (valid) {
          if (this.loading) {
            return;
          }
          this.loading = true;
          const {
            thNo,
            state,
            status_remark,
            can_sell_wsm_code,
            can_sell_num,
            defective_wsm_code,
            defective_num,
            loss_num,
            rebut,
          } = this.ruleForm;
          let model = {
            thNo,
            status: state === "1" ? "4" : rebut,
            status_remark,
            can_sell_wsm: can_sell_wsm_code,
            defective_wsm: defective_wsm_code,
            can_sell_num,
            defective_num,
            loss_num,
          };

          if (
            parseInt(this.return_num) !==
              parseInt(can_sell_num) + parseInt(defective_num) + parseInt(loss_num) &&
            state === "1"
          ) {
            this.$message.warning("可销售数量+次品数量+丢失数量不等于总退货数！");
            return;
          }
          // console.log(model);

          const res = await asyncRequest.orderbackexamnew(model);
          this.loading = false;
          if (res && res.code === 0) {
            this.$notify.success({
              title: "提交成功",
              message: "",
            });
            this.$emit("refresh", false);
          } else if (res && res.code >= 100 && res.code <= 104) {
            await this.logout();
          } else {
            this.$message.warning(res.message);
          }
        } else {
          console.log("error submit!!");
          return false;
        }
      });
    },
    async company_idsearchChange(e) {
      const { code } = e;
      this.ruleForm.companyNo = code || "";
    },
    async supplierChange(e, key) {
      const { code, label } = e;
      this.ruleForm[key + "_name"] = label || "";
      this.ruleForm[key + "_code"] = code || "";
      this.ruleForm[key] = code ? [code] : [];
      this.$refs.ruleForm.validateField(key);
    },
    async stockChange(e, key) {
      const { code, label } = e;
      this.ruleForm[key + "_name"] = label || "";
      this.ruleForm[key + "_code"] = code || "";
      this.ruleForm[key] = code ? [code] : [];
      this.$refs.ruleForm.validateField(key);
    },
  },
};
</script>

<style lang="scss" scoped></style>
