form.vue.vm 1.8 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758
  1. <script lang="ts" setup>
  2. import { ref, unref } from 'vue'
  3. import { createFormSchema, updateFormSchema } from './${classNameVar}.data'
  4. import { useI18n } from '@/hooks/web/useI18n'
  5. import { useMessage } from '@/hooks/web/useMessage'
  6. import { BasicForm, useForm } from '@/components/Form'
  7. import { BasicModal, useModalInner } from '@/components/Modal'
  8. import { create${simpleClassName}, get${simpleClassName}, update${simpleClassName} } from '@/api/${table.moduleName}/${table.businessName}'
  9. defineOptions({ name: '${table.className}Modal' })
  10. const emit = defineEmits(['success', 'register'])
  11. const { t } = useI18n()
  12. const { createMessage } = useMessage()
  13. const isUpdate = ref(true)
  14. const [registerForm, { setFieldsValue, resetFields, resetSchema, validate }] = useForm({
  15. labelWidth: 120,
  16. baseColProps: { span: 24 },
  17. schemas: createFormSchema,
  18. showActionButtonGroup: false,
  19. actionColOptions: { span: 23 },
  20. })
  21. const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
  22. resetFields()
  23. setModalProps({ confirmLoading: false })
  24. isUpdate.value = !!data?.isUpdate
  25. if (unref(isUpdate)) {
  26. resetSchema(updateFormSchema)
  27. const res = await get${simpleClassName}(data.record.id)
  28. setFieldsValue({ ...res })
  29. }
  30. })
  31. async function handleSubmit() {
  32. try {
  33. const values = await validate()
  34. setModalProps({ confirmLoading: true })
  35. if (unref(isUpdate))
  36. await update${simpleClassName}(values)
  37. else
  38. await create${simpleClassName}(values)
  39. closeModal()
  40. emit('success')
  41. createMessage.success(t('common.saveSuccessText'))
  42. } finally {
  43. setModalProps({ confirmLoading: false })
  44. }
  45. }
  46. </script>
  47. <template>
  48. <BasicModal v-bind="$attrs" :title="isUpdate ? t('action.edit') : t('action.create')" @register="registerModal" @ok="handleSubmit">
  49. <BasicForm @register="registerForm" />
  50. </BasicModal>
  51. </template>