Browse Source
fix: 登录后直接跳到工作台问题
fix: 登录后直接跳到工作台问题
feat：抽菜单树方法 fix:工作台多数据 问题zhangrenyuan/feature-20250714163943-金币前端二期
lihui
3 weeks ago
4 changed files with 182 additions and 21 deletions
-
105src/utils/menu-utils.ts
-
4src/views/home.vue
-
79src/views/login.vue
-
15src/views/workspace/index.vue
@ -0,0 +1,105 @@ |
|||
// 菜单树过滤
|
|||
export function filterMenu(menuList) { |
|||
return menuList |
|||
// 过滤不是4级的 123 为菜单
|
|||
.filter(menu => menu.menuType !== 4) |
|||
.map(menu => ({ |
|||
...menu, |
|||
children: menu.children ? filterMenu(menu.children) : [] |
|||
})) |
|||
.sort((a, b) => a.priority - b.priority); // 按 id 升序
|
|||
} |
|||
|
|||
// 辅助函数：查找第一个可访问的菜单项
|
|||
export function findFirstAccessibleMenu(menuList) { |
|||
if (!menuList || menuList.length === 0) return null |
|||
|
|||
for (const menu of menuList) { |
|||
if (menu.menuType === 1) { // 根
|
|||
const childResult = findFirstAccessibleMenu(menu.children) |
|||
if (childResult) return childResult |
|||
} else if (menu.menuType === 2) { // 目录
|
|||
return menu |
|||
} else if (menu.menuType === 3) { // 菜单
|
|||
return menu |
|||
} |
|||
} |
|||
return null |
|||
} |
|||
|
|||
// 路由映射
|
|||
export const getRoutePath = (menu) => { |
|||
// 路由映射表：key为接口menuName，value为对应路由路径
|
|||
const routeMap = { |
|||
'工作台': '/workspace', |
|||
|
|||
'财务审核': '/rechargeAudit', |
|||
'充值审核': '/rechargeAudit', |
|||
'退款审核': '/refundAudit', |
|||
|
|||
'汇率管理': '/rate', |
|||
|
|||
'消耗管理': '/coinConsume', |
|||
'消耗页面': '/coinConsume', |
|||
|
|||
'权限管理': '/permissions', |
|||
|
|||
'充值管理': '/coinRecharge', |
|||
'充值页面': '/coinRecharge', |
|||
|
|||
'退款管理': '/coinRefund', |
|||
'退款页面': '/coinRefund', |
|||
|
|||
'客户账户明细': '/usergold', |
|||
}; |
|||
|
|||
// 未匹配的菜单默认使用id作为路由（可根据实际需求调整）
|
|||
return routeMap[menu.menuName] || '/noPermissionPage' |
|||
|
|||
} |
|||
|
|||
|
|||
// 这是获取用户信息的接口
|
|||
const adminData = ref({ |
|||
name: '' |
|||
}) |
|||
|
|||
import API from "@/util/http.js"; |
|||
import {ref} from "vue"; |
|||
export const getAdminData = async function () { |
|||
try { |
|||
const result = await API({ url: '/admin/userinfo', data: {} }) |
|||
adminData.value = result |
|||
console.log('请求成功', result) |
|||
console.log('用户信息', adminData.value) |
|||
return result |
|||
} catch (error) { |
|||
console.log('请求失败', error) |
|||
} |
|||
} |
|||
|
|||
|
|||
// 权限检查函数
|
|||
export const hasPermission = (to, menuList) => { |
|||
if (!menuList || menuList.length === 0) return false; |
|||
|
|||
// 转换路由路径为菜单名称
|
|||
const routePath = to.path; |
|||
const menuName = Object.keys(getRoutePath).find(key => getRoutePath[key] === routePath); |
|||
|
|||
if (!menuName) return false; |
|||
|
|||
// 扁平化菜单树以便查找
|
|||
const flattenMenu = (menus) => { |
|||
return menus.reduce((acc, menu) => { |
|||
acc.push(menu); |
|||
if (menu.children) { |
|||
acc = acc.concat(flattenMenu(menu.children)); |
|||
} |
|||
return acc; |
|||
}, []); |
|||
}; |
|||
|
|||
const flatMenuList = flattenMenu(menuList); |
|||
return flatMenuList.some(menu => menu.menuName === menuName); |
|||
}; |
|||
Write
Preview
Loading…
Cancel
Save
Reference in new issue