vscode-workbench/.trae/documents/api-favorite-status-check.md

接口大全收藏功能检测报告

检测目标

检测"接口大全"（API Directory）是否已实现收藏（收藏/收藏）功能

---

当前实现状态

✅ 已实现

1. 后端模型 — apidirectory/models.py

   • ApiFavorite 模型已定义，关联用户和 API 接口

2. 后端 API 端点

   • toggleFavorite 切换收藏接口已实现
   • 返回 is_favorited 状态和 favorites_count 数量

3. 详情页收藏功能 — ApiDetail.tsx (✅ 完整实现)

   • 收藏按钮位于 Hero 区域操作区
   • 支持空心/实心图标切换 (StarOutlined / StarFilled)
   • 显示收藏数量
   • 未登录时弹出登录框
   • 调用 api_request.apidirectory.toggleFavorite(apiData.id)

4. 列表数据支持

   • ApiItem 接口包含 favorites_count 和 is_favorited 字段
   • 支持按"最多收藏"排序

---

❌ 未实现（功能缺口）

缺口 1：API 接口大全列表页无收藏按钮

影响文件：

• ApiDirectory.tsx — 主列表页（卡片/列表视图）
• ApiDirectoryDesktop.tsx — 桌面版列表页

现状：

• 仅显示收藏数量（静态文字 <StarOutlined /> {api.favorites_count}）
• 无点击交互，无法直接收藏/取消收藏

缺口 2：收藏夹页面不显示 API 收藏

影响文件：

• Favorites.tsx
• 后端 user/views/favorites.py → MyFavoritesView

现状：

• 只支持 tool、article、course 三种收藏类型
• FavoriteItem 接口不包含 api 类型
• 标签页无 API 分类

---

修复方案

方案 A：最小改动（仅添加列表页收藏按钮）

文件修改清单：

文件	修改内容
ApiDirectory.tsx	添加 handleFavoriteToggle 函数，收藏按钮绑定点击事件
ApiDirectoryDesktop.tsx	同上
request.ts	已有 apidirectory.toggleFavorite，无需修改

方案 B：完整实现（列表页 + 收藏夹页联动）

前端修改：

文件	修改内容
ApiDirectory.tsx	添加收藏按钮 + 点击切换逻辑
ApiDirectoryDesktop.tsx	同上
Favorites.tsx	新增 api 类型到 FavoriteItem，添加 API 标签页
Favorites.css	适配 API 收藏卡片样式

后端修改：

文件	修改内容
user/views/favorites.py	MyFavoritesView 添加 api 类型查询分支，合并 ApiFavorite 数据

---

推荐方案

方案 B（完整实现），原因：

1. 用户期望在收藏夹中看到所有收藏内容，API 收藏不应缺失
2. 列表页添加收藏按钮是 UX 的基础要求
3. 后端改动量小，仅需在现有收藏视图中添加一个查询分支

---

验证步骤

1. 在接口大全列表页点击收藏按钮，验证图标切换和数量更新
2. 刷新页面，验证收藏状态持久化
3. 进入收藏夹页面，验证 API 收藏显示在对应标签下
4. 在收藏夹中取消收藏，验证同步更新