中国电信 19:00
A1
24小时
7天
最高温度
27.5°C
平均温度
26.8°C
最低温度
26.2°C
A2

温度趋势

单位:°C
数据保留7天,更多历史请导出

页面定位

展示设备上报的历史水温数据,是水族箱主面板「更多历史」的 数据分析子页面, 支持按 24 小时 / 7 天 两种时间维度查看趋势, 便于用户判断近期水温是否稳定、是否需要调整设备策略。

数据来源 & 刷新策略

  • 展示数据来自水族箱设备上报的水温 DP(如 dp_temperature)。
  • 页面打开时拉取最近一段时间的历史数据接口(如 GET /devices/{id}/temperature/history)。
  • 本页数据为只读,不允许在此直接控制设备,仅做趋势查看。

上下游关系

  • 入口:水族箱主面板「温度模块」里的「历史记录」/「查看详情」按钮。
  • 返回:点击左上角返回,回到上一级主面板,需保留原主面板的滚动位置和卡片展开状态。

交互与状态

  • 默认选中:首次进入页面默认选中 24 小时 维度。
  • 24 小时:展示最近 24 小时的每小时温度点(X 轴:整点时间)。
  • 7 天:展示最近 7 天的每日平均温度(X 轴:日期/星期)。
  • 滑块动画:白色滑块平滑滑动到当前选项,下方卡片与折线图同时刷新。

数据与接口约定

  • 前端切换 Tab 时,不强制每次重拉接口,如接口支持可优先: /history?range=24h / /history?range=7d
  • 如后端只提供统一接口,则由前端在本地按小时/按天聚合计算。

异常与边界

  • 设备离线或无历史数据时,保持 Tab 正常可切换,但图表区域展示「暂无数据」占位文案。
  • 弱网/请求失败时,保留上一次成功的数据,并在 Toast 中提示「数据刷新失败」。

展示规则

  • 顶部三张卡片分别展示:最高温度 / 平均温度 / 最低温度
  • 卡片数值来自当前时间维度的数据汇总(例如: max / avg / min)。
  • 单位固定为 ,与设备 DP 保持一致。

图表交互

  • 折线样式为平滑曲线,支持区域渐变填充,主题色为 #3B82F6
  • 支持悬停/点击数据点显示 Tooltip:内容为「时间 + 温度值」,如「12:00,27.5℃」。
  • Y 轴根据当前数据的最小/最大值自适应区间,预留 5% 头尾空白,避免曲线贴边。

权限 / 安全

  • Owner / Member 角色均可查看本页,无额外权限限制。
  • 接口请求需携带家庭/设备授权信息,禁止跨家庭访问其他用户的历史温度数据。

文案含义

当前文案为「数据保留 7 天,更多历史请导出」,需要与实际后端策略保持一致: 若后端调整保留时长,需同步修改此文案。

业务约定

  • 数据保留时长:后端按设备维度至少保留最近 7 天的温度数据用于本页展示。
  • 导出入口:若后续提供「导出」功能,入口建议在本页右上角或主面板「更多」中出现,并在此文案中引导。

埋点 & 测试要点

  • event_temp_history_view:进入「温度记录」页面一次上报一次,携带设备 ID、时间维度。
  • event_temp_range_switch:切换 24 小时 / 7 天时上报,包含原维度和新维度。
  • 测试需覆盖:设备离线、有/无历史数据、弱网请求失败、短时间内多次切换时间维度等组合场景。