第4章 页面级权限控制的原型实现：动态面板切换显示/隐藏、条件判断结合角色变量

1. 用户场景

某企业内部管理系统分为「管理员」与「普通用户」两种角色。管理员登录后可见「用户管理」「系统配置」「审计日志」三个模块；普通用户登录后仅可见「任务看板」「个人中心」，且「任务看板」中的「删除任务」按钮对普通用户隐藏。产品经理需要在 Axure 中构建可交互的原型，用于验证页面级权限控制的逻辑正确性与体验完整性。

2. 业务问题

• 权限粒度粗放：同一页面内不同功能区域对不同角色可见性不同，静态页面无法表达这种差异。
• 交互反馈缺失：角色切换后页面区域不能自动更新，导致演示时需手动解释“这里管理员才看得到”。
• 条件逻辑复杂：多个功能模块的显示/隐藏依赖同一个角色变量，但彼此之间互有嵌套关系，容易产生逻辑冲突。

3. 需求拆解

4. 方案表达

使用 Axure 的 动态面板（Dynamic Panel）作为页面级权限控制的核心载体。每个需要权限控制的功能区域独立封装为一个动态面板，面板内包含两个状态：「可见状态」与「隐藏/无权限状态」。通过 全局角色变量（userRole）结合 条件判断（Case）控制面板状态的切换。

4.1 动态面板状态定义

4.2 条件判断规则配置

在 Axure 的「交互」面板中，为每个动态面板添加 页面加载时（OnPageLoad） 用例，配置条件判断逻辑。规则示例如下：

用例名称：初始化角色面板
条件：If 全局变量 [[userRole]] 等于 "admin"
  动作：设置动态面板 nav_system 为状态 A（可见）
       设置动态面板 btn_deleteTask 为状态 A（可见）
       设置动态面板 page_auditLog 为状态 A（可见）
否则（Else）：
  动作：设置动态面板 nav_system 为状态 B（隐藏）
       设置动态面板 btn_deleteTask 为状态 B（隐藏）
       设置动态面板 page_auditLog 为状态 B（无权限提示）

4.3 方案流程图

下图展示了从角色变量读取到动态面板状态切换的完整决策链路：

5. 指标验证

• 面板切换响应正确率：在角色变量变更后，所有受控动态面板在 1 次页面刷新内全部切换到正确状态，正确率应达到 100%。
• 条件判断覆盖度：覆盖 admin 和 user 两种角色，每种角色至少验证 3 个动态面板的状态是否符合预期。
• 无状态冲突：不存在同一个动态面板同时被多个条件分支设置为不同状态的情况。

6. 验收标准

7. 交付物模板

本章交付的原型文件应包含以下结构：