第 2 章 登录与界面基础
2.1 登录
2.1.1 前置条件
- 已从管理员处获取平台访问地址、账号与初始密码。
- 浏览器可访问平台地址，且网络策略已放行。
- 账号状态为「启用」。若账号被锁定，需管理员在「日志中心 → 登录日志」中解锁。
2.1.2 操作步骤
- 在浏览器地址栏输入平台地址，回车。
- 页面显示登录页，左侧为平台品牌区，右侧为登录表单。
- 在「用户名」输入框填入账号（如
admin）。 - 在「密码」输入框填入密码。输入框右侧有眼睛图标，点击可切换明文／密文显示。
- 若页面出现「请输入验证码」输入框与图形验证码，按图片内容填入验证码（不区分大小写）。验证码是否出现由管理员在「系统管理 → 系统配置 → 验证码配置」中控制。
- 点击「登录」按钮。
- 登录成功后自动跳转至「仪表盘」。
2.1.3 界面元素说明
| 元素 | 位置 | 说明 |
|---|---|---|
| 平台标题 | 登录页左侧 | 显示「统一视频接入平台-GB28181」 |
| 明暗切换图标 | 登录页右上角 | 悬停提示「切换到暗色模式」／「切换到明亮模式」，仅影响登录页外观 |
| 「用户名」 | 表单第一行 | 支持一键清空（输入后出现清除图标） |
| 「密码」 | 表单第二行 | 密文显示，支持一键清空 |
| 图形验证码 | 表单第三行（按配置显示） | 点击图片可刷新验证码 |
| 「登录」 | 表单底部 | 整行主色按钮，提交后按钮进入加载态，防止重复提交 |
界面如图 2-1 所示。
图 2-1 登录页
2.1.4 常见登录失败提示
| 提示 | 原因 | 处理方式 |
|---|---|---|
| 用户名或密码错误 | 账号不存在或密码不正确 | 核对大小写与输入法；连续失败会触发锁定 |
| 账号已被锁定 | 连续输错密码达到「登录失败锁定阈值」 | 等待锁定时长自动解除，或由管理员在「登录日志」中点击「解锁」 |
| 验证码错误 | 验证码过期或输入错误 | 点击验证码图片刷新后重填 |
| 账号已停用 | 管理员将账号状态置为「禁用」 | 联系管理员启用账号 |
| 登录已失效 | 会话超时或令牌被强制失效 | 重新登录；若被管理员「强制下线」，需确认操作合规性 |
注意 - 平台对登录失败次数进行计数，默认阈值与锁定时间由「系统配置 → 安全配置」决定。多次尝试失败会导致账号临时锁定，锁定期内即使密码正确也无法登录。
界面如图 2-2 所示。
图 2-2 登录失败提示
2.2 首次登录修改初始密码
使用初始密码登录后，平台会强制弹出「修改初始密码」对话框（如图 2-3 所示）。对话框不可关闭、点遮罩不消失、按 Esc 也不退出；在改密完成前，除读取个人信息、退出登录、获取菜单路由外，其余后端接口一律返回 403「请先修改初始密码」，界面上的业务功能因此都用不了。
图 2-3 「修改初始密码」对话框
2.2.1 操作步骤
- 在「新密码」输入框输入新密码。输入框下方从左到右依次是强度条（随输入实时增长，右侧文案为「请输入密码」→「继续完善」→「符合要求」）和策略清单（「最少 8 位」「包含大小写字母」「包含特殊字符
!@#$%」，满足一条点亮一个绿色对号）。 - 在「确认新密码」输入框再次输入同一密码。下方清单实时提示「两次输入的密码需一致」→「两次输入的密码不一致」／「两次输入的密码一致」。
- 点击「确认修改」按钮。
- 修改成功后提示「密码修改成功，请使用新密码重新登录」，平台随即退出当前会话并返回登录页，需要用新密码重新登录（不会自动进入系统）。
2.2.2 校验规则
| 规则 | 说明 |
|---|---|
| 最小长度 | 由「系统配置 → 安全配置 → 密码最小长度」决定，默认 8 位，可设 6–32 位 |
| 大小写 | 默认要求同时包含大写与小写字母 |
| 特殊字符 | 由「密码必须包含特殊字符」开关决定 |
| 一致性 | 两次输入必须完全一致，否则提示「两次输入的密码不一致」并阻止提交 |
| 新旧关系 | 新密码不得与初始密码相同，否则提示「新密码不能与初始密码相同」 |
注意 - 密码由系统单向加密存储，管理员也无法查看明文。遗忘密码只能请管理员在「系统管理 → 账号管理」中重置。 - 修改成功时平台会同时作废该账号的其他登录会话，其他终端需重新登录。
2.3 主界面布局
登录后进入主框架，界面自上而下、自左而右分为五个区域。
| 区域 | 位置 | 内容 |
|---|---|---|
| 顶栏 | 页面最上方 | 左侧为折叠菜单图标与面包屑；右侧为通知、语言与用户头像下拉 |
| 侧边菜单 | 页面左侧 | 一级目录与二级菜单，按角色授权动态生成；无权限的菜单不显示 |
| 标签栏 | 顶栏下方 | 已打开页面的标签页，支持右键菜单：刷新、关闭当前、关闭左侧、关闭右侧、关闭其它、关闭全部 |
| 内容区 | 中部 | 当前页面主体 |
| 页脚 | 页面底部（可配置隐藏） | 版权信息与备案号 |
2.3.1 顶栏控件
| 控件 | 位置 | 作用 |
|---|---|---|
| 折叠图标 | 顶栏最左 | 收起／展开侧边菜单；收起后仅显示图标，悬停显示菜单名 |
| 面包屑 | 折叠图标右侧 | 显示「一级目录／二级菜单」路径，点击上级可跳转 |
| 全屏图标 | 顶栏右侧 | 浏览器全屏，悬停提示「全屏」；再次点击提示「退出全屏」 |
| 通知图标 | 顶栏右侧 | 打开通知面板，包含「通知」「消息」「待办」三个页签 |
| 语言图标 | 顶栏右侧 | 中英文切换（中文 / English） |
| 主题图标 | 标签栏右侧 | 一键切换明暗主题（见 2.4） |
| 用户头像 | 顶栏最右 | 下拉菜单见 2.3.2 |
界面如图 2-5 所示。
图 2-5 完整界面中的导航菜单
2.3.2 用户下拉菜单
| 菜单项 | 作用 |
|---|---|
| 「个人信息」 | 进入「个人中心」页面 |
| 「修改密码」 | 进入「个人中心」的「安全设置」页签修改密码 |
| 「项目地址」 | 打开项目主页（外链） |
| 「退出登录」 | 注销当前会话并返回登录页 |
界面如图 2-4 所示。
图 2-4 主界面布局
界面如图 2-7 所示。
图 2-7 头像下拉菜单
2.4 明暗主题与全屏
标签栏右侧、「录像缓存任务」入口同一排还有两个系统级图标按钮：
| 按钮 | 说明 |
|---|---|
| 全屏 | 让浏览器进入全屏（Esc 退出）；悬停提示「全屏」／「退出全屏」 |
| 暗色／明亮 | 一键切换深浅主题；图标与悬停提示会随当前状态变化（明亮态显示月亮图标、提示「暗色」，暗色态显示太阳图标、提示「明亮」） |
主题选择保存在浏览器本地，换浏览器或清缓存后恢复默认（明亮）。
注意 - 本版本没有独立的主题设置面板：主题色、色弱模式、灰色模式、水印等均不在界面上提供，只有明暗一键切换。 - 视频监控场景建议使用暗色：夜间值班时减少大面积白色眩光，画面细节更易分辨。
界面如图 2-6 所示（同一页面的两种状态）。
图 2-6 深色主题及右上角主题切换入口
2.5 修改密码
「修改密码」没有独立对话框——点进去是个人中心的「安全设置」页签，密码、手机号、邮箱在同一个表单里一起提交。
- 点击顶栏右上角的用户头像 →「修改密码」。
- 页面跳到「个人中心」，并自动停在「安全设置」页签。
- 填写表单：
| 字段 | 必填 | 说明 |
|---|---|---|
| 「登录密码」 | 否 | 占位「请输入登录密码」，下方灰字「留空则不修改」 |
| 「手机号」 | 是 | 前置固定 +86，只填后面的号码；留空提交会被拦下「手机号不能为空」 |
| 「邮箱」 | 否 | 占位「请输入邮箱」 |
- 点击「提交」，成功提示「修改成功」。
注意 - 三个字段是同一个表单一次提交的。只改密码也要先保证「手机号」有值，否则提交不了；反过来只想改手机号／邮箱时，「登录密码」必须留空——填了就等于顺手把密码也改了。 - 修改成功后不会退出登录，当前会话和其它已登录会话都继续有效。要让别人的会话立刻失效，请管理员到「系统管理 → 在线用户」执行「强退」。 - 需要 system:userinfo:updateAccount 权限；没有权限时「提交」按钮不显示。 - 首次登录被要求改初始密码用的是另一个对话框（见 2.2），那个流程改完会退出并要求重新登录；本节是日常改密，改完继续用当前会话，两者不要混。
界面如图 2-8 所示。
图 2-8 用户资料—安全设置
2.6 退出登录
- 点击顶栏用户头像。
- 点击「退出登录」。
- 页面返回登录页，本地令牌被清除。
注意 - 直接关闭浏览器标签页不会立即注销服务端会话，该会话在「在线用户」中仍显示为活跃，直至令牌过期。共用电脑场景请务必显式退出。
2.7 权限模型
平台的权限分四层，理解这四层即可判断「为什么我看不到某个菜单／按钮／设备」。
2.7.1 第一层：菜单权限
角色被授予哪些菜单，登录后侧边栏就只显示哪些菜单。未授权的菜单不显示（而非显示为灰色）。
2.7.2 第二层：按钮权限
同一页面内，不同角色可见的按钮不同。例如「设备列表」页面，只读角色看不到「新建设备」「删除设备」，但仍可「播放」「查看详情」。按钮权限以 gb28181: 或 system: 开头的权限码标识，完整清单见附录 A。
注意 - 按钮不可见仅代表入口隐藏。后端对每个接口独立鉴权，直接拼接 URL 调用接口同样会被拒绝，返回「没有权限」。
2.7.3 第三层：数据权限
角色可设置数据可见范围，作用于设备、通道、录像、告警等业务数据。
| 范围 | 含义 |
|---|---|
| 全部 | 可见系统内全部数据 |
| 自定义 | 按勾选的部门组合可见范围 |
| 本部门 | 仅本部门数据 |
| 本部门及子级 | 本部门及其所有下级部门数据 |
| （默认）可以查看自己创建的数据 | 未显式设置时的默认值 |
设置位置：「系统管理 → 角色管理 → 数据权限」。
2.7.4 第四层：设备归属与共享
设备归属决定设备「属于」哪个部门；共享决定「额外允许谁使用」。二者独立：
- 调整归属：改变设备的管理部门，原部门的数据权限立即失效。
- 共享授权：不改变归属，只是额外允许指定部门或用户使用该设备。
操作位置：「设备权限工作台」。
2.7.5 内置角色
出厂只预置两个角色，其余角色由管理员自行新建：
| 角色 | 说明 |
|---|---|
| 系统管理员 | 最高权限，拥有全部菜单与按钮权限 |
| 游客 | 只读：允许业务查看、实时观看、录像回放；禁止下载、控制与修改 |
早期版本曾带一个「演示」角色，现版本已不再预置。若现场看到多余角色，那是历史数据或他人自建，可在「角色管理」按需停用。
注意 - 「游客」角色明确禁止下载与控制。若现场需要「可看可控但不可删」，请新建角色并只勾选 gb28181:ptz:control、gb28181:play:start 等控制类权限，不要直接使用「游客」。