8df1ffb80a
region-address-picker 接 region-picker API；订单支持按进价重算 market_price、追踪页资金流水；MES/ERP/中台同步日志共用内容查看组件；地区管理支持 pid 下钻与拼音检索。
114 lines
3.1 KiB
Vue
114 lines
3.1 KiB
Vue
<script lang="ts" setup>
|
||
import { ref } from 'vue';
|
||
|
||
import { useVbenModal } from '@vben/common-ui';
|
||
|
||
import { message } from 'ant-design-vue';
|
||
|
||
import { useVbenForm } from '#/adapter/form';
|
||
import { createRegion, updateRegion } from '#/views/system/region/api';
|
||
import { modalFormProps } from '#/views/system/region/config/form';
|
||
|
||
const isUpdate = ref(false);
|
||
const onSuccessRef = ref<(() => void) | null>(null);
|
||
|
||
const [Form, formApi] = useVbenForm(modalFormProps);
|
||
|
||
/**
|
||
* 组装提交字段：市/区暂不提交快递费（字段保留，后续级联启用再开）
|
||
* 新建子级仍写 0，避免库字段空值；编辑子级不改 express_fee
|
||
*/
|
||
function buildSubmitPayload(values: Record<string, any>, update: boolean) {
|
||
const formLevel = Number(values.formLevel);
|
||
const payload: Record<string, unknown> = {
|
||
id: values.id,
|
||
name: values.name,
|
||
pid: formLevel === 1 ? 0 : values.pid,
|
||
};
|
||
if (formLevel === 1) {
|
||
payload.express_fee = values.express_fee ?? 0;
|
||
} else if (!update) {
|
||
payload.express_fee = 0;
|
||
}
|
||
return payload;
|
||
}
|
||
|
||
function validateFormValues(values: Record<string, any>) {
|
||
const formLevel = Number(values.formLevel);
|
||
if (!String(values.name ?? '').trim()) {
|
||
message.error('请输入名称');
|
||
return false;
|
||
}
|
||
if (formLevel === 2 && !values.pid) {
|
||
message.error('请选择父级地区');
|
||
return false;
|
||
}
|
||
// 仅省级要求填快递费；市/区入口已隐藏
|
||
if (formLevel === 1) {
|
||
if (
|
||
values.express_fee === null ||
|
||
values.express_fee === undefined ||
|
||
values.express_fee === ''
|
||
) {
|
||
message.error('请输入快递费');
|
||
return false;
|
||
}
|
||
}
|
||
return true;
|
||
}
|
||
|
||
const modalTitle = ref('新增快递费');
|
||
|
||
const [Modal, modalApi] = useVbenModal({
|
||
fullscreenButton: false,
|
||
draggable: true,
|
||
onCancel() {
|
||
modalApi.close();
|
||
},
|
||
onConfirm: async () => {
|
||
const values = await formApi.getValues();
|
||
if (!validateFormValues(values)) {
|
||
return;
|
||
}
|
||
const payload = buildSubmitPayload(values, isUpdate.value);
|
||
modalApi.setState({ loading: true, confirmLoading: true });
|
||
const submitApi = isUpdate.value ? updateRegion : createRegion;
|
||
submitApi(payload)
|
||
.then(() => {
|
||
message.success('保存成功');
|
||
onSuccessRef.value?.();
|
||
modalApi.close();
|
||
})
|
||
.finally(() => {
|
||
modalApi.setState({ loading: false, confirmLoading: false });
|
||
});
|
||
},
|
||
onOpenChange(isOpen: boolean) {
|
||
if (isOpen) {
|
||
const { values, update, formLevel, onSuccess } = modalApi.getData<
|
||
Record<string, any>
|
||
>();
|
||
isUpdate.value = update;
|
||
onSuccessRef.value = onSuccess ?? null;
|
||
const levelLabels: Record<number, string> = {
|
||
1: '省级地区',
|
||
2: '市级地区',
|
||
3: '区县',
|
||
};
|
||
modalTitle.value = `${update ? '编辑' : '新增'}${levelLabels[formLevel] ?? '地区'}`;
|
||
formApi.resetForm();
|
||
if (values) {
|
||
formApi.setValues({ ...values, formLevel });
|
||
}
|
||
} else {
|
||
onSuccessRef.value = null;
|
||
}
|
||
},
|
||
});
|
||
</script>
|
||
<template>
|
||
<Modal :title="modalTitle" class="w-[32%]">
|
||
<Form />
|
||
</Modal>
|
||
</template>
|