<script lang="ts" setup>
|
import { computed, ref } from 'vue';
|
|
import { useVbenModal } from '@vben/common-ui';
|
|
import { message } from 'ant-design-vue';
|
|
import { useVbenForm } from '#/adapter/form';
|
import { createMapping, getMapping, updateMapping } from '#/api/erp/warehouseMapping';
|
import { $t } from '#/locales';
|
|
import { useFormSchema } from '../data';
|
|
defineOptions({ name: 'ErpWarehouseMappingForm' });
|
|
const emit = defineEmits<{ success: [] }>();
|
|
const formType = ref<'create' | 'update'>('create');
|
|
const [Form, formApi] = useVbenForm({
|
commonConfig: {
|
componentProps: {
|
class: 'w-full',
|
},
|
},
|
layout: 'horizontal',
|
schema: useFormSchema(),
|
showDefaultActions: false,
|
});
|
|
const [Modal, modalApi] = useVbenModal({
|
async onConfirm() {
|
const values = await formApi.getValues();
|
try {
|
if (formType.value === 'create') {
|
await createMapping(values);
|
message.success('创建成功');
|
} else {
|
await updateMapping(values);
|
message.success('更新成功');
|
}
|
emit('success');
|
modalApi.close();
|
} catch (error) {
|
console.error('保存失败:', error);
|
}
|
},
|
onOpenChange(isOpen) {
|
if (isOpen) {
|
const data = modalApi.getData() as {
|
formType: 'create' | 'update';
|
id?: number;
|
};
|
if (data) {
|
formType.value = data.formType;
|
if (data.formType === 'update' && data.id) {
|
// 加载详情
|
getMapping(data.id).then((detail) => {
|
formApi.setValues(detail);
|
});
|
} else {
|
formApi.resetForm();
|
}
|
}
|
}
|
},
|
});
|
|
const modalTitle = computed(() => {
|
return formType.value === 'create' ? '新增仓库映射' : '编辑仓库映射';
|
});
|
</script>
|
|
<template>
|
<Modal :title="modalTitle" class="w-[500px]">
|
<Form />
|
</Modal>
|
</template>
|