# AI临床研究平台 - 前端

基于 Vite + React + TypeScript + Ant Design 构建

## 🏠 导航

- [← 返回项目主页](../README.md)
- [📚 查看完整文档](../docs/README.md)
- [⚙️ 后端项目](../backend/README.md)
- [🚀 快速启动指南](../启动指南.md)

---

## 🚀 快速开始

### 1. 安装依赖
```bash
npm install
```

### 2. 启动开发服务器
```bash
npm run dev
```

访问：http://localhost:3000

### 3. 构建生产版本
```bash
npm run build
```

## 📦 技术栈

- **框架**: React 18 + TypeScript
- **构建工具**: Vite 6
- **UI组件库**: Ant Design 5
- **CSS框架**: Tailwind CSS 3
- **路由**: React Router 6
- **HTTP客户端**: Axios
- **状态管理**: React Hooks（Day 7+可能引入Zustand）

## 📁 项目结构

```
frontend/
├── src/
│   ├── api/              # API请求
│   │   ├── request.ts    # Axios配置
│   │   └── index.ts      # API接口
│   ├── assets/           # 静态资源
│   ├── components/       # 公共组件
│   ├── layouts/          # 布局组件
│   │   └── MainLayout.tsx
│   ├── pages/            # 页面组件
│   │   ├── HomePage.tsx  # 首页
│   │   └── AgentPage.tsx # 智能体页面
│   ├── types/            # TypeScript类型定义
│   ├── utils/            # 工具函数
│   ├── App.tsx           # 根组件
│   ├── main.tsx          # 入口文件
│   └── index.css         # 全局样式
├── index.html
├── package.json
├── tsconfig.json
├── vite.config.ts
└── tailwind.config.js
```

## 🎨 功能特性

### Day 6 已完成
- ✅ 项目初始化（Vite + React + TypeScript）
- ✅ Ant Design UI组件库集成
- ✅ Tailwind CSS配置
- ✅ React Router路由配置
- ✅ 主布局组件（侧边栏 + 头部 + 内容区）
- ✅ 首页展示（12个智能体卡片）
- ✅ 智能体页面（占位符）
- ✅ Axios请求配置
- ✅ TypeScript类型定义

### Day 7-8 待开发
- ⏳ 项目管理功能
- ⏳ 知识库管理功能
- ⏳ 个人中心页面
- ⏳ 设置页面

### Day 9-10 待开发
- ⏳ 智能对话组件
- ⏳ 与后端API集成
- ⏳ 模型切换功能
- ⏳ 知识库@引用功能

## 🔧 开发规范

### 代码规范
- 使用TypeScript类型检查
- 使用ESLint代码检查
- 组件使用函数式组件 + Hooks
- 样式优先使用Tailwind CSS
- 复杂样式使用Ant Design内联style

### 命名规范
- 组件文件：PascalCase（如：HomePage.tsx）
- 普通文件：camelCase（如：request.ts）
- 常量：UPPER_SNAKE_CASE（如：API_BASE_URL）

### Git提交规范
- feat: 新功能
- fix: 修复bug
- docs: 文档更新
- style: 代码格式调整
- refactor: 代码重构

## 📡 API配置

后端API地址：http://localhost:3001/api/v1

代理配置已在`vite.config.ts`中设置：
```typescript
proxy: {
  '/api': {
    target: 'http://localhost:3001',
    changeOrigin: true,
  },
}
```

## 🎯 智能体列表

本平台提供12个AI智能体，覆盖临床研究全流程：

### 🌱 选题阶段

#### 1. 🎯 选题评价智能体
- **路由ID**: `topic-evaluation`
- **功能**: 从创新性、临床价值、科学性和可行性等维度评估研究选题
- **输入**: 用户提供的临床问题描述
- **输出**: 结构化评价报告，包含SWOT分析及综合建议

#### 2. 🔬 科学问题梳理智能体
- **路由ID**: `scientific-question`
- **功能**: 将模糊的研究想法提炼成清晰、具体、可验证的科学问题
- **输入**: 初步研究想法（如"研究肠道菌群与抑郁症的关系"）
- **输出**: 多个精炼后的科学问题选项

---

### 🔬 研究设计阶段

#### 3. 📋 PICOS构建智能体
- **路由ID**: `picos-construction`
- **功能**: 按照PICOS原则结构化定义临床研究的核心要素
- **输入**: 引导式表单或自由文本描述的研究问题
- **输出**: 标准化的PICOS表格（P-患者/人群、I-干预、C-对照、O-结局、S-研究设计）

#### 4. 📊 观察指标设计智能体
- **路由ID**: `observation-design`
- **功能**: 基于研究设计推荐合适的观察指标集
- **输入**: 已确定的PICOS框架或研究问题
- **输出**: 包含主要、次要及安全性指标的详细清单

#### 5. 📝 CRF制定智能体
- **路由ID**: `crf-development`
- **功能**: 自动生成结构化、符合规范的病例报告表（CRF）框架
- **输入**: 研究方案、观察指标清单
- **输出**: 可下载的CRF框架草稿（Word/Excel格式）

#### 6. 🔢 样本量计算智能体
- **路由ID**: `sample-size`
- **功能**: 根据研究类型、检验水准、把握度、效应量等参数估算样本量
- **输入**: 引导式表单（研究设计、α、β、效应量等）
- **输出**: 详细的样本量计算结果，包含公式、参数说明和建议样本量

#### 7. 📄 临床研究方案撰写智能体
- **路由ID**: `protocol-writing`
- **功能**: 基于科学问题、PICOS等信息，自动生成完整的临床研究设计方案
- **输入**: 科学问题、PICOS、样本量等
- **输出**: 包含研究背景、目的、设计、流程等章节的Word文档初稿

---

### 📝 论文阶段

#### 8. ✨ 论文润色智能体
- **路由ID**: `paper-polishing`
- **功能**: 提供专业级的语言润色，修正语法、拼写和表达方式
- **输入**: 上传的论文稿件（Word/Text），目标期刊名称（可选）
- **输出**: 带修订标记的润色后文稿及修改摘要说明

#### 9. 🌐 论文翻译智能体
- **路由ID**: `paper-translation`
- **功能**: 提供专业、精准的中英互译服务，优化医学科研术语
- **输入**: 上传的论文稿件，选择源语言和目标语言
- **输出**: 翻译完成的稿件，保留原格式

#### 10. 🔍 方法学评审智能体
- **路由ID**: `methodology-review`
- **功能**: 从研究问题、方案设计、实施可行性和临床意义等维度进行方法学评审
- **输入**: 上传的研究方案或论文稿件
- **输出**: 评审报告，分点列出优点、潜在缺陷及改进建议

#### 11. 📑 期刊方法学评审智能体
- **路由ID**: `journal-methodology-review`
- **功能**: 模拟期刊审稿人视角，针对统计学、方法学问题进行挑战
- **输入**: 上传的论文稿件，目标期刊
- **输出**: 模拟的"审稿意见"，列出可能被挑战的问题点

#### 12. ✅ 期刊稿约评审智能体
- **路由ID**: `journal-guidelines-review`
- **功能**: 依据目标期刊的投稿要求，自动检查格式、字数、参考文献规范
- **输入**: 上传的论文稿件，目标期刊的投稿指南
- **输出**: 格式审查报告，清晰列出所有不符合项和修改建议

---

### 🔗 路由规则

所有智能体页面遵循统一路由规则：
```
/agent/{路由ID}
```

**示例**：
- `/agent/topic-evaluation` - 选题评价智能体
- `/agent/picos-construction` - PICOS构建智能体
- `/agent/paper-polishing` - 论文润色智能体

## 📞 技术支持

详见项目根目录的完整文档：
- `docs/01-设计文档/API设计规范.md`
- `docs/02-开发规范/代码规范.md`
- `docs/04-开发计划/开发里程碑.md`

---

**Day 6 完成！前端基础架构搭建完毕！** 🎉