57 lines
1.8 KiB
Markdown
57 lines
1.8 KiB
Markdown
# category.ts
|
||
|
||
**路径**：`src/api/category.ts`
|
||
|
||
## 功能用途
|
||
|
||
分类（Tag）相关接口与数据结构，对接 `/PmTag/getPmTagList`，获取首页顶部分类 Tab 数据。支持树形结构、图标自动匹配、按 sort 排序。
|
||
|
||
## 核心能力
|
||
|
||
- `getPmTagMain`：获取主分类树，返回 `CategoryTreeNode[]`
|
||
- `enrichWithIcons`：递归为节点补充 MDI 图标（无 icon 时自动匹配）
|
||
- `MOCK_CATEGORY_TREE`：模拟分类数据，用于开发/测试
|
||
|
||
## 类型说明
|
||
|
||
| 类型 | 说明 |
|
||
|------|------|
|
||
| `PmTagMainItem` | 接口返回的 PmTag 结构，含 children |
|
||
| `CategoryTreeNode` | 前端使用的树节点，含 id、label、slug、icon、sectionTitle、children、tagIds |
|
||
|
||
### CategoryTreeNode.tagIds
|
||
|
||
从后端 `PmTagCatalogItem.tagId` 字段提取的标签 ID 列表，用于事件筛选：
|
||
|
||
```typescript
|
||
interface CategoryTreeNode {
|
||
// ... 其他字段
|
||
/** 关联的标签 ID 列表，用于事件筛选 */
|
||
tagIds?: number[]
|
||
}
|
||
```
|
||
|
||
**提取逻辑**：
|
||
- 如果 `tagId` 是数字数组，直接使用（`[1351, 1368]`）
|
||
- 如果 `tagId` 是单个数字，包装为数组（`1351` → `[1351]`）
|
||
- 如果 `tagId` 是对象或其他类型，忽略
|
||
|
||
## 使用方式
|
||
|
||
```typescript
|
||
import { getPmTagMain, enrichWithIcons, MOCK_CATEGORY_TREE } from '@/api/category'
|
||
|
||
// 获取分类
|
||
const res = await getPmTagMain()
|
||
const tree = res.data // 已包含图标、排序
|
||
|
||
// 开发时使用 mock
|
||
const mockTree = enrichWithIcons(MOCK_CATEGORY_TREE)
|
||
```
|
||
|
||
## 扩展方式
|
||
|
||
1. **新增分类层级**：在 `CategoryTreeNode` 中扩展字段，`getPmTagMain` 的 `mapPmTagToTreeNode` 中映射
|
||
2. **自定义图标**：在 `categoryIcons.ts` 中扩展 `ICON_MAP`，`enrichWithIcons` 会自动使用
|
||
3. **过滤逻辑**：在 `getPmTagMain` 中根据 `forceShow`/`forceHide` 过滤节点
|