病理知识问答智能体（Pathology Knowledge Q&A AI AGENT）

[LJ666-ui]

病理知识问答智能体（Pathology Knowledge Q&A AI AGENT）

本项目是一个基于现代Web技术栈 （React + TypeScript + Ant Design） 构建的，专为病理学领域设计的智能辅助与知识问答平台。它旨在利用AI技术辅助病理医生进行诊断、学习和科研，核心功能包括：具备深度思考 （Chain-of-Thought） 可视化与语音交互的智能问答系统、集成图像增强与标注工具的数字化病例分析模块、以及支持知识图谱与RAG流程的知识库管理系统。项目通过高度可解释的交互设计、专业的工具模拟和沉浸式的数据可视化，探索了AI在垂直医疗领域的落地应用。

运行条件
要成功在本地运行此前端项目，您需要满足以下条件：

Node.js 环境： 确保已安装 Node.js （推荐版本 16 或 18 及以上） 和 npm 或 yarn 包管理器。
现代浏览器： 项目使用了一些现代Web API（如 Web Speech API），建议使用 Chrome、Edge 或 Firefox 的最新版本以获得最佳体验。
网络连接：虽然核心功能在本地运行，但部分模拟的AI对话和功能演示假设了在线环境。
（可选）代码编辑器： 如 VS Code，用于查看和修改源代码。
运行说明
请按以下步骤在本地开发环境中运行和使用本项目：

步骤一：获取代码与安装依赖

将项目代码克隆或下载到本地。 在项目根目录打开终端，运行 或 命令，安装所有项目依赖包。npm installyarn

步骤二：启动开发服务器

在终端中运行 或 命令。 命令执行成功后，终端将显示本地服务器地址（通常是 http://localhost:5173）。%E3%80%82/)npm run devyarn dev

步骤三：访问与使用

在浏览器中打开上述本地服务器地址。 系统将直接进入应用界面。 您可以：

在“智能问答”页与AI对话，尝试文字或语音输入，观察“深度思考”过程。
在“病例分析”页上传或使用示例图片，体验图像增强、标注工具，并生成模拟报告。
在“知识库管理”页查看模拟的RAG流程和交互式知识图谱。
在“系统设置”中切换深色/浅色主题、调节字体大小。
步骤四：打包构建 (用于部署)

运行 命令。 构建产物将生成在 目录中，可直接部署到任何静态文件托管服务。npm run builddist

测试说明
本项目为纯前端演示项目，主要功能在浏览器中模拟实现：

功能测试: 所有交互功能，如聊天、图像操作、知识图谱拖拽、设置切换等，均可在浏览器中直接操作进行测试。
数据持久化测试： 刷新浏览器页面，检查聊天记录、知识库上传列表、用户设置等是否通过LocalStorage正确保存与恢复。
兼容性测试： 建议在Chrome、Edge等主流浏览器的最新版本中进行测试，以确保Web Speech API等特性正常工作。
RAG流程模拟： 知识库管理页面中的“上传解析”功能为前端模拟，用于演示流程，未连接真实后端向量数据库。
技术架构
前端技术栈与架构说明 本项目采用前后端分离架构，当前实现为完整的静态前端应用，模拟了后端逻辑。其技术架构可分为以下几层：

1. 前端展示层（UI层）：

框架： React 18 + TypeScript，构建类型安全、组件化的用户界面。
UI组件库： Ant Design （AntD） 5.0，提供高质量、一致性的基础组件。
样式方案： Styled-components，实现组件级别的动态样式与主题化。
数据可视化： ECharts （通过 echarts-for-react），用于渲染知识图谱、散点图、雷达图等复杂图表。
2. 业务逻辑层（业务逻辑层）：

状态管理： 使用 React Context API 结合 useReducer Hook，管理全局应用状态（用户会话、聊天历史、系统设置）。
路由管理： React Router v6，处理单页面应用内的视图切换与导航。
AI交互模拟： 通过精心设计的Prompt和本地逻辑，模拟大模型的思考链 （CoT） 输出与结构化报告生成。
语音交互： 集成浏览器原生 Web Speech API（SpeechRecognition， SpeechSynthesis） 实现语音输入与TTS播报。
3. 数据与状态层（数据与状态层）：

客户端存储： 利用浏览器 LocalStorage API 持久化关键数据，模拟数据库功能，确保刷新不丢失。
文件处理： 使用 PDF.js 库在浏览器端解析PDF文件内容，模拟RAG中的文档处理步骤。
4. 工具与构建层（工具与构建层）：

构建工具： Vite，提供极速的冷启动、模块热更新（HMR）和优化的生产构建。
开发体验： 支持TypeScript、ESLint，确保代码质量。
PWA支持： 配置了Service Worker，支持离线访问和“安装到桌面”的体验。
5. Nexent 智能体集成（Nexent 集成）：

本项目采用了创新的 Model Context Protocol （MCP） 接入 Nexent 智能体，而非传统的 HTTP API 调用。

协议标准： MCP （Model Context Protocol），实现标准化的 AI 上下文交换。
通信机制： JSON-RPC 2.0。
调用链路： -> -> -> 。前端/BFFMCP ClientDocker Stdio / WebSocketNexent Agent Runtime
使用方法：
本地部署： Nexent Agent 运行在本地 Docker 容器中，无需公网 URL。
双向交互： 通过 MCP 协议，Agent 不仅能回复对话，还能主动请求执行本地工具（如“search_knowledge_base”），获取最新的病理指南或检索相似病例。
隐私安全: 所有交互数据在本地闭环流转，最大程度保护患者隐私。
系统架构图 (概念):

[用户浏览器] <-> [React SPA (Vite构建)] <-> [模拟的AI服务/逻辑] [本地数据 (LocalStorage)] [浏览器原生API (语音、文件)]
agent.json
agent_pathology_knowledge_assistant.json
agent_profile.json
Design_Document.md
docker-compose.yml
eslint.config.js
index.html
NEXENT_INTEGRATION.md
OPTIMIZATION_PLAN.md
package.json
package-lock.json
README.md
tsconfig.json
tsconfig.node.json
vercel.json
VIDEO_DEMO_SCRIPT.md