---初始化后台管理web页面项目

src/router/guard/paramMenuGuard.ts

@@ -0,0 +1,66 @@
+import type { Router } from 'vue-router';
+import { configureDynamicParamsMenu } from '../helper/menuHelper';
+import { Menu } from '../types';
+import { PermissionModeEnum } from '/@/enums/appEnum';
+import { useAppStoreWithOut } from '/@/store/modules/app';
+
+import { usePermissionStoreWithOut } from '/@/store/modules/permission';
+
+export function createParamMenuGuard(router: Router) {
+  const permissionStore = usePermissionStoreWithOut();
+  router.beforeEach(async (to, _, next) => {
+    to.fullPath = (to.fullPath as string) + convertQuery(to);
+
+    // filter no name route
+    if (!to.name) {
+      next();
+      return;
+    }
+
+    // menu has been built.
+    if (!permissionStore.getIsDynamicAddedRoute) {
+      next();
+      return;
+    }
+
+    let menus: Menu[] = [];
+    if (isBackMode()) {
+      menus = permissionStore.getBackMenuList;
+    } else if (isRouteMappingMode()) {
+      menus = permissionStore.getFrontMenuList;
+    }
+    menus.forEach((item) => configureDynamicParamsMenu(item, to.params));
+
+    next();
+  });
+}
+
+const convertQuery = (to) => {
+  try {
+    if (to.meta.remark && to.meta.remark.indexOf('?') > -1 && to.fullPath.indexOf('?') <= -1) {
+      const str = to.meta.remark.substring(1);
+      const paramArray = str.split('&');
+      for (const param of paramArray) {
+        const p = param.split('=');
+        to.query[p[0]] = p[1];
+      }
+      return to.meta.remark;
+    }
+    return '';
+  } catch {
+    return '';
+  }
+};
+
+const getPermissionMode = () => {
+  const appStore = useAppStoreWithOut();
+  return appStore.getProjectConfig.permissionMode;
+};
+
+const isBackMode = () => {
+  return getPermissionMode() === PermissionModeEnum.BACK;
+};
+
+const isRouteMappingMode = () => {
+  return getPermissionMode() === PermissionModeEnum.ROUTE_MAPPING;
+};