docs: complete documentation system (250+ files)

- System architecture and design documentation - Business module docs (ASL/AIA/PKB/RVW/DC/SSA/ST) - ASL module complete design (quality assurance, tech selection) - Platform layer and common capabilities docs - Development standards and API specifications - Deployment and operations guides - Project management and milestone tracking - Architecture implementation reports - Documentation templates and guides
2025-11-16 15:43:55 +08:00
parent 0fe6821a89
commit e52020409c
173 changed files with 46227 additions and 11964 deletions
--- a/docs/03-业务模块/ASL-AI智能文献/02-技术设计/03-前端组件设计.md
+++ b/docs/03-业务模块/ASL-AI智能文献/02-技术设计/03-前端组件设计.md
@@ -0,0 +1,155 @@
+# AI智能文献模块 - 前端组件设计
+
+> **文档版本：** v1.0  
+> **创建日期：** 2025-10-29  
+> **维护者：** AI智能文献开发团队  
+> **最后更新：** 2025-10-29
+
+---
+
+## 📋 文档说明
+
+本文档描述AI智能文献模块的前端组件设计，包括组件结构、组件接口、交互设计等。
+
+---
+
+## 🧩 组件架构
+
+### 标题摘要初筛模块组件结构
+
+```
+LiteratureScreeningModule/
+├── TitleAbstractScreening/
+│   ├── SetupView/                    # 设置与启动视图
+│   │   ├── CriteriaReference.tsx     # 标准参考面板
+│   │   ├── CriteriaAdjustment.tsx    # 临时调整标准
+│   │   ├── LiteratureImport.tsx      # 文献导入组件
+│   │   └── StartScreeningButton.tsx  # 启动筛选按钮
+│   │
+│   ├── ReviewTableView/              # 表格化审核工作台 ⭐核心
+│   │   ├── ScreeningTable.tsx        # 主表格组件
+│   │   ├── TableHeader.tsx           # 表头（双行结构）
+│   │   ├── TableRow.tsx              # 表格行
+│   │   ├── ExpandableRow.tsx         # 可展开行（证据展示）
+│   │   ├── JudgmentCell.tsx          # 判断单元格（✓/✗/?）
+│   │   ├── ConflictIndicator.tsx     # 冲突状态指示器
+│   │   └── DecisionSelector.tsx      # 最终决策选择器
+│   │
+│   ├── EvidenceModal/                # 双视图原文审查模态框
+│   │   ├── ModalContainer.tsx        # 模态框容器
+│   │   ├── AbstractView.tsx          # 左侧：摘要视图
+│   │   ├── EvidenceView.tsx          # 右侧：证据视图
+│   │   └── HighlightedText.tsx       # 高亮文本组件
+│   │
+│   ├── ResultView/                   # 结果展示视图
+│   │   ├── StatisticsCards.tsx       # 统计卡片
+│   │   ├── PrismaSummary.tsx         # PRISMA式排除总结
+│   │   ├── ResultTabs.tsx            # 结果Tab页
+│   │   └── ResultTable.tsx           # 结果表格
+│   │
+│   └── shared/                       # 共享组件
+│       ├── ProtocolOverview.tsx      # 研究方案概览面板
+│       ├── BatchOperation.tsx        # 批量操作组件
+│       └── ExportButton.tsx          # 导出按钮
+```
+
+---
+
+## 🎨 核心组件设计
+
+### 1. ScreeningTable (表格化审核工作台)
+
+**组件职责**:
+- 展示文献列表和筛选结果
+- 支持展开/收起查看证据
+- 支持点击判断查看详情
+- 支持批量操作
+
+**Props接口**:
+```typescript
+interface ScreeningTableProps {
+  projectId: string;
+  items: LiteratureItem[];
+  results: ScreeningResult[];
+  onDecisionChange: (itemId: string, decision: string) => void;
+  onBatchUpdate: (itemIds: string[], decision: string) => void;
+}
+```
+
+### 2. EvidenceModal (双视图原文审查模态框)
+
+**组件职责**:
+- 左侧显示摘要/全文
+- 右侧显示AI判断和证据
+- 支持文本高亮
+- 支持查看引用来源
+
+**Props接口**:
+```typescript
+interface EvidenceModalProps {
+  visible: boolean;
+  itemId: string;
+  dimension: 'P' | 'I' | 'C' | 'S';
+  onClose: () => void;
+}
+```
+
+### 3. ReviewTableView (审核工作台主视图)
+
+**组件职责**:
+- 整合表格和模态框
+- 管理筛选状态
+- 处理用户交互
+
+---
+
+## 🔄 状态管理
+
+### 使用Zustand管理筛选状态
+
+```typescript
+interface ScreeningStore {
+  currentProject: Project | null;
+  items: LiteratureItem[];
+  results: ScreeningResult[];
+  selectedItems: string[];
+  loading: boolean;
+  
+  // Actions
+  loadProject: (projectId: string) => Promise<void>;
+  updateDecision: (itemId: string, decision: string) => Promise<void>;
+  batchUpdate: (itemIds: string[], decision: string) => Promise<void>;
+}
+```
+
+---
+
+## 📱 响应式设计
+
+### 表格布局适配
+- **桌面端**: 完整表格显示
+- **平板端**: 可横向滚动，关键列固定
+- **移动端**: 卡片式布局替代表格
+
+---
+
+## ⏳ 待完善内容
+
+后续将补充：
+- 详细组件接口定义
+- 组件交互流程图
+- 样式设计规范
+- 组件使用示例
+
+---
+
+**文档版本：** v1.0  
+**最后更新：** 2025-10-29
+
+
+
+
+
+
+
+