# 使用说明

本项目是一个基于 Vue 3 + Element Plus 的单页面应用（SPA），集成四个智能助手：知识库助手、会议纪要生成、文本信息提取、竞品调研。UI 采用简洁现代风格，并提供 Docker 化的开发运行方式。

- 主标题：云大所AI卓越中心
- 副标题：n8n工作流
- 访问地址（默认）：`http://localhost:3000`

## 一、快速开始（Docker）

1. 安装 Docker（已安装可跳过）。
2. 在项目根目录执行：
```bash
docker compose up --build -d
```
3. 浏览器访问：`http://localhost:3000`
4. 停止服务：
```bash
docker compose down
```

## 二、Webhook 配置

本项目通过环境变量注入四个 Webhook URL，并在运行时读取：
- `VITE_KNOWLEDGE_BASE_WEBHOOK_URL`（知识库助手）
- `VITE_MEETING_MINUTES_WEBHOOK_URL`（会议纪要生成）
- `VITE_INVOICE_EXTRACTOR_WEBHOOK_URL`（文本信息提取）
- `VITE_COMPETITOR_RESEARCH_WEBHOOK_URL`（竞品调研）

默认配置位于 `docker-compose.yml`：
```yaml
services:
  web:
    environment:
      - VITE_KNOWLEDGE_BASE_WEBHOOK_URL=http://host.docker.internal:5678/webhook/8c4a81b4-176f-4c24-a79d-f406fde0686f
      - VITE_MEETING_MINUTES_WEBHOOK_URL=http://host.docker.internal:5678/webhook/21f77217-2824-4f23-88a6-866197f01504
      - VITE_INVOICE_EXTRACTOR_WEBHOOK_URL=http://host.docker.internal:5678/webhook/4a113d40-fd68-47e3-8b8a-313769be940e
      - VITE_COMPETITOR_RESEARCH_WEBHOOK_URL=http://host.docker.internal:5678/webhook/e6d35c87-cc34-4b44-969b-e584b161749f
```
- 若 n8n 与本项目同机运行，macOS/Windows 可直接使用 `host.docker.internal`。
- Linux 如无该主机名，可在 `docker-compose.yml` 的服务下添加：
```yaml
extra_hosts:
  - "host.docker.internal:host-gateway"
```
或改为宿主机的真实 IP。

程序在 `env.config.js` 中读取上述变量，若缺省将回退到内置默认地址。

## 三、模块使用指南

### 1. 知识库助手
- 左侧为三个文本输入：
  - 知识主题（必填）
  - 关键要点（可选）
  - 详细内容（必填）
- 右侧为“文件上传占位区”，用于提示可在此整理相关附件（不随请求上传，仅作展示）。
- 提交按钮已启用“防抖”（300ms），连续点击不会重复提交。
- 提交前对文本进行基础 XSS 清洗（HTML 转义）。

### 2. 会议纪要生成
- 分为三个标签页：
  - 会议议程/时间分段/会议笔记（文本域）
  - 录音文本（文本域）
  - 其他 AI 总结的要点（文本域）
- 校验：任意一项非空即可提交。
- 提交按钮已启用“防抖”（300ms），提交前进行文本清洗。
- 点击“生成纪要”，仅将三个文本域合并为 JSON，POST 到 Webhook；后端返回文件（blob 或包含 `fileUrl` 的 JSON），前端自动触发下载。

### 3. 文本信息提取
- 大的拖拽/点击上传区，支持多文件。
- 上传限制：仅支持 `PDF / 图片`，单文件大小 ≤ `10MB`，非法文件将被过滤并提示。
- 点击“开始提取”，以 `multipart/form-data` 一次性上传所有文件至 Webhook；展示实时上传进度；完成后自动下载结果文件。

### 4. 竞品调研助手
- 输入产品品类（如：电动牙刷、咖啡机）。
- 点击“开始调研”，将文本 POST 至 Webhook；后端返回报告（blob），前端自动下载。

## 四、下载文件名
- 若后端通过 `Content-Disposition` 返回文件名，前端会自动解析并使用；否则退回默认文件名。

## 五、常见问题（FAQ）
- 页面打不开：检查容器状态与端口占用，`docker compose ps / logs`。
- 下载未触发：检查浏览器下载拦截或后端返回格式。
- 无法访问 n8n：Linux 场景下设置 `extra_hosts` 或使用宿主机 IP。
- 修改 Webhook：编辑 `docker-compose.yml` 的 `VITE_*` 变量并重启。

## 六、项目结构（节选）
```
├─ src
│  ├─ api
│  │  └─ services.js
│  ├─ utils
│  │  ├─ download.js
│  │  ├─ timing.js
│  │  └─ sanitize.js
│  ├─ router
│  │  └─ index.js
│  ├─ views
│  │  ├─ KnowledgeBase.vue
│  │  ├─ MeetingMinutes.vue
│  │  ├─ InvoiceExtractor.vue
│  │  └─ CompetitorResearch.vue
│  ├─ App.vue
│  └─ main.js
├─ env.config.js
├─ docker-compose.yml
├─ Dockerfile
├─ vite.config.js
└─ 使用说明.md
```