BJ_ZTEITS-Developers / parking-cloud-yudao

Commit 9b39f86718482f80f7819ef434e2533e0137b01e

Authored by puhui999
1 parent 68c80336

feat: 新增 vben5-ele-general 代码生成模板

Inline Side-by-side
Showing 8 changed files with 389 additions and 381 deletions
yudao-module-infra/src/main/java/cn/iocoder/yudao/module/infra/service/codegen/inner/CodegenEngine.java
  View file @9b39f86
@@ -201,6 +201,23 @@ public class CodegenEngine { @@ -201,6 +201,23 @@ public class CodegenEngine {
201 vue3FilePath("views/${table.moduleName}/${table.businessName}/modules/${subSimpleClassName_strikeCase}-list.vue")) 201 vue3FilePath("views/${table.moduleName}/${table.businessName}/modules/${subSimpleClassName_strikeCase}-list.vue"))
202 .put(CodegenFrontTypeEnum.VUE3_VBEN5_EP_SCHEMA.getType(), vue3Vben5EpSchemaTemplatePath("views/modules/list_sub_erp.vue"), // 特殊：主子表专属逻辑 202 .put(CodegenFrontTypeEnum.VUE3_VBEN5_EP_SCHEMA.getType(), vue3Vben5EpSchemaTemplatePath("views/modules/list_sub_erp.vue"), // 特殊：主子表专属逻辑
203 vue3FilePath("views/${table.moduleName}/${table.businessName}/modules/${subSimpleClassName_strikeCase}-list.vue")) 203 vue3FilePath("views/${table.moduleName}/${table.businessName}/modules/${subSimpleClassName_strikeCase}-list.vue"))
  204 + // VUE3_VBEN5_EP
  205 + .put(CodegenFrontTypeEnum.VUE3_VBEN5_EP_GENERAL.getType(), vue3Vben5EpGeneralTemplatePath("views/index.vue"),
  206 + vue3FilePath("views/${table.moduleName}/${table.businessName}/index.vue"))
  207 + .put(CodegenFrontTypeEnum.VUE3_VBEN5_EP_GENERAL.getType(), vue3Vben5EpGeneralTemplatePath("views/form.vue"),
  208 + vue3FilePath("views/${table.moduleName}/${table.businessName}/modules/form.vue"))
  209 + .put(CodegenFrontTypeEnum.VUE3_VBEN5_EP_GENERAL.getType(), vue3Vben5EpGeneralTemplatePath("api/api.ts"),
  210 + vue3FilePath("api/${table.moduleName}/${table.businessName}/index.ts"))
  211 + .put(CodegenFrontTypeEnum.VUE3_VBEN5_EP_GENERAL.getType(), vue3Vben5EpGeneralTemplatePath("views/modules/form_sub_normal.vue"), // 特殊：主子表专属逻辑
  212 + vue3FilePath("views/${table.moduleName}/${table.businessName}/modules/${subSimpleClassName_strikeCase}-form.vue"))
  213 + .put(CodegenFrontTypeEnum.VUE3_VBEN5_EP_GENERAL.getType(), vue3Vben5EpGeneralTemplatePath("views/modules/form_sub_inner.vue"), // 特殊：主子表专属逻辑
  214 + vue3FilePath("views/${table.moduleName}/${table.businessName}/modules/${subSimpleClassName_strikeCase}-form.vue"))
  215 + .put(CodegenFrontTypeEnum.VUE3_VBEN5_EP_GENERAL.getType(), vue3Vben5EpGeneralTemplatePath("views/modules/form_sub_erp.vue"), // 特殊：主子表专属逻辑
  216 + vue3FilePath("views/${table.moduleName}/${table.businessName}/modules/${subSimpleClassName_strikeCase}-form.vue"))
  217 + .put(CodegenFrontTypeEnum.VUE3_VBEN5_EP_GENERAL.getType(), vue3Vben5EpGeneralTemplatePath("views/modules/list_sub_inner.vue"), // 特殊：主子表专属逻辑
  218 + vue3FilePath("views/${table.moduleName}/${table.businessName}/modules/${subSimpleClassName_strikeCase}-list.vue"))
  219 + .put(CodegenFrontTypeEnum.VUE3_VBEN5_EP_GENERAL.getType(), vue3Vben5EpGeneralTemplatePath("views/modules/list_sub_erp.vue"), // 特殊：主子表专属逻辑
  220 + vue3FilePath("views/${table.moduleName}/${table.businessName}/modules/${subSimpleClassName_strikeCase}-list.vue"))
204 .build(); 221 .build();
205 222
206 @Resource 223 @Resource
yudao-module-infra/src/main/resources/codegen/vue3_vben5_ele/general/views/form.vue.vm
  View file @9b39f86
1 <script lang="ts" setup> 1 <script lang="ts" setup>
2 import type { ${simpleClassName}Api } from '#/api/${table.moduleName}/${simpleClassName_strikeCase}'; 2 import type { ${simpleClassName}Api } from '#/api/${table.moduleName}/${simpleClassName_strikeCase}';
3 -import type { Rule } from 'ant-design-vue/es/form'; 3 +import type { FormRules } from 'element-plus';
4 4
5 import { useVbenModal } from '@vben/common-ui'; 5 import { useVbenModal } from '@vben/common-ui';
6 import { Tinymce as RichTextarea } from '#/components/tinymce'; 6 import { Tinymce as RichTextarea } from '#/components/tinymce';
7 import { ImageUpload, FileUpload } from "#/components/upload"; 7 import { ImageUpload, FileUpload } from "#/components/upload";
8 -import { message, Tabs, Form, Input, Textarea, Select, RadioGroup, Radio, CheckboxGroup, Checkbox, DatePicker, TreeSelect } from 'ant-design-vue'; 8 +import { ElMessage, ElTabs, ElTabPane, ElForm, ElFormItem, ElInput, ElSelect, ElOption, ElRadioGroup, ElRadio, ElCheckboxGroup, ElCheckbox, ElDatePicker, ElTreeSelect } from 'element-plus';
9 import { DICT_TYPE, getDictOptions } from '#/utils'; 9 import { DICT_TYPE, getDictOptions } from '#/utils';
10 #if($table.templateType == 2)## 树表需要导入这些 10 #if($table.templateType == 2)## 树表需要导入这些
11 -import { get${simpleClassName}List } from '#/api/${table.moduleName}/${table.businessName}'; 11 +import { get${simpleClassName}List } from '#/api/${table.moduleName}/${simpleClassName_strikeCase}';
12 import { handleTree } from '@vben/utils' 12 import { handleTree } from '@vben/utils'
13 #end 13 #end
14 ## 特殊：主子表专属逻辑 14 ## 特殊：主子表专属逻辑
@@ -20,9 +20,9 @@ import { handleTree } from &#39;@vben/utils&#39; @@ -20,9 +20,9 @@ import { handleTree } from &#39;@vben/utils&#39;
20 #end 20 #end
21 #end 21 #end
22 22
23 -import { computed, ref } from 'vue'; 23 +import { computed, ref, reactive } from 'vue';
24 import { $t } from '#/locales'; 24 import { $t } from '#/locales';
25 -import { get${simpleClassName}, create${simpleClassName}, update${simpleClassName} } from '#/api/${table.moduleName}/${table.businessName}'; 25 +import { get${simpleClassName}, create${simpleClassName}, update${simpleClassName} } from '#/api/${table.moduleName}/${simpleClassName_strikeCase}';
26 26
27 const emit = defineEmits(['success']); 27 const emit = defineEmits(['success']);
28 28
@@ -38,14 +38,14 @@ const formData = ref&lt;Partial&lt;${simpleClassName}Api.${simpleClassName}&gt;&gt;({ @@ -38,14 +38,14 @@ const formData = ref&lt;Partial&lt;${simpleClassName}Api.${simpleClassName}&gt;&gt;({
38 #end 38 #end
39 #end 39 #end
40 }); 40 });
41 -const rules: Record<string, Rule[]> = { 41 +const rules = reactive<FormRules>({
42 #foreach ($column in $columns) 42 #foreach ($column in $columns)
43 #if (($column.createOperation || $column.updateOperation) && !$column.nullable && !${column.primaryKey})## 创建或者更新操作 && 要求非空 && 非主键 43 #if (($column.createOperation || $column.updateOperation) && !$column.nullable && !${column.primaryKey})## 创建或者更新操作 && 要求非空 && 非主键
44 #set($comment=$column.columnComment) 44 #set($comment=$column.columnComment)
45 $column.javaField: [{ required: true, message: '${comment}不能为空', trigger: #if($column.htmlType == 'select')'change'#else'blur'#end }], 45 $column.javaField: [{ required: true, message: '${comment}不能为空', trigger: #if($column.htmlType == 'select')'change'#else'blur'#end }],
46 #end 46 #end
47 #end 47 #end
48 -}; 48 +});
49 ## 特殊：树表专属逻辑 49 ## 特殊：树表专属逻辑
50 #if ( $table.templateType == 2 ) 50 #if ( $table.templateType == 2 )
51 const ${classNameVar}Tree = ref<any[]>([]) // 树形结构 51 const ${classNameVar}Tree = ref<any[]>([]) // 树形结构
@@ -145,10 +145,7 @@ const [Modal, modalApi] = useVbenModal({ @@ -145,10 +145,7 @@ const [Modal, modalApi] = useVbenModal({
145 // 关闭并提示 145 // 关闭并提示
146 await modalApi.close(); 146 await modalApi.close();
147 emit('success'); 147 emit('success');
148 - message.success({  
149 - content: $t('ui.actionMessage.operationSuccess'),  
150 - key: 'action_process_msg',  
151 - }); 148 + ElMessage.success($t('ui.actionMessage.operationSuccess'));
152 } finally { 149 } finally {
153 modalApi.unlock(); 150 modalApi.unlock();
154 } 151 }
@@ -182,12 +179,12 @@ const [Modal, modalApi] = useVbenModal({ @@ -182,12 +179,12 @@ const [Modal, modalApi] = useVbenModal({
182 179
183 <template> 180 <template>
184 <Modal :title="getTitle"> 181 <Modal :title="getTitle">
185 - <Form 182 + <el-form
186 ref="formRef" 183 ref="formRef"
187 :model="formData" 184 :model="formData"
188 :rules="rules" 185 :rules="rules"
189 - :label-col="{ span: 5 }"  
190 - :wrapper-col="{ span: 18 }" 186 + label-width="120px"
  187 + label-position="right"
191 > 188 >
192 #foreach($column in $columns) 189 #foreach($column in $columns)
193 #if ($column.createOperation || $column.updateOperation) 190 #if ($column.createOperation || $column.updateOperation)
@@ -203,122 +200,121 @@ const [Modal, modalApi] = useVbenModal({ @@ -203,122 +200,121 @@ const [Modal, modalApi] = useVbenModal({
203 #set ($dictMethod = "boolean") 200 #set ($dictMethod = "boolean")
204 #end 201 #end
205 #if ( $table.templateType == 2 && $column.id == $treeParentColumn.id ) 202 #if ( $table.templateType == 2 && $column.id == $treeParentColumn.id )
206 - <Form.Item label="${comment}" name="${javaField}">  
207 - <TreeSelect  
208 - v-model:value="formData.${javaField}"  
209 - :treeData="${classNameVar}Tree" 203 + <el-form-item label="${comment}" prop="${javaField}">
  204 + <el-tree-select
  205 + v-model="formData.${javaField}"
  206 + :data="${classNameVar}Tree"
210 #if ($treeNameColumn.javaField == "name") 207 #if ($treeNameColumn.javaField == "name")
211 - :fieldNames="{ 208 + :props="{
212 label: 'name', 209 label: 'name',
213 value: 'id', 210 value: 'id',
214 children: 'children', 211 children: 'children',
215 }" 212 }"
216 #else 213 #else
217 - :fieldNames="{ 214 + :props="{
218 label: '$treeNameColumn.javaField', 215 label: '$treeNameColumn.javaField',
219 value: 'id', 216 value: 'id',
220 children: 'children', 217 children: 'children',
221 }" 218 }"
222 #end 219 #end
223 - checkable  
224 - treeDefaultExpandAll 220 + check-strictly
  221 + default-expand-all
225 placeholder="请选择${comment}" 222 placeholder="请选择${comment}"
226 /> 223 />
227 - </Form.Item> 224 + </el-form-item>
228 #elseif ($column.htmlType == "input" && !$column.primaryKey)## 忽略主键，不用在表单里 225 #elseif ($column.htmlType == "input" && !$column.primaryKey)## 忽略主键，不用在表单里
229 - <Form.Item label="${comment}" name="${javaField}">  
230 - <Input v-model:value="formData.${javaField}" placeholder="请输入${comment}" />  
231 - </Form.Item> 226 + <el-form-item label="${comment}" prop="${javaField}">
  227 + <el-input v-model="formData.${javaField}" placeholder="请输入${comment}" />
  228 + </el-form-item>
232 #elseif($column.htmlType == "imageUpload")## 图片上传 229 #elseif($column.htmlType == "imageUpload")## 图片上传
233 - <Form.Item label="${comment}" name="${javaField}">  
234 - <ImageUpload v-model:value="formData.${javaField}" />  
235 - </Form.Item> 230 + <el-form-item label="${comment}" prop="${javaField}">
  231 + <ImageUpload v-model="formData.${javaField}" />
  232 + </el-form-item>
236 #elseif($column.htmlType == "fileUpload")## 文件上传 233 #elseif($column.htmlType == "fileUpload")## 文件上传
237 - <Form.Item label="${comment}" name="${javaField}">  
238 - <FileUpload v-model:value="formData.${javaField}" />  
239 - </Form.Item> 234 + <el-form-item label="${comment}" prop="${javaField}">
  235 + <FileUpload v-model="formData.${javaField}" />
  236 + </el-form-item>
240 #elseif($column.htmlType == "editor")## 文本编辑器 237 #elseif($column.htmlType == "editor")## 文本编辑器
241 - <Form.Item label="${comment}" name="${javaField}"> 238 + <el-form-item label="${comment}" prop="${javaField}">
242 <RichTextarea v-model="formData.${javaField}" height="500px" /> 239 <RichTextarea v-model="formData.${javaField}" height="500px" />
243 - </Form.Item> 240 + </el-form-item>
244 #elseif($column.htmlType == "select")## 下拉框 241 #elseif($column.htmlType == "select")## 下拉框
245 - <Form.Item label="${comment}" name="${javaField}">  
246 - <Select v-model:value="formData.${javaField}" placeholder="请选择${comment}"> 242 + <el-form-item label="${comment}" prop="${javaField}">
  243 + <el-select v-model="formData.${javaField}" placeholder="请选择${comment}">
247 #if ("" != $dictType)## 有数据字典 244 #if ("" != $dictType)## 有数据字典
248 - <Select.Option 245 + <el-option
249 v-for="dict in getDictOptions(DICT_TYPE.$dictType.toUpperCase(), '$dictMethod')" 246 v-for="dict in getDictOptions(DICT_TYPE.$dictType.toUpperCase(), '$dictMethod')"
250 :key="dict.value" 247 :key="dict.value"
251 :value="dict.value" 248 :value="dict.value"
252 - >  
253 - {{ dict.label }}  
254 - </Select.Option> 249 + :label="dict.label"
  250 + />
255 #else##没数据字典 251 #else##没数据字典
256 - <Select.Option label="请选择字典生成" value="" /> 252 + <el-option label="请选择字典生成" value="" />
257 #end 253 #end
258 - </Select>  
259 - </Form.Item> 254 + </el-select>
  255 + </el-form-item>
260 #elseif($column.htmlType == "checkbox")## 多选框 256 #elseif($column.htmlType == "checkbox")## 多选框
261 - <Form.Item label="${comment}" name="${javaField}">  
262 - <CheckboxGroup v-model:value="formData.${javaField}"> 257 + <el-form-item label="${comment}" prop="${javaField}">
  258 + <el-checkbox-group v-model="formData.${javaField}">
263 #if ("" != $dictType)## 有数据字典 259 #if ("" != $dictType)## 有数据字典
264 - <Checkbox 260 + <el-checkbox
265 v-for="dict in getDictOptions(DICT_TYPE.$dictType.toUpperCase(), '$dictMethod')" 261 v-for="dict in getDictOptions(DICT_TYPE.$dictType.toUpperCase(), '$dictMethod')"
266 :key="dict.value" 262 :key="dict.value"
267 - :value="dict.value" 263 + :label="dict.value"
268 > 264 >
269 {{ dict.label }} 265 {{ dict.label }}
270 - </Checkbox> 266 + </el-checkbox>
271 #else##没数据字典 267 #else##没数据字典
272 - <Checkbox label="请选择字典生成" /> 268 + <el-checkbox label="请选择字典生成" />
273 #end 269 #end
274 - </CheckboxGroup>  
275 - </Form.Item> 270 + </el-checkbox-group>
  271 + </el-form-item>
276 #elseif($column.htmlType == "radio")## 单选框 272 #elseif($column.htmlType == "radio")## 单选框
277 - <Form.Item label="${comment}" name="${javaField}">  
278 - <RadioGroup v-model:value="formData.${javaField}"> 273 + <el-form-item label="${comment}" prop="${javaField}">
  274 + <el-radio-group v-model="formData.${javaField}">
279 #if ("" != $dictType)## 有数据字典 275 #if ("" != $dictType)## 有数据字典
280 - <Radio 276 + <el-radio
281 v-for="dict in getDictOptions(DICT_TYPE.$dictType.toUpperCase(), '$dictMethod')" 277 v-for="dict in getDictOptions(DICT_TYPE.$dictType.toUpperCase(), '$dictMethod')"
282 :key="dict.value" 278 :key="dict.value"
283 - :value="dict.value" 279 + :label="dict.value"
284 > 280 >
285 {{ dict.label }} 281 {{ dict.label }}
286 - </Radio> 282 + </el-radio>
287 #else##没数据字典 283 #else##没数据字典
288 - <Radio value="1">请选择字典生成</Radio> 284 + <el-radio :label="1">请选择字典生成</el-radio>
289 #end 285 #end
290 - </RadioGroup>  
291 - </Form.Item> 286 + </el-radio-group>
  287 + </el-form-item>
292 #elseif($column.htmlType == "datetime")## 时间框 288 #elseif($column.htmlType == "datetime")## 时间框
293 - <Form.Item label="${comment}" name="${javaField}">  
294 - <DatePicker  
295 - v-model:value="formData.${javaField}"  
296 - valueFormat="x" 289 + <el-form-item label="${comment}" prop="${javaField}">
  290 + <el-date-picker
  291 + v-model="formData.${javaField}"
  292 + value-format="x"
297 placeholder="选择${comment}" 293 placeholder="选择${comment}"
298 /> 294 />
299 - </Form.Item> 295 + </el-form-item>
300 #elseif($column.htmlType == "textarea")## 文本框 296 #elseif($column.htmlType == "textarea")## 文本框
301 - <Form.Item label="${comment}" name="${javaField}">  
302 - <Textarea v-model:value="formData.${javaField}" placeholder="请输入${comment}" />  
303 - </Form.Item> 297 + <el-form-item label="${comment}" prop="${javaField}">
  298 + <el-input v-model="formData.${javaField}" type="textarea" placeholder="请输入${comment}" />
  299 + </el-form-item>
304 #end 300 #end
305 #end 301 #end
306 #end 302 #end
307 - </Form> 303 + </el-form>
308 ## 特殊：主子表专属逻辑 304 ## 特殊：主子表专属逻辑
309 #if ( $table.templateType == 10 || $table.templateType == 12 ) 305 #if ( $table.templateType == 10 || $table.templateType == 12 )
310 <!-- 子表的表单 --> 306 <!-- 子表的表单 -->
311 - <Tabs v-model:active-key="subTabsName"> 307 + <el-tabs v-model="subTabsName">
312 #foreach ($subTable in $subTables) 308 #foreach ($subTable in $subTables)
313 #set ($index = $foreach.count - 1) 309 #set ($index = $foreach.count - 1)
314 #set ($subClassNameVar = $subClassNameVars.get($index)) 310 #set ($subClassNameVar = $subClassNameVars.get($index))
315 #set ($subSimpleClassName = $subSimpleClassNames.get($index)) 311 #set ($subSimpleClassName = $subSimpleClassNames.get($index))
316 #set ($subJoinColumn_strikeCase = $subJoinColumn_strikeCases.get($index)) 312 #set ($subJoinColumn_strikeCase = $subJoinColumn_strikeCases.get($index))
317 - <Tabs.TabPane key="$subClassNameVar" tab="${subTable.classComment}" force-render> 313 + <el-tab-pane name="$subClassNameVar" label="${subTable.classComment}">
318 <${subSimpleClassName}Form ref="${subClassNameVar}FormRef" :${subJoinColumn_strikeCase}="formData?.id" /> 314 <${subSimpleClassName}Form ref="${subClassNameVar}FormRef" :${subJoinColumn_strikeCase}="formData?.id" />
319 - </Tabs.TabPane> 315 + </el-tab-pane>
320 #end 316 #end
321 - </Tabs> 317 + </el-tabs>
322 #end 318 #end
323 </Modal> 319 </Modal>
324 </template> 320 </template>
yudao-module-infra/src/main/resources/codegen/vue3_vben5_ele/general/views/index.vue.vm
  View file @9b39f86
@@ -4,7 +4,7 @@ import type { VxeTableInstance } from &#39;#/adapter/vxe-table&#39;; @@ -4,7 +4,7 @@ import type { VxeTableInstance } from &#39;#/adapter/vxe-table&#39;;
4 4
5 import { Page, useVbenModal } from '@vben/common-ui'; 5 import { Page, useVbenModal } from '@vben/common-ui';
6 import { cloneDeep, formatDateTime } from '@vben/utils'; 6 import { cloneDeep, formatDateTime } from '@vben/utils';
7 -import { Button, message,Tabs,Pagination,Form,RangePicker,DatePicker,Select,Input } from 'ant-design-vue'; 7 +import { ElButton, ElMessage, ElLoading, ElTabs, ElTabPane, ElPagination, ElForm, ElFormItem, ElDatePicker, ElSelect, ElOption, ElInput } from 'element-plus';
8 import { DictTag } from '#/components/dict-tag'; 8 import { DictTag } from '#/components/dict-tag';
9 import { DICT_TYPE, getDictOptions, getRangePickerDefaultProps } from '#/utils'; 9 import { DICT_TYPE, getDictOptions, getRangePickerDefaultProps } from '#/utils';
10 import ${simpleClassName}Form from './modules/form.vue'; 10 import ${simpleClassName}Form from './modules/form.vue';
@@ -30,7 +30,7 @@ import { handleTree,isEmpty } from &#39;@vben/utils&#39; @@ -30,7 +30,7 @@ import { handleTree,isEmpty } from &#39;@vben/utils&#39;
30 import { get${simpleClassName}List, delete${simpleClassName}, export${simpleClassName} } from '#/api/${table.moduleName}/${simpleClassName_strikeCase}'; 30 import { get${simpleClassName}List, delete${simpleClassName}, export${simpleClassName} } from '#/api/${table.moduleName}/${simpleClassName_strikeCase}';
31 #else## 标准表接口 31 #else## 标准表接口
32 import { isEmpty } from '@vben/utils'; 32 import { isEmpty } from '@vben/utils';
33 -import { get${simpleClassName}Page, delete${simpleClassName},#if ($deleteBatchEnable) delete${simpleClassName}List,#end export${simpleClassName} } from '#/api/${table.moduleName}/${table.businessName}'; 33 +import { get${simpleClassName}Page, delete${simpleClassName},#if ($deleteBatchEnable) delete${simpleClassName}List,#end export${simpleClassName} } from '#/api/${table.moduleName}/${simpleClassName_strikeCase}';
34 #end 34 #end
35 import { downloadFileFromBlobPart } from '@vben/utils'; 35 import { downloadFileFromBlobPart } from '@vben/utils';
36 36
@@ -141,37 +141,32 @@ function handleAppend(row: ${simpleClassName}Api.${simpleClassName}) { @@ -141,37 +141,32 @@ function handleAppend(row: ${simpleClassName}Api.${simpleClassName}) {
141 141
142 /** 删除${table.classComment} */ 142 /** 删除${table.classComment} */
143 async function handleDelete(row: ${simpleClassName}Api.${simpleClassName}) { 143 async function handleDelete(row: ${simpleClassName}Api.${simpleClassName}) {
144 - const hideLoading = message.loading({  
145 - content: $t('ui.actionMessage.deleting', [row.id]),  
146 - duration: 0,  
147 - key: 'action_process_msg', 144 + const loadingInstance = ElLoading.service({
  145 + text: $t('ui.actionMessage.deleting', [row.id]),
  146 + background: 'rgba(0, 0, 0, 0.7)',
148 }); 147 });
149 try { 148 try {
150 await delete${simpleClassName}(row.id as number); 149 await delete${simpleClassName}(row.id as number);
151 - message.success({  
152 - content: $t('ui.actionMessage.deleteSuccess', [row.id]),  
153 - key: 'action_process_msg',  
154 - }); 150 + ElMessage.success($t('ui.actionMessage.deleteSuccess', [row.id]));
155 await getList(); 151 await getList();
156 } finally { 152 } finally {
157 - hideLoading(); 153 + loadingInstance.close();
158 } 154 }
159 } 155 }
160 156
161 #if ($table.templateType != 2 && $deleteBatchEnable) 157 #if ($table.templateType != 2 && $deleteBatchEnable)
162 /** 批量删除${table.classComment} */ 158 /** 批量删除${table.classComment} */
163 async function handleDeleteBatch() { 159 async function handleDeleteBatch() {
164 - const hideLoading = message.loading({  
165 - content: $t('ui.actionMessage.deleting'),  
166 - duration: 0,  
167 - key: 'action_process_msg', 160 + const loadingInstance = ElLoading.service({
  161 + text: $t('ui.actionMessage.deleting'),
  162 + background: 'rgba(0, 0, 0, 0.7)',
168 }); 163 });
169 try { 164 try {
170 await delete${simpleClassName}List(checkedIds.value); 165 await delete${simpleClassName}List(checkedIds.value);
171 - message.success( $t('ui.actionMessage.deleteSuccess') ); 166 + ElMessage.success($t('ui.actionMessage.deleteSuccess'));
172 await getList(); 167 await getList();
173 } finally { 168 } finally {
174 - hideLoading(); 169 + loadingInstance.close();
175 } 170 }
176 } 171 }
177 172
@@ -218,10 +213,10 @@ onMounted(() =&gt; { @@ -218,10 +213,10 @@ onMounted(() =&gt; {
218 213
219 <ContentWrap v-if="!hiddenSearchBar"> 214 <ContentWrap v-if="!hiddenSearchBar">
220 <!-- 搜索工作栏 --> 215 <!-- 搜索工作栏 -->
221 - <Form 216 + <el-form
222 :model="queryParams" 217 :model="queryParams"
223 ref="queryFormRef" 218 ref="queryFormRef"
224 - layout="inline" 219 + inline
225 > 220 >
226 #foreach($column in $columns) 221 #foreach($column in $columns)
227 #if ($column.listOperation) 222 #if ($column.listOperation)
@@ -237,66 +232,69 @@ onMounted(() =&gt; { @@ -237,66 +232,69 @@ onMounted(() =&gt; {
237 #set ($dictMethod = "boolean") 232 #set ($dictMethod = "boolean")
238 #end 233 #end
239 #if ($column.htmlType == "input") 234 #if ($column.htmlType == "input")
240 - <Form.Item label="${comment}" name="${javaField}">  
241 - <Input  
242 - v-model:value="queryParams.${javaField}" 235 + <el-form-item label="${comment}">
  236 + <el-input
  237 + v-model="queryParams.${javaField}"
243 placeholder="请输入${comment}" 238 placeholder="请输入${comment}"
244 - allowClear  
245 - @pressEnter="handleQuery"  
246 - class="w-full" 239 + clearable
  240 + @keyup.enter="handleQuery"
  241 + class="!w-[240px]"
247 /> 242 />
248 - </Form.Item> 243 + </el-form-item>
249 #elseif ($column.htmlType == "select" || $column.htmlType == "radio" || $column.htmlType == "checkbox") 244 #elseif ($column.htmlType == "select" || $column.htmlType == "radio" || $column.htmlType == "checkbox")
250 - <Form.Item label="${comment}" name="${javaField}">  
251 - <Select  
252 - v-model:value="queryParams.${javaField}" 245 + <el-form-item label="${comment}">
  246 + <el-select
  247 + v-model="queryParams.${javaField}"
253 placeholder="请选择${comment}" 248 placeholder="请选择${comment}"
254 - allowClear  
255 - class="w-full" 249 + clearable
  250 + class="!w-[240px]"
256 > 251 >
257 #if ("" != $dictType)## 设置了 dictType 数据字典的情况 252 #if ("" != $dictType)## 设置了 dictType 数据字典的情况
258 - <Select.Option 253 + <el-option
259 v-for="dict in getDictOptions(DICT_TYPE.$dictType.toUpperCase(), '$dictMethod')" 254 v-for="dict in getDictOptions(DICT_TYPE.$dictType.toUpperCase(), '$dictMethod')"
260 :key="dict.value" 255 :key="dict.value"
261 :value="dict.value" 256 :value="dict.value"
262 - >  
263 - {{ dict.label }}  
264 - </Select.Option> 257 + :label="dict.label"
  258 + />
265 #else## 未设置 dictType 数据字典的情况 259 #else## 未设置 dictType 数据字典的情况
266 - <Select.Option label="请选择字典生成" value="" /> 260 + <el-option label="请选择字典生成" value="" />
267 #end 261 #end
268 - </Select>  
269 - </Form.Item> 262 + </el-select>
  263 + </el-form-item>
270 #elseif($column.htmlType == "datetime") 264 #elseif($column.htmlType == "datetime")
271 #if ($column.listOperationCondition != "BETWEEN")## 非范围 265 #if ($column.listOperationCondition != "BETWEEN")## 非范围
272 - <Form.Item label="${comment}" name="${javaField}">  
273 - <DatePicker  
274 - v-model:value="queryParams.${javaField}"  
275 - valueFormat="YYYY-MM-DD" 266 + <el-form-item label="${comment}">
  267 + <el-date-picker
  268 + v-model="queryParams.${javaField}"
  269 + value-format="YYYY-MM-DD"
276 placeholder="选择${comment}" 270 placeholder="选择${comment}"
277 - allowClear  
278 - class="w-full" 271 + clearable
  272 + class="!w-[240px]"
279 /> 273 />
280 - </Form.Item> 274 + </el-form-item>
281 #else## 范围 275 #else## 范围
282 - <Form.Item label="${comment}" name="${javaField}">  
283 - <RangePicker  
284 - v-model:value="queryParams.${javaField}"  
285 - v-bind="getRangePickerDefaultProps()"  
286 - class="w-full" 276 + <el-form-item label="${comment}">
  277 + <el-date-picker
  278 + v-model="queryParams.${javaField}"
  279 + type="daterange"
  280 + value-format="YYYY-MM-DD"
  281 + range-separator="至"
  282 + start-placeholder="开始日期"
  283 + end-placeholder="结束日期"
  284 + class="!w-[240px]"
287 /> 285 />
288 - </Form.Item> 286 + </el-form-item>
289 #end 287 #end
290 #end 288 #end
291 #end 289 #end
292 #end 290 #end
293 - <Form.Item>  
294 - <Button class="ml-2" @click="resetQuery"> 重置 </Button>  
295 - <Button class="ml-2" @click="handleQuery" type="primary"> 291 + <el-form-item>
  292 + <el-button class="ml-2" @click="resetQuery"> 重置 </el-button>
  293 + <el-button class="ml-2" @click="handleQuery" type="primary">
296 搜索 294 搜索
297 - </Button>  
298 - </Form.Item>  
299 - </Form> 295 + </el-button>
  296 + </el-form-item>
  297 + </el-form>
300 </ContentWrap> 298 </ContentWrap>
301 299
302 <!-- 列表 --> 300 <!-- 列表 -->
@@ -307,11 +305,11 @@ onMounted(() =&gt; { @@ -307,11 +305,11 @@ onMounted(() =&gt; {
307 v-model:hidden-search="hiddenSearchBar" 305 v-model:hidden-search="hiddenSearchBar"
308 > 306 >
309 #if (${table.templateType} == 2) 307 #if (${table.templateType} == 2)
310 - <Button @click="toggleExpand" class="mr-2"> 308 + <el-button @click="toggleExpand" class="mr-2">
311 {{ isExpanded ? '收缩' : '展开' }} 309 {{ isExpanded ? '收缩' : '展开' }}
312 - </Button> 310 + </el-button>
313 #end 311 #end
314 - <Button 312 + <el-button
315 class="ml-2" 313 class="ml-2"
316 :icon="h(Plus)" 314 :icon="h(Plus)"
317 type="primary" 315 type="primary"
@@ -319,8 +317,8 @@ onMounted(() =&gt; { @@ -319,8 +317,8 @@ onMounted(() =&gt; {
319 v-access:code="['${permissionPrefix}:create']" 317 v-access:code="['${permissionPrefix}:create']"
320 > 318 >
321 {{ $t('ui.actionTitle.create', ['${table.classComment}']) }} 319 {{ $t('ui.actionTitle.create', ['${table.classComment}']) }}
322 - </Button>  
323 - <Button 320 + </el-button>
  321 + <el-button
324 :icon="h(Download)" 322 :icon="h(Download)"
325 type="primary" 323 type="primary"
326 class="ml-2" 324 class="ml-2"
@@ -329,19 +327,18 @@ onMounted(() =&gt; { @@ -329,19 +327,18 @@ onMounted(() =&gt; {
329 v-access:code="['${permissionPrefix}:export']" 327 v-access:code="['${permissionPrefix}:export']"
330 > 328 >
331 {{ $t('ui.actionTitle.export') }} 329 {{ $t('ui.actionTitle.export') }}
332 - </Button> 330 + </el-button>
333 #if ($table.templateType != 2 && $deleteBatchEnable) 331 #if ($table.templateType != 2 && $deleteBatchEnable)
334 - <Button 332 + <el-button
335 :icon="h(Trash2)" 333 :icon="h(Trash2)"
336 - type="primary"  
337 - danger 334 + type="danger"
338 class="ml-2" 335 class="ml-2"
339 :disabled="isEmpty(checkedIds)" 336 :disabled="isEmpty(checkedIds)"
340 @click="handleDeleteBatch" 337 @click="handleDeleteBatch"
341 v-access:code="['${table.moduleName}:${simpleClassName_strikeCase}:delete']" 338 v-access:code="['${table.moduleName}:${simpleClassName_strikeCase}:delete']"
342 > 339 >
343 批量删除 340 批量删除
344 - </Button> 341 + </el-button>
345 #end 342 #end
346 </TableToolbar> 343 </TableToolbar>
347 </template> 344 </template>
@@ -381,17 +378,17 @@ onMounted(() =&gt; { @@ -381,17 +378,17 @@ onMounted(() =&gt; {
381 <vxe-column type="expand" width="60"> 378 <vxe-column type="expand" width="60">
382 <template #content="{ row }"> 379 <template #content="{ row }">
383 <!-- 子表的表单 --> 380 <!-- 子表的表单 -->
384 - <Tabs v-model:active-key="subTabsName" class="mx-8"> 381 + <el-tabs v-model="subTabsName" class="mx-8">
385 #foreach ($subTable in $subTables) 382 #foreach ($subTable in $subTables)
386 #set ($index = $foreach.count - 1) 383 #set ($index = $foreach.count - 1)
387 #set ($subClassNameVar = $subClassNameVars.get($index)) 384 #set ($subClassNameVar = $subClassNameVars.get($index))
388 #set ($subSimpleClassName = $subSimpleClassNames.get($index)) 385 #set ($subSimpleClassName = $subSimpleClassNames.get($index))
389 #set ($subJoinColumn_strikeCase = $subJoinColumn_strikeCases.get($index)) 386 #set ($subJoinColumn_strikeCase = $subJoinColumn_strikeCases.get($index))
390 - <Tabs.TabPane key="$subClassNameVar" tab="${subTable.classComment}" force-render> 387 + <el-tab-pane name="$subClassNameVar" label="${subTable.classComment}">
391 <${subSimpleClassName}List :${subJoinColumn_strikeCase}="row?.id" /> 388 <${subSimpleClassName}List :${subJoinColumn_strikeCase}="row?.id" />
392 - </Tabs.TabPane> 389 + </el-tab-pane>
393 #end 390 #end
394 - </Tabs> 391 + </el-tabs>
395 </template> 392 </template>
396 </vxe-column> 393 </vxe-column>
397 #end 394 #end
@@ -423,27 +420,29 @@ onMounted(() =&gt; { @@ -423,27 +420,29 @@ onMounted(() =&gt; {
423 <vxe-column field="operation" title="操作" align="center"> 420 <vxe-column field="operation" title="操作" align="center">
424 <template #default="{row}"> 421 <template #default="{row}">
425 #if ( $table.templateType == 2 ) 422 #if ( $table.templateType == 2 )
426 - <Button 423 + <el-button
427 size="small" 424 size="small"
428 - type="link" 425 + type="primary"
  426 + link
429 @click="handleAppend(row as any)" 427 @click="handleAppend(row as any)"
430 v-access:code="['${permissionPrefix}:create']" 428 v-access:code="['${permissionPrefix}:create']"
431 > 429 >
432 新增下级 430 新增下级
433 - </Button> 431 + </el-button>
434 #end 432 #end
435 - <Button 433 + <el-button
436 size="small" 434 size="small"
437 - type="link" 435 + type="primary"
  436 + link
438 @click="handleEdit(row as any)" 437 @click="handleEdit(row as any)"
439 v-access:code="['${permissionPrefix}:update']" 438 v-access:code="['${permissionPrefix}:update']"
440 > 439 >
441 {{ $t('ui.actionTitle.edit') }} 440 {{ $t('ui.actionTitle.edit') }}
442 - </Button>  
443 - <Button 441 + </el-button>
  442 + <el-button
444 size="small" 443 size="small"
445 - type="link"  
446 - danger 444 + type="danger"
  445 + link
447 class="ml-2" 446 class="ml-2"
448 #if ( $table.templateType == 2 ) 447 #if ( $table.templateType == 2 )
449 :disabled="!isEmpty(row?.children)" 448 :disabled="!isEmpty(row?.children)"
@@ -452,19 +451,21 @@ onMounted(() =&gt; { @@ -452,19 +451,21 @@ onMounted(() =&gt; {
452 v-access:code="['${permissionPrefix}:delete']" 451 v-access:code="['${permissionPrefix}:delete']"
453 > 452 >
454 {{ $t('ui.actionTitle.delete') }} 453 {{ $t('ui.actionTitle.delete') }}
455 - </Button> 454 + </el-button>
456 </template> 455 </template>
457 </vxe-column> 456 </vxe-column>
458 </vxe-table> 457 </vxe-table>
459 #if ( $table.templateType != 2 ) 458 #if ( $table.templateType != 2 )
460 <!-- 分页 --> 459 <!-- 分页 -->
461 <div class="mt-2 flex justify-end"> 460 <div class="mt-2 flex justify-end">
462 - <Pagination 461 + <el-pagination
463 :total="total" 462 :total="total"
464 - v-model:current="queryParams.pageNo" 463 + v-model:current-page="queryParams.pageNo"
465 v-model:page-size="queryParams.pageSize" 464 v-model:page-size="queryParams.pageSize"
466 - show-size-changer  
467 - @change="getList" 465 + :page-sizes="[10, 20, 50, 100]"
  466 + layout="total, sizes, prev, pager, next, jumper"
  467 + @size-change="getList"
  468 + @current-change="getList"
468 /> 469 />
469 </div> 470 </div>
470 #end 471 #end
@@ -472,17 +473,17 @@ onMounted(() =&gt; { @@ -472,17 +473,17 @@ onMounted(() =&gt; {
472 #if ($table.templateType == 11) ## erp情况 473 #if ($table.templateType == 11) ## erp情况
473 <ContentWrap> 474 <ContentWrap>
474 <!-- 子表的表单 --> 475 <!-- 子表的表单 -->
475 - <Tabs v-model:active-key="subTabsName"> 476 + <el-tabs v-model="subTabsName">
476 #foreach ($subTable in $subTables) 477 #foreach ($subTable in $subTables)
477 #set ($index = $foreach.count - 1) 478 #set ($index = $foreach.count - 1)
478 #set ($subClassNameVar = $subClassNameVars.get($index)) 479 #set ($subClassNameVar = $subClassNameVars.get($index))
479 #set ($subSimpleClassName = $subSimpleClassNames.get($index)) 480 #set ($subSimpleClassName = $subSimpleClassNames.get($index))
480 #set ($subJoinColumn_strikeCase = $subJoinColumn_strikeCases.get($index)) 481 #set ($subJoinColumn_strikeCase = $subJoinColumn_strikeCases.get($index))
481 - <Tabs.TabPane key="$subClassNameVar" tab="${subTable.classComment}" force-render> 482 + <el-tab-pane name="$subClassNameVar" label="${subTable.classComment}">
482 <${subSimpleClassName}List :${subJoinColumn_strikeCase}="select${simpleClassName}?.id" /> 483 <${subSimpleClassName}List :${subJoinColumn_strikeCase}="select${simpleClassName}?.id" />
483 - </Tabs.TabPane> 484 + </el-tab-pane>
484 #end 485 #end
485 - </Tabs> 486 + </el-tabs>
486 </ContentWrap> 487 </ContentWrap>
487 #end 488 #end
488 </Page> 489 </Page>
yudao-module-infra/src/main/resources/codegen/vue3_vben5_ele/general/views/modules/form_sub_erp.vue.vm
  View file @9b39f86
@@ -4,15 +4,15 @@ @@ -4,15 +4,15 @@
4 #set ($subSimpleClassName = $subSimpleClassNames.get($subIndex)) 4 #set ($subSimpleClassName = $subSimpleClassNames.get($subIndex))
5 <script lang="ts" setup> 5 <script lang="ts" setup>
6 import type { ${simpleClassName}Api } from '#/api/${table.moduleName}/${simpleClassName_strikeCase}'; 6 import type { ${simpleClassName}Api } from '#/api/${table.moduleName}/${simpleClassName_strikeCase}';
7 - import type { Rule } from 'ant-design-vue/es/form'; 7 + import type { FormRules } from 'element-plus';
8 8
9 import { useVbenModal } from '@vben/common-ui'; 9 import { useVbenModal } from '@vben/common-ui';
10 import { Tinymce as RichTextarea } from '#/components/tinymce'; 10 import { Tinymce as RichTextarea } from '#/components/tinymce';
11 import { ImageUpload, FileUpload } from "#/components/upload"; 11 import { ImageUpload, FileUpload } from "#/components/upload";
12 - import { message, Tabs, Form, Input, Textarea, Select, RadioGroup, Radio, CheckboxGroup, Checkbox, DatePicker, TreeSelect } from 'ant-design-vue'; 12 + import { ElMessage, ElTabs, ElTabPane, ElForm, ElFormItem, ElInput, ElSelect, ElOption, ElRadioGroup, ElRadio, ElCheckboxGroup, ElCheckbox, ElDatePicker, ElTreeSelect } from 'element-plus';
13 import { DICT_TYPE, getDictOptions } from '#/utils'; 13 import { DICT_TYPE, getDictOptions } from '#/utils';
14 14
15 - import { computed, ref } from 'vue'; 15 + import { computed, ref, reactive } from 'vue';
16 import { $t } from '#/locales'; 16 import { $t } from '#/locales';
17 17
18 import { get${subSimpleClassName}, create${subSimpleClassName}, update${subSimpleClassName} } from '#/api/${table.moduleName}/${simpleClassName_strikeCase}'; 18 import { get${subSimpleClassName}, create${subSimpleClassName}, update${subSimpleClassName} } from '#/api/${table.moduleName}/${simpleClassName_strikeCase}';
@@ -36,14 +36,14 @@ @@ -36,14 +36,14 @@
36 #end 36 #end
37 #end 37 #end
38 }); 38 });
39 - const rules: Record<string, Rule[]> = { 39 + const rules = reactive<FormRules>({
40 #foreach ($column in $subColumns) 40 #foreach ($column in $subColumns)
41 #if (($column.createOperation || $column.updateOperation) && !$column.nullable && !${column.primaryKey})## 创建或者更新操作 && 要求非空 && 非主键 41 #if (($column.createOperation || $column.updateOperation) && !$column.nullable && !${column.primaryKey})## 创建或者更新操作 && 要求非空 && 非主键
42 #set($comment=$column.columnComment) 42 #set($comment=$column.columnComment)
43 $column.javaField: [{ required: true, message: '${comment}不能为空', trigger: #if($column.htmlType == 'select')'change'#else'blur'#end }], 43 $column.javaField: [{ required: true, message: '${comment}不能为空', trigger: #if($column.htmlType == 'select')'change'#else'blur'#end }],
44 #end 44 #end
45 #end 45 #end
46 - }; 46 + });
47 47
48 const [Modal, modalApi] = useVbenModal({ 48 const [Modal, modalApi] = useVbenModal({
49 async onConfirm() { 49 async onConfirm() {
@@ -57,10 +57,7 @@ @@ -57,10 +57,7 @@
57 // 关闭并提示 57 // 关闭并提示
58 await modalApi.close(); 58 await modalApi.close();
59 emit('success'); 59 emit('success');
60 - message.success({  
61 - content: $t('ui.actionMessage.operationSuccess'),  
62 - key: 'action_process_msg',  
63 - }); 60 + ElMessage.success($t('ui.actionMessage.operationSuccess'));
64 } finally { 61 } finally {
65 modalApi.unlock(); 62 modalApi.unlock();
66 } 63 }
@@ -108,12 +105,12 @@ @@ -108,12 +105,12 @@
108 105
109 <template> 106 <template>
110 <Modal :title="getTitle"> 107 <Modal :title="getTitle">
111 - <Form 108 + <el-form
112 ref="formRef" 109 ref="formRef"
113 :model="formData" 110 :model="formData"
114 :rules="rules" 111 :rules="rules"
115 - :label-col="{ span: 5 }"  
116 - :wrapper-col="{ span: 18 }" 112 + label-width="120px"
  113 + label-position="right"
117 > 114 >
118 #foreach($column in $subColumns) 115 #foreach($column in $subColumns)
119 #if ($column.createOperation || $column.updateOperation) 116 #if ($column.createOperation || $column.updateOperation)
@@ -129,84 +126,83 @@ @@ -129,84 +126,83 @@
129 #set ($dictMethod = "boolean") 126 #set ($dictMethod = "boolean")
130 #end 127 #end
131 #if ($column.htmlType == "input" && !$column.primaryKey)## 忽略主键，不用在表单里 128 #if ($column.htmlType == "input" && !$column.primaryKey)## 忽略主键，不用在表单里
132 - <Form.Item label="${comment}" name="${javaField}">  
133 - <Input v-model:value="formData.${javaField}" placeholder="请输入${comment}" />  
134 - </Form.Item> 129 + <el-form-item label="${comment}" prop="${javaField}">
  130 + <el-input v-model="formData.${javaField}" placeholder="请输入${comment}" />
  131 + </el-form-item>
135 #elseif($column.htmlType == "imageUpload")## 图片上传 132 #elseif($column.htmlType == "imageUpload")## 图片上传
136 - <Form.Item label="${comment}" name="${javaField}">  
137 - <ImageUpload v-model:value="formData.${javaField}" />  
138 - </Form.Item> 133 + <el-form-item label="${comment}" prop="${javaField}">
  134 + <ImageUpload v-model="formData.${javaField}" />
  135 + </el-form-item>
139 #elseif($column.htmlType == "fileUpload")## 文件上传 136 #elseif($column.htmlType == "fileUpload")## 文件上传
140 - <Form.Item label="${comment}" name="${javaField}">  
141 - <FileUpload v-model:value="formData.${javaField}" />  
142 - </Form.Item> 137 + <el-form-item label="${comment}" prop="${javaField}">
  138 + <FileUpload v-model="formData.${javaField}" />
  139 + </el-form-item>
143 #elseif($column.htmlType == "editor")## 文本编辑器 140 #elseif($column.htmlType == "editor")## 文本编辑器
144 - <Form.Item label="${comment}" name="${javaField}"> 141 + <el-form-item label="${comment}" prop="${javaField}">
145 <RichTextarea v-model="formData.${javaField}" height="500px" /> 142 <RichTextarea v-model="formData.${javaField}" height="500px" />
146 - </Form.Item> 143 + </el-form-item>
147 #elseif($column.htmlType == "select")## 下拉框 144 #elseif($column.htmlType == "select")## 下拉框
148 - <Form.Item label="${comment}" name="${javaField}">  
149 - <Select v-model:value="formData.${javaField}" placeholder="请选择${comment}"> 145 + <el-form-item label="${comment}" prop="${javaField}">
  146 + <el-select v-model="formData.${javaField}" placeholder="请选择${comment}">
150 #if ("" != $dictType)## 有数据字典 147 #if ("" != $dictType)## 有数据字典
151 - <Select.Option 148 + <el-option
152 v-for="dict in getDictOptions(DICT_TYPE.$dictType.toUpperCase(), '$dictMethod')" 149 v-for="dict in getDictOptions(DICT_TYPE.$dictType.toUpperCase(), '$dictMethod')"
153 :key="dict.value" 150 :key="dict.value"
154 :value="dict.value" 151 :value="dict.value"
155 - >  
156 - {{ dict.label }}  
157 - </Select.Option> 152 + :label="dict.label"
  153 + />
158 #else##没数据字典 154 #else##没数据字典
159 - <Select.Option label="请选择字典生成" value="" /> 155 + <el-option label="请选择字典生成" value="" />
160 #end 156 #end
161 - </Select>  
162 - </Form.Item> 157 + </el-select>
  158 + </el-form-item>
163 #elseif($column.htmlType == "checkbox")## 多选框 159 #elseif($column.htmlType == "checkbox")## 多选框
164 - <Form.Item label="${comment}" name="${javaField}">  
165 - <CheckboxGroup v-model:value="formData.${javaField}"> 160 + <el-form-item label="${comment}" prop="${javaField}">
  161 + <el-checkbox-group v-model="formData.${javaField}">
166 #if ("" != $dictType)## 有数据字典 162 #if ("" != $dictType)## 有数据字典
167 - <Checkbox 163 + <el-checkbox
168 v-for="dict in getDictOptions(DICT_TYPE.$dictType.toUpperCase(), '$dictMethod')" 164 v-for="dict in getDictOptions(DICT_TYPE.$dictType.toUpperCase(), '$dictMethod')"
169 :key="dict.value" 165 :key="dict.value"
170 - :value="dict.value" 166 + :label="dict.value"
171 > 167 >
172 {{ dict.label }} 168 {{ dict.label }}
173 - </Checkbox> 169 + </el-checkbox>
174 #else##没数据字典 170 #else##没数据字典
175 - <Checkbox label="请选择字典生成" /> 171 + <el-checkbox label="请选择字典生成" />
176 #end 172 #end
177 - </CheckboxGroup>  
178 - </Form.Item> 173 + </el-checkbox-group>
  174 + </el-form-item>
179 #elseif($column.htmlType == "radio")## 单选框 175 #elseif($column.htmlType == "radio")## 单选框
180 - <Form.Item label="${comment}" name="${javaField}">  
181 - <RadioGroup v-model:value="formData.${javaField}"> 176 + <el-form-item label="${comment}" prop="${javaField}">
  177 + <el-radio-group v-model="formData.${javaField}">
182 #if ("" != $dictType)## 有数据字典 178 #if ("" != $dictType)## 有数据字典
183 - <Radio 179 + <el-radio
184 v-for="dict in getDictOptions(DICT_TYPE.$dictType.toUpperCase(), '$dictMethod')" 180 v-for="dict in getDictOptions(DICT_TYPE.$dictType.toUpperCase(), '$dictMethod')"
185 :key="dict.value" 181 :key="dict.value"
186 - :value="dict.value" 182 + :label="dict.value"
187 > 183 >
188 {{ dict.label }} 184 {{ dict.label }}
189 - </Radio> 185 + </el-radio>
190 #else##没数据字典 186 #else##没数据字典
191 - <Radio value="1">请选择字典生成</Radio> 187 + <el-radio :label="1">请选择字典生成</el-radio>
192 #end 188 #end
193 - </RadioGroup>  
194 - </Form.Item> 189 + </el-radio-group>
  190 + </el-form-item>
195 #elseif($column.htmlType == "datetime")## 时间框 191 #elseif($column.htmlType == "datetime")## 时间框
196 - <Form.Item label="${comment}" name="${javaField}">  
197 - <DatePicker  
198 - v-model:value="formData.${javaField}"  
199 - valueFormat="x" 192 + <el-form-item label="${comment}" prop="${javaField}">
  193 + <el-date-picker
  194 + v-model="formData.${javaField}"
  195 + value-format="x"
200 placeholder="选择${comment}" 196 placeholder="选择${comment}"
201 /> 197 />
202 - </Form.Item> 198 + </el-form-item>
203 #elseif($column.htmlType == "textarea")## 文本框 199 #elseif($column.htmlType == "textarea")## 文本框
204 - <Form.Item label="${comment}" name="${javaField}">  
205 - <Textarea v-model:value="formData.${javaField}" placeholder="请输入${comment}" />  
206 - </Form.Item> 200 + <el-form-item label="${comment}" prop="${javaField}">
  201 + <el-input v-model="formData.${javaField}" type="textarea" placeholder="请输入${comment}" />
  202 + </el-form-item>
207 #end 203 #end
208 #end 204 #end
209 #end 205 #end
210 - </Form> 206 + </el-form>
211 </Modal> 207 </Modal>
212 </template> 208 </template>
yudao-module-infra/src/main/resources/codegen/vue3_vben5_ele/general/views/modules/form_sub_inner.vue.vm
  View file @9b39f86
1 ## 主表的 normal 和 inner 使用相同的 form 表单 1 ## 主表的 normal 和 inner 使用相同的 form 表单
2 -#parse("codegen/vue3_vben5_antd/general/views/modules/form_sub_normal.vue.vm")  
3 \ No newline at end of file 2 \ No newline at end of file
  3 +#parse("codegen/vue3_vben5_ele/general/views/modules/form_sub_normal.vue.vm")
4 \ No newline at end of file 4 \ No newline at end of file
yudao-module-infra/src/main/resources/codegen/vue3_vben5_ele/general/views/modules/form_sub_normal.vue.vm
  View file @9b39f86
@@ -7,8 +7,8 @@ @@ -7,8 +7,8 @@
7 <script lang="ts" setup> 7 <script lang="ts" setup>
8 import type { ${simpleClassName}Api } from '#/api/${table.moduleName}/${simpleClassName_strikeCase}'; 8 import type { ${simpleClassName}Api } from '#/api/${table.moduleName}/${simpleClassName_strikeCase}';
9 9
10 - import { message, Tabs, Form, Input, Textarea,Button, Select, RadioGroup, Radio, CheckboxGroup, Checkbox, DatePicker } from 'ant-design-vue';  
11 - import { computed, ref, h, onMounted,watch,nextTick } from 'vue'; 10 + import { ElMessage, ElTabs, ElTabPane, ElForm, ElFormItem, ElInput, ElButton, ElSelect, ElOption, ElRadioGroup, ElRadio, ElCheckboxGroup, ElCheckbox, ElDatePicker } from 'element-plus';
  11 + import { computed, ref, reactive, h, onMounted,watch,nextTick } from 'vue';
12 import { $t } from '#/locales'; 12 import { $t } from '#/locales';
13 import { DICT_TYPE, getDictOptions } from '#/utils'; 13 import { DICT_TYPE, getDictOptions } from '#/utils';
14 14
@@ -18,7 +18,7 @@ import { Plus } from &quot;@vben/icons&quot;; @@ -18,7 +18,7 @@ import { Plus } from &quot;@vben/icons&quot;;
18 import { VxeColumn, VxeTable } from '#/adapter/vxe-table'; 18 import { VxeColumn, VxeTable } from '#/adapter/vxe-table';
19 import { get${subSimpleClassName}ListBy${SubJoinColumnName} } from '#/api/${table.moduleName}/${simpleClassName_strikeCase}'; 19 import { get${subSimpleClassName}ListBy${SubJoinColumnName} } from '#/api/${table.moduleName}/${simpleClassName_strikeCase}';
20 #else 20 #else
21 -import type { Rule } from 'ant-design-vue/es/form'; 21 +import type { FormRules } from 'element-plus';
22 import { Tinymce as RichTextarea } from '#/components/tinymce'; 22 import { Tinymce as RichTextarea } from '#/components/tinymce';
23 import { get${subSimpleClassName}By${SubJoinColumnName} } from '#/api/${table.moduleName}/${simpleClassName_strikeCase}'; 23 import { get${subSimpleClassName}By${SubJoinColumnName} } from '#/api/${table.moduleName}/${simpleClassName_strikeCase}';
24 #end 24 #end
@@ -76,14 +76,14 @@ const formData = ref&lt;Partial&lt;${simpleClassName}Api.${subSimpleClassName}&gt;&gt;({ @@ -76,14 +76,14 @@ const formData = ref&lt;Partial&lt;${simpleClassName}Api.${subSimpleClassName}&gt;&gt;({
76 #end 76 #end
77 #end 77 #end
78 }); 78 });
79 -const rules: Record<string, Rule[]> = { 79 +const rules = reactive<FormRules>({
80 #foreach ($column in $subColumns) 80 #foreach ($column in $subColumns)
81 #if (($column.createOperation || $column.updateOperation) && !$column.nullable && !${column.primaryKey})## 创建或者更新操作 && 要求非空 && 非主键 81 #if (($column.createOperation || $column.updateOperation) && !$column.nullable && !${column.primaryKey})## 创建或者更新操作 && 要求非空 && 非主键
82 #set($comment=$column.columnComment) 82 #set($comment=$column.columnComment)
83 $column.javaField: [{ required: true, message: '${comment}不能为空', trigger: #if($column.htmlType == 'select')'change'#else'blur'#end }], 83 $column.javaField: [{ required: true, message: '${comment}不能为空', trigger: #if($column.htmlType == 'select')'change'#else'blur'#end }],
84 #end 84 #end
85 #end 85 #end
86 -}; 86 +});
87 /** 暴露出表单校验方法和表单值获取方法 */ 87 /** 暴露出表单校验方法和表单值获取方法 */
88 defineExpose({ 88 defineExpose({
89 validate: async () => await formRef.value?.validate(), 89 validate: async () => await formRef.value?.validate(),
@@ -124,90 +124,89 @@ watch( @@ -124,90 +124,89 @@ watch(
124 #elseif ($column.htmlType == "input" && !$column.primaryKey)## 忽略主键，不用在表单里 124 #elseif ($column.htmlType == "input" && !$column.primaryKey)## 忽略主键，不用在表单里
125 <vxe-column field="${javaField}" title="${comment}" align="center"> 125 <vxe-column field="${javaField}" title="${comment}" align="center">
126 <template #default="{row}"> 126 <template #default="{row}">
127 - <Input v-model:value="row.${javaField}" /> 127 + <el-input v-model="row.${javaField}" />
128 </template> 128 </template>
129 </vxe-column> 129 </vxe-column>
130 #elseif($column.htmlType == "imageUpload")## 图片上传 130 #elseif($column.htmlType == "imageUpload")## 图片上传
131 <vxe-column field="${javaField}" title="${comment}" align="center"> 131 <vxe-column field="${javaField}" title="${comment}" align="center">
132 <template #default="{row}"> 132 <template #default="{row}">
133 - <ImageUpload v-model:value="row.${javaField}" /> 133 + <ImageUpload v-model="row.${javaField}" />
134 </template> 134 </template>
135 </vxe-column> 135 </vxe-column>
136 #elseif($column.htmlType == "fileUpload")## 文件上传 136 #elseif($column.htmlType == "fileUpload")## 文件上传
137 <vxe-column field="${javaField}" title="${comment}" align="center"> 137 <vxe-column field="${javaField}" title="${comment}" align="center">
138 <template #default="{row}"> 138 <template #default="{row}">
139 - <FileUpload v-model:value="row.${javaField}" /> 139 + <FileUpload v-model="row.${javaField}" />
140 </template> 140 </template>
141 </vxe-column> 141 </vxe-column>
142 #elseif($column.htmlType == "select")## 下拉框 142 #elseif($column.htmlType == "select")## 下拉框
143 <vxe-column field="${javaField}" title="${comment}" align="center"> 143 <vxe-column field="${javaField}" title="${comment}" align="center">
144 <template #default="{row}"> 144 <template #default="{row}">
145 - <Select v-model:value="row.${javaField}" placeholder="请选择${comment}"> 145 + <el-select v-model="row.${javaField}" placeholder="请选择${comment}">
146 #if ("" != $dictType)## 有数据字典 146 #if ("" != $dictType)## 有数据字典
147 - <Select.Option 147 + <el-option
148 v-for="dict in getDictOptions(DICT_TYPE.$dictType.toUpperCase(), '$dictMethod')" 148 v-for="dict in getDictOptions(DICT_TYPE.$dictType.toUpperCase(), '$dictMethod')"
149 :key="dict.value" 149 :key="dict.value"
150 :value="dict.value" 150 :value="dict.value"
151 - >  
152 - {{ dict.label }}  
153 - </Select.Option> 151 + :label="dict.label"
  152 + />
154 #else##没数据字典 153 #else##没数据字典
155 - <Select.Option label="请选择字典生成" value="" /> 154 + <el-option label="请选择字典生成" value="" />
156 #end 155 #end
157 - </Select> 156 + </el-select>
158 </template> 157 </template>
159 </vxe-column> 158 </vxe-column>
160 #elseif($column.htmlType == "checkbox")## 多选框 159 #elseif($column.htmlType == "checkbox")## 多选框
161 <vxe-column field="${javaField}" title="${comment}" align="center"> 160 <vxe-column field="${javaField}" title="${comment}" align="center">
162 <template #default="{row}"> 161 <template #default="{row}">
163 - <CheckboxGroup v-model:value="row.${javaField}"> 162 + <el-checkbox-group v-model="row.${javaField}">
164 #if ("" != $dictType)## 有数据字典 163 #if ("" != $dictType)## 有数据字典
165 - <Checkbox 164 + <el-checkbox
166 v-for="dict in getDictOptions(DICT_TYPE.$dictType.toUpperCase(), '$dictMethod')" 165 v-for="dict in getDictOptions(DICT_TYPE.$dictType.toUpperCase(), '$dictMethod')"
167 :key="dict.value" 166 :key="dict.value"
168 - :value="dict.value" 167 + :label="dict.value"
169 > 168 >
170 {{ dict.label }} 169 {{ dict.label }}
171 - </Checkbox> 170 + </el-checkbox>
172 #else##没数据字典 171 #else##没数据字典
173 - <Checkbox label="请选择字典生成" /> 172 + <el-checkbox label="请选择字典生成" />
174 #end 173 #end
175 - </CheckboxGroup> 174 + </el-checkbox-group>
176 </template> 175 </template>
177 </vxe-column> 176 </vxe-column>
178 #elseif($column.htmlType == "radio")## 单选框 177 #elseif($column.htmlType == "radio")## 单选框
179 <vxe-column field="${javaField}" title="${comment}" align="center"> 178 <vxe-column field="${javaField}" title="${comment}" align="center">
180 <template #default="{row}"> 179 <template #default="{row}">
181 - <RadioGroup v-model:value="row.${javaField}"> 180 + <el-radio-group v-model="row.${javaField}">
182 #if ("" != $dictType)## 有数据字典 181 #if ("" != $dictType)## 有数据字典
183 - <Radio 182 + <el-radio
184 v-for="dict in getDictOptions(DICT_TYPE.$dictType.toUpperCase(), '$dictMethod')" 183 v-for="dict in getDictOptions(DICT_TYPE.$dictType.toUpperCase(), '$dictMethod')"
185 :key="dict.value" 184 :key="dict.value"
186 - :value="dict.value" 185 + :label="dict.value"
187 > 186 >
188 {{ dict.label }} 187 {{ dict.label }}
189 - </Radio> 188 + </el-radio>
190 #else##没数据字典 189 #else##没数据字典
191 - <Radio value="1">请选择字典生成</Radio> 190 + <el-radio :label="1">请选择字典生成</el-radio>
192 #end 191 #end
193 - </RadioGroup> 192 + </el-radio-group>
194 </template> 193 </template>
195 </vxe-column> 194 </vxe-column>
196 #elseif($column.htmlType == "datetime")## 时间框 195 #elseif($column.htmlType == "datetime")## 时间框
197 <vxe-column field="${javaField}" title="${comment}" align="center"> 196 <vxe-column field="${javaField}" title="${comment}" align="center">
198 <template #default="{row}"> 197 <template #default="{row}">
199 - <DatePicker  
200 - v-model:value="row.${javaField}"  
201 - :showTime="true" 198 + <el-date-picker
  199 + v-model="row.${javaField}"
  200 + type="datetime"
  201 + value-format="x"
202 format="YYYY-MM-DD HH:mm:ss" 202 format="YYYY-MM-DD HH:mm:ss"
203 - valueFormat='x'  
204 /> 203 />
205 </template> 204 </template>
206 </vxe-column> 205 </vxe-column>
207 #elseif($column.htmlType == "textarea" || $column.htmlType == "editor")## 文本框 206 #elseif($column.htmlType == "textarea" || $column.htmlType == "editor")## 文本框
208 <vxe-column field="${javaField}" title="${comment}" align="center"> 207 <vxe-column field="${javaField}" title="${comment}" align="center">
209 <template #default="{row}"> 208 <template #default="{row}">
210 - <Textarea v-model:value="row.${javaField}" /> 209 + <el-input v-model="row.${javaField}" type="textarea" />
211 </template> 210 </template>
212 </vxe-column> 211 </vxe-column>
213 #end 212 #end
@@ -215,31 +214,31 @@ watch( @@ -215,31 +214,31 @@ watch(
215 #end 214 #end
216 <vxe-column field="operation" title="操作" align="center"> 215 <vxe-column field="operation" title="操作" align="center">
217 <template #default="{row}"> 216 <template #default="{row}">
218 - <Button 217 + <el-button
219 size="small" 218 size="small"
220 - type="link"  
221 - danger 219 + type="danger"
  220 + link
222 @click="onDelete(row as any)" 221 @click="onDelete(row as any)"
223 v-access:code="['${permissionPrefix}:delete']" 222 v-access:code="['${permissionPrefix}:delete']"
224 > 223 >
225 {{ $t('ui.actionTitle.delete') }} 224 {{ $t('ui.actionTitle.delete') }}
226 - </Button> 225 + </el-button>
227 </template> 226 </template>
228 </vxe-column> 227 </vxe-column>
229 </vxe-table> 228 </vxe-table>
230 <div class="flex justify-center mt-4"> 229 <div class="flex justify-center mt-4">
231 - <Button :icon="h(Plus)" type="primary" ghost @click="onAdd" v-access:code="['${permissionPrefix}:create']"> 230 + <el-button :icon="h(Plus)" type="primary" plain @click="onAdd" v-access:code="['${permissionPrefix}:create']">
232 {{ $t('ui.actionTitle.create', ['${subTable.classComment}']) }} 231 {{ $t('ui.actionTitle.create', ['${subTable.classComment}']) }}
233 - </Button> 232 + </el-button>
234 </div> 233 </div>
235 #else 234 #else
236 - <Form 235 + <el-form
237 ref="formRef" 236 ref="formRef"
238 class="mx-4" 237 class="mx-4"
239 :model="formData" 238 :model="formData"
240 :rules="rules" 239 :rules="rules"
241 - :label-col="{ span: 5 }"  
242 - :wrapper-col="{ span: 18 }" 240 + label-width="120px"
  241 + label-position="right"
243 > 242 >
244 #foreach($column in $subColumns) 243 #foreach($column in $subColumns)
245 #if ($column.createOperation || $column.updateOperation) 244 #if ($column.createOperation || $column.updateOperation)
@@ -255,84 +254,83 @@ watch( @@ -255,84 +254,83 @@ watch(
255 #set ($dictMethod = "boolean") 254 #set ($dictMethod = "boolean")
256 #end 255 #end
257 #if ($column.htmlType == "input" && !$column.primaryKey)## 忽略主键，不用在表单里 256 #if ($column.htmlType == "input" && !$column.primaryKey)## 忽略主键，不用在表单里
258 - <Form.Item label="${comment}" name="${javaField}">  
259 - <Input v-model:value="formData.${javaField}" placeholder="请输入${comment}" />  
260 - </Form.Item> 257 + <el-form-item label="${comment}" prop="${javaField}">
  258 + <el-input v-model="formData.${javaField}" placeholder="请输入${comment}" />
  259 + </el-form-item>
261 #elseif($column.htmlType == "imageUpload")## 图片上传 260 #elseif($column.htmlType == "imageUpload")## 图片上传
262 - <Form.Item label="${comment}" name="${javaField}">  
263 - <ImageUpload v-model:value="formData.${javaField}" />  
264 - </Form.Item> 261 + <el-form-item label="${comment}" prop="${javaField}">
  262 + <ImageUpload v-model="formData.${javaField}" />
  263 + </el-form-item>
265 #elseif($column.htmlType == "fileUpload")## 文件上传 264 #elseif($column.htmlType == "fileUpload")## 文件上传
266 - <Form.Item label="${comment}" name="${javaField}">  
267 - <FileUpload v-model:value="formData.${javaField}" />  
268 - </Form.Item> 265 + <el-form-item label="${comment}" prop="${javaField}">
  266 + <FileUpload v-model="formData.${javaField}" />
  267 + </el-form-item>
269 #elseif($column.htmlType == "editor")## 文本编辑器 268 #elseif($column.htmlType == "editor")## 文本编辑器
270 - <Form.Item label="${comment}" name="${javaField}"> 269 + <el-form-item label="${comment}" prop="${javaField}">
271 <RichTextarea v-model="formData.${javaField}" height="500px" /> 270 <RichTextarea v-model="formData.${javaField}" height="500px" />
272 - </Form.Item> 271 + </el-form-item>
273 #elseif($column.htmlType == "select")## 下拉框 272 #elseif($column.htmlType == "select")## 下拉框
274 - <Form.Item label="${comment}" name="${javaField}">  
275 - <Select v-model:value="formData.${javaField}" placeholder="请选择${comment}"> 273 + <el-form-item label="${comment}" prop="${javaField}">
  274 + <el-select v-model="formData.${javaField}" placeholder="请选择${comment}">
276 #if ("" != $dictType)## 有数据字典 275 #if ("" != $dictType)## 有数据字典
277 - <Select.Option 276 + <el-option
278 v-for="dict in getDictOptions(DICT_TYPE.$dictType.toUpperCase(), '$dictMethod')" 277 v-for="dict in getDictOptions(DICT_TYPE.$dictType.toUpperCase(), '$dictMethod')"
279 :key="dict.value" 278 :key="dict.value"
280 :value="dict.value" 279 :value="dict.value"
281 - >  
282 - {{ dict.label }}  
283 - </Select.Option> 280 + :label="dict.label"
  281 + />
284 #else##没数据字典 282 #else##没数据字典
285 - <Select.Option label="请选择字典生成" value="" /> 283 + <el-option label="请选择字典生成" value="" />
286 #end 284 #end
287 - </Select>  
288 - </Form.Item> 285 + </el-select>
  286 + </el-form-item>
289 #elseif($column.htmlType == "checkbox")## 多选框 287 #elseif($column.htmlType == "checkbox")## 多选框
290 - <Form.Item label="${comment}" name="${javaField}">  
291 - <CheckboxGroup v-model:value="formData.${javaField}"> 288 + <el-form-item label="${comment}" prop="${javaField}">
  289 + <el-checkbox-group v-model="formData.${javaField}">
292 #if ("" != $dictType)## 有数据字典 290 #if ("" != $dictType)## 有数据字典
293 - <Checkbox 291 + <el-checkbox
294 v-for="dict in getDictOptions(DICT_TYPE.$dictType.toUpperCase(), '$dictMethod')" 292 v-for="dict in getDictOptions(DICT_TYPE.$dictType.toUpperCase(), '$dictMethod')"
295 :key="dict.value" 293 :key="dict.value"
296 - :value="dict.value" 294 + :label="dict.value"
297 > 295 >
298 {{ dict.label }} 296 {{ dict.label }}
299 - </Checkbox> 297 + </el-checkbox>
300 #else##没数据字典 298 #else##没数据字典
301 - <Checkbox label="请选择字典生成" /> 299 + <el-checkbox label="请选择字典生成" />
302 #end 300 #end
303 - </CheckboxGroup>  
304 - </Form.Item> 301 + </el-checkbox-group>
  302 + </el-form-item>
305 #elseif($column.htmlType == "radio")## 单选框 303 #elseif($column.htmlType == "radio")## 单选框
306 - <Form.Item label="${comment}" name="${javaField}">  
307 - <RadioGroup v-model:value="formData.${javaField}"> 304 + <el-form-item label="${comment}" prop="${javaField}">
  305 + <el-radio-group v-model="formData.${javaField}">
308 #if ("" != $dictType)## 有数据字典 306 #if ("" != $dictType)## 有数据字典
309 - <Radio 307 + <el-radio
310 v-for="dict in getDictOptions(DICT_TYPE.$dictType.toUpperCase(), '$dictMethod')" 308 v-for="dict in getDictOptions(DICT_TYPE.$dictType.toUpperCase(), '$dictMethod')"
311 :key="dict.value" 309 :key="dict.value"
312 - :value="dict.value" 310 + :label="dict.value"
313 > 311 >
314 {{ dict.label }} 312 {{ dict.label }}
315 - </Radio> 313 + </el-radio>
316 #else##没数据字典 314 #else##没数据字典
317 - <Radio value="1">请选择字典生成</Radio> 315 + <el-radio :label="1">请选择字典生成</el-radio>
318 #end 316 #end
319 - </RadioGroup>  
320 - </Form.Item> 317 + </el-radio-group>
  318 + </el-form-item>
321 #elseif($column.htmlType == "datetime")## 时间框 319 #elseif($column.htmlType == "datetime")## 时间框
322 - <Form.Item label="${comment}" name="${javaField}">  
323 - <DatePicker  
324 - v-model:value="formData.${javaField}"  
325 - valueFormat="x" 320 + <el-form-item label="${comment}" prop="${javaField}">
  321 + <el-date-picker
  322 + v-model="formData.${javaField}"
  323 + value-format="x"
326 placeholder="选择${comment}" 324 placeholder="选择${comment}"
327 /> 325 />
328 - </Form.Item> 326 + </el-form-item>
329 #elseif($column.htmlType == "textarea")## 文本框 327 #elseif($column.htmlType == "textarea")## 文本框
330 - <Form.Item label="${comment}" name="${javaField}">  
331 - <Textarea v-model:value="formData.${javaField}" placeholder="请输入${comment}" />  
332 - </Form.Item> 328 + <el-form-item label="${comment}" prop="${javaField}">
  329 + <el-input v-model="formData.${javaField}" type="textarea" placeholder="请输入${comment}" />
  330 + </el-form-item>
333 #end 331 #end
334 #end 332 #end
335 #end 333 #end
336 - </Form> 334 + </el-form>
337 #end 335 #end
338 </template> 336 </template>
yudao-module-infra/src/main/resources/codegen/vue3_vben5_ele/general/views/modules/list_sub_erp.vue.vm
  View file @9b39f86
@@ -21,7 +21,7 @@ @@ -21,7 +21,7 @@
21 import ${subSimpleClassName}Form from './${subSimpleClassName_strikeCase}-form.vue' 21 import ${subSimpleClassName}Form from './${subSimpleClassName_strikeCase}-form.vue'
22 import { Tinymce as RichTextarea } from '#/components/tinymce'; 22 import { Tinymce as RichTextarea } from '#/components/tinymce';
23 import { ImageUpload, FileUpload } from "#/components/upload"; 23 import { ImageUpload, FileUpload } from "#/components/upload";
24 - import { message,Button, Tabs,Pagination, Form, Input, Textarea, Select, RadioGroup, Radio, CheckboxGroup, Checkbox,RangePicker, DatePicker, TreeSelect } from 'ant-design-vue'; 24 + import { ElMessage, ElLoading, ElButton, ElTabs, ElTabPane, ElPagination, ElForm, ElFormItem, ElDatePicker, ElSelect, ElOption, ElInput } from 'element-plus';
25 import { Plus, Trash2 } from '@vben/icons'; 25 import { Plus, Trash2 } from '@vben/icons';
26 import { $t } from '#/locales'; 26 import { $t } from '#/locales';
27 import { TableToolbar } from '#/components/table-toolbar'; 27 import { TableToolbar } from '#/components/table-toolbar';
@@ -29,7 +29,7 @@ @@ -29,7 +29,7 @@
29 #end 29 #end
30 30
31 #if ($table.templateType == 11) ## erp 31 #if ($table.templateType == 11) ## erp
32 - import { delete${subSimpleClassName},#if ($deleteBatchEnable) delete${subSimpleClassName}List,#end get${subSimpleClassName}Page } from '#/api/${table.moduleName}/${table.businessName}'; 32 + import { delete${subSimpleClassName},#if ($deleteBatchEnable) delete${subSimpleClassName}List,#end get${subSimpleClassName}Page } from '#/api/${table.moduleName}/${simpleClassName_strikeCase}';
33 import { isEmpty } from '@vben/utils'; 33 import { isEmpty } from '@vben/utils';
34 #else 34 #else
35 #if ($subTable.subJoinMany) ## 一对多 35 #if ($subTable.subJoinMany) ## 一对多
@@ -52,7 +52,7 @@ const props = defineProps&lt;{ @@ -52,7 +52,7 @@ const props = defineProps&lt;{
52 /** 创建${subTable.classComment} */ 52 /** 创建${subTable.classComment} */
53 function handleCreate() { 53 function handleCreate() {
54 if (!props.${subJoinColumn.javaField}){ 54 if (!props.${subJoinColumn.javaField}){
55 - message.warning("请先选择一个${table.classComment}!") 55 + ElMessage.warning("请先选择一个${table.classComment}!")
56 return 56 return
57 } 57 }
58 formModalApi.setData({${subJoinColumn.javaField}: props.${subJoinColumn.javaField}}).open(); 58 formModalApi.setData({${subJoinColumn.javaField}: props.${subJoinColumn.javaField}}).open();
@@ -65,37 +65,32 @@ function handleEdit(row: ${simpleClassName}Api.${subSimpleClassName}) { @@ -65,37 +65,32 @@ function handleEdit(row: ${simpleClassName}Api.${subSimpleClassName}) {
65 65
66 /** 删除${subTable.classComment} */ 66 /** 删除${subTable.classComment} */
67 async function handleDelete(row: ${simpleClassName}Api.${subSimpleClassName}) { 67 async function handleDelete(row: ${simpleClassName}Api.${subSimpleClassName}) {
68 - const hideLoading = message.loading({  
69 - content: $t('ui.actionMessage.deleting', [row.id]),  
70 - duration: 0,  
71 - key: 'action_process_msg', 68 + const loadingInstance = ElLoading.service({
  69 + text: $t('ui.actionMessage.deleting', [row.id]),
  70 + background: 'rgba(0, 0, 0, 0.7)',
72 }); 71 });
73 try { 72 try {
74 await delete${subSimpleClassName}(row.id as number); 73 await delete${subSimpleClassName}(row.id as number);
75 - message.success({  
76 - content: $t('ui.actionMessage.deleteSuccess', [row.id]),  
77 - key: 'action_process_msg',  
78 - }); 74 + ElMessage.success($t('ui.actionMessage.deleteSuccess', [row.id]));
79 await getList(); 75 await getList();
80 } finally { 76 } finally {
81 - hideLoading(); 77 + loadingInstance.close();
82 } 78 }
83 } 79 }
84 80
85 #if ($deleteBatchEnable) 81 #if ($deleteBatchEnable)
86 /** 批量删除${subTable.classComment} */ 82 /** 批量删除${subTable.classComment} */
87 async function handleDeleteBatch() { 83 async function handleDeleteBatch() {
88 - const hideLoading = message.loading({  
89 - content: $t('ui.actionMessage.deleting'),  
90 - duration: 0,  
91 - key: 'action_process_msg', 84 + const loadingInstance = ElLoading.service({
  85 + text: $t('ui.actionMessage.deleting'),
  86 + background: 'rgba(0, 0, 0, 0.7)',
92 }); 87 });
93 try { 88 try {
94 await delete${subSimpleClassName}List(checkedIds.value); 89 await delete${subSimpleClassName}List(checkedIds.value);
95 - message.success( $t('ui.actionMessage.deleteSuccess') ); 90 + ElMessage.success($t('ui.actionMessage.deleteSuccess'));
96 await getList(); 91 await getList();
97 } finally { 92 } finally {
98 - hideLoading(); 93 + loadingInstance.close();
99 } 94 }
100 } 95 }
101 96
@@ -207,10 +202,10 @@ onMounted(() =&gt; { @@ -207,10 +202,10 @@ onMounted(() =&gt; {
207 <div class="h-[600px]"> 202 <div class="h-[600px]">
208 <ContentWrap v-if="!hiddenSearchBar"> 203 <ContentWrap v-if="!hiddenSearchBar">
209 <!-- 搜索工作栏 --> 204 <!-- 搜索工作栏 -->
210 - <Form 205 + <el-form
211 :model="queryParams" 206 :model="queryParams"
212 ref="queryFormRef" 207 ref="queryFormRef"
213 - layout="inline" 208 + inline
214 > 209 >
215 #foreach($column in $subColumns) 210 #foreach($column in $subColumns)
216 #if ($column.listOperation) 211 #if ($column.listOperation)
@@ -226,66 +221,69 @@ onMounted(() =&gt; { @@ -226,66 +221,69 @@ onMounted(() =&gt; {
226 #set ($dictMethod = "boolean") 221 #set ($dictMethod = "boolean")
227 #end 222 #end
228 #if ($column.htmlType == "input") 223 #if ($column.htmlType == "input")
229 - <Form.Item label="${comment}" name="${javaField}">  
230 - <Input  
231 - v-model:value="queryParams.${javaField}" 224 + <el-form-item label="${comment}">
  225 + <el-input
  226 + v-model="queryParams.${javaField}"
232 placeholder="请输入${comment}" 227 placeholder="请输入${comment}"
233 - allowClear  
234 - @pressEnter="handleQuery"  
235 - class="w-full" 228 + clearable
  229 + @keyup.enter="handleQuery"
  230 + class="!w-[240px]"
236 /> 231 />
237 - </Form.Item> 232 + </el-form-item>
238 #elseif ($column.htmlType == "select" || $column.htmlType == "radio" || $column.htmlType == "checkbox") 233 #elseif ($column.htmlType == "select" || $column.htmlType == "radio" || $column.htmlType == "checkbox")
239 - <Form.Item label="${comment}" name="${javaField}">  
240 - <Select  
241 - v-model:value="queryParams.${javaField}" 234 + <el-form-item label="${comment}">
  235 + <el-select
  236 + v-model="queryParams.${javaField}"
242 placeholder="请选择${comment}" 237 placeholder="请选择${comment}"
243 - allowClear  
244 - class="w-full" 238 + clearable
  239 + class="!w-[240px]"
245 > 240 >
246 #if ("" != $dictType)## 设置了 dictType 数据字典的情况 241 #if ("" != $dictType)## 设置了 dictType 数据字典的情况
247 - <Select.Option 242 + <el-option
248 v-for="dict in getDictOptions(DICT_TYPE.$dictType.toUpperCase(), '$dictMethod')" 243 v-for="dict in getDictOptions(DICT_TYPE.$dictType.toUpperCase(), '$dictMethod')"
249 :key="dict.value" 244 :key="dict.value"
250 :value="dict.value" 245 :value="dict.value"
251 - >  
252 - {{ dict.label }}  
253 - </Select.Option> 246 + :label="dict.label"
  247 + />
254 #else## 未设置 dictType 数据字典的情况 248 #else## 未设置 dictType 数据字典的情况
255 - <Select.Option label="请选择字典生成" value="" /> 249 + <el-option label="请选择字典生成" value="" />
256 #end 250 #end
257 - </Select>  
258 - </Form.Item> 251 + </el-select>
  252 + </el-form-item>
259 #elseif($column.htmlType == "datetime") 253 #elseif($column.htmlType == "datetime")
260 #if ($column.listOperationCondition != "BETWEEN")## 非范围 254 #if ($column.listOperationCondition != "BETWEEN")## 非范围
261 - <Form.Item label="${comment}" name="${javaField}">  
262 - <DatePicker  
263 - v-model:value="queryParams.${javaField}"  
264 - valueFormat="YYYY-MM-DD" 255 + <el-form-item label="${comment}">
  256 + <el-date-picker
  257 + v-model="queryParams.${javaField}"
  258 + value-format="YYYY-MM-DD"
265 placeholder="选择${comment}" 259 placeholder="选择${comment}"
266 - allowClear  
267 - class="w-full" 260 + clearable
  261 + class="!w-[240px]"
268 /> 262 />
269 - </Form.Item> 263 + </el-form-item>
270 #else## 范围 264 #else## 范围
271 - <Form.Item label="${comment}" name="${javaField}">  
272 - <RangePicker  
273 - v-model:value="queryParams.${javaField}"  
274 - v-bind="getRangePickerDefaultProps()"  
275 - class="w-full" 265 + <el-form-item label="${comment}">
  266 + <el-date-picker
  267 + v-model="queryParams.${javaField}"
  268 + type="daterange"
  269 + value-format="YYYY-MM-DD"
  270 + range-separator="至"
  271 + start-placeholder="开始日期"
  272 + end-placeholder="结束日期"
  273 + class="!w-[240px]"
276 /> 274 />
277 - </Form.Item> 275 + </el-form-item>
278 #end 276 #end
279 #end 277 #end
280 #end 278 #end
281 #end 279 #end
282 - <Form.Item>  
283 - <Button class="ml-2" @click="resetQuery"> 重置 </Button>  
284 - <Button class="ml-2" @click="handleQuery" type="primary"> 280 + <el-form-item>
  281 + <el-button class="ml-2" @click="resetQuery"> 重置 </el-button>
  282 + <el-button class="ml-2" @click="handleQuery" type="primary">
285 搜索 283 搜索
286 - </Button>  
287 - </Form.Item>  
288 - </Form> 284 + </el-button>
  285 + </el-form-item>
  286 + </el-form>
289 </ContentWrap> 287 </ContentWrap>
290 288
291 <!-- 列表 --> 289 <!-- 列表 -->
@@ -295,7 +293,7 @@ onMounted(() =&gt; { @@ -295,7 +293,7 @@ onMounted(() =&gt; {
295 ref="tableToolbarRef" 293 ref="tableToolbarRef"
296 v-model:hidden-search="hiddenSearchBar" 294 v-model:hidden-search="hiddenSearchBar"
297 > 295 >
298 - <Button 296 + <el-button
299 class="ml-2" 297 class="ml-2"
300 :icon="h(Plus)" 298 :icon="h(Plus)"
301 type="primary" 299 type="primary"
@@ -303,19 +301,18 @@ onMounted(() =&gt; { @@ -303,19 +301,18 @@ onMounted(() =&gt; {
303 v-access:code="['${permissionPrefix}:create']" 301 v-access:code="['${permissionPrefix}:create']"
304 > 302 >
305 {{ $t('ui.actionTitle.create', ['${table.classComment}']) }} 303 {{ $t('ui.actionTitle.create', ['${table.classComment}']) }}
306 - </Button> 304 + </el-button>
307 #if ($deleteBatchEnable) 305 #if ($deleteBatchEnable)
308 - <Button 306 + <el-button
309 :icon="h(Trash2)" 307 :icon="h(Trash2)"
310 - type="primary"  
311 - danger 308 + type="danger"
312 class="ml-2" 309 class="ml-2"
313 :disabled="isEmpty(checkedIds)" 310 :disabled="isEmpty(checkedIds)"
314 @click="handleDeleteBatch" 311 @click="handleDeleteBatch"
315 v-access:code="['${table.moduleName}:${simpleClassName_strikeCase}:delete']" 312 v-access:code="['${table.moduleName}:${simpleClassName_strikeCase}:delete']"
316 > 313 >
317 批量删除 314 批量删除
318 - </Button> 315 + </el-button>
319 #end 316 #end
320 </TableToolbar> 317 </TableToolbar>
321 </template> 318 </template>
@@ -358,35 +355,38 @@ onMounted(() =&gt; { @@ -358,35 +355,38 @@ onMounted(() =&gt; {
358 #end 355 #end
359 <vxe-column field="operation" title="操作" align="center"> 356 <vxe-column field="operation" title="操作" align="center">
360 <template #default="{row}"> 357 <template #default="{row}">
361 - <Button 358 + <el-button
362 size="small" 359 size="small"
363 - type="link" 360 + type="primary"
  361 + link
364 @click="handleEdit(row as any)" 362 @click="handleEdit(row as any)"
365 v-access:code="['${permissionPrefix}:update']" 363 v-access:code="['${permissionPrefix}:update']"
366 > 364 >
367 {{ $t('ui.actionTitle.edit') }} 365 {{ $t('ui.actionTitle.edit') }}
368 - </Button>  
369 - <Button 366 + </el-button>
  367 + <el-button
370 size="small" 368 size="small"
371 - type="link"  
372 - danger 369 + type="danger"
  370 + link
373 class="ml-2" 371 class="ml-2"
374 @click="handleDelete(row as any)" 372 @click="handleDelete(row as any)"
375 v-access:code="['${permissionPrefix}:delete']" 373 v-access:code="['${permissionPrefix}:delete']"
376 > 374 >
377 {{ $t('ui.actionTitle.delete') }} 375 {{ $t('ui.actionTitle.delete') }}
378 - </Button> 376 + </el-button>
379 </template> 377 </template>
380 </vxe-column> 378 </vxe-column>
381 </vxe-table> 379 </vxe-table>
382 <!-- 分页 --> 380 <!-- 分页 -->
383 <div class="mt-2 flex justify-end"> 381 <div class="mt-2 flex justify-end">
384 - <Pagination 382 + <el-pagination
385 :total="total" 383 :total="total"
386 - v-model:current="queryParams.pageNo" 384 + v-model:current-page="queryParams.pageNo"
387 v-model:page-size="queryParams.pageSize" 385 v-model:page-size="queryParams.pageSize"
388 - show-size-changer  
389 - @change="getList" 386 + :page-sizes="[10, 20, 50, 100]"
  387 + layout="total, sizes, prev, pager, next, jumper"
  388 + @size-change="getList"
  389 + @current-change="getList"
390 /> 390 />
391 </div> 391 </div>
392 </ContentWrap> 392 </ContentWrap>
yudao-module-infra/src/main/resources/codegen/vue3_vben5_ele/general/views/modules/list_sub_inner.vue.vm
  View file @9b39f86
1 ## 子表的 erp 和 inner 使用相似的 list 列表，差异主要两点： 1 ## 子表的 erp 和 inner 使用相似的 list 列表，差异主要两点：
2 ## 1）inner 使用 list 不分页，erp 使用 page 分页 2 ## 1）inner 使用 list 不分页，erp 使用 page 分页
3 ## 2）erp 支持单个子表的新增、修改、删除，inner 不支持 3 ## 2）erp 支持单个子表的新增、修改、删除，inner 不支持
4 -#parse("codegen/vue3_vben5_antd/general/views/modules/list_sub_erp.vue.vm")  
5 \ No newline at end of file 4 \ No newline at end of file
  5 +#parse("codegen/vue3_vben5_ele/general/views/modules/list_sub_erp.vue.vm")
6 \ No newline at end of file 6 \ No newline at end of file