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.1 KiB
1.1 KiB
1. 图表布局修复
- 1.1 检查 BaseChart.vue 响应式配置,确保 maintainAspectRatio: false 和 responsive: true
- 1.2 为统计卡片添加 CSS 约束,设置 overflow: hidden 和固定高度
- 1.3 验证图表在移动端(<375px)下正常缩放无溢出
2. 折线图数据过滤
- 2.1 在统计页面组件中添加当前日期获取逻辑
- 2.2 实现数据过滤函数,根据周期类型(日/周/月/年)截断未来日期数据
- 2.3 更新折线图数据传递,仅传递过滤后的数据
- 2.4 验证 X 轴不再显示未来日期
3. 饼图标签渲染
- 3.1 安装 chartjs-plugin-datalabels 插件
- 3.2 在 useChartTheme.ts 中添加饼图标签配置
- 3.3 实现标签位置计算和扇区大小阈值控制(<5% 隐藏标签)
- 3.4 添加暗色模式下的标签颜色适配逻辑
- 3.5 验证标签在各类别扇区上正确显示
4. 测试与验证
- 4.1 运行前端 lint 检查
- 4.2 在桌面端验证所有图表显示正常
- 4.3 在移动端验证响应式布局
- 4.4 验证暗色模式下图表标签可读性