feat(阶段1): 搬入 ojnext 为 apps/web，未改业务代码

2026-08-06 21:18:16 -06:00
parent 3c975e85ee
commit ae1fb329b5
258 changed files with 40490 additions and 91 deletions
@@ -0,0 +1,548 @@
+# API接口对比分析
+
+## 更新日志
+
+### 最近更新（2025-01-15）
+- ✨ **FlowchartEditor 流程图编辑器**：新增完整的流程图编辑功能
+  - 基于 Vue Flow 构建的流程图编辑器组件
+  - 支持7种节点类型：开始、输入、处理、判断、循环、输出、结束
+  - 完整的拖拽创建、节点连接、编辑功能
+  - 撤销重做、自动保存、键盘快捷键支持
+  - 模块化设计，包含9个独立的功能模块
+- 🎨 **前端组件优化**：完善了组件文档和项目结构说明
+  - 更新了 README.md 中的技术栈和项目结构
+  - 创建了详细的 FlowchartEditor 使用文档
+  - 优化了开发指南和构建流程说明
+- 🔧 **构建工具升级**：从 Vite 迁移到 Rsbuild
+  - 使用 Rsbuild 作为新的构建工具
+  - 支持多环境构建（test、staging、production）
+  - 优化了构建性能和开发体验
+
+### 历史更新（2025-10）
+- ✨ **AI分析功能增强**：完善了AI智能分析模块的文档说明
+  - 详细说明了4个AI相关接口的功能和参数
+  - 新增等级系统说明（S/A/B/C），包含特殊规则
+  - 补充了时间范围选择功能
+  - 说明了流式响应的实现方式
+  - 前端组件从 `WeeklyChart.vue` 升级为 `DurationChart.vue`（混合图表）
+- 🔧 **数据缓存优化**：后端AI接口增加了缓存机制，提升性能
+- 🐛 **修正等级系统说明**：更正了等级阈值（A级：前35%，B级：前75%），并补充了小规模参与惩罚规则
+
+---
+
+## 一、前端已使用的API接口
+
+### 1. 用户认证相关（shared/api.ts）
+- `POST /api/login` - 用户登录
+- `POST /api/register` - 用户注册
+- `GET /api/logout` - 用户登出
+- `GET /api/profile` - 获取用户资料
+- `GET /api/captcha` - 获取验证码
+
+### 2. OJ普通用户API（oj/api.ts）
+#### 2.1 网站配置
+- `GET /api/website` - 获取网站配置
+- `GET /api/hitokoto` - 获取一言
+
+#### 2.2 题目相关
+- `GET /api/problem` - 获取题目列表
+- `GET /api/problem` - 获取单个题目
+- `GET /api/problem/tags` - 获取题目标签列表
+- `GET /api/problem/author` - 获取题目作者列表
+- `GET /api/problem/beat_count` - 获取题目击败率
+- `GET /api/pickone` - 随机获取题目
+- `GET /api/contest/problem` - 获取竞赛题目
+
+#### 2.3 提交相关
+- `GET /api/submission` - 获取单个提交
+- `POST /api/submission` - 提交代码
+- `GET /api/submissions` - 获取提交列表
+- `GET /api/submissions/today_count` - 获取今日提交数
+- `GET /api/contest_submissions` - 获取竞赛提交列表
+
+#### 2.4 排名相关
+- `GET /api/user_rank` - 获取用户排名
+- `GET /api/user_activity_rank` - 获取活跃度排名
+- `GET /api/user_problem_rank` - 获取题目排名
+- `GET /api/contest_rank` - 获取竞赛排名
+
+#### 2.5 竞赛相关
+- `GET /api/contests` - 获取竞赛列表
+- `GET /api/contest` - 获取单个竞赛
+- `GET /api/contest/access` - 获取竞赛访问权限
+- `POST /api/contest/password` - 验证竞赛密码
+
+#### 2.6 公告相关
+- `GET /api/announcement` - 获取公告列表/单个公告
+
+#### 2.7 消息相关
+- `POST /api/message` - 创建消息
+- `GET /api/message` - 获取消息列表
+
+#### 2.8 评论相关
+- `POST /api/comment` - 创建评论
+- `GET /api/comment` - 获取评论
+- `GET /api/comment/statistics` - 获取评论统计
+
+#### 2.9 用户相关
+- `POST /api/upload_avatar` - 上传头像
+- `PUT /api/profile` - 更新用户资料
+- `GET /api/profile/fresh_display_id` - 刷新用户题目显示ID
+- `GET /api/metrics` - 获取用户统计数据
+
+#### 2.10 教程相关
+- `GET /api/tutorial` - 获取单个教程
+- `GET /api/tutorials` - 获取教程列表
+
+#### 2.11 AI分析相关
+- `GET /api/ai/detail` - 获取用户详细数据
+  - **参数**: start, end（时间范围）
+  - **返回**: 用户等级(S/A/B/C)、已解决题目列表、标签统计、难度统计、参赛次数等
+  - **特点**: 包含班级排名对比，计算每道题的解题排名和等级
+- `GET /api/ai/duration` - 获取时段数据
+  - **参数**: end（结束时间）, duration（时间单位，如 "months:6", "weeks:1"）
+  - **返回**: 每周/每月的综合情况（题目数、提交数、等级）
+  - **用途**: 用于绘制时间趋势图，展示学习进度变化
+- `GET /api/ai/heatmap` - 获取热力图数据
+  - **返回**: 用户的提交热力图数据（按日期统计提交数）
+  - **用途**: 可视化用户活跃度分布
+- `POST /api/ai/analysis` - AI智能分析生成
+  - **请求体**: details（详细数据）, duration（时段数据）
+  - **响应方式**: 流式响应（Server-Sent Events）
+  - **AI提供商**: DeepSeek
+  - **功能**: 根据用户学习数据生成个性化学习建议和鼓励
+  - **实现**: 使用fetch直接调用，在 `oj/store/ai.ts` 中处理流式输出
+
+### 3. 管理员API（admin/api.ts）
+#### 3.1 仪表板
+- `GET /api/admin/dashboard_info` - 获取仪表板信息
+- `GET /api/admin/random_user` - 随机获取用户
+
+#### 3.2 题目管理
+- `GET /api/admin/problem` - 获取题目列表/单个题目
+- `POST /api/admin/problem` - 创建题目
+- `PUT /api/admin/problem` - 编辑题目
+- `PUT /api/admin/problem/visible` - 切换题目可见性
+- `DELETE /api/admin/problem` - 删除题目
+- `GET /api/admin/contest/problem` - 获取竞赛题目
+- `POST /api/admin/contest/problem` - 创建竞赛题目
+- `PUT /api/admin/contest/problem` - 编辑竞赛题目
+- `DELETE /api/admin/contest/problem` - 删除竞赛题目
+- `POST /api/admin/contest/add_problem_from_public` - 从公开题库添加题目到竞赛
+
+#### 3.3 用户管理
+- `GET /api/admin/user` - 获取用户列表
+- `POST /api/admin/user` - 导入用户
+- `PUT /api/admin/user` - 编辑用户
+- `DELETE /api/admin/user` - 删除用户
+- `POST /api/admin/reset_password` - 重置用户密码
+
+#### 3.4 竞赛管理
+- `GET /api/admin/contest` - 获取竞赛列表/单个竞赛
+- `POST /api/admin/contest` - 创建竞赛
+- `PUT /api/admin/contest` - 编辑竞赛
+- `GET /api/admin/contest/acm_helper` - 获取ACM比赛辅助检查列表
+- `PUT /api/admin/contest/acm_helper` - 更新ACM比赛辅助检查状态
+
+#### 3.5 测试用例管理
+- `POST /api/admin/test_case` - 上传测试用例
+- `GET /api/admin/prune_test_case` - 列出无效测试用例
+- `DELETE /api/admin/prune_test_case` - 清理无效测试用例
+
+#### 3.6 题目管理扩展
+- `POST /api/admin/contest_problem/make_public` - 将竞赛题目转为公开题目
+
+#### 3.7 判题服务器管理
+- `GET /api/admin/judge_server` - 获取判题服务器列表
+- `DELETE /api/admin/judge_server` - 删除判题服务器
+
+#### 3.8 公告管理
+- `GET /api/admin/announcement` - 获取公告列表/单个公告
+- `POST /api/admin/announcement` - 创建公告
+- `PUT /api/admin/announcement` - 编辑公告
+- `DELETE /api/admin/announcement` - 删除公告
+
+#### 3.9 评论管理
+- `GET /api/admin/comment` - 获取评论列表
+- `DELETE /api/admin/comment` - 删除评论
+
+#### 3.10 网站配置
+- `GET /api/admin/website` - 获取网站配置
+- `POST /api/admin/website` - 更新网站配置
+
+#### 3.11 文件上传
+- `POST /api/admin/upload_image` - 上传图片（富文本编辑器、Markdown编辑器使用）
+
+#### 3.12 提交管理
+- `GET /api/admin/submission/rejudge` - 重新判题
+- `GET /api/admin/submission/statistics` - 获取提交统计
+
+#### 3.13 教程管理
+- `GET /api/admin/tutorial` - 获取教程列表/单个教程
+- `POST /api/admin/tutorial` - 创建教程
+- `PUT /api/admin/tutorial` - 更新教程
+- `DELETE /api/admin/tutorial` - 删除教程
+- `PUT /api/admin/tutorial/visibility` - 设置教程可见性
+
+---
+
+## 二、后端提供但前端未使用的API接口
+
+### 1. 用户认证相关（account）
+- `POST /api/change_password` - 修改密码
+- `POST /api/change_email` - 修改邮箱
+- `POST /api/apply_reset_password` - 申请重置密码
+- `POST /api/reset_password` - 重置密码
+- `GET /api/check_username_or_email` - 检查用户名或邮箱是否存在
+- `GET /api/tfa_required` - 检查是否需要双因素认证
+- `POST /api/two_factor_auth` - 双因素认证
+- `GET /api/sessions` - 会话管理
+- `GET /api/open_api_appkey` - OpenAPI密钥管理
+- `GET /api/sso` - 单点登录
+
+### 2. 用户管理（admin）
+- `GET /api/admin/generate_user` - 生成用户
+
+### 3. 网站配置相关
+- `GET /api/languages` - 获取支持的编程语言列表
+
+### 4. 判题服务器内部接口（不需要前端实现）
+- ❌ `POST /api/judge_server_heartbeat/` - 判题服务器心跳
+  - **标记为不需要**
+  - **原因**: 此接口由 JudgeServer Docker 容器调用，用于向后端报告服务器状态
+  - **使用方**: 判题服务器（非前端）
+  - **数据内容**: hostname, judger_version, CPU/内存使用率等
+  - **认证方式**: 使用特殊的 judge_server_token，非用户认证
+
+### 5. 管理员配置相关
+- `GET /api/admin/smtp` - SMTP配置
+- `POST /api/admin/smtp_test` - SMTP测试
+- `GET /api/admin/versions` - 版本信息
+
+### 6. 题目管理相关（admin）
+- `POST /api/admin/export_problem` - 导出题目
+- `POST /api/admin/import_problem` - 导入题目
+- `POST /api/admin/import_fps` - 导入FPS格式题目
+
+### 7. 竞赛相关（admin）
+- `GET /api/contest/announcement` - 获取竞赛公告列表（OJ端）
+- `GET /api/admin/contest/announcement` - 获取竞赛公告（管理端）
+- `GET /api/admin/download_submissions` - 下载竞赛提交
+
+### 8. 提交相关（不必要的接口）
+- ❌ `GET /api/submission_exists` - 检查提交是否存在
+  - **标记为不需要**
+  - **原因**: 题目接口返回的 `my_status` 字段已完整包含此信息
+  - **替代方案**: 直接判断 `my_status` 的值（0=已通过，非零=已尝试未通过，null=未尝试）
+  - **优势**: 零额外请求，性能更优
+
+### 9. 文件上传相关（admin）
+- `POST /api/admin/upload_file` - 上传文件（任意格式）
+  - **说明**: 前端已使用 `upload_image`（仅图片），`upload_file` 可上传任意文件
+  - **当前状态**: 未使用（前端暂无上传非图片文件的需求）
+  - **潜在场景**: 题目附件、教程资料、作业提交等
+
+---
+
+## 三、统计总结
+
+### 前端已使用接口统计
+- **OJ普通用户接口**: 38个（包括1个直接用fetch调用的流式接口）
+- **管理员接口**: 35个
+- **共享接口**: 5个
+- **总计**: 78个API调用
+
+### 后端未被使用接口统计
+- **用户认证相关**: 10个
+- **网站配置相关**: 2个（languages）
+- **题目管理相关**: 3个
+- **竞赛管理相关**: 3个
+- **其他**: 1个
+- **标记为不需要**: 2个
+  - submission_exists（数据冗余）
+  - judge_server_heartbeat（内部接口）
+- **总计**: 21个API端点（其中2个不需要前端实现）
+
+### 未使用接口占比
+约 **21%** 的后端API接口前端尚未使用
+- **需要考虑实现**: 19个接口
+- **不必要实现**: 2个接口（submission_exists, judge_server_heartbeat）
+
+**备注**: 本次更新新增了 ACM 比赛辅助检查功能（2个接口），用于赛后人工审核代码。
+
+---
+
+## 四、建议
+
+### 1. 高优先级需要实现的功能
+- **密码管理**: change_password, apply_reset_password, reset_password
+- **邮箱管理**: change_email
+- **用户名/邮箱检查**: check_username_or_email（注册时实时验证）
+- **编程语言列表**: languages（显示支持的编程语言）
+- **题目导入导出**: export_problem, import_problem（方便题库管理）
+
+### 2. 中等优先级功能
+- **双因素认证**: tfa_required, two_factor_auth（增强安全性）
+- **会话管理**: sessions（多设备登录管理）
+- **竞赛公告**: contest/announcement（OJ端，增强竞赛体验）
+
+### 3. 低优先级功能
+- **SSO单点登录**: sso（如需要集成其他系统）
+- **OpenAPI**: open_api_appkey（如需要开放API）
+- **SMTP配置**: smtp, smtp_test（管理员配置）
+- **版本信息**: versions（显示系统版本）
+- **FPS导入**: import_fps（特定格式题目导入）
+- **文件上传**: upload_file（目前只有图片上传）
+
+### 4. 可选功能
+- **生成用户**: generate_user（批量生成测试用户）
+- **下载提交**: download_submissions（下载竞赛所有提交）
+
+---
+
+## 五、接口使用率分析
+
+| 模块 | 后端提供 | 前端使用 | 使用率 |
+|------|---------|---------|--------|
+| 用户认证 | 17 | 7 | 41% |
+| 题目管理 | 14 | 11 | 79% |
+| 提交管理 | 7 | 6 | 86% |
+| 竞赛管理 | 12 | 9 | 75% |
+| 公告管理 | 4 | 4 | 100% |
+| 评论管理 | 4 | 4 | 100% |
+| 消息管理 | 1 | 1 | 100% |
+| 教程管理 | 4 | 4 | 100% |
+| AI分析 | 4 | 4 | 100% ✅ |
+| 配置管理 | 9 | 3 | 33% ⚠️（1个为内部接口） |
+
+**总体使用率约为 79%**（已实现ACM比赛辅助检查功能，竞赛管理使用率提升至75%）
+
+### 特殊说明
+
+#### 1. AI智能分析功能 ✨
+
+**功能概述**: 基于用户的学习数据，使用DeepSeek AI生成个性化的学习分析报告和建议。
+
+**涉及接口**:
+- `GET /api/ai/detail` - 获取详细学习数据
+- `GET /api/ai/duration` - 获取时段趋势数据
+- `GET /api/ai/heatmap` - 获取活跃度热力图
+- `POST /api/ai/analysis` - 生成AI分析（流式响应）
+
+**前端实现**:
+- **页面**: `src/oj/ai/analysis.vue`
+- **Store**: `src/oj/store/ai.ts`
+- **组件**: 
+  - `DurationChart.vue` - 混合图表（柱状图+折线图），展示题目数、提交数、等级变化
+  - `Heatmap.vue` - 提交热力图
+  - `Details.vue` - 详细数据展示
+  - `AI.vue` - AI分析结果展示（Markdown格式）
+
+**时间范围选择**:
+支持多种时间范围：一节课(1小时)、两节课(2小时)、一天、一周、一个月、两个月、半年、一年
+
+**等级系统**:
+- **S级**: 排名前10%（卓越水平，约10%的人）
+- **A级**: 排名前35%（优秀水平，约25%的人）
+- **B级**: 排名前75%（良好水平，约40%的人）
+- **C级**: 75%之后（及格水平，约25%的人）
+- **特殊规则**: 参与人数少于10人时，S级降为A级，A级降为B级（避免因人少而评级虚高）
+
+**流式接口实现**:
+`POST /api/ai/analysis` 使用了**流式响应（Server-Sent Events）**，在 `oj/store/ai.ts` 中直接使用 `fetch` API调用，配合 `consumeJSONEventStream` 工具函数处理流式数据，实现AI内容的实时流式输出。
+
+**数据缓存**:
+为提升性能，后端对 `ai/detail` 和 `ai/duration` 接口的返回数据进行了缓存，相同参数的请求会直接返回缓存结果。
+
+#### 2. ACM 比赛辅助检查功能 ✨
+
+**功能说明**: 用于赛后人工审核 ACM 模式比赛的代码，检查是否存在抄袭、作弊等行为。
+
+**涉及接口**:
+- `GET /api/admin/contest/acm_helper` - 获取比赛中所有 AC 的提交记录
+  - **返回数据**: 用户名、题目ID、AC时间、错误次数、检查状态等
+- `PUT /api/admin/contest/acm_helper` - 更新提交的检查状态
+  - **参数**: contest_id, rank_id, problem_id, checked
+
+**使用场景**:
+1. 管理员进入比赛详情页，点击"审核"按钮进入辅助检查页面
+2. 系统展示所有 AC 提交的列表（按用户和题目分组）
+3. 管理员可以：
+   - 查看每个提交的代码详情
+   - 标记已检查的提交
+   - 批量标记所有提交为已检查
+   - 按用户名、题目、检查状态筛选
+4. 实时显示检查进度统计（总计/已检查/未检查）
+
+**实现位置**:
+- 页面: `src/admin/contest/helper.vue`
+- 路由: `/admin/contest/:contestID/helper`
+- API: `src/admin/api.ts` (getACMHelperList, updateACMHelperChecked)
+
+#### 3. 前端不需要的接口 ❌
+
+##### 3.1 数据冗余接口
+**`GET /api/submission_exists`** - 此接口**无需实现**
+
+**分析结论**：
+- 后端题目接口（`GET /api/problem`）已返回 `my_status` 字段
+- `my_status` 完整记录了用户的做题状态：
+  - `0` (JudgeStatus.ACCEPTED) = 已通过 ✅
+  - `-1` (JudgeStatus.WRONG_ANSWER) = 答案错误 ❌
+  - `-2` (JudgeStatus.COMPILE_ERROR) = 编译错误 ❌
+  - `1` (JudgeStatus.TIME_LIMIT_EXCEEDED) = 超时 ❌
+  - 其他非零值 = 其他失败原因 ❌
+  - `null/undefined` = 从未提交 ⭕
+
+**前端实现**：
+```typescript
+// 仅需一个计算属性即可判断
+const hasTriedButNotPassed = computed(() => {
+  return problem.value?.my_status !== undefined &&
+         problem.value?.my_status !== null &&
+         problem.value?.my_status !== 0
+})
+```
+
+**优势对比**：
+| 方案 | API请求 | 代码复杂度 | 性能 |
+|------|---------|-----------|------|
+| ❌ 使用 submission_exists | +1 | 高（需异步+状态管理） | 慢（额外网络请求） |
+| ✅ 使用 my_status | 0 | 低（3行计算属性） | 快（本地计算） |
+
+**经验教训**：
+- 实现新功能前应充分了解后端现有数据结构
+- 避免创建冗余接口，优先利用现有数据
+- 简单的解决方案往往是最好的
+
+---
+
+##### 3.2 内部系统接口
+**`POST /api/judge_server_heartbeat/`** - 此接口**无需前端实现**
+
+**接口说明**：
+- **用途**: 判题服务器（JudgeServer）向后端报告健康状态
+- **调用方**: JudgeServer Docker 容器（非前端）
+- **调用频率**: 每隔几秒自动调用一次
+- **认证方式**: 使用 `judge_server_token`（特殊令牌，非用户认证）
+
+**报告的数据**：
+```python
+{
+  "hostname": "judge-server-1",
+  "judger_version": "2.0.4",
+  "cpu_core": 4,
+  "cpu": 45.2,           # CPU使用率
+  "memory": 60.5,        # 内存使用率
+  "service_url": "http://judger:8080"
+}
+```
+
+**后端使用场景**：
+- 监控判题服务器在线状态
+- 显示服务器资源使用情况（仅在管理后台显示）
+- 负载均衡分配判题任务
+
+**前端已有接口**：
+前端查看判题服务器状态使用的是：
+- `GET /api/admin/judge_server` - 获取所有判题服务器列表及状态
+
+**结论**：
+此接口是系统内部通信接口，前端完全不需要调用。类似的内部接口还可能存在于分布式系统的其他服务间通信中。
+
+---
+
+## 六、新增功能模块
+
+### FlowchartEditor 流程图编辑器 ✨
+
+**功能概述**: 基于 Vue Flow 构建的完整流程图编辑器，支持拖拽创建、节点连接、编辑等核心功能。
+
+**技术实现**:
+- **核心库**: Vue Flow (@vue-flow/core)
+- **组件架构**: 模块化设计，9个独立功能模块
+- **状态管理**: 基于 Vue 3 Composition API
+- **数据持久化**: localStorage 自动缓存
+- **交互体验**: 拖拽、键盘快捷键、撤销重做
+
+**组件结构**:
+```
+FlowchartEditor/
+├── index.vue              # 主组件 - 整合所有功能
+├── CustomNode.vue         # 自定义节点 - 7种节点类型
+├── Toolbar.vue            # 工具栏 - 节点创建和操作
+├── NodeHandles.vue        # 节点操作手柄 - 连接点管理
+├── NodeActions.vue        # 节点动作 - 删除、编辑按钮
+├── useCache.ts            # 缓存管理 - 自动保存/恢复
+├── useDnD.ts              # 拖拽处理 - 节点创建逻辑
+├── useFlowOperations.ts   # 流程操作 - 增删改查
+├── useHistory.ts          # 历史记录 - 撤销重做
+└── useNodeStyles.ts       # 节点样式 - 类型配置
+```
+
+**节点类型支持**:
+- **开始节点** (start) - 流程开始，绿色主题
+- **输入节点** (input) - 数据输入，蓝色主题
+- **处理节点** (default) - 数据处理，紫色主题
+- **判断节点** (decision) - 条件判断，橙色主题
+- **循环节点** (loop) - 循环处理，青色主题
+- **输出节点** (output) - 数据输出，粉色主题
+- **结束节点** (end) - 流程结束，红色主题
+
+**核心功能**:
+1. **拖拽创建**: 从工具栏拖拽节点到画布
+2. **节点连接**: 支持节点间的连线操作
+3. **节点编辑**: 双击节点进行文本编辑
+4. **撤销重做**: 完整的历史记录管理
+5. **自动保存**: 本地缓存，防止数据丢失
+6. **键盘快捷键**: Ctrl+Z/Ctrl+Y 撤销重做，Delete 删除
+7. **批量操作**: 支持多选和批量删除
+
+**数据格式**:
+```typescript
+// 节点数据
+interface Node {
+  id: string
+  type: string
+  position: { x: number, y: number }
+  data: {
+    customLabel: string
+    [key: string]: any
+  }
+}
+
+// 边数据
+interface Edge {
+  id: string
+  source: string
+  target: string
+  sourceHandle?: string
+  targetHandle?: string
+  type?: string
+}
+```
+
+**使用场景**:
+- 算法流程图绘制
+- 业务流程设计
+- 教学演示工具
+- 问题分析图表
+
+**性能优化**:
+- 基于 Vue Flow 的高性能渲染
+- 模块化设计，按需加载
+- 本地缓存减少重复计算
+- 响应式状态管理
+
+**扩展性**:
+- 支持自定义节点类型
+- 可扩展工具栏功能
+- 支持主题定制
+- 支持数据导入导出
+
+**文档支持**:
+- 详细的使用文档: `docs/FlowchartEditor.md`
+- 完整的 API 说明
+- 最佳实践指南
+- 故障排除手册
+