BJ_ZTEITS-Developers / parking-cloud-yudao

Commit da248cd12642c7af0f22777750288aa538568e7e

Authored by puhui999
1 parent 1f7f0654

【代码优化】代码生成: vue3_vben5_antd schema 主子表模板优化（标准和内嵌模式）

Inline Side-by-side
Showing 2 changed files with 130 additions and 16 deletions
yudao-module-infra/yudao-module-infra-biz/src/main/resources/codegen/vue3_vben5_antd/schema/views/data.ts.vm
  View file @da248cd
... ... @@ -478,11 +478,29 @@ export function use${subSimpleClassName}GridColumns(
478 478 #set ($dictType = $column.dictType)
479 479 #set ($javaField = $column.javaField)
480 480 #set ($comment = $column.columnComment)
  481 + #if ($javaType == "Integer" || $javaType == "Long" || $javaType == "Byte" || $javaType == "Short")
  482 + #set ($dictMethod = "number")
  483 + #elseif ($javaType == "String")
  484 + #set ($dictMethod = "string")
  485 + #elseif ($javaType == "Boolean")
  486 + #set ($dictMethod = "boolean")
  487 + #end
481 488 {
482 489 field: '${javaField}',
483 490 title: '${comment}',
484 491 minWidth: 120,
485 492 slots: { default: '${javaField}' },
  493 + #if ($column.htmlType == "select" || $column.htmlType == "checkbox" || $column.htmlType == "radio")
  494 + #if ("" != $dictType)## 有数据字典
  495 + params: {
  496 + options: getDictOptions(DICT_TYPE.$dictType.toUpperCase(), '$dictMethod'),
  497 + },
  498 + #else
  499 + params: {
  500 + options: [],
  501 + },
  502 + #end
  503 + #end
486 504 },
487 505 #end
488 506 #end
... ...
yudao-module-infra/yudao-module-infra-biz/src/main/resources/codegen/vue3_vben5_antd/schema/views/form.vue.vm
  View file @da248cd
... ... @@ -2,13 +2,7 @@
2 2 import type { ${simpleClassName}Api } from '#/api/${table.moduleName}/${simpleClassName_strikeCase}';
3 3  
4 4 import { useVbenModal } from '@vben/common-ui';
5   -import { message, Tabs } from 'ant-design-vue';
6   -## 特殊：主子表专属逻辑
7   -#if ( $table.templateType == 10 || $table.templateType == 12 )
8   - #foreach ($subSimpleClassName in $subSimpleClassNames)
9   - import ${subSimpleClassName}Form from './${subSimpleClassName}Form.vue'
10   - #end
11   -#end
  5 +import { message, Tabs, Checkbox, Input, Textarea, Select,RadioGroup,CheckboxGroup, DatePicker } from 'ant-design-vue';
12 6  
13 7 import { computed, ref } from 'vue';
14 8 import { $t } from '#/locales';
... ... @@ -16,6 +10,20 @@ import { useVbenForm } from '#/adapter/form';
16 10 import { get${simpleClassName}, create${simpleClassName}, update${simpleClassName} } from '#/api/${table.moduleName}/${simpleClassName_strikeCase}';
17 11  
18 12 import { useFormSchema } from '../data';
  13 +#if ( $table.templateType == 10 || $table.templateType == 12 )
  14 +#if ( $subTables && $subTables.size() > 0 )
  15 +#foreach ($subTable in $subTables)
  16 + #set ($index = $foreach.count - 1)
  17 + #set ($subSimpleClassName = $subSimpleClassNames.get($index))
  18 + #if ($subTable.subJoinMany) ## 一对多
  19 +import { useVbenVxeGrid } from '#/adapter/vxe-table';
  20 +import { use${subSimpleClassName}GridColumns } from '../data';
  21 + #else
  22 +import { use${subSimpleClassName}FormSchema } from '../data';
  23 + #end
  24 +#end
  25 +#end
  26 +#end
19 27  
20 28 const emit = defineEmits(['success']);
21 29 const formData = ref<${simpleClassName}Api.${simpleClassName}>();
... ... @@ -40,15 +48,44 @@ const getTitle = computed(() =&gt; {
40 48  
41 49 ## 特殊：主子表专属逻辑
42 50 #if ( $table.templateType == 10 || $table.templateType == 12 )
43   - #if ( $subTables && $subTables.size() > 0 )
44   -
45   - /** 子表的表单 */
46   - const subTabsName = ref('$subClassNameVars.get(0)')
47   - #foreach ($subClassNameVar in $subClassNameVars)
48   - const ${subClassNameVar}FormRef = ref()
49   - #end
  51 +#if ( $subTables && $subTables.size() > 0 )
  52 +/** 子表的表单 */
  53 +const subTabsName = ref('$subClassNameVars.get(0)')
  54 +## 特殊：主子表专属逻辑
  55 +#foreach ($subTable in $subTables)
  56 + #set ($index = $foreach.count - 1)
  57 + #set ($subSimpleClassName = $subSimpleClassNames.get($index))
  58 + #set ($subClassNameVar = $subClassNameVars.get($index))
  59 + #if ($subTable.subJoinMany) ## 一对多
  60 +/** {$subTable.classComment}表格配置 */
  61 +const [${subSimpleClassName}Grid, {$subClassNameVar}GridApi] = useVbenVxeGrid({
  62 + gridOptions: {
  63 + columns: use${subSimpleClassName}GridColumns(),
  64 + border: true,
  65 + showOverflow: true,
  66 + autoResize: true,
  67 + keepSource: true,
  68 + rowConfig: {
  69 + keyField: 'id',
  70 + },
  71 + pagerConfig: {
  72 + enabled: false,
  73 + },
  74 + toolbarConfig: {
  75 + enabled: false,
  76 + },
  77 + },
  78 +});
  79 + #else
  80 +const [${subSimpleClassName}Form, {$subClassNameVar}FormApi] = useVbenForm({
  81 + layout: 'horizontal',
  82 + schema: useFormSchema(),
  83 + showDefaultActions: false
  84 +});
50 85 #end
51 86 #end
  87 +#end
  88 +#end
52 89  
53 90 const [Form, formApi] = useVbenForm({
54 91 layout: 'horizontal',
... ... @@ -56,6 +93,7 @@ const [Form, formApi] = useVbenForm({
56 93 showDefaultActions: false
57 94 });
58 95  
  96 +// TODO @puhui999: 处理完成主子表标准模式和内嵌模式下的表单提交
59 97 const [Modal, modalApi] = useVbenModal({
60 98 async onConfirm() {
61 99 const { valid } = await formApi.validate();
... ... @@ -143,9 +181,67 @@ const [Modal, modalApi] = useVbenModal({
143 181 #set ($index = $foreach.count - 1)
144 182 #set ($subClassNameVar = $subClassNameVars.get($index))
145 183 #set ($subSimpleClassName = $subSimpleClassNames.get($index))
146   - #set ($subJoinColumn_strikeCase = $subJoinColumn_strikeCases.get($index))
  184 + #set ($subColumns = $subColumnsList.get($index))##当前字段数组
  185 + #set ($subJoinColumn = $subJoinColumns.get($index))##当前 join 字段
147 186 <Tabs.TabPane key="$subClassNameVar" tab="${subTable.classComment}">
148   - <${subSimpleClassName}Form ref="${subClassNameVar}FormRef" :${subJoinColumn_strikeCase}="formData.id" />
  187 + #if ($subTable.subJoinMany) ## 一对多
  188 + <${subSimpleClassName}Grid class="mx-4">
  189 + #foreach($column in $subColumns)
  190 + #if ($column.createOperation || $column.updateOperation)
  191 + #set ($javaField = $column.javaField)
  192 + #if ( $column.id == $subJoinColumn.id) ## 特殊：忽略主子表的 join 字段，不用填写
  193 + #elseif ($column.htmlType == "input" && !$column.primaryKey)## 忽略主键，不用在表单里
  194 + <template #${javaField}="{ row }">
  195 + <Input v-model:value="row.${javaField}" />
  196 + </template>
  197 + #elseif($column.htmlType == "imageUpload")## 图片上传
  198 + <template #${javaField}="{ row }">
  199 + <UploadImg v-model:value="row.${javaField}" />
  200 + </template>
  201 + #elseif($column.htmlType == "fileUpload")## 文件上传
  202 + <template #${javaField}="{ row }">
  203 + <UploadFile v-model:value="row.${javaField}" />
  204 + </template>
  205 + #elseif($column.htmlType == "editor")## 文本编辑器
  206 + <template #${javaField}="{ row }">
  207 + <Textarea v-model:value="row.${javaField}" />
  208 + </template>
  209 + #elseif($column.htmlType == "select")## 下拉框
  210 + <template #${javaField}="{ row, column }">
  211 + <Select v-model:value="row.${javaField}" class="w-full">
  212 + <Select.Option v-for="option in column.params.options" :key="option.value" :value="option.value">
  213 + {{ option.label }}
  214 + </Select.Option>
  215 + </Select>
  216 + </template>
  217 + #elseif($column.htmlType == "checkbox")## 多选框
  218 + <template #${javaField}="{ row, column }">
  219 + <CheckboxGroup v-model:value="row.${javaField}" :options="column.params.options" />
  220 + </template>
  221 + #elseif($column.htmlType == "radio")## 单选框
  222 + <template #${javaField}="{ row, column }">
  223 + <RadioGroup v-model:value="row.${javaField}" :options="column.params.options" />
  224 + </template>
  225 + #elseif($column.htmlType == "datetime")## 时间框
  226 + <template #${javaField}="{ row }">
  227 + <DatePicker
  228 + v-model:value="row.${javaField}"
  229 + :showTime="true"
  230 + format="YYYY-MM-DD HH:mm:ss"
  231 + valueFormat='x'
  232 + />
  233 + </template>
  234 + #elseif($column.htmlType == "textarea")## 文本框
  235 + <template #${javaField}="{ row }">
  236 + <Textarea v-model:value="row.${javaField}" />
  237 + </template>
  238 + #end
  239 + #end
  240 + #end
  241 + </Grid>
  242 + #else
  243 + <${subSimpleClassName}Form class="mx-4" />
  244 + #end
149 245 </Tabs.TabPane>
150 246 #end
151 247 </Tabs>
... ...