BJ_ZTEITS-Developers / parking-cloud-yudao

Commit 4941a43e082d9e546aa209e9f53c7db50851c53c

Authored by xingyu
1 parent 258577e8

perf: 重构代码生成 优化性能

Inline Side-by-side
Showing 5 changed files with 187 additions and 230 deletions
yudao-ui-admin-vue3/src/views/infra/codegen/EditTable.vue
  View file @4941a43
... ... @@ -8,9 +8,6 @@
8 8 <el-tab-pane label="字段信息" name="cloum">
9 9 <CloumInfoForm ref="cloumInfoRef" :info="cloumCurrentRow" />
10 10 </el-tab-pane>
11   - <el-tab-pane label="生成信息" name="genInfo">
12   - <GenInfoForm ref="genInfoRef" :genInfo="tableCurrentRow" />
13   - </el-tab-pane>
14 11 </el-tabs>
15 12 <template #right>
16 13 <XButton
... ... @@ -30,7 +27,7 @@ import { ElTabs, ElTabPane } from &#39;element-plus&#39;
30 27 import { useI18n } from '@/hooks/web/useI18n'
31 28 import { useMessage } from '@/hooks/web/useMessage'
32 29 import { ContentDetailWrap } from '@/components/ContentDetailWrap'
33   -import { BasicInfoForm, CloumInfoForm, GenInfoForm } from './components'
  30 +import { BasicInfoForm, CloumInfoForm } from './components'
34 31 import { getCodegenTableApi, updateCodegenTableApi } from '@/api/infra/codegen'
35 32 import { CodegenTableVO, CodegenColumnVO, CodegenUpdateReqVO } from '@/api/infra/codegen/types'
36 33  
... ... @@ -40,12 +37,11 @@ const { push } = useRouter()
40 37 const { query } = useRoute()
41 38 const loading = ref(false)
42 39 const title = ref('代码生成')
43   -const activeName = ref('cloum')
  40 +const activeName = ref('basicInfo')
44 41 const cloumInfoRef = ref(null)
45 42 const tableCurrentRow = ref<CodegenTableVO>()
46 43 const cloumCurrentRow = ref<CodegenColumnVO[]>([])
47 44 const basicInfoRef = ref<ComponentRef<typeof BasicInfoForm>>()
48   -const genInfoRef = ref<ComponentRef<typeof GenInfoForm>>()
49 45  
50 46 const getList = async () => {
51 47 const id = query.id as unknown as number
... ... @@ -59,14 +55,11 @@ const getList = async () =&gt; {
59 55 }
60 56 const submitForm = async () => {
61 57 const basicInfo = unref(basicInfoRef)
62   - const genInfo = unref(genInfoRef)
63 58 const basicForm = await basicInfo?.elFormRef?.validate()?.catch(() => {})
64   - const genForm = await genInfo?.elFormRef?.validate()?.catch(() => {})
65   - if (basicForm && genForm) {
  59 + if (basicForm) {
66 60 const basicInfoData = (await basicInfo?.getFormData()) as CodegenTableVO
67   - const genInfoData = (await genInfo?.getFormData()) as CodegenTableVO
68 61 const genTable: CodegenUpdateReqVO = {
69   - table: Object.assign({}, basicInfoData, genInfoData),
  62 + table: basicInfoData,
70 63 columns: cloumCurrentRow.value
71 64 }
72 65 await updateCodegenTableApi(genTable)
... ...
yudao-ui-admin-vue3/src/views/infra/codegen/components/BasicInfoForm.vue
  View file @4941a43
... ... @@ -2,23 +2,42 @@
2 2 <Form :rules="rules" @register="register" />
3 3 </template>
4 4 <script setup lang="ts">
5   -import { PropType, reactive, watch } from 'vue'
  5 +import { onMounted, PropType, reactive, ref, watch } from 'vue'
6 6 import { required } from '@/utils/formRules'
7 7 import { useForm } from '@/hooks/web/useForm'
8 8 import { Form } from '@/components/Form'
9 9 import { FormSchema } from '@/types/form'
10 10 import { CodegenTableVO } from '@/api/infra/codegen/types'
  11 +import { DICT_TYPE, getIntDictOptions } from '@/utils/dict'
  12 +import { listSimpleMenusApi } from '@/api/system/menu'
  13 +import { handleTree, defaultProps } from '@/utils/tree'
  14 +
11 15 const props = defineProps({
12 16 basicInfo: {
13 17 type: Object as PropType<Nullable<CodegenTableVO>>,
14 18 default: () => null
15 19 }
16 20 })
  21 +
  22 +const templateTypeOptions = getIntDictOptions(DICT_TYPE.INFRA_CODEGEN_TEMPLATE_TYPE)
  23 +const sceneOptions = getIntDictOptions(DICT_TYPE.INFRA_CODEGEN_SCENE)
  24 +const menuOptions = ref<any>([]) // 树形结构
  25 +const getTree = async () => {
  26 + const res = await listSimpleMenusApi()
  27 + menuOptions.value = handleTree(res)
  28 +}
  29 +
17 30 const rules = reactive({
18 31 tableName: [required],
19 32 tableComment: [required],
20 33 className: [required],
21   - author: [required]
  34 + author: [required],
  35 + templateType: [required],
  36 + scene: [required],
  37 + moduleName: [required],
  38 + businessName: [required],
  39 + businessPackage: [required],
  40 + classComment: [required]
22 41 })
23 42 const schema = reactive<FormSchema[]>([
24 43 {
... ... @@ -46,6 +65,79 @@ const schema = reactive&lt;FormSchema[]&gt;([
46 65 }
47 66 },
48 67 {
  68 + label: '生成模板',
  69 + field: 'templateType',
  70 + component: 'Select',
  71 + componentProps: {
  72 + options: templateTypeOptions
  73 + },
  74 + colProps: {
  75 + span: 12
  76 + }
  77 + },
  78 + {
  79 + label: '生成场景',
  80 + field: 'scene',
  81 + component: 'Select',
  82 + componentProps: {
  83 + options: sceneOptions
  84 + },
  85 + colProps: {
  86 + span: 12
  87 + }
  88 + },
  89 + {
  90 + label: '模块名',
  91 + field: 'moduleName',
  92 + component: 'Input',
  93 + labelMessage: '模块名，即一级目录，例如 system、infra、tool 等等',
  94 + colProps: {
  95 + span: 12
  96 + }
  97 + },
  98 + {
  99 + label: '业务名',
  100 + field: 'businessName',
  101 + component: 'Input',
  102 + labelMessage: '业务名，即二级目录，例如 user、permission、dict 等等',
  103 + colProps: {
  104 + span: 12
  105 + }
  106 + },
  107 + {
  108 + label: '类名称',
  109 + field: 'className',
  110 + component: 'Input',
  111 + labelMessage: '类名称（首字母大写），例如SysUser、SysMenu、SysDictData 等等',
  112 + colProps: {
  113 + span: 12
  114 + }
  115 + },
  116 + {
  117 + label: '类描述',
  118 + field: 'classComment',
  119 + component: 'Input',
  120 + labelMessage: '用作类描述，例如 用户',
  121 + colProps: {
  122 + span: 12
  123 + }
  124 + },
  125 + {
  126 + label: '上级菜单',
  127 + field: 'parentMenuId',
  128 + component: 'TreeSelect',
  129 + componentProps: {
  130 + data: menuOptions,
  131 + props: defaultProps,
  132 + checkStrictly: true,
  133 + nodeKey: 'id'
  134 + },
  135 + labelMessage: '分配到指定菜单下，例如 系统管理',
  136 + colProps: {
  137 + span: 12
  138 + }
  139 + },
  140 + {
49 141 label: '作者',
50 142 field: 'author',
51 143 component: 'Input',
... ... @@ -81,6 +173,10 @@ watch(
81 173 immediate: true
82 174 }
83 175 )
  176 +// ========== 初始化 ==========
  177 +onMounted(async () => {
  178 + await getTree()
  179 +})
84 180  
85 181 defineExpose({
86 182 elFormRef,
... ...
yudao-ui-admin-vue3/src/views/infra/codegen/components/CloumInfoForm.vue
  View file @4941a43
1 1 <template>
2 2 <vxe-table
3 3 ref="dragTable"
  4 + border
4 5 :data="info"
5 6 max-height="600"
6 7 stripe
7 8 class="xtable-scrollbar"
8 9 :column-config="{ resizable: true }"
9 10 >
10   - <vxe-column title="字段列名" field="columnName" fixed="left" width="80" />
11   - <vxe-column title="字段描述" field="columnComment">
12   - <template #default="{ row }">
13   - <el-input v-model="row.columnComment" />
14   - </template>
15   - </vxe-column>
16   - <vxe-column title="物理类型" field="dataType" width="10%" />
17   - <vxe-column title="Java类型" width="10%" field="javaType">
18   - <template #default="{ row }">
19   - <el-select v-model="row.javaType">
20   - <el-option label="Long" value="Long" />
21   - <el-option label="String" value="String" />
22   - <el-option label="Integer" value="Integer" />
23   - <el-option label="Double" value="Double" />
24   - <el-option label="BigDecimal" value="BigDecimal" />
25   - <el-option label="LocalDateTime" value="LocalDateTime" />
26   - <el-option label="Boolean" value="Boolean" />
27   - </el-select>
28   - </template>
29   - </vxe-column>
30   - <vxe-column title="java属性" width="10%" field="javaField">
31   - <template #default="{ row }">
32   - <el-input v-model="row.javaField" />
33   - </template>
34   - </vxe-column>
35   - <vxe-column title="插入" width="4%" field="createOperation">
36   - <template #default="{ row }">
37   - <vxe-checkbox true-label="true" false-label="false" v-model="row.createOperation" />
38   - </template>
39   - </vxe-column>
40   - <vxe-column title="编辑" width="4%" field="updateOperation">
41   - <template #default="{ row }">
42   - <vxe-checkbox true-label="true" false-label="false" v-model="row.updateOperation" />
43   - </template>
44   - </vxe-column>
45   - <vxe-column title="列表" width="4%" field="listOperationResult">
46   - <template #default="{ row }">
47   - <vxe-checkbox true-label="true" false-label="false" v-model="row.listOperationResult" />
48   - </template>
49   - </vxe-column>
50   - <vxe-column title="查询" width="4%" field="listOperation">
51   - <template #default="{ row }">
52   - <vxe-checkbox true-label="true" false-label="false" v-model="row.listOperation" />
53   - </template>
54   - </vxe-column>
55   - <vxe-column title="查询方式" width="8%" field="listOperationCondition">
56   - <template #default="{ row }">
57   - <el-select v-model="row.listOperationCondition">
58   - <el-option label="=" value="=" />
59   - <el-option label="!=" value="!=" />
60   - <el-option label=">" value=">" />
61   - <el-option label=">=" value=">=" />
62   - <el-option label="<" value="<>" />
63   - <el-option label="<=" value="<=" />
64   - <el-option label="LIKE" value="LIKE" />
65   - <el-option label="BETWEEN" value="BETWEEN" />
66   - </el-select>
67   - </template>
68   - </vxe-column>
69   - <vxe-column title="允许空" width="4%" field="nullable">
70   - <template #default="{ row }">
71   - <vxe-checkbox true-label="true" false-label="false" v-model="row.nullable" />
72   - </template>
73   - </vxe-column>
  11 + <vxe-column title="字段列名" field="columnName" fixed="left" width="10%" />
  12 + <vxe-colgroup title="基础属性">
  13 + <vxe-column title="字段描述" field="columnComment" width="10%">
  14 + <template #default="{ row }">
  15 + <vxe-input v-model="row.columnComment" placeholder="请输入字段描述" />
  16 + </template>
  17 + </vxe-column>
  18 + <vxe-column title="物理类型" field="dataType" width="10%" />
  19 + <vxe-column title="Java类型" width="10%" field="javaType">
  20 + <template #default="{ row }">
  21 + <vxe-select v-model="row.javaType" placeholder="请选择Java类型">
  22 + <vxe-option label="Long" value="Long" />
  23 + <vxe-option label="String" value="String" />
  24 + <vxe-option label="Integer" value="Integer" />
  25 + <vxe-option label="Double" value="Double" />
  26 + <vxe-option label="BigDecimal" value="BigDecimal" />
  27 + <vxe-option label="LocalDateTime" value="LocalDateTime" />
  28 + <vxe-option label="Boolean" value="Boolean" />
  29 + </vxe-select>
  30 + </template>
  31 + </vxe-column>
  32 + <vxe-column title="java属性" width="8%" field="javaField">
  33 + <template #default="{ row }">
  34 + <vxe-input v-model="row.javaField" placeholder="请输入java属性" />
  35 + </template>
  36 + </vxe-column>
  37 + </vxe-colgroup>
  38 + <vxe-colgroup title="增删改查">
  39 + <vxe-column title="插入" width="40px" field="createOperation">
  40 + <template #default="{ row }">
  41 + <vxe-checkbox true-label="true" false-label="false" v-model="row.createOperation" />
  42 + </template>
  43 + </vxe-column>
  44 + <vxe-column title="编辑" width="40px" field="updateOperation">
  45 + <template #default="{ row }">
  46 + <vxe-checkbox true-label="true" false-label="false" v-model="row.updateOperation" />
  47 + </template>
  48 + </vxe-column>
  49 + <vxe-column title="列表" width="40px" field="listOperationResult">
  50 + <template #default="{ row }">
  51 + <vxe-checkbox true-label="true" false-label="false" v-model="row.listOperationResult" />
  52 + </template>
  53 + </vxe-column>
  54 + <vxe-column title="查询" width="40px" field="listOperation">
  55 + <template #default="{ row }">
  56 + <vxe-checkbox true-label="true" false-label="false" v-model="row.listOperation" />
  57 + </template>
  58 + </vxe-column>
  59 + <vxe-column title="允许空" width="40px" field="nullable">
  60 + <template #default="{ row }">
  61 + <vxe-checkbox true-label="true" false-label="false" v-model="row.nullable" />
  62 + </template>
  63 + </vxe-column>
  64 + <vxe-column title="查询方式" width="60px" field="listOperationCondition">
  65 + <template #default="{ row }">
  66 + <vxe-select v-model="row.listOperationCondition" placeholder="请选择查询方式">
  67 + <vxe-option label="=" value="=" />
  68 + <vxe-option label="!=" value="!=" />
  69 + <vxe-option label=">" value=">" />
  70 + <vxe-option label=">=" value=">=" />
  71 + <vxe-option label="<" value="<>" />
  72 + <vxe-option label="<=" value="<=" />
  73 + <vxe-option label="LIKE" value="LIKE" />
  74 + <vxe-option label="BETWEEN" value="BETWEEN" />
  75 + </vxe-select>
  76 + </template>
  77 + </vxe-column>
  78 + </vxe-colgroup>
74 79 <vxe-column title="显示类型" width="10%" field="htmlType">
75 80 <template #default="{ row }">
76   - <el-select v-model="row.htmlType">
77   - <el-option label="文本框" value="input" />
78   - <el-option label="文本域" value="textarea" />
79   - <el-option label="下拉框" value="select" />
80   - <el-option label="单选框" value="radio" />
81   - <el-option label="复选框" value="checkbox" />
82   - <el-option label="日期控件" value="datetime" />
83   - <el-option label="图片上传" value="imageUpload" />
84   - <el-option label="文件上传" value="fileUpload" />
85   - <el-option label="富文本控件" value="editor" />
86   - </el-select>
  81 + <vxe-select v-model="row.htmlType" placeholder="请选择显示类型">
  82 + <vxe-option label="文本框" value="input" />
  83 + <vxe-option label="文本域" value="textarea" />
  84 + <vxe-option label="下拉框" value="select" />
  85 + <vxe-option label="单选框" value="radio" />
  86 + <vxe-option label="复选框" value="checkbox" />
  87 + <vxe-option label="日期控件" value="datetime" />
  88 + <vxe-option label="图片上传" value="imageUpload" />
  89 + <vxe-option label="文件上传" value="fileUpload" />
  90 + <vxe-option label="富文本控件" value="editor" />
  91 + </vxe-select>
87 92 </template>
88 93 </vxe-column>
89 94 <vxe-column title="字典类型" width="10%" field="dictType">
90 95 <template #default="{ row }">
91   - <el-select v-model="row.dictType" clearable filterable placeholder="请选择">
92   - <el-option
  96 + <vxe-select v-model="row.dictType" clearable filterable placeholder="请选择字典类型">
  97 + <vxe-option
93 98 v-for="dict in dictOptions"
94 99 :key="dict.id"
95 100 :label="dict.name"
96 101 :value="dict.type"
97 102 />
98   - </el-select>
  103 + </vxe-select>
99 104 </template>
100 105 </vxe-column>
101 106 <vxe-column title="示例" field="example">
102 107 <template #default="{ row }">
103   - <el-input v-model="row.example" />
  108 + <vxe-input v-model="row.example" placeholder="请输入示例" />
104 109 </template>
105 110 </vxe-column>
106 111 </vxe-table>
107 112 </template>
108 113 <script setup lang="ts">
109 114 import { onMounted, PropType, ref } from 'vue'
110   -import { ElInput, ElSelect, ElOption } from 'element-plus'
111 115 import { DictTypeVO } from '@/api/system/dict/types'
112 116 import { CodegenColumnVO } from '@/api/infra/codegen/types'
113 117 import { listSimpleDictTypeApi } from '@/api/system/dict/dict.type'
... ...
yudao-ui-admin-vue3/src/views/infra/codegen/components/GenInfoForm.vue deleted
View file @258577e
1   -<template>
2   - <Form :rules="rules" @register="register" />
3   -</template>
4   -<script setup lang="ts">
5   -import { onMounted, PropType, reactive, ref, watch } from 'vue'
6   -import { Form } from '@/components/Form'
7   -import { useForm } from '@/hooks/web/useForm'
8   -import { required } from '@/utils/formRules'
9   -import { handleTree, defaultProps } from '@/utils/tree'
10   -import { DICT_TYPE, getIntDictOptions } from '@/utils/dict'
11   -import { listSimpleMenusApi } from '@/api/system/menu'
12   -import { CodegenTableVO } from '@/api/infra/codegen/types'
13   -import { FormSchema } from '@/types/form'
14   -const props = defineProps({
15   - genInfo: {
16   - type: Object as PropType<Nullable<CodegenTableVO>>,
17   - default: () => null
18   - }
19   -})
20   -const rules = reactive({
21   - templateType: [required],
22   - scene: [required],
23   - moduleName: [required],
24   - businessName: [required],
25   - businessPackage: [required],
26   - className: [required],
27   - classComment: [required]
28   -})
29   -const templateTypeOptions = getIntDictOptions(DICT_TYPE.INFRA_CODEGEN_TEMPLATE_TYPE)
30   -const sceneOptions = getIntDictOptions(DICT_TYPE.INFRA_CODEGEN_SCENE)
31   -const menuOptions = ref<any>([]) // 树形结构
32   -const getTree = async () => {
33   - const res = await listSimpleMenusApi()
34   - menuOptions.value = handleTree(res)
35   -}
36   -const schema = reactive<FormSchema[]>([
37   - {
38   - label: '生成模板',
39   - field: 'templateType',
40   - component: 'Select',
41   - componentProps: {
42   - options: templateTypeOptions
43   - },
44   - colProps: {
45   - span: 12
46   - }
47   - },
48   - {
49   - label: '生成场景',
50   - field: 'scene',
51   - component: 'Select',
52   - componentProps: {
53   - options: sceneOptions
54   - },
55   - colProps: {
56   - span: 12
57   - }
58   - },
59   - {
60   - label: '模块名',
61   - field: 'moduleName',
62   - component: 'Input',
63   - labelMessage: '模块名，即一级目录，例如 system、infra、tool 等等',
64   - colProps: {
65   - span: 12
66   - }
67   - },
68   - {
69   - label: '业务名',
70   - field: 'businessName',
71   - component: 'Input',
72   - labelMessage: '业务名，即二级目录，例如 user、permission、dict 等等',
73   - colProps: {
74   - span: 12
75   - }
76   - },
77   - {
78   - label: '类名称',
79   - field: 'className',
80   - component: 'Input',
81   - labelMessage: '类名称（首字母大写），例如SysUser、SysMenu、SysDictData 等等',
82   - colProps: {
83   - span: 12
84   - }
85   - },
86   - {
87   - label: '类描述',
88   - field: 'classComment',
89   - component: 'Input',
90   - labelMessage: '用作类描述，例如 用户',
91   - colProps: {
92   - span: 12
93   - }
94   - },
95   - {
96   - label: '上级菜单',
97   - field: 'parentMenuId',
98   - component: 'TreeSelect',
99   - componentProps: {
100   - data: menuOptions,
101   - props: defaultProps,
102   - checkStrictly: true,
103   - nodeKey: 'id'
104   - },
105   - labelMessage: '分配到指定菜单下，例如 系统管理',
106   - colProps: {
107   - span: 12
108   - }
109   - }
110   -])
111   -const { register, methods, elFormRef } = useForm({
112   - schema
113   -})
114   -
115   -// ========== 初始化 ==========
116   -onMounted(async () => {
117   - await getTree()
118   -})
119   -watch(
120   - () => props.genInfo,
121   - (genInfo) => {
122   - if (!genInfo) return
123   - const { setValues } = methods
124   - setValues(genInfo)
125   - },
126   - {
127   - deep: true,
128   - immediate: true
129   - }
130   -)
131   -defineExpose({
132   - elFormRef,
133   - getFormData: methods.getFormData
134   -})
135   -</script>
yudao-ui-admin-vue3/src/views/infra/codegen/components/index.ts
  View file @4941a43
1 1 import BasicInfoForm from './BasicInfoForm.vue'
2 2 import CloumInfoForm from './CloumInfoForm.vue'
3   -import GenInfoForm from './GenInfoForm.vue'
4 3 import ImportTable from './ImportTable.vue'
5 4 import Preview from './Preview.vue'
6   -export { BasicInfoForm, CloumInfoForm, GenInfoForm, ImportTable, Preview }
  5 +export { BasicInfoForm, CloumInfoForm, ImportTable, Preview }
... ...