2.7 KiB
2.7 KiB
FIIH数据总览 - 趋势分析图表功能
一、需求概述
在现有的FIIH数据总览页面（dataOverview/index.vue）顶部新增趋势分析图表区域，参考IOT数据趋势分析页面（iot/trend/index.vue）的实现方式。
变更说明：原计划新建独立的"质检分析"页面，现改为直接在数据总览页面添加趋势图表，减少页面跳转，提升用户体验。
二、数据结构说明
2.1 通道配对规则
从ch4开始，偶数通道存储质检项名称，奇数通道存储对应的质检数据值：
| 质检项通道 | 质检数据通道 | 说明 |
|---|---|---|
| fiih_data_ch0~ch3 | - | 前4个通道为其他用途 |
| fiih_data_ch4 | fiih_data_ch5 | ch4存质检项名称，ch5存ch4的检测值 |
| fiih_data_ch6 | fiih_data_ch7 | ch6存质检项名称，ch7存ch6的检测值 |
| ... | ... | 以此类推 |
| fiih_data_ch22 | fiih_data_ch23 | ch22存质检项名称，ch23存ch22的检测值 |
2.2 配置表通道说明
配置表 ymes_fiih_config 中的 fiih_config_ch0~ch23 字段存储JSON格式的通道配置：
{
"data_name": "温度",
"unit": "℃",
"lower_limit": 20,
"upper_limit": 40,
"enabled": true
}
三、功能设计
3.1 趋势分析功能
- 对象体多选：支持同时选择多个对象体进行对比分析
- 质检项多选：支持同时选择多个质检项，质检项会合并所有选中对象体的质检项并显示支持数量
- 日期范围选择：支持自定义日期范围和快速日期按钮（近7天、近30天、近90天）
- 上下限线：仅当选择单个对象体+单个质检项时显示上下限线
- 多系列图表：每条线显示"对象体-质检项"（单对象体时只显示质检项名称）
3.2 图表展示
- X轴：采集时间
- Y轴：质检数据值
- 多条数据线：不同颜色区分不同对象体/质检项组合
- 上下限线：橙色虚线（仅单对象体+单质检项时显示）
四、已完成的修改
4.1 后端文件
| 文件路径 | 修改内容 |
|---|---|
FiihDataController.java |
添加 /inspectionItems 和 /trend 接口 |
IFiihDataService.java |
添加 getInspectionItems 和 getTrendData 方法 |
FiihDataServiceImpl.java |
实现趋势数据查询，支持多对象体多质检项 |
4.2 前端文件
| 文件路径 | 修改内容 |
|---|---|
fiihData.js |
添加 getInspectionItems 和 getTrendData API |
dataOverview/index.vue |
添加趋势分析卡片，支持多选和ECharts图表 |
五、无需新增SQL
不需要新建菜单，直接在现有数据总览页面添加功能。