异常管理页面
- 路由:
/exception
- 实现:
src/views/Exception.vue
- 数据:
src/stores/exceptions.ts
- 状态:已开发,使用页面内演示数据并通过
localStorage 持久化处理结果
- 原型依据:异常管理查询表格、状态、处理和删除操作原型
页面目标
集中查看测试过程中的异常采样、阈值越界和设备反馈,完成异常发现、处理记录和删除确认闭环。
当前功能
- 支持按异常记录 ID、测试名称、创建时间、状态和处理人组合查询。
- 状态和处理人下拉菜单提供可直接选择的“全部”选项。
- 筛选条件桌面端按四列、三列、两列、单列等分铺满并响应式换行,查询和重置按钮位于最后一列。
- 记录按异常生成时间倒序排列,最新异常显示在顶部。
- 表格展示异常记录 ID、测试 ID、测试名称、测试时间、异常项、异常值、正常值、异常生成时间、处理人、处理时间、状态和操作。
- 异常状态包括“待处理”和“已处理”;异常值使用红色强调,状态使用橙色/绿色标签区分。
- “处理”操作要求填写处理说明,完成后写入当前用户、处理时间并切换为“已处理”。
- “删除”操作必须二次确认,确认后从本地演示数据移除并修正分页。
- 支持下载当前筛选条件下的全部异常记录为 UTF-8 BOM CSV。
- 表格横向滚动时,操作列固定在最右侧。
数据结构
- 异常记录:
id、testId、testName、testTime、exceptionItem、abnormalValue、normalValue、generatedAt、processor、handledAt、status、handleRemark。
- 数据源位于
src/stores/exceptions.ts,处理与删除结果保存到当前站点 localStorage。
待明确
接入异常规则 API、异常优先级与分类、处理人分派、SLA 超时提醒、批量处理、关联设备及关闭复核权限。