Commit b0f4a252c747fadfda2d2d95b7be3e33f08f3ba7

Authored by puhui999
1 parent 28c818e9

【功能完善】INFRA:代码生成 vben5 antd 树表模版

yudao-module-infra/yudao-module-infra-biz/src/main/resources/codegen/vue3_vben5_antd/general/views/form.vue.vm
... ... @@ -5,11 +5,11 @@ import type { Rule } from 'ant-design-vue/es/form';
5 5 import { useVbenModal } from '@vben/common-ui';
6 6 import { Tinymce as RichTextarea } from '#/components/tinymce';
7 7 import { ImageUpload, FileUpload } from "#/components/upload";
8   -import { message, Tabs, Form, Input, Textarea, Select, RadioGroup, Radio, CheckboxGroup, Checkbox, DatePicker } from 'ant-design-vue';
  8 +import { message, Tabs, Form, Input, Textarea, Select, RadioGroup, Radio, CheckboxGroup, Checkbox, DatePicker, TreeSelect } from 'ant-design-vue';
9 9 import { DICT_TYPE, getDictOptions } from '#/utils/dict';
10 10 #if($table.templateType == 2)## 树表需要导入这些
11 11 import { get${simpleClassName}List } from '#/api/${table.moduleName}/${simpleClassName_strikeCase}';
12   -import { handleTree } from '#/utils/tree';
  12 +import { handleTree } from '@vben/utils'
13 13 #end
14 14 ## 特殊:主子表专属逻辑
15 15 #if ( $table.templateType == 10 || $table.templateType == 12 )
... ... @@ -90,10 +90,12 @@ const resetForm = () => {
90 90 /** 获得${table.classComment}树 */
91 91 const get${simpleClassName}Tree = async () => {
92 92 ${classNameVar}Tree.value = []
93   - const data = await get${simpleClassName}List()
94   - const root: Tree = { id: 0, name: '顶级${table.classComment}', children: [] }
95   - root.children = handleTree(data, 'id', '${treeParentColumn.javaField}')
96   - ${classNameVar}Tree.value.push(root)
  93 + const data = await get${simpleClassName}List({});
  94 + data.unshift({
  95 + id: 0,
  96 + name: '顶级${table.classComment}',
  97 + });
  98 + ${classNameVar}Tree.value = handleTree(data);
97 99 }
98 100 #end
99 101  
... ... @@ -205,9 +207,17 @@ const [Modal, modalApi] = useVbenModal({
205 207 v-model:value="formData.${javaField}"
206 208 :treeData="${classNameVar}Tree"
207 209 #if ($treeNameColumn.javaField == "name")
208   - :fieldNames="defaultProps"
  210 + :fieldNames="{
  211 + label: 'name',
  212 + value: 'id',
  213 + children: 'children',
  214 + }"
209 215 #else
210   - :fieldNames="{...defaultProps, label: '$treeNameColumn.javaField'}"
  216 + :fieldNames="{
  217 + label: '$treeNameColumn.javaField',
  218 + value: 'id',
  219 + children: 'children',
  220 + }"
211 221 #end
212 222 checkable
213 223 treeDefaultExpandAll
... ...
yudao-module-infra/yudao-module-infra-biz/src/main/resources/codegen/vue3_vben5_antd/general/views/index.vue.vm
... ... @@ -26,7 +26,7 @@ import { getRangePickerDefaultProps } from '#/utils/date';
26 26 import { ref, h, reactive,onMounted,nextTick } from 'vue';
27 27 import { $t } from '#/locales';
28 28 #if (${table.templateType} == 2)## 树表接口
29   -import { handleTree } from '@/utils/tree'
  29 +import { handleTree,isEmpty } from '@vben/utils'
30 30 import { get${simpleClassName}List, delete${simpleClassName}, export${simpleClassName} } from '#/api/${table.moduleName}/${simpleClassName_strikeCase}';
31 31 #else## 标准表接口
32 32 import { get${simpleClassName}Page, delete${simpleClassName}, export${simpleClassName} } from '#/api/${table.moduleName}/${simpleClassName_strikeCase}';
... ... @@ -42,7 +42,12 @@ const select${simpleClassName} = ref<${simpleClassName}Api.${simpleClassName}>()
42 42 #end
43 43  
44 44 const loading = ref(true) // 列表的加载中
  45 +#if ( $table.templateType == 2 )
  46 +const list = ref<any[]>([]) // 树列表的数据
  47 +#else
45 48 const list = ref<${simpleClassName}Api.${simpleClassName}[]>([]) // 列表的数据
  49 +#end
  50 +
46 51 ## 特殊:树表专属逻辑(树不需要分页接口)
47 52 #if ( $table.templateType != 2 )
48 53 const total = ref(0) // 列表的总页数
... ... @@ -83,8 +88,7 @@ const getList = async () =&gt; {
83 88 #end
84 89 ## 特殊:树表专属逻辑(树不需要分页接口)
85 90 #if ( $table.templateType == 2 )
86   - const data = await get${simpleClassName}List(params)
87   - list.value = handleTree(data, 'id', '${treeParentColumn.javaField}')
  91 + list.value = await get${simpleClassName}List(params);
88 92 #else
89 93 const data = await get${simpleClassName}Page(params)
90 94 list.value = data.list
... ... @@ -97,7 +101,9 @@ const getList = async () =&gt; {
97 101  
98 102 /** 搜索按钮操作 */
99 103 const handleQuery = () => {
  104 +#if ( $table.templateType != 2 )
100 105 queryParams.pageNo = 1
  106 +#end
101 107 getList()
102 108 }
103 109  
... ... @@ -163,6 +169,16 @@ try {
163 169 const hiddenSearchBar = ref(false);
164 170 const tableToolbarRef = ref<InstanceType<typeof TableToolbar>>();
165 171 const tableRef = ref<VxeTableInstance>();
  172 +
  173 +#if (${table.templateType} == 2)
  174 +/** 切换树形展开/收缩状态 */
  175 +const isExpanded = ref(true);
  176 +function toggleExpand() {
  177 + isExpanded.value = !isExpanded.value;
  178 + tableRef.value?.setAllTreeExpand(isExpanded.value);
  179 +}
  180 +#end
  181 +
166 182 /** 初始化 */
167 183 onMounted(async () => {
168 184 await getList();
... ... @@ -270,6 +286,11 @@ onMounted(async () =&gt; {
270 286 ref="tableToolbarRef"
271 287 v-model:hidden-search="hiddenSearchBar"
272 288 >
  289 + #if (${table.templateType} == 2)
  290 + <Button @click="toggleExpand" class="mr-2">
  291 + {{ isExpanded ? '收缩' : '展开' }}
  292 + </Button>
  293 + #end
273 294 <Button
274 295 class="ml-2"
275 296 :icon="h(Plus)"
... ... @@ -277,7 +298,7 @@ onMounted(async () =&gt; {
277 298 @click="onCreate"
278 299 v-access:code="['${permissionPrefix}:create']"
279 300 >
280   - {{ $t('ui.actionTitle.create', ['示例联系人']) }}
  301 + {{ $t('ui.actionTitle.create', ['${table.classComment}']) }}
281 302 </Button>
282 303 <Button
283 304 :icon="h(Download)"
... ... @@ -291,7 +312,21 @@ onMounted(async () =&gt; {
291 312 </Button>
292 313 </TableToolbar>
293 314 </template>
294   - <vxe-table ref="tableRef" :data="list" show-overflow :loading="loading">
  315 + <vxe-table
  316 + ref="tableRef"
  317 + :data="list"
  318 + #if ( $table.templateType == 2 )
  319 + :tree-config="{
  320 + parentField: '${treeParentColumn.javaField}',
  321 + rowField: 'id',
  322 + transform: true,
  323 + expandAll: true,
  324 + reserve: true,
  325 + }"
  326 + #end
  327 + show-overflow
  328 + :loading="loading"
  329 + >
295 330 ## 特殊:主子表专属逻辑
296 331 #if ( $table.templateType == 12 && $subTables && $subTables.size() > 0 )
297 332 <!-- 子表的列表 -->
... ... @@ -330,6 +365,8 @@ onMounted(async () =&gt; {
330 365 <dict-tag :type="DICT_TYPE.$dictType.toUpperCase()" :value="row.${javaField}" />
331 366 </template>
332 367 </vxe-column>
  368 + #elseif ($table.templateType == 2 && $javaField == $treeNameColumn.javaField)
  369 + <vxe-column field="${javaField}" title="${comment}" align="center" tree-node/>
333 370 #else
334 371 <vxe-column field="${javaField}" title="${comment}" align="center" />
335 372 #end
... ... @@ -337,6 +374,16 @@ onMounted(async () =&gt; {
337 374 #end
338 375 <vxe-column field="operation" title="操作" align="center">
339 376 <template #default="{row}">
  377 +#if ( $table.templateType == 2 )
  378 + <Button
  379 + size="small"
  380 + type="link"
  381 + @click="onAppend(row as any)"
  382 + v-access:code="['${permissionPrefix}:create']"
  383 + >
  384 + 新增下级
  385 + </Button>
  386 +#end
340 387 <Button
341 388 size="small"
342 389 type="link"
... ... @@ -348,7 +395,11 @@ onMounted(async () =&gt; {
348 395 <Button
349 396 size="small"
350 397 type="link"
  398 + danger
351 399 class="ml-2"
  400 + #if ( $table.templateType == 2 )
  401 + :disabled="!isEmpty(row?.children)"
  402 + #end
352 403 @click="onDelete(row as any)"
353 404 v-access:code="['${permissionPrefix}:delete']"
354 405 >
... ... @@ -357,6 +408,7 @@ onMounted(async () =&gt; {
357 408 </template>
358 409 </vxe-column>
359 410 </vxe-table>
  411 +#if ( $table.templateType != 2 )
360 412 <!-- 分页 -->
361 413 <div class="mt-2 flex justify-end">
362 414 <Pagination
... ... @@ -367,6 +419,7 @@ onMounted(async () =&gt; {
367 419 @change="getList"
368 420 />
369 421 </div>
  422 +#end
370 423 </ContentWrap>
371 424  
372 425 #if ($table.templateType == 11) ## erp情况
... ...