mirror of
https://github.com/jekip/naive-ui-admin.git
synced 2026-03-01 00:23:11 +08:00
fix Bug or add example
This commit is contained in:
Ah jung
@@ -6,146 +6,137 @@ import NProgress from 'nprogress' // progress bar
|
||||
import { ACCESS_TOKEN } from '@/store/mutation-types'
|
||||
import { storage } from '@/utils/Storage'
|
||||
import { debounce } from '@/utils/lodashChunk'
|
||||
import { useGlobSetting } from '@/hooks/setting'
|
||||
import { PageEnum } from '@/enums/pageEnum'
|
||||
|
||||
const globSetting = useGlobSetting()
|
||||
|
||||
|
||||
NProgress.configure({ showSpinner: false }) // NProgress Configuration
|
||||
|
||||
const whitePathList = ['/login'] // no redirect whitelist
|
||||
|
||||
const LOGIN_PATH = PageEnum.BASE_LOGIN
|
||||
const DEFAULT_PATH = PageEnum.BASE_HOME
|
||||
|
||||
|
||||
const permissionMode = globSetting.permissionMode //ROLE 前端固定角色 BACK 动态获取
|
||||
const whitePathList = [LOGIN_PATH] // no redirect whitelist
|
||||
|
||||
// 是否需要从后端获取菜单
|
||||
const isGetMenus = debounce(
|
||||
({ to, from, next, hasRoute, router }) => {
|
||||
const userStore = useUserStoreWidthOut();
|
||||
const asyncRouteStore = useAsyncRouteStoreWidthOut();
|
||||
userStore.GetInfo().then(res => {
|
||||
asyncRouteStore.generateRoutes(res).then(() => {
|
||||
// 根据roles权限生成可访问的路由表
|
||||
// 动态添加可访问路由表
|
||||
asyncRouteStore.getRouters().forEach((item) => {
|
||||
router.addRoute(item)
|
||||
});
|
||||
debugger
|
||||
// if (whitePathList.includes(to.name as string)) return
|
||||
if (!hasRoute) {
|
||||
// 请求带有 redirect 重定向时，登录自动重定向到该地址
|
||||
const redirect = decodeURIComponent((from.query.redirect || '') as string)
|
||||
if (to.path === redirect) {
|
||||
next({ ...to, replace: true })
|
||||
} else {
|
||||
// 跳转到目的路由
|
||||
next({ ...to, replace: true })
|
||||
}
|
||||
} else {
|
||||
next()
|
||||
}
|
||||
}).catch(() => next({ path: defaultRoutePath }))
|
||||
})
|
||||
},
|
||||
1800,
|
||||
{ leading: true }
|
||||
({ to, from, next, hasRoute, router }) => {
|
||||
const userStore = useUserStoreWidthOut();
|
||||
const asyncRouteStore = useAsyncRouteStoreWidthOut();
|
||||
userStore.GetInfo().then(res => {
|
||||
asyncRouteStore.generateRoutes(res).then(() => {
|
||||
// 根据roles权限生成可访问的路由表
|
||||
// 动态添加可访问路由表
|
||||
asyncRouteStore.getRouters().forEach((item) => {
|
||||
router.addRoute(item)
|
||||
});
|
||||
// if (whitePathList.includes(to.name as string)) return
|
||||
if (!hasRoute) {
|
||||
// 请求带有 redirect 重定向时，登录自动重定向到该地址
|
||||
const redirect = decodeURIComponent((from.query.redirect || '') as string)
|
||||
if (to.path === redirect) {
|
||||
next({ ...to, replace: true })
|
||||
} else {
|
||||
// 跳转到目的路由
|
||||
next({ ...to, replace: true })
|
||||
}
|
||||
} else {
|
||||
next()
|
||||
}
|
||||
}).catch(() => next({ path: defaultRoutePath }))
|
||||
})
|
||||
},
|
||||
1800,
|
||||
{ leading: true }
|
||||
)
|
||||
|
||||
|
||||
export function createRouterGuards(router: Router) {
|
||||
const userStore = useUserStoreWidthOut();
|
||||
const asyncRouteStore = useAsyncRouteStoreWidthOut();
|
||||
router.beforeEach(async (to, from, next) => {
|
||||
NProgress.start()
|
||||
|
||||
if (from.path === LOGIN_PATH && to.name === 'errorPage') {
|
||||
next(PageEnum.BASE_HOME);
|
||||
return;
|
||||
}
|
||||
|
||||
// Whitelist can be directly entered
|
||||
if (whitePathList.includes(to.path as PageEnum)) {
|
||||
next();
|
||||
return;
|
||||
}
|
||||
|
||||
const token = storage.get(ACCESS_TOKEN)
|
||||
const roles = storage.get('roles')
|
||||
|
||||
if (!token) {
|
||||
|
||||
// You can access without permission. You need to set the routing meta.ignoreAuth to true
|
||||
if (to.meta.ignoreAuth) {
|
||||
next();
|
||||
return;
|
||||
}
|
||||
// redirect login page
|
||||
const redirectData: { path: string; replace: boolean; query?: Recordable<string> } = {
|
||||
path: LOGIN_PATH,
|
||||
replace: true,
|
||||
};
|
||||
if (to.path) {
|
||||
redirectData.query = {
|
||||
...redirectData.query,
|
||||
redirect: to.path,
|
||||
};
|
||||
}
|
||||
next(redirectData);
|
||||
return;
|
||||
}
|
||||
|
||||
if (asyncRouteStore.getIsDynamicAddedRoute) {
|
||||
next();
|
||||
return;
|
||||
}
|
||||
|
||||
const userInfo = await userStore.GetInfo()
|
||||
|
||||
const routes = await asyncRouteStore.generateRoutes(userInfo)
|
||||
|
||||
// 动态添加可访问路由表
|
||||
routes.forEach((item) => {
|
||||
router.addRoute(item)
|
||||
});
|
||||
|
||||
const redirectPath = (from.query.redirect || to.path) as string;
|
||||
const redirect = decodeURIComponent(redirectPath);
|
||||
const nextData = to.path === redirect ? { ...to, replace: true } : { path: redirect };
|
||||
asyncRouteStore.setDynamicAddedRoute(true);
|
||||
next(nextData);
|
||||
NProgress.done()
|
||||
})
|
||||
|
||||
router.afterEach((to, from, failure) => {
|
||||
document.title = (to?.meta?.title as string) || document.title
|
||||
if (isNavigationFailure(failure)) {
|
||||
//console.log('failed navigation', failure)
|
||||
}
|
||||
const userStore = useUserStoreWidthOut();
|
||||
const asyncRouteStore = useAsyncRouteStoreWidthOut();
|
||||
// 在这里设置需要缓存的组件名称
|
||||
const keepAliveComponents = asyncRouteStore.keepAliveComponents
|
||||
const currentComName: any = to.matched.find((item) => item.name == to.name)?.name
|
||||
if (currentComName && !keepAliveComponents.includes(currentComName) && to.meta?.keepAlive) {
|
||||
// 需要缓存的组件
|
||||
keepAliveComponents.push(currentComName)
|
||||
} else if (!to.meta?.keepAlive || to.name == 'Redirect') {
|
||||
// 不需要缓存的组件
|
||||
const index = asyncRouteStore.keepAliveComponents.findIndex(
|
||||
(name) => name == currentComName
|
||||
)
|
||||
if (index != -1) {
|
||||
keepAliveComponents.splice(index, 1)
|
||||
}
|
||||
}
|
||||
asyncRouteStore.setKeepAliveComponents(keepAliveComponents)
|
||||
NProgress.done() // finish progress bar
|
||||
})
|
||||
router.beforeEach(async (to, from, next) => {
|
||||
NProgress.start()
|
||||
if (from.path === LOGIN_PATH && to.name === 'errorPage') {
|
||||
next(PageEnum.BASE_HOME);
|
||||
return;
|
||||
}
|
||||
|
||||
router.onError((error) => {
|
||||
console.log(error, '路由错误')
|
||||
})
|
||||
// Whitelist can be directly entered
|
||||
if (whitePathList.includes(to.path as PageEnum)) {
|
||||
next();
|
||||
return;
|
||||
}
|
||||
|
||||
const token = storage.get(ACCESS_TOKEN)
|
||||
const roles = storage.get('roles')
|
||||
|
||||
if (!token) {
|
||||
|
||||
// You can access without permission. You need to set the routing meta.ignoreAuth to true
|
||||
if (to.meta.ignoreAuth) {
|
||||
next();
|
||||
return;
|
||||
}
|
||||
// redirect login page
|
||||
const redirectData: { path: string; replace: boolean; query?: Recordable<string> } = {
|
||||
path: LOGIN_PATH,
|
||||
replace: true,
|
||||
};
|
||||
if (to.path) {
|
||||
redirectData.query = {
|
||||
...redirectData.query,
|
||||
redirect: to.path,
|
||||
};
|
||||
}
|
||||
next(redirectData);
|
||||
return;
|
||||
}
|
||||
|
||||
if (asyncRouteStore.getIsDynamicAddedRoute) {
|
||||
next();
|
||||
return;
|
||||
}
|
||||
|
||||
const userInfo = await userStore.GetInfo()
|
||||
|
||||
const routes = await asyncRouteStore.generateRoutes(userInfo)
|
||||
|
||||
// 动态添加可访问路由表
|
||||
routes.forEach((item) => {
|
||||
router.addRoute(item)
|
||||
});
|
||||
|
||||
const redirectPath = (from.query.redirect || to.path) as string;
|
||||
const redirect = decodeURIComponent(redirectPath);
|
||||
const nextData = to.path === redirect ? { ...to, replace: true } : { path: redirect };
|
||||
asyncRouteStore.setDynamicAddedRoute(true);
|
||||
next(nextData);
|
||||
NProgress.done()
|
||||
})
|
||||
|
||||
router.afterEach((to, from, failure) => {
|
||||
document.title = (to?.meta?.title as string) || document.title
|
||||
if (isNavigationFailure(failure)) {
|
||||
//console.log('failed navigation', failure)
|
||||
}
|
||||
const asyncRouteStore = useAsyncRouteStoreWidthOut();
|
||||
// 在这里设置需要缓存的组件名称
|
||||
const keepAliveComponents = asyncRouteStore.keepAliveComponents
|
||||
const currentComName: any = to.matched.find((item) => item.name == to.name)?.name
|
||||
if (currentComName && !keepAliveComponents.includes(currentComName) && to.meta?.keepAlive) {
|
||||
// 需要缓存的组件
|
||||
keepAliveComponents.push(currentComName)
|
||||
} else if (!to.meta?.keepAlive || to.name == 'Redirect') {
|
||||
// 不需要缓存的组件
|
||||
const index = asyncRouteStore.keepAliveComponents.findIndex(
|
||||
(name) => name == currentComName
|
||||
)
|
||||
if (index != -1) {
|
||||
keepAliveComponents.splice(index, 1)
|
||||
}
|
||||
}
|
||||
asyncRouteStore.setKeepAliveComponents(keepAliveComponents)
|
||||
NProgress.done() // finish progress bar
|
||||
})
|
||||
|
||||
router.onError((error) => {
|
||||
console.log(error, '路由错误')
|
||||
})
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user