BasicInfoForm.vue 1.6 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788
  1. <script setup lang="ts">
  2. import { PropType, reactive, watch } from 'vue'
  3. import { required } from '@/utils/formRules'
  4. import { CodegenTableVO } from '@/api/infra/codegen/types'
  5. import { Form } from '@/components/Form'
  6. import { useForm } from '@/hooks/web/useForm'
  7. const props = defineProps({
  8. basicInfo: {
  9. type: Object as PropType<Nullable<CodegenTableVO>>,
  10. default: () => null
  11. }
  12. })
  13. const rules = reactive({
  14. tableName: [required],
  15. tableComment: [required],
  16. className: [required],
  17. author: [required]
  18. })
  19. const schema = reactive<FormSchema[]>([
  20. {
  21. label: '表名称',
  22. field: 'tableName',
  23. component: 'Input',
  24. colProps: {
  25. span: 12
  26. }
  27. },
  28. {
  29. label: '表描述',
  30. field: 'tableComment',
  31. component: 'Input',
  32. colProps: {
  33. span: 12
  34. }
  35. },
  36. {
  37. label: '实体类名称',
  38. field: 'className',
  39. component: 'Input',
  40. colProps: {
  41. span: 12
  42. }
  43. },
  44. {
  45. label: '作者',
  46. field: 'author',
  47. component: 'Input',
  48. colProps: {
  49. span: 12
  50. }
  51. },
  52. {
  53. label: '备注',
  54. field: 'remark',
  55. component: 'Input',
  56. componentProps: {
  57. type: 'textarea',
  58. rows: 4
  59. },
  60. colProps: {
  61. span: 12
  62. }
  63. }
  64. ])
  65. const { register, methods, elFormRef } = useForm({
  66. schema
  67. })
  68. watch(
  69. () => props.basicInfo,
  70. (basicInfo) => {
  71. if (!basicInfo) return
  72. const { setValues } = methods
  73. setValues(basicInfo)
  74. },
  75. {
  76. deep: true,
  77. immediate: true
  78. }
  79. )
  80. defineExpose({
  81. elFormRef,
  82. getFormData: methods.getFormData
  83. })
  84. </script>
  85. <template>
  86. <Form :rules="rules" @register="register" />
  87. </template>