feat: 设置菜单 关联

src/router/index.ts

@@ -18,6 +18,8 @@ type RouteMeta = {
 	// // 类型
 	// type: string;
 }
+// 是否展示示例相关菜单
+const showDemoRoutes = true
 export const constantRoutes: Array<AppRouteRecordRaw> = [
 	{
 		path: '/redirect',
@@ -59,86 +61,90 @@ export const constantRoutes: Array<AppRouteRecordRaw> = [
 			}
 		]
 	},
-	// 组件示例
-	{
-		path: '/components',
-		component: Layout,
-		redirect: '/index',
-		children: [
-			{
-				path: 'index',
-				component: () => import('@/views/components/index.vue'),
-				name: 'comps',
-				meta: { title: 'comps', icon: 'excel' }
-			}
-		]
-	},
-	// 表单示例
-	{
-		path: '/form',
-		component: Layout,
-		// meta: { title: 'Form', icon: 'guide' },
-		redirect: '/default',
-		children: [
-			{
-				path: 'default',
-				component: () => import('@/views/form/default.vue'),
-				name: 'FormDefault',
-				meta: { title: 'form', icon: 'guide' }
-			}
-		]
-	},
-	// 列表示例
-	{
-		path: '/table',
-		component: Layout,
-		redirect: '/default',
-		meta: { title: 'table', icon: 'table' },
-		children: [
-			{
-				path: 'default',
-				component: () => import('@/views/table/default.vue'),
-				name: 'TableDefault',
-				meta: { title: 'table' /*, icon: 'table'*/ }
-			},
-			{
-				path: 'multipleHeader',
-				component: () => import('@/views/table/multipleHeader.vue'),
-				name: 'multipleHeader',
-				meta: { title: 'multipleHeader' }
-			},
-			{
-				path: 'treeTable',
-				component: () => import('@/views/table/treeTable.vue'),
-				name: 'treeTable',
-				meta: { title: 'treeTable' }
-			},
-			{
-				path: 'mergeCells',
-				component: () => import('@/views/table/mergeCells.vue'),
-				name: 'mergeCells',
-				meta: { title: 'mergeCells' }
-			},
-			{
-				path: 'footerSummary',
-				component: () => import('@/views/table/footerSummary.vue'),
-				name: 'footerSummary',
-				meta: { title: 'footerSummary' }
-			},
-			{
-				path: 'expandTable',
-				component: () => import('@/views/table/expandTable.vue'),
-				name: 'expandTable',
-				meta: { title: 'expandTable' }
-			},
-			{
-				path: 'resizeParentHeightTable',
-				component: () => import('@/views/table/resizeParentHeightTable.vue'),
-				name: 'resizeParentHeightTable',
-				meta: { title: 'resizeParentHeightTable' }
-			}
-		]
-	},
+	...(showDemoRoutes
+		? [
+				// 组件示例
+				{
+					path: '/components',
+					component: Layout,
+					redirect: '/index',
+					children: [
+						{
+							path: 'index',
+							component: () => import('@/views/components/index.vue'),
+							name: 'comps',
+							meta: { title: 'comps', icon: 'excel' }
+						}
+					]
+				},
+				// 表单示例
+				{
+					path: '/form',
+					component: Layout,
+					// meta: { title: 'Form', icon: 'guide' },
+					redirect: '/default',
+					children: [
+						{
+							path: 'default',
+							component: () => import('@/views/form/default.vue'),
+							name: 'FormDefault',
+							meta: { title: 'form', icon: 'guide' }
+						}
+					]
+				},
+				// 列表示例
+				{
+					path: '/table',
+					component: Layout,
+					redirect: '/default',
+					meta: { title: 'table', icon: 'table' },
+					children: [
+						{
+							path: 'default',
+							component: () => import('@/views/table/default.vue'),
+							name: 'TableDefault',
+							meta: { title: 'table' /*, icon: 'table'*/ }
+						},
+						{
+							path: 'multipleHeader',
+							component: () => import('@/views/table/multipleHeader.vue'),
+							name: 'multipleHeader',
+							meta: { title: 'multipleHeader' }
+						},
+						{
+							path: 'treeTable',
+							component: () => import('@/views/table/treeTable.vue'),
+							name: 'treeTable',
+							meta: { title: 'treeTable' }
+						},
+						{
+							path: 'mergeCells',
+							component: () => import('@/views/table/mergeCells.vue'),
+							name: 'mergeCells',
+							meta: { title: 'mergeCells' }
+						},
+						{
+							path: 'footerSummary',
+							component: () => import('@/views/table/footerSummary.vue'),
+							name: 'footerSummary',
+							meta: { title: 'footerSummary' }
+						},
+						{
+							path: 'expandTable',
+							component: () => import('@/views/table/expandTable.vue'),
+							name: 'expandTable',
+							meta: { title: 'expandTable' }
+						},
+						{
+							path: 'resizeParentHeightTable',
+							component: () => import('@/views/table/resizeParentHeightTable.vue'),
+							name: 'resizeParentHeightTable',
+							meta: { title: 'resizeParentHeightTable' }
+						}
+					]
+				}
+		  ]
+		: [])
 	// 仅用于研发测试 START
 	/*{
 		path: '/test',
@@ -161,68 +167,6 @@ export const constantRoutes: Array<AppRouteRecordRaw> = [
 			}
 		]
 	},*/
-	{
-		path: '/setting',
-		component: Layout,
-		meta: { title: '设置', icon: 'guide' },
-		redirect: '/setting/user',
-		children: [
-			{
-				path: 'user',
-				component: () => import('@/views/setting/user/index.vue'),
-				name: 'user',
-				meta: { title: '用户管理', icon: '' }
-			},
-			{
-				path: 'post',
-				component: () => import('@/views/setting/post/index.vue'),
-				name: 'post',
-				meta: { title: '岗位管理', icon: '' }
-			},
-			{
-				path: 'role',
-				component: () => import('@/views/setting/role/index.vue'),
-				name: 'role',
-				meta: { title: '角色管理', icon: '' }
-			},
-			{
-				path: 'app',
-				component: () => import('@/views/setting/app/index.vue'),
-				name: 'app',
-				meta: { title: '应用管理', icon: '' }
-			},
-			{
-				path: 'department',
-				component: () => import('@/views/setting/department/index.vue'),
-				name: 'department',
-				meta: { title: '部门管理', icon: '' }
-			},
-			{
-				path: 'region',
-				component: () => import('@/views/setting/region/index.vue'),
-				name: 'region',
-				meta: { title: '行政区域', icon: '' }
-			},
-			{
-				path: 'configure',
-				component: () => import('@/views/setting/configure/index.vue'),
-				name: 'configure',
-				meta: { title: '扩展配置', icon: '' }
-			},
-			{
-				path: 'dict',
-				component: () => import('@/views/setting/dict/index.vue'),
-				name: 'dict',
-				meta: { title: '字典管理', icon: '' }
-			},
-			{
-				path: 'menu',
-				component: () => import('@/views/setting/menu/index.vue'),
-				name: 'menu',
-				meta: { title: '菜单管理', icon: '' }
-			}
-		]
-	}
 	// 仅用于研发测试 END
 	// 外部链接
 	/*{
@@ -276,6 +220,80 @@ export const local_permissionsRoutes: Array<AppRouteRecordRaw> = [
 		]
 	},
 	// todo 请添加相关新路由描述
+	// 设置 权限
+	{
+		path: '/setting',
+		// component: Layout,
+		component: 'Layout',
+		meta: { title: '设置', icon: 'guide' },
+		redirect: '/setting/user',
+		children: [
+			{
+				path: 'user',
+				// component: () => import('@/views/setting/user/index.vue'),
+				component: 'setting/user/index',
+				name: 'user',
+				meta: { title: '用户管理', icon: '' }
+			},
+			{
+				path: 'post',
+				// component: () => import('@/views/setting/post/index.vue'),
+				component: 'setting/post/index',
+				name: 'post',
+				meta: { title: '岗位管理', icon: '' }
+			},
+			{
+				path: 'role',
+				// component: () => import('@/views/setting/role/index.vue'),
+				component: 'setting/role/index',
+				name: 'role',
+				meta: { title: '角色管理', icon: '' }
+			},
+			{
+				path: 'app',
+				// component: () => import('@/views/setting/app/index.vue'),
+				component: 'setting/app/index',
+				name: 'app',
+				meta: { title: '应用管理', icon: '' }
+			},
+
+			{
+				path: 'department',
+				// component: () => import('@/views/setting/department/index.vue'),
+				component: 'setting/department/index',
+				name: 'department',
+				meta: { title: '部门管理', icon: '' }
+			},
+			{
+				path: 'region',
+				// component: () => import('@/views/setting/region/index.vue'),
+				component: 'setting/region/index',
+				name: 'region',
+				meta: { title: '行政区域', icon: '' }
+			},
+			{
+				path: 'configure',
+				// component: () => import('@/views/setting/configure/index.vue'),
+				component: 'setting/configure/index',
+				name: 'configure',
+				meta: { title: '扩展配置', icon: '' }
+			},
+			{
+				path: 'dict',
+				// component: () => import('@/views/setting/dict/index.vue'),
+				component: 'setting/dict/index',
+				name: 'dict',
+				meta: { title: '字典管理', icon: '' }
+			},
+			{
+				path: 'menu',
+				// component: () => import('@/views/setting/menu/index.vue'),
+				component: 'setting/menu/index',
+				name: 'menu',
+				meta: { title: '菜单管理', icon: '' }
+			}
+		]
+	},
 	// 流程管理 权限
 	{
 		path: '/flow',

src/views/setting/menu/save.vue

@@ -55,6 +55,7 @@
 						</template>
 						<el-input v-model="form.component" clearable placeholder="">
 							<template #prepend>views/</template>
+							<template #append>.vue</template>
 						</el-input>
 						<div class="el-form-item-msg">如父节点、链接或Iframe等没有视图的菜单不需要填写</div>
 					</el-form-item>