外观
2. 仪表盘与工作台
2.0 快速上手：3 分钟找到最差设备
作为一名运维主管，你想快速了解本周设备整体状况，找出 OEE 最低的设备并查看其故障明细。
Step 1：打开仪表盘
登录后点击左侧菜单「仪表盘」，页面展示 4 张 KPI 卡片 + 7 张统计图表。
Step 2：切换到本周数据
在时间筛选工具栏点击「最近 7 天」，图表刷新为近一周数据。→ 详见 §2.3.3
Step 3：钻取 OEE 趋势明细
点击「OEE 趋势分析」图表上的低谷数据点 → 弹出右侧钻取抽屉，显示所有设备的 OEE 指标表格。 → 详见 §2.3.4
Step 4：查看停机故障工单
在 OEE 明细表格中，找到 OEE 值最低的设备行，点击「停机明细」→ 抽屉进入第二层：该设备的故障工单列表。 → 详见 §2.3.4
Step 5：进入设备详情
点击故障工单行中的「工单详情」→ 弹出工单详情弹窗，可查看故障原因和维修进度。
💡 完成以上步骤后，你已通过「仪表盘 → OEE 钻取 → 停机明细 → 工单详情」的路径，从宏观指标一路下钻到了具体故障工单。
2.1 功能概述
本章介绍系统的两个核心首页模块：
| 模块 | 定位 | 核心功能 |
|---|---|---|
| 仪表盘 | 数据可视化大屏 | KPI 指标卡片、7 类统计图表、实时传感器监控、快捷操作入口 |
| 个人工作台 | 日常工作门户 | 待办/完成一览、常用功能快捷方式、我的学习、我的收藏、个人统计图表 |
系统支持将任一模块设为登录后的默认首页（见 §2.5 首页偏好设置）。
2.2 页面入口
- PC端：左侧菜单「仪表盘」（无条件显示）和「个人工作台」（需要
workbench:view权限） - 移动端：底部导航栏「📊 工作台」Tab（需要
workbench:view权限）
2.3 PC端 - 仪表盘
2.3.1 页面布局
仪表盘页面从上到下分为五个区域：
- KPI 指标卡片行 — 4 张统计卡片
- 时间筛选工具栏 — 快捷时间范围 + 日期选择器 + 粒度切换 + 重置
- 图表区域 — 7 张图表卡片（3 列自适应网格布局）
- 快捷操作区 + 实时传感器 — 底部操作按钮 + WebSocket 实时数据
- 最新工单列表 — 最近工单快速预览表格（含工单编号、设备名称、状态、优先级、创建时间）
2.3.2 KPI 指标卡片
页面顶部一行 4 张卡片，展示核心运维指标：
| 指标 | 说明 | 单位 |
|---|---|---|
| OEE（设备综合效率） | 设备实际产出 / 理论最大产出 | % |
| MTBF（平均故障间隔） | 两次故障之间的平均运行时间 | 小时 |
| MTTR（平均修复时间） | 故障后恢复的平均耗时 | 小时 |
| 故障率 | 故障设备数 / 总设备数 | % |
2.3.3 时间筛选
工具栏提供灵活的时间范围控制：
| 控件 | 选项 | 说明 |
|---|---|---|
| 快捷时间范围 | 最近 7 天 / 最近 6 周 / 最近 12 个月 | 一键设置统计区间 |
| 日期范围选择器 | 自定义起止日期 | 精确选择统计时间段 |
| 粒度 | 天 / 周 / 月 | 控制图表数据的聚合粒度 |
| 重置按钮 | — | 恢复默认筛选条件 |
统计窗口摘要行显示当前正在查看的时间范围和粒度，例如：统计窗口: 2026-04-01 ~ 2026-05-05 / 周
2.3.4 图表区域
仪表盘包含 7 张图表卡片，每个图表支持点击钻取（点击图表区域弹出明细数据弹窗）：
| 图表 | 类型 | 钻取内容 |
|---|---|---|
| OEE 趋势分析 | 折线图 | OEE 指标明细 |
| 设备状态分布 | 饼图 | 设备状态明细列表 |
| 维护计划执行情况 | 柱状图（计划 vs 实际） | 维护记录明细 |
| 设备 OEE 对比 | 柱状图 | 各设备 OEE 详细构成 |
| 维护成本趋势 | 折线图 | 维护成本明细 |
| 工单完成率统计 | 柱状图（已完成 vs 全部） | 工单明细 |
| 客户评价统计 | 环形饼图（评分分布） | 评价明细（需「查看工单评价」权限） |
钻取抽屉
图表上任意数据点（柱/扇区/折线点）点击后会从右侧滑出钻取抽屉，抽屉从上到下包含：
- 来源面板 — 显示来源图表名称 + 明细标题 + 结果总数 + 当前页已加载条数
- 筛选条件卡片 — 来源图表、筛选值、时间粒度等当前筛选条件
- 数据表格（各图表类型不同，见下表）
- 底部操作栏 — 「导出 CSV」按钮，将当前明细数据导出为 CSV 文件
各图表的钻取列与行操作：
| 图表 | 表格列（除编号/名称基础列及"操作"列外；各图表中"编号"为设备编号或工单编号，"名称"为设备名称或工单标题） | 行操作 |
|---|---|---|
| 设备状态分布 | 型号、类型、状态 | 「设备详情」、「创建工单」（需创建工单权限） |
| OEE 趋势分析 | 可用率、故障次数 | 「设备详情」、「停机明细」（二层钻取） |
| 工单完成率 | 工单形态、标题、类型、状态、优先级、创建/完成时间 | 「工单详情」/「组合详情」；顶部有筛选标签：全部/已完成/未完成/逾期 |
| 维护计划执行 | 工单形态、任务名、类型、状态、计划日期、完成日期 | 「工单详情」；顶部有筛选标签：全部/计划中/已完成 |
| 维护成本趋势 | 工单形态、标题、材料费、人工费、外包费、合计、完成时间 | 「工单详情」；顶部汇总卡片（材料费/人工费/外包费/合计） |
| 设备 OEE 对比 | 型号、状态、可用率、性能率、良品率、OEE、故障次数、总成本 | 「设备详情」 |
| 客户评价统计 | 工单形态、标题、评分、评价内容、完成时间 | 「工单详情」 |
OEE 两层钻取：OEE 和图表的钻取是唯一支持两层下钻的。在 OEE 明细表格中点击某设备的「停机明细」→ 抽屉内容切换为该设备的故障工单列表，顶部出现面包屑导航，可点击返回上一层。
其他抽屉功能：
- 分页：表格支持分页、排序（点击列头）
- 关闭：点击抽屉外区域或右上角 × 关闭，图表高亮自动取消
2.3.5 快捷操作区
仪表盘底部提供 4 个快捷操作按钮：
| 按钮 | 功能 | 所需权限 |
|---|---|---|
| 紧急报修 | 快速创建紧急维修工单 | 创建工单 |
| 扫码报修 | 扫码设备二维码报修 | 创建工单 |
| 新建工单 | 打开新建工单表单 | 创建工单 |
| 查看BIM模型 | 打开 BIM 三维模型浏览器 | — |
2.3.6 实时传感器数据
底部卡片展示通过 WebSocket 连接的传感器实时数据。卡片右侧显示连接状态（已连接/已断开）和连接/断开按钮。
2.4 PC端 - 个人工作台
个人工作台是系统的默认首页，登录后自动展示。
2.4.1 页面布局
工作台页面从上到下分为以下区域：
- 标题行 + 统计周期选择器（本周/本月/本季/本年）
- KPI 卡片行 — 4 张统计卡片
- 常用功能快捷方式 — 可编辑的页面快捷入口网格
- 待办 + 完成双栏布局 — 左栏「我的待办」+ 右栏「最近完成」
- 我的学习 — 培训记录概览
- 我的收藏 — 收藏的工单/设备/知识库条目
- 统计图表行 — 完成趋势 + 工单类型分布
- 首页偏好设置 — 选择默认首页
2.4.2 KPI 卡片
| 指标 | 颜色 |
|---|---|
| 待办数（含逾期徽标） | 蓝色 |
| 本月完成 | 绿色 |
| 完成率 | 蓝色 |
| 及时率 | 绿色 |
统计周期通过右上角的「本周 / 本月 / 本季 / 本年」单选按钮切换，切换后 KPI 和待办列表同步刷新。
2.4.3 常用功能快捷方式
这一区块允许用户自定义页面快捷入口，点击后直接跳转到对应功能页面。
- 编辑模式：点击右上角「+ 编辑」，进入编辑状态
- 已添加的快捷方式出现 × 删除按钮
- 下方出现可选页面标签云，点击即添加
- 完成模式：点击「完成」退出编辑
快捷方式数据存储在服务器端，按用户保存。每次登录自动同步。 可选页面包括仪表盘、设备管理、设备地图、工单管理、点检模板/计划、维护计划、备件管理、知识库、智能问答、审批管理、成本分析、传感器管理、实时监控、权限管理、位置/部门/客户/供应商/设备类型档案、SOP关联、据点对比、租户管理、配置向导、BIM浏览器等 26 个页面。
2.4.4 我的待办
左栏展示当前用户的待办工单列表，每个条目包含：
- 工单标题（或编号）
- 逾期标记（红色标签）
- 关联设备名称
- 优先级标签
点击任意待办条目 → 打开工单详情弹窗。
右上角「查看全部」→ 跳转到工单管理页面。
2.4.5 最近完成
右栏展示最近完成的工单，每个条目包含：
- 工单标题
- 评分星星（当前用户评价）
- 准时/逾期标记
- 关联设备名称
点击任意条目 → 打开工单详情弹窗。
2.4.6 我的学习
展示当前用户的培训记录，需要「查看我的培训记录」权限。
每条培训记录显示：
- 课程名称
- 状态标签（已分配/进行中/已完成/已过期…）
- 完成日期或分配日期
- 是否需要考试
点击记录 → 打开培训详情弹窗。
2.4.7 我的收藏
展示用户收藏的工单、设备、知识库条目。每个收藏卡片显示：
- 收藏类型图标 + 标题
- 目标类型标签
点击卡片 → 打开对应的详情弹窗。右上角「刷新」按钮重新加载收藏数据。
2.4.8 统计图表
| 图表 | 类型 | 说明 |
|---|---|---|
| 完成趋势 | 折线图 | 按时/逾期的完成数量随时间变化 |
| 工单类型分布 | 饼图 | 各类型工单占比 |
2.4.9 PDF 文档预览
如果收藏或培训记录中包含 SOP 关联的 PDF 文档，点击后弹出 PDF 预览弹窗，使用 iframe 嵌入渲染。
2.5 首页偏好设置
工作台页面底部有一个「⚙️ 首页偏好设置」区域，用户可以在此选择登录后默认显示的页面：
| 选项 | 说明 |
|---|---|
| 个人工作台 | 登录后默认进入工作台（默认值） |
| 仪表盘 | 登录后默认进入仪表盘大屏 |
设置立即生效。下次登录时自动跳转到选中的首页。
2.6 移动端 - 工作台
移动端底部导航栏「📊 工作台」Tab，进入移动端工作台页面（需要「查看个人工作台」权限）。
2.6.1 页面布局
从上到下：
- KPI 概览 — 4 张卡片（待办/已完成/完成率/及时率），点击待办卡片跳转到任务列表
- 培训学习摘要卡 — 待学习/进行中/即将到期/已过期 四个数字
- 我的待办预览 — 前 3 条，点击跳转工单详情
- 最近完成预览 — 前 3 条（含准时/逾期标记 + 评分）
- 我的收藏 — 收藏列表
- 底部刷新 — 「↻ 刷新数据」链接，点击重新加载所有数据
2.6.2 数据说明
PC 端和移动端工作台共享同一数据源。
2.7 常见问题
Q: 为什么仪表盘的图表不显示？ A: 请检查浏览器是否支持 ECharts。图表在切换菜单后通过 nextTick 延迟初始化，如果仍不显示，尝试刷新页面。
Q: 工作台的待办数为 0？ A: 待办数统计的是当前用户的待处理工单。如果没有被分配的工单，待办数为 0。
Q: 快捷方式修改后没有生效？ A: 快捷方式数据存储在服务器端，刷新页面即可同步。如果仍未生效，检查网络请求是否成功。
Q: 移动端工作台页面看不到？ A: 需要「查看个人工作台」权限。联系管理员确认角色权限配置。
2.8 相关权限
仪表盘与工作台模块涉及的权限列表：
| 权限 | 中文名称 | 说明 |
|---|---|---|
dashboard:view | 查看仪表盘 | 仪表盘页面访问权限（注：PC端左侧菜单项无条件显示，不受此权限控制；权限仅作用于页面级访问与数据加载） |
dashboard:customize | 自定义仪表盘 | 自定义仪表盘布局和卡片（仅超级管理员默认持有） |
dashboard:drilldown:view | 查看仪表盘钻取详情 | 点击图表数据点查看钻取明细（仅超级管理员/租户管理员默认持有） |
workbench:view | 查看个人工作台 | 个人工作台菜单入口权限 |
workbench:favorite | 管理收藏夹 | 添加/删除/排序个人收藏 |
workorder:create | 创建工单 | 仪表盘快捷操作（紧急报修/扫码报修/新建工单） |
workorder:rate:view | 查看工单评价 | 仪表盘客户评价统计图表 |
mobile:access | 移动端访问 | 允许访问移动端应用 |
mobile:workorder:view | 移动端查看工单 | 移动端工作台待办预览 |
mobile:scan:qr | 移动端扫码 | 移动端扫码功能 |
mobile:report:issue | 移动端报修 | 移动端快速上报设备问题 |
training:record:my_view | 查看个人培训记录 | 工作台「我的学习」卡片 |
角色默认权限分配：
| 角色 | 仪表盘/工作台相关权限 |
|---|---|
| 超级管理员 | 全部权限 |
| 租户管理员 | 全部权限 |
| 设备主管 | 查看仪表盘、查看个人工作台、管理收藏夹、创建工单、查看工单评价、移动端全部权限 |
| 技术员 | 查看仪表盘、查看个人工作台、管理收藏夹、移动端全部权限（含移动端查看/执行工单） |
| 操作员 | 查看仪表盘、查看个人工作台、管理收藏夹、创建工单（可报修）、评价工单、移动端查看工单、移动端扫码、移动端报修 |
| 仓库管理员 | 查看仪表盘、移动端扫码 |
| 只读用户 | 查看仪表盘 |