feat: allow configuration of staticRroues (#4746)

* feat: allow configuration of staticRroues

* chore: update deps

* chore: typo

apps/web-antd/src/router/guard.ts

@@ -8,7 +8,7 @@ import { startProgress, stopProgress } from '@vben/utils';
 import { useTitle } from '@vueuse/core';
 
 import { $t } from '#/locales';
-import { coreRouteNames, dynamicRoutes } from '#/router/routes';
+import { accessRoutes, coreRouteNames } from '#/router/routes';
 import { useAuthStore } from '#/store';
 
 import { generateAccess } from './access';
@@ -105,7 +105,7 @@ function setupAccessGuard(router: Router) {
       roles: userRoles,
       router,
       // 则会在菜单中显示，但是访问会被重定向到403
-      routes: dynamicRoutes,
+      routes: accessRoutes,
     });
 
     // 保存菜单信息和路由信息

apps/web-antd/src/router/routes/index.ts

@@ -10,12 +10,16 @@ const dynamicRouteFiles = import.meta.glob('./modules/**/*.ts', {
 
 // 有需要可以自行打开注释，并创建文件夹
 // const externalRouteFiles = import.meta.glob('./external/**/*.ts', { eager: true });
+// const staticRouteFiles = import.meta.glob('./static/**/*.ts', { eager: true });
 
 /** 动态路由 */
 const dynamicRoutes: RouteRecordRaw[] = mergeRouteModules(dynamicRouteFiles);
 
-/** 外部路由列表，访问这些页面可以不需要Layout，可能用于内嵌在别的系统 */
+/** 外部路由列表，访问这些页面可以不需要Layout，可能用于内嵌在别的系统(不会显示在菜单中) */
 // const externalRoutes: RouteRecordRaw[] = mergeRouteModules(externalRouteFiles);
+/** 不需要权限的菜单列表（会显示在菜单中） */
+// const staticRoutes: RouteRecordRaw[] = mergeRouteModules(staticRouteFiles);
+const staticRoutes: RouteRecordRaw[] = [];
 const externalRoutes: RouteRecordRaw[] = [];
 
 /** 路由列表，由基本路由+静态路由组成 */
@@ -28,4 +32,5 @@ const routes: RouteRecordRaw[] = [
 /** 基本路由列表，这些路由不需要进入权限拦截 */
 const coreRouteNames = traverseTreeValues(coreRoutes, (route) => route.name);
 
-export { coreRouteNames, dynamicRoutes, routes };
+const accessRoutes = [...dynamicRoutes, ...staticRoutes];
+export { accessRoutes, coreRouteNames, routes };

apps/web-ele/src/router/guard.ts

@@ -8,7 +8,7 @@ import { startProgress, stopProgress } from '@vben/utils';
 import { useTitle } from '@vueuse/core';
 
 import { $t } from '#/locales';
-import { coreRouteNames, dynamicRoutes } from '#/router/routes';
+import { accessRoutes, coreRouteNames } from '#/router/routes';
 import { useAuthStore } from '#/store';
 
 import { generateAccess } from './access';
@@ -105,7 +105,7 @@ function setupAccessGuard(router: Router) {
       roles: userRoles,
       router,
       // 则会在菜单中显示，但是访问会被重定向到403
-      routes: dynamicRoutes,
+      routes: accessRoutes,
     });
 
     // 保存菜单信息和路由信息

apps/web-ele/src/router/routes/index.ts

@@ -10,12 +10,16 @@ const dynamicRouteFiles = import.meta.glob('./modules/**/*.ts', {
 
 // 有需要可以自行打开注释，并创建文件夹
 // const externalRouteFiles = import.meta.glob('./external/**/*.ts', { eager: true });
+// const staticRouteFiles = import.meta.glob('./static/**/*.ts', { eager: true });
 
 /** 动态路由 */
 const dynamicRoutes: RouteRecordRaw[] = mergeRouteModules(dynamicRouteFiles);
 
-/** 外部路由列表，访问这些页面可以不需要Layout，可能用于内嵌在别的系统 */
+/** 外部路由列表，访问这些页面可以不需要Layout，可能用于内嵌在别的系统(不会显示在菜单中) */
 // const externalRoutes: RouteRecordRaw[] = mergeRouteModules(externalRouteFiles);
+/** 不需要权限的菜单列表（会显示在菜单中） */
+// const staticRoutes: RouteRecordRaw[] = mergeRouteModules(staticRouteFiles);
+const staticRoutes: RouteRecordRaw[] = [];
 const externalRoutes: RouteRecordRaw[] = [];
 
 /** 路由列表，由基本路由+静态路由组成 */
@@ -28,4 +32,5 @@ const routes: RouteRecordRaw[] = [
 /** 基本路由列表，这些路由不需要进入权限拦截 */
 const coreRouteNames = traverseTreeValues(coreRoutes, (route) => route.name);
 
-export { coreRouteNames, dynamicRoutes, routes };
+const accessRoutes = [...dynamicRoutes, ...staticRoutes];
+export { accessRoutes, coreRouteNames, routes };

apps/web-naive/src/router/guard.ts

@@ -8,7 +8,7 @@ import { startProgress, stopProgress } from '@vben/utils';
 import { useTitle } from '@vueuse/core';
 
 import { $t } from '#/locales';
-import { coreRouteNames, dynamicRoutes } from '#/router/routes';
+import { accessRoutes, coreRouteNames } from '#/router/routes';
 import { useAuthStore } from '#/store';
 
 import { generateAccess } from './access';
@@ -104,7 +104,7 @@ function setupAccessGuard(router: Router) {
       roles: userRoles,
       router,
       // 则会在菜单中显示，但是访问会被重定向到403
-      routes: dynamicRoutes,
+      routes: accessRoutes,
     });
 
     // 保存菜单信息和路由信息

apps/web-naive/src/router/routes/index.ts

@@ -10,12 +10,16 @@ const dynamicRouteFiles = import.meta.glob('./modules/**/*.ts', {
 
 // 有需要可以自行打开注释，并创建文件夹
 // const externalRouteFiles = import.meta.glob('./external/**/*.ts', { eager: true });
+// const staticRouteFiles = import.meta.glob('./static/**/*.ts', { eager: true });
 
 /** 动态路由 */
 const dynamicRoutes: RouteRecordRaw[] = mergeRouteModules(dynamicRouteFiles);
 
-/** 外部路由列表，访问这些页面可以不需要Layout，可能用于内嵌在别的系统 */
+/** 外部路由列表，访问这些页面可以不需要Layout，可能用于内嵌在别的系统(不会显示在菜单中) */
 // const externalRoutes: RouteRecordRaw[] = mergeRouteModules(externalRouteFiles);
+/** 不需要权限的菜单列表（会显示在菜单中） */
+// const staticRoutes: RouteRecordRaw[] = mergeRouteModules(staticRouteFiles);
+const staticRoutes: RouteRecordRaw[] = [];
 const externalRoutes: RouteRecordRaw[] = [];
 
 /** 路由列表，由基本路由+静态路由组成 */
@@ -28,4 +32,5 @@ const routes: RouteRecordRaw[] = [
 /** 基本路由列表，这些路由不需要进入权限拦截 */
 const coreRouteNames = traverseTreeValues(coreRoutes, (route) => route.name);
 
-export { coreRouteNames, dynamicRoutes, routes };
+const accessRoutes = [...dynamicRoutes, ...staticRoutes];
+export { accessRoutes, coreRouteNames, routes };

packages/@core/ui-kit/form-ui/src/form-render/form.vue

@@ -81,7 +81,10 @@ const formCollapsed = computed(() => {
 });
 
 const computedSchema = computed(
-  (): ({ commonComponentProps: Record<string, any> } & FormSchema)[] => {
+  (): ({
+    commonComponentProps: Record<string, any>;
+    formFieldProps: Record<string, any>;
+  } & Omit<FormSchema, 'formFieldProps'>)[] => {
     const {
       componentProps = {},
       controlClass = '',

playground/src/router/guard.ts

@@ -8,7 +8,7 @@ import { startProgress, stopProgress } from '@vben/utils';
 import { useTitle } from '@vueuse/core';
 
 import { $t } from '#/locales';
-import { coreRouteNames, dynamicRoutes } from '#/router/routes';
+import { accessRoutes, coreRouteNames } from '#/router/routes';
 import { useAuthStore } from '#/store';
 
 import { generateAccess } from './access';
@@ -103,7 +103,7 @@ function setupAccessGuard(router: Router) {
       roles: userRoles,
       router,
       // 则会在菜单中显示，但是访问会被重定向到403
-      routes: dynamicRoutes,
+      routes: accessRoutes,
     });
 
     // 保存菜单信息和路由信息

playground/src/router/routes/index.ts

@@ -10,12 +10,16 @@ const dynamicRouteFiles = import.meta.glob('./modules/**/*.ts', {
 
 // 有需要可以自行打开注释，并创建文件夹
 // const externalRouteFiles = import.meta.glob('./external/**/*.ts', { eager: true });
+// const staticRouteFiles = import.meta.glob('./static/**/*.ts', { eager: true });
 
 /** 动态路由 */
 const dynamicRoutes: RouteRecordRaw[] = mergeRouteModules(dynamicRouteFiles);
 
-/** 外部路由列表，访问这些页面可以不需要Layout，可能用于内嵌在别的系统 */
+/** 外部路由列表，访问这些页面可以不需要Layout，可能用于内嵌在别的系统(不会显示在菜单中) */
 // const externalRoutes: RouteRecordRaw[] = mergeRouteModules(externalRouteFiles);
+/** 不需要权限的菜单列表（会显示在菜单中） */
+// const staticRoutes: RouteRecordRaw[] = mergeRouteModules(staticRouteFiles);
+const staticRoutes: RouteRecordRaw[] = [];
 const externalRoutes: RouteRecordRaw[] = [];
 
 /** 路由列表，由基本路由+静态路由组成 */
@@ -28,4 +32,6 @@ const routes: RouteRecordRaw[] = [
 /** 基本路由列表，这些路由不需要进入权限拦截 */
 const coreRouteNames = traverseTreeValues(coreRoutes, (route) => route.name);
 
-export { coreRouteNames, dynamicRoutes, routes };
+const accessRoutes = [...dynamicRoutes, ...staticRoutes];
+
+export { accessRoutes, coreRouteNames, routes };

pnpm-workspace.yaml

@@ -21,8 +21,8 @@ catalog:
   '@commitlint/config-conventional': ^19.5.0
   '@ctrl/tinycolor': ^4.1.0
   '@eslint/js': ^9.13.0
-  '@faker-js/faker': ^9.0.3
-  '@iconify/json': ^2.2.263
+  '@faker-js/faker': ^9.1.0
+  '@iconify/json': ^2.2.264
   '@iconify/tailwind': ^1.1.3
   '@iconify/vue': ^4.1.2
   '@intlify/core-base': ^10.0.4
@@ -30,7 +30,7 @@ catalog:
   '@jspm/generator': ^2.4.1
   '@manypkg/get-packages': ^2.2.2
   '@nolebase/vitepress-plugin-git-changelog': ^2.6.1
-  '@playwright/test': ^1.48.1
+  '@playwright/test': ^1.48.2
   '@pnpm/workspace.read-manifest': ^2.2.1
   '@stylistic/stylelint-plugin': ^3.1.1
   '@tailwindcss/nesting': 0.0.0-insiders.565cd3e
@@ -42,14 +42,14 @@ catalog:
   '@types/html-minifier-terser': ^7.0.2
   '@types/jsonwebtoken': ^9.0.7
   '@types/lodash.clonedeep': ^4.5.9
-  '@types/node': ^22.7.9
+  '@types/node': ^22.8.1
   '@types/nprogress': ^0.2.3
   '@types/postcss-import': ^14.0.3
   '@types/qrcode': ^1.5.5
   '@types/sortablejs': ^1.15.8
   '@typescript-eslint/eslint-plugin': ^8.11.0
   '@typescript-eslint/parser': ^8.11.0
-  '@vee-validate/zod': ^4.14.4
+  '@vee-validate/zod': ^4.14.6
   '@vite-pwa/vitepress': ^0.5.3
   '@vitejs/plugin-vue': ^5.1.4
   '@vitejs/plugin-vue-jsx': ^4.0.1
@@ -98,7 +98,7 @@ catalog:
   eslint-plugin-unused-imports: ^4.1.4
   eslint-plugin-vitest: ^0.5.4
   eslint-plugin-vue: ^9.29.1
-  execa: ^9.4.1
+  execa: ^9.5.0
   find-up: ^7.0.0
   get-port: ^7.1.0
   globals: ^15.11.0
@@ -119,9 +119,9 @@ catalog:
   nprogress: ^0.2.0
   ora: ^8.1.0
   pinia: 2.2.2
-  pinia-plugin-persistedstate: ^4.1.1
+  pinia-plugin-persistedstate: ^4.1.2
   pkg-types: ^1.2.1
-  playwright: ^1.48.1
+  playwright: ^1.48.2
   postcss: ^8.4.47
   postcss-antd-fixes: ^0.2.0
   postcss-html: ^1.7.0
@@ -135,7 +135,7 @@ catalog:
   radix-vue: ^1.9.7
   resolve.exports: ^2.0.2
   rimraf: ^6.0.1
-  rollup: ^4.24.0
+  rollup: ^4.24.1
   rollup-plugin-visualizer: ^5.12.0
   sass: 1.79.5
   sortablejs: ^1.15.3
@@ -156,7 +156,7 @@ catalog:
   typescript: ^5.6.3
   unbuild: ^2.0.0
   unplugin-element-plus: ^0.8.0
-  vee-validate: ^4.14.4
+  vee-validate: ^4.14.6
   vite: ^5.4.10
   vite-plugin-compression: ^0.5.1
   vite-plugin-dts: 4.2.1
@@ -164,7 +164,7 @@ catalog:
   vite-plugin-lazy-import: ^1.0.7
   vite-plugin-lib-inject-css: ^2.1.1
   vite-plugin-pwa: ^0.20.5
-  vite-plugin-vue-devtools: ^7.5.3
+  vite-plugin-vue-devtools: ^7.5.4
   vitepress: ^1.4.1
   vitepress-plugin-group-icons: ^1.3.0
   vitest: ^2.1.3
@@ -172,9 +172,9 @@ catalog:
   vue-eslint-parser: ^9.4.3
   vue-i18n: ^10.0.4
   vue-router: ^4.4.5
-  vue-tsc: ^2.1.6
-  vxe-pc-ui: ^4.2.28
-  vxe-table: ^4.7.94
+  vue-tsc: ^2.1.8
+  vxe-pc-ui: ^4.2.33
+  vxe-table: ^4.7.97
   watermark-js-plus: ^1.5.7
   zod: ^3.23.8
   zod-defaults: ^0.1.3