From 75afd44e7ae1afe2f50660ead27541057316b156 Mon Sep 17 00:00:00 2001 From: xiaoxian521 <1923740402@qq.com> Date: Tue, 21 Sep 2021 02:16:46 +0800 Subject: [PATCH] =?UTF-8?q?fix:=20=E4=BF=AE=E5=A4=8D=E6=A0=87=E7=AD=BE?= =?UTF-8?q?=E9=A1=B5=E6=9C=AA=E6=A0=B9=E6=8D=AE=E6=9D=83=E9=99=90=E6=98=BE?= =?UTF-8?q?=E7=A4=BA?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/api/mock.ts | 4 +- src/api/routes.ts | 2 +- src/api/user.ts | 6 +-- src/layout/components/tag/index.vue | 11 +++-- src/main.ts | 1 + src/router/index.ts | 68 +++++++++++++++++------------ src/store/modules/permission.ts | 3 +- src/views/welcome.vue | 58 ++++++++++++++---------- 8 files changed, 91 insertions(+), 62 deletions(-) diff --git a/src/api/mock.ts b/src/api/mock.ts index 0e1a17c0d..9701c797a 100644 --- a/src/api/mock.ts +++ b/src/api/mock.ts @@ -1,11 +1,11 @@ import { http } from "../utils/http"; // 地图数据 -export const mapJson = (data?: object): any => { +export const mapJson = (data?: object) => { return http.request("get", "/getMapInfo", data); }; // echarts数据 -export const echartsJson = (data?: object): any => { +export const echartsJson = (data?: object) => { return http.request("get", "/getEchartsInfo", data); }; diff --git a/src/api/routes.ts b/src/api/routes.ts index 099ab2e86..bbd3527bf 100644 --- a/src/api/routes.ts +++ b/src/api/routes.ts @@ -1,5 +1,5 @@ import { http } from "../utils/http"; -export const getAsyncRoutes = (data?: object): any => { +export const getAsyncRoutes = (data?: object) => { return http.request("get", "/getAsyncRoutes", data); }; diff --git a/src/api/user.ts b/src/api/user.ts index 195670dac..402902d8a 100644 --- a/src/api/user.ts +++ b/src/api/user.ts @@ -1,16 +1,16 @@ import { http } from "../utils/http"; // 获取验证码 -export const getVerify = (): any => { +export const getVerify = () => { return http.request("get", "/captcha"); }; // 登录 -export const getLogin = (data: object): any => { +export const getLogin = (data: object) => { return http.request("post", "/login", data); }; // 注册 -export const getRegist = (data: object): any => { +export const getRegist = (data: object) => { return http.request("post", "/register", data); }; diff --git a/src/layout/components/tag/index.vue b/src/layout/components/tag/index.vue index 3090208fe..7dbdb3ea3 100644 --- a/src/layout/components/tag/index.vue +++ b/src/layout/components/tag/index.vue @@ -45,7 +45,7 @@ :key="key" style="display: flex; align-items: center" > -
  • +
  • {{ item.text }}
    • @@ -112,6 +112,7 @@ let refreshButton = "refresh-button"; let routerArrays: Array = [ { path: "/welcome", + parentPath: "/", meta: { title: "message.hshome", icon: "el-icon-s-home", @@ -215,6 +216,7 @@ export default { if (arrItem.path === value || pathConcat === value) { routerArrays.push({ path: value, + parentPath: `/${parentPath.split("/")[1]}`, meta: arrItem.meta }); st.routesInStorage = routerArrays; @@ -255,6 +257,7 @@ export default { st.routesInStorage = routerArrays = [ { path: "/welcome", + parentPath: "/", meta: { title: "message.hshome", icon: "el-icon-s-home", @@ -294,7 +297,7 @@ export default { } function deleteMenu(item, tag?: string) { - deleteDynamicTag(item, route.path, tag); + deleteDynamicTag(item, item.path, tag); } function onClickDrop(key, item, selectRoute) { @@ -360,8 +363,8 @@ export default { } // 触发右键中菜单的点击事件 - function selectTag(item, key) { - onClickDrop(key, {}, currentSelect.value); + function selectTag(key, item) { + onClickDrop(key, item, currentSelect.value); } function closeMenu() { diff --git a/src/main.ts b/src/main.ts index e2fc3149e..222a11587 100644 --- a/src/main.ts +++ b/src/main.ts @@ -31,6 +31,7 @@ app.use(Storage, { default: Storage.getData(undefined, "routesInStorage") ?? [ { path: "/welcome", + parentPath: "/", meta: { title: "message.hshome", icon: "el-icon-s-home", diff --git a/src/router/index.ts b/src/router/index.ts index 434db5fdb..3442698cb 100644 --- a/src/router/index.ts +++ b/src/router/index.ts @@ -1,25 +1,27 @@ import { - createRouter, - createWebHashHistory, Router, - RouteComponent + createRouter, + RouteComponent, + createWebHashHistory } from "vue-router"; - -import Layout from "/@/layout/index.vue"; -import homeRouter from "./modules/home"; -import flowChartRouter from "./modules/flowchart"; -import editorRouter from "./modules/editor"; -import componentsRouter from "./modules/components"; -import nestedRouter from "./modules/nested"; -import errorRouter from "./modules/error"; -import externalLink from "./modules/externalLink"; -import remainingRouter from "./modules/remaining"; //静态路由 - import { i18n } from "/@/plugins/i18n"; -import { getAsyncRoutes } from "/@/api/routes"; -import { storageSession } from "../utils/storage"; +import NProgress from "/@/utils/progress"; +import { storageSession, storageLocal } from "/@/utils/storage"; import { usePermissionStoreHook } from "/@/store/modules/permission"; +// 静态路由 +import homeRouter from "./modules/home"; +import Layout from "/@/layout/index.vue"; +import errorRouter from "./modules/error"; +import editorRouter from "./modules/editor"; +import nestedRouter from "./modules/nested"; +import externalLink from "./modules/externalLink"; +import remainingRouter from "./modules/remaining"; +import flowChartRouter from "./modules/flowchart"; +import componentsRouter from "./modules/components"; +// 动态路由 +import { getAsyncRoutes } from "/@/api/routes"; + // https://cn.vitejs.dev/guide/features.html#glob-import const modulesRoutes = import.meta.glob("/src/views/*/*/*.vue"); @@ -41,12 +43,12 @@ export const ascending = arr => { }; // 将所有静态路由导出 -export const constantRoutesArr = ascending(constantRoutes).concat( - ...remainingRouter -); +export const constantRoutesArr: Array = ascending( + constantRoutes +).concat(...remainingRouter); -// 过滤后端传来的动态路由重新生成规范路由 -export const addAsyncRoutes = (arrRoutes: Array) => { +// 过滤后端传来的动态路由 重新生成规范路由 +export const addAsyncRoutes = (arrRoutes: Array) => { if (!arrRoutes || !arrRoutes.length) return; arrRoutes.forEach((v: any) => { if (v.redirect) { @@ -61,7 +63,7 @@ export const addAsyncRoutes = (arrRoutes: Array) => { return arrRoutes; }; -const router = createRouter({ +const router: Router = createRouter({ history: createWebHashHistory(), routes: ascending(constantRoutes).concat(...remainingRouter), scrollBehavior(to, from, savedPosition) { @@ -79,7 +81,7 @@ const router = createRouter({ } }); -export const initRouter = (name, next?, to?) => { +export const initRouter = name => { return new Promise(resolve => { getAsyncRoutes({ name }).then(({ info }) => { if (info.length === 0) { @@ -98,7 +100,6 @@ export const initRouter = (name, next?, to?) => { // 最终路由进行升序 ascending(router.options.routes); router.addRoute(v.name, v); - if (next && to) next({ ...to, replace: true }); usePermissionStoreHook().changeSetting(info); } resolve(router); @@ -122,8 +123,6 @@ export function resetRouter() { }); } -import NProgress from "../utils/progress"; - const whiteList = ["/login", "/register"]; router.beforeEach((to, _from, next) => { @@ -137,9 +136,24 @@ router.beforeEach((to, _from, next) => { if (_from?.name) { next(); } else { + // 刷新 if (usePermissionStoreHook().wholeRoutes.length === 0) - initRouter(name.username, next, to).then((router: Router) => { + initRouter(name.username).then((router: Router) => { router.push(to.path); + // 刷新页面更新标签栏与页面路由匹配 + const localRoutes = storageLocal.getItem( + "responsive-routesInStorage" + ); + const optionsRoutes = router.options?.routes; + const newLocalRoutes = []; + optionsRoutes.forEach(ors => { + localRoutes.forEach(lrs => { + if (ors.path === lrs.parentPath) { + newLocalRoutes.push(lrs); + } + }); + }); + storageLocal.setItem("responsive-routesInStorage", newLocalRoutes); }); next(); } diff --git a/src/store/modules/permission.ts b/src/store/modules/permission.ts index 4a37c26bb..f295a7bec 100644 --- a/src/store/modules/permission.ts +++ b/src/store/modules/permission.ts @@ -6,7 +6,8 @@ import { constantRoutesArr, ascending } from "/@/router/index"; export const usePermissionStore = defineStore({ id: "pure-permission", state: () => ({ - constantRoutes: constantRoutesArr, //静态路由 + // 静态路由 + constantRoutes: constantRoutesArr, wholeRoutes: [], buttonAuth: [] }), diff --git a/src/views/welcome.vue b/src/views/welcome.vue index b64e38ed5..0455cba49 100644 --- a/src/views/welcome.vue +++ b/src/views/welcome.vue @@ -1,7 +1,5 @@