<!-- <template>
  <a-modal :open="visible" title="修改托盘托盘出入库记录" cancelText="取消" okText="提交" @ok="submit" @cancel="cancel">
    <a-form ref="formRef" :model="formState" :rules="formRules" :label-col="labelCol" :wrapper-col="wrapperCol">
      <a-form-item ref="palletCode" label="托盘号" name="palletCode">
        <a-input v-model:value="formState.palletCode" placeholder="请输入托盘号" />
      </a-form-item>
      <a-form-item ref="skuCode" label="物料编号" name="skuCode">
        <a-input v-model:value="formState.skuCode" placeholder="请输入物料编号" />
      </a-form-item>
      <a-form-item ref="skuName" label="物料描述" name="skuName">
        <a-input v-model:value="formState.skuName" placeholder="请输入物料描述" />
      </a-form-item>
      <a-form-item ref="skuType" label="物料类型" name="skuType">
        <a-input v-model:value="formState.skuType" placeholder="请输入物料类型" />
      </a-form-item>
      <a-form-item ref="batch" label="批次" name="batch">
        <a-input v-model:value="formState.batch" placeholder="请输入批次" />
      </a-form-item>
      <a-form-item ref="serial" label="序列号" name="serial">
        <a-input v-model:value="formState.serial" placeholder="请输入序列号" />
      </a-form-item>
      <a-form-item ref="master" label="货主" name="master">
        <a-input v-model:value="formState.master" placeholder="请输入货主" />
      </a-form-item>
      <a-form-item ref="producer" label="厂家" name="producer">
        <a-input v-model:value="formState.producer" placeholder="请输入厂家" />
      </a-form-item>
      <a-form-item ref="customer" label="客户" name="customer">
        <a-input v-model:value="formState.customer" placeholder="请输入客户" />
      </a-form-item>
      <a-form-item ref="produceDate" label="生产日期" name="produceDate">
        <a-date-picker v-model:value="formState.produceDate" style="width: 100%"/>
      </a-form-item>
      <a-form-item ref="overdue" label="过期日期" name="overdue">
        <a-date-picker v-model:value="formState.overdue" style="width: 100%"/>
      </a-form-item>
      <a-form-item ref="skuQty" label="物料数量" name="skuQty">
        <a-input v-model:value="formState.skuQty" placeholder="请输入物料数量" />
      </a-form-item>
      <a-form-item ref="lockQty" label="锁定数量" name="lockQty">
        <a-input v-model:value="formState.lockQty" placeholder="请输入锁定数量" />
      </a-form-item>
      <a-form-item ref="baseUnit" label="物流单位" name="baseUnit">
        <a-input v-model:value="formState.baseUnit" placeholder="请输入物流单位" />
      </a-form-item>
      <a-form-item ref="convertQty" label="统计数量" name="convertQty">
        <a-input v-model:value="formState.convertQty" placeholder="请输入统计数量" />
      </a-form-item>
      <a-form-item ref="primaryUnit" label="统计单位" name="primaryUnit">
        <a-input v-model:value="formState.primaryUnit" placeholder="请输入统计单位" />
      </a-form-item>
      <a-form-item ref="spInv" label="特殊库存" name="spInv">
        <a-input v-model:value="formState.spInv" placeholder="请输入特殊库存" />
      </a-form-item>
      <a-form-item ref="invType" label="库存类型" name="invType">
        <a-input v-model:value="formState.invType" placeholder="请输入库存类型" />
      </a-form-item>
      <a-form-item ref="qualityStatus" label="质量状态" name="qualityStatus">
        <a-input v-model:value="formState.qualityStatus" placeholder="请输入质量标志" />
      </a-form-item>
      <a-form-item ref="note" label="备注" name="note">
        <a-input v-model:value="formState.note" placeholder="请输入备注" />
      </a-form-item>
      <a-form-item label="备注" name="remark">
        <a-textarea v-model:value="formState.remark" />
      </a-form-item>
    </a-form>
  </a-modal>
</template>
<script>
    import {
    message
  } from '@hwork/ant-design-vue';
  import {
    edit,
  } from "@/api/wms/pallet";
  import {
    defineComponent,
    reactive,
    ref,
    toRaw,
    watch
  } from "vue";
  export default defineComponent({
    props: {
      visible: {
        type: Boolean,
      },
      record: {
        type: Object,
      }
    },
    emit: ["close"],
    setup(props, context) {

      const formRef = ref();

      // const state = reactive({});

      const formState = reactive({});

      const formRules = {
        palletCode: [{
          required: true,
          message: '请输入托盘号',
          trigger: 'blur'
        }],
        skuCode: [{
          required: true,
          message: '请输入物料编号',
          trigger: 'change'
        }],
        skuQty: [{
          required: true,
          message: '请输入物料数量',
          trigger: 'blur',
          type: 'number',
        }],
        baseUnit: [{
          required: true,
          message: '请输入物流单位',
          trigger: 'change',
        }],
        convertQty: [{
          required: true,
          message: '请输入统计数量',
          trigger: 'blur',
          type: 'number',
        }],
        primaryUnit: [{
          required: true,
          message: '请输入统计单位',
          trigger: 'change',
        }],
      }

      watch(props, (props) => {
        console.log("state.record", props.record)
        formState.id = props.record.id
        formState.palletCode = props.record.palletCode
        formState.skuCode = props.record.skuCode;
        formState.skuName = props.record.skuName;
        formState.skuType = props.record.skuType;
        formState.batch = props.record.batch;
        formState.serial = props.record.serial;
        formState.master = props.record.master;
        formState.producer = props.record.producer;
        formState.customer = props.record.customer;
        formState.produceDate = props.record.produceDate;
        formState.overdue = props.record.overdue;
        formState.skuQty = props.record.skuQty;
        formState.lockQty = props.record.lockQty;
        formState.baseUnit = props.record.baseUnit;
        formState.convertQty = props.record.convertQty;
        formState.primaryUnit = props.record.primaryUnit;
        formState.spInv = props.record.spInv;
        formState.invType = props.record.invType;
        formState.qualityStatus = props.record.qualityStatus;
        formState.note = props.record.note;
        formState.remark = props.record.remark;
      })

      const editKey = "add";

      const submit = (e) => {
        message.loading({
          content: '提交中...',
          key: editKey
        });
        formRef.value
          .validate()
          .then(() => {
            edit(toRaw(formState)).then((response) => {
              if (response.success) {
                message.success({
                  content: '保存成功',
                  key: editKey,
                  duration: 1
                }).then(() => {
                  cancel();
                });
              } else {
                message.error({
                  content: response.msg,
                  key: editKey,
                  duration: 1
                }).then(() => {
                  // cancel();
                });
              }
            });
          })
          .catch(error => {
            console.log('error', error);
          });
      };

      const cancel = (e) => {
        formRef.value.resetFields();
        context.emit("close", false);
      };

      return {
        // state,
        submit,
        cancel,
        formRef,
        formState,
        formRules,

        labelCol: {
          span: 8
        },
        wrapperCol: {
          span: 12
        },
      };
    },
  });
</script>
 -->
