130 lines
4.6 KiB
Markdown
130 lines
4.6 KiB
Markdown
# 移动端计费功能实现总结
|
||
|
||
## 已实现的功能
|
||
|
||
### 1. 计费系统核心功能 (`src/types/billing.ts`)
|
||
- ✅ 用户类型定义:个人用户和企业用户
|
||
- ✅ 通话类型:语音通话和视频通话
|
||
- ✅ 翻译类型:文本翻译、手语翻译、人工翻译
|
||
- ✅ 计费规则配置
|
||
- ✅ 用户账户信息管理
|
||
- ✅ 预约信息结构
|
||
- ✅ 翻译员信息管理
|
||
- ✅ 通话记录和充值记录
|
||
|
||
### 2. 计费服务 (`src/services/billingService.ts`)
|
||
- ✅ 单例模式的计费服务类
|
||
- ✅ 根据用户类型设置不同的计费规则
|
||
- ✅ 通话费用计算(基于通话类型、翻译类型、时长、翻译员费率)
|
||
- ✅ 余额检查和扣费功能
|
||
- ✅ 低余额警告
|
||
- ✅ 账户充值功能
|
||
- ✅ 金额格式化显示
|
||
|
||
### 3. 预约服务 (`src/services/appointmentService.ts`)
|
||
- ✅ 预约管理服务
|
||
- ✅ 翻译员管理和可用性检查
|
||
- ✅ 预约创建、查询、更新、取消
|
||
- ✅ 时间冲突检查
|
||
- ✅ 按日期和月份筛选预约
|
||
- ✅ 模拟数据初始化
|
||
|
||
### 4. 移动端首页更新 (`src/pages/mobile/Home.tsx`)
|
||
- ✅ 用户账户余额显示
|
||
- ✅ 账户类型显示
|
||
- ✅ 快捷操作按钮(语音通话、视频通话、预约通话、账户充值)
|
||
- ✅ 即将到来的预约预览
|
||
- ✅ 最近活动记录(包含费用信息)
|
||
- ✅ 美观的卡片式布局
|
||
|
||
### 5. 移动端通话页面 (`src/pages/mobile/Call.tsx`)
|
||
- ✅ 支持语音和视频通话选择
|
||
- ✅ 翻译类型选择(文本、手语、人工翻译)
|
||
- ✅ 实时费用计算和显示
|
||
- ✅ 账户余额监控
|
||
- ✅ 通话时长计时
|
||
- ✅ 翻译员选择(人工翻译时)
|
||
- ✅ 翻译历史记录
|
||
- ✅ 自动扣费功能
|
||
|
||
### 6. 移动端充值页面 (`src/pages/mobile/Recharge.tsx`)
|
||
- ✅ 预设充值金额选择
|
||
- ✅ 自定义充值金额输入
|
||
- ✅ 充值赠送金额计算
|
||
- ✅ 多种支付方式支持
|
||
- ✅ 充值历史记录查看
|
||
- ✅ 账户余额实时显示
|
||
- ✅ 充值成功后余额更新
|
||
|
||
### 7. 移动端预约页面 (`src/pages/mobile/Appointment.tsx`)
|
||
- ✅ 通话类型选择(语音/视频)
|
||
- ✅ 翻译类型选择
|
||
- ✅ 日期和时间选择(未来7天)
|
||
- ✅ 语言对选择
|
||
- ✅ 翻译员选择(基于语言和日期可用性)
|
||
- ✅ 预估费用计算
|
||
- ✅ 余额充足性检查
|
||
- ✅ 预约创建和确认
|
||
|
||
### 8. 移动端设置页面 (`src/pages/mobile/Settings.tsx`)
|
||
- ✅ 用户信息展示(账户类型、余额)
|
||
- ✅ 账户管理功能
|
||
- ✅ 通话设置选项
|
||
- ✅ 翻译设置选项
|
||
- ✅ 通知设置管理
|
||
- ✅ 帮助和反馈入口
|
||
- ✅ 退出登录功能
|
||
|
||
### 9. 路由配置更新 (`src/routes/index.tsx`)
|
||
- ✅ 新增充值页面路由 `/mobile/recharge`
|
||
- ✅ 新增预约页面路由 `/mobile/appointment`
|
||
- ✅ 移动端路由完整配置
|
||
|
||
## 核心计费逻辑
|
||
|
||
### 费率配置
|
||
- **语音通话 + 文本翻译**: ¥0.50/分钟
|
||
- **视频通话 + 手语翻译**: ¥1.00/分钟
|
||
- **视频通话 + 人工翻译**: ¥2.00/分钟 + 翻译员费率
|
||
|
||
### 用户类型差异
|
||
- **个人用户**: 使用标准费率
|
||
- **企业用户**: 可配置专属费率和信用额度
|
||
|
||
### 余额管理
|
||
- 低余额警告:不足5分钟通话费用时提醒
|
||
- 最低余额限制:不足1分钟通话费用时禁止通话
|
||
- 自动扣费:通话结束后自动从账户余额扣除费用
|
||
|
||
### 充值优惠
|
||
- 充值金额越大,赠送比例越高
|
||
- 支持多种支付方式(微信、支付宝、银行卡等)
|
||
|
||
## 技术特性
|
||
|
||
- 🎯 **TypeScript 类型安全**: 完整的类型定义确保代码质量
|
||
- 🏗️ **单例模式**: 服务类使用单例模式确保数据一致性
|
||
- 💾 **模拟数据**: 完整的模拟数据支持开发和测试
|
||
- 🎨 **响应式设计**: 适配移动端的美观界面
|
||
- ⚡ **实时计算**: 费用和余额实时更新
|
||
- 🔒 **余额保护**: 多重余额检查防止超支
|
||
|
||
## 使用流程
|
||
|
||
1. **用户注册/登录** → 获得初始账户和余额
|
||
2. **查看余额** → 在首页或设置页面查看当前余额
|
||
3. **充值账户** → 选择金额和支付方式进行充值
|
||
4. **预约通话** → 选择时间、类型、翻译员创建预约
|
||
5. **开始通话** → 选择通话类型和翻译方式
|
||
6. **实时计费** → 通话过程中显示累计费用
|
||
7. **自动扣费** → 通话结束后自动从余额扣除费用
|
||
8. **查看记录** → 在首页查看通话历史和费用记录
|
||
|
||
## 下一步开发建议
|
||
|
||
1. **后端集成**: 连接真实的后端API替换模拟数据
|
||
2. **支付集成**: 集成真实的支付网关
|
||
3. **推送通知**: 实现余额不足和预约提醒
|
||
4. **数据持久化**: 实现本地数据存储
|
||
5. **错误处理**: 完善网络错误和支付失败处理
|
||
6. **单元测试**: 为核心计费逻辑添加测试用例 |