109 lines
4.0 KiB
JavaScript
109 lines
4.0 KiB
JavaScript
// 导入自定义布局
|
||
import LoginLayout from './layouts/LoginLayout.vue'
|
||
// 导入默认布局(必须保留,否则其他页面会404)
|
||
import DefaultLayout from '@vuepress/theme-default/layouts/Layout.vue'
|
||
|
||
import { defineClientConfig } from 'vuepress/client'
|
||
import { createPinia } from 'pinia'
|
||
// 1. 补全所有缺失的核心导入(适配docs根目录的store/utils)
|
||
import { useUserStore } from './store/modules/user'
|
||
import { showToast, getUserInfo } from '../utils/request' // 新增getUserInfo
|
||
// 核心修改:导入全局常量SITE_BASE
|
||
import { SITE_BASE } from './constants.js';
|
||
// 原有组件导入(位置不变,无需修改)
|
||
import WithAuth from './components/WithAuth.vue'
|
||
import Login from './components/Login.vue'
|
||
import helperHTML from './components/helperHTML.vue'
|
||
import longPic from './components/longPic.vue'
|
||
|
||
export default defineClientConfig({
|
||
// 新增:注册布局
|
||
layouts: {
|
||
Layout: DefaultLayout, // 默认布局
|
||
LoginLayout: LoginLayout // 登录页布局
|
||
},
|
||
// 2. 解构出router(路由守卫必须用)
|
||
enhance({ app, router }) {
|
||
const pinia = createPinia()
|
||
app.use(pinia)
|
||
// 全局注册组件(原有逻辑,无问题)
|
||
app.component('WithAuth', WithAuth)
|
||
app.component('Login', Login)
|
||
app.component('helperHTML', helperHTML)
|
||
app.component('longPic', longPic)
|
||
|
||
// 权限指令v-auth:修复this指向+Pinia实例化问题
|
||
app.directive('auth', {
|
||
mounted(el, binding) {
|
||
// 3. Pinia仓库必须执行实例化(核心修复)
|
||
const userStore = useUserStore()
|
||
const requiredRoles = binding.value
|
||
if (!requiredRoles) return
|
||
// 未登录/无权限直接隐藏
|
||
if (!userStore.isLogin) {
|
||
el.style.display = 'none'
|
||
return
|
||
}
|
||
let hasPermission = false
|
||
if (typeof requiredRoles === 'string') {
|
||
hasPermission = userStore.hasRole(requiredRoles)
|
||
} else if (Array.isArray(requiredRoles)) {
|
||
hasPermission = requiredRoles.some(role => userStore.hasRole(role))
|
||
}
|
||
if (!hasPermission) el.style.display = 'none'
|
||
},
|
||
updated(el, binding) {
|
||
// 4. 修复this指向问题:直接复用mounted逻辑,不用this
|
||
this.mounted.call(this, el, binding)
|
||
}
|
||
})
|
||
|
||
// 全局路由守卫:VuePress 2.x 适配版(白名单+未登录跳登录)
|
||
const whiteList = ['/login.html'] // 无需登录的页面
|
||
if (typeof window !== 'undefined') {
|
||
return
|
||
}
|
||
// 隐藏登录功能
|
||
router.beforeEach(async (to, from, next) => {
|
||
const userStore = useUserStore()
|
||
const isLogin = userStore.isLogin
|
||
|
||
// 白名单页面,直接放行
|
||
if (whiteList.includes(to.path)) {
|
||
next()
|
||
return
|
||
}
|
||
if (typeof window == 'undefined') {
|
||
next()
|
||
return
|
||
}
|
||
// 未登录:跳登录页并记录跳转前地址(适配base: /dma_handbook/)
|
||
// 替换client.js中路由守卫的未登录跳转代码
|
||
if (!isLogin) {
|
||
showToast('请先登录后访问')
|
||
// 核心修复:直接使用to.fullPath(已包含SITE_BASE),无需手动拼接
|
||
let redirectPath = to.fullPath
|
||
// 兜底校验:极端情况若fullPath未带SITE_BASE,手动拼接(防止地址栏手动修改)
|
||
if (!redirectPath.startsWith(SITE_BASE)) {
|
||
redirectPath = `${SITE_BASE}${redirectPath.replace(/^\//, '')}` // 去掉开头的/,避免双斜杠
|
||
}
|
||
// 编码后拼接登录页地址
|
||
const redirect = encodeURIComponent(redirectPath)
|
||
window.location.href = `${SITE_BASE}login.html?redirect=${redirect}`
|
||
return
|
||
}
|
||
// 核心修改:仅【已登录 + 未拉取过用户信息】时,才调用接口
|
||
if (!userStore.isUserInfoFetched) {
|
||
await getUserInfo(userStore)
|
||
// 拉取成功后,更新标记为true(本次会话不再重复调用)
|
||
userStore.setUserInfoFetched(true)
|
||
}
|
||
// 已登录,正常放行
|
||
next()
|
||
})
|
||
|
||
|
||
},
|
||
setup() {},
|
||
})
|