Files

T

yml2213andClaude Opus 4.7 b5903a169f feat: Features架构迁移 - P0和P1部分完成

## 完成的工作

### P0: 基础设施准备
- 创建 features/ 和 shared/ 目录结构
- 迁移共享资源：API基础设施、工具函数、类型定义
- 迁移通用composables：useMoney, useSmsCountdown, usePricingCalculator
- 迁移全局样式文件
- 建立模块化导出系统

### P1.1: 钱包模块 (wallet)
- 迁移 API: wallet.ts
- 迁移 Views: WalletView.vue
- 新增 Composable: useWallet.ts (封装钱包状态管理)
- 更新导入路径到 shared/

### P1.2: 聊天模块 (chats)
- 迁移 API: chats.ts
- 迁移 Views: ChatView, MessagesView (桌面+移动)
- 迁移 Composables: useChatSSE.ts
- 迁移 Components: ChatAttachmentImage.vue
- 更新导入路径到 shared/

## 技术改进
- 修复 shared/composables 导出问题 (default → 命名导出)
- 修复 shared/api/client.ts 类型导入路径
- 建立清晰的模块边界和导出规范

## 文档
- 添加完整的迁移计划文档
- 添加进度跟踪文档

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

2026-06-04 08:38:36 +08:00

5.6 KiB

Raw Blame History

Features 架构迁移进度报告

日期： 2026-06-04
分支： refactor/features-architecture
状态： 进行中

已完成的工作

✅ P0: 基础设施准备

创建了新的目录结构并迁移共享资源：

frontend/src/
├── features/                # 新：业务模块目录
├── shared/                  # 新：共享资源层
│   ├── api/                 # API 基础设施 (client.ts)
│   ├── composables/         # 通用组合函数 (useMoney, useSmsCountdown, usePricingCalculator)
│   ├── components/          # 共享组件
│   ├── utils/               # 工具函数 (8个文件)
│   ├── types/               # 全局类型定义
│   └── styles/              # 全局样式 (5个CSS文件)

文件统计：

shared/ 目录：22个文件
已建立模块化导出系统 (index.ts)

✅ P1.1: 钱包模块（wallet）

完整迁移钱包模块到 features/wallet/：

features/wallet/
├── api/
│   └── wallet.ts            # 钱包 API (5个函数)
├── composables/
│   └── useWallet.ts         # 新：钱包状态管理 composable
├── views/
│   └── WalletView.vue       # 用户钱包页面
├── types.ts                 # 模块类型定义
└── index.ts                 # 模块统一导出

功能：

余额查询、充值、账单明细
支付订单、结算金额
管理员资金账本

已修复：

✅ 更新导入路径到 @/shared/
✅ 类型依赖正确引用

✅ P1.2: 聊天模块（chats）

完整迁移聊天模块到 features/chats/：

features/chats/
├── api/
│   └── chats.ts             # 聊天 API
├── components/
│   └── ChatAttachmentImage.vue  # 聊天附件组件
├── composables/
│   └── useChatSSE.ts        # SSE 实时连接
├── views/
│   ├── ChatView.vue         # 桌面端聊天页
│   ├── MessagesView.vue     # 消息列表
│   ├── MobileChatView.vue   # 移动端聊天
│   └── MobileMessagesView.vue  # 移动端消息列表
└── index.ts                 # 模块统一导出

功能：

买卖双方沟通
端到端聊天、附件支持
实时消息推送（SSE）
管理员聊天转接、快速回复

已修复：

✅ 更新导入路径到 @/shared/

当前存在的类型错误

运行 npm run typecheck 发现以下问题（需要在后续修复）：

1. 测试文件缺少依赖

src/composables/home/__tests__/*.spec.ts - 缺少 vitest

解决方案： 安装 vitest 或暂时忽略

2. 订单模块类型错误

src/composables/order/useOrderDetail.ts - evidence 属性不存在
src/composables/order/useOrderSnapshot.ts - listing_snapshot 属性不存在

解决方案： 在迁移订单模块时统一修复

3. Shared 导出问题

✅ 已修复：shared/composables/index.ts 的 default 导出改为命名导出
✅ 已修复：shared/api/client.ts 导入路径

4. 第三方库缺失

views/account/OrderDetailView.vue - 缺少 qrcode 类型

解决方案： npm install @types/qrcode (已在 package.json 中)

下一步工作

🔄 P1.3: 订单模块（orders）- 待开始

这是最复杂的模块，需要：

拆分 useOrderDetail.ts（当前混合了多个领域）
- 提取支付轮询逻辑 → usePaymentPolling.ts
- 提取结算逻辑 → useSettlement.ts
- 保留核心订单逻辑
迁移文件
- API: api/orders.ts
- Views: 8个页面（桌面3个 + 移动3个 + 管理2个）
- Composables: order/useOrderDetail.ts, order/useOrderSnapshot.ts
- Components: 订单卡片、状态徽章、支付二维码等
修复类型错误
- 补充 Order 接口中缺失的属性
- 修复 evidence、listing_snapshot、checkout_info、counter_info

文件移动统计

模块	状态	API	Views	Composables	Components
shared	✅	1	0	3	2
wallet	✅	1	1	1	0
chats	✅	1	4	1	1
orders	🔄	待迁移	8	2	多个
listings	⏸️	-	-	-	-
auth	⏸️	-	-	-	-
seller	⏸️	-	-	-	-
disputes	⏸️	-	-	-	-
admin	⏸️	-	-	-	-

风险与注意事项

⚠️ 已发现的风险

订单模块复杂度高： useOrderDetail.ts 混合了多个业务领域，需要谨慎拆分
类型错误积累： 订单相关的类型定义不完整，需要补充
移动端路由： 需要同步更新路由配置

✅ 已缓解的风险

共享资源已成功提取到 shared/ 目录
钱包和聊天模块迁移顺利，验证了迁移方案可行性
建立了模块化导出体系

验证清单

每个模块完成后：

钱包模块：文件已迁移，导入路径已修复
聊天模块：文件已迁移，导入路径已修复
运行 npm run typecheck - 有既存错误，待订单模块时统一修复
运行 npm run dev - 待验证
测试页面功能 - 待验证

技术债务

测试覆盖不足： 缺少单元测试，依赖 vitest
类型定义不完整： Order 接口缺少多个属性
兼容层未建立： 旧路径的 re-export 尚未创建（如需要）

下次继续： 迁移订单模块，这是 P1 阶段的最后一个模块，也是最复杂的一个。

预计剩余工作量：

P1 订单模块：4小时
P2 模块（listings, auth）：6小时
P3 模块（seller, disputes, admin）：7小时
总计：~17小时

5.6 KiB Raw Blame History Unescape Escape