6922dff5a9
All checks were successful
Docker Build & Deploy / Build Docker Image (push) Successful in 17s
Docker Build & Deploy / Deploy to Production (push) Successful in 7s
Docker Build & Deploy / Cleanup Dangling Images (push) Successful in 1s
Docker Build & Deploy / WeChat Notification (push) Successful in 2s
变更已完成并归档: - 迁移 calendarV2/TransactionList.vue 使用 BillListComponent - 代码从 403 行简化到 177 行 - 添加左滑删除功能 - Delta spec 已同步到主 specs 提交记录: -f8e6029: refactor(calendar-v2): migrate TransactionList to BillListComponent -4fd190f: fix(calendar-v2): remove left/right padding -1ba446f: feat(calendar-v2): add delete functionality -d324769: specs: sync bill-list-unified-ui
1.8 KiB
1.8 KiB
Why
系统中存在多处账单列表实现,各自使用不同的样式和交互方式。经过代码审查,发现只有 calendarV2/modules/TransactionList.vue 需要迁移,其他页面要么已使用 BillListComponent,要么不是账单列表。统一账单列表 UI 可以提供一致的用户体验和更好的可维护性。
What Changes
- 将
calendarV2/modules/TransactionList.vue的自定义账单列表替换为BillListComponent组件 - 保留日历视图的特殊功能:自定义 header (Items 计数) 和 Smart 按钮
- 移除自定义的数据格式转换逻辑和账单卡片渲染代码
- 简化代码从 403 行减少到 177 行
备注: 原设计文档中列出的其他 5 个页面经审查后:
TransactionsRecord.vue(balance页面): ✅ 已使用BillListComponentEmailRecord.vue: ✅ 已使用BillListComponentMessageView.vue: ❌ 系统消息列表,不是账单PeriodicRecord.vue: ❌ 周期性账单规则列表,不是交易账单ClassificationEdit.vue: ❌ 分类管理列表,不是账单budgetV2/Index.vue: ❌ 预算卡片列表,不是账单
Capabilities
New Capabilities
bill-list-unified-ui: 统一的账单列表 UI 规范,定义所有账单列表页面必须遵循的视觉设计和交互模式
Modified Capabilities
Impact
受影响的代码:
Web/src/views/calendarV2/modules/TransactionList.vue(已完成迁移)
依赖组件:
Web/src/components/Bill/BillListComponent.vue(已存在,无需修改)
API:
- 无 API 变更,仅前端 UI 统一
用户体验影响:
- 正向影响:日历视图的账单列表与 /balance 页面保持一致
- UI 风格变化:从自定义卡片样式改为统一的 BillListComponent 样式
- 功能保留:自定义 header、Items 计数、Smart 按钮均已保留