wms_vue/src/view/wms/warehouse/snHis/modal/save.vue

<template>
  <a-modal :open="visible" title="新增" cancelText="取消" okText="提交" @ok="submit" @cancel="cancel">
    <a-form-item ref="snCode" label="物料条码" name="snCode">
      <a-input v-model:value="formState.snCode" placeholder="请输入物料条码" />
    </a-form-item>
    <a-form-item ref="planCode" label="计划编号" name="planCode">
      <a-input v-model:value="formState.planCode" placeholder="请输入计划编号" />
    </a-form-item>
    <a-form-item ref="skuCode" label="skuCode" name="skuCode">
      <a-input-number v-model:value="formState.skuCode" placeholder="请输物料编号 "/>
    </a-form-item>
    <a-form-item ref="channelCode" label="通道编号" name="channelCode">
      <a-input-number v-model:value="formState.channelCode" placeholder="请输入通道编号" />
    </a-form-item>
    <a-form-item ref="target" label="目标站台" name="target">
      <a-input-number v-model:value="formState.target" placeholder="请输目标站台" style="width: 100%;"/>
    </a-form-item>
    <a-form-item ref="mode" label="码垛模式" name="mode">
      <a-input-number v-model:value="formState.mode" placeholder="请输码垛模式" style="width: 100%;"/>
    </a-form-item>
    <a-form-item ref="boxType" label="跺型" name="boxType">
      <a-input-number v-model:value="formState.boxType" placeholder="请输跺型" style="width: 100%;"/>
    </a-form-item>
    <a-form-item ref="palletCode" label="托盘编号" name="palletCode">
      <a-input-number v-model:value="formState.palletCode" placeholder="请输托盘编号" style="width: 100%;"/>
    </a-form-item>
  </a-modal>
</template>
<script>
    import {
    message
  } from '@hwork/ant-design-vue';
  import {
    save
  } from "@/api/wms/snHis";
  import {
    defineComponent,
    reactive,
    ref,
    toRaw
  } from "vue";
  export default defineComponent({
    props: {
      visible: {
        type: Boolean,
      },
    },
    emit: ["close"],
    setup(props, context) {

      const formRef = ref();

      const state = reactive({});

      const formState = reactive({});

      const seqDeleted = ref([{
        value: 'false',
        label: '否',
      }, {
        value: 'true',
        label: '是',
      }]);

      const formRules = {
        // channelCode: [{
        //   required: true,
        //   message: '请输入通道编号(必填)',
        //   trigger: 'blur'
        // }],
        // fullQty: [{
        //   required: true,
        //   message: '请输入满盘数量(必填)',
        //   trigger: 'blur',
        //   type:'number'
        // }],
        // totalQty: [{
        //   required: true,
        //   message: '请输入总分配数量(必填)',
        //   trigger: 'blur',
        //   type:'number'
        // }],
        // currentQty: [{
        //   required: true,
        //   message: '请输入当前数量(必填)',
        //   trigger: 'blur',
        //   type:'number'
        // }],
      };

      const saveKey = "save";


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

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


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

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