Files
login_task_web/docs/权限系统配置总结.md

5.5 KiB
Raw Blame History

权限系统配置总结

概述

本系统采用基于角色的权限控制RBAC机制通过用户类型ADMIN/AGENT来控制用户的功能访问权限。

用户类型权限配置

ADMIN管理员

  • 权限范围:拥有系统所有功能的访问权限
  • 路由访问:可以访问所有页面和路由
  • 功能权限
    • 用户管理(创建、编辑、删除、启用/禁用)
    • 游戏管理(查看、创建、编辑、删除)
    • 订单管理(查看、管理)
    • 报表分析(查看)
    • 系统设置(管理)

AGENT代理商

  • 权限范围:只能查看基础信息,无管理权限
  • 路由访问:只能访问部分页面
  • 功能权限
    • 游戏查看
    • 订单查看
    • 报表查看

权限检查机制

1. 路由权限检查

// 管理员可以访问所有路由
export function canAccessRoute(routeName) {
  if (isAdmin()) return true
  
  const requiredPermissions = ROUTE_PERMISSIONS[routeName] || []
  if (requiredPermissions.length === 0) return true
  
  return hasAnyPermission(requiredPermissions)
}

2. 功能权限检查

// 检查单个权限
const canCreateUser = hasPermission('user:create')

// 检查多个权限(任一)
const canManageUsers = hasAnyPermission(['user:create', 'user:update', 'user:delete'])

// 检查多个权限(全部)
const canFullManage = hasAllPermissions(['user:create', 'user:update', 'user:delete'])

3. 权限指令使用

<!-- 单个权限 -->
<el-button v-permission="'user:create'">新增用户</el-button>

<!-- 多个权限OR逻辑 -->
<el-button v-permission="['user:create', 'user:update']">操作</el-button>

<!-- 多个权限AND逻辑 -->
<el-button v-permission="['user:create', 'user:update', 'AND']">操作</el-button>

权限配置详情

权限定义

export const PERMISSIONS = {
  // 用户管理权限
  USER_MANAGE: 'user:manage',
  USER_CREATE: 'user:create',
  USER_UPDATE: 'user:update',
  USER_DELETE: 'user:delete',
  USER_VIEW: 'user:view',
  
  // 游戏管理权限
  GAME_MANAGE: 'game:manage',
  GAME_CREATE: 'game:create',
  GAME_UPDATE: 'game:update',
  GAME_DELETE: 'game:delete',
  GAME_VIEW: 'game:view',
  
  // 订单管理权限
  ORDER_MANAGE: 'order:manage',
  ORDER_VIEW: 'order:view',
  
  // 报表分析权限
  REPORT_VIEW: 'report:view',
  
  // 系统设置权限
  SETTING_MANAGE: 'setting:manage',
}

角色权限映射

export const ROLE_PERMISSIONS = {
  ADMIN: [
    // 管理员拥有所有权限
    PERMISSIONS.USER_MANAGE, PERMISSIONS.USER_CREATE, PERMISSIONS.USER_UPDATE,
    PERMISSIONS.USER_DELETE, PERMISSIONS.USER_VIEW,
    PERMISSIONS.GAME_MANAGE, PERMISSIONS.GAME_CREATE, PERMISSIONS.GAME_UPDATE,
    PERMISSIONS.GAME_DELETE, PERMISSIONS.GAME_VIEW,
    PERMISSIONS.ORDER_MANAGE, PERMISSIONS.ORDER_VIEW,
    PERMISSIONS.REPORT_VIEW, PERMISSIONS.SETTING_MANAGE,
  ],
  AGENT: [
    // 代理商只有查看权限
    PERMISSIONS.GAME_VIEW, PERMISSIONS.ORDER_VIEW, PERMISSIONS.REPORT_VIEW,
  ]
}

路由权限映射

export const ROUTE_PERMISSIONS = {
  'Users': [PERMISSIONS.USER_VIEW],
  'Games': [PERMISSIONS.GAME_VIEW],
  'Orders': [PERMISSIONS.ORDER_VIEW],
  'Reports': [PERMISSIONS.REPORT_VIEW],
  'Settings': [PERMISSIONS.SETTING_MANAGE],
}

权限控制层级

1. 路由级权限控制

  • 在路由守卫中检查用户是否有访问权限
  • 管理员可以访问所有路由
  • 代理商只能访问有权限的路由
  • 无权限时自动跳转到仪表盘页面

2. 菜单级权限控制

  • 根据用户权限动态显示/隐藏菜单项
  • 代理商用户看不到"用户管理"和"系统设置"菜单
  • 管理员可以看到所有菜单项

3. 页面级权限控制

  • 在页面组件中检查用户权限
  • 无权限时显示权限不足提示
  • 提供友好的用户体验

4. 操作级权限控制

  • 根据用户权限显示/隐藏操作按钮
  • 代理商用户无法进行用户管理操作
  • 使用权限指令控制按钮显示

安全注意事项

  1. 前端权限控制仅用于用户体验,不能作为安全依据
  2. 后端必须进行权限验证,确保数据安全
  3. 敏感操作需要二次确认,如删除用户
  4. 权限变更需要重新登录,确保权限生效
  5. 定期审查权限配置,避免权限泄露

测试验证

权限测试页面

  • 访问 /permission-test 页面
  • 查看当前用户的权限状态
  • 测试各种权限检查功能
  • 验证路由访问权限

测试建议

  1. 使用不同用户类型登录,验证权限控制
  2. 测试无权限访问时的跳转逻辑
  3. 验证菜单和按钮的显示/隐藏
  4. 测试后端接口的权限验证
  5. 检查权限变更后的效果

扩展说明

添加新权限

  1. PERMISSIONS 对象中添加新权限
  2. ROLE_PERMISSIONS 中为不同角色分配权限
  3. ROUTE_PERMISSIONS 中配置路由权限要求
  4. 更新相关的前端权限检查逻辑

修改角色权限

  1. 修改 ROLE_PERMISSIONS 中对应角色的权限数组
  2. 更新相关的前端权限检查逻辑
  3. 测试权限变更后的效果

总结

当前的权限系统配置确保了:

  • 管理员拥有所有权限,可以访问所有页面和功能
  • 代理商只有查看权限,无法进行管理操作
  • 权限检查机制完善,包括路由、菜单、页面、操作四个层级
  • 用户体验友好,无权限时提供清晰的提示和跳转
  • 安全性保障,前后端都有权限验证机制