Browse Source

fix: 登录后直接跳到工作台问题

feat:抽菜单树方法
fix:工作台多数据 问题
zhangrenyuan/feature-20250714163943-金币前端二期
lihui 3 weeks ago
parent
commit
5a901525a1
  1. 105
      src/utils/menu-utils.ts
  2. 4
      src/views/home.vue
  3. 47
      src/views/login.vue
  4. 15
      src/views/workspace/index.vue

105
src/utils/menu-utils.ts

@ -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);
};

4
src/views/home.vue

@ -30,7 +30,6 @@ const fetchMenuTree = async function() {
}
}
function filterMenu(menuList) {
return menuList
.filter(menu => menu.menuType !== 4)
@ -49,7 +48,7 @@ const getRoutePath = (menu) => {
const routeMap = {
'工作台': '/workspace',
'财务审核': '/rechargeAudit',
'充值审核': '/rechargeAudit',
'退款审核': '/refundAudit',
@ -68,6 +67,7 @@ const getRoutePath = (menu) => {
'客户账户明细': '/usergold',
};
// 使id
return routeMap[menu.menuName] || '/workspace'
}

47
src/views/login.vue

@ -5,11 +5,13 @@ import axios from 'axios'
import request from '@/util/http'
import {useRouter} from 'vue-router'
import {VscGlobe} from 'vue-icons-plus/vsc'
import API from "@/util/http.js";
const router = useRouter() //
//
var url = window.location.href //
var machineId1 = ref(null)
// machineId
function getMachineId() {
var parts = url.split('machineId=')
@ -24,6 +26,8 @@ function getMachineId() {
localStorage.setItem('machineId', machineId1)
}
}
const adminRoleId = ref(null)
const form = ref({account: null, password: '', token: '', machineId: machineId1.value})
//
const login = async function () {
@ -36,7 +40,25 @@ const login = async function () {
if (result.code == 200) {
localStorage.setItem('token', result.msg)
// localStorage.setItem('permission', result.data.permission)
router.push('/workspace')
adminRoleId.value = result.data.roleId
await getMenuTree()
//
const menuTree = await getMenuTree()
const filteredMenu = filterMenu(menuTree)
//
const firstMenu = findFirstAccessibleMenu(filteredMenu)
//
const redirectPath = firstMenu ? getRoutePath(firstMenu) : '/noPermissionPage'
router.push(redirectPath)
// router.push('/workspace')
ElMessage.success('登录成功')
console.log('请求成功', result)
} else {
@ -51,8 +73,28 @@ const login = async function () {
}
}
//
const getMenuTree = async function () {
//
try {
const result = await API({url: '/menu/tree', data: {id: adminRoleId.value}})
return result.data //
} catch (error) {
console.error('菜单数据请求失败:', error)
return {code: 500, msg: '获取菜单失败'}
}
}
//
import {filterMenu,findFirstAccessibleMenu,getRoutePath} from "../utils/menu-utils.js"
onMounted(() => {
getMachineId()
})
</script>
@ -81,7 +123,8 @@ onMounted(() => {
<el-form-item>
<button type="button" class="button" @click="login()">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" height="30" width="24">
<path fill="white" d="M23.15 2.587L18.21 0.210001C17.9308 0.075557 17.6167 0.031246 17.3113 0.083204C17.0058 0.135162 16.724 0.280818 16.505 0.500001L7.04499 9.13L2.92499 6.002C2.73912 5.86101 2.50976 5.78953 2.27669 5.79994C2.04363 5.81035 1.82156 5.902 1.64899 6.059L0.326993 7.261C0.223973 7.35465 0.141644 7.46878 0.0852761 7.59608C0.0289081 7.72339 -0.00025659 7.86106 -0.000350724 8.00028C-0.000444857 8.1395 0.0285336 8.27721 0.0847294 8.40459C0.140925 8.53197 0.2231 8.64621 0.325993 8.74L3.89899 12L0.325993 15.26C0.2231 15.3538 0.140925 15.468 0.0847294 15.5954C0.0285336 15.7228 -0.000444857 15.8605 -0.000350724 15.9997C-0.00025659 16.1389 0.0289081 16.2766 0.0852761 16.4039C0.141644 16.5312 0.223973 16.6454 0.326993 16.739L1.64999 17.94C1.82256 18.097 2.04463 18.1887 2.27769 18.1991C2.51076 18.2095 2.74012 18.138 2.92599 17.997L7.04599 14.869L16.506 23.499C16.7248 23.7182 17.0064 23.8639 17.3117 23.9159C17.6171 23.9679 17.931 23.9235 18.21 23.789L23.152 21.412C23.4062 21.2893 23.6207 21.0973 23.7707 20.8581C23.9207 20.619 24.0002 20.3423 24 20.06V3.939C24 3.65647 23.9203 3.37967 23.7699 3.14048C23.6195 2.90129 23.4046 2.70943 23.15 2.587ZM18.004 17.448L10.826 12L18.004 6.552V17.448Z"></path>
<path fill="white"
d="M23.15 2.587L18.21 0.210001C17.9308 0.075557 17.6167 0.031246 17.3113 0.083204C17.0058 0.135162 16.724 0.280818 16.505 0.500001L7.04499 9.13L2.92499 6.002C2.73912 5.86101 2.50976 5.78953 2.27669 5.79994C2.04363 5.81035 1.82156 5.902 1.64899 6.059L0.326993 7.261C0.223973 7.35465 0.141644 7.46878 0.0852761 7.59608C0.0289081 7.72339 -0.00025659 7.86106 -0.000350724 8.00028C-0.000444857 8.1395 0.0285336 8.27721 0.0847294 8.40459C0.140925 8.53197 0.2231 8.64621 0.325993 8.74L3.89899 12L0.325993 15.26C0.2231 15.3538 0.140925 15.468 0.0847294 15.5954C0.0285336 15.7228 -0.000444857 15.8605 -0.000350724 15.9997C-0.00025659 16.1389 0.0289081 16.2766 0.0852761 16.4039C0.141644 16.5312 0.223973 16.6454 0.326993 16.739L1.64999 17.94C1.82256 18.097 2.04463 18.1887 2.27769 18.1991C2.51076 18.2095 2.74012 18.138 2.92599 17.997L7.04599 14.869L16.506 23.499C16.7248 23.7182 17.0064 23.8639 17.3117 23.9159C17.6171 23.9679 17.931 23.9235 18.21 23.789L23.152 21.412C23.4062 21.2893 23.6207 21.0973 23.7707 20.8581C23.9207 20.619 24.0002 20.3423 24 20.06V3.939C24 3.65647 23.9203 3.37967 23.7699 3.14048C23.6195 2.90129 23.4046 2.70943 23.15 2.587ZM18.004 17.448L10.826 12L18.004 6.552V17.448Z"></path>
</svg>
<p class="text">登录</p>
</button>

15
src/views/workspace/index.vue

@ -689,7 +689,20 @@ const updateChart = (chartData) => {
}
}
},
series: series
series: series,
dataZoom: [
{
type: 'slider',
show: true,
start: 0,
end: 20,
maxSpan: 20,
minSpan: 20,
height: 2,
},
]
}
chartInstance.setOption(option)

Loading…
Cancel
Save