异常管理页面

  • 路由:/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 超时提醒、批量处理、关联设备及关闭复核权限。