BJ_ZTEITS-Developers / parking-cloud-yudao

Commit e8d2dc513b2060db0500d4110869a4f08f3cb3cb

Authored by YunaiV
Committed by &wxr
1 parent e96f052a

代码生成：完善 Vue3 标准模版的表单

Inline Side-by-side
Showing 3 changed files with 52 additions and 40 deletions
yudao-module-infra/yudao-module-infra-biz/src/main/java/cn/iocoder/yudao/module/infra/service/codegen/inner/CodegenEngine.java
  View file @e8d2dc5
... ... @@ -97,20 +97,21 @@ public class CodegenEngine {
97 97 * value：生成的路径
98 98 */
99 99 private static final Table<Integer, String, String> FRONT_TEMPLATES = ImmutableTable.<Integer, String, String>builder()
100   - // Vue2
  100 + // Vue2 标准模版
101 101 .put(CodegenFrontTypeEnum.VUE2.getType(), vueTemplatePath("views/index.vue"),
102 102 vueFilePath("views/${table.moduleName}/${classNameVar}/index.vue"))
103 103 .put(CodegenFrontTypeEnum.VUE2.getType(), vueTemplatePath("api/api.js"),
104 104 vueFilePath("api/${table.moduleName}/${classNameVar}.js"))
105   - // Vue3
  105 + // Vue3 标准模版
106 106 .put(CodegenFrontTypeEnum.VUE3.getType(), vue3TemplatePath("views/index.vue"),
107 107 vue3FilePath("views/${table.moduleName}/${classNameVar}/index.vue"))
108 108 .put(CodegenFrontTypeEnum.VUE3.getType(), vue3TemplatePath("views/form.vue"),
109   - vue3FilePath("views/${table.moduleName}/${classNameVar}/form.vue"))
110   -// .put(CodegenFrontTypeEnum.VUE3.getType(), vue3TemplatePath("views/data.ts"),
111   -// vue3FilePath("views/${table.moduleName}/${classNameVar}/${classNameVar}.data.ts"))
  109 + vue3FilePath("views/${table.moduleName}/${classNameVar}/${simpleClassName}Form.vue"))
112 110 .put(CodegenFrontTypeEnum.VUE3.getType(), vue3TemplatePath("api/api.ts"),
113 111 vue3FilePath("api/${table.moduleName}/${classNameVar}/index.ts"))
  112 + // Vue3 Schema 模版
  113 +// .put(CodegenFrontTypeEnum.VUE3.getType(), vue3TemplatePath("views/data.ts"),
  114 +// vue3FilePath("views/${table.moduleName}/${classNameVar}/${classNameVar}.data.ts"))
114 115 .build();
115 116  
116 117 @Resource
... ... @@ -203,6 +204,8 @@ public class CodegenEngine {
203 204 getStr(bindingMap, "basePackage").replaceAll("\\.", "/"));
204 205 filePath = StrUtil.replace(filePath, "${classNameVar}",
205 206 getStr(bindingMap, "classNameVar"));
  207 + filePath = StrUtil.replace(filePath, "${simpleClassName}",
  208 + getStr(bindingMap, "simpleClassName"));
206 209 // sceneEnum 包含的字段
207 210 CodegenSceneEnum sceneEnum = (CodegenSceneEnum) bindingMap.get("sceneEnum");
208 211 filePath = StrUtil.replace(filePath, "${sceneEnum.prefixClass}", sceneEnum.getPrefixClass());
... ...
yudao-module-infra/yudao-module-infra-biz/src/main/resources/codegen/vue3/views/form.vue.vm
  View file @e8d2dc5
... ... @@ -27,17 +27,17 @@
27 27 <el-form-item label="${comment}" prop="${javaField}">
28 28 <el-input v-model="formData.${javaField}" placeholder="请输入${comment}" />
29 29 </el-form-item>
30   - #elseif($column.htmlType == "imageUpload")## 图片上传 TODO 芋艿：待测试
  30 + #elseif($column.htmlType == "imageUpload")## 图片上传
31 31 #set ($hasImageUploadColumn = true)
32   - <el-form-item label="${comment}">
33   - <imageUpload v-model="formData.${javaField}"/>
34   - </el-form-item>
35   - #elseif($column.htmlType == "fileUpload")## 文件上传 TODO 芋艿：待测试
  32 + <el-form-item label="${comment}">
  33 + <UploadImg v-model="formData.${javaField}" />
  34 + </el-form-item>
  35 + #elseif($column.htmlType == "fileUpload")## 文件上传
36 36 #set ($hasFileUploadColumn = true)
37   - <el-form-item label="${comment}">
38   - <fileUpload v-model="formData.${javaField}"/>
39   - </el-form-item>
40   - #elseif($column.htmlType == "editor")## 文本编辑器 TODO 芋艿：待测试
  37 + <el-form-item label="${comment}">
  38 + <UploadFile v-model="formData.${javaField}" />
  39 + </el-form-item>
  40 + #elseif($column.htmlType == "editor")## 文本编辑器
41 41 <el-form-item label="${comment}">
42 42 <Editor :model-value="formData.${javaField}" height="150px" />
43 43 </el-form-item>
... ... @@ -59,19 +59,20 @@
59 59 #end
60 60 </el-select>
61 61 </el-form-item>
62   - #elseif($column.htmlType == "checkbox")## 多选框 TODO 芋艿：待测试
  62 + #elseif($column.htmlType == "checkbox")## 多选框
63 63 <el-form-item label="${comment}" prop="${javaField}">
64 64 <el-checkbox-group v-model="formData.${javaField}">
65 65 #if ("" != $dictType)## 有数据字典
66 66 #if (!$dictMethods.contains($dictMethod))## 如果不存在，则添加到 dictMethods 数组中，后续好 import
67 67 #set($ignore = $dictMethods.add($dictMethod) )
68 68 #end
69   - <el-checkbox
70   - v-for="dict in $dictMethod(DICT_TYPE.$dictType.toUpperCase())"
71   - key="dict.value"
72   - :label="dict.value">
73   - {{dict.label}}
74   - </el-checkbox>
  69 + <el-checkbox
  70 + v-for="dict in $dictMethod(DICT_TYPE.$dictType.toUpperCase())"
  71 + :key="dict.value"
  72 + :label="dict.value"
  73 + >
  74 + {{ dict.label }}
  75 + </el-checkbox>
75 76 #else##没数据字典
76 77 <el-checkbox>请选择字典生成</el-checkbox>
77 78 #end
... ... @@ -96,14 +97,19 @@
96 97 #end
97 98 </el-radio-group>
98 99 </el-form-item>
99   - #elseif($column.htmlType == "datetime")## 时间框 TODO 芋艿：待测试
100   - <el-form-item label="${comment}" prop="${javaField}">
101   - <el-date-picker clearable v-model="formData.${javaField}" type="date" value-format="timestamp" placeholder="选择${comment}" />
102   - </el-form-item>
103   - #elseif($column.htmlType == "textarea")## 文本框 TODO 芋艿：待测试
104   - <el-form-item label="${comment}" prop="${javaField}">
105   - <el-input v-model="formData.${javaField}" type="textarea" placeholder="请输入${comment}" />
106   - </el-form-item>
  100 + #elseif($column.htmlType == "datetime")## 时间框
  101 + <el-form-item label="${comment}" prop="${javaField}">
  102 + <el-date-picker
  103 + v-model="formData.${javaField}"
  104 + type="date"
  105 + value-format="timestamp"
  106 + placeholder="选择${comment}"
  107 + />
  108 + </el-form-item>
  109 + #elseif($column.htmlType == "textarea")## 文本框
  110 + <el-form-item label="${comment}" prop="${javaField}">
  111 + <el-input v-model="formData.${javaField}" type="textarea" placeholder="请输入${comment}" />
  112 + </el-form-item>
107 113 #end
108 114 #end
109 115 #end
... ... @@ -163,7 +169,7 @@ const formRules = reactive({
163 169 const formRef = ref() // 表单 Ref
164 170  
165 171 /** 打开弹窗 */
166   -const openModal = async (type: string, id?: number) => {
  172 +const open = async (type: string, id?: number) => {
167 173 modelVisible.value = true
168 174 modelTitle.value = t('action.' + type)
169 175 formType.value = type
... ... @@ -178,7 +184,7 @@ const openModal = async (type: string, id?: number) =&gt; {
178 184 }
179 185 }
180 186 }
181   -defineExpose({ openModal }) // 提供 openModal 方法，用于打开弹窗
  187 +defineExpose({ open }) // 提供 open 方法，用于打开弹窗
182 188  
183 189 /** 提交表单 */
184 190 const emit = defineEmits(['success']) // 定义 success 事件，用于操作成功后的回调
... ...
yudao-module-infra/yudao-module-infra-biz/src/main/resources/codegen/vue3/views/index.vue.vm
  View file @e8d2dc5
... ... @@ -92,12 +92,12 @@
92 92 <el-form-item>
93 93 <el-button @click="handleQuery"><Icon icon="ep:search" class="mr-5px" /> 搜索</el-button>
94 94 <el-button @click="resetQuery"><Icon icon="ep:refresh" class="mr-5px" /> 重置</el-button>
95   - #if ($permissionPrefix.length() < 15)
96   - <el-button type="primary" @click="openModal('create')" v-hasPermi="['${permissionPrefix}:create']">
  95 + #if ($permissionPrefix.length() <= 12)
  96 + <el-button type="primary" @click="openForm('create')" v-hasPermi="['${permissionPrefix}:create']">
97 97 #else
98 98 <el-button
99 99 type="primary"
100   - @click="openModal('create')"
  100 + @click="openForm('create')"
101 101 v-hasPermi="['${permissionPrefix}:create']"
102 102 >
103 103 #end
... ... @@ -148,7 +148,7 @@
148 148 <el-button
149 149 link
150 150 type="primary"
151   - @click="openModal('update', scope.row.id)"
  151 + @click="openForm('update', scope.row.id)"
152 152 v-hasPermi="['${permissionPrefix}:update']"
153 153 >
154 154 编辑
... ... @@ -172,6 +172,9 @@
172 172 @pagination="getList"
173 173 />
174 174 </content-wrap>
  175 +
  176 + <!-- 表单弹窗：添加/修改 -->
  177 + <${simpleClassName}Form ref="formRef" @success="getList" />
175 178 </template>
176 179  
177 180 <script setup lang="ts" name="${simpleClassName}">
... ... @@ -181,7 +184,7 @@ import { DICT_TYPE#foreach ($dictMethod in $dictMethods), ${dictMethod}#end } fr
181 184 import { dateFormatter } from '@/utils/formatTime'
182 185 import download from '@/utils/download'
183 186 import * as ${simpleClassName}Api from '@/api/${table.moduleName}/${classNameVar}'
184   -// import ConfigForm from './form.vue'
  187 +import ${simpleClassName}Form from './${simpleClassName}Form.vue'
185 188 const message = useMessage() // 消息弹窗
186 189 const { t } = useI18n() // 国际化
187 190  
... ... @@ -236,10 +239,10 @@ const resetQuery = () =&gt; {
236 239 }
237 240  
238 241 /** 添加/修改操作 */
239   -// const modalRef = ref()
240   -// const openModal = (type: string, id?: number) => {
241   -// modalRef.value.openModal(type, id)
242   -// }
  242 +const formRef = ref()
  243 +const openForm = (type: string, id?: number) => {
  244 + formRef.value.open(type, id)
  245 +}
243 246  
244 247 /** 删除按钮操作 */
245 248 const handleDelete = async (id: number) => {
... ...