# 故障录波前端页面设计 > 状态：初稿，2026-10-16；同日按用户意见调整：“参数读取”页改为“功能操作”，参数设置只保留 5、6 并改用 cmd=0 读取。用户将根据实现效果再提意见。功能目标见 [requirements.md](requirements.md)，后端设计见 [technical-design.md](technical-design.md)。组件库沿用 naive-ui，波形图沿用 uPlot。 ## 1. 菜单结构 ```text 故障录波 （替换现有“故障录波配置”） ├── 生产服 │ ├── 录波记录 │ ├── 设备信息 │ ├── 功能操作（功能码 1、3、4、7） │ └── 参数设置（功能码 5、6） └── 测试服 └── （同上） ``` - 路由形如 `fault-record/prod/record`、`fault-record/prod/function`、`fault-record/test/param-write`。两套环境使用同一组页面组件，环境从路由参数获取。 - 现有 `fault-record/read`、`fault-record/write` 页面下线，参数设置按第 6 节重新设计。 - 功能码按页面划分： | 功能码 | 名称 | 页面 | 读取 | 设置／执行 | | --- | --- | --- | --- | --- | | 1 | 清除设备故障波形 | 功能操作 | 无（动作） | cmd=1 | | 2 | 采样通道配置 | **暂不开放** | — | 设备端暂未实现 | | 3 | 手动触发故障录波 | 功能操作 | 无（动作） | cmd=1 | | 4 | 设备对时 | 功能操作 | cmd=3 | cmd=1 | | 5 | 采样频率 | 参数设置 | cmd=0 code=2 | cmd=1 | | 6 | 可配采样通道 | 参数设置 | cmd=0 code=1 | cmd=1 | | 7 | 录波功能开关 | 功能操作 | cmd=3 | cmd=1 | - 每个页面顶部固定显示环境标签：**生产服**用醒目的警示色，测试服用中性色，避免在错误的环境操作。 ## 2. 公共组件 ### 2.1 设备选择条 ```text ┌──────────────────────────────────────────────────────────────────┐ │ [生产服] 网关 SN [________________] [查询] 设备 [aGate ▼] │ │ 站点：xxx 在线 aPower ×3 │ └──────────────────────────────────────────────────────────────────┘ ``` - 输入网关 SN 后查询站点信息，设备下拉为 `aGate` + 各 aPower SN（`pe`）。 - 显示站点在线状态，离线时给出提示但不禁止操作。 - 最近使用的网关 SN 存在本地，方便再次选择。 ### 2.2 操作进度 ```text 已发送 ─── 设备已应答 ─── 数据就绪 ─── 平台上传中 ─── 上传完成 ─── 已下载 ─── 完成 ✓ ✓ ● [取消] ``` - 每个阶段显示时间；失败时在对应阶段显示原因（设备忙、超时、单项失败等）。 - “设备忙”单独提示：“设备正在处理其他命令（可能来自 FWH 平台），请稍后再试”。 - 可取消的阶段显示“取消”按钮，规则见 [technical-design.md](technical-design.md#45-取消cmd4)。 - 可展开“原始报文”，按时间列出收发的全部报文 JSON，便于排查。 ### 2.3 操作历史 各功能页底部都有历史表，按当前环境和网关筛选，所有人共享： | 时间 | 操作人 | 网关 | 设备 | 操作 | 参数摘要 | 状态 | 操作 | | --- | --- | --- | --- | --- | --- | --- | --- | 点击一行可回看当时的进度、原始报文和结果。 ## 3. 录波记录 ```text ┌ 设备选择条 ───────────────────────────────────────────────────────┐ ├ 故障录波总目录 [刷新目录] ────────┤ │ 序号 │ 发生时间（设备时间）│ 触发源 │ 参数版本 │ 操作 │ │ 7 │ 2026-08-18 03:03:08 │ 0x1001 并网发生状态切换故障 │ 00000001 │ [获取] │ │ … │ ├ 当前操作进度（见 2.2） ─────────────────────────────────────────────┤ ├ 操作历史（见 2.3），已完成的行有 [查看] [导出 ▼] ──────────────────────┤ └──────────────────────────────────────────────────────────────────┘ ``` - 目录按设备返回的顺序显示，不按序号推断时间先后；允许按时间列排序。 - 触发源显示代码和名称（名称来自协议文档 F15 表，表外代码只显示代码）。 - 可勾选多条记录后点“获取所选”，设备把所选记录打成一个包上传（最多 32 条，用户确认设备支持，2026-10-19）；每行的“获取”按钮仍可单条获取。获取进行中时，其他获取按钮禁用。 - 操作进度的“原始报文与下载记录”中，除 MQTT 报文外，还记录每次 HTTP 文件下载（路径、结果、大小或错误、耗时），并记录 609 之后短时间内到达的报文（如 610）。 - 导出下拉：原始压缩包、CSV。 ### 3.1 录波详情（抽屉或独立标签页） ```text ┌ 基本信息 ───────────────────────────────────────────────────────┐ │ 记录序号 7 发生时间 2026-08-18 03:03:08 触发源 0x1001 │ │ 采样频率 4500 Hz 采样点 1536（故障前 1024 / 故障后 512） │ │ 存储格式 v1 CAN 协议 v1 参数版本 00000001 DCDC EMS_SL:V10R80B21D00 │ ├ 波形 ────────────────────────────────────────────────────────────┤ │ 通道：☑0 0x0010 ☑1 0x0011 … ☑12 可配 Uint16@0x14990 … [全选][反选] │ │ ┌──────────────────────────────────────────────────────────────┐ │ │ │ uPlot 多通道折线，竖线标出故障时刻（第 1024 点 / 0 ms） │ │ │ └──────────────────────────────────────────────────────────────┘ │ │ X 轴：[采样点 | 相对故障时刻 ms] Y 轴：原始值（int16） │ ├ 快照通道 ──────────────────────────────────────────────────────────┤ │ 序号 │ 含义代码 │ 原始值 │ │ ├ 可配通道 ──────────────────────────────────────────────────────────┤ │ 序号 │ 类型 │ 地址 │ │ └──────────────────────────────────────────────────────────────────┘ ``` - 通道数值量级差异大，提供“分组显示”：每个勾选通道一个小图，共享 X 轴和游标，避免小信号被大信号压平。 - 游标悬停显示所有勾选通道在该点的原始值。 ## 4. 设备信息 - 勾选 `code`：故障总体信息（1）、录波功能基本信息（2）、录波总目录（3），点击“读取”。 - 每个 code 一张卡片，按协议字段列出原始值；可展开原始 `hexData`。 ## 5. 功能操作 ```text ┌ 设备选择条 ───────────────────────────────────────────────────────┐ ├ 设备对时 (4) ──────────────────┬ 录波功能开关 (7) ────────────────┤ │ 设备当前时间：2026-10-16 12:00:00│ 当前状态：使能 │ │ [日期时间] [取当前时间] [对时] │ [使能录波] [关闭录波] │ ├ 动作 ───────────────────────────┼ 读取当前值（cmd=3）────────────────┤ │ [手动触发故障录波 (3)] │ ☑4 设备时间 ☑7 录波开关 [读取] │ │ [清除设备故障波形 (1)] │ │ ├ 结果（进度 + 逐项结果）────────────────────────────────────────────┤ ├ 操作历史（读取与执行合并显示）──────────────────────────────────────┤ └──────────────────────────────────────────────────────────────────┘ ``` - 每个按钮单独执行一个功能码，执行前弹窗确认；1、3、4 以及关闭录波（7=00）标红，需勾选“我已确认”。 - 4、7 执行成功后自动复读该项。 - 4、7 的读取依赖 `cmd=3`（待实测，B01）；不支持时只能执行，不能读取。 ## 6. 参数设置 只包含功能码 5（采样频率）和 6（可配采样通道）；功能码 2 设备端暂未实现，暂不开放。 ```text ┌ 设备选择条 ───────────────────────────────────────────────────────┐ │ 读取当前值（cmd=0）：☑5 采样频率 ☑6 可配采样通道 [读取当前值] │ ├ 参数 ────────────────────────────────────┬ 待提交 ─────────────────┤ │ 采样频率 (5) [ 4500 ] Hz 设备当前值 4500 Hz │ 5 采样频率 1194 [×] │ │ 可配采样通道 (6) │ 6 可配采样通道 01… [×] │ │ 索引 │ 方式 │ 地址类型 │ 地址/代码 │ ☑ 设置成功后自动复读 │ │ 设备当前：索引1 Uint16@0x14990 … （点击带入）│ [提交设置] │ │ 高级：原始模式（仅 5、6） │ │ ├ 设置结果 + 复读核对 ─────────────────────────────────────────────────┤ ├ 操作历史 ────────────────────────────────────────────────────────────┤ └──────────────────────────────────────────────────────────────────┘ ``` - **读取当前值**改用 `cmd=0`：5 取 code=2 的采样频率，6 取 code=1 的可配采样通道；可勾选读取哪些项，默认全选；切换设备时清空。 - **可配采样通道**：读取后设备有几个通道就并列显示几行编辑框（每行：索引、方式、地址类型、地址／代码、setVal 预览、设备当前值），修改过的行高亮并标“已修改”，索引重复的行标红；可逐行“加入”，也可“全部加入待提交”或“加入已修改”一键导入多行，无效行跳过并提示；可“新增一行”或删除行。索引 1 对应 code=1 可配采样通道列表的第 1 项。默认方式和代码方式按同一格式解析（类型低字节的高 4 位为设置方式、低 4 位为地址类型，数据 4 字节；代码方式取前 2 字节为代码），后续出问题再改。 - **数据类型选项**统一首字母大写：Empty、Uint16、Int16、Float32、Uint32_HWord、Uint32_LWord、Uint32。 - **提交**前弹窗确认；生产服的确认按钮用警示色。 - **复读核对**同样用 `cmd=0`：5 比对采样频率；6 按索引取列表对应项，拼成 setVal 后比对。 相对旧页面的改进： | 旧页面 | 新设计 | | --- | --- | | 手填功能码数字和十六进制值 | 结构化表单，自动生成 `setVal` 并实时预览；保留原始模式 | | 不知道设备当前值 | 可读取当前值预填表单，点击设备当前通道带入 | | 无提交前确认 | 统一确认弹窗 | | 只显示成功／失败 | 显示进度、逐项 `resultOne` 和复读核对 | | 一次可填多个子设备 | 一次操作只针对一个设备 |