xtraderClient/docs/api/category.md

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 列表，用于事件筛选：

interface CategoryTreeNode {
  // ... 其他字段
  /** 关联的标签 ID 列表，用于事件筛选 */
  tagIds?: number[]
}

提取逻辑：

• 如果 tagId 是数字数组，直接使用（[1351, 1368]）
• 如果 tagId 是单个数字，包装为数组（1351 → [1351]）
• 如果 tagId 是对象或其他类型，忽略

使用方式

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 过滤节点