4.2 KiB
4.2 KiB
组件清单
UI基础组件 (components/ui/)
| 组件 | 文件 | 说明 |
|---|---|---|
| Button | button.tsx |
按钮组件 |
| Card | card.tsx |
卡片组件 |
| Input | input.tsx |
输入框组件 |
| Label | label.tsx |
标签组件 |
| Textarea | textarea.tsx |
多行文本框 |
| Switch | switch.tsx |
开关组件 |
| Tabs | tabs.tsx |
标签页组件 |
业务模块组件 (components/modules/)
认证模块 (auth/)
| 组件 | 文件 | 说明 |
|---|---|---|
| AuthModal | auth-modal.tsx |
登录/注册弹窗 |
分销模块 (referral/)
| 组件 | 文件 | 说明 |
|---|---|---|
| PosterModal | poster-modal.tsx |
推广海报弹窗 |
| WithdrawalModal | withdrawal-modal.tsx |
提现弹窗 |
分销管理模块 (distribution/)
| 组件 | 文件 | 说明 |
|---|---|---|
| AutoWithdrawModal | auto-withdraw-modal.tsx |
自动提现设置弹窗 |
| RealtimeNotification | realtime-notification.tsx |
实时通知组件 |
页面级组件
支付弹窗
components/payment-modal.tsx
功能：
- 选择支付方式（微信为主）
- 生成支付二维码
- 轮询支付状态
- 支付成功回调
章节内容
components/chapter-content.tsx
功能：
- Markdown内容渲染
- 付费墙显示
- 上下篇导航
- 分享功能
组件依赖图
┌─────────────────────────────────────────────────────┐
│ 页面组件 │
├─────────────────────────────────────────────────────┤
│ page.tsx chapters/page.tsx read/[id]/page.tsx │
│ match/page.tsx my/page.tsx my/referral/page.tsx │
└───────────────────────┬─────────────────────────────┘
│
▼
┌─────────────────────────────────────────────────────┐
│ 业务模块组件 │
├─────────────────────────────────────────────────────┤
│ AuthModal PaymentModal PosterModal │
│ WithdrawalModal AutoWithdrawModal ChapterContent │
└───────────────────────┬─────────────────────────────┘
│
▼
┌─────────────────────────────────────────────────────┐
│ UI基础组件 │
├─────────────────────────────────────────────────────┤
│ Button Card Input Label Switch Tabs │
└───────────────────────┬─────────────────────────────┘
│
▼
┌─────────────────────────────────────────────────────┐
│ 状态管理 & 工具 │
├─────────────────────────────────────────────────────┤
│ lib/store.ts (Zustand) lib/book-data.ts │
│ lib/utils.ts lib/db.ts │
└─────────────────────────────────────────────────────┘
文档版本：v2.0 | 更新日期：2026-01-18