# AI 写作工坊 - 结构化内容生成平台

一个基于 Vue 3 的专业 AI 写作辅助工具，通过**写作范式（Paradigm）**系统实现高质量、规范化的内容生成，特别适用于公文写作、技术文档、结构化报告等场景。

## ✨ 核心特性

### 🎯 智能范式系统
- **20+ 预设范式**：覆盖公文、技术文档、博客等多种写作场景
- **自定义范式**：通过 AI 需求解析自动生成个性化范式配置
- **智能粒度过滤**：根据文本长度自动调整检查标准（句子级/段落级/全文级）

### 🎨 范式润色工作流（核心创新）
```
选择范式 → 输入内容 → 智能检查 → AI 重写 → 预览应用
```
- 批量处理：检查 15 句/批，重写 10 句/批
- 差异可视化：实时高亮显示修改内容
- 版本管理：文稿历史版本对比

### 📝 分章节生成
- 按照章节结构逐段生成
- 保持上下文连贯性
- 支持大纲模式引导

### 📊 内容管理
- **文稿库**：版本管理、历史回溯
- **素材库**：参考案例、风格标签提取
- **对照检查**：左右版本逐句比对

---

## 🚀 快速开始

### 安装依赖

```bash
npm install
```

### 开发模式

```bash
npm run dev
# 访问 http://localhost:3001
```

如需启用服务端 LLM 代理与 SQLite，请先配置 `.env`，并使用：

```bash
npm run start
```

### 构建生产版本

```bash
npm run build
npm run preview
```

---

## 🛠️ 技术栈

```yaml
核心框架:
  - Vue 3.4 (Composition API)
  - Vite 5.0
  - Pinia (状态管理)

富文本编辑:
  - Tiptap 3.15
  - Marked (Markdown 解析)

数据存储:
  - SQLite (服务端数据库)

工具库:
  - Axios (HTTP 客户端)
  - diff-match-patch (文本差异)
  - docx (Word 导出)
  - file-saver (文件下载)

样式方案:
  - Tailwind CSS v4
  - CSS Variables (设计系统)
  - IconLibrary (SVG 图标组件库)

AI 集成:
  - 服务端 LLM 代理（DeepSeek 等，可扩展）
```

---

## 📁 项目结构

```
src/
├── components/                # Vue 组件 (按功能分类)
│   ├── base/                  # 基础 UI 组件
│   │   ├── BaseButton.vue
│   │   ├── BaseIcon.vue
│   │   ├── BaseInput.vue
│   │   └── BaseModal.vue
│   ├── layout/                # 布局组件
│   │   ├── GlobalSidebar.vue        # 侧边导航
│   │   └── HomePage.vue             # 首页
│   ├── panels/                # 功能面板 (核心)
│   │   ├── WriterPanel.vue          # AI 写作
│   │   ├── MimicWriterPanel.vue     # 以稿写稿
│   │   ├── ParadigmWriterPanel.vue  # 范式写作
│   │   ├── OutlineWriterPanel.vue   # 提纲写作
│   │   ├── ArticleEditorPanel.vue   # 文章修改 ⭐
│   │   ├── ArticleFusionPanel.vue   # 文章融合
│   │   ├── ArticleRewritePanel.vue  # 范式润色 ⭐
│   │   ├── AnalysisPanel.vue        # 范式库
│   │   ├── ComparePanel.vue         # 对照检查
│   │   ├── DiffAnnotationPanel.vue  # 差异标注
│   │   ├── DocumentsPanel.vue       # 文稿库
│   │   ├── MaterialsPanel.vue       # 素材库
│   │   └── SettingsPanel.vue        # 设置
│   ├── modals/                # 弹窗组件
│   │   ├── DocumentSelectorModal.vue
│   │   ├── MaterialSelectorModal.vue
│   │   └── ParadigmSelectorModal.vue
│   ├── editors/               # 编辑器组件
│   │   ├── MainContent.vue          # 主内容区
│   │   └── MarkdownEditor.vue       # Markdown 编辑器
│   ├── results/               # 结果展示组件
│   │   ├── FusionResultPanel.vue
│   │   ├── OutlineResultPanel.vue
│   │   └── DocumentVersionPanel.vue
│   ├── specialized/           # 特殊功能组件
│   │   └── RequirementParserPanel.vue  # 需求解析 ⭐
│   └── icons/                 # 图标组件
│       └── IconLibrary.vue
│
├── stores/                    # Pinia 状态管理
│   ├── app.js                 # 主应用 store
│   ├── database.js            # 数据库 store
│   └── paradigm.js            # 范式管理 store ⭐
│
├── config/                    # 配置文件
│   ├── paradigms.js           # 范式定义 (20+ 预设)
│   ├── logicParadigms.js      # 逻辑范式
│   ├── dimensionSets.js       # 维度集
│   ├── sectionTypes.js        # 章节类型
│   └── references.js          # 参考案例
│
├── utils/                     # 工具函数
│   ├── promptBuilder.js       # Prompt 构建器
│   ├── requirementParser.js   # 需求解析工具 ⭐
│   ├── textDiff.js            # 文本差异计算
│   ├── config.js              # 配置管理
│   └── textProcessing.js      # 文本处理
│
├── api/                       # API 接口
│   └── deepseek.js            # DeepSeek API 封装
│
├── db/                        # 数据库
│   └── index.js               # 服务端数据库 API 客户端
│
├── styles/                    # 样式文件 ⭐
│   ├── design-tokens.css      # 设计变量
│   ├── components.css         # 组件样式
│   └── utilities.css          # 工具类
│
├── App.vue                    # 根组件
└── main.js                    # 入口文件
```

---

## 🎯 八大功能模块

### 1. ✍️ AI 写作
- **自由模式**：直接输入任务描述
- **大纲模式**：结构化输入（主题、受众、关键点）
- **深度模式**：模拟人类写作思维链（初稿→批判→润色）
- **风格注入**：参考案例自动分析并应用

### 2. 🎯 范式库
- 浏览和选择 20+ 预设范式
- 创建和管理自定义范式
- 范式详情查看和编辑

### 3. 📝 范式写作
- 按章节结构生成内容
- 保持全文连贯性
- 支持多种章节类型

### 4. 📂 文稿库
- 文稿创建和管理
- 版本历史记录
- 差异对比查看

### 5. 📚 素材库
- 参考案例管理
- 风格标签提取
- 快速引用到写作

### 6. 🎨 范式润色（⭐ 核心创新）
- **智能检查**：根据范式标准逐句检查
- **批量处理**：支持大量文本的高效处理
- **AI 重写**：基于检查结果针对性优化
- **差异预览**：可视化显示修改内容
- **选择性应用**：灵活选择应用哪些修改

### 7. 🔍 对照检查
- 左右版本对比
- 逐句检查差异
- 批量对比分析

### 8. 📊 差异标注
- 可视化差异高亮
- 支持多种视图模式
- 导出标注结果

---

## 🔧 核心功能详解

### 智能需求解析

从需求文档自动生成范式配置：

```bash
# 示例需求文档
组织生活会对照检查材料要求：
- 会前理论学习情况
- 征求意见建议情况
- 对照五个方面查摆问题
- 整改落实情况

# AI 自动生成
{
  "specializedPrompt": "你是一位资深的...",
  "expertGuidelines": [
    {"title": "党内术语规范", "description": "...", "scope": "sentence"},
    {"title": "递进式结构", "description": "...", "scope": "paragraph"},
    ...
  ]
}
```

**使用方法**：
1. 点击"范式润色" → "选择范式" → "新建范式"
2. 粘贴需求文档或上传文件
3. AI 自动解析并生成范式配置
4. 编辑确认后保存使用

### 智能粒度过滤

根据选中句子数量自动调整检查标准：

| 句子数量 | 检查粒度 | 检查内容示例 |
|---------|---------|-------------|
| 1-5 句 | 句子级 | 术语规范、语气分寸、表达方式 |
| 6-20 句 | 段落级 | + 逻辑结构、递进关系、论述层次 |
| 21+ 句 | 全文级 | + 章节完整性、篇幅占比、结构要求 |

**优势**：避免小文本被全文标准误判（如选择 1 句话时不会要求"包含会前准备章节"）

---

## 🏗️ 架构设计

### 状态管理（Pinia）

```javascript
// app.js - 主应用 store (10 大状态分区)
1. 基础配置: currentPage, selectedProviderId
2. 基础数据: documents, materials, paradigms
3. AI写作模式: inputTask, inputType, references
4. 生成状态: isGenerating, generationStage
5. 分析面板: analysisText, analysisResult
6. 范式写作: paradigmWriterState
7. 范式编辑: paradigmEditState
8. 范式润色: rewriteState ⭐
9. 对照检查: compareState
10. UI状态: currentDocument, showPromptDebug

// paradigm.js - 范式管理 store ⭐
- customParadigms: 自定义范式列表（localStorage 持久化）
- inferScope(): 智能推断检查项粒度
- ensureGuidelinesHasScope(): 补充 scope 字段
```

### 组件通信模式

```
用户操作 → UI组件 → Store Action → API调用 → 状态更新 → 响应式渲染
```

**设计模式**：
- **Command Pattern**: 所有操作封装为 `*Action` 方法
- **Strategy Pattern**: 可插拔的范式系统
- **Observer Pattern**: Pinia 响应式系统

---

## 📝 配置说明

### 环境变量

创建 `.env` 文件：

```env
# DeepSeek API 配置
VITE_API_URL=https://api.deepseek.com
VITE_API_KEY=your_api_key_here
VITE_MODEL=deepseek-chat
```

**获取 API Key**：
1. 访问 [DeepSeek 开放平台](https://platform.deepseek.com/)
2. 注册并创建 API Key
3. 复制到 `.env` 文件

### 安全提示
- `.env` 文件已加入 `.gitignore`
- 生产环境建议使用服务器环境变量
- 不要在代码中硬编码 API Key

---

## 🎨 设计系统

### CSS Variables

```css
/* 设计 Tokens (src/styles/design-tokens.css) */
--bg-primary: #0f172a;
--bg-secondary: #1e293b;
--text-primary: #f8fafc;
--accent-primary: #6366f1;
/* ... */
```

### 可复用组件

- `BaseButton`: 统一按钮样式
- `BaseInput`: 表单输入组件
- `BaseModal`: 模态框组件

---

## 🚢 部署指南

### 静态托管

**Vercel** (推荐):
```bash
npm run build
vercel --prod
```

**Netlify**:
```bash
npm run build
netlify deploy --prod --dir=dist
```

**GitHub Pages**:
```bash
npm run build
# 将 dist 目录推送到 gh-pages 分支
```

### 服务器部署

**Nginx**:
```nginx
server {
    listen 80;
    root /path/to/dist;
    index index.html;

    location / {
        try_files $uri $uri/ /index.html;
    }
}
```

**Docker**:
```dockerfile
FROM node:18-alpine
WORKDIR /app
COPY package*.json ./
RUN npm ci
COPY . .
RUN npm run build
EXPOSE 80
CMD ['nginx', '-g', 'daemon off;']
```

---

## 🤝 贡献指南

### 开发规范

1. **代码风格**: 遵循 ESLint 配置
2. **组件命名**: PascalCase (如 `WriterPanel.vue`)
3. **文件组织**: 按功能模块分组
4. **提交信息**: 使用 Conventional Commits

### 添加新范式

编辑 `src/config/paradigms.js`:

```javascript
{
  id: 'custom-paradigm',
  name: '自定义范式',
  icon: 'star',  // 使用 IconLibrary 图标名称
  description: '范式描述',
  type: 'custom',
  isCustom: true,
  specializedPrompt: '系统提示词...',
  expertGuidelines: [
    '检查项 1',
    '检查项 2'
  ],
  outlineTemplate: '大纲模板',
  recommendedTags: ['标签1', '标签2']
}
```

---

## 📚 文档资源

- [需求解析功能使用指南](docs/需求解析功能使用指南.md)
- [部署文档](docs/DEPLOYMENT.md)
- [Prompt 最佳实践](docs/prompt.md)

---

## 🗺️ 路线图

### 已完成 ✅
- [x] 八大核心功能模块
- [x] 智能需求解析
- [x] 智能粒度过滤
- [x] 批量处理优化
- [x] 设计系统集成
- [x] 组件化重构

### 计划中 🚧
- [ ] 单元测试和集成测试
- [ ] TypeScript 迁移
- [ ] CI/CD 自动化
- [ ] 多模型支持（Claude、GPT-4）
- [ ] 协作功能（多人编辑）
- [ ] PWA 移动端适配

---

## 📄 许可证

MIT License - 详见 [LICENSE](LICENSE) 文件

---

## 💡 技术亮点

### 1. 语义锚定 (Semantic Anchoring)
通过大纲模式强制用户提供逻辑骨架，有效防止 AI 幻觉和跑题。

### 2. 风格对齐 (Style Alignment)
自动分析参考案例，提取风格标签并注入 Prompt。

### 3. 认知模拟 (Cognition Simulation)
深度模式模拟人类"初稿→批判→润色"的思维链。

### 4. 智能工作流
批量处理 + 粒度过滤 + 差异可视化，实现高效的人机协作。

---

**项目代码统计**: 50+ 组件，~5000+ 行核心代码，持续迭代优化中 🚀