refactor: ♻️ 优化代码生成页面

This commit is contained in:
ray
2024-09-01 15:36:43 +08:00
parent d4a658bbe9
commit 8a27e74acd

View File

@@ -115,14 +115,6 @@
</el-row> </el-row>
<el-row> <el-row>
<el-col :span="12">
<el-form-item label="模块名">
<el-input
v-model="genConfigFormData.moduleName"
placeholder="system"
/>
</el-form-item>
</el-col>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="包名"> <el-form-item label="包名">
<el-input <el-input
@@ -131,6 +123,14 @@
/> />
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="12">
<el-form-item label="模块名">
<el-input
v-model="genConfigFormData.moduleName"
placeholder="system"
/>
</el-form-item>
</el-col>
</el-row> </el-row>
<el-row> <el-row>
@@ -154,7 +154,23 @@
<el-row> <el-row>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="上级菜单"> <el-form-item>
<template #label>
<div class="flex-y-between">
<span>上级菜单</span>
<el-tooltip effect="dark">
<template #content>
选择上级菜单生成代码后会自动创建对应菜单
<br />
注意1生成菜单后需分配权限给角色否则菜单将无法显示
<br />
注意2演示环境默认不生成菜单如需生成请在本地部署数据库
</template>
<i-ep-QuestionFilled class="cursor-pointer" />
</el-tooltip>
</div>
</template>
<el-tree-select <el-tree-select
v-model="genConfigFormData.parentMenuId" v-model="genConfigFormData.parentMenuId"
placeholder="选择上级菜单" placeholder="选择上级菜单"
@@ -435,6 +451,13 @@ import GeneratorAPI, {
import DictAPI from "@/api/dict"; import DictAPI from "@/api/dict";
import MenuAPI from "@/api/menu"; import MenuAPI from "@/api/menu";
interface TreeNode {
label: string;
content?: string;
children?: TreeNode[];
}
const treeData = ref<TreeNode[]>([]);
const queryFormRef = ref(ElForm); const queryFormRef = ref(ElForm);
const queryParams = reactive<TablePageQuery>({ const queryParams = reactive<TablePageQuery>({
pageNum: 1, pageNum: 1,
@@ -473,12 +496,12 @@ const active = ref(0);
const currentTableName = ref(""); const currentTableName = ref("");
const sortFlag = ref<Object>(); const sortFlag = ref<Object>();
interface TreeNode { // 查询是否全选
label: string; const isCheckAllQuery = ref(false);
content?: string; // 列表是否全选
children?: TreeNode[]; const isCheckAllList = ref(false);
} // 表单是否全选
const treeData = ref<TreeNode[]>([]); const isCheckAllForm = ref(false);
watch(active, (val) => { watch(active, (val) => {
if (val === 0) { if (val === 0) {
@@ -550,6 +573,7 @@ const setNodeSort = (oldIndex: number, newIndex: number) => {
}); });
}; };
/** 上一步 */
function handlePrevClick() { function handlePrevClick() {
if (active.value === 2) { if (active.value === 2) {
//这里需要重新获取一次数据,如果第一次生成代码后,再次点击上一步,数据不重新获取,再次点击下一步,会再次插入数据,导致索引重复报错 //这里需要重新获取一次数据,如果第一次生成代码后,再次点击上一步,数据不重新获取,再次点击下一步,会再次插入数据,导致索引重复报错
@@ -571,6 +595,7 @@ function handlePrevClick() {
if (active.value-- <= 0) active.value = 0; if (active.value-- <= 0) active.value = 0;
} }
/** 下一步 */
function handleNextClick() { function handleNextClick() {
if (active.value === 0) { if (active.value === 0) {
initSort(); initSort();
@@ -680,6 +705,7 @@ function handleResetConfig(tableName: string) {
type FieldConfigKey = "isShowInQuery" | "isShowInList" | "isShowInForm"; type FieldConfigKey = "isShowInQuery" | "isShowInList" | "isShowInForm";
/** 全选 */
const toggleCheckAll = (key: FieldConfigKey, value: boolean) => { const toggleCheckAll = (key: FieldConfigKey, value: boolean) => {
const fieldConfigs = genConfigFormData.value?.fieldConfigs; const fieldConfigs = genConfigFormData.value?.fieldConfigs;
@@ -690,10 +716,6 @@ const toggleCheckAll = (key: FieldConfigKey, value: boolean) => {
} }
}; };
const isCheckAllQuery = ref(false);
const isCheckAllList = ref(false);
const isCheckAllForm = ref(false);
const checkAllSelected = (key: keyof FieldConfig, isCheckAllRef: any) => { const checkAllSelected = (key: keyof FieldConfig, isCheckAllRef: any) => {
const fieldConfigs = genConfigFormData.value?.fieldConfigs || []; const fieldConfigs = genConfigFormData.value?.fieldConfigs || [];
isCheckAllRef.value = fieldConfigs.every( isCheckAllRef.value = fieldConfigs.every(
@@ -740,7 +762,6 @@ function buildTree(
const parts = item.path.split(separator); const parts = item.path.split(separator);
// 定义特殊路径 // 定义特殊路径
// TODO: 如果菜单有多个节点,需要将此菜单作为独立一级的节点,而不是合并到上一级。 按照此规则, com.youlai.system 则是三个节点,而不是合并到一起,但是这里需要将 com.youlai.system 合并到一起,所以需要特殊处理
const specialPaths = [ const specialPaths = [
"src" + separator + "main", "src" + separator + "main",
"java", "java",
@@ -753,8 +774,6 @@ function buildTree(
).replace(/\./g, separator), ).replace(/\./g, separator),
]; ];
console.log("specialPaths", specialPaths);
// 检查路径中的特殊部分并合并它们 // 检查路径中的特殊部分并合并它们
const mergedParts: string[] = []; const mergedParts: string[] = [];
let buffer: string[] = []; let buffer: string[] = [];