mars
f20988b90c
- 更新 DashboardLayout 组件，统一使用演示模式布局 - 实现仪表盘页面的完整演示数据和功能 - 完成用户管理页面的演示模式，包含搜索、过滤、分页等功能 - 实现通话记录页面的演示数据和录音播放功能 - 完成翻译员管理页面的演示模式 - 实现订单管理页面的完整功能 - 完成发票管理页面的演示数据 - 更新文档管理页面 - 添加 utils.ts 工具函数库 - 完善 API 路由和数据库结构 - 修复各种 TypeScript 类型错误 - 统一界面风格和用户体验
334 lines
9.0 KiB
Markdown
334 lines
9.0 KiB
Markdown
# 口译服务管理后台
|
||
|
||
一个基于 Next.js 和 TypeScript 构建的现代化口译服务管理后台系统，集成 Supabase 数据库和完整的身份验证功能。
|
||
|
||
## 功能特性
|
||
|
||
### 🏢 企业服务管理
|
||
- **企业合同管理**：管理企业合同信息和服务费率配置
|
||
- **企业员工管理**：管理企业员工信息和通话记录
|
||
- **企业账单管理**：企业结算记录和账单管理
|
||
- **个性化费率配置**：为不同企业设置专属服务费率
|
||
|
||
### 📋 订单管理
|
||
- **多种服务类型**：
|
||
- AI语音翻译
|
||
- AI视频翻译
|
||
- 手语翻译
|
||
- 人工口译
|
||
- 文档翻译
|
||
- **订单状态跟踪**：待处理、处理中、已完成、已取消、失败
|
||
- **优先级管理**：紧急、高、普通、低
|
||
- **详细信息展示**：包括译员信息、时间安排、费用等
|
||
- **实时数据同步**：基于 Supabase 实时订阅
|
||
|
||
### 📄 文档管理
|
||
- **文档上传管理**：支持多种文档格式
|
||
- **翻译进度跟踪**：实时显示翻译状态和进度
|
||
- **文档下载功能**：支持原文档和翻译结果下载
|
||
|
||
### 🧾 发票管理
|
||
- **发票生成**：支持个人和企业发票
|
||
- **发票下载**：PDF格式发票下载
|
||
- **发票打印**：直接打印功能
|
||
- **发票状态管理**：草稿、已开具、已付款、已取消
|
||
|
||
### 👥 用户管理
|
||
- **多角色用户系统**：个人用户、企业用户、管理员
|
||
- **用户认证**：基于 Supabase Auth 的安全认证
|
||
- **权限控制**：行级安全策略保护数据
|
||
- **用户状态跟踪**：活跃状态、登录记录
|
||
|
||
### 🎯 译员管理
|
||
- **译员信息管理**：译员资料、专业领域
|
||
- **译员状态监控**：在线、离线、忙碌状态
|
||
- **语言能力管理**：支持的语言对
|
||
- **评价系统**：译员评分和反馈
|
||
|
||
### 📞 通话管理
|
||
- **实时通话监控**：当前活跃通话
|
||
- **通话记录管理**：历史通话记录
|
||
- **通话质量统计**：通话时长、费用统计
|
||
- **质量评估**：通话质量评分
|
||
|
||
### ⚙️ 系统设置
|
||
- **服务费率配置**：为每种服务设置独立费率
|
||
- **系统参数配置**：通话设置、通知设置
|
||
- **安全设置**：双因素认证、会话超时
|
||
- **API配置**：第三方服务集成
|
||
|
||
## 技术栈
|
||
|
||
### 前端技术
|
||
- **前端框架**：Next.js 14
|
||
- **类型系统**：TypeScript
|
||
- **样式框架**：Tailwind CSS
|
||
- **图标库**：Heroicons
|
||
- **状态管理**：React Hooks
|
||
|
||
### 后端技术
|
||
- **数据库**：Supabase (PostgreSQL)
|
||
- **身份验证**：Supabase Auth
|
||
- **API**：Next.js API Routes
|
||
- **实时功能**：Supabase Realtime
|
||
|
||
### 第三方集成
|
||
- **支付处理**：Stripe
|
||
- **通信服务**：Twilio
|
||
- **AI服务**：OpenAI
|
||
- **部署平台**：Vercel
|
||
|
||
## 安装和运行
|
||
|
||
### 环境要求
|
||
- Node.js 18.0 或更高版本
|
||
- npm 或 yarn
|
||
- Supabase 项目（用于数据库和认证）
|
||
|
||
### 1. 安装依赖
|
||
```bash
|
||
npm install
|
||
# 或
|
||
yarn install
|
||
```
|
||
|
||
### 2. 环境配置
|
||
复制 `.env.example` 到 `.env.local` 并配置必要的环境变量：
|
||
|
||
```bash
|
||
cp .env.example .env.local
|
||
```
|
||
|
||
配置 Supabase 和其他服务：
|
||
|
||
```env
|
||
# Supabase 配置
|
||
NEXT_PUBLIC_SUPABASE_URL=https://your-project-id.supabase.co
|
||
NEXT_PUBLIC_SUPABASE_ANON_KEY=your-anon-key
|
||
SUPABASE_SERVICE_ROLE_KEY=your-service-role-key
|
||
|
||
# 其他服务配置
|
||
STRIPE_SECRET_KEY=sk_test_...
|
||
TWILIO_ACCOUNT_SID=AC...
|
||
OPENAI_API_KEY=sk-...
|
||
```
|
||
|
||
### 3. 数据库设置
|
||
在 Supabase Dashboard 中执行数据库脚本：
|
||
|
||
1. 登录 [Supabase Dashboard](https://supabase.com/dashboard)
|
||
2. 进入 SQL Editor
|
||
3. 复制 `database/schema.sql` 内容并执行
|
||
4. 创建管理员账户（可选）
|
||
|
||
### 4. 开发模式运行
|
||
```bash
|
||
npm run dev
|
||
# 或
|
||
yarn dev
|
||
```
|
||
|
||
访问 [http://localhost:3000](http://localhost:3000) 查看应用。
|
||
|
||
### 5. 构建生产版本
|
||
```bash
|
||
npm run build
|
||
# 或
|
||
yarn build
|
||
```
|
||
|
||
### 6. 启动生产服务器
|
||
```bash
|
||
npm start
|
||
# 或
|
||
yarn start
|
||
```
|
||
|
||
## 项目结构
|
||
|
||
```
|
||
├── components/ # 可复用组件
|
||
├── lib/ # 工具库和配置
|
||
│ ├── demo-data.ts # 演示数据
|
||
│ ├── supabase.ts # Supabase 配置和操作
|
||
│ └── utils.ts # 工具函数
|
||
├── pages/ # 页面组件
|
||
│ ├── api/ # API 路由
|
||
│ │ ├── auth/ # 认证 API
|
||
│ │ ├── orders/ # 订单 API
|
||
│ │ ├── users/ # 用户 API
|
||
│ │ └── ... # 其他 API
|
||
│ ├── auth/ # 认证页面
|
||
│ └── dashboard/ # 管理后台页面
|
||
├── database/ # 数据库相关文件
|
||
│ ├── schema.sql # 数据库结构
|
||
│ └── README.md # 数据库说明
|
||
├── types/ # TypeScript 类型定义
|
||
│ ├── database.ts # 数据库类型
|
||
│ └── auth.ts # 认证类型
|
||
├── public/ # 静态资源
|
||
├── styles/ # 样式文件
|
||
└── utils/ # 工具函数
|
||
```
|
||
|
||
## API 接口
|
||
|
||
### 认证接口
|
||
- `POST /api/auth/register` - 用户注册
|
||
- `POST /api/auth/login` - 用户登录
|
||
- `POST /api/auth/logout` - 用户登出
|
||
- `GET /api/auth/me` - 获取当前用户信息
|
||
|
||
### 订单接口
|
||
- `GET /api/orders` - 获取订单列表
|
||
- `POST /api/orders` - 创建新订单
|
||
- `PUT /api/orders/:id` - 更新订单
|
||
- `DELETE /api/orders/:id` - 删除订单
|
||
|
||
### 用户接口
|
||
- `GET /api/users` - 获取用户列表
|
||
- `POST /api/users` - 创建用户
|
||
- `PUT /api/users/:id` - 更新用户信息
|
||
- `DELETE /api/users/:id` - 删除用户
|
||
|
||
## 数据库架构
|
||
|
||
### 核心表结构
|
||
- **users** - 用户表（支持个人/企业/管理员）
|
||
- **enterprises** - 企业表
|
||
- **orders** - 订单表
|
||
- **invoices** - 发票表
|
||
- **interpreters** - 译员表
|
||
- **calls** - 通话记录表
|
||
- **documents** - 文档翻译表
|
||
|
||
### 安全策略
|
||
- 启用行级安全 (RLS)
|
||
- 基于用户角色的权限控制
|
||
- 数据访问审计日志
|
||
|
||
详细说明请参考 [database/README.md](./database/README.md)
|
||
|
||
## 核心功能说明
|
||
|
||
### 身份验证系统
|
||
- **多角色支持**：个人用户、企业用户、管理员
|
||
- **安全认证**：基于 JWT 令牌的会话管理
|
||
- **权限控制**：细粒度的权限管理
|
||
- **会话管理**：自动刷新和过期处理
|
||
|
||
### 费率优先级机制
|
||
系统采用三级费率优先级：
|
||
1. **企业合同费率**：优先级最高，适用于企业员工
|
||
2. **系统通用费率**：适用于个人用户和无合同企业
|
||
3. **默认费率**：系统兜底费率
|
||
|
||
### 实时功能
|
||
- **订单状态更新**：实时同步订单状态变化
|
||
- **通话监控**：实时监控活跃通话
|
||
- **消息通知**：即时消息推送
|
||
|
||
### 演示模式
|
||
项目支持演示模式，无需配置数据库即可体验完整功能：
|
||
- 自动检测 Supabase 配置
|
||
- 使用内置演示数据
|
||
- 支持所有功能的模拟操作
|
||
|
||
### 响应式设计
|
||
- 完全响应式界面设计
|
||
- 支持移动端和桌面端
|
||
- 优化的用户体验
|
||
|
||
## 部署
|
||
|
||
### Vercel 部署（推荐）
|
||
1. 将项目推送到 GitHub
|
||
2. 在 Vercel 中导入项目
|
||
3. 配置环境变量
|
||
4. 部署完成
|
||
|
||
详细部署指南请参考 [DEPLOYMENT.md](./DEPLOYMENT.md)
|
||
|
||
### 其他平台部署
|
||
项目支持部署到任何支持 Next.js 的平台，如：
|
||
- Netlify
|
||
- Railway
|
||
- Heroku
|
||
- 自托管服务器
|
||
|
||
## 环境变量
|
||
|
||
### 必需配置
|
||
```bash
|
||
# Supabase 配置
|
||
NEXT_PUBLIC_SUPABASE_URL=https://your-project-id.supabase.co
|
||
NEXT_PUBLIC_SUPABASE_ANON_KEY=your-anon-key
|
||
SUPABASE_SERVICE_ROLE_KEY=your-service-role-key
|
||
|
||
# 应用配置
|
||
NEXTAUTH_SECRET=your-nextauth-secret
|
||
JWT_SECRET=your-jwt-secret
|
||
```
|
||
|
||
### 可选配置
|
||
```bash
|
||
# Stripe 支付
|
||
STRIPE_SECRET_KEY=sk_test_...
|
||
NEXT_PUBLIC_STRIPE_PUBLISHABLE_KEY=pk_test_...
|
||
|
||
# Twilio 通信
|
||
TWILIO_ACCOUNT_SID=AC...
|
||
TWILIO_API_KEY_SID=SK...
|
||
TWILIO_API_KEY_SECRET=...
|
||
|
||
# OpenAI 服务
|
||
OPENAI_API_KEY=sk-...
|
||
```
|
||
|
||
## 贡献指南
|
||
|
||
1. Fork 项目
|
||
2. 创建功能分支 (`git checkout -b feature/AmazingFeature`)
|
||
3. 提交更改 (`git commit -m 'Add some AmazingFeature'`)
|
||
4. 推送到分支 (`git push origin feature/AmazingFeature`)
|
||
5. 创建 Pull Request
|
||
|
||
### 开发规范
|
||
- 使用 TypeScript 进行类型安全开发
|
||
- 遵循 ESLint 和 Prettier 代码规范
|
||
- 编写单元测试
|
||
- 更新相关文档
|
||
|
||
## 许可证
|
||
|
||
本项目采用 MIT 许可证 - 查看 [LICENSE](LICENSE) 文件了解详情。
|
||
|
||
## 文档和支持
|
||
|
||
### 相关文档
|
||
- [部署指南](./DEPLOYMENT.md)
|
||
- [数据库说明](./database/README.md)
|
||
- [API 参考](./docs/api-reference.md)
|
||
|
||
### 联系方式
|
||
- 项目地址：[http://git.wanzhongtech.com/mars/Twilioapp-admin](http://git.wanzhongtech.com/mars/Twilioapp-admin)
|
||
- 问题反馈：请在 GitLab Issues 中提交
|
||
|
||
## 更新日志
|
||
|
||
### v1.1.0 (2024-01-30)
|
||
- ✅ 集成 Supabase 数据库和身份验证
|
||
- ✅ 实现完整的 API 接口
|
||
- ✅ 添加用户认证和权限控制
|
||
- ✅ 优化数据库结构和安全策略
|
||
- ✅ 完善部署文档和指南
|
||
|
||
### v1.0.0 (2024-01-30)
|
||
- ✅ 完成企业服务管理功能
|
||
- ✅ 完成订单管理功能
|
||
- ✅ 完成发票管理功能
|
||
- ✅ 完成文档管理功能
|
||
- ✅ 完成用户和译员管理功能
|
||
- ✅ 完成系统设置功能
|
||
- ✅ 完成演示模式
|
||
- ✅ 完成响应式设计 |