46 lines
1.7 KiB
Markdown
46 lines
1.7 KiB
Markdown
|
## Why
|
|||
|
|
|
|||
|
|
项目中存在两个版本的弹窗组件（`PopupContainer.vue` 和 `PopupContainerV2.vue`），造成代码冗余和维护成本增加。V2 版本采用更现代化的视觉风格（Inter 字体、16px 圆角、纯色背景），且 API 更简洁。为了统一 UI 风格、减少技术债务，需要将所有使用旧版本的组件迁移到 V2，并删除 V1 版本。
|
|||
|
|
|
|||
|
|
## What Changes
|
|||
|
|
|
|||
|
|
- 删除 `Web/src/components/PopupContainer.vue`（旧版本）
|
|||
|
|
- 将 18 个使用 `PopupContainer` 的文件迁移到 `PopupContainerV2`
|
|||
|
|
- 适配 API 差异（V1 支持 subtitle、confirm/cancel 按钮，V2 更简洁只提供 footer 插槽）
|
|||
|
|
- 确保迁移后的视觉效果和交互逻辑保持一致
|
|||
|
|
|
|||
|
|
## Capabilities
|
|||
|
|
|
|||
|
|
### New Capabilities
|
|||
|
|
- `popup-v2-migration`: 定义从 PopupContainer V1 到 V2 的迁移规范，包括 API 映射、样式对齐、兼容性处理
|
|||
|
|
|
|||
|
|
### Modified Capabilities
|
|||
|
|
<!-- 无现有功能的需求变更 -->
|
|||
|
|
|
|||
|
|
## Impact
|
|||
|
|
|
|||
|
|
**受影响的文件**（18 个 Vue 组件）:
|
|||
|
|
- `BudgetChartAnalysis.vue`
|
|||
|
|
- `IconSelector.vue`
|
|||
|
|
- `ClassificationEdit.vue`
|
|||
|
|
- `SavingsBudgetContent.vue`
|
|||
|
|
- `budgetV2/Index.vue`
|
|||
|
|
- `PeriodicRecord.vue`
|
|||
|
|
- `EmailRecord.vue`
|
|||
|
|
- `ClassificationNLP.vue`
|
|||
|
|
- `BillAnalysisView.vue`
|
|||
|
|
- `TransactionDetail.vue`
|
|||
|
|
- `ReasonGroupList.vue`
|
|||
|
|
- `CategoryBillPopup.vue`
|
|||
|
|
- `BudgetEditPopup.vue`
|
|||
|
|
- `BudgetCard.vue`
|
|||
|
|
- `AddClassifyDialog.vue`
|
|||
|
|
- `MessageView.vue`
|
|||
|
|
- `SavingsConfigPopup.vue`
|
|||
|
|
- `GlobalAddBill.vue`
|
|||
|
|
|
|||
|
|
**迁移风险**:
|
|||
|
|
- V1 的 `subtitle`、`showConfirmButton`、`showCancelButton` 等 props 在 V2 中不存在，需要重构为插槽方式
|
|||
|
|
- V1 默认高度为 `80%`，V2 为 `auto`（最大 `85%`），需要调整布局
|
|||
|
|
- V1 使用 Vant 主题变量，V2 使用硬编码颜色，暗色模式处理不同
|