3.6 KiB
3.6 KiB
工作台费用统计详情弹窗 TODO
调研与契约
- 核对
PersonalWorkbench.vue、工作台样式和现有用户画像弹窗结构。[CONCEPT: 方案设计] 证据：已确认工作台入口、ExpenseProfileDetailModal.vue弹窗模式和personal-workbench.css分割样式。 - 明确费用详情弹窗的数据结构，并限制为前端工作台汇总数据。[CONCEPT: 功能能力] 证据：采用
expenseStatsDetail，由buildWorkbenchSummary基于当前用户单据生成。
前端实现
- 移除费用进度卡片右上角“全部进度”按钮。[CONCEPT: 目标与非目标] 证据：
PersonalWorkbench.vue的费用进度标题区已移除该按钮。 - 调整“10日以上”分割标识为居中、醒目主题色样式。[CONCEPT: 指标与验收] 证据：
personal-workbench.css使用left: 50%、transform: translateX(-50%)和主题强调色。 - 在
workbenchSummary.js生成费用分布、处理时间、系统操作详情数据。[CONCEPT: 算法与公式] 证据：新增expenseStatsDetail汇总结构。 - 新增费用统计详情弹窗组件，展示三个详情区块和空状态。[CONCEPT: 功能能力] 证据：新增
ExpenseStatsDetailModal.vue。 - 在
PersonalWorkbench.vue接入弹窗状态与费用统计“查看详情”按钮。[CONCEPT: 方案设计] 证据：新增expenseStatsModalOpen与openExpenseStatsModal。 - 将费用分布区从条形列表改为
DonutChart饼图展示。[CONCEPT: 功能能力] 证据：ExpenseStatsDetailModal.vue已接入DonutChart和distributionChartItems。 - 关闭费用详情内
DonutChart自带图例，改为单饼图加右侧文字明细。[CONCEPT: 2026-06-03 饼图呈现修正] 证据：ExpenseStatsDetailModal.vue传入:show-legend="false"并新增expense-distribution-summary-list。 - 为通用
DonutChart增加可隐藏内置图例的开关，默认保持其它页面不变。[CONCEPT: 2026-06-03 饼图呈现修正] 证据：DonutChart.vue新增showLegend默认值和donut-chart--legendless状态。
测试与验证
- 补充工作台源码测试，覆盖按钮移除、弹窗接入和分割标识样式。[CONCEPT: 测试方案] 证据：
node web/tests/personal-workbench-assistant.test.mjs通过。 - 补充工作台汇总单元测试，覆盖详情数据生成。[CONCEPT: 测试方案] 证据：
node web/tests/workbench-summary.test.mjs通过。 - 补充弹窗源码测试，覆盖费用分布、处理时间、系统操作详情区块。[CONCEPT: 测试方案] 证据：
node web/tests/expense-stats-detail-modal.test.mjs通过。 - 运行前端定向测试和构建验证。[CONCEPT: 指标与验收] 证据：以上定向测试和
npm.cmd --prefix web run build均通过。 - 更新弹窗源码测试，确认费用分布使用饼图组件。[CONCEPT: 测试方案] 证据：
node web/tests/expense-stats-detail-modal.test.mjs通过，npm.cmd --prefix web run build通过。 - 更新弹窗与环图源码测试，确认详情弹窗只使用一个饼图入口且关闭内置图例。[CONCEPT: 2026-06-03 饼图呈现修正] 证据：
node web/tests/expense-stats-detail-modal.test.mjs与node web/tests/donut-chart.test.mjs通过。
交付
- 复查本次暂存范围，避免纳入无关工作区改动。[CONCEPT: 风险与开放问题] 证据：
git diff --cached --name-only仅包含本次工作台弹窗、样式、汇总测试和开发文档。 - 提交并 push 本次功能分支。[CONCEPT: 指标与验收] 证据：本次单饼图修复完成后提交并推送当前分支。