Kaynağa Gözat

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

puhui999 5 ay önce
ebeveyn
işleme
9b39f86718

+ 17 - 0
yudao-module-infra/src/main/java/cn/iocoder/yudao/module/infra/service/codegen/inner/CodegenEngine.java

@@ -201,6 +201,23 @@ public class CodegenEngine {
                     vue3FilePath("views/${table.moduleName}/${table.businessName}/modules/${subSimpleClassName_strikeCase}-list.vue"))
             .put(CodegenFrontTypeEnum.VUE3_VBEN5_EP_SCHEMA.getType(), vue3Vben5EpSchemaTemplatePath("views/modules/list_sub_erp.vue"),  // 特殊:主子表专属逻辑
                     vue3FilePath("views/${table.moduleName}/${table.businessName}/modules/${subSimpleClassName_strikeCase}-list.vue"))
+            // VUE3_VBEN5_EP
+            .put(CodegenFrontTypeEnum.VUE3_VBEN5_EP_GENERAL.getType(), vue3Vben5EpGeneralTemplatePath("views/index.vue"),
+                    vue3FilePath("views/${table.moduleName}/${table.businessName}/index.vue"))
+            .put(CodegenFrontTypeEnum.VUE3_VBEN5_EP_GENERAL.getType(), vue3Vben5EpGeneralTemplatePath("views/form.vue"),
+                    vue3FilePath("views/${table.moduleName}/${table.businessName}/modules/form.vue"))
+            .put(CodegenFrontTypeEnum.VUE3_VBEN5_EP_GENERAL.getType(), vue3Vben5EpGeneralTemplatePath("api/api.ts"),
+                    vue3FilePath("api/${table.moduleName}/${table.businessName}/index.ts"))
+            .put(CodegenFrontTypeEnum.VUE3_VBEN5_EP_GENERAL.getType(), vue3Vben5EpGeneralTemplatePath("views/modules/form_sub_normal.vue"),  // 特殊:主子表专属逻辑
+                    vue3FilePath("views/${table.moduleName}/${table.businessName}/modules/${subSimpleClassName_strikeCase}-form.vue"))
+            .put(CodegenFrontTypeEnum.VUE3_VBEN5_EP_GENERAL.getType(), vue3Vben5EpGeneralTemplatePath("views/modules/form_sub_inner.vue"),  // 特殊:主子表专属逻辑
+                    vue3FilePath("views/${table.moduleName}/${table.businessName}/modules/${subSimpleClassName_strikeCase}-form.vue"))
+            .put(CodegenFrontTypeEnum.VUE3_VBEN5_EP_GENERAL.getType(), vue3Vben5EpGeneralTemplatePath("views/modules/form_sub_erp.vue"),  // 特殊:主子表专属逻辑
+                    vue3FilePath("views/${table.moduleName}/${table.businessName}/modules/${subSimpleClassName_strikeCase}-form.vue"))
+            .put(CodegenFrontTypeEnum.VUE3_VBEN5_EP_GENERAL.getType(), vue3Vben5EpGeneralTemplatePath("views/modules/list_sub_inner.vue"),  // 特殊:主子表专属逻辑
+                    vue3FilePath("views/${table.moduleName}/${table.businessName}/modules/${subSimpleClassName_strikeCase}-list.vue"))
+            .put(CodegenFrontTypeEnum.VUE3_VBEN5_EP_GENERAL.getType(), vue3Vben5EpGeneralTemplatePath("views/modules/list_sub_erp.vue"),  // 特殊:主子表专属逻辑
+                    vue3FilePath("views/${table.moduleName}/${table.businessName}/modules/${subSimpleClassName_strikeCase}-list.vue"))
             .build();
 
     @Resource

+ 68 - 72
yudao-module-infra/src/main/resources/codegen/vue3_vben5_ele/general/views/form.vue.vm

@@ -1,14 +1,14 @@
 <script lang="ts" setup>
 import type { ${simpleClassName}Api } from '#/api/${table.moduleName}/${simpleClassName_strikeCase}';
-import type { Rule } from 'ant-design-vue/es/form';
+import type { FormRules } from 'element-plus';
 
 import { useVbenModal } from '@vben/common-ui';
 import { Tinymce as RichTextarea } from '#/components/tinymce';
 import { ImageUpload, FileUpload } from "#/components/upload";
-import { message, Tabs, Form, Input, Textarea, Select, RadioGroup, Radio, CheckboxGroup, Checkbox, DatePicker, TreeSelect } from 'ant-design-vue';
+import { ElMessage, ElTabs, ElTabPane, ElForm, ElFormItem, ElInput, ElSelect, ElOption, ElRadioGroup, ElRadio, ElCheckboxGroup, ElCheckbox, ElDatePicker, ElTreeSelect } from 'element-plus';
 import { DICT_TYPE, getDictOptions } from '#/utils';
 #if($table.templateType == 2)## 树表需要导入这些
-import { get${simpleClassName}List } from '#/api/${table.moduleName}/${table.businessName}';
+import { get${simpleClassName}List } from '#/api/${table.moduleName}/${simpleClassName_strikeCase}';
 import { handleTree } from '@vben/utils'
 #end
 ## 特殊:主子表专属逻辑
@@ -20,9 +20,9 @@ import { handleTree } from '@vben/utils'
   #end
 #end
 
-import { computed, ref } from 'vue';
+import { computed, ref, reactive } from 'vue';
 import { $t } from '#/locales';
-import { get${simpleClassName}, create${simpleClassName}, update${simpleClassName} } from '#/api/${table.moduleName}/${table.businessName}';
+import { get${simpleClassName}, create${simpleClassName}, update${simpleClassName} } from '#/api/${table.moduleName}/${simpleClassName_strikeCase}';
 
 const emit = defineEmits(['success']);
 
@@ -38,14 +38,14 @@ const formData = ref<Partial<${simpleClassName}Api.${simpleClassName}>>({
   #end
 #end
 });
-const rules: Record<string, Rule[]> = {
+const rules = reactive<FormRules>({
   #foreach ($column in $columns)
     #if (($column.createOperation || $column.updateOperation) && !$column.nullable && !${column.primaryKey})## 创建或者更新操作 && 要求非空 && 非主键
       #set($comment=$column.columnComment)
         $column.javaField: [{ required: true, message: '${comment}不能为空', trigger: #if($column.htmlType == 'select')'change'#else'blur'#end }],
     #end
   #end
-};
+});
 ## 特殊:树表专属逻辑
 #if ( $table.templateType == 2 )
 const ${classNameVar}Tree = ref<any[]>([]) // 树形结构
@@ -145,10 +145,7 @@ const [Modal, modalApi] = useVbenModal({
       // 关闭并提示
       await modalApi.close();
       emit('success');
-      message.success({
-        content: $t('ui.actionMessage.operationSuccess'),
-        key: 'action_process_msg',
-      });
+      ElMessage.success($t('ui.actionMessage.operationSuccess'));
     } finally {
       modalApi.unlock();
     }
@@ -182,12 +179,12 @@ const [Modal, modalApi] = useVbenModal({
 
 <template>
   <Modal :title="getTitle">
-    <Form
+    <el-form
       ref="formRef"
       :model="formData"
       :rules="rules"
-      :label-col="{ span: 5 }"
-      :wrapper-col="{ span: 18 }"
+      label-width="120px"
+      label-position="right"
     >
       #foreach($column in $columns)
         #if ($column.createOperation || $column.updateOperation)
@@ -203,122 +200,121 @@ const [Modal, modalApi] = useVbenModal({
             #set ($dictMethod = "boolean")
           #end
           #if ( $table.templateType == 2 && $column.id == $treeParentColumn.id )
-            <Form.Item label="${comment}" name="${javaField}">
-              <TreeSelect
-                      v-model:value="formData.${javaField}"
-                      :treeData="${classNameVar}Tree"
+            <el-form-item label="${comment}" prop="${javaField}">
+              <el-tree-select
+                      v-model="formData.${javaField}"
+                      :data="${classNameVar}Tree"
                 #if ($treeNameColumn.javaField == "name")
-                      :fieldNames="{
+                      :props="{
             label: 'name',
             value: 'id',
             children: 'children',
           }"
                 #else
-                      :fieldNames="{
+                      :props="{
                         label: '$treeNameColumn.javaField',
                         value: 'id',
                         children: 'children',
                         }"
                 #end
-                      checkable
-                      treeDefaultExpandAll
+                      check-strictly
+                      default-expand-all
                       placeholder="请选择${comment}"
               />
-            </Form.Item>
+            </el-form-item>
           #elseif ($column.htmlType == "input" && !$column.primaryKey)## 忽略主键,不用在表单里
-            <Form.Item label="${comment}" name="${javaField}">
-              <Input v-model:value="formData.${javaField}" placeholder="请输入${comment}" />
-            </Form.Item>
+            <el-form-item label="${comment}" prop="${javaField}">
+              <el-input v-model="formData.${javaField}" placeholder="请输入${comment}" />
+            </el-form-item>
           #elseif($column.htmlType == "imageUpload")## 图片上传
-            <Form.Item label="${comment}" name="${javaField}">
-              <ImageUpload v-model:value="formData.${javaField}" />
-            </Form.Item>
+            <el-form-item label="${comment}" prop="${javaField}">
+              <ImageUpload v-model="formData.${javaField}" />
+            </el-form-item>
           #elseif($column.htmlType == "fileUpload")## 文件上传
-            <Form.Item label="${comment}" name="${javaField}">
-              <FileUpload v-model:value="formData.${javaField}" />
-            </Form.Item>
+            <el-form-item label="${comment}" prop="${javaField}">
+              <FileUpload v-model="formData.${javaField}" />
+            </el-form-item>
           #elseif($column.htmlType == "editor")## 文本编辑器
-            <Form.Item label="${comment}" name="${javaField}">
+            <el-form-item label="${comment}" prop="${javaField}">
               <RichTextarea v-model="formData.${javaField}" height="500px" />
-            </Form.Item>
+            </el-form-item>
           #elseif($column.htmlType == "select")## 下拉框
-            <Form.Item label="${comment}" name="${javaField}">
-              <Select v-model:value="formData.${javaField}" placeholder="请选择${comment}">
+            <el-form-item label="${comment}" prop="${javaField}">
+              <el-select v-model="formData.${javaField}" placeholder="请选择${comment}">
                 #if ("" != $dictType)## 有数据字典
-                  <Select.Option
+                  <el-option
                           v-for="dict in getDictOptions(DICT_TYPE.$dictType.toUpperCase(), '$dictMethod')"
                           :key="dict.value"
                           :value="dict.value"
-                  >
-                    {{ dict.label }}
-                  </Select.Option>
+                          :label="dict.label"
+                  />
                 #else##没数据字典
-                  <Select.Option label="请选择字典生成" value="" />
+                  <el-option label="请选择字典生成" value="" />
                 #end
-              </Select>
-            </Form.Item>
+              </el-select>
+            </el-form-item>
           #elseif($column.htmlType == "checkbox")## 多选框
-            <Form.Item label="${comment}" name="${javaField}">
-              <CheckboxGroup v-model:value="formData.${javaField}">
+            <el-form-item label="${comment}" prop="${javaField}">
+              <el-checkbox-group v-model="formData.${javaField}">
                 #if ("" != $dictType)## 有数据字典
-                  <Checkbox
+                  <el-checkbox
                           v-for="dict in getDictOptions(DICT_TYPE.$dictType.toUpperCase(), '$dictMethod')"
                           :key="dict.value"
-                          :value="dict.value"
+                          :label="dict.value"
                  >
                     {{ dict.label }}
-                  </Checkbox>
+                  </el-checkbox>
                 #else##没数据字典
-                  <Checkbox label="请选择字典生成" />
+                  <el-checkbox label="请选择字典生成" />
                 #end
-              </CheckboxGroup>
-            </Form.Item>
+              </el-checkbox-group>
+            </el-form-item>
           #elseif($column.htmlType == "radio")## 单选框
-            <Form.Item label="${comment}" name="${javaField}">
-              <RadioGroup v-model:value="formData.${javaField}">
+            <el-form-item label="${comment}" prop="${javaField}">
+              <el-radio-group v-model="formData.${javaField}">
                 #if ("" != $dictType)## 有数据字典
-                  <Radio
+                  <el-radio
                           v-for="dict in getDictOptions(DICT_TYPE.$dictType.toUpperCase(), '$dictMethod')"
                           :key="dict.value"
-                          :value="dict.value"
+                          :label="dict.value"
                   >
                     {{ dict.label }}
-                  </Radio>
+                  </el-radio>
                 #else##没数据字典
-                  <Radio value="1">请选择字典生成</Radio>
+                  <el-radio :label="1">请选择字典生成</el-radio>
                 #end
-              </RadioGroup>
-            </Form.Item>
+              </el-radio-group>
+            </el-form-item>
           #elseif($column.htmlType == "datetime")## 时间框
-            <Form.Item label="${comment}" name="${javaField}">
-              <DatePicker
-                      v-model:value="formData.${javaField}"
-                      valueFormat="x"
+            <el-form-item label="${comment}" prop="${javaField}">
+              <el-date-picker
+                      v-model="formData.${javaField}"
+                      value-format="x"
                       placeholder="选择${comment}"
               />
-            </Form.Item>
+            </el-form-item>
           #elseif($column.htmlType == "textarea")## 文本框
-            <Form.Item label="${comment}" name="${javaField}">
-              <Textarea v-model:value="formData.${javaField}" placeholder="请输入${comment}" />
-            </Form.Item>
+            <el-form-item label="${comment}" prop="${javaField}">
+              <el-input v-model="formData.${javaField}" type="textarea" placeholder="请输入${comment}" />
+            </el-form-item>
           #end
         #end
       #end
-    </Form>
+    </el-form>
     ## 特殊:主子表专属逻辑
     #if ( $table.templateType == 10 || $table.templateType == 12 )
       <!-- 子表的表单 -->
-      <Tabs v-model:active-key="subTabsName">
+      <el-tabs v-model="subTabsName">
         #foreach ($subTable in $subTables)
           #set ($index = $foreach.count - 1)
           #set ($subClassNameVar = $subClassNameVars.get($index))
           #set ($subSimpleClassName = $subSimpleClassNames.get($index))
           #set ($subJoinColumn_strikeCase = $subJoinColumn_strikeCases.get($index))
-          <Tabs.TabPane key="$subClassNameVar" tab="${subTable.classComment}" force-render>
+          <el-tab-pane name="$subClassNameVar" label="${subTable.classComment}">
             <${subSimpleClassName}Form ref="${subClassNameVar}FormRef" :${subJoinColumn_strikeCase}="formData?.id" />
-          </Tabs.TabPane>
+          </el-tab-pane>
         #end
-      </Tabs>
+      </el-tabs>
     #end
   </Modal>
 </template>

+ 90 - 89
yudao-module-infra/src/main/resources/codegen/vue3_vben5_ele/general/views/index.vue.vm

@@ -4,7 +4,7 @@ import type { VxeTableInstance } from '#/adapter/vxe-table';
 
 import { Page, useVbenModal } from '@vben/common-ui';
 import { cloneDeep, formatDateTime } from '@vben/utils';
-import { Button, message,Tabs,Pagination,Form,RangePicker,DatePicker,Select,Input } from 'ant-design-vue';
+import { ElButton, ElMessage, ElLoading, ElTabs, ElTabPane, ElPagination, ElForm, ElFormItem, ElDatePicker, ElSelect, ElOption, ElInput } from 'element-plus';
 import { DictTag } from '#/components/dict-tag';
 import { DICT_TYPE, getDictOptions, getRangePickerDefaultProps } from '#/utils';
 import ${simpleClassName}Form from './modules/form.vue';
@@ -30,7 +30,7 @@ import { handleTree,isEmpty } from '@vben/utils'
 import { get${simpleClassName}List, delete${simpleClassName}, export${simpleClassName} } from '#/api/${table.moduleName}/${simpleClassName_strikeCase}';
 #else## 标准表接口
 import { isEmpty } from '@vben/utils';
-import { get${simpleClassName}Page, delete${simpleClassName},#if ($deleteBatchEnable) delete${simpleClassName}List,#end export${simpleClassName} } from '#/api/${table.moduleName}/${table.businessName}';
+import { get${simpleClassName}Page, delete${simpleClassName},#if ($deleteBatchEnable) delete${simpleClassName}List,#end export${simpleClassName} } from '#/api/${table.moduleName}/${simpleClassName_strikeCase}';
 #end
 import { downloadFileFromBlobPart } from '@vben/utils';
 
@@ -141,37 +141,32 @@ function handleAppend(row: ${simpleClassName}Api.${simpleClassName}) {
 
 /** 删除${table.classComment} */
 async function handleDelete(row: ${simpleClassName}Api.${simpleClassName}) {
-  const hideLoading = message.loading({
-    content: $t('ui.actionMessage.deleting', [row.id]),
-    duration: 0,
-    key: 'action_process_msg',
+  const loadingInstance = ElLoading.service({
+    text: $t('ui.actionMessage.deleting', [row.id]),
+    background: 'rgba(0, 0, 0, 0.7)',
   });
   try {
     await delete${simpleClassName}(row.id as number);
-    message.success({
-      content: $t('ui.actionMessage.deleteSuccess', [row.id]),
-      key: 'action_process_msg',
-    });
+    ElMessage.success($t('ui.actionMessage.deleteSuccess', [row.id]));
     await getList();
   } finally {
-    hideLoading();
+    loadingInstance.close();
   }
 }
 
 #if ($table.templateType != 2 && $deleteBatchEnable)
 /** 批量删除${table.classComment} */
 async function handleDeleteBatch() {
-  const hideLoading = message.loading({
-    content: $t('ui.actionMessage.deleting'),
-    duration: 0,
-    key: 'action_process_msg',
+  const loadingInstance = ElLoading.service({
+    text: $t('ui.actionMessage.deleting'),
+    background: 'rgba(0, 0, 0, 0.7)',
   });
   try {
     await delete${simpleClassName}List(checkedIds.value);
-    message.success( $t('ui.actionMessage.deleteSuccess') );
+    ElMessage.success($t('ui.actionMessage.deleteSuccess'));
     await getList();
   } finally {
-    hideLoading();
+    loadingInstance.close();
   }
 }
 
@@ -218,10 +213,10 @@ onMounted(() => {
 
     <ContentWrap v-if="!hiddenSearchBar">
       <!-- 搜索工作栏 -->
-      <Form
+      <el-form
           :model="queryParams"
           ref="queryFormRef"
-          layout="inline"
+          inline
       >
           #foreach($column in $columns)
               #if ($column.listOperation)
@@ -237,66 +232,69 @@ onMounted(() => {
                       #set ($dictMethod = "boolean")
                   #end
                   #if ($column.htmlType == "input")
-                    <Form.Item label="${comment}" name="${javaField}">
-                      <Input
-                          v-model:value="queryParams.${javaField}"
+                    <el-form-item label="${comment}">
+                      <el-input
+                          v-model="queryParams.${javaField}"
                           placeholder="请输入${comment}"
-                          allowClear
-                          @pressEnter="handleQuery"
-                           class="w-full"
+                          clearable
+                          @keyup.enter="handleQuery"
+                           class="!w-[240px]"
                       />
-                    </Form.Item>
+                    </el-form-item>
                   #elseif ($column.htmlType == "select" || $column.htmlType == "radio" || $column.htmlType == "checkbox")
-                    <Form.Item label="${comment}" name="${javaField}">
-                      <Select
-                          v-model:value="queryParams.${javaField}"
+                    <el-form-item label="${comment}">
+                      <el-select
+                          v-model="queryParams.${javaField}"
                           placeholder="请选择${comment}"
-                          allowClear
-                           class="w-full"
+                          clearable
+                           class="!w-[240px]"
                       >
                           #if ("" != $dictType)## 设置了 dictType 数据字典的情况
-                            <Select.Option
+                            <el-option
                                 v-for="dict in getDictOptions(DICT_TYPE.$dictType.toUpperCase(), '$dictMethod')"
                                 :key="dict.value"
                                 :value="dict.value"
-                            >
-                              {{ dict.label }}
-                            </Select.Option>
+                                :label="dict.label"
+                            />
                           #else## 未设置 dictType 数据字典的情况
-                            <Select.Option label="请选择字典生成" value="" />
+                            <el-option label="请选择字典生成" value="" />
                           #end
-                      </Select>
-                    </Form.Item>
+                      </el-select>
+                    </el-form-item>
                   #elseif($column.htmlType == "datetime")
                       #if ($column.listOperationCondition != "BETWEEN")## 非范围
-                        <Form.Item label="${comment}" name="${javaField}">
-                          <DatePicker
-                              v-model:value="queryParams.${javaField}"
-                              valueFormat="YYYY-MM-DD"
+                        <el-form-item label="${comment}">
+                          <el-date-picker
+                              v-model="queryParams.${javaField}"
+                              value-format="YYYY-MM-DD"
                               placeholder="选择${comment}"
-                              allowClear
-                               class="w-full"
+                              clearable
+                               class="!w-[240px]"
                           />
-                        </Form.Item>
+                        </el-form-item>
                       #else## 范围
-                        <Form.Item label="${comment}" name="${javaField}">
-                          <RangePicker
-                              v-model:value="queryParams.${javaField}"
-                              v-bind="getRangePickerDefaultProps()"
-                              class="w-full"
+                        <el-form-item label="${comment}">
+                          <el-date-picker
+                              v-model="queryParams.${javaField}"
+                              type="daterange"
+                              value-format="YYYY-MM-DD"
+                              range-separator="至"
+                              start-placeholder="开始日期"
+                              end-placeholder="结束日期"
+                              class="!w-[240px]"
                           />
-                        </Form.Item>
+                        </el-form-item>
                       #end
                   #end
               #end
           #end
-        <Form.Item>
-          <Button class="ml-2" @click="resetQuery"> 重置 </Button>
-          <Button class="ml-2" @click="handleQuery" type="primary">
+        <el-form-item>
+          <el-button class="ml-2" @click="resetQuery"> 重置 </el-button>
+          <el-button class="ml-2" @click="handleQuery" type="primary">
             搜索
-          </Button>
-        </Form.Item>
-      </Form>
+          </el-button>
+        </el-form-item>
+      </el-form>
     </ContentWrap>
 
     <!-- 列表 -->
@@ -307,11 +305,11 @@ onMounted(() => {
             v-model:hidden-search="hiddenSearchBar"
         >
         #if (${table.templateType} == 2)
-          <Button @click="toggleExpand" class="mr-2">
+          <el-button @click="toggleExpand" class="mr-2">
             {{ isExpanded ? '收缩' : '展开' }}
-          </Button>
+          </el-button>
         #end
-          <Button
+          <el-button
               class="ml-2"
               :icon="h(Plus)"
               type="primary"
@@ -319,8 +317,8 @@ onMounted(() => {
               v-access:code="['${permissionPrefix}:create']"
           >
             {{ $t('ui.actionTitle.create', ['${table.classComment}']) }}
-          </Button>
-          <Button
+          </el-button>
+          <el-button
               :icon="h(Download)"
               type="primary"
               class="ml-2"
@@ -329,19 +327,18 @@ onMounted(() => {
               v-access:code="['${permissionPrefix}:export']"
           >
             {{ $t('ui.actionTitle.export') }}
-          </Button>
+          </el-button>
         #if ($table.templateType != 2 && $deleteBatchEnable)
-          <Button
+          <el-button
               :icon="h(Trash2)"
-              type="primary"
-              danger
+              type="danger"
               class="ml-2"
               :disabled="isEmpty(checkedIds)"
               @click="handleDeleteBatch"
               v-access:code="['${table.moduleName}:${simpleClassName_strikeCase}:delete']"
           >
             批量删除
-          </Button>
+          </el-button>
         #end
         </TableToolbar>
       </template>
@@ -381,17 +378,17 @@ onMounted(() => {
             <vxe-column type="expand" width="60">
               <template #content="{ row }">
                 <!-- 子表的表单 -->
-                <Tabs v-model:active-key="subTabsName" class="mx-8">
+                <el-tabs v-model="subTabsName" class="mx-8">
                     #foreach ($subTable in $subTables)
                         #set ($index = $foreach.count - 1)
                         #set ($subClassNameVar = $subClassNameVars.get($index))
                         #set ($subSimpleClassName = $subSimpleClassNames.get($index))
                         #set ($subJoinColumn_strikeCase = $subJoinColumn_strikeCases.get($index))
-                      <Tabs.TabPane key="$subClassNameVar" tab="${subTable.classComment}" force-render>
+                      <el-tab-pane name="$subClassNameVar" label="${subTable.classComment}">
                         <${subSimpleClassName}List :${subJoinColumn_strikeCase}="row?.id" />
-                      </Tabs.TabPane>
+                      </el-tab-pane>
                     #end
-                </Tabs>
+                </el-tabs>
               </template>
             </vxe-column>
           #end
@@ -423,27 +420,29 @@ onMounted(() => {
         <vxe-column field="operation" title="操作" align="center">
           <template #default="{row}">
 #if ( $table.templateType == 2 )
-  <Button
+  <el-button
       size="small"
-      type="link"
+      type="primary"
+      link
       @click="handleAppend(row as any)"
       v-access:code="['${permissionPrefix}:create']"
   >
     新增下级
-  </Button>
+  </el-button>
 #end
-            <Button
+            <el-button
                 size="small"
-                type="link"
+                type="primary"
+                link
                 @click="handleEdit(row as any)"
                 v-access:code="['${permissionPrefix}:update']"
             >
               {{ $t('ui.actionTitle.edit') }}
-            </Button>
-            <Button
+            </el-button>
+            <el-button
                 size="small"
-                type="link"
-                danger
+                type="danger"
+                link
                 class="ml-2"
                 #if ( $table.templateType == 2 )
                 :disabled="!isEmpty(row?.children)"
@@ -452,19 +451,21 @@ onMounted(() => {
                 v-access:code="['${permissionPrefix}:delete']"
             >
               {{ $t('ui.actionTitle.delete') }}
-            </Button>
+            </el-button>
           </template>
         </vxe-column>
       </vxe-table>
 #if ( $table.templateType != 2 )
       <!-- 分页 -->
       <div class="mt-2 flex justify-end">
-        <Pagination
+        <el-pagination
             :total="total"
-            v-model:current="queryParams.pageNo"
+            v-model:current-page="queryParams.pageNo"
             v-model:page-size="queryParams.pageSize"
-            show-size-changer
-            @change="getList"
+            :page-sizes="[10, 20, 50, 100]"
+            layout="total, sizes, prev, pager, next, jumper"
+            @size-change="getList"
+            @current-change="getList"
         />
       </div>
 #end
@@ -472,17 +473,17 @@ onMounted(() => {
 #if ($table.templateType == 11) ## erp情况
   <ContentWrap>
     <!-- 子表的表单 -->
-    <Tabs v-model:active-key="subTabsName">
+    <el-tabs v-model="subTabsName">
         #foreach ($subTable in $subTables)
             #set ($index = $foreach.count - 1)
             #set ($subClassNameVar = $subClassNameVars.get($index))
             #set ($subSimpleClassName = $subSimpleClassNames.get($index))
             #set ($subJoinColumn_strikeCase = $subJoinColumn_strikeCases.get($index))
-          <Tabs.TabPane key="$subClassNameVar" tab="${subTable.classComment}" force-render>
+          <el-tab-pane name="$subClassNameVar" label="${subTable.classComment}">
             <${subSimpleClassName}List :${subJoinColumn_strikeCase}="select${simpleClassName}?.id" />
-          </Tabs.TabPane>
+          </el-tab-pane>
         #end
-    </Tabs>
+    </el-tabs>
   </ContentWrap>
 #end
   </Page>

+ 53 - 57
yudao-module-infra/src/main/resources/codegen/vue3_vben5_ele/general/views/modules/form_sub_erp.vue.vm

@@ -4,15 +4,15 @@
 #set ($subSimpleClassName = $subSimpleClassNames.get($subIndex))
 <script lang="ts" setup>
   import type { ${simpleClassName}Api } from '#/api/${table.moduleName}/${simpleClassName_strikeCase}';
-  import type { Rule } from 'ant-design-vue/es/form';
+  import type { FormRules } from 'element-plus';
 
   import { useVbenModal } from '@vben/common-ui';
   import { Tinymce as RichTextarea } from '#/components/tinymce';
   import { ImageUpload, FileUpload } from "#/components/upload";
-  import { message, Tabs, Form, Input, Textarea, Select, RadioGroup, Radio, CheckboxGroup, Checkbox, DatePicker, TreeSelect } from 'ant-design-vue';
+  import { ElMessage, ElTabs, ElTabPane, ElForm, ElFormItem, ElInput, ElSelect, ElOption, ElRadioGroup, ElRadio, ElCheckboxGroup, ElCheckbox, ElDatePicker, ElTreeSelect } from 'element-plus';
   import { DICT_TYPE, getDictOptions } from '#/utils';
 
-  import { computed, ref } from 'vue';
+  import { computed, ref, reactive } from 'vue';
   import { $t } from '#/locales';
 
   import { get${subSimpleClassName}, create${subSimpleClassName}, update${subSimpleClassName} } from '#/api/${table.moduleName}/${simpleClassName_strikeCase}';
@@ -36,14 +36,14 @@
       #end
     #end
   });
-  const rules: Record<string, Rule[]> = {
+  const rules = reactive<FormRules>({
     #foreach ($column in $subColumns)
       #if (($column.createOperation || $column.updateOperation) && !$column.nullable && !${column.primaryKey})## 创建或者更新操作 && 要求非空 && 非主键
         #set($comment=$column.columnComment)
           $column.javaField: [{ required: true, message: '${comment}不能为空', trigger: #if($column.htmlType == 'select')'change'#else'blur'#end }],
       #end
     #end
-  };
+  });
 
   const [Modal, modalApi] = useVbenModal({
     async onConfirm() {
@@ -57,10 +57,7 @@
         // 关闭并提示
         await modalApi.close();
         emit('success');
-        message.success({
-          content: $t('ui.actionMessage.operationSuccess'),
-          key: 'action_process_msg',
-        });
+        ElMessage.success($t('ui.actionMessage.operationSuccess'));
       } finally {
         modalApi.unlock();
       }
@@ -108,12 +105,12 @@
 
 <template>
   <Modal :title="getTitle">
-    <Form
+    <el-form
       ref="formRef"
       :model="formData"
       :rules="rules"
-      :label-col="{ span: 5 }"
-      :wrapper-col="{ span: 18 }"
+      label-width="120px"
+      label-position="right"
     >
       #foreach($column in $subColumns)
         #if ($column.createOperation || $column.updateOperation)
@@ -129,84 +126,83 @@
             #set ($dictMethod = "boolean")
           #end
           #if ($column.htmlType == "input" && !$column.primaryKey)## 忽略主键,不用在表单里
-            <Form.Item label="${comment}" name="${javaField}">
-              <Input v-model:value="formData.${javaField}" placeholder="请输入${comment}" />
-            </Form.Item>
+            <el-form-item label="${comment}" prop="${javaField}">
+              <el-input v-model="formData.${javaField}" placeholder="请输入${comment}" />
+            </el-form-item>
           #elseif($column.htmlType == "imageUpload")## 图片上传
-            <Form.Item label="${comment}" name="${javaField}">
-              <ImageUpload v-model:value="formData.${javaField}" />
-            </Form.Item>
+            <el-form-item label="${comment}" prop="${javaField}">
+              <ImageUpload v-model="formData.${javaField}" />
+            </el-form-item>
           #elseif($column.htmlType == "fileUpload")## 文件上传
-            <Form.Item label="${comment}" name="${javaField}">
-              <FileUpload v-model:value="formData.${javaField}" />
-            </Form.Item>
+            <el-form-item label="${comment}" prop="${javaField}">
+              <FileUpload v-model="formData.${javaField}" />
+            </el-form-item>
           #elseif($column.htmlType == "editor")## 文本编辑器
-            <Form.Item label="${comment}" name="${javaField}">
+            <el-form-item label="${comment}" prop="${javaField}">
               <RichTextarea v-model="formData.${javaField}" height="500px" />
-            </Form.Item>
+            </el-form-item>
           #elseif($column.htmlType == "select")## 下拉框
-            <Form.Item label="${comment}" name="${javaField}">
-              <Select v-model:value="formData.${javaField}" placeholder="请选择${comment}">
+            <el-form-item label="${comment}" prop="${javaField}">
+              <el-select v-model="formData.${javaField}" placeholder="请选择${comment}">
                 #if ("" != $dictType)## 有数据字典
-                  <Select.Option
+                  <el-option
                           v-for="dict in getDictOptions(DICT_TYPE.$dictType.toUpperCase(), '$dictMethod')"
                           :key="dict.value"
                           :value="dict.value"
-                  >
-                    {{ dict.label }}
-                  </Select.Option>
+                          :label="dict.label"
+                  />
                 #else##没数据字典
-                  <Select.Option label="请选择字典生成" value="" />
+                  <el-option label="请选择字典生成" value="" />
                 #end
-              </Select>
-            </Form.Item>
+              </el-select>
+            </el-form-item>
           #elseif($column.htmlType == "checkbox")## 多选框
-            <Form.Item label="${comment}" name="${javaField}">
-              <CheckboxGroup v-model:value="formData.${javaField}">
+            <el-form-item label="${comment}" prop="${javaField}">
+              <el-checkbox-group v-model="formData.${javaField}">
                 #if ("" != $dictType)## 有数据字典
-                  <Checkbox
+                  <el-checkbox
                           v-for="dict in getDictOptions(DICT_TYPE.$dictType.toUpperCase(), '$dictMethod')"
                           :key="dict.value"
-                          :value="dict.value"
+                          :label="dict.value"
                   >
                     {{ dict.label }}
-                  </Checkbox>
+                  </el-checkbox>
                 #else##没数据字典
-                  <Checkbox label="请选择字典生成" />
+                  <el-checkbox label="请选择字典生成" />
                 #end
-              </CheckboxGroup>
-            </Form.Item>
+              </el-checkbox-group>
+            </el-form-item>
           #elseif($column.htmlType == "radio")## 单选框
-            <Form.Item label="${comment}" name="${javaField}">
-              <RadioGroup v-model:value="formData.${javaField}">
+            <el-form-item label="${comment}" prop="${javaField}">
+              <el-radio-group v-model="formData.${javaField}">
                 #if ("" != $dictType)## 有数据字典
-                  <Radio
+                  <el-radio
                           v-for="dict in getDictOptions(DICT_TYPE.$dictType.toUpperCase(), '$dictMethod')"
                           :key="dict.value"
-                          :value="dict.value"
+                          :label="dict.value"
                   >
                     {{ dict.label }}
-                  </Radio>
+                  </el-radio>
                 #else##没数据字典
-                  <Radio value="1">请选择字典生成</Radio>
+                  <el-radio :label="1">请选择字典生成</el-radio>
                 #end
-              </RadioGroup>
-            </Form.Item>
+              </el-radio-group>
+            </el-form-item>
           #elseif($column.htmlType == "datetime")## 时间框
-            <Form.Item label="${comment}" name="${javaField}">
-              <DatePicker
-                      v-model:value="formData.${javaField}"
-                      valueFormat="x"
+            <el-form-item label="${comment}" prop="${javaField}">
+              <el-date-picker
+                      v-model="formData.${javaField}"
+                      value-format="x"
                       placeholder="选择${comment}"
               />
-            </Form.Item>
+            </el-form-item>
           #elseif($column.htmlType == "textarea")## 文本框
-            <Form.Item label="${comment}" name="${javaField}">
-              <Textarea v-model:value="formData.${javaField}" placeholder="请输入${comment}" />
-            </Form.Item>
+            <el-form-item label="${comment}" prop="${javaField}">
+              <el-input v-model="formData.${javaField}" type="textarea" placeholder="请输入${comment}" />
+            </el-form-item>
           #end
         #end
       #end
-    </Form>
+    </el-form>
   </Modal>
 </template>

+ 1 - 1
yudao-module-infra/src/main/resources/codegen/vue3_vben5_ele/general/views/modules/form_sub_inner.vue.vm

@@ -1,2 +1,2 @@
 ## 主表的 normal 和 inner 使用相同的 form 表单
-#parse("codegen/vue3_vben5_antd/general/views/modules/form_sub_normal.vue.vm")
+#parse("codegen/vue3_vben5_ele/general/views/modules/form_sub_normal.vue.vm")

+ 84 - 86
yudao-module-infra/src/main/resources/codegen/vue3_vben5_ele/general/views/modules/form_sub_normal.vue.vm

@@ -7,8 +7,8 @@
 <script lang="ts" setup>
   import type { ${simpleClassName}Api } from '#/api/${table.moduleName}/${simpleClassName_strikeCase}';
 
-  import { message, Tabs, Form, Input, Textarea,Button, Select, RadioGroup, Radio, CheckboxGroup, Checkbox, DatePicker } from 'ant-design-vue';
-  import { computed, ref, h, onMounted,watch,nextTick } from 'vue';
+  import { ElMessage, ElTabs, ElTabPane, ElForm, ElFormItem, ElInput, ElButton, ElSelect, ElOption, ElRadioGroup, ElRadio, ElCheckboxGroup, ElCheckbox, ElDatePicker } from 'element-plus';
+  import { computed, ref, reactive, h, onMounted,watch,nextTick } from 'vue';
   import { $t } from '#/locales';
   import { DICT_TYPE, getDictOptions } from '#/utils';
 
@@ -18,7 +18,7 @@ import { Plus } from "@vben/icons";
 import { VxeColumn, VxeTable } from '#/adapter/vxe-table';
 import { get${subSimpleClassName}ListBy${SubJoinColumnName} } from '#/api/${table.moduleName}/${simpleClassName_strikeCase}';
 #else
-import type { Rule } from 'ant-design-vue/es/form';
+import type { FormRules } from 'element-plus';
 import { Tinymce as RichTextarea } from '#/components/tinymce';
 import { get${subSimpleClassName}By${SubJoinColumnName} } from '#/api/${table.moduleName}/${simpleClassName_strikeCase}';
 #end
@@ -76,14 +76,14 @@ const formData = ref<Partial<${simpleClassName}Api.${subSimpleClassName}>>({
         #end
     #end
 });
-const rules: Record<string, Rule[]> = {
+const rules = reactive<FormRules>({
     #foreach ($column in $subColumns)
         #if (($column.createOperation || $column.updateOperation) && !$column.nullable && !${column.primaryKey})## 创建或者更新操作 && 要求非空 && 非主键
             #set($comment=$column.columnComment)
                 $column.javaField: [{ required: true, message: '${comment}不能为空', trigger: #if($column.htmlType == 'select')'change'#else'blur'#end }],
         #end
     #end
-};
+});
 /** 暴露出表单校验方法和表单值获取方法 */
 defineExpose({
   validate: async () => await formRef.value?.validate(),
@@ -124,90 +124,89 @@ watch(
               #elseif ($column.htmlType == "input" && !$column.primaryKey)## 忽略主键,不用在表单里
                 <vxe-column field="${javaField}" title="${comment}" align="center">
                   <template #default="{row}">
-                    <Input v-model:value="row.${javaField}" />
+                    <el-input v-model="row.${javaField}" />
                   </template>
                 </vxe-column>
               #elseif($column.htmlType == "imageUpload")## 图片上传
                 <vxe-column field="${javaField}" title="${comment}" align="center">
                   <template #default="{row}">
-                    <ImageUpload v-model:value="row.${javaField}" />
+                    <ImageUpload v-model="row.${javaField}" />
                   </template>
                 </vxe-column>
               #elseif($column.htmlType == "fileUpload")## 文件上传
                 <vxe-column field="${javaField}" title="${comment}" align="center">
                   <template #default="{row}">
-                    <FileUpload v-model:value="row.${javaField}" />
+                    <FileUpload v-model="row.${javaField}" />
                   </template>
                 </vxe-column>
               #elseif($column.htmlType == "select")## 下拉框
                 <vxe-column field="${javaField}" title="${comment}" align="center">
                   <template #default="{row}">
-                    <Select v-model:value="row.${javaField}" placeholder="请选择${comment}">
+                    <el-select v-model="row.${javaField}" placeholder="请选择${comment}">
                         #if ("" != $dictType)## 有数据字典
-                          <Select.Option
+                          <el-option
                               v-for="dict in getDictOptions(DICT_TYPE.$dictType.toUpperCase(), '$dictMethod')"
                               :key="dict.value"
                               :value="dict.value"
-                          >
-                            {{ dict.label }}
-                          </Select.Option>
+                              :label="dict.label"
+                          />
                         #else##没数据字典
-                          <Select.Option label="请选择字典生成" value="" />
+                          <el-option label="请选择字典生成" value="" />
                         #end
-                    </Select>
+                    </el-select>
                   </template>
                 </vxe-column>
               #elseif($column.htmlType == "checkbox")## 多选框
                 <vxe-column field="${javaField}" title="${comment}" align="center">
                   <template #default="{row}">
-                    <CheckboxGroup v-model:value="row.${javaField}">
+                    <el-checkbox-group v-model="row.${javaField}">
                         #if ("" != $dictType)## 有数据字典
-                          <Checkbox
+                          <el-checkbox
                               v-for="dict in getDictOptions(DICT_TYPE.$dictType.toUpperCase(), '$dictMethod')"
                               :key="dict.value"
-                              :value="dict.value"
+                              :label="dict.value"
                           >
                             {{ dict.label }}
-                          </Checkbox>
+                          </el-checkbox>
                         #else##没数据字典
-                          <Checkbox label="请选择字典生成" />
+                          <el-checkbox label="请选择字典生成" />
                         #end
-                    </CheckboxGroup>
+                    </el-checkbox-group>
                   </template>
                 </vxe-column>
               #elseif($column.htmlType == "radio")## 单选框
                 <vxe-column field="${javaField}" title="${comment}" align="center">
                   <template #default="{row}">
-                    <RadioGroup v-model:value="row.${javaField}">
+                    <el-radio-group v-model="row.${javaField}">
                         #if ("" != $dictType)## 有数据字典
-                          <Radio
+                          <el-radio
                               v-for="dict in getDictOptions(DICT_TYPE.$dictType.toUpperCase(), '$dictMethod')"
                               :key="dict.value"
-                              :value="dict.value"
+                              :label="dict.value"
                           >
                             {{ dict.label }}
-                          </Radio>
+                          </el-radio>
                         #else##没数据字典
-                          <Radio value="1">请选择字典生成</Radio>
+                          <el-radio :label="1">请选择字典生成</el-radio>
                         #end
-                    </RadioGroup>
+                    </el-radio-group>
                   </template>
                 </vxe-column>
               #elseif($column.htmlType == "datetime")## 时间框
                 <vxe-column field="${javaField}" title="${comment}" align="center">
                   <template #default="{row}">
-                    <DatePicker
-                        v-model:value="row.${javaField}"
-                        :showTime="true"
+                    <el-date-picker
+                        v-model="row.${javaField}"
+                        type="datetime"
+                        value-format="x"
                         format="YYYY-MM-DD HH:mm:ss"
-                        valueFormat='x'
                     />
                   </template>
                 </vxe-column>
               #elseif($column.htmlType == "textarea" || $column.htmlType == "editor")## 文本框
                 <vxe-column field="${javaField}" title="${comment}" align="center">
                   <template #default="{row}">
-                    <Textarea v-model:value="row.${javaField}" />
+                    <el-input v-model="row.${javaField}" type="textarea" />
                   </template>
                 </vxe-column>
               #end
@@ -215,31 +214,31 @@ watch(
       #end
     <vxe-column field="operation" title="操作" align="center">
       <template #default="{row}">
-        <Button
+        <el-button
             size="small"
-            type="link"
-            danger
+            type="danger"
+            link
             @click="onDelete(row as any)"
             v-access:code="['${permissionPrefix}:delete']"
         >
           {{ $t('ui.actionTitle.delete') }}
-        </Button>
+        </el-button>
       </template>
     </vxe-column>
   </vxe-table>
   <div class="flex justify-center mt-4">
-    <Button :icon="h(Plus)" type="primary" ghost @click="onAdd" v-access:code="['${permissionPrefix}:create']">
+    <el-button :icon="h(Plus)" type="primary" plain @click="onAdd" v-access:code="['${permissionPrefix}:create']">
       {{ $t('ui.actionTitle.create', ['${subTable.classComment}']) }}
-    </Button>
+    </el-button>
   </div>
 #else
-  <Form
+  <el-form
       ref="formRef"
       class="mx-4"
       :model="formData"
       :rules="rules"
-      :label-col="{ span: 5 }"
-      :wrapper-col="{ span: 18 }"
+      label-width="120px"
+      label-position="right"
   >
       #foreach($column in $subColumns)
           #if ($column.createOperation || $column.updateOperation)
@@ -255,84 +254,83 @@ watch(
                   #set ($dictMethod = "boolean")
               #end
               #if ($column.htmlType == "input" && !$column.primaryKey)## 忽略主键,不用在表单里
-                <Form.Item label="${comment}" name="${javaField}">
-                  <Input v-model:value="formData.${javaField}" placeholder="请输入${comment}" />
-                </Form.Item>
+                <el-form-item label="${comment}" prop="${javaField}">
+                  <el-input v-model="formData.${javaField}" placeholder="请输入${comment}" />
+                </el-form-item>
               #elseif($column.htmlType == "imageUpload")## 图片上传
-                <Form.Item label="${comment}" name="${javaField}">
-                  <ImageUpload v-model:value="formData.${javaField}" />
-                </Form.Item>
+                <el-form-item label="${comment}" prop="${javaField}">
+                  <ImageUpload v-model="formData.${javaField}" />
+                </el-form-item>
               #elseif($column.htmlType == "fileUpload")## 文件上传
-                <Form.Item label="${comment}" name="${javaField}">
-                  <FileUpload v-model:value="formData.${javaField}" />
-                </Form.Item>
+                <el-form-item label="${comment}" prop="${javaField}">
+                  <FileUpload v-model="formData.${javaField}" />
+                </el-form-item>
               #elseif($column.htmlType == "editor")## 文本编辑器
-                <Form.Item label="${comment}" name="${javaField}">
+                <el-form-item label="${comment}" prop="${javaField}">
                   <RichTextarea v-model="formData.${javaField}" height="500px" />
-                </Form.Item>
+                </el-form-item>
               #elseif($column.htmlType == "select")## 下拉框
-                <Form.Item label="${comment}" name="${javaField}">
-                  <Select v-model:value="formData.${javaField}" placeholder="请选择${comment}">
+                <el-form-item label="${comment}" prop="${javaField}">
+                  <el-select v-model="formData.${javaField}" placeholder="请选择${comment}">
                       #if ("" != $dictType)## 有数据字典
-                        <Select.Option
+                        <el-option
                             v-for="dict in getDictOptions(DICT_TYPE.$dictType.toUpperCase(), '$dictMethod')"
                             :key="dict.value"
                             :value="dict.value"
-                        >
-                          {{ dict.label }}
-                        </Select.Option>
+                            :label="dict.label"
+                        />
                       #else##没数据字典
-                        <Select.Option label="请选择字典生成" value="" />
+                        <el-option label="请选择字典生成" value="" />
                       #end
-                  </Select>
-                </Form.Item>
+                  </el-select>
+                </el-form-item>
               #elseif($column.htmlType == "checkbox")## 多选框
-                <Form.Item label="${comment}" name="${javaField}">
-                  <CheckboxGroup v-model:value="formData.${javaField}">
+                <el-form-item label="${comment}" prop="${javaField}">
+                  <el-checkbox-group v-model="formData.${javaField}">
                       #if ("" != $dictType)## 有数据字典
-                        <Checkbox
+                        <el-checkbox
                             v-for="dict in getDictOptions(DICT_TYPE.$dictType.toUpperCase(), '$dictMethod')"
                             :key="dict.value"
-                            :value="dict.value"
+                            :label="dict.value"
                         >
                           {{ dict.label }}
-                        </Checkbox>
+                        </el-checkbox>
                       #else##没数据字典
-                        <Checkbox label="请选择字典生成" />
+                        <el-checkbox label="请选择字典生成" />
                       #end
-                  </CheckboxGroup>
-                </Form.Item>
+                  </el-checkbox-group>
+                </el-form-item>
               #elseif($column.htmlType == "radio")## 单选框
-                <Form.Item label="${comment}" name="${javaField}">
-                  <RadioGroup v-model:value="formData.${javaField}">
+                <el-form-item label="${comment}" prop="${javaField}">
+                  <el-radio-group v-model="formData.${javaField}">
                       #if ("" != $dictType)## 有数据字典
-                        <Radio
+                        <el-radio
                             v-for="dict in getDictOptions(DICT_TYPE.$dictType.toUpperCase(), '$dictMethod')"
                             :key="dict.value"
-                            :value="dict.value"
+                            :label="dict.value"
                         >
                           {{ dict.label }}
-                        </Radio>
+                        </el-radio>
                       #else##没数据字典
-                        <Radio value="1">请选择字典生成</Radio>
+                        <el-radio :label="1">请选择字典生成</el-radio>
                       #end
-                  </RadioGroup>
-                </Form.Item>
+                  </el-radio-group>
+                </el-form-item>
               #elseif($column.htmlType == "datetime")## 时间框
-                <Form.Item label="${comment}" name="${javaField}">
-                  <DatePicker
-                      v-model:value="formData.${javaField}"
-                      valueFormat="x"
+                <el-form-item label="${comment}" prop="${javaField}">
+                  <el-date-picker
+                      v-model="formData.${javaField}"
+                      value-format="x"
                       placeholder="选择${comment}"
                   />
-                </Form.Item>
+                </el-form-item>
               #elseif($column.htmlType == "textarea")## 文本框
-                <Form.Item label="${comment}" name="${javaField}">
-                  <Textarea v-model:value="formData.${javaField}" placeholder="请输入${comment}" />
-                </Form.Item>
+                <el-form-item label="${comment}" prop="${javaField}">
+                  <el-input v-model="formData.${javaField}" type="textarea" placeholder="请输入${comment}" />
+                </el-form-item>
               #end
           #end
       #end
-  </Form>
+  </el-form>
 #end
 </template>

+ 75 - 75
yudao-module-infra/src/main/resources/codegen/vue3_vben5_ele/general/views/modules/list_sub_erp.vue.vm

@@ -21,7 +21,7 @@
     import ${subSimpleClassName}Form from './${subSimpleClassName_strikeCase}-form.vue'
     import { Tinymce as RichTextarea } from '#/components/tinymce';
     import { ImageUpload, FileUpload } from "#/components/upload";
-    import { message,Button, Tabs,Pagination, Form, Input, Textarea, Select, RadioGroup, Radio, CheckboxGroup, Checkbox,RangePicker, DatePicker, TreeSelect } from 'ant-design-vue';
+    import { ElMessage, ElLoading, ElButton, ElTabs, ElTabPane, ElPagination, ElForm, ElFormItem, ElDatePicker, ElSelect, ElOption, ElInput } from 'element-plus';
     import { Plus, Trash2 } from '@vben/icons';
     import { $t } from '#/locales';
     import { TableToolbar } from '#/components/table-toolbar';
@@ -29,7 +29,7 @@
 #end
 
 #if ($table.templateType == 11) ## erp
-    import { delete${subSimpleClassName},#if ($deleteBatchEnable) delete${subSimpleClassName}List,#end get${subSimpleClassName}Page } from '#/api/${table.moduleName}/${table.businessName}';
+    import { delete${subSimpleClassName},#if ($deleteBatchEnable) delete${subSimpleClassName}List,#end get${subSimpleClassName}Page } from '#/api/${table.moduleName}/${simpleClassName_strikeCase}';
     import { isEmpty } from '@vben/utils';
   #else
   #if ($subTable.subJoinMany) ## 一对多
@@ -52,7 +52,7 @@ const props = defineProps<{
 /** 创建${subTable.classComment} */
 function handleCreate() {
   if (!props.${subJoinColumn.javaField}){
-    message.warning("请先选择一个${table.classComment}!")
+    ElMessage.warning("请先选择一个${table.classComment}!")
     return
   }
   formModalApi.setData({${subJoinColumn.javaField}: props.${subJoinColumn.javaField}}).open();
@@ -65,37 +65,32 @@ function handleEdit(row: ${simpleClassName}Api.${subSimpleClassName}) {
 
 /** 删除${subTable.classComment} */
 async function handleDelete(row: ${simpleClassName}Api.${subSimpleClassName}) {
-  const hideLoading = message.loading({
-    content: $t('ui.actionMessage.deleting', [row.id]),
-    duration: 0,
-    key: 'action_process_msg',
+  const loadingInstance = ElLoading.service({
+    text: $t('ui.actionMessage.deleting', [row.id]),
+    background: 'rgba(0, 0, 0, 0.7)',
   });
   try {
     await delete${subSimpleClassName}(row.id as number);
-    message.success({
-      content: $t('ui.actionMessage.deleteSuccess', [row.id]),
-      key: 'action_process_msg',
-    });
+    ElMessage.success($t('ui.actionMessage.deleteSuccess', [row.id]));
     await getList();
   } finally {
-    hideLoading();
+    loadingInstance.close();
   }
 }
 
 #if ($deleteBatchEnable)
 /** 批量删除${subTable.classComment} */
 async function handleDeleteBatch() {
-  const hideLoading = message.loading({
-    content: $t('ui.actionMessage.deleting'),
-    duration: 0,
-    key: 'action_process_msg',
+  const loadingInstance = ElLoading.service({
+    text: $t('ui.actionMessage.deleting'),
+    background: 'rgba(0, 0, 0, 0.7)',
   });
   try {
     await delete${subSimpleClassName}List(checkedIds.value);
-    message.success( $t('ui.actionMessage.deleteSuccess') );
+    ElMessage.success($t('ui.actionMessage.deleteSuccess'));
     await getList();
   } finally {
-    hideLoading();
+    loadingInstance.close();
   }
 }
 
@@ -207,10 +202,10 @@ onMounted(() => {
       <div class="h-[600px]">
         <ContentWrap v-if="!hiddenSearchBar">
           <!-- 搜索工作栏 -->
-          <Form
+          <el-form
               :model="queryParams"
               ref="queryFormRef"
-              layout="inline"
+              inline
           >
               #foreach($column in $subColumns)
                   #if ($column.listOperation)
@@ -226,66 +221,69 @@ onMounted(() => {
                           #set ($dictMethod = "boolean")
                       #end
                       #if ($column.htmlType == "input")
-                        <Form.Item label="${comment}" name="${javaField}">
-                          <Input
-                              v-model:value="queryParams.${javaField}"
+                        <el-form-item label="${comment}">
+                          <el-input
+                              v-model="queryParams.${javaField}"
                               placeholder="请输入${comment}"
-                              allowClear
-                              @pressEnter="handleQuery"
-                              class="w-full"
+                              clearable
+                              @keyup.enter="handleQuery"
+                              class="!w-[240px]"
                           />
-                        </Form.Item>
+                        </el-form-item>
                       #elseif ($column.htmlType == "select" || $column.htmlType == "radio" || $column.htmlType == "checkbox")
-                        <Form.Item label="${comment}" name="${javaField}">
-                          <Select
-                              v-model:value="queryParams.${javaField}"
+                        <el-form-item label="${comment}">
+                          <el-select
+                              v-model="queryParams.${javaField}"
                               placeholder="请选择${comment}"
-                              allowClear
-                              class="w-full"
+                              clearable
+                              class="!w-[240px]"
                           >
                               #if ("" != $dictType)## 设置了 dictType 数据字典的情况
-                                <Select.Option
+                                <el-option
                                     v-for="dict in getDictOptions(DICT_TYPE.$dictType.toUpperCase(), '$dictMethod')"
                                     :key="dict.value"
                                     :value="dict.value"
-                                >
-                                  {{ dict.label }}
-                                </Select.Option>
+                                    :label="dict.label"
+                                />
                               #else## 未设置 dictType 数据字典的情况
-                                <Select.Option label="请选择字典生成" value="" />
+                                <el-option label="请选择字典生成" value="" />
                               #end
-                          </Select>
-                        </Form.Item>
+                          </el-select>
+                        </el-form-item>
                       #elseif($column.htmlType == "datetime")
                           #if ($column.listOperationCondition != "BETWEEN")## 非范围
-                            <Form.Item label="${comment}" name="${javaField}">
-                              <DatePicker
-                                  v-model:value="queryParams.${javaField}"
-                                  valueFormat="YYYY-MM-DD"
+                            <el-form-item label="${comment}">
+                              <el-date-picker
+                                  v-model="queryParams.${javaField}"
+                                  value-format="YYYY-MM-DD"
                                   placeholder="选择${comment}"
-                                  allowClear
-                                  class="w-full"
+                                  clearable
+                                  class="!w-[240px]"
                               />
-                            </Form.Item>
+                            </el-form-item>
                           #else## 范围
-                            <Form.Item label="${comment}" name="${javaField}">
-                              <RangePicker
-                                  v-model:value="queryParams.${javaField}"
-                                  v-bind="getRangePickerDefaultProps()"
-                                  class="w-full"
+                            <el-form-item label="${comment}">
+                              <el-date-picker
+                                  v-model="queryParams.${javaField}"
+                                  type="daterange"
+                                  value-format="YYYY-MM-DD"
+                                  range-separator="至"
+                                  start-placeholder="开始日期"
+                                  end-placeholder="结束日期"
+                                  class="!w-[240px]"
                               />
-                            </Form.Item>
+                            </el-form-item>
                           #end
                       #end
                   #end
               #end
-            <Form.Item>
-              <Button class="ml-2" @click="resetQuery"> 重置 </Button>
-              <Button class="ml-2" @click="handleQuery" type="primary">
+            <el-form-item>
+              <el-button class="ml-2" @click="resetQuery"> 重置 </el-button>
+              <el-button class="ml-2" @click="handleQuery" type="primary">
                 搜索
-              </Button>
-            </Form.Item>
-          </Form>
+              </el-button>
+            </el-form-item>
+          </el-form>
         </ContentWrap>
 
         <!-- 列表 -->
@@ -295,7 +293,7 @@ onMounted(() => {
                 ref="tableToolbarRef"
                 v-model:hidden-search="hiddenSearchBar"
             >
-              <Button
+              <el-button
                   class="ml-2"
                   :icon="h(Plus)"
                   type="primary"
@@ -303,19 +301,18 @@ onMounted(() => {
                   v-access:code="['${permissionPrefix}:create']"
               >
                 {{ $t('ui.actionTitle.create', ['${table.classComment}']) }}
-              </Button>
+              </el-button>
                 #if ($deleteBatchEnable)
-                  <Button
+                  <el-button
                       :icon="h(Trash2)"
-                      type="primary"
-                      danger
+                      type="danger"
                       class="ml-2"
                       :disabled="isEmpty(checkedIds)"
                       @click="handleDeleteBatch"
                       v-access:code="['${table.moduleName}:${simpleClassName_strikeCase}:delete']"
                   >
                     批量删除
-                  </Button>
+                  </el-button>
                 #end
             </TableToolbar>
           </template>
@@ -358,35 +355,38 @@ onMounted(() => {
               #end
             <vxe-column field="operation" title="操作" align="center">
               <template #default="{row}">
-                <Button
+                <el-button
                     size="small"
-                    type="link"
+                    type="primary"
+                    link
                     @click="handleEdit(row as any)"
                     v-access:code="['${permissionPrefix}:update']"
                 >
                   {{ $t('ui.actionTitle.edit') }}
-                </Button>
-                <Button
+                </el-button>
+                <el-button
                     size="small"
-                    type="link"
-                    danger
+                    type="danger"
+                    link
                     class="ml-2"
                     @click="handleDelete(row as any)"
                     v-access:code="['${permissionPrefix}:delete']"
                 >
                   {{ $t('ui.actionTitle.delete') }}
-                </Button>
+                </el-button>
               </template>
             </vxe-column>
           </vxe-table>
           <!-- 分页 -->
           <div class="mt-2 flex justify-end">
-            <Pagination
+            <el-pagination
                 :total="total"
-                v-model:current="queryParams.pageNo"
+                v-model:current-page="queryParams.pageNo"
                 v-model:page-size="queryParams.pageSize"
-                show-size-changer
-                @change="getList"
+                :page-sizes="[10, 20, 50, 100]"
+                layout="total, sizes, prev, pager, next, jumper"
+                @size-change="getList"
+                @current-change="getList"
             />
           </div>
         </ContentWrap>

+ 1 - 1
yudao-module-infra/src/main/resources/codegen/vue3_vben5_ele/general/views/modules/list_sub_inner.vue.vm

@@ -1,4 +1,4 @@
 ## 子表的 erp 和 inner 使用相似的 list 列表,差异主要两点:
 ## 1)inner 使用 list 不分页,erp 使用 page 分页
 ## 2)erp 支持单个子表的新增、修改、删除,inner 不支持
-#parse("codegen/vue3_vben5_antd/general/views/modules/list_sub_erp.vue.vm")
+#parse("codegen/vue3_vben5_ele/general/views/modules/list_sub_erp.vue.vm")