Files
my-spring/web-vue/packages/erp/views/erp/transactionFlow/form.vue
2026-03-22 13:39:20 +08:00

168 lines
4.6 KiB
Vue

<!--
* Copyright (c) 2013-Now https://jeesite.com All rights reserved.
* No deletion without permission, or be held responsible to law.
* @author gaoxq
-->
<template>
<BasicDrawer
v-bind="$attrs"
:showFooter="true"
:okAuth="'erp:transactionFlow:edit'"
@register="registerDrawer"
@ok="handleSubmit"
width="70%"
>
<template #title>
<Icon :icon="getTitle.icon" class="m-1 pr-1" />
<span> {{ getTitle.value }} </span>
</template>
<BasicForm @register="registerForm" />
</BasicDrawer>
</template>
<script lang="ts" setup name="ViewsErpTransactionFlowForm">
import { ref, unref, computed } from 'vue';
import { useI18n } from '@jeesite/core/hooks/web/useI18n';
import { useMessage } from '@jeesite/core/hooks/web/useMessage';
import { router } from '@jeesite/core/router';
import { Icon } from '@jeesite/core/components/Icon';
import { BasicForm, FormSchema, useForm } from '@jeesite/core/components/Form';
import { BasicDrawer, useDrawerInner } from '@jeesite/core/components/Drawer';
import { ErpTransactionFlow, erpTransactionFlowSave, erpTransactionFlowForm } from '@jeesite/erp/api/erp/transactionFlow';
import { formatToDateTime } from '@jeesite/core/utils/dateUtil';
const emit = defineEmits(['success', 'register']);
const { t } = useI18n('erp.transactionFlow');
const { showMessage } = useMessage();
const { meta } = unref(router.currentRoute);
const record = ref<ErpTransactionFlow>({} as ErpTransactionFlow);
const getTitle = computed(() => ({
icon: meta.icon || 'i-ant-design:book-outlined',
value: record.value.isNewRecord ? t('新增流水') : t('编辑流水'),
}));
const inputFormSchemas: FormSchema<ErpTransactionFlow>[] = [
{
label: t('基本信息'),
field: 'basicInfo',
component: 'FormGroup',
colProps: { md: 24, lg: 24 },
},
{
label: t('交易名称'),
field: 'flowName',
component: 'Input',
componentProps: {
maxlength: 32,
},
required: true,
},
{
label: t('交易类型'),
field: 'flowType',
component: 'Input',
componentProps: {
maxlength: 12,
},
required: true,
},
{
label: t('交易金额'),
field: 'amount',
component: 'Input',
componentProps: {
maxlength: 18,
},
required: true,
},
{
label: t('交易时间'),
field: 'tradeTime',
component: 'DatePicker',
componentProps: {
format: 'YYYY-MM-DD HH:mm',
showTime: { format: 'HH:mm' },
},
required: true,
},
{
label: t('交易账户'),
field: 'accountId',
component: 'Input',
componentProps: {
maxlength: 52,
},
required: true,
},
{
label: t('交易分类'),
field: 'categoryId',
component: 'Input',
componentProps: {
maxlength: 52,
},
required: true,
},
{
label: t('交易备注'),
field: 'remark',
component: 'Input',
componentProps: {
maxlength: 500,
},
},
{
label: t('业务标识'),
field: 'businessId',
component: 'Input',
componentProps: {
maxlength: 52,
},
required: true,
},
];
const [registerForm, { resetFields, setFieldsValue, validate }] = useForm<ErpTransactionFlow>({
labelWidth: 120,
schemas: inputFormSchemas,
baseColProps: { md: 24, lg: 12 },
});
const [registerDrawer, { setDrawerProps, closeDrawer }] = useDrawerInner(async (data) => {
setDrawerProps({ loading: true });
await resetFields();
const res = await erpTransactionFlowForm(data);
record.value = (res.erpTransactionFlow || {}) as ErpTransactionFlow;
record.value.__t = new Date().getTime();
await setFieldsValue(record.value);
setDrawerProps({ loading: false });
});
async function handleSubmit() {
try {
const data = await validate();
setDrawerProps({ confirmLoading: true });
const params: any = {
isNewRecord: record.value.isNewRecord,
flowId: record.value.flowId || data.flowId,
};
data[record.value.isNewRecord ? 'createTime' : 'updateTime'] = formatToDateTime(new Date());
// console.log('submit', params, data, record);
const res = await erpTransactionFlowSave(params, data);
showMessage(res.message);
setTimeout(closeDrawer);
emit('success', data);
} catch (error: any) {
if (error && error.errorFields) {
showMessage(error.message || t('common.validateError'));
}
console.log('error', error);
} finally {
setDrawerProps({ confirmLoading: false });
}
}
</script>