feat:【infra】vben5 + antd 的代码生成器模版的优化

This commit is contained in:
YunaiV 2025-11-25 10:58:22 +08:00
parent bdb4e3fadc
commit 6ac6cddbc7
7 changed files with 116 additions and 118 deletions

View File

@ -1,6 +1,6 @@
<script lang="ts" setup> <script lang="ts" setup>
import type { Rule } from 'ant-design-vue/es/form'; import type { Rule } from 'ant-design-vue/es/form';
import type { ${simpleClassName}Api } from '#/api/${table.moduleName}/${simpleClassName_strikeCase}'; import type { ${simpleClassName}Api } from '#/api/${table.moduleName}/${table.businessName}';
import { computed, ref } from 'vue'; import { computed, ref } from 'vue';
@ -11,7 +11,7 @@ import { Tinymce as RichTextarea } from '#/components/tinymce';
import { ImageUpload, FileUpload } from "#/components/upload"; import { ImageUpload, FileUpload } from "#/components/upload";
import { message, Tabs, Form, Input, Textarea, Select, RadioGroup, Radio, CheckboxGroup, Checkbox, DatePicker, TreeSelect } from 'ant-design-vue'; import { message, Tabs, Form, Input, Textarea, Select, RadioGroup, Radio, CheckboxGroup, Checkbox, DatePicker, TreeSelect } from 'ant-design-vue';
#if($table.templateType == 2)## 树表需要导入这些 #if($table.templateType == 2)## 树表需要导入这些
import { get${simpleClassName}List } from '#/api/${table.moduleName}/${simpleClassName_strikeCase}'; import { get${simpleClassName}List } from '#/api/${table.moduleName}/${table.businessName}';
import { handleTree } from '@vben/utils' import { handleTree } from '@vben/utils'
#end #end
## 特殊:主子表专属逻辑 ## 特殊:主子表专属逻辑
@ -24,7 +24,7 @@ import { handleTree } from '@vben/utils'
#end #end
import { $t } from '#/locales'; import { $t } from '#/locales';
import { get${simpleClassName}, create${simpleClassName}, update${simpleClassName} } from '#/api/${table.moduleName}/${simpleClassName_strikeCase}'; import { get${simpleClassName}, create${simpleClassName}, update${simpleClassName} } from '#/api/${table.moduleName}/${table.businessName}';
const emit = defineEmits(['success']); const emit = defineEmits(['success']);

View File

@ -1,5 +1,5 @@
<script lang="ts" setup> <script lang="ts" setup>
import type { ${simpleClassName}Api } from '#/api/${table.moduleName}/${simpleClassName_strikeCase}'; import type { ${simpleClassName}Api } from '#/api/${table.moduleName}/${table.businessName}';
import { ref, h, reactive, onMounted, nextTick } from 'vue'; import { ref, h, reactive, onMounted, nextTick } from 'vue';
@ -7,12 +7,13 @@ import { Page, useVbenModal } from '@vben/common-ui';
import { DICT_TYPE } from '@vben/constants'; import { DICT_TYPE } from '@vben/constants';
import { getDictOptions } from '@vben/hooks'; import { getDictOptions } from '@vben/hooks';
import { useTableToolbar, VbenVxeTableToolbar } from '@vben/plugins/vxe-table'; import { useTableToolbar, VbenVxeTableToolbar } from '@vben/plugins/vxe-table';
import { cloneDeep, downloadFileFromBlobPart, formatDateTime } from '@vben/utils'; import { cloneDeep, downloadFileFromBlobPart, formatDateTime, isEmpty } from '@vben/utils';
import { Button, message,Tabs,Pagination,Form,RangePicker,DatePicker,Select,Input } from 'ant-design-vue'; import { Button, Card, message, Tabs, Pagination, Form, RangePicker, DatePicker, Select, Input } from 'ant-design-vue';
import ${simpleClassName}Form from './modules/form.vue'; import ${simpleClassName}Form from './modules/form.vue';
import { Download, Plus, RefreshCw, Search, Trash2 } from '@vben/icons'; import { Download, Plus, RefreshCw, Search, Trash2 } from '@vben/icons';
import { ContentWrap } from '#/components/content-wrap'; import { DictTag } from '#/components/dict-tag';
import { VxeColumn, VxeTable } from '#/adapter/vxe-table'; import { VxeColumn, VxeTable } from '#/adapter/vxe-table';
import { getRangePickerDefaultProps } from '#/utils/rangePickerProps';
## 特殊:主子表专属逻辑 ## 特殊:主子表专属逻辑
#if ( $table.templateType == 11 || $table.templateType == 12 ) #if ( $table.templateType == 11 || $table.templateType == 12 )
@ -25,13 +26,11 @@ import { VxeColumn, VxeTable } from '#/adapter/vxe-table';
import { $t } from '#/locales'; import { $t } from '#/locales';
#if (${table.templateType} == 2)## 树表接口 #if (${table.templateType} == 2)## 树表接口
import { handleTree,isEmpty } from '@vben/utils' import { handleTree } from '@vben/utils'
import { get${simpleClassName}List, delete${simpleClassName}, export${simpleClassName} } from '#/api/${table.moduleName}/${simpleClassName_strikeCase}'; import { get${simpleClassName}List, delete${simpleClassName}, export${simpleClassName} } from '#/api/${table.moduleName}/${table.businessName}';
#else## 标准表接口 #else## 标准表接口
import { isEmpty } from '@vben/utils'; import { get${simpleClassName}Page, delete${simpleClassName},#if ($deleteBatchEnable) delete${simpleClassName}List,#end export${simpleClassName} } from '#/api/${table.moduleName}/${table.businessName}';
import { get${simpleClassName}Page, delete${simpleClassName},#if ($deleteBatchEnable) delete${simpleClassName}List,#end export${simpleClassName} } from '#/api/${table.moduleName}/${simpleClassName_strikeCase}';
#end #end
import { downloadFileFromBlobPart } from '@vben/utils';
#if ($table.templateType == 12 || $table.templateType == 11) ## 内嵌和erp情况 #if ($table.templateType == 12 || $table.templateType == 11) ## 内嵌和erp情况
/** 子表的列表 */ /** 子表的列表 */
@ -211,7 +210,7 @@ onMounted(() => {
<Page auto-content-height> <Page auto-content-height>
<FormModal @success="getList" /> <FormModal @success="getList" />
<ContentWrap v-if="!hiddenSearchBar"> <Card v-if="!hiddenSearchBar" class="mb-4">
<!-- 搜索工作栏 --> <!-- 搜索工作栏 -->
<Form <Form
:model="queryParams" :model="queryParams"
@ -292,10 +291,10 @@ onMounted(() => {
</Button> </Button>
</Form.Item> </Form.Item>
</Form> </Form>
</ContentWrap> </Card>
<!-- 列表 --> <!-- 列表 -->
<ContentWrap title="${table.classComment}"> <Card title="${table.classComment}">
<template #extra> <template #extra>
<VbenVxeTableToolbar <VbenVxeTableToolbar
ref="tableToolbarRef" ref="tableToolbarRef"
@ -338,9 +337,9 @@ onMounted(() => {
批量删除 批量删除
</Button> </Button>
#end #end
</TableToolbar> </VbenVxeTableToolbar>
</template> </template>
<vxe-table <VxeTable
ref="tableRef" ref="tableRef"
:data="list" :data="list"
#if ( $table.templateType == 2 ) #if ( $table.templateType == 2 )
@ -368,12 +367,12 @@ onMounted(() => {
#end #end
> >
#if ($table.templateType != 2 && $deleteBatchEnable) #if ($table.templateType != 2 && $deleteBatchEnable)
<vxe-column type="checkbox" width="40"></vxe-column> <VxeColumn type="checkbox" width="40" />
#end #end
## 特殊:主子表专属逻辑 ## 特殊:主子表专属逻辑
#if ( $table.templateType == 12 && $subTables && $subTables.size() > 0 ) #if ( $table.templateType == 12 && $subTables && $subTables.size() > 0 )
<!-- 子表的列表 --> <!-- 子表的列表 -->
<vxe-column type="expand" width="60"> <VxeColumn type="expand" width="60">
<template #content="{ row }"> <template #content="{ row }">
<!-- 子表的表单 --> <!-- 子表的表单 -->
<Tabs v-model:active-key="subTabsName" class="mx-8"> <Tabs v-model:active-key="subTabsName" class="mx-8">
@ -388,7 +387,7 @@ onMounted(() => {
#end #end
</Tabs> </Tabs>
</template> </template>
</vxe-column> </VxeColumn>
#end #end
#foreach($column in $columns) #foreach($column in $columns)
#if ($column.listOperationResult) #if ($column.listOperationResult)
@ -397,31 +396,31 @@ onMounted(() => {
#set ($AttrName=$column.javaField.substring(0,1).toUpperCase() + ${column.javaField.substring(1)}) #set ($AttrName=$column.javaField.substring(0,1).toUpperCase() + ${column.javaField.substring(1)})
#set ($comment=$column.columnComment) #set ($comment=$column.columnComment)
#if ($column.javaType == "LocalDateTime")## 时间类型 #if ($column.javaType == "LocalDateTime")## 时间类型
<vxe-column field="${javaField}" title="${comment}" align="center"> <VxeColumn field="${javaField}" title="${comment}" align="center">
<template #default="{row}"> <template #default="{row}">
{{formatDateTime(row.${javaField})}} {{formatDateTime(row.${javaField})}}
</template> </template>
</vxe-column> </VxeColumn>
#elseif($column.dictType && "" != $column.dictType)## 数据字典 #elseif($column.dictType && "" != $column.dictType)## 数据字典
<vxe-column field="${javaField}" title="${comment}" align="center"> <VxeColumn field="${javaField}" title="${comment}" align="center">
<template #default="{row}"> <template #default="{row}">
<dict-tag :type="DICT_TYPE.$dictType.toUpperCase()" :value="row.${javaField}" /> <dict-tag :type="DICT_TYPE.$dictType.toUpperCase()" :value="row.${javaField}" />
</template> </template>
</vxe-column> </VxeColumn>
#elseif ($table.templateType == 2 && $javaField == $treeNameColumn.javaField) #elseif ($table.templateType == 2 && $javaField == $treeNameColumn.javaField)
<vxe-column field="${javaField}" title="${comment}" align="center" tree-node/> <VxeColumn field="${javaField}" title="${comment}" align="center" tree-node/>
#else #else
<vxe-column field="${javaField}" title="${comment}" align="center" /> <VxeColumn field="${javaField}" title="${comment}" align="center" />
#end #end
#end #end
#end #end
<vxe-column field="operation" title="操作" align="center"> <VxeColumn field="operation" title="操作" align="center">
<template #default="{row}"> <template #default="{row}">
#if ( $table.templateType == 2 ) #if ( $table.templateType == 2 )
<Button <Button
size="small" size="small"
type="link" type="link"
@click="handleAppend(row as any)" @click="handleAppend(row)"
v-access:code="['${permissionPrefix}:create']" v-access:code="['${permissionPrefix}:create']"
> >
新增下级 新增下级
@ -430,7 +429,7 @@ onMounted(() => {
<Button <Button
size="small" size="small"
type="link" type="link"
@click="handleEdit(row as any)" @click="handleEdit(row)"
v-access:code="['${permissionPrefix}:update']" v-access:code="['${permissionPrefix}:update']"
> >
{{ $t('ui.actionTitle.edit') }} {{ $t('ui.actionTitle.edit') }}
@ -443,14 +442,14 @@ onMounted(() => {
#if ( $table.templateType == 2 ) #if ( $table.templateType == 2 )
:disabled="!isEmpty(row?.children)" :disabled="!isEmpty(row?.children)"
#end #end
@click="handleDelete(row as any)" @click="handleDelete(row)"
v-access:code="['${permissionPrefix}:delete']" v-access:code="['${permissionPrefix}:delete']"
> >
{{ $t('ui.actionTitle.delete') }} {{ $t('ui.actionTitle.delete') }}
</Button> </Button>
</template> </template>
</vxe-column> </VxeColumn>
</vxe-table> </VxeTable>
#if ( $table.templateType != 2 ) #if ( $table.templateType != 2 )
<!-- 分页 --> <!-- 分页 -->
<div class="mt-2 flex justify-end"> <div class="mt-2 flex justify-end">
@ -463,9 +462,9 @@ onMounted(() => {
/> />
</div> </div>
#end #end
</ContentWrap> </Card>
#if ($table.templateType == 11) ## erp情况 #if ($table.templateType == 11) ## erp情况
<ContentWrap> <Card>
<!-- 子表的表单 --> <!-- 子表的表单 -->
<Tabs v-model:active-key="subTabsName"> <Tabs v-model:active-key="subTabsName">
#foreach ($subTable in $subTables) #foreach ($subTable in $subTables)
@ -478,7 +477,7 @@ onMounted(() => {
</Tabs.TabPane> </Tabs.TabPane>
#end #end
</Tabs> </Tabs>
</ContentWrap> </Card>
#end #end
</Page> </Page>
</template> </template>

View File

@ -4,21 +4,20 @@
#set ($subSimpleClassName = $subSimpleClassNames.get($subIndex)) #set ($subSimpleClassName = $subSimpleClassNames.get($subIndex))
<script lang="ts" setup> <script lang="ts" setup>
import type { Rule } from 'ant-design-vue/es/form'; import type { Rule } from 'ant-design-vue/es/form';
import type { ${simpleClassName}Api } from '#/api/${table.moduleName}/${simpleClassName_strikeCase}'; import type { ${simpleClassName}Api } from '#/api/${table.moduleName}/${table.businessName}';
import { computed, ref } from 'vue'; import { computed, ref } from 'vue';
import { useVbenModal } from '@vben/common-ui'; import { useVbenModal } from '@vben/common-ui';
import { DICT_TYPE } from '@vben/constants'; import { DICT_TYPE } from '@vben/constants';
import { getDictOptions } from '@vben/hooks'; import { getDictOptions } from '@vben/hooks';
import { cloneDeep, formatDateTime } from '@vben/utils';
import { Tinymce as RichTextarea } from '#/components/tinymce'; import { Tinymce as RichTextarea } from '#/components/tinymce';
import { ImageUpload, FileUpload } from "#/components/upload"; import { ImageUpload, FileUpload } from "#/components/upload";
import { message, Tabs, Form, Input, Textarea, Select, RadioGroup, Radio, CheckboxGroup, Checkbox, DatePicker, TreeSelect } from 'ant-design-vue'; import { message, Tabs, Form, Input, Textarea, Select, RadioGroup, Radio, CheckboxGroup, Checkbox, DatePicker, TreeSelect } from 'ant-design-vue';
import { $t } from '#/locales'; import { $t } from '#/locales';
import { get${subSimpleClassName}, create${subSimpleClassName}, update${subSimpleClassName} } from '#/api/${table.moduleName}/${simpleClassName_strikeCase}'; import { get${subSimpleClassName}, create${subSimpleClassName}, update${subSimpleClassName} } from '#/api/${table.moduleName}/${table.businessName}';
const emit = defineEmits(['success']); const emit = defineEmits(['success']);
const getTitle = computed(() => { const getTitle = computed(() => {

View File

@ -5,25 +5,27 @@
#set ($subClassNameVar = $subClassNameVars.get($subIndex)) #set ($subClassNameVar = $subClassNameVars.get($subIndex))
#set ($SubJoinColumnName = $subJoinColumn.javaField.substring(0,1).toUpperCase() + ${subJoinColumn.javaField.substring(1)})##首字母大写 #set ($SubJoinColumnName = $subJoinColumn.javaField.substring(0,1).toUpperCase() + ${subJoinColumn.javaField.substring(1)})##首字母大写
<script lang="ts" setup> <script lang="ts" setup>
import type { ${simpleClassName}Api } from '#/api/${table.moduleName}/${simpleClassName_strikeCase}'; import type { ${simpleClassName}Api } from '#/api/${table.moduleName}/${table.businessName}';
import { computed, ref, h, onMounted,watch,nextTick } from 'vue'; import { computed, ref, h, onMounted, watch, nextTick } from 'vue';
import { DICT_TYPE } from '@vben/constants'; import { DICT_TYPE } from '@vben/constants';
import { getDictOptions } from '@vben/hooks'; import { getDictOptions } from '@vben/hooks';
import { message, Tabs, Form, Input, Textarea,Button, Select, RadioGroup, Radio, CheckboxGroup, Checkbox, DatePicker } from 'ant-design-vue'; import { message, Tabs, Form, Input, Textarea, Button, Select, RadioGroup, Radio, CheckboxGroup, Checkbox, DatePicker } from 'ant-design-vue';
import { $t } from '#/locales'; import { $t } from '#/locales';
#if ($subTable.subJoinMany) ## 一对多 #if ($subTable.subJoinMany) ## 一对多
import type { VxeTableInstance } from '#/adapter/vxe-table'; import type { VxeTableInstance } from '#/adapter/vxe-table';
import { Plus } from "@vben/icons"; import { Plus } from "@vben/icons";
import { VxeColumn, VxeTable } from '#/adapter/vxe-table'; import { VxeColumn, VxeTable } from '#/adapter/vxe-table';
import { get${subSimpleClassName}ListBy${SubJoinColumnName} } from '#/api/${table.moduleName}/${simpleClassName_strikeCase}'; import { ImageUpload, FileUpload } from "#/components/upload";
import { get${subSimpleClassName}ListBy${SubJoinColumnName} } from '#/api/${table.moduleName}/${table.businessName}';
#else #else
import type { Rule } from 'ant-design-vue/es/form'; import type { Rule } from 'ant-design-vue/es/form';
import { Tinymce as RichTextarea } from '#/components/tinymce'; import { Tinymce as RichTextarea } from '#/components/tinymce';
import { get${subSimpleClassName}By${SubJoinColumnName} } from '#/api/${table.moduleName}/${simpleClassName_strikeCase}'; import { ImageUpload, FileUpload } from "#/components/upload";
import { get${subSimpleClassName}By${SubJoinColumnName} } from '#/api/${table.moduleName}/${table.businessName}';
#end #end
const props = defineProps<{ const props = defineProps<{
@ -55,6 +57,7 @@ defineExpose({
(row) => !removeRecords.some((removed) => removed.id === row.id), (row) => !removeRecords.some((removed) => removed.id === row.id),
), ),
...insertRecords.map((row: any) => ({ ...row, id: undefined })), ...insertRecords.map((row: any) => ({ ...row, id: undefined })),
];
}, },
}); });
@ -113,7 +116,7 @@ watch(
<template> <template>
#if ($subTable.subJoinMany) ## 一对多 #if ($subTable.subJoinMany) ## 一对多
<vxe-table ref="tableRef" :data="list" show-overflow class="mx-4"> <VxeTable ref="tableRef" :data="list" show-overflow class="mx-4">
#foreach($column in $subColumns) #foreach($column in $subColumns)
#if ($column.createOperation || $column.updateOperation) #if ($column.createOperation || $column.updateOperation)
#set ($comment = $column.columnComment) #set ($comment = $column.columnComment)
@ -128,25 +131,25 @@ watch(
#end #end
#if ( $column.id == $subJoinColumn.id) ## 特殊:忽略主子表的 join 字段,不用填写 #if ( $column.id == $subJoinColumn.id) ## 特殊:忽略主子表的 join 字段,不用填写
#elseif ($column.htmlType == "input" && !$column.primaryKey)## 忽略主键,不用在表单里 #elseif ($column.htmlType == "input" && !$column.primaryKey)## 忽略主键,不用在表单里
<vxe-column field="${javaField}" title="${comment}" align="center"> <VxeColumn field="${javaField}" title="${comment}" align="center">
<template #default="{ row }"> <template #default="{ row }">
<Input v-model:value="row.${javaField}" /> <Input v-model:value="row.${javaField}" />
</template> </template>
</vxe-column> </VxeColumn>
#elseif($column.htmlType == "imageUpload")## 图片上传 #elseif($column.htmlType == "imageUpload")## 图片上传
<vxe-column field="${javaField}" title="${comment}" align="center"> <VxeColumn field="${javaField}" title="${comment}" align="center">
<template #default="{ row }"> <template #default="{ row }">
<ImageUpload v-model:value="row.${javaField}" /> <ImageUpload v-model:value="row.${javaField}" />
</template> </template>
</vxe-column> </VxeColumn>
#elseif($column.htmlType == "fileUpload")## 文件上传 #elseif($column.htmlType == "fileUpload")## 文件上传
<vxe-column field="${javaField}" title="${comment}" align="center"> <VxeColumn field="${javaField}" title="${comment}" align="center">
<template #default="{ row }"> <template #default="{ row }">
<FileUpload v-model:value="row.${javaField}" /> <FileUpload v-model:value="row.${javaField}" />
</template> </template>
</vxe-column> </VxeColumn>
#elseif($column.htmlType == "select")## 下拉框 #elseif($column.htmlType == "select")## 下拉框
<vxe-column field="${javaField}" title="${comment}" align="center"> <VxeColumn field="${javaField}" title="${comment}" align="center">
<template #default="{ row }"> <template #default="{ row }">
<Select v-model:value="row.${javaField}" placeholder="请选择${comment}"> <Select v-model:value="row.${javaField}" placeholder="请选择${comment}">
#if ("" != $dictType)## 有数据字典 #if ("" != $dictType)## 有数据字典
@ -162,9 +165,9 @@ watch(
#end #end
</Select> </Select>
</template> </template>
</vxe-column> </VxeColumn>
#elseif($column.htmlType == "checkbox")## 多选框 #elseif($column.htmlType == "checkbox")## 多选框
<vxe-column field="${javaField}" title="${comment}" align="center"> <VxeColumn field="${javaField}" title="${comment}" align="center">
<template #default="{ row }"> <template #default="{ row }">
<CheckboxGroup v-model:value="row.${javaField}"> <CheckboxGroup v-model:value="row.${javaField}">
#if ("" != $dictType)## 有数据字典 #if ("" != $dictType)## 有数据字典
@ -180,9 +183,9 @@ watch(
#end #end
</CheckboxGroup> </CheckboxGroup>
</template> </template>
</vxe-column> </VxeColumn>
#elseif($column.htmlType == "radio")## 单选框 #elseif($column.htmlType == "radio")## 单选框
<vxe-column field="${javaField}" title="${comment}" align="center"> <VxeColumn field="${javaField}" title="${comment}" align="center">
<template #default="{ row }"> <template #default="{ row }">
<RadioGroup v-model:value="row.${javaField}"> <RadioGroup v-model:value="row.${javaField}">
#if ("" != $dictType)## 有数据字典 #if ("" != $dictType)## 有数据字典
@ -198,9 +201,9 @@ watch(
#end #end
</RadioGroup> </RadioGroup>
</template> </template>
</vxe-column> </VxeColumn>
#elseif($column.htmlType == "datetime")## 时间框 #elseif($column.htmlType == "datetime")## 时间框
<vxe-column field="${javaField}" title="${comment}" align="center"> <VxeColumn field="${javaField}" title="${comment}" align="center">
<template #default="{ row }"> <template #default="{ row }">
<DatePicker <DatePicker
v-model:value="row.${javaField}" v-model:value="row.${javaField}"
@ -209,30 +212,30 @@ watch(
valueFormat='x' valueFormat='x'
/> />
</template> </template>
</vxe-column> </VxeColumn>
#elseif($column.htmlType == "textarea" || $column.htmlType == "editor")## 文本框 #elseif($column.htmlType == "textarea" || $column.htmlType == "editor")## 文本框
<vxe-column field="${javaField}" title="${comment}" align="center"> <VxeColumn field="${javaField}" title="${comment}" align="center">
<template #default="{ row }"> <template #default="{ row }">
<Textarea v-model:value="row.${javaField}" /> <Textarea v-model:value="row.${javaField}" />
</template> </template>
</vxe-column> </VxeColumn>
#end #end
#end #end
#end #end
<vxe-column field="operation" title="操作" align="center"> <VxeColumn field="operation" title="操作" align="center">
<template #default="{ row }"> <template #default="{ row }">
<Button <Button
size="small" size="small"
type="link" type="link"
danger danger
@click="handleDelect(row)" @click="handleDelete(row)"
v-access:code="['${permissionPrefix}:delete']" v-access:code="['${permissionPrefix}:delete']"
> >
{{ $t('ui.actionTitle.delete') }} {{ $t('ui.actionTitle.delete') }}
</Button> </Button>
</template> </template>
</vxe-column> </VxeColumn>
</vxe-table> </VxeTable>
<div class="flex justify-center mt-4"> <div class="flex justify-center mt-4">
<Button :icon="h(Plus)" type="primary" ghost @click="handleAdd" v-access:code="['${permissionPrefix}:create']"> <Button :icon="h(Plus)" type="primary" ghost @click="handleAdd" v-access:code="['${permissionPrefix}:create']">
{{ $t('ui.actionTitle.create', ['${subTable.classComment}']) }} {{ $t('ui.actionTitle.create', ['${subTable.classComment}']) }}

View File

@ -6,18 +6,18 @@
#set ($subSimpleClassName_strikeCase = $subSimpleClassName_strikeCases.get($subIndex)) #set ($subSimpleClassName_strikeCase = $subSimpleClassName_strikeCases.get($subIndex))
#set ($SubJoinColumnName = $subJoinColumn.javaField.substring(0,1).toUpperCase() + ${subJoinColumn.javaField.substring(1)})##首字母大写 #set ($SubJoinColumnName = $subJoinColumn.javaField.substring(0,1).toUpperCase() + ${subJoinColumn.javaField.substring(1)})##首字母大写
<script lang="ts" setup> <script lang="ts" setup>
import type { ${simpleClassName}Api } from '#/api/${table.moduleName}/${simpleClassName_strikeCase}'; import type { ${simpleClassName}Api } from '#/api/${table.moduleName}/${table.businessName}';
import type { VxeTableInstance } from '#/adapter/vxe-table'; import type { VxeTableInstance } from '#/adapter/vxe-table';
import { reactive,ref, h, nextTick,watch,onMounted } from 'vue'; import { reactive, ref, h, nextTick, watch, onMounted } from 'vue';
import { DICT_TYPE } from '@vben/constants'; import { DICT_TYPE } from '@vben/constants';
import { getDictOptions } from '@vben/hooks'; import { getDictOptions } from '@vben/hooks';
import { DictTag } from '#/components/dict-tag'; import { DictTag } from '#/components/dict-tag';
import { getRangePickerDefaultProps } from '#/utils'; import { getRangePickerDefaultProps } from '#/utils/rangePickerProps';
import { VxeColumn, VxeTable } from '#/adapter/vxe-table'; import { VxeColumn, VxeTable } from '#/adapter/vxe-table';
import { ContentWrap } from '#/components/content-wrap'; import { formatDateTime } from '@vben/utils';
#if ($table.templateType == 11) ## erp #if ($table.templateType == 11) ## erp
import { useVbenModal } from '@vben/common-ui'; import { useVbenModal } from '@vben/common-ui';
@ -25,19 +25,19 @@ import { useTableToolbar, VbenVxeTableToolbar } from '@vben/plugins/vxe-table';
import ${subSimpleClassName}Form from './${subSimpleClassName_strikeCase}-form.vue' import ${subSimpleClassName}Form from './${subSimpleClassName_strikeCase}-form.vue'
import { Tinymce as RichTextarea } from '#/components/tinymce'; import { Tinymce as RichTextarea } from '#/components/tinymce';
import { ImageUpload, FileUpload } from "#/components/upload"; import { ImageUpload, FileUpload } from "#/components/upload";
import { message,Button, Tabs,Pagination, Form, Input, Textarea, Select, RadioGroup, Radio, CheckboxGroup, Checkbox,RangePicker, DatePicker, TreeSelect } from 'ant-design-vue'; import { message, Button, Card, Tabs, Pagination, Form, Input, Textarea, Select, RadioGroup, Radio, CheckboxGroup, Checkbox, RangePicker, DatePicker, TreeSelect } from 'ant-design-vue';
import { Plus, Trash2 } from '@vben/icons'; import { Plus, Trash2 } from '@vben/icons';
import { $t } from '#/locales'; import { $t } from '#/locales';
#end #end
#if ($table.templateType == 11) ## erp #if ($table.templateType == 11) ## erp
import { delete${subSimpleClassName},#if ($deleteBatchEnable) delete${subSimpleClassName}List,#end get${subSimpleClassName}Page } from '#/api/${table.moduleName}/${simpleClassName_strikeCase}'; import { delete${subSimpleClassName},#if ($deleteBatchEnable) delete${subSimpleClassName}List,#end get${subSimpleClassName}Page } from '#/api/${table.moduleName}/${table.businessName}';
import { isEmpty } from '@vben/utils'; import { isEmpty, cloneDeep } from '@vben/utils';
#else #else
#if ($subTable.subJoinMany) ## 一对多 #if ($subTable.subJoinMany) ## 一对多
import { get${subSimpleClassName}ListBy${SubJoinColumnName} } from '#/api/${table.moduleName}/${simpleClassName_strikeCase}'; import { get${subSimpleClassName}ListBy${SubJoinColumnName} } from '#/api/${table.moduleName}/${table.businessName}';
#else #else
import { get${subSimpleClassName}By${SubJoinColumnName} } from '#/api/${table.moduleName}/${simpleClassName_strikeCase}'; import { get${subSimpleClassName}By${SubJoinColumnName} } from '#/api/${table.moduleName}/${table.businessName}';
#end #end
#end #end
@ -203,7 +203,7 @@ onMounted(() => {
#if ($table.templateType == 11) ## erp #if ($table.templateType == 11) ## erp
<FormModal @success="getList" /> <FormModal @success="getList" />
<div class="h-[600px]"> <div class="h-[600px]">
<ContentWrap v-if="!hiddenSearchBar"> <Card v-if="!hiddenSearchBar" class="mb-4">
<!-- 搜索工作栏 --> <!-- 搜索工作栏 -->
<Form <Form
:model="queryParams" :model="queryParams"
@ -284,10 +284,10 @@ onMounted(() => {
</Button> </Button>
</Form.Item> </Form.Item>
</Form> </Form>
</ContentWrap> </Card>
<!-- 列表 --> <!-- 列表 -->
<ContentWrap title="${table.classComment}"> <Card title="${table.classComment}">
<template #extra> <template #extra>
<VbenVxeTableToolbar <VbenVxeTableToolbar
ref="tableToolbarRef" ref="tableToolbarRef"
@ -315,9 +315,9 @@ onMounted(() => {
批量删除 批量删除
</Button> </Button>
#end #end
</TableToolbar> </VbenVxeTableToolbar>
</template> </template>
<vxe-table <VxeTable
ref="tableRef" ref="tableRef"
:data="list" :data="list"
show-overflow show-overflow
@ -328,7 +328,7 @@ onMounted(() => {
#end #end
> >
#if ($deleteBatchEnable) #if ($deleteBatchEnable)
<vxe-column type="checkbox" width="40"></vxe-column> <VxeColumn type="checkbox" width="40" />
#end #end
#foreach($column in $subColumns) #foreach($column in $subColumns)
#if ($column.listOperationResult) #if ($column.listOperationResult)
@ -336,30 +336,30 @@ onMounted(() => {
#set ($javaField = $column.javaField) #set ($javaField = $column.javaField)
#set ($comment=$column.columnComment) #set ($comment=$column.columnComment)
#if ($column.javaType == "LocalDateTime")## 时间类型 #if ($column.javaType == "LocalDateTime")## 时间类型
<vxe-column field="${javaField}" title="${comment}" align="center"> <VxeColumn field="${javaField}" title="${comment}" align="center">
<template #default="{row}"> <template #default="{row}">
{{formatDateTime(row.${javaField})}} {{formatDateTime(row.${javaField})}}
</template> </template>
</vxe-column> </VxeColumn>
#elseif($column.dictType && "" != $column.dictType)## 数据字典 #elseif($column.dictType && "" != $column.dictType)## 数据字典
<vxe-column field="${javaField}" title="${comment}" align="center"> <VxeColumn field="${javaField}" title="${comment}" align="center">
<template #default="{row}"> <template #default="{row}">
<dict-tag :type="DICT_TYPE.$dictType.toUpperCase()" :value="row.${javaField}" /> <dict-tag :type="DICT_TYPE.$dictType.toUpperCase()" :value="row.${javaField}" />
</template> </template>
</vxe-column> </VxeColumn>
#elseif ($table.templateType == 2 && $javaField == $treeNameColumn.javaField) #elseif ($table.templateType == 2 && $javaField == $treeNameColumn.javaField)
<vxe-column field="${javaField}" title="${comment}" align="center" tree-node/> <VxeColumn field="${javaField}" title="${comment}" align="center" tree-node/>
#else #else
<vxe-column field="${javaField}" title="${comment}" align="center" /> <VxeColumn field="${javaField}" title="${comment}" align="center" />
#end #end
#end #end
#end #end
<vxe-column field="operation" title="操作" align="center"> <VxeColumn field="operation" title="操作" align="center">
<template #default="{row}"> <template #default="{row}">
<Button <Button
size="small" size="small"
type="link" type="link"
@click="handleEdit(row as any)" @click="handleEdit(row)"
v-access:code="['${permissionPrefix}:update']" v-access:code="['${permissionPrefix}:update']"
> >
{{ $t('ui.actionTitle.edit') }} {{ $t('ui.actionTitle.edit') }}
@ -369,14 +369,14 @@ onMounted(() => {
type="link" type="link"
danger danger
class="ml-2" class="ml-2"
@click="handleDelete(row as any)" @click="handleDelete(row)"
v-access:code="['${permissionPrefix}:delete']" v-access:code="['${permissionPrefix}:delete']"
> >
{{ $t('ui.actionTitle.delete') }} {{ $t('ui.actionTitle.delete') }}
</Button> </Button>
</template> </template>
</vxe-column> </VxeColumn>
</vxe-table> </VxeTable>
<!-- 分页 --> <!-- 分页 -->
<div class="mt-2 flex justify-end"> <div class="mt-2 flex justify-end">
<Pagination <Pagination
@ -387,11 +387,11 @@ onMounted(() => {
@change="getList" @change="getList"
/> />
</div> </div>
</ContentWrap> </Card>
</div> </div>
#else #else
<ContentWrap title="${subTable.classComment}列表"> <Card title="${subTable.classComment}列表">
<vxe-table <VxeTable
:data="list" :data="list"
show-overflow show-overflow
:loading="loading" :loading="loading"
@ -402,23 +402,23 @@ onMounted(() => {
#set ($javaField = $column.javaField) #set ($javaField = $column.javaField)
#set ($comment=$column.columnComment) #set ($comment=$column.columnComment)
#if ($column.javaType == "LocalDateTime")## 时间类型 #if ($column.javaType == "LocalDateTime")## 时间类型
<vxe-column field="${javaField}" title="${comment}" align="center"> <VxeColumn field="${javaField}" title="${comment}" align="center">
<template #default="{row}"> <template #default="{row}">
{{formatDateTime(row.${javaField})}} {{formatDateTime(row.${javaField})}}
</template> </template>
</vxe-column> </VxeColumn>
#elseif($column.dictType && "" != $column.dictType)## 数据字典 #elseif($column.dictType && "" != $column.dictType)## 数据字典
<vxe-column field="${javaField}" title="${comment}" align="center"> <VxeColumn field="${javaField}" title="${comment}" align="center">
<template #default="{row}"> <template #default="{row}">
<dict-tag :type="DICT_TYPE.$dictType.toUpperCase()" :value="row.${javaField}" /> <dict-tag :type="DICT_TYPE.$dictType.toUpperCase()" :value="row.${javaField}" />
</template> </template>
</vxe-column> </VxeColumn>
#else #else
<vxe-column field="${javaField}" title="${comment}" align="center" /> <VxeColumn field="${javaField}" title="${comment}" align="center" />
#end #end
#end #end
#end #end
</vxe-table> </VxeTable>
</ContentWrap> </Card>
#end #end
</template> </template>

View File

@ -8,7 +8,7 @@
<script lang="ts" setup> <script lang="ts" setup>
import type { ${apiName} } from '#/api/${table.moduleName}/${table.businessName}'; import type { ${apiName} } from '#/api/${table.moduleName}/${table.businessName}';
import { computed, ref, h, onMounted,watch,nextTick } from 'vue'; import { computed, ref, h, onMounted, watch, nextTick } from 'vue';
import { $t } from '#/locales'; import { $t } from '#/locales';
@ -16,7 +16,6 @@
import { Plus } from "@vben/icons"; import { Plus } from "@vben/icons";
import { Button, Tabs, Checkbox, Input, Textarea, Select,RadioGroup,CheckboxGroup, DatePicker } from 'ant-design-vue'; import { Button, Tabs, Checkbox, Input, Textarea, Select,RadioGroup,CheckboxGroup, DatePicker } from 'ant-design-vue';
import { ImageUpload, FileUpload } from "#/components/upload"; import { ImageUpload, FileUpload } from "#/components/upload";
import type { OnActionClickParams } from '#/adapter/vxe-table';
import { useVbenVxeGrid } from '#/adapter/vxe-table'; import { useVbenVxeGrid } from '#/adapter/vxe-table';
import { use${subSimpleClassName}GridEditColumns } from '../data'; import { use${subSimpleClassName}GridEditColumns } from '../data';
import { get${subSimpleClassName}ListBy${SubJoinColumnName} } from '#/api/${table.moduleName}/${table.businessName}'; import { get${subSimpleClassName}ListBy${SubJoinColumnName} } from '#/api/${table.moduleName}/${table.businessName}';
@ -31,22 +30,9 @@ const props = defineProps<{
}>() }>()
#if ($subTable.subJoinMany) ## 一对多 #if ($subTable.subJoinMany) ## 一对多
/** 表格操作按钮的回调函数 */
function onActionClick({
code,
row,
}: OnActionClickParams<${apiName}.${subSimpleClassName}>) {
switch (code) {
case 'delete': {
handleDelete(row);
break;
}
}
}
const [Grid, gridApi] = useVbenVxeGrid({ const [Grid, gridApi] = useVbenVxeGrid({
gridOptions: { gridOptions: {
columns: use${subSimpleClassName}GridEditColumns(onActionClick), columns: use${subSimpleClassName}GridEditColumns(),
border: true, border: true,
showOverflow: true, showOverflow: true,
autoResize: true, autoResize: true,
@ -186,6 +172,17 @@ watch(
#end #end
#end #end
#end #end
<template #actions="{ row }">
<Button
size="small"
type="link"
danger
@click="handleDelete(row)"
v-access:code="['${subTable.moduleName}:${simpleClassName_strikeCase}:delete']"
>
{{ $t('ui.actionTitle.delete') }}
</Button>
</template>
</Grid> </Grid>
<div class="flex justify-center -mt-4"> <div class="flex justify-center -mt-4">
<Button :icon="h(Plus)" type="primary" ghost @click="handleAdd" v-access:code="['${subTable.moduleName}:${simpleClassName_strikeCase}:create']"> <Button :icon="h(Plus)" type="primary" ghost @click="handleAdd" v-access:code="['${subTable.moduleName}:${simpleClassName_strikeCase}:create']">

View File

@ -82,7 +82,7 @@ async function handleDeleteBatch() {
try { try {
await delete${subSimpleClassName}List(checkedIds.value); await delete${subSimpleClassName}List(checkedIds.value);
checkedIds.value = []; checkedIds.value = [];
message.success($t('ui.actionMessage.deleteSuccess', [row.id])); message.success($t('ui.actionMessage.deleteSuccess'));
handleRefresh(); handleRefresh();
} finally { } finally {
hideLoading(); hideLoading();
@ -134,7 +134,7 @@ const [Grid, gridApi] = useVbenVxeGrid({
#else #else
columns: use${subSimpleClassName}GridColumns(), columns: use${subSimpleClassName}GridColumns(),
pagerConfig: { pagerConfig: {
nabled: false, enabled: false,
}, },
toolbarConfig: { toolbarConfig: {
enabled: false, enabled: false,