产品需求文档:故障管理(按用户流程)
说明: 当前文件是可直接打开的 HTML 预览版,与运营控制台原型
faults.html 一一对应。源截图位于 ../screenshots/faults-prd/。1. 介绍 / 概述
故障管理页面是运维人员快速查看处于故障状态的设备、了解故障描述与首处理建议、并对单台设备发起远程操作的入口。
页面定位:
- 桌面端:表格清单展示故障设备。
- 移动端:单列卡片展示故障设备。
页面承载三件事:
- 查看当前账号可见范围内、状态为「故障」的设备清单。
- 查看每个故障的描述、首处理建议,并可展开查看完整处理步骤。
- 对单台设备唤起远程操作面板,下发四类指令之一。
2. 目标
- 让用户进入故障管理页后,直接看到所有处于故障状态的设备,不需要先在设备页过滤。
- 让设备编号、设备地址、故障内容、故障发生时间形成稳定列序,桌面端 / 移动端一致。
- 让每行同时呈现故障描述和「首处理建议」,让运维不用展开就能判断该不该立即介入。
- 让用户可以一键展开查看完整处理步骤列表,再决定是否走线下处理或下发远程指令。
- 让用户知道当前商户配置的故障通知邮箱是谁(或未配置),方便核对告警链路。
- 让用户能按设备编号或点位名称从清单中筛选出关注的设备子集。
- 让「远程操作」收敛为一个面板入口,承载机构重启、设备开门、设备停售、音量调节四个动作。
- 让页面始终提供「返回设备页」入口。
3. 用户流程 / 用户故事
UF-001:进入故障管理并查看故障设备清单
描述: 作为运维人员,我希望进入故障管理页面后看到所有当前处于故障状态的设备。
主流程:
- 用户从侧边栏点击「故障列表」,进入故障管理页。
- 页面标题展示「故障管理」,副标题「故障设备清单与远程处置」。
- 清单展示状态为「故障」且当前账号有权限访问的设备。
- 清单右上角显示「故障设备 N 台」徽章。
验收标准:
- 页面标题为「故障管理」,副标题为「故障设备清单与远程处置」。
- 页头右上角提供「返回设备页」按钮。
- 清单只展示设备状态等于「故障」的条目;非故障设备不进入此清单。
- 清单只展示当前账号有权限访问的故障设备(由
canAccessFaultDevice(deviceId)判断)。 - 「故障设备 N 台」徽章按当前筛选下的清单数量实时刷新。
- 桌面端表格列序:设备编号 → 设备地址 → 故障内容 → 故障发生时间 → 操作。
参考截图:

UF-002:按设备编号或点位名称筛选故障清单
描述: 作为运维人员,我希望能按设备编号或点位名称筛选清单。
主流程:
- 用户点击顶部「设备:全部」触发框。
- 系统展开筛选下拉:搜索框 +「全选设备」开关 + 全部可见故障设备候选项。
- 用户在搜索框输入关键字。
- 下拉候选项按关键字过滤;用户勾选目标设备。
- 清单和右上角徽章按筛选结果刷新。
验收标准:
- 搜索框 placeholder 为「搜索设备编号或点位名称」。
- 搜索同时匹配设备编号、点位名称、显示用的组合标签;大小写不敏感。
- 下拉提供「全选设备」复选框,可一键全选 / 全清。
- 每个候选项的显示文案为「点位名称 · 设备编号」组合。
- 搜索无结果时显示一个禁用的「无匹配设备」占位项。
- 搜索框按下回车时,自动选中当前过滤结果的第一项并关闭下拉。
- 触发框文案随选择状态变化:全选 = 「设备:全部」;未选 = 「设备:未选择」;选 1-2 台 = 「设备:编号1、编号2」;选 3 台及以上 = 「设备:已选 N 台」。
参考截图:

UF-003:在清单中阅读故障描述和首处理建议
描述: 作为运维人员,我希望故障内容列同时给出故障描述和首处理建议,这样我不展开行就能判断是否需要立即处理。
主流程:
- 用户在清单中扫读故障内容列。
- 第一行展示故障描述,格式为「部件 · 现象」(例如「咖啡机 · 未检测到 SD 卡」)。
- 第二行展示首条处理建议,前面带 ⏱ 图标。
- 若处理建议多于 1 步,右侧出现「查看全部 N 步」可点击文本。
- 故障发生时间显示在独立列。
验收标准:
- 故障描述优先从故障库
CofeFaultLibrary.getFaultForDevice(deviceId).description取,使用「部件 · 现象」的形式。 - 故障库无匹配时,回落到
orgStatus异常部件名 + 「故障 / 失联」,用中文「,」连接(例如「咖啡机失联,机械臂故障」)。 - 仍无匹配时,使用「{设备编号} 设备异常」作为最终兜底文案。
- 故障描述文字使用警示色(深橙)显示。
- 有处理建议时,第二行展示首条建议,前缀带 ⏱ 图标;处理建议为空时显示「暂无处理建议,请联系运维」灰色提示。
- 仅在处理建议多于 1 步时显示「查看全部 N 步」入口;恰好 1 步时不显示。
- 故障发生时间使用「YYYY-MM-DD HH:mm:ss」固定格式。
UF-004:展开一行查看完整处理步骤
描述: 作为运维人员,遇到需要逐步排查的故障,我希望能展开行查看完整的处理步骤列表。
主流程:
- 用户在桌面表格中点击某行(除「操作」列外的任意位置)或点击「查看全部 N 步」。
- 系统将该行切换为展开状态,下方出现「如何处理 · 完整步骤」标题和有序步骤列表。
- 同时「查看全部 N 步」右侧的 ▾ 图标变为 ▴,提示当前已展开。
- 用户再次点击行 / 「查看全部 N 步」可收起。
验收标准:
- 展开 / 收起逻辑由
toggleFaultRowExpand(deviceId)统一处理,给目标行切换is-expandedclass。 - 展开后下方区域
.fault-row-detail显示「如何处理 · 完整步骤」标题和有序列表(1. ... 2. ... 3. ...)。 - 「查看全部 N 步」点击事件需要
event.stopPropagation(),避免和整行点击叠加成"展开再立刻收起"。 - 整行也可触发展开(
.fault-row-summary是role="button"),但点「操作」列不能触发展开。 - 无处理步骤的故障(暂无建议)不渲染「查看全部」入口。
参考截图:

UF-005:核对故障通知邮箱
描述: 作为运维人员,我希望在清单上直接看到这台设备的故障通知会推给哪个邮箱,这样我能确认告警链路是否生效。
主流程:
- 用户在清单中扫读设备地址列。
- 设备地址下方紧贴一个邮箱徽章,反映该设备所属商户配置的通知邮箱。
- 已配置时徽章显示「✉️ 推送至 邮箱地址」;未配置时显示「✉️ 未配置通知邮箱」并使用更弱的灰色。
验收标准:
- 邮箱来源链路:故障设备 → 所属商户 →
customers列表中匹配customerId的notifyEmail字段。 - 已配置邮箱:徽章文案「✉️ 推送至 {email}」,title 提示「故障通知将发送至该邮箱」。
- 未配置邮箱:徽章使用
fault-notify-email-empty样式(灰色),文案「✉️ 未配置通知邮箱」,title 提示「该商户尚未配置故障通知邮箱」。 - 徽章本身不可点击编辑邮箱;要修改通知邮箱需到客户管理模块。
UF-006:唤起远程操作面板并下发指令
描述: 作为运维人员,我希望对某台故障设备发起远程指令时,所有可用动作集中在同一个面板里。
主流程:
- 用户在故障清单中点击某台设备行末的「远程操作」按钮。
- 系统弹出「远程操作 · 设备编号」面板,列出四个动作按钮。
- 用户点击其中一个动作。
- 系统关闭面板,并通过浏览器 alert 弹窗反馈「已向设备 X 下发指令:Y」。
验收标准:
- 面板标题携带目标设备编号,例如「远程操作 · RCK386」(桌面端居中对话框
fault-desktop-dialog)。 - 面板四个动作按钮固定顺序:机构重启 → 设备开门 → 设备停售 → 音量调节。
- 点击任一动作后,面板关闭并通过 alert 反馈下发指令的设备编号与动作名称。
- 点击面板背景遮罩(
fault-sheet-backdrop)可关闭面板。 - 当前账号对该故障设备无访问权限时,
openRemoteActions直接 return,面板不弹出。
参考截图:

UF-007:移动端查看故障清单并发起远程操作
描述: 作为巡店 / 值班人员,我希望在手机上也能完整完成查看故障 → 发起远程指令的闭环。
主流程:
- 用户在手机打开故障管理页面。
- 页面以单列卡片展示每台故障设备,含设备编号、设备地址、通知邮箱徽章、故障内容、首处理建议、故障发生时间。
- 每张卡片底部固定「远程操作」按钮。
- 用户点击按钮唤起远程操作面板(同 UF-006,移动端使用底部抽屉
fault-sheet-panel,无标题)。 - 用户选择动作;系统关闭面板并 alert 反馈。
验收标准:
- 移动端使用单列卡片,每张卡片在桌面表格四个字段(编号 / 地址 / 故障内容 / 发生时间)之上再加底部「远程操作」按钮。
- 设备地址下方仍展示通知邮箱徽章。
- 「远程操作」按钮在卡片底部全宽展示。
- 移动端的远程操作面板使用底部抽屉样式(
fault-sheet-panel),不显示「远程操作 · 设备编号」标题。 - 桌面端 / 移动端的切换由
isDesktopInteractionMode()(window.innerWidth ≥ 1024)决定。
参考截图:


4. 功能需求
- 故障清单:聚合状态为「故障」且当前账号可访问的设备,桌面端表格、移动端卡片。
- 设备筛选:搜索框 + 全选设备 + 候选多选;搜索匹配编号 / 点位名称,大小写不敏感;回车直选第一项。
- 触发框文案:「设备:全部」/「设备:未选择」/「设备:编号1、编号2」/「设备:已选 N 台」四种状态。
- 无匹配占位:搜索无结果时下拉显示一个禁用的「无匹配设备」占位项。
- 故障描述:优先来自
CofeFaultLibrary,无匹配时回落到orgStatus异常部件名拼接,再无匹配则用「{设备编号} 设备异常」。 - 首处理建议:清单中展示故障库返回的首条 handling 步骤,前缀带 ⏱ 图标;处理建议为空时显示「暂无处理建议,请联系运维」。
- 查看全部 N 步:仅在 handling 长度大于 1 时展示该入口;点击 / 点击行 都触发同一个
toggleFaultRowExpand。 - 行展开:展开后下方显示「如何处理 · 完整步骤」+ 有序列表;caret 在 ▾ / ▴ 之间切换。
- 通知邮箱徽章:根据所属商户的
notifyEmail显示「✉️ 推送至 X」或「✉️ 未配置通知邮箱」。 - 故障发生时间:使用「YYYY-MM-DD HH:mm:ss」格式。
- 统计徽章:「故障设备 N 台」随筛选实时更新。
- 远程操作面板:唤起后展示四个动作(机构重启 / 设备开门 / 设备停售 / 音量调节);桌面端居中对话框,标题带设备编号;移动端底部抽屉,无标题。
- 下发反馈:点击任一动作后关闭面板,通过 alert 提示「已向设备 X 下发指令:Y」。
- 返回入口:页头右上角「返回设备页」按钮,跳转到
devices.html。 - 权限网关:通过
canAccessFaultDevice(deviceId)判断当前账号是否能访问该故障设备,无权限时清单不展示且远程操作面板不响应。 - 设备 / 移动端切换:由
window.innerWidth ≥ 1024决定。
5. 当前版本限制
- 四个远程动作目前只通过浏览器 alert 反馈「已下发指令」,未与后端下发链路接通。
- 没有二次确认弹窗、原因输入、音量滑杆、操作冷却等机制;面板的四个按钮点击后即视为下发。
- 通知邮箱徽章是只读展示,不能在故障管理页内编辑,需要去客户管理模块改
notifyEmail。 - 故障管理页内不直接编辑设备状态、不查看异常 / 运维记录、不管理工单或备件(
openEditStatus、openStatusRecords等函数已在源文件中存在,但本页未提供入口)。 - 清单按数据数组顺序渲染,不在前端进行额外排序。