110 lines
3.2 KiB
Vue
110 lines
3.2 KiB
Vue
|
<template>
|
||
|
|
|
||
|
|
<BasicModal v-bind="$attrs" @register="registerModal" :title="getTitle" @ok="handleSubmit" @cancel="handleClose" :paddingRight="15" :bodyStyle="{ minHeight: '400px !important' }">
|
||
|
|
<ModalForm ref="formRef" :fromPage="FromPageType.MENU" />
|
||
|
|
</BasicModal>
|
||
|
|
|
||
|
|
</template>
|
||
|
|
<script lang="ts" setup>
|
||
|
|
import { ref, computed, reactive } from 'vue';
|
||
|
|
import { BasicModal, useModalInner } from '/@/components/Modal';
|
||
|
|
import { useMessage } from '/@/hooks/web/useMessage';
|
||
|
|
import { useI18n } from '/@/hooks/web/useI18n';
|
||
|
|
import { formProps } from './config';
|
||
|
|
import ModalForm from './Form.vue';
|
||
|
|
import { FromPageType } from '/@/enums/workflowEnum';
|
||
|
|
|
||
|
|
const emit = defineEmits(['success', 'register']);
|
||
|
|
|
||
|
|
const { notification } = useMessage();
|
||
|
|
const formRef = ref();
|
||
|
|
const state = reactive({
|
||
|
|
formModel: {},
|
||
|
|
isUpdate: true,
|
||
|
|
isView: false,
|
||
|
|
isCopy: false,
|
||
|
|
rowId: '',
|
||
|
|
});
|
||
|
|
|
||
|
|
const { t } = useI18n();
|
||
|
|
const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
|
||
|
|
state.isUpdate = !!data?.isUpdate;
|
||
|
|
state.isView = !!data?.isView;
|
||
|
|
state.isCopy = !!data?.isCopy;
|
||
|
|
|
||
|
|
setModalProps({
|
||
|
|
destroyOnClose: true,
|
||
|
|
maskClosable: false,
|
||
|
|
showCancelBtn: !state.isView,
|
||
|
|
showOkBtn: !state.isView,
|
||
|
|
canFullscreen: true,
|
||
|
|
width: 900,
|
||
|
|
});
|
||
|
|
if (state.isUpdate || state.isView || state.isCopy) {
|
||
|
|
state.rowId = data.id;
|
||
|
|
if (state.isView) {
|
||
|
|
await formRef.value.setDisabledForm();
|
||
|
|
}
|
||
|
|
await formRef.value.setFormDataFromId(state.rowId);
|
||
|
|
} else {
|
||
|
|
formRef.value.resetFields();
|
||
|
|
}
|
||
|
|
});
|
||
|
|
|
||
|
|
const getTitle = computed(() => (state.isView ? '查看' : !state.isUpdate ? '新增' : '编辑'));
|
||
|
|
|
||
|
|
async function saveModal() {
|
||
|
|
let saveSuccess = false;
|
||
|
|
try {
|
||
|
|
const values = await formRef.value?.validate();
|
||
|
|
//添加隐藏组件
|
||
|
|
if (formProps.hiddenComponent?.length) {
|
||
|
|
formProps.hiddenComponent.forEach((component) => {
|
||
|
|
values[component.bindField] = component.value;
|
||
|
|
});
|
||
|
|
}
|
||
|
|
if (values !== false) {
|
||
|
|
try {
|
||
|
|
if (!state.isUpdate || state.isCopy) {
|
||
|
|
saveSuccess = await formRef.value.add(values);
|
||
|
|
} else {
|
||
|
|
saveSuccess = await formRef.value.update({ values, rowId: state.rowId });
|
||
|
|
}
|
||
|
|
return saveSuccess;
|
||
|
|
} catch (error) {}
|
||
|
|
}
|
||
|
|
} catch (error) {
|
||
|
|
return saveSuccess;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
async function handleSubmit() {
|
||
|
|
try {
|
||
|
|
const saveSuccess = await saveModal();
|
||
|
|
setModalProps({ confirmLoading: true });
|
||
|
|
if (saveSuccess) {
|
||
|
|
if (!state.isUpdate || state.isCopy) {
|
||
|
|
//false 新增
|
||
|
|
notification.success({
|
||
|
|
message: 'Tip',
|
||
|
|
description: t('新增成功！'),
|
||
|
|
}); //提示消息
|
||
|
|
} else {
|
||
|
|
notification.success({
|
||
|
|
message: 'Tip',
|
||
|
|
description: t('修改成功！'),
|
||
|
|
}); //提示消息
|
||
|
|
}
|
||
|
|
closeModal();
|
||
|
|
formRef.value.resetFields();
|
||
|
|
emit('success');
|
||
|
|
}
|
||
|
|
} finally {
|
||
|
|
setModalProps({ confirmLoading: false });
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
function handleClose() {
|
||
|
|
formRef.value.resetFields();
|
||
|
|
}
|
||
|
|
</script>
|