Files
EmailBill/openspec/changes/archive/2026-02-21-unify-bill-detail-component/proposal.md
SunCheng 749624f290
All checks were successful
Docker Build & Deploy / Build Docker Image (push) Successful in 17s
Docker Build & Deploy / Deploy to Production (push) Successful in 6s
Docker Build & Deploy / Cleanup Dangling Images (push) Successful in 1s
Docker Build & Deploy / WeChat Notification (push) Successful in 1s
feat: 统一交易详情组件,替换为 TransactionDetailSheet,增强功能并删除旧组件
2026-02-21 12:11:50 +08:00

1.6 KiB
Raw Blame History

Why

当前项目中存在两个交易详情组件:TransactionDetailSheet.vuecalendarV2 使用)和 TransactionDetail.vueTransactionsRecord 使用),导致用户在不同页面查看交易详情时视觉体验不一致。需要统一为 calendarV2 页面的详情样式,提升用户体验一致性并减少维护成本。

What Changes

  • 统一交易详情组件:将所有页面的交易详情统一使用 TransactionDetailSheet.vue 组件
  • 更新 TransactionsRecord 页面:将详情组件从 TransactionDetail.vue 替换为 TransactionDetailSheet.vue
  • 弃用旧组件:移除不再使用的 TransactionDetail.vue 组件
  • 增强 TransactionDetailSheet:确保组件具备完整功能(余额编辑支持、建议分类提示等)

Capabilities

New Capabilities

  • unified-transaction-detail: 统一的交易详情弹窗组件,支持金额编辑、分类选择、时间修改、删除操作,所有页面共用同一视觉样式

Modified Capabilities

  • 无(现有功能保持不变,仅统一样式)

Impact

受影响的文件

  • Web/src/views/TransactionsRecord.vue - 替换详情组件引用
  • Web/src/components/Transaction/TransactionDetail.vue - 删除或标记弃用

不受影响的文件

  • Web/src/views/calendarV2/Index.vue - 已使用 TransactionDetailSheet
  • Web/src/components/Transaction/CategoryBillPopup.vue - 已使用 TransactionDetailSheet
  • Web/src/components/Transaction/TransactionDetailSheet.vue - 基准组件,保持不变

API 无变更:仅前端组件层面的统一