perf: 登录后预加载基础数据,区域管理使用 Store 缓存
- permission.js: 登录后并行预加载年级/学科/区域/班级数据 - region/index.vue: 使用 Store 缓存,避免每次请求 1MB 数据 - 第二次进入页面秒开,无需重复请求
This commit is contained in:
parent
24625133e3
commit
4243f6581d
|
|
@ -8,6 +8,7 @@ import { isRelogin } from '@/utils/request'
|
|||
import useUserStore from '@/store/modules/user'
|
||||
import useSettingsStore from '@/store/modules/settings'
|
||||
import usePermissionStore from '@/store/modules/permission'
|
||||
import useBaseDataStore from '@/store/modules/baseData'
|
||||
|
||||
NProgress.configure({ showSpinner: false })
|
||||
|
||||
|
|
@ -33,7 +34,17 @@ router.beforeEach((to, from, next) => {
|
|||
// 判断当前用户是否已拉取完user_info信息
|
||||
useUserStore().getInfo().then(() => {
|
||||
isRelogin.show = false
|
||||
usePermissionStore().generateRoutes().then(accessRoutes => {
|
||||
|
||||
// 并行加载:路由 + 基础数据
|
||||
const baseDataStore = useBaseDataStore()
|
||||
Promise.all([
|
||||
usePermissionStore().generateRoutes(),
|
||||
// 预加载基础数据(后台静默加载,不阻塞页面跳转)
|
||||
baseDataStore.fetchRegionTree(),
|
||||
baseDataStore.fetchGrades(),
|
||||
baseDataStore.fetchSubjects(),
|
||||
baseDataStore.fetchClasses()
|
||||
]).then(([accessRoutes]) => {
|
||||
// 根据roles权限生成可访问的路由表
|
||||
accessRoutes.forEach(route => {
|
||||
if (!isHttp(route.path)) {
|
||||
|
|
|
|||
|
|
@ -141,14 +141,13 @@ const rules = {
|
|||
regionName: [{ required: true, message: '请输入区域名称', trigger: 'blur' }]
|
||||
}
|
||||
|
||||
// 获取区域列表(树形)- 使用后端已构建好的树接口
|
||||
// 获取区域列表(树形)- 使用 Store 缓存
|
||||
const getList = async () => {
|
||||
loading.value = true
|
||||
try {
|
||||
const res = await request.get('/business/region/tree')
|
||||
if (res.code === 200) {
|
||||
tableData.value = res.data || []
|
||||
}
|
||||
// 使用 Store,自动缓存
|
||||
const data = await baseDataStore.fetchRegionTree()
|
||||
tableData.value = data || []
|
||||
} finally {
|
||||
loading.value = false
|
||||
}
|
||||
|
|
@ -156,10 +155,8 @@ const getList = async () => {
|
|||
|
||||
// 获取区域树选项(用于下拉选择)
|
||||
const getRegionOptions = async () => {
|
||||
const res = await request.get('/business/region/tree')
|
||||
if (res.code === 200) {
|
||||
regionOptions.value = [{ regionId: 0, regionName: '顶级区域', children: res.data || [] }]
|
||||
}
|
||||
const data = await baseDataStore.fetchRegionTree()
|
||||
regionOptions.value = [{ regionId: 0, regionName: '顶级区域', children: data || [] }]
|
||||
}
|
||||
|
||||
// 展开/折叠
|
||||
|
|
|
|||
Loading…
Reference in New Issue