<template> <BasicModal v-bind="$attrs" @register="registerModal" :title="getTitle" @ok="handleSubmit" :width="500" :minHeight="20" :maxHeight="20"> <BasicForm @register="registerForm" /> </BasicModal> </template> <script lang="ts" setup> import { ref, computed, unref, inject } from 'vue'; import { BasicModal, useModalInner } from '/@/components/Modal'; import { BasicForm, useForm } from '/@/components/Form/index'; import { ticketFormSchema } from '../erplist.data'; import { saveOrUpdateTicket } from '../erplist.api'; //接收主表id const orderId = inject('orderId'); // 声明Emits const emit = defineEmits(['success', 'register']); const isUpdate = ref(true); //表单配置 const [registerForm, { resetFields, setFieldsValue, validate }] = useForm({ labelWidth: 150, schemas: ticketFormSchema, showActionButtonGroup: false, }); //表单赋值 const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => { //重置表单 await resetFields(); setModalProps({ confirmLoading: false }); isUpdate.value = !!data?.isUpdate; if (unref(isUpdate)) { //表单赋值 await setFieldsValue({ ...data.record, }); } }); //设置标题 const getTitle = computed(() => (!unref(isUpdate) ? '新增' : '编辑')); //表单提交事件 async function handleSubmit() { try { const values = await validate(); setModalProps({ confirmLoading: true }); if (unref(orderId)) { values.orderId = unref(orderId); } //提交表单 await saveOrUpdateTicket(values, isUpdate.value); //关闭弹窗 closeModal(); //刷新列表 emit('success'); } finally { setModalProps({ confirmLoading: false }); } } </script>