<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="invoiceCode" label="单据号" name="invoiceCode">
        <a-input v-model:value="formState.invoiceCode" :disabled="true" placeholder="请输入单据号" />
      </a-form-item> -->

      <a-form-item label="单据状态" name="status">
        <a-select v-model:value="formState.status" :options="checkBillStatus" placeholder="请选择单据状态">
        </a-select>
      </a-form-item>
   <!--  <a-form-item ref="beginDate" label="开始时间" name="beginDate">
        <a-date-picker v-model:value="formState.beginDate" style="width: 100%" />
      </a-form-item> -->
     <!-- <a-form-item ref="endDate" label="结束时间" name="endDate">
        <a-date-picker v-model:value="formState.endDate" style="width: 100%" />
      </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/check";
  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 checkBillStatus = ref([{
          value: 'New',
          label: '新增',
        },
        {
          value: 'Doing',
          label: '执行中',
        },
        {
          value: 'Pause',
          label: '暂停',
        },
        {
          value: 'Cancel',
          label: '取消',
        },
        {
          value: 'Over',
          label: '执行完成',
        },
        {
          value: 'Closed',
          label: '关闭',
        },
      ]);

      const state = reactive({
        options: []
      });

      const formState = reactive({});

      const formRules = {};

      watch(props, (props) => {
        formState.id = props.record.id;
        formState.status = props.record.status;
        formState.remark = props.record.remark;
        formState.beginDate = props.record.beginDate;
        formState.endDate = props.record.endDate;
      })


      const submit = (e) => {
        formRef.value
          .validate()
          .then(() => {
            edit(toRaw(formState)).then((response) => {
              console.log("监听报错", response)
              if (response.success) {
                message.success({
                  content: '保存成功',
                  duration: 1
                }).then(() => {
                  cancel();
                });
              } else {
                message.error({
                  content: response.msg,
                  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,
        checkBillStatus,

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