Files
EmailBill/openspec/changes/archive/2026-02-17-fix-stats-chart-bugs/proposal.md
SunCheng c49f66757e
Some checks failed
Docker Build & Deploy / Build Docker Image (push) Waiting to run
Docker Build & Deploy / Deploy to Production (push) Has been cancelled
Docker Build & Deploy / Cleanup Dangling Images (push) Has been cancelled
Docker Build & Deploy / WeChat Notification (push) Has been cancelled
1
2026-02-18 21:16:45 +08:00

1.4 KiB
Raw Blame History

Why

统计页面的图表存在两个影响用户体验的显示问题:折线图超出卡片边界且显示未来日期的平直线段,饼图缺少直接的分类标签展示。这些问题降低了数据可视化的直观性和美观度,需要修复以提升用户查看统计数据的体验。

What Changes

  • 修复折线图Line Chart在统计卡片中的溢出布局问题确保图表完全包含在卡片边界内
  • 修改折线图数据截止时间逻辑,从显示完整自然周期(如整月)改为仅显示至当前日期,避免未来日期形成无意义的平直线段
  • 优化支出分类饼图Pie Chart在饼图扇区上直接显示分类名称标签提升可读性

Capabilities

New Capabilities

  • chart-layout-constraint: 图表在容器内的自适应布局和边界约束控制
  • chart-data-filtering: 基于当前日期的动态数据过滤和范围控制
  • chart-label-overlay: 饼图扇区上的直接标签渲染和位置计算

Modified Capabilities

  • (无现有能力需要修改需求)

Impact

  • 受影响组件:
    • Web/src/components/Charts/BaseChart.vue - 基础图表组件
    • Web/src/views/Statistics/ 下的统计页面组件
    • Web/src/composables/useChartTheme.ts - 图表主题配置
  • 图表库: Chart.js 配置选项调整
  • 无API变更: 纯前端显示层修复
  • 向后兼容: 无破坏性变更