沃巴蒂
ff22ed3a8b
本次同步 09-12 至 09-28 的代码变更，主要内容： 新增功能 - 修改密码：后端新增 ChangePasswordRequest DTO 与UserController/UserService 对应接口，前端新增 ChangePasswordDialog 并在 Header 接入入口 - 文件预览组件重构：file-preview 目录拆分出 VideoPreview（支持 blobUrl 直传）、 ImagePreview、AudioPreview，index.tsx 统一调度各类型预览器 - 新增 my_ops 算子模块：markitdown_parser、mineru_pdf_parser、text_quality_evaluator - 新增 tools/minio-file-server MinIO 文件服务 功能增强 - 数据清洗：cleaning_task_service/scheduler/routes 重构， data_juicer_executor 与 wrapper 增强，OperatorTable/LogsTable/TaskDetail 同步调整 - 数据标注：annotation sync.py、project.py 接口与schema 更新 - 数据采集、算子市场、首页与菜单路由相关页面调整 - DataJuicer 算子接入（useOperatorOperations、dj_ops_schema） 结构调整 - deepflow/ 更名为 deep-flow/（419 个文件重命名） - 新增 helm 部署编排、GitHub Actions 之外的自建镜像构建脚本 未纳入本次提交 - scripts-backup/、runtime/python-executor-backup/、components_backup/（备份目录） - *.backup*、__pycache__ 产物 - zh_core_web_sm-3.8.0-py3-none-any.whl（46MB 构建产物） - DataX/（内嵌独立仓库，远程亦未收录其源码）
109 lines
3.6 KiB
Markdown
109 lines
3.6 KiB
Markdown
# 思考块功能 (Thought Block Feature)
|
|
|
|
## 概述
|
|
|
|
思考块功能允许在计划卡片之前展示 AI 的深度思考过程，以可折叠的方式呈现推理内容。这个功能特别适用于启用深度思考模式时的场景。
|
|
|
|
## 功能特性
|
|
|
|
- **智能展示逻辑**: 深度思考过程初始展开，当开始接收计划内容时自动折叠
|
|
- **分阶段显示**: 思考阶段只显示思考块，思考结束后才显示计划卡片
|
|
- **流式支持**: 支持推理内容的实时流式展示
|
|
- **视觉状态反馈**: 思考阶段使用蓝色主题突出显示
|
|
- **优雅的动画**: 包含平滑的展开/折叠动画效果
|
|
- **响应式设计**: 适配不同屏幕尺寸
|
|
|
|
## 技术实现
|
|
|
|
### 数据结构更新
|
|
|
|
1. **Message 类型扩展**:
|
|
```typescript
|
|
export interface Message {
|
|
// ... 其他字段
|
|
reasoningContent?: string;
|
|
reasoningContentChunks?: string[];
|
|
}
|
|
```
|
|
|
|
2. **API 事件类型扩展**:
|
|
```typescript
|
|
export interface MessageChunkEvent {
|
|
// ... 其他字段
|
|
reasoning_content?: string;
|
|
}
|
|
```
|
|
|
|
### 组件结构
|
|
|
|
- **ThoughtBlock**: 主要的思考块组件
|
|
- 使用 Radix UI 的 Collapsible 组件
|
|
- 支持流式内容展示
|
|
- 包含加载动画和状态指示
|
|
|
|
- **PlanCard**: 更新后的计划卡片
|
|
- 在计划内容之前展示思考块
|
|
- 自动检测是否有推理内容
|
|
|
|
### 消息处理
|
|
|
|
消息合并逻辑已更新以支持 `reasoning_content` 字段的流式处理：
|
|
|
|
```typescript
|
|
function mergeTextMessage(message: Message, event: MessageChunkEvent) {
|
|
// 处理常规内容
|
|
if (event.data.content) {
|
|
message.content += event.data.content;
|
|
message.contentChunks.push(event.data.content);
|
|
}
|
|
|
|
// 处理推理内容
|
|
if (event.data.reasoning_content) {
|
|
message.reasoningContent = (message.reasoningContent || "") + event.data.reasoning_content;
|
|
message.reasoningContentChunks = message.reasoningContentChunks || [];
|
|
message.reasoningContentChunks.push(event.data.reasoning_content);
|
|
}
|
|
}
|
|
```
|
|
|
|
## 使用方法
|
|
|
|
### 启用深度思考模式
|
|
|
|
1. 在聊天界面中，点击"Deep Thinking"按钮
|
|
2. 确保配置了支持推理的模型
|
|
3. 发送消息后，如果有推理内容，会在计划卡片上方显示思考块
|
|
|
|
### 查看推理过程
|
|
|
|
1. 深度思考开始时，思考块自动展开显示
|
|
2. 思考阶段使用 primary 主题色，突出显示正在进行的推理过程
|
|
3. 推理内容支持 Markdown 格式渲染，实时流式更新
|
|
4. 在流式传输过程中会显示加载动画
|
|
5. 当开始接收计划内容时，思考块自动折叠
|
|
6. 计划卡片以优雅的动画效果出现
|
|
7. 计划内容保持流式输出效果，逐步显示标题、思路和步骤
|
|
8. 用户可以随时点击思考块标题栏手动展开/折叠
|
|
|
|
## 样式特性
|
|
|
|
- **统一设计语言**: 与页面整体设计风格保持一致
|
|
- **字体层次**: 使用与 CardTitle 相同的 `font-semibold` 字体权重
|
|
- **圆角设计**: 采用 `rounded-xl` 与其他卡片组件保持一致
|
|
- **间距规范**: 使用标准的 `px-6 py-4` 内边距
|
|
- **动态主题**: 思考阶段使用 primary 色彩系统
|
|
- **图标尺寸**: 18px 图标尺寸，与文字比例协调
|
|
- **状态反馈**: 流式传输时显示加载动画和主题色高亮
|
|
- **交互反馈**: 标准的 hover 和 focus 状态
|
|
- **平滑过渡**: 所有状态变化都有平滑的过渡动画
|
|
|
|
## 测试数据
|
|
|
|
可以使用 `/mock/reasoning-example.txt` 文件测试思考块功能，该文件包含了模拟的推理内容和计划数据。
|
|
|
|
## 兼容性
|
|
|
|
- 向后兼容：没有推理内容的消息不会显示思考块
|
|
- 渐进增强：功能仅在有推理内容时激活
|
|
- 优雅降级：如果推理内容为空，组件不会渲染
|