Commit 78e69421dbf1361d061e5574e9c9b51e61135693

Authored by xingyu4j
1 parent 39e7d782

perf: vben5 代码生成 使用 table action

yudao-module-infra/src/main/resources/codegen/vue3_vben5_antd/schema/views/data.ts.vm
@@ -218,43 +218,10 @@ export function useGridColumns(): VxeTableGridOptions<${simpleClassName}Api.${si @@ -218,43 +218,10 @@ export function useGridColumns(): VxeTableGridOptions<${simpleClassName}Api.${si
218 #end 218 #end
219 #end 219 #end
220 { 220 {
221 - field: 'operation',  
222 title: '操作', 221 title: '操作',
223 - minWidth: 200,  
224 - align: 'center', 222 + width: 200,
225 fixed: 'right', 223 fixed: 'right',
226 - headerAlign: 'center',  
227 - showOverflow: false,  
228 - cellRender: {  
229 - attrs: {  
230 - nameField: '${columns[0].javaField}',  
231 - nameTitle: '${table.classComment}',  
232 - onClick: onActionClick,  
233 - },  
234 - name: 'CellOperation',  
235 - options: [  
236 -#if (${table.templateType} == 2)## 树表特有操作  
237 - {  
238 - code: 'append',  
239 - text: '新增下级',  
240 - show: hasAccessByCodes(['${table.moduleName}:${simpleClassName_strikeCase}:create']),  
241 - },  
242 -#end  
243 - {  
244 - code: 'edit',  
245 - show: hasAccessByCodes(['${table.moduleName}:${simpleClassName_strikeCase}:update']),  
246 - },  
247 - {  
248 - code: 'delete',  
249 - show: hasAccessByCodes(['${table.moduleName}:${simpleClassName_strikeCase}:delete']),  
250 -#if (${table.templateType} == 2)## 树表禁止删除带有子节点的数据  
251 - disabled: (row: ${simpleClassName}Api.${simpleClassName}) => {  
252 - return !!(row.children && row.children.length > 0);  
253 - },  
254 -#end  
255 - },  
256 - ],  
257 - }, 224 + slots: { default: 'actions' },
258 }, 225 },
259 ]; 226 ];
260 } 227 }
@@ -422,9 +389,7 @@ export function use${subSimpleClassName}GridFormSchema(): VbenFormSchema[] { @@ -422,9 +389,7 @@ export function use${subSimpleClassName}GridFormSchema(): VbenFormSchema[] {
422 } 389 }
423 390
424 /** 列表的字段 */ 391 /** 列表的字段 */
425 -export function use${subSimpleClassName}GridColumns(  
426 - onActionClick?: OnActionClickFn<${simpleClassName}Api.${subSimpleClassName}>,  
427 -): VxeTableGridOptions<${simpleClassName}Api.${subSimpleClassName}>['columns'] { 392 +export function use${subSimpleClassName}GridColumns(): VxeTableGridOptions<${simpleClassName}Api.${subSimpleClassName}>['columns'] {
428 return [ 393 return [
429 #if ($table.templateType != 2 && $deleteBatchEnable) 394 #if ($table.templateType != 2 && $deleteBatchEnable)
430 { type: 'checkbox', width: 40 }, 395 { type: 'checkbox', width: 40 },
@@ -450,31 +415,10 @@ export function use${subSimpleClassName}GridColumns( @@ -450,31 +415,10 @@ export function use${subSimpleClassName}GridColumns(
450 #end 415 #end
451 #end 416 #end
452 { 417 {
453 - field: 'operation',  
454 title: '操作', 418 title: '操作',
455 - minWidth: 200,  
456 - align: 'center', 419 + width: 200,
457 fixed: 'right', 420 fixed: 'right',
458 - headerAlign: 'center',  
459 - showOverflow: false,  
460 - cellRender: {  
461 - attrs: {  
462 - nameField: '${columns[0].javaField}',  
463 - nameTitle: '${subTable.classComment}',  
464 - onClick: onActionClick,  
465 - },  
466 - name: 'CellOperation',  
467 - options: [  
468 - {  
469 - code: 'edit',  
470 - show: hasAccessByCodes(['${table.moduleName}:${simpleClassName_strikeCase}:update']),  
471 - },  
472 - {  
473 - code: 'delete',  
474 - show: hasAccessByCodes(['${table.moduleName}:${simpleClassName_strikeCase}:delete']),  
475 - },  
476 - ],  
477 - }, 421 + slots: { default: 'actions' },
478 }, 422 },
479 ]; 423 ];
480 } 424 }
@@ -520,27 +464,10 @@ export function use${subSimpleClassName}GridColumns( @@ -520,27 +464,10 @@ export function use${subSimpleClassName}GridColumns(
520 #end 464 #end
521 #end 465 #end
522 { 466 {
523 - field: 'operation',  
524 title: '操作', 467 title: '操作',
525 - minWidth: 60,  
526 - align: 'center', 468 + width: 200,
527 fixed: 'right', 469 fixed: 'right',
528 - headerAlign: 'center',  
529 - showOverflow: false,  
530 - cellRender: {  
531 - attrs: {  
532 - nameField: '${columns[0].javaField}',  
533 - nameTitle: '${table.classComment}',  
534 - onClick: onActionClick,  
535 - },  
536 - name: 'CellOperation',  
537 - options: [  
538 - {  
539 - code: 'delete',  
540 - show: hasAccessByCodes(['${table.moduleName}:${simpleClassName_strikeCase}:delete']),  
541 - },  
542 - ],  
543 - }, 470 + slots: { default: 'actions' },
544 }, 471 },
545 ]; 472 ];
546 } 473 }
@@ -675,7 +602,6 @@ export function use${subSimpleClassName}GridColumns( @@ -675,7 +602,6 @@ export function use${subSimpleClassName}GridColumns(
675 #end 602 #end
676 ]; 603 ];
677 } 604 }
678 -  
679 #end 605 #end
680 #end 606 #end
681 #end 607 #end
yudao-module-infra/src/main/resources/codegen/vue3_vben5_antd/schema/views/index.vue.vm
@@ -11,7 +11,7 @@ import Form from &#39;./modules/form.vue&#39;; @@ -11,7 +11,7 @@ import Form from &#39;./modules/form.vue&#39;;
11 #foreach ($subSimpleClassName in $subSimpleClassNames) 11 #foreach ($subSimpleClassName in $subSimpleClassNames)
12 #set ($index = $foreach.count - 1) 12 #set ($index = $foreach.count - 1)
13 #set ($subSimpleClassName_strikeCase = $subSimpleClassName_strikeCases.get($index)) 13 #set ($subSimpleClassName_strikeCase = $subSimpleClassName_strikeCases.get($index))
14 - import ${subSimpleClassName}List from './modules/${subSimpleClassName_strikeCase}-list.vue' 14 +import ${subSimpleClassName}List from './modules/${subSimpleClassName_strikeCase}-list.vue'
15 #end 15 #end
16 #end 16 #end
17 17
@@ -227,38 +227,39 @@ const [Grid, gridApi] = useVbenVxeGrid({ @@ -227,38 +227,39 @@ const [Grid, gridApi] = useVbenVxeGrid({
227 <template #toolbar-tools> 227 <template #toolbar-tools>
228 <TableAction 228 <TableAction
229 :actions="[ 229 :actions="[
230 - #if (${table.templateType} == 2)## 树表特有:展开/收缩按钮  
231 - {  
232 - label: isExpanded ? '收缩' : '展开',  
233 - type: 'primary',  
234 - onClick: toggleExpand,  
235 - },  
236 - #end  
237 - {  
238 - label: $t('ui.actionTitle.create', ['${table.classComment}']),  
239 - type: 'primary',  
240 - icon: ACTION_ICON.ADD,  
241 - auth: ['${table.moduleName}:${simpleClassName_strikeCase}:create'],  
242 - onClick: handleCreate,  
243 - },  
244 - {  
245 - label: $t('ui.actionTitle.export'),  
246 - type: 'primary',  
247 - icon: ACTION_ICON.DOWNLOAD,  
248 - auth: ['${table.moduleName}:${simpleClassName_strikeCase}:export'],  
249 - onClick: handleExport,  
250 - },  
251 - #if ($table.templateType != 2 && $deleteBatchEnable)  
252 - {  
253 - label: $t('ui.actionTitle.deleteBatch'),  
254 - type: 'primary',  
255 - icon: ACTION_ICON.DELETE,  
256 - disabled: isEmpty(deleteIds),  
257 - auth: ['${table.moduleName}:${simpleClassName_strikeCase}:delete'],  
258 - onClick: handleDeleteBatch,  
259 - },  
260 - #end  
261 - ]" 230 + #if (${table.templateType} == 2)## 树表特有:展开/收缩按钮
  231 + {
  232 + label: isExpanded ? '收缩' : '展开',
  233 + type: 'primary',
  234 + onClick: toggleExpand,
  235 + },
  236 + #end
  237 + {
  238 + label: $t('ui.actionTitle.create', ['${table.classComment}']),
  239 + type: 'primary',
  240 + icon: ACTION_ICON.ADD,
  241 + auth: ['${table.moduleName}:${simpleClassName_strikeCase}:create'],
  242 + onClick: handleCreate,
  243 + },
  244 + {
  245 + label: $t('ui.actionTitle.export'),
  246 + type: 'primary',
  247 + icon: ACTION_ICON.DOWNLOAD,
  248 + auth: ['${table.moduleName}:${simpleClassName_strikeCase}:export'],
  249 + onClick: handleExport,
  250 + },
  251 + #if ($table.templateType != 2 && $deleteBatchEnable)
  252 + {
  253 + label: $t('ui.actionTitle.deleteBatch'),
  254 + type: 'primary',
  255 + danger: true,
  256 + icon: ACTION_ICON.DELETE,
  257 + disabled: isEmpty(deleteIds),
  258 + auth: ['${table.moduleName}:${simpleClassName_strikeCase}:delete'],
  259 + onClick: handleDeleteBatch,
  260 + },
  261 + #end
  262 + ]"
262 /> 263 />
263 </template> 264 </template>
264 <template #actions="{ row }"> 265 <template #actions="{ row }">
yudao-module-infra/src/main/resources/codegen/vue3_vben5_antd/schema/views/modules/list_sub_erp.vue.vm
@@ -6,45 +6,43 @@ @@ -6,45 +6,43 @@
6 #set ($subSimpleClassName_strikeCase = $subSimpleClassName_strikeCases.get($subIndex)) 6 #set ($subSimpleClassName_strikeCase = $subSimpleClassName_strikeCases.get($subIndex))
7 #set ($SubJoinColumnName = $subJoinColumn.javaField.substring(0,1).toUpperCase() + ${subJoinColumn.javaField.substring(1)})##首字母大写 7 #set ($SubJoinColumnName = $subJoinColumn.javaField.substring(0,1).toUpperCase() + ${subJoinColumn.javaField.substring(1)})##首字母大写
8 <script lang="ts" setup> 8 <script lang="ts" setup>
9 - import type { OnActionClickParams, VxeTableGridOptions } from '#/adapter/vxe-table';  
10 - import type { ${simpleClassName}Api } from '#/api/${table.moduleName}/${table.businessName}'; 9 +import type { VxeTableGridOptions } from '#/adapter/vxe-table';
  10 +import type { ${simpleClassName}Api } from '#/api/${table.moduleName}/${table.businessName}';
11 11
12 #if ($table.templateType == 11) ## erp 12 #if ($table.templateType == 11) ## erp
13 - import ${subSimpleClassName}Form from './${subSimpleClassName_strikeCase}-form.vue' 13 +import ${subSimpleClassName}Form from './${subSimpleClassName_strikeCase}-form.vue'
14 #end 14 #end
15 - import { useVbenModal } from '@vben/common-ui';  
16 - import { Button, message } from 'ant-design-vue';  
17 - import { Plus, Trash2 } from '@vben/icons';  
18 - import { ref, computed, h, nextTick,watch } from 'vue';  
19 - import { $t } from '#/locales';  
20 - import { useVbenVxeGrid } from '#/adapter/vxe-table';  
21 - 15 +import { useVbenModal } from '@vben/common-ui';
  16 +import { message } from 'ant-design-vue';
  17 +import { ref, computed, nextTick,watch } from 'vue';
  18 +import { $t } from '#/locales';
  19 +import { ACTION_ICON, TableAction, useVbenVxeGrid } from '#/adapter/vxe-table';
22 20
23 #if ($table.templateType == 11) ## erp 21 #if ($table.templateType == 11) ## erp
24 - import { delete${subSimpleClassName},#if ($deleteBatchEnable) delete${subSimpleClassName}ListByIds,#end get${subSimpleClassName}Page } from '#/api/${table.moduleName}/${table.businessName}';  
25 - import { use${subSimpleClassName}GridFormSchema, use${subSimpleClassName}GridColumns } from '../data';  
26 - import { isEmpty } from '@vben/utils';  
27 - #else  
28 - #if ($subTable.subJoinMany) ## 一对多  
29 - import { get${subSimpleClassName}ListBy${SubJoinColumnName} } from '#/api/${table.moduleName}/${table.businessName}';  
30 - #else  
31 - import { get${subSimpleClassName}By${SubJoinColumnName} } from '#/api/${table.moduleName}/${table.businessName}';  
32 - #end  
33 - import { use${subSimpleClassName}GridColumns } from '../data'; 22 +import { delete${subSimpleClassName},#if ($deleteBatchEnable) delete${subSimpleClassName}ListByIds,#end get${subSimpleClassName}Page } from '#/api/${table.moduleName}/${table.businessName}';
  23 +import { use${subSimpleClassName}GridFormSchema, use${subSimpleClassName}GridColumns } from '../data';
  24 +import { isEmpty } from '@vben/utils';
  25 +#else
  26 +#if ($subTable.subJoinMany) ## 一对多
  27 +import { get${subSimpleClassName}ListBy${SubJoinColumnName} } from '#/api/${table.moduleName}/${table.businessName}';
  28 +#else
  29 +import { get${subSimpleClassName}By${SubJoinColumnName} } from '#/api/${table.moduleName}/${table.businessName}';
  30 +#end
  31 +import { use${subSimpleClassName}GridColumns } from '../data';
34 #end 32 #end
35 33
36 const props = defineProps<{ 34 const props = defineProps<{
37 - ${subJoinColumn.javaField}?: number // ${subJoinColumn.columnComment}(主表的关联字段) 35 + ${subJoinColumn.javaField}?: number // ${subJoinColumn.columnComment}(主表的关联字段)
38 }>() 36 }>()
39 37
40 #if ($table.templateType == 11) ## erp 38 #if ($table.templateType == 11) ## erp
41 - const [FormModal, formModalApi] = useVbenModal({  
42 - connectedComponent: ${subSimpleClassName}Form,  
43 - destroyOnClose: true,  
44 - }); 39 +const [FormModal, formModalApi] = useVbenModal({
  40 + connectedComponent: ${subSimpleClassName}Form,
  41 + destroyOnClose: true,
  42 +});
45 43
46 /** 创建${subTable.classComment} */ 44 /** 创建${subTable.classComment} */
47 -function onCreate() { 45 +function handleCreate() {
48 if (!props.${subJoinColumn.javaField}){ 46 if (!props.${subJoinColumn.javaField}){
49 message.warning("请先选择一个${table.classComment}!") 47 message.warning("请先选择一个${table.classComment}!")
50 return 48 return
@@ -53,20 +51,22 @@ function onCreate() { @@ -53,20 +51,22 @@ function onCreate() {
53 } 51 }
54 52
55 /** 编辑${subTable.classComment} */ 53 /** 编辑${subTable.classComment} */
56 -function onEdit(row: ${simpleClassName}Api.${subSimpleClassName}) { 54 +function handleEdit(row: ${simpleClassName}Api.${subSimpleClassName}) {
57 formModalApi.setData(row).open(); 55 formModalApi.setData(row).open();
58 } 56 }
59 57
60 /** 删除${subTable.classComment} */ 58 /** 删除${subTable.classComment} */
61 -async function onDelete(row: ${simpleClassName}Api.${subSimpleClassName}) { 59 +async function handleDelete(row: ${simpleClassName}Api.${subSimpleClassName}) {
62 const hideLoading = message.loading({ 60 const hideLoading = message.loading({
63 content: $t('ui.actionMessage.deleting', [row.id]), 61 content: $t('ui.actionMessage.deleting', [row.id]),
64 - duration: 0,  
65 key: 'action_process_msg', 62 key: 'action_process_msg',
66 }); 63 });
67 try { 64 try {
68 await delete${subSimpleClassName}(row.id as number); 65 await delete${subSimpleClassName}(row.id as number);
69 - message.success( $t('ui.actionMessage.deleteSuccess', [row.id]) ); 66 + message.success({
  67 + content: $t('ui.actionMessage.deleteSuccess', [row.id]),
  68 + key: 'action_key_msg',
  69 + });
70 onRefresh(); 70 onRefresh();
71 } finally { 71 } finally {
72 hideLoading(); 72 hideLoading();
@@ -75,15 +75,17 @@ async function onDelete(row: ${simpleClassName}Api.${subSimpleClassName}) { @@ -75,15 +75,17 @@ async function onDelete(row: ${simpleClassName}Api.${subSimpleClassName}) {
75 75
76 #if ($deleteBatchEnable) 76 #if ($deleteBatchEnable)
77 /** 批量删除${subTable.classComment} */ 77 /** 批量删除${subTable.classComment} */
78 -async function onDeleteBatch() { 78 +async function handleDeleteBatch() {
79 const hideLoading = message.loading({ 79 const hideLoading = message.loading({
80 content: $t('ui.actionMessage.deleting'), 80 content: $t('ui.actionMessage.deleting'),
81 - duration: 0,  
82 - key: 'action_process_msg', 81 + key: 'action_key_msg',
83 }); 82 });
84 try { 83 try {
85 await delete${subSimpleClassName}ListByIds(deleteIds.value); 84 await delete${subSimpleClassName}ListByIds(deleteIds.value);
86 - message.success( $t('ui.actionMessage.deleteSuccess') ); 85 + message.success({
  86 + content: $t('ui.actionMessage.deleteSuccess', [row.id]),
  87 + key: 'action_key_msg',
  88 + });
87 onRefresh(); 89 onRefresh();
88 } finally { 90 } finally {
89 hideLoading(); 91 hideLoading();
@@ -100,103 +102,86 @@ function setDeleteIds({ @@ -100,103 +102,86 @@ function setDeleteIds({
100 } 102 }
101 #end 103 #end
102 104
103 -/** 表格操作按钮的回调函数 */  
104 -function onActionClick({  
105 - code,  
106 - row,  
107 -}: OnActionClickParams<${simpleClassName}Api.${subSimpleClassName}>) {  
108 - switch (code) {  
109 - case 'edit': {  
110 - onEdit(row);  
111 - break;  
112 - }  
113 - case 'delete': {  
114 - onDelete(row);  
115 - break;  
116 - }  
117 - }  
118 -}  
119 -  
120 #end 105 #end
121 - const [Grid, gridApi] = useVbenVxeGrid({ 106 +const [Grid, gridApi] = useVbenVxeGrid({
122 #if ($table.templateType == 11) 107 #if ($table.templateType == 11)
123 - formOptions: {  
124 - schema: use${subSimpleClassName}GridFormSchema(),  
125 - }, 108 + formOptions: {
  109 + schema: use${subSimpleClassName}GridFormSchema(),
  110 + },
126 #end 111 #end
127 - gridOptions: { 112 + gridOptions: {
128 #if ($table.templateType == 11) 113 #if ($table.templateType == 11)
129 - columns: use${subSimpleClassName}GridColumns(onActionClick),  
130 - proxyConfig: {  
131 - ajax: {  
132 - query: async ({ page }, formValues) => {  
133 - if (!props.${subJoinColumn.javaField}){  
134 - return []  
135 - }  
136 - return await get${subSimpleClassName}Page({  
137 - pageNo: page.currentPage,  
138 - pageSize: page.pageSize,  
139 - ${subJoinColumn.javaField}: props.${subJoinColumn.javaField},  
140 - ...formValues,  
141 - });  
142 - }, 114 + columns: use${subSimpleClassName}GridColumns(),
  115 + proxyConfig: {
  116 + ajax: {
  117 + query: async ({ page }, formValues) => {
  118 + if (!props.${subJoinColumn.javaField}){
  119 + return []
  120 + }
  121 + return await get${subSimpleClassName}Page({
  122 + pageNo: page.currentPage,
  123 + pageSize: page.pageSize,
  124 + ${subJoinColumn.javaField}: props.${subJoinColumn.javaField},
  125 + ...formValues,
  126 + });
143 }, 127 },
144 }, 128 },
145 - pagerConfig: {  
146 - enabled: true,  
147 - },  
148 - toolbarConfig: {  
149 - refresh: { code: 'query' },  
150 - search: true,  
151 }, 129 },
  130 + pagerConfig: {
  131 + enabled: true,
  132 + },
  133 + toolbarConfig: {
  134 + refresh: { code: 'query' },
  135 + search: true,
  136 + },
152 #else 137 #else
153 - columns: use${subSimpleClassName}GridColumns(),  
154 - pagerConfig: {  
155 - enabled: false,  
156 - },  
157 - toolbarConfig: {  
158 - enabled: false,  
159 - }, 138 + columns: use${subSimpleClassName}GridColumns(),
  139 + pagerConfig: {
  140 + nabled: false,
  141 + },
  142 + toolbarConfig: {
  143 + enabled: false,
  144 + },
160 #end 145 #end
161 - height: '600px',  
162 - rowConfig: {  
163 - keyField: 'id',  
164 - isHover: true,  
165 - },  
166 - } as VxeTableGridOptions<${simpleClassName}Api.${subSimpleClassName}>,  
167 - #if (${table.templateType} == 11 && $deleteBatchEnable)  
168 - gridEvents:{  
169 - checkboxAll: setDeleteIds,  
170 - checkboxChange: setDeleteIds,  
171 - }  
172 - #end  
173 - }); 146 + height: '600px',
  147 + rowConfig: {
  148 + keyField: 'id',
  149 + isHover: true,
  150 + },
  151 + } as VxeTableGridOptions<${simpleClassName}Api.${subSimpleClassName}>,
  152 + #if (${table.templateType} == 11 && $deleteBatchEnable)
  153 + gridEvents:{
  154 + checkboxAll: setDeleteIds,
  155 + checkboxChange: setDeleteIds,
  156 + }
  157 + #end
  158 +});
174 159
175 /** 刷新表格 */ 160 /** 刷新表格 */
176 -const onRefresh = async ()=> { 161 +async function onRefresh() {
177 #if ($table.templateType == 11) ## erp 162 #if ($table.templateType == 11) ## erp
178 - await gridApi.query(); 163 + await gridApi.query();
179 #else 164 #else
180 - #if ($subTable.subJoinMany) ## 一对多  
181 - await gridApi.grid.loadData(await get${subSimpleClassName}ListBy${SubJoinColumnName}(props.${subJoinColumn.javaField}!));  
182 - #else  
183 - await gridApi.grid.loadData([await get${subSimpleClassName}By${SubJoinColumnName}(props.${subJoinColumn.javaField}!)]);  
184 - #end 165 + #if ($subTable.subJoinMany) ## 一对多
  166 + await gridApi.grid.loadData(await get${subSimpleClassName}ListBy${SubJoinColumnName}(props.${subJoinColumn.javaField}!));
  167 + #else
  168 + await gridApi.grid.loadData([await get${subSimpleClassName}By${SubJoinColumnName}(props.${subJoinColumn.javaField}!)]);
  169 + #end
185 #end 170 #end
186 } 171 }
187 172
188 - /** 监听主表的关联字段的变化,加载对应的子表数据 */  
189 - watch(  
190 - () => props.${subJoinColumn.javaField},  
191 - async (val) => {  
192 - if (!val) {  
193 - return;  
194 - }  
195 - await nextTick();  
196 - await onRefresh()  
197 - },  
198 - { immediate: true },  
199 - ); 173 +/** 监听主表的关联字段的变化,加载对应的子表数据 */
  174 +watch(
  175 + () => props.${subJoinColumn.javaField},
  176 + async (val) => {
  177 + if (!val) {
  178 + return;
  179 + }
  180 + await nextTick();
  181 + await onRefresh()
  182 + },
  183 + { immediate: true },
  184 +);
200 </script> 185 </script>
201 186
202 <template> 187 <template>
@@ -204,22 +189,52 @@ const onRefresh = async ()=&gt; { @@ -204,22 +189,52 @@ const onRefresh = async ()=&gt; {
204 <FormModal @success="onRefresh" /> 189 <FormModal @success="onRefresh" />
205 <Grid table-title="${subTable.classComment}列表"> 190 <Grid table-title="${subTable.classComment}列表">
206 <template #toolbar-tools> 191 <template #toolbar-tools>
207 - <Button :icon="h(Plus)" type="primary" @click="onCreate" v-access:code="['${table.moduleName}:${simpleClassName_strikeCase}:create']">  
208 - {{ $t('ui.actionTitle.create', ['${subTable.classComment}']) }}  
209 - </Button>  
210 - #if ($table.templateType == 11 && $deleteBatchEnable)  
211 - <Button  
212 - :icon="h(Trash2)"  
213 - type="primary"  
214 - danger  
215 - class="ml-2"  
216 - :disabled="isEmpty(deleteIds)"  
217 - @click="onDeleteBatch"  
218 - v-access:code="['${table.moduleName}:${simpleClassName_strikeCase}:delete']"  
219 - >  
220 - 批量删除  
221 - </Button>  
222 - #end 192 + <TableAction
  193 + :actions="[
  194 + {
  195 + label: $t('ui.actionTitle.create', ['${table.classComment}']),
  196 + type: 'primary',
  197 + icon: ACTION_ICON.ADD,
  198 + auth: ['${table.moduleName}:${simpleClassName_strikeCase}:create'],
  199 + onClick: handleCreate,
  200 + },
  201 + #if ($table.templateType == 11 && $deleteBatchEnable)
  202 + {
  203 + label: $t('ui.actionTitle.deleteBatch'),
  204 + type: 'primary',
  205 + danger: true,
  206 + icon: ACTION_ICON.DELETE,
  207 + disabled: isEmpty(deleteIds),
  208 + auth: ['${table.moduleName}:${simpleClassName_strikeCase}:delete'],
  209 + onClick: handleDeleteBatch,
  210 + },
  211 + #end
  212 + ]"
  213 + />
  214 + </template>
  215 + <template #actions="{ row }">
  216 + <TableAction
  217 + :actions="[
  218 + {
  219 + label: $t('common.edit'),
  220 + type: 'link',
  221 + icon: ACTION_ICON.EDIT,
  222 + auth: ['${table.moduleName}:${simpleClassName_strikeCase}:update'],
  223 + onClick: handleEdit.bind(null, row),
  224 + },
  225 + {
  226 + label: $t('common.delete'),
  227 + type: 'link',
  228 + danger: true,
  229 + icon: ACTION_ICON.DELETE,
  230 + auth: ['${table.moduleName}:${simpleClassName_strikeCase}:delete'],
  231 + popConfirm: {
  232 + title: $t('ui.actionMessage.deleteConfirm', [row.id]),
  233 + confirm: handleDelete.bind(null, row),
  234 + },
  235 + },
  236 + ]"
  237 + />
223 </template> 238 </template>
224 </Grid> 239 </Grid>
225 #else 240 #else