mirror of
https://gitee.com/huangge1199_admin/vue-pro.git
synced 2024-11-23 07:41:53 +08:00
代码生成：完善 Vue3 标准模版的表单
This commit is contained in:
YunaiV
parent
0ff007c783
commit
13f9d0f49f
@ -97,20 +97,21 @@ public class CodegenEngine {
|
||||
* value：生成的路径
|
||||
*/
|
||||
private static final Table<Integer, String, String> FRONT_TEMPLATES = ImmutableTable.<Integer, String, String>builder()
|
||||
// Vue2
|
||||
// Vue2 标准模版
|
||||
.put(CodegenFrontTypeEnum.VUE2.getType(), vueTemplatePath("views/index.vue"),
|
||||
vueFilePath("views/${table.moduleName}/${classNameVar}/index.vue"))
|
||||
.put(CodegenFrontTypeEnum.VUE2.getType(), vueTemplatePath("api/api.js"),
|
||||
vueFilePath("api/${table.moduleName}/${classNameVar}.js"))
|
||||
// Vue3
|
||||
// Vue3 标准模版
|
||||
.put(CodegenFrontTypeEnum.VUE3.getType(), vue3TemplatePath("views/index.vue"),
|
||||
vue3FilePath("views/${table.moduleName}/${classNameVar}/index.vue"))
|
||||
.put(CodegenFrontTypeEnum.VUE3.getType(), vue3TemplatePath("views/form.vue"),
|
||||
vue3FilePath("views/${table.moduleName}/${classNameVar}/form.vue"))
|
||||
// .put(CodegenFrontTypeEnum.VUE3.getType(), vue3TemplatePath("views/data.ts"),
|
||||
// vue3FilePath("views/${table.moduleName}/${classNameVar}/${classNameVar}.data.ts"))
|
||||
vue3FilePath("views/${table.moduleName}/${classNameVar}/${simpleClassName}Form.vue"))
|
||||
.put(CodegenFrontTypeEnum.VUE3.getType(), vue3TemplatePath("api/api.ts"),
|
||||
vue3FilePath("api/${table.moduleName}/${classNameVar}/index.ts"))
|
||||
// Vue3 Schema 模版
|
||||
// .put(CodegenFrontTypeEnum.VUE3.getType(), vue3TemplatePath("views/data.ts"),
|
||||
// vue3FilePath("views/${table.moduleName}/${classNameVar}/${classNameVar}.data.ts"))
|
||||
.build();
|
||||
|
||||
@Resource
|
||||
@ -203,6 +204,8 @@ public class CodegenEngine {
|
||||
getStr(bindingMap, "basePackage").replaceAll("\\.", "/"));
|
||||
filePath = StrUtil.replace(filePath, "${classNameVar}",
|
||||
getStr(bindingMap, "classNameVar"));
|
||||
filePath = StrUtil.replace(filePath, "${simpleClassName}",
|
||||
getStr(bindingMap, "simpleClassName"));
|
||||
// sceneEnum 包含的字段
|
||||
CodegenSceneEnum sceneEnum = (CodegenSceneEnum) bindingMap.get("sceneEnum");
|
||||
filePath = StrUtil.replace(filePath, "${sceneEnum.prefixClass}", sceneEnum.getPrefixClass());
|
||||
|
||||
@ -27,17 +27,17 @@
|
||||
<el-form-item label="${comment}" prop="${javaField}">
|
||||
<el-input v-model="formData.${javaField}" placeholder="请输入${comment}" />
|
||||
</el-form-item>
|
||||
#elseif($column.htmlType == "imageUpload")## 图片上传 TODO 芋艿：待测试
|
||||
#elseif($column.htmlType == "imageUpload")## 图片上传
|
||||
#set ($hasImageUploadColumn = true)
|
||||
<el-form-item label="${comment}">
|
||||
<imageUpload v-model="formData.${javaField}"/>
|
||||
</el-form-item>
|
||||
#elseif($column.htmlType == "fileUpload")## 文件上传 TODO 芋艿：待测试
|
||||
<el-form-item label="${comment}">
|
||||
<UploadImg v-model="formData.${javaField}" />
|
||||
</el-form-item>
|
||||
#elseif($column.htmlType == "fileUpload")## 文件上传
|
||||
#set ($hasFileUploadColumn = true)
|
||||
<el-form-item label="${comment}">
|
||||
<fileUpload v-model="formData.${javaField}"/>
|
||||
</el-form-item>
|
||||
#elseif($column.htmlType == "editor")## 文本编辑器 TODO 芋艿：待测试
|
||||
<el-form-item label="${comment}">
|
||||
<UploadFile v-model="formData.${javaField}" />
|
||||
</el-form-item>
|
||||
#elseif($column.htmlType == "editor")## 文本编辑器
|
||||
<el-form-item label="${comment}">
|
||||
<Editor :model-value="formData.${javaField}" height="150px" />
|
||||
</el-form-item>
|
||||
@ -59,19 +59,20 @@
|
||||
#end
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
#elseif($column.htmlType == "checkbox")## 多选框 TODO 芋艿：待测试
|
||||
#elseif($column.htmlType == "checkbox")## 多选框
|
||||
<el-form-item label="${comment}" prop="${javaField}">
|
||||
<el-checkbox-group v-model="formData.${javaField}">
|
||||
#if ("" != $dictType)## 有数据字典
|
||||
#if (!$dictMethods.contains($dictMethod))## 如果不存在，则添加到 dictMethods 数组中，后续好 import
|
||||
#set($ignore = $dictMethods.add($dictMethod) )
|
||||
#end
|
||||
<el-checkbox
|
||||
v-for="dict in $dictMethod(DICT_TYPE.$dictType.toUpperCase())"
|
||||
key="dict.value"
|
||||
:label="dict.value">
|
||||
{{dict.label}}
|
||||
</el-checkbox>
|
||||
<el-checkbox
|
||||
v-for="dict in $dictMethod(DICT_TYPE.$dictType.toUpperCase())"
|
||||
:key="dict.value"
|
||||
:label="dict.value"
|
||||
>
|
||||
{{ dict.label }}
|
||||
</el-checkbox>
|
||||
#else##没数据字典
|
||||
<el-checkbox>请选择字典生成</el-checkbox>
|
||||
#end
|
||||
@ -96,14 +97,19 @@
|
||||
#end
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
#elseif($column.htmlType == "datetime")## 时间框 TODO 芋艿：待测试
|
||||
<el-form-item label="${comment}" prop="${javaField}">
|
||||
<el-date-picker clearable v-model="formData.${javaField}" type="date" value-format="timestamp" placeholder="选择${comment}" />
|
||||
</el-form-item>
|
||||
#elseif($column.htmlType == "textarea")## 文本框 TODO 芋艿：待测试
|
||||
<el-form-item label="${comment}" prop="${javaField}">
|
||||
<el-input v-model="formData.${javaField}" type="textarea" placeholder="请输入${comment}" />
|
||||
</el-form-item>
|
||||
#elseif($column.htmlType == "datetime")## 时间框
|
||||
<el-form-item label="${comment}" prop="${javaField}">
|
||||
<el-date-picker
|
||||
v-model="formData.${javaField}"
|
||||
type="date"
|
||||
value-format="timestamp"
|
||||
placeholder="选择${comment}"
|
||||
/>
|
||||
</el-form-item>
|
||||
#elseif($column.htmlType == "textarea")## 文本框
|
||||
<el-form-item label="${comment}" prop="${javaField}">
|
||||
<el-input v-model="formData.${javaField}" type="textarea" placeholder="请输入${comment}" />
|
||||
</el-form-item>
|
||||
#end
|
||||
#end
|
||||
#end
|
||||
@ -163,7 +169,7 @@ const formRules = reactive({
|
||||
const formRef = ref() // 表单 Ref
|
||||
|
||||
/** 打开弹窗 */
|
||||
const openModal = async (type: string, id?: number) => {
|
||||
const open = async (type: string, id?: number) => {
|
||||
modelVisible.value = true
|
||||
modelTitle.value = t('action.' + type)
|
||||
formType.value = type
|
||||
@ -178,7 +184,7 @@ const openModal = async (type: string, id?: number) => {
|
||||
}
|
||||
}
|
||||
}
|
||||
defineExpose({ openModal }) // 提供 openModal 方法，用于打开弹窗
|
||||
defineExpose({ open }) // 提供 open 方法，用于打开弹窗
|
||||
|
||||
/** 提交表单 */
|
||||
const emit = defineEmits(['success']) // 定义 success 事件，用于操作成功后的回调
|
||||
|
||||
@ -92,12 +92,12 @@
|
||||
<el-form-item>
|
||||
<el-button @click="handleQuery"><Icon icon="ep:search" class="mr-5px" /> 搜索</el-button>
|
||||
<el-button @click="resetQuery"><Icon icon="ep:refresh" class="mr-5px" /> 重置</el-button>
|
||||
#if ($permissionPrefix.length() < 15)
|
||||
<el-button type="primary" @click="openModal('create')" v-hasPermi="['${permissionPrefix}:create']">
|
||||
#if ($permissionPrefix.length() <= 12)
|
||||
<el-button type="primary" @click="openForm('create')" v-hasPermi="['${permissionPrefix}:create']">
|
||||
#else
|
||||
<el-button
|
||||
type="primary"
|
||||
@click="openModal('create')"
|
||||
@click="openForm('create')"
|
||||
v-hasPermi="['${permissionPrefix}:create']"
|
||||
>
|
||||
#end
|
||||
@ -148,7 +148,7 @@
|
||||
<el-button
|
||||
link
|
||||
type="primary"
|
||||
@click="openModal('update', scope.row.id)"
|
||||
@click="openForm('update', scope.row.id)"
|
||||
v-hasPermi="['${permissionPrefix}:update']"
|
||||
>
|
||||
编辑
|
||||
@ -172,6 +172,9 @@
|
||||
@pagination="getList"
|
||||
/>
|
||||
</content-wrap>
|
||||
|
||||
<!-- 表单弹窗：添加/修改 -->
|
||||
<${simpleClassName}Form ref="formRef" @success="getList" />
|
||||
</template>
|
||||
|
||||
<script setup lang="ts" name="${simpleClassName}">
|
||||
@ -181,7 +184,7 @@ import { DICT_TYPE#foreach ($dictMethod in $dictMethods), ${dictMethod}#end } fr
|
||||
import { dateFormatter } from '@/utils/formatTime'
|
||||
import download from '@/utils/download'
|
||||
import * as ${simpleClassName}Api from '@/api/${table.moduleName}/${classNameVar}'
|
||||
// import ConfigForm from './form.vue'
|
||||
import ${simpleClassName}Form from './${simpleClassName}Form.vue'
|
||||
const message = useMessage() // 消息弹窗
|
||||
const { t } = useI18n() // 国际化
|
||||
|
||||
@ -236,10 +239,10 @@ const resetQuery = () => {
|
||||
}
|
||||
|
||||
/** 添加/修改操作 */
|
||||
// const modalRef = ref()
|
||||
// const openModal = (type: string, id?: number) => {
|
||||
// modalRef.value.openModal(type, id)
|
||||
// }
|
||||
const formRef = ref()
|
||||
const openForm = (type: string, id?: number) => {
|
||||
formRef.value.open(type, id)
|
||||
}
|
||||
|
||||
/** 删除按钮操作 */
|
||||
const handleDelete = async (id: number) => {
|
||||
|
||||
Loading…
Reference in New Issue
Block a user