BJ_ZTEITS-Developers / parking-cloud-yudao

Commit 515cbbb285dc2df4decca664995cbb1512446e3b

Authored by puhui999
1 parent 57138d79

【功能完善】INFRA：代码生成 vben5 antd 主子表 inner 模版

Inline Side-by-side
Showing 3 changed files with 301 additions and 98 deletions
yudao-module-infra/yudao-module-infra-biz/src/main/resources/codegen/vue3_vben5_antd/general/views/modules/form_sub_inner.vue.vm
  View file @515cbbb
1 1 ## 主表的 normal 和 inner 使用相同的 form 表单
2   -#parse("codegen/vue3_vben5_antd/schema/views/modules/form_sub_normal.vue.vm")
3 2 \ No newline at end of file
  3 +#parse("codegen/vue3_vben5_antd/general/views/modules/form_sub_normal.vue.vm")
4 4 \ No newline at end of file
... ...
yudao-module-infra/yudao-module-infra-biz/src/main/resources/codegen/vue3_vben5_antd/general/views/modules/list_sub_erp.vue.vm
  View file @515cbbb
... ... @@ -6,30 +6,33 @@
6 6 #set ($subSimpleClassName_strikeCase = $subSimpleClassName_strikeCases.get($subIndex))
7 7 #set ($SubJoinColumnName = $subJoinColumn.javaField.substring(0,1).toUpperCase() + ${subJoinColumn.javaField.substring(1)})##首字母大写
8 8 <script lang="ts" setup>
9   - import type { OnActionClickParams, VxeTableGridOptions } from '#/adapter/vxe-table';
10 9 import type { ${simpleClassName}Api } from '#/api/${table.moduleName}/${simpleClassName_strikeCase}';
  10 + import type { VxeTableInstance } from 'vxe-table';
  11 +
  12 + import { DictTag } from '#/components/dict-tag';
  13 + import { DICT_TYPE, getDictOptions } from '#/utils/dict';
  14 + import { VxeColumn, VxeTable } from 'vxe-table';
  15 + import { reactive,ref, h, nextTick,watch,onMounted } from 'vue';
  16 + import { cloneDeep, formatDateTime } from '@vben/utils';
11 17  
12 18 #if ($table.templateType == 11) ## erp
13   - import ${subSimpleClassName}Form from './${subSimpleClassName_strikeCase}-form.vue'
  19 + import { useVbenModal } from '@vben/common-ui';
  20 + import ${subSimpleClassName}Form from './${subSimpleClassName_strikeCase}-form.vue'
  21 + import { Button, message } from 'ant-design-vue';
  22 + import { Plus } from '@vben/icons';
  23 + import { $t } from '#/locales';
  24 + import { TableToolbar } from '#/components/table-toolbar';
  25 + import { getRangePickerDefaultProps } from '#/utils/date';
14 26 #end
15   - import { useVbenModal } from '@vben/common-ui';
16   - import { Button, message } from 'ant-design-vue';
17   - import { Plus } from '@vben/icons';
18   - import { #if($table.templateType != 11)ref,#end h, nextTick,watch } from 'vue';
19   - import { $t } from '#/locales';
20   - import { useVbenVxeGrid } from '#/adapter/vxe-table';
21   -
22 27  
23 28 #if ($table.templateType == 11) ## erp
24 29 import { delete${subSimpleClassName}, get${subSimpleClassName}Page } from '#/api/${table.moduleName}/${simpleClassName_strikeCase}';
25   - import { use${subSimpleClassName}GridFormSchema, use${subSimpleClassName}GridColumns } from '../data';
26 30 #else
27 31 #if ($subTable.subJoinMany) ## 一对多
28 32 import { get${subSimpleClassName}ListBy${SubJoinColumnName} } from '#/api/${table.moduleName}/${simpleClassName_strikeCase}';
29 33 #else
30 34 import { get${subSimpleClassName}By${SubJoinColumnName} } from '#/api/${table.moduleName}/${simpleClassName_strikeCase}';
31 35 #end
32   - import { use${subSimpleClassName}GridColumns } from '../data';
33 36 #end
34 37  
35 38 const props = defineProps<{
... ... @@ -69,91 +72,83 @@ async function onDelete(row: ${simpleClassName}Api.${subSimpleClassName}) {
69 72 content: $t('ui.actionMessage.deleteSuccess', [row.id]),
70 73 key: 'action_process_msg',
71 74 });
72   - onRefresh();
  75 + getList();
73 76 } catch {
74 77 hideLoading();
75 78 }
76 79 }
77   -
78   -/** 表格操作按钮的回调函数 */
79   -function onActionClick({
80   - code,
81   - row,
82   -}: OnActionClickParams<${simpleClassName}Api.${subSimpleClassName}>) {
83   - switch (code) {
84   - case 'edit': {
85   - onEdit(row);
86   - break;
87   - }
88   - case 'delete': {
89   - onDelete(row);
90   - break;
91   - }
92   - }
93   -}
94   -
95   -#end
96   - const [Grid, gridApi] = useVbenVxeGrid({
97   -#if ($table.templateType == 11)
98   - formOptions: {
99   - schema: use${subSimpleClassName}GridFormSchema(),
100   - },
101   -#end
102   - gridOptions: {
103   -#if ($table.templateType == 11)
104   - columns: use${subSimpleClassName}GridColumns(onActionClick),
105   - proxyConfig: {
106   - ajax: {
107   - query: async ({ page }, formValues) => {
108   - if (!props.${subJoinColumn.javaField}){
109   - return []
110   - }
111   - return await get${subSimpleClassName}Page({
112   - pageNo: page.currentPage,
113   - pageSize: page.pageSize,
114   - ${subJoinColumn.javaField}: props.${subJoinColumn.javaField},
115   - ...formValues,
116   - });
117   - },
118   - },
119   - },
120   - pagerConfig: {
121   - enabled: true,
122   - },
123   - toolbarConfig: {
124   - refresh: { code: 'query' },
125   - search: true,
126   - },
127   -#else
128   - columns: use${subSimpleClassName}GridColumns(),
129   - pagerConfig: {
130   - enabled: false,
131   - },
132   - toolbarConfig: {
133   - enabled: false,
134   - },
135 80 #end
136   - height: '600px',
137   - rowConfig: {
138   - keyField: 'id',
139   - isHover: true,
140   - },
141   - } as VxeTableGridOptions<${simpleClassName}Api.${subSimpleClassName}>,
142   - });
143 81  
144   -/** 刷新表格 */
145   -const onRefresh = async ()=> {
  82 + const loading = ref(true) // 列表的加载中
  83 + const list = ref<${simpleClassName}Api.${subSimpleClassName}[]>([]) // 列表的数据
146 84 #if ($table.templateType == 11) ## erp
147   - await gridApi.query();
148   -#else
149   - #if ($subTable.subJoinMany) ## 一对多
150   - await gridApi.grid.loadData(await get${subSimpleClassName}ListBy${SubJoinColumnName}(props.${subJoinColumn.javaField}!));
151   - #else
152   - await gridApi.grid.loadData([await get${subSimpleClassName}By${SubJoinColumnName}(props.${subJoinColumn.javaField}!)]);
153   - #end
  85 + const total = ref(0) // 列表的总页数
154 86 #end
  87 +#if ($table.templateType == 11) ## erp
  88 + const queryFormRef = ref() // 搜索的表单
  89 + const queryParams = reactive({
  90 + pageNo: 1,
  91 + pageSize: 10,
  92 + #foreach ($column in $subColumns)
  93 + #if ($column.listOperation)
  94 + #if ($column.listOperationCondition != 'BETWEEN')
  95 + $column.javaField: undefined,
  96 + #end
  97 + #if ($column.htmlType == "datetime" || $column.listOperationCondition == "BETWEEN")
  98 + $column.javaField: undefined,
  99 + #end
  100 + #end
  101 + #end
  102 +
  103 + ${subJoinColumn.javaField}: props.${subJoinColumn.javaField},
  104 + })
  105 +
  106 +/** 搜索按钮操作 */
  107 +const handleQuery = () => {
  108 + queryParams.pageNo = 1
  109 + getList()
155 110 }
156 111  
  112 +/** 重置按钮操作 */
  113 +const resetQuery = () => {
  114 + queryFormRef.value.resetFields()
  115 + handleQuery()
  116 +}
  117 +#end
  118 + /** 查询列表 */
  119 + const getList = async () => {
  120 + loading.value = true
  121 + try {
  122 + if (!props.${subJoinColumn.javaField}){
  123 + return []
  124 + }
  125 + ## 特殊：树表专属逻辑（树不需要分页接口）
  126 + #if ($table.templateType == 11) ## erp
  127 + const params = cloneDeep(queryParams) as any;
  128 + #foreach ($column in $columns)
  129 + #if ($column.listOperation)
  130 + #if ($column.htmlType == "datetime" || $column.listOperationCondition == "BETWEEN")
  131 + if (params.${column.javaField} && Array.isArray(params.${column.javaField})) {
  132 + params.${column.javaField} = (params.${column.javaField} as string[]).join(',');
  133 + }
  134 + #end
  135 + #end
  136 + #end
  137 + const data = await get${subSimpleClassName}Page(params)
  138 + list.value = data.list
  139 + total.value = data.total
  140 + #else
  141 + #if ($subTable.subJoinMany) ## 一对多
  142 + list.value = await get${subSimpleClassName}ListBy${SubJoinColumnName}(props.${subJoinColumn.javaField}!);
  143 + #else
  144 + list.value = [await get${subSimpleClassName}By${SubJoinColumnName}(props.${subJoinColumn.javaField}!)];
  145 + #end
  146 + #end
  147 + } finally {
  148 + loading.value = false
  149 + }
  150 + }
  151 +
157 152 /** 监听主表的关联字段的变化，加载对应的子表数据 */
158 153 watch(
159 154 () => props.${subJoinColumn.javaField},
... ... @@ -162,23 +157,231 @@ const onRefresh = async ()=&gt; {
162 157 return;
163 158 }
164 159 await nextTick();
165   - await onRefresh()
  160 + await getList()
166 161 },
167 162 { immediate: true },
168 163 );
  164 +
  165 +#if ($table.templateType == 11) ## erp
  166 +/** 隐藏搜索栏 */
  167 +const hiddenSearchBar = ref(false);
  168 +const tableToolbarRef = ref<InstanceType<typeof TableToolbar>>();
  169 +const tableRef = ref<VxeTableInstance>();
  170 +
  171 +/** 初始化 */
  172 +onMounted(async () => {
  173 + await getList();
  174 + await nextTick();
  175 + // 挂载 toolbar 工具栏
  176 + const table = tableRef.value;
  177 + const tableToolbar = tableToolbarRef.value;
  178 + if (table && tableToolbar) {
  179 + await table.connect(tableToolbar.getToolbarRef()!);
  180 + }
  181 +});
  182 +#end
169 183 </script>
170 184  
171 185 <template>
172 186 #if ($table.templateType == 11) ## erp
173   - <FormModal @success="onRefresh" />
174   - <Grid table-title="${subTable.classComment}列表">
175   - <template #toolbar-tools>
176   - <Button :icon="h(Plus)" type="primary" @click="onCreate" v-access:code="['${table.moduleName}:${simpleClassName_strikeCase}:create']">
177   - {{ $t('ui.actionTitle.create', ['${subTable.classComment}']) }}
178   - </Button>
179   - </template>
180   - </Grid>
  187 + <FormModal @success="getList" />
  188 + <div class="h-[600px]">
  189 + <ContentWrap v-if="!hiddenSearchBar">
  190 + <!-- 搜索工作栏 -->
  191 + <Form
  192 + :model="queryParams"
  193 + ref="queryFormRef"
  194 + layout="inline"
  195 + >
  196 + #foreach($column in $subColumns)
  197 + #if ($column.listOperation)
  198 + #set ($dictType = $column.dictType)
  199 + #set ($javaField = $column.javaField)
  200 + #set ($javaType = $column.javaType)
  201 + #set ($comment = $column.columnComment)
  202 + #if ($javaType == "Integer" || $javaType == "Long" || $javaType == "Byte" || $javaType == "Short")
  203 + #set ($dictMethod = "number")
  204 + #elseif ($javaType == "String")
  205 + #set ($dictMethod = "string")
  206 + #elseif ($javaType == "Boolean")
  207 + #set ($dictMethod = "boolean")
  208 + #end
  209 + #if ($column.htmlType == "input")
  210 + <Form.Item label="${comment}" name="${javaField}">
  211 + <Input
  212 + v-model:value="queryParams.${javaField}"
  213 + placeholder="请输入${comment}"
  214 + allowClear
  215 + @pressEnter="handleQuery"
  216 + class="w-full"
  217 + />
  218 + </Form.Item>
  219 + #elseif ($column.htmlType == "select" || $column.htmlType == "radio" || $column.htmlType == "checkbox")
  220 + <Form.Item label="${comment}" name="${javaField}">
  221 + <Select
  222 + v-model:value="queryParams.${javaField}"
  223 + placeholder="请选择${comment}"
  224 + allowClear
  225 + class="w-full"
  226 + >
  227 + #if ("" != $dictType)## 设置了 dictType 数据字典的情况
  228 + <Select.Option
  229 + v-for="dict in getDictOptions(DICT_TYPE.$dictType.toUpperCase(), '$dictMethod')"
  230 + :key="dict.value"
  231 + :value="dict.value"
  232 + >
  233 + {{ dict.label }}
  234 + </Select.Option>
  235 + #else## 未设置 dictType 数据字典的情况
  236 + <Select.Option label="请选择字典生成" value="" />
  237 + #end
  238 + </Select>
  239 + </Form.Item>
  240 + #elseif($column.htmlType == "datetime")
  241 + #if ($column.listOperationCondition != "BETWEEN")## 非范围
  242 + <Form.Item label="${comment}" name="${javaField}">
  243 + <DatePicker
  244 + v-model:value="queryParams.${javaField}"
  245 + valueFormat="YYYY-MM-DD"
  246 + placeholder="选择${comment}"
  247 + allowClear
  248 + class="w-full"
  249 + />
  250 + </Form.Item>
  251 + #else## 范围
  252 + <Form.Item label="${comment}" name="${javaField}">
  253 + <RangePicker
  254 + v-model:value="queryParams.${javaField}"
  255 + v-bind="getRangePickerDefaultProps()"
  256 + class="w-full"
  257 + />
  258 + </Form.Item>
  259 + #end
  260 + #end
  261 + #end
  262 + #end
  263 + <Form.Item>
  264 + <Button class="ml-2" @click="resetQuery"> 重置 </Button>
  265 + <Button class="ml-2" @click="handleQuery" type="primary">
  266 + 搜索
  267 + </Button>
  268 + </Form.Item>
  269 + </Form>
  270 + </ContentWrap>
  271 +
  272 + <!-- 列表 -->
  273 + <ContentWrap title="${table.classComment}">
  274 + <template #extra>
  275 + <TableToolbar
  276 + ref="tableToolbarRef"
  277 + v-model:hidden-search="hiddenSearchBar"
  278 + >
  279 + <Button
  280 + class="ml-2"
  281 + :icon="h(Plus)"
  282 + type="primary"
  283 + @click="onCreate"
  284 + v-access:code="['${permissionPrefix}:create']"
  285 + >
  286 + {{ $t('ui.actionTitle.create', ['${table.classComment}']) }}
  287 + </Button>
  288 + </TableToolbar>
  289 + </template>
  290 + <vxe-table
  291 + ref="tableRef"
  292 + :data="list"
  293 + show-overflow
  294 + :loading="loading"
  295 + >
  296 + #foreach($column in $subColumns)
  297 + #if ($column.listOperationResult)
  298 + #set ($dictType=$column.dictType)
  299 + #set ($javaField = $column.javaField)
  300 + #set ($comment=$column.columnComment)
  301 + #if ($column.javaType == "LocalDateTime")## 时间类型
  302 + <vxe-column field="${javaField}" title="${comment}" align="center">
  303 + <template #default="{row}">
  304 + {{formatDateTime(row.${javaField})}}
  305 + </template>
  306 + </vxe-column>
  307 + #elseif($column.dictType && "" != $column.dictType)## 数据字典
  308 + <vxe-column field="${javaField}" title="${comment}" align="center">
  309 + <template #default="{row}">
  310 + <dict-tag :type="DICT_TYPE.$dictType.toUpperCase()" :value="row.${javaField}" />
  311 + </template>
  312 + </vxe-column>
  313 + #elseif ($table.templateType == 2 && $javaField == $treeNameColumn.javaField)
  314 + <vxe-column field="${javaField}" title="${comment}" align="center" tree-node/>
  315 + #else
  316 + <vxe-column field="${javaField}" title="${comment}" align="center" />
  317 + #end
  318 + #end
  319 + #end
  320 + <vxe-column field="operation" title="操作" align="center">
  321 + <template #default="{row}">
  322 + <Button
  323 + size="small"
  324 + type="link"
  325 + @click="onEdit(row as any)"
  326 + v-access:code="['${permissionPrefix}:update']"
  327 + >
  328 + {{ $t('ui.actionTitle.edit') }}
  329 + </Button>
  330 + <Button
  331 + size="small"
  332 + type="link"
  333 + danger
  334 + class="ml-2"
  335 + @click="onDelete(row as any)"
  336 + v-access:code="['${permissionPrefix}:delete']"
  337 + >
  338 + {{ $t('ui.actionTitle.delete') }}
  339 + </Button>
  340 + </template>
  341 + </vxe-column>
  342 + </vxe-table>
  343 + <!-- 分页 -->
  344 + <div class="mt-2 flex justify-end">
  345 + <Pagination
  346 + :total="total"
  347 + v-model:current="queryParams.pageNo"
  348 + v-model:page-size="queryParams.pageSize"
  349 + show-size-changer
  350 + @change="getList"
  351 + />
  352 + </div>
  353 + </ContentWrap>
  354 + </div>
181 355 #else
182   - <Grid table-title="${subTable.classComment}列表" />
  356 + <ContentWrap title="${subTable.classComment}列表">
  357 + <vxe-table
  358 + :data="list"
  359 + show-overflow
  360 + :loading="loading"
  361 + >
  362 + #foreach($column in $subColumns)
  363 + #if ($column.listOperationResult)
  364 + #set ($dictType=$column.dictType)
  365 + #set ($javaField = $column.javaField)
  366 + #set ($comment=$column.columnComment)
  367 + #if ($column.javaType == "LocalDateTime")## 时间类型
  368 + <vxe-column field="${javaField}" title="${comment}" align="center">
  369 + <template #default="{row}">
  370 + {{formatDateTime(row.${javaField})}}
  371 + </template>
  372 + </vxe-column>
  373 + #elseif($column.dictType && "" != $column.dictType)## 数据字典
  374 + <vxe-column field="${javaField}" title="${comment}" align="center">
  375 + <template #default="{row}">
  376 + <dict-tag :type="DICT_TYPE.$dictType.toUpperCase()" :value="row.${javaField}" />
  377 + </template>
  378 + </vxe-column>
  379 + #else
  380 + <vxe-column field="${javaField}" title="${comment}" align="center" />
  381 + #end
  382 + #end
  383 + #end
  384 + </vxe-table>
  385 + </ContentWrap>
183 386 #end
184 387 </template>
185 388 \ No newline at end of file
... ...
yudao-module-infra/yudao-module-infra-biz/src/main/resources/codegen/vue3_vben5_antd/general/views/modules/list_sub_inner.vue.vm
  View file @515cbbb
1 1 ## 子表的 erp 和 inner 使用相似的 list 列表，差异主要两点：
2 2 ## 1）inner 使用 list 不分页，erp 使用 page 分页
3 3 ## 2）erp 支持单个子表的新增、修改、删除，inner 不支持
4   -#parse("codegen/vue3_vben5_antd/schema/views/modules/list_sub_erp.vue.vm")
5 4 \ No newline at end of file
  5 +#parse("codegen/vue3_vben5_antd/general/views/modules/list_sub_erp.vue.vm")
6 6 \ No newline at end of file
... ...