lanyuanxiaoyao
915b004924
实现支持 OpenAI 和 Anthropic 双协议的统一大模型 API 网关 MVP 版本，包含： - OpenAI 和 Anthropic 协议代理 - 供应商和模型管理 - 用量统计 - 前端配置界面
93 lines
1.5 KiB
Markdown
93 lines
1.5 KiB
Markdown
# AI Gateway Frontend
|
|
|
|
AI 网关管理前端，提供供应商配置和用量统计界面。
|
|
|
|
## 技术栈
|
|
|
|
- **运行时**: Bun
|
|
- **构建工具**: Vite
|
|
- **语言**: TypeScript
|
|
- **框架**: React
|
|
- **样式**: SCSS
|
|
|
|
## 项目结构
|
|
|
|
```
|
|
frontend/
|
|
├── src/
|
|
│ ├── api/
|
|
│ │ └── client.ts # API 客户端封装
|
|
│ ├── pages/
|
|
│ │ ├── ProvidersPage.tsx # 供应商管理页面
|
|
│ │ └── StatsPage.tsx # 统计查看页面
|
|
│ ├── App.tsx # 主应用组件
|
|
│ ├── App.css # 样式
|
|
│ └── main.tsx # 入口文件
|
|
├── package.json
|
|
└── README.md
|
|
```
|
|
|
|
## 运行方式
|
|
|
|
### 安装依赖
|
|
|
|
```bash
|
|
bun install
|
|
```
|
|
|
|
### 开发模式
|
|
|
|
```bash
|
|
bun run dev
|
|
```
|
|
|
|
前端将在端口 5173 启动。
|
|
|
|
### 构建生产版本
|
|
|
|
```bash
|
|
bun run build
|
|
```
|
|
|
|
## 功能
|
|
|
|
### 供应商管理
|
|
|
|
- 查看供应商列表
|
|
- 添加新供应商
|
|
- 编辑供应商配置
|
|
- 删除供应商
|
|
- 启用/禁用供应商
|
|
|
|
### 模型管理
|
|
|
|
- 查看模型列表
|
|
- 添加新模型
|
|
- 编辑模型配置
|
|
- 删除模型
|
|
- 按供应商过滤模型
|
|
|
|
### 用量统计
|
|
|
|
- 查看统计数据
|
|
- 按供应商过滤
|
|
- 按模型过滤
|
|
- 按日期范围过滤
|
|
- 查看聚合统计
|
|
|
|
## API 配置
|
|
|
|
API 基础地址默认为 `http://localhost:9826/api`，可在 `src/api/client.ts` 中修改。
|
|
|
|
## 开发
|
|
|
|
### 环境要求
|
|
|
|
- Bun 1.0 或更高版本
|
|
|
|
### 添加新页面
|
|
|
|
1. 在 `src/pages/` 创建页面组件
|
|
2. 在 `src/App.tsx` 添加路由
|
|
3. 在导航栏添加链接
|