---
name: content-management
description: 内容管理（CMS）模块的业务规则，包含文章发布流程、富文本编辑规范与 SEO 要求。当涉及文章、资讯、公告等内容管理功能时必须参考此 Skill。
---

# 内容管理 (CMS) 业务 Skill

## 适用范围

当任务涉及以下场景时，必须加载并遵循此 Skill：

- 文章/资讯列表、编辑、发布
- 内容分类与标签管理
- 富文本/Markdown 编辑器集成
- SEO 字段管理

## 业务规则

### 1. 文章发布流程

```
草稿 (draft) → 待审核 (pending_review) → 已发布 (published) → 已归档 (archived)
                    ↓
                  驳回 (rejected) → 草稿 (draft) [修改后重新提交]
```

**关键约束**:

- 普通编辑: 只能提交审核，不能直接发布
- 管理员/主编: 可以跳过审核直接发布
- 已发布文章: 编辑后生成新版本，需重新审核
- 定时发布: 支持设置 `publishAt` 时间，到达时间后系统自动从「待发布」改为「已发布」

### 2. 内容模型

- **标题** (title): 必填，2-100 字符
- **摘要** (summary): 选填，≤ 200 字符。若未填写，自动截取正文前 200 字
- **正文** (content): 必填，支持 Markdown 格式
- **封面图** (coverImage): 推荐尺寸 16:9（如 1200×675），支持裁剪
- **分类** (categoryId): 必填，单选
- **标签** (tags): 选填，多选，最多 5 个
- **SEO 字段**:
  - `seoTitle`: 选填，≤ 60 字符
  - `seoDescription`: 选填，≤ 160 字符
  - `seoKeywords`: 选填，逗号分隔

### 3. 排序规则

- 默认按发布时间倒序
- 支持「置顶」功能（`isTop: boolean`），置顶文章优先展示
- 置顶文章之间按置顶时间倒序

## 数据模型

### 核心接口

```typescript
// src/services/article.ts
export async function getArticleList(
  params: ArticleQueryParams,
): Promise<API.PageResult<ArticleItem>> {}
export async function getArticleDetail(id: string): Promise<ArticleDetail> {}
export async function createArticle(
  data: ArticleFormData,
): Promise<ArticleItem> {}
export async function updateArticle(
  id: string,
  data: Partial<ArticleFormData>,
): Promise<ArticleItem> {}
export async function updateArticleStatus(
  id: string,
  status: ArticleStatus,
): Promise<void> {}
export async function deleteArticle(id: string): Promise<void> {}
export async function toggleTop(id: string, isTop: boolean): Promise<void> {}
```

### 关键类型

```typescript
// src/pages/Article/data.d.ts
type ArticleStatus =
  | 'draft'
  | 'pending_review'
  | 'published'
  | 'archived'
  | 'rejected';

interface ArticleItem {
  id: string;
  title: string;
  summary?: string;
  content: string;
  coverImage?: string;
  categoryId: string;
  categoryName: string;
  tags: string[];
  status: ArticleStatus;
  author: string;
  isTop: boolean;
  viewCount: number;
  publishAt?: string;
  createdAt: string;
  updatedAt: string;
  seoTitle?: string;
  seoDescription?: string;
  seoKeywords?: string;
}
```

## UI 交互规范

### 1. 文章列表页

- **组件**: `ProTable`（搜索字段 < 4，使用内置 search）
- **必须包含列**: 标题（可点击预览）、分类、状态、作者、发布时间、阅读量、操作
- **操作逻辑**: 根据状态动态展示按钮
  - 草稿: 编辑 / 提交审核 / 删除
  - 已发布: 编辑 / 下架（归档）/ 置顶/取消置顶
- **置顶标识**: 在标题前显示 📌 图标

### 2. 文章编辑页

- **组件**: `ProForm`（非分步）
- **编辑器**: 使用项目中已有的 `MarkdownEditor` 组件（`src/components/MarkdownEditor`）
- **布局**: 左侧大区域放编辑器，右侧抽屉或区域放 SEO/分类/标签
- **自动保存**: 每 30 秒自动保存草稿（使用 `useRequest` 配合 `debounce`）

### 3. 预览

- 支持在弹窗中预览 Markdown 渲染结果
- 预览模式使用 `Modal` + Markdown 渲染组件

## i18n Key 规范

- 菜单: `menu.content.*` 或 `menu.article.*`
- 页面: `pages.article.*`
- 表单: `article.form.*`
- 状态: `article.status.*`