Skip to content

mm1025048717-hash/smart-qa-v2.0

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

57 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

智能数据问答界面 2.0

基于 PRD 《智能问答界面重构专项》开发的动态分析叙事系统。

📚 文档导航:

🚀 功能特性

核心功能

  • 自然语言问答: 支持多种问答意图识别
  • 动态分析叙事: 流式渲染图文并茂的分析报告
  • 智能组件调用: 根据意图自动选择合适的可视化组件

支持的查询类型

类型 示例问题 组件
单指标查询 "今年销售额是多少" KPI卡片
趋势分析 "近3个月销售趋势" 折线图
维度对比 "各地区销售额对比" 柱状图
构成分析 "销售渠道占比" 饼图
异常检测 "分析销售额异常原因" 多图表组合
预测分析 "预测下月销售额" 预测线图

组件库

  • KPI卡片: 主指标卡片、次要指标卡片、指标组
  • 图表组件: 折线图、柱状图、饼图、年度对比图、面积图、散点图、漏斗图、箱线图、地图、四象限图等
  • 交互组件: 追问按钮、快速问题入口
  • 布局组件: 侧边栏、消息气泡、输入框

数字员工团队

系统内置了多个专业数字员工,每个员工都有独特的专长,可以根据你的需求自动切换或手动选择:

数字员工 专长领域 核心能力 适用场景
Alisa SQL专家 · 理科生 精准SQL查询、结构化数据分析 快速定位字段、生成准确图表
Nora 语义推理 · 文科生 自然语言理解、业务故事化表达 复杂问题理解、多轮追问引导
归因哥 归因分析师 异常诊断、多维度归因分析 问题根因分析、可落地方案
可视化小王 数据可视化专家 最佳图表类型选择 数据故事可视化、图表设计
Emily 指标体系专家 业务指标体系构建、口径定义 KPI定义、指标管理
Lisa 报表分析师 定期报表分析、经营洞察 周报月报、经营分析
预测君 预测分析师 时序预测、趋势分析 业务预测、趋势判断
数据卫士 数据质量专家 数据质量监控、异常检测 数据校验、质量保障
Kevin 增长分析师 用户增长、转化漏斗分析 增长策略、转化优化
运营小美 运营数据分析师 活动效果分析、用户行为洞察 运营决策、活动评估
福尔摩斯 数据侦探 异常追踪、线索链分析 深度调查、问题溯源
水晶球大师 预言家 数据预测、趋势占卜 未来预测、时机判断
Excel忍者 表格专家 透视表、多维交叉分析 数据汇总、快速分析
焦虑分析师 危机感大使 风险预警、压力测试 风险监控、提前预警
Chill哥 佛系数据师 长期趋势分析、淡定解读 宏观分析、长期视角
MC数据 数据说唱歌手 押韵分析、记忆化表达 趣味解读、印象深刻
时光旅人 同环比穿越者 历史数据对比、时间穿越 同比环比、历史对比
数据大厨 指标烹饪师 数据大餐、报表美食 综合分析、报表制作
数据八卦王 业务情报员 内幕消息、部门洞察 业务情报、内部分析

智能切换机制

  • 系统会根据你的问题自动识别最适合的数字员工
  • 支持手动切换数字员工
  • 每个员工都有独特的表达风格和分析视角

📦 技术栈

  • React 18 - UI框架
  • TypeScript - 类型安全
  • Tailwind CSS - 样式系统
  • Framer Motion - 动画效果
  • Recharts - 图表库
  • Lucide React - 图标库
  • Vite - 构建工具

🛠️ 快速开始

安装依赖

npm install

启动开发服务器

npm run dev

构建生产版本

npm run build

🚀 部署到 GitHub Pages 和 Vercel

项目支持部署到 GitHub Pages 和 Vercel。

GitHub Pages 部署

项目已配置 GitHub Actions 自动部署工作流。当你推送代码到 main 分支时,会自动构建并部署到 GitHub Pages。

首次设置

  1. 访问仓库 Settings → Pages
  2. 选择 GitHub Actions 作为部署源
  3. 推送代码到 main 分支即可自动部署

详细说明:请查看 .github/DEPLOYMENT_SETUP.md

部署地址https://mm1025048717-hash.github.io/smart-qa-v2.0/

Vercel 部署(推荐)

Vercel 支持 Serverless Functions,可以安全地处理 API 请求。

快速部署

  1. 访问 Vercel Dashboard
  2. 点击 Add New Project
  3. 导入你的 GitHub 仓库
  4. 配置环境变量 DEEPSEEK_API_KEY
  5. 点击 Deploy

详细说明:请查看 部署指南.md快速部署指南.md

优势

  • ✅ 支持 Serverless Functions(API 路由)
  • ✅ API Key 更安全(存储在服务器端)
  • ✅ 自动 HTTPS 和 CDN
  • ✅ 自动部署(GitHub 推送后自动部署)

📁 项目结构

smart-qa/
├── src/
│   ├── components/        # UI组件
│   │   ├── KPICard.tsx       # KPI卡片组件
│   │   ├── Charts.tsx        # 图表组件
│   │   ├── MessageBubble.tsx # 消息气泡
│   │   ├── ChatInput.tsx     # 输入框
│   │   ├── ActionButtons.tsx # 追问按钮
│   │   └── Sidebar.tsx       # 侧边栏
│   ├── services/          # 业务逻辑
│   │   ├── intentEngine.ts   # 意图识别引擎
│   │   └── mockData.ts       # 模拟数据
│   ├── types/             # 类型定义
│   │   └── index.ts
│   ├── App.tsx            # 主应用
│   ├── main.tsx           # 入口文件
│   └── index.css          # 全局样式
├── public/
├── package.json
└── README.md

🎨 设计规范

色彩系统

  • 主色: #3b82f6 (Primary Blue)
  • 成功: #10b981 (Success Green)
  • 警告: #f59e0b (Warning Orange)
  • 危险: #ef4444 (Danger Red)

组件层级

  • L1 意图: 简单查询 → KPI卡片
  • L2 意图: 分析查询 → 图表 + 文字叙事
  • L3 意图: 深度分析 → 多图表组合

🔄 意图识别映射

系统会根据用户问题中的关键词自动识别意图并选择合适的可视化组件:

// 示例:用户输入 "今年销售额是多少"
// 意图识别结果:
{
  type: 'single_metric',
  level: 'L1',
  suggestedComponents: ['kpi', 'kpi-group', 'line-chart']
}

💡 核心亮点功能

⚡ 实时流式渲染 - 秒回体验

业界领先的实时渲染技术,让数据分析和图表展示实现真正的"秒回"体验。

🎯 核心优势

  • 即时响应:用户提问后立即开始输出,无需等待完整响应
  • 流畅体验:内容逐步呈现,如同真人对话般自然
  • 智能解析:自动识别并渲染图表、表格、KPI 等结构化内容
  • 高性能:支持 1000+ 数据点流畅渲染,无卡顿

🔧 技术架构

1. 流式响应机制

  • 基于 Server-Sent Events (SSE) 技术
  • 与 DeepSeek API 建立持久连接
  • 实时接收数据流,逐块处理

2. 内容解析引擎

  • 使用 parseRealtimeContent() 实时解析
  • 支持嵌套 JSON 解析,自动匹配大括号
  • 智能识别多种内容格式:
    • [chart:{...}] → 图表数据
    • [kpi:{...}] → KPI 卡片
    • [table:...] → 表格数据
    • [choices:...] → 交互选项

3. 渲染优化策略

  • 节流机制:每 100ms 或每 10 个 chunk 更新一次 UI
  • 智能排序:自动识别内容块位置,按顺序渲染
  • 延迟动画:图表组件支持渐进式动画,提升视觉体验

📊 渲染流程

用户提问:"近3个月销售趋势"
    ↓
[0ms] 建立 SSE 连接,开始接收数据流
    ↓
[100ms] 接收到文字内容 → 打字机效果渲染(15ms/字符)
    ↓
[500ms] 检测到 [chart:{...}] → 实时解析 JSON
    ↓
[600ms] 图表数据完整 → 立即渲染折线图(带动画)
    ↓
[800ms] 接收到表格数据 → 实时渲染表格
    ↓
[1000ms] 所有内容渲染完成,用户可立即交互

⚙️ 性能优化

渲染性能

  • ✅ 使用 React 虚拟 DOM 减少重渲染
  • ✅ Framer Motion 硬件加速动画
  • ✅ 支持大量数据点(1000+ 流畅无卡顿)

内存管理

  • ✅ 自动清理过期内容块
  • ✅ 限制历史对话数量(最多 10 轮)
  • ✅ 图表数据懒加载

用户体验

  • ✅ 内容逐步呈现,避免长时间等待
  • ✅ 图表支持渐进式动画
  • ✅ 响应式布局,适配各种屏幕

🤖 DeepSeek AI 智能问答集成

配置 DeepSeek API

  1. 获取 API Key

  2. 配置 API Key

    编辑 src/services/deepseekApi.ts

    const DEEPSEEK_API_KEY = 'your-api-key-here';
  3. 配置代理(开发环境)

    项目已配置 Vite 代理,无需额外配置:

    // vite.config.ts
    proxy: {
      '/api/deepseek': {
        target: 'https://api.deepseek.com',
        changeOrigin: true,
        rewrite: (path) => path.replace(/^\/api\/deepseek/, ''),
      }
    }
  4. 生产环境部署

    需要在后端配置代理或直接调用 DeepSeek API(注意 CORS 限制)

🔄 智能问答交互流程

┌─────────────────┐
│  用户输入问题    │
└────────┬────────┘
         ↓
┌─────────────────────────┐
│ 意图识别引擎             │
│ 自动选择数字员工         │
└────────┬────────────────┘
         ↓
┌─────────────────────────┐
│ 构建对话上下文           │
├─────────────────────────┤
│ • 对话历史(最近10轮)   │
│ • 知识库上下文           │
│ • 用户记忆(偏好/习惯)  │
└────────┬────────────────┘
         ↓
┌─────────────────────────┐
│ 调用 DeepSeek API       │
│ • 流式响应(SSE)        │
│ • 支持联网搜索           │
└────────┬────────────────┘
         ↓
┌─────────────────────────┐
│ 实时解析响应内容         │
│ (每 100ms 更新一次)    │
├─────────────────────────┤
│ • 文本 → 打字机效果     │
│ • [chart:{...}] → 图表  │
│ • [kpi:{...}] → KPI卡片 │
│ • [table:...] → 表格    │
│ • [choices:...] → 选项  │
│ • [switch:...] → 切换   │
└────────┬────────────────┘
         ↓
┌─────────────────────────┐
│ 用户可继续操作           │
│ • 追问                  │
│ • 下钻分析              │
│ • 切换数字员工          │
└─────────────────────────┘

💬 对话上下文管理

智能上下文保持

  • 历史管理:自动维护对话历史(最多保留最近 10 轮对话)
  • 多轮追问:支持上下文理解,无需重复背景信息
  • 意图识别:自动识别用户意图变化,智能切换数字员工

用户记忆系统

  • 指标关注:记录用户关注的核心指标,优先展示
  • 查询模式:学习用户常用查询模式,快速理解意图
  • 问题推荐:生成个性化推荐问题,提升使用效率
  • 偏好保持:跨会话保持用户偏好,越用越懂你

图表输出格式

DeepSeek 返回的图表数据格式:

[chart:{
  "type": "line",
  "title": "近3个月销售趋势",
  "data": [
    {"date": "2024-01", "value": 320},
    {"date": "2024-02", "value": 380},
    {"date": "2024-03", "value": 420}
  ],
  "xKey": "date",
  "yKeys": [{"key": "value", "name": "销售额"}]
}]

支持的图表类型

  • line / line-chart - 折线图(支持多系列、面积填充)
  • bar / bar-chart - 柱状图(支持横向、堆叠)
  • pie / pie-chart - 饼图(支持环形图、百分比显示)
  • area / area-chart - 面积图(支持渐变填充)
  • scatter / scatter-chart - 散点图(支持气泡图、四象限)
  • funnel / funnel-chart - 漏斗图(支持转化率显示)
  • box-plot - 箱线图(支持异常值标注)
  • map / map-chart - 地图(支持热力图、区域分布)
  • quadrant / quadrant-chart - 四象限图(支持象限标注)
  • year-comparison - 年度对比图(支持同比环比)
  • 任何其他类型 - 自动适配渲染(通用渲染器)

图表特性

  • 响应式布局,自动适配屏幕尺寸
  • 支持图表下钻交互
  • 支持图表联动过滤
  • 支持数据导出
  • 支持图表切换(图表/代码视图)

🎨 交互式内容解析

系统支持多种交互组件,让对话更智能:

1. 选择题组件(单选)

[choices:选项A|选项B|选项C]

渲染为可点击的选项按钮,用户只能选择一个选项

1.1. 选择题组件(多选)

[choices-multiple:选项A|选项B|选项C|选项D]

渲染为多选按钮组,用户可以同时选择多个选项

  • 支持显示已选择数量
  • 支持设置最小/最大选择数量限制
  • 提供确认按钮提交选择结果
  • 提供清空按钮重置选择

多选场景示例

请选择您要分析的产品:[choices-multiple:产品A|产品B|产品C|产品D]

高级多选配置(通过 JSON 格式):

[choices:{"options":["选项A","选项B","选项C"],"multiple":true,"minSelections":1,"maxSelections":3,"question":"请选择至少1项,最多3项"}]

2. 快速操作按钮

[actions:查看详情|下钻分析|导出报告]

渲染为操作按钮组

3. 数字员工切换

[switch:归因哥]

点击后自动切换到对应的数字员工

4. KPI 卡片

[kpi:{"label":"销售额","value":1250000,"trend":{"value":12.5,"direction":"up"}}]

实时渲染为精美的 KPI 卡片

5. 表格数据

| 区域 | 销售额 | 增长率 |
|------|--------|--------|
| 华东 | ¥2450万 | +12% |
| 华南 | ¥1890万 | +8% |

自动识别并渲染为表格

🚀 智能图表自动适配

通用图表渲染器

  • 自动识别未知图表类型
  • 根据数据结构智能选择渲染方式
  • 单个数值字段 → 柱状图
  • 多个数值字段 → 折线图/面积图
  • 有 name 和 value → 饼图
  • 其他情况 → 数据表格

参数自动推断

  • 自动识别 xKey(从 date、month、name 等常见字段)
  • 自动识别 yKey/yKeys(从 value、sales、amount 等数值字段)
  • 支持自定义字段名映射

📊 实时数据可视化

流式图表渲染

  • 图表在流式输出过程中即可渲染
  • 支持动画效果和延迟加载
  • 自动适配响应式布局

下钻交互

  • 点击图表数据点可触发下钻分析
  • 自动生成下钻查询
  • 支持多维度下钻

图表联动

  • 多个图表可联动过滤
  • 支持时间范围选择器
  • 支持维度切换

🔍 智能意图识别

自动数字员工切换

  • 根据问题关键词自动识别最适合的数字员工
  • 支持手动切换数字员工
  • 每个员工有独特的表达风格
  • 支持员工推荐(当前员工可推荐其他员工)

意图识别示例

// 用户:"为什么销售额下降了"
// 系统识别 → 切换到"归因哥"数字员工

// 用户:"用图表展示销售趋势"
// 系统识别 → 切换到"可视化小王"数字员工

// 用户:"预测下月销售额"
// 系统识别 → 切换到"预测君"数字员工

意图识别引擎

  • 基于关键词匹配和语义理解
  • 支持模糊查询和同义词识别
  • 自动识别查询类型(单指标、趋势、对比、归因等)
  • 智能推荐可视化组件

💾 用户记忆系统 - 让数字员工越用越懂你

每个数字员工都具备独立的上下文记忆能力,能够学习你的使用习惯,提供越来越个性化的服务。

🧠 智能学习机制

系统通过以下五个维度学习你的使用习惯:

1. 关注指标学习

  • 自动识别你经常查询的指标(销售额、订单量、转化率等)
  • 优先展示相关数据,快速定位关键信息

2. 查询模式学习

  • 记录你的常用查询类型和频率
  • 快速理解你的意图,减少重复提问

3. 维度偏好学习

  • 学习你偏好的分析维度(按地区、按渠道、按时间等)
  • 自动推荐相关分析,提升效率

4. 业务领域学习

  • 识别你关注的业务领域(销售、用户、财务、运营等)
  • 提供针对性建议,聚焦核心业务

5. 行为特征学习

  • 喜欢详细分析 → 提供更深入的数据解读
  • 喜欢图表可视化 → 优先使用图表展示
  • 喜欢快速回答 → 先给结论再展开
  • 经常追问 → 主动提供相关分析选项

📊 记忆数据结构

{
  // 关注的指标
  focusMetrics: ['销售额', '订单量', '转化率'],
  
  // 常用查询(带频率统计)
  frequentQueries: [
    { query: '近3个月销售趋势', count: 15, lastUsed: Date },
    { query: '各地区销售额对比', count: 8, lastUsed: Date }
  ],
  
  // 偏好维度
  preferredDimensions: ['按地区', '按渠道', '同比'],
  
  // 关注领域
  focusAreas: ['销售分析', '用户分析'],
  
  // 最近话题
  recentTopics: ['销售业绩', '用户指标'],
  
  // 行为特征
  traits: {
    preferDetailedAnalysis: true,    // 喜欢详细分析
    preferVisualization: true,        // 喜欢图表
    preferQuickAnswer: false,         // 不喜欢快速回答
    askFollowUp: true                 // 经常追问
  }
}

💾 记忆持久化

  • 本地存储:使用 localStorage 持久化,跨会话保持
  • 自动保存:每次对话后自动保存学习结果
  • 数据导出:支持记忆导出和导入(JSON 格式)
  • 智能清理:自动清理过期记忆(保留最近 20 条常用查询)

🎯 个性化应用

智能推荐问题

  • 基于你的历史查询,推荐你可能感兴趣的问题
  • 在侧边栏显示"你可能想问"

上下文理解

  • 结合你的关注指标和偏好,提供更精准的回答
  • 自动关联相关分析,无需重复提问

风格适配

  • 根据你的行为特征,调整回复风格
  • 详细/简洁、图表/文字,自动匹配

主动建议

  • 在回答中主动提供与你关注领域相关的分析建议
  • 推荐下钻维度、对比分析等

📚 知识库系统 - 数字员工共享的企业知识

🏢 企业知识库(YIWEN_KNOWLEDGE_BASE)

所有数字员工共享一个统一的企业知识库,确保信息一致性和专业性。

知识库内容

类别 内容 示例
产品信息 产品功能、技术架构、核心优势 产品介绍、技术文档
业务知识 行业背景、客户案例、业务场景 行业分析、成功案例
技术原理 NL2LF2SQL、SemanticDB、Logic Form 技术架构、实现原理
业务规则 数据口径、指标定义、分析逻辑 指标定义、计算规则
客户案例 成功案例、应用场景、价值体现 客户故事、ROI 分析

知识库特点

  • 统一管理:所有数字员工共享同一知识库,确保信息一致性
  • 实时更新:知识库可随时更新,所有员工立即生效
  • 上下文注入:每次对话自动将相关知识注入到系统提示中
  • 智能匹配:根据用户问题,自动匹配相关的知识片段

应用示例

场景 1: 产品介绍
用户:"介绍一下产品"
系统:自动从知识库提取产品信息、核心优势、客户案例等
      → 数字员工基于知识库内容,提供专业的产品介绍

场景 2: 竞品对比
用户:"为什么选择你们而不是其他BI工具"
系统:自动匹配知识库中的"核心优势对比"内容
      → 数字员工基于知识库,提供有说服力的对比分析

🤝 记忆与知识库协同

特性 个人记忆系统 企业知识库
作用 个性化服务 标准化知识
内容 使用习惯、偏好 产品信息、业务规则
范围 个人专属 全员共享
更新 自动学习 手动维护
效果 回答更个性化 回答更专业准确

协同工作流程

  1. 用户提问 → 系统从知识库匹配相关知识
  2. 结合个人记忆 → 调整回答风格和重点
  3. 生成个性化回答 → 既专业又符合用户习惯

🌐 实时联网搜索 - 智能触发机制

系统通过多层次的意图识别算法,自动判断用户问题是否需要联网搜索,实现真正的"按需联网"。

🎯 核心特性

  • 智能识别:自动区分内部数据和外部信息需求
  • 按需触发:只在需要时联网,节省资源
  • 无缝整合:搜索结果自动整合到回答中
  • 实时更新:获取最新的市场、行业、政策等信息

🔍 触发机制(四层识别)

第一层:关键词匹配

系统识别以下类型的关键词:

关键词类型 示例关键词 权重
搜索类 搜索、查找、找一下、帮我找、搜一下、查一下、检索 +0.5
最新信息类 最新、最近、当前、现在、实时、今天、本周、本月、今年 +0.2
外部信息类 行业报告、市场报告、研究报告、竞品分析、新闻、资讯、动态、趋势、行情、政策、法规 +0.3
实时数据类 实时数据、最新数据、实时价格、实时行情 +0.2
网络资源类 网站、网页、链接、URL、网址、在线、网络、互联网 +0.2
内部数据类 销售额、订单、用户、客户、指标、SQL、查询、数据库、内部、公司、业务 -0.5

第二层:模式识别

系统识别常见的查询模式:

// ✅ 触发联网的模式
"搜索一下最新的行业报告"        // 搜索 + 外部信息
"最新的市场行情怎么样"          // 最新 + 外部信息
"给我生成一份行业分析报告"      // 报告相关(外部)

// ❌ 不触发联网的模式
"生成公司内部销售报告"          // 明确是内部报告
"我们的销售额是多少"            // 内部数据查询
"查询订单数据"                  // 内部数据查询

第三层:排除机制

智能判断逻辑:

  • 如果问题同时包含外部关键词内部关键词,优先判断为内部数据查询
  • 明确标注"内部"、"公司"、"我们的"等词汇时,不触发联网

第四层:置信度评分

评分规则(总分 0-1 分):

  • 评分 > 0.5 → 触发联网搜索
  • 评分 ≤ 0.5 → 使用本地知识库

⚙️ 技术实现流程

┌─────────────────┐
│  用户输入问题    │
└────────┬────────┘
         ↓
┌─────────────────────────────┐
│ shouldEnableWebSearch()     │
│ 意图识别引擎                 │
├─────────────────────────────┤
│ 1. 关键词匹配                │
│ 2. 模式识别                  │
│ 3. 排除机制检查              │
│ 4. 置信度评分                │
└────────┬────────────────────┘
         ↓
    ┌────────┐
    │ 评分 > 0.5? │
    └────┬───┘
         │
    ┌────┴────┐
    │         │
  是│         │否
    │         │
    ↓         ↓
┌─────────┐ ┌─────────┐
│联网模式  │ │标准模式  │
│(支持搜索)│ │(本地知识)│
└────┬────┘ └────┬────┘
     │          │
     └────┬─────┘
          ↓
┌─────────────────┐
│ 调用 DeepSeek   │
│ API             │
└────────┬────────┘
         ↓
┌─────────────────┐
│ 实时显示搜索状态 │
│ (如果启用联网)   │
└────────┬────────┘
         ↓
┌─────────────────┐
│ 返回结果        │
│ (自动整合搜索)   │
└─────────────────┘

搜索场景示例

场景类型 示例问题 是否联网 说明
市场行情 "最新的市场行情怎么样" ✅ 是 需要实时市场数据
行业报告 "给我一份行业分析报告" ✅ 是 需要外部行业数据
竞品分析 "搜索一下竞品的最新动态" ✅ 是 需要外部信息
政策法规 "最新的政策法规是什么" ✅ 是 需要实时政策信息
内部数据 "我们的销售额是多少" ❌ 否 内部数据,不联网
内部报告 "生成公司内部销售报告" ❌ 否 明确是内部报告
混合查询 "对比我们的销售额和行业平均" ⚠️ 智能判断 可能需要部分联网

联网搜索优势

  • 按需触发:只在需要时联网,节省资源
  • 智能识别:自动区分内部数据和外部信息需求
  • 无缝整合:搜索结果自动整合到回答中,无需手动操作
  • 实时更新:获取最新的市场、行业、政策等信息

📱 移动端适配

响应式设计

  • 完美适配手机、平板、桌面
  • 支持触摸手势操作
  • 移动端优化的交互体验

移动端特性

  • 手势控制页面(实验性功能)
  • 移动端专用测试页面
  • 优化的移动端图表显示

🎯 使用指南

基础使用

  1. 启动项目

    npm install
    npm run dev
  2. 访问应用: 打开浏览器访问 http://localhost:3000

  3. 开始对话

    • 在输入框输入你的问题
    • 系统会自动选择最适合的数字员工
    • 实时看到 AI 的回答和图表渲染

使用示例

示例 1: 单指标查询

用户输入

今年销售额是多少

系统响应

  • 自动切换到 "Emily"(指标体系专家)
  • 实时渲染 KPI 卡片,显示销售额数值
  • 显示趋势对比(同比、环比)
  • 提供追问选项:查看详情、对比分析、下钻维度

示例 2: 趋势分析

用户输入

近3个月销售趋势

系统响应

  • 自动切换到 "可视化小王"(数据可视化专家)
  • 实时渲染折线图,展示月度趋势
  • 自动标注关键数据点
  • 提供交互选项:切换时间范围、对比同期、预测未来

示例 3: 异常归因

用户输入

为什么11月销售额下降了

系统响应

  • 自动切换到 "归因哥"(归因分析师)
  • 实时渲染多维度分析图表
  • 自动下钻到区域、渠道、产品等维度
  • 提供根因分析和改进建议

示例 4: 复杂分析报告

用户输入

全面分析今年业务情况

系统响应

  • 自动切换到 "Nora"(语义推理专家)
  • 流式输出包含:
    • 多个 KPI 卡片(销售额、订单量、利润率等)
    • 多个图表(趋势图、对比图、占比图等)
    • 数据表格(多维度对比)
    • 业务洞察和建议
  • 所有内容实时渲染,无需等待

📋 完整对话场景示例

系统支持各种对话场景,从严肃的业务分析到轻松的生活闲聊,都能智能应对。以下按用户角色分类,帮助你快速找到适合的场景:

👔 高管/决策层场景

场景类型 示例问题 推荐数字员工 系统响应特点 是否联网
战略决策
业务概览 "全面分析今年业务情况" Nora 多图表组合 + 核心洞察
经营分析 "给我一份经营分析报告" Lisa 综合分析报告 + 关键指标
风险评估 "分析一下业务风险" 焦虑分析师 风险矩阵 + 预警建议
市场对比 "对比我们的销售额和行业平均" Nora 对比分析 + 行业数据 ⚠️
快速查询
核心指标 "今年销售额是多少" Emily KPI卡片 + 趋势对比
关键趋势 "近3个月销售趋势" 可视化小王 折线图 + 关键点标注
异常诊断 "为什么11月销售额下降了" 归因哥 多维度分析 + 根因
外部信息
市场行情 "最新的市场行情怎么样" Nora 实时市场数据 + 趋势
行业报告 "生成行业分析报告" Nora 行业数据 + 深度分析
政策影响 "最新的政策法规是什么" Nora 政策解读 + 业务影响

📊 数据分析师场景

场景类型 示例问题 推荐数字员工 系统响应特点 是否联网
数据查询
单指标查询 "今年销售额是多少" Emily KPI卡片 + 趋势对比
趋势分析 "近3个月销售趋势" 可视化小王 折线图 + 关键点标注
维度对比 "各地区销售额对比" 可视化小王 柱状图 + 排序
构成分析 "销售渠道占比" 可视化小王 饼图 + 百分比
排名分析 "各门店业绩排名" Alisa 排名表格 + TOP N
深度分析
归因分析 "分析销售额下降的原因" 归因哥 多维度归因 + 建议
异常检测 "今天有什么数据异常吗" 数据卫士 异常检测 + 预警
下钻分析 "详细看看华东区" 归因哥 下钻图表 + 明细
预测分析 "预测下月销售额" 预测君 预测线图 + 置信区间
同比环比 "对比去年和今年营收" 时光旅人 对比图表 + 增长率
报表生成
周报月报 "生成本月销售月报" Lisa 报表模板 + 数据填充
综合分析 "全面分析今年业务情况" Nora 多图表组合 + 洞察
专业咨询
指标定义 "销售额的口径是什么" Emily 指标定义 + 计算逻辑
数据质量 "数据质量怎么样" 数据卫士 质量报告 + 问题清单
SQL优化 "这个SQL怎么优化" Alisa 优化建议 + 示例
数据治理 "如何做好数据治理" 数据卫士 治理方案 + 最佳实践
技术文档 "搜索一下API文档" Alisa 技术文档 + 示例

🎯 运营/市场人员场景

场景类型 示例问题 推荐数字员工 系统响应特点 是否联网
运营分析
活动效果 "最近活动效果如何" 运营小美 活动数据 + 评估
用户增长 "用户增长情况怎么样" Kevin 增长曲线 + 策略
转化分析 "分析转化漏斗" Kevin 漏斗图 + 转化率
渠道对比 "各渠道效果对比" 可视化小王 对比图表 + 排序
市场研究
市场行情 "最新的市场行情怎么样" Nora 实时市场数据
行业报告 "搜索行业分析报告" Nora 行业报告 + 数据
竞品分析 "查一下竞品的最新动态" 福尔摩斯 竞品信息 + 分析
市场报告 "最新的市场报告" Nora 市场数据 + 趋势

💼 产品/业务人员场景

场景类型 示例问题 推荐数字员工 系统响应特点 是否联网
产品咨询
产品介绍 "介绍一下产品" Nora 产品功能 + 优势
技术架构 "技术架构是什么" Alisa 技术原理 + 架构图
客户案例 "有哪些客户案例" Nora 案例列表 + 价值
竞品对比 "和竞品有什么区别" Nora 对比分析 + 优势
使用帮助 "怎么使用" 当前员工 使用指南 + 示例

😊 日常使用场景

场景类型 示例问题 推荐数字员工 系统响应特点 是否联网
生活闲聊
打招呼 "你好" / "在吗" Nora 友好问候 + 功能介绍
询问身份 "你是谁" 当前员工 自我介绍 + 专长说明
询问能力 "你能做什么" 当前员工 能力介绍 + 示例
开玩笑 "讲个笑话" MC数据 幽默回复 + 数据相关
闲聊 "今天天气怎么样" Nora 友好回应 + 引导业务
感谢 "谢谢" / "辛苦了" 当前员工 礼貌回应 + 继续服务
创意互动
数据说唱 "用说唱的方式分析数据" MC数据 押韵分析 + 节奏感
数据大餐 "给我做一份数据大餐" 数据大厨 创意报表 + 美食比喻
数据八卦 "有什么内部消息" 数据八卦王 业务洞察 + 趣味解读
佛系分析 "淡定地分析一下趋势" Chill哥 长期视角 + 淡定解读
情感支持
工作压力 "工作压力好大" Nora 情感支持 + 数据分析建议
决策困难 "不知道该怎么决策" 归因哥 数据支持 + 决策建议
业务焦虑 "业务数据不好看" 焦虑分析师 风险分析 + 改进建议
需要鼓励 "给我打打气" MC数据 正能量 + 数据激励

📌 场景说明

  • 联网搜索:需要实时外部信息时自动触发
  • 本地处理:基于内部数据和知识库回答
  • ⚠️ 智能判断:系统根据问题内容自动决定是否联网
  • 智能切换:系统会根据问题自动选择最合适的数字员工
  • 上下文记忆:系统会记住你的偏好,提供个性化服务

最佳实践

1. 提问技巧

✅ 好的提问方式

  • "近3个月销售额趋势" - 明确的时间范围和指标
  • "各地区销售额对比" - 明确的维度和对比需求
  • "为什么11月销售额下降了" - 明确的问题和指标

❌ 避免的提问方式

  • "看看数据" - 太模糊,系统会反问确认
  • "分析一下" - 缺少具体对象,系统会提供选项

2. 图表输出优化

在 DeepSeek 的回复中使用图表格式

[chart:{
  "type": "bar",
  "title": "各区域销售额",
  "data": [
    {"name": "华东", "value": 2450},
    {"name": "华南", "value": 1890}
  ],
  "xKey": "name",
  "yKey": "value"
}]

KPI 卡片格式

[kpi:{
  "label": "销售额",
  "value": 1250000,
  "prefix": "¥",
  "unit": "",
  "trend": {
    "value": 12.5,
    "direction": "up",
    "label": "环比上月"
  }
}]

3. 交互组件使用

选择题组件(单选)

[choices:选项A|选项B|选项C]

选择题组件(多选)

[choices-multiple:产品A|产品B|产品C|产品D]

多选模式下,用户可以:

  • 点击多个选项进行选择
  • 查看已选择的数量
  • 点击"确认选择"按钮提交结果
  • 点击"清空"按钮重置选择

操作按钮

[actions:查看详情|下钻分析|导出报告]

数字员工切换

这个问题让 [switch:归因哥] 来分析更专业

多选场景应用示例

  • 产品对比分析请选择要对比的产品:[choices-multiple:产品A|产品B|产品C]
  • 多维度筛选选择分析维度:[choices-multiple:按地区|按渠道|按时间|按产品]
  • 批量操作选择要导出的报表:[choices-multiple:销售报表|库存报表|财务报表]

4. 性能优化建议

  • 图表数据量控制在 1000 条以内,确保流畅渲染
  • 复杂分析分步骤进行,避免一次性输出过多内容
  • 使用下钻功能逐步深入,而不是一次性查询所有维度

故障排除

DeepSeek API 调用失败

问题:无法连接到 DeepSeek API

解决方案

  1. 检查 API Key 是否正确配置
  2. 检查网络连接和代理设置
  3. 查看浏览器控制台错误信息
  4. 确认 API 额度是否充足

图表不显示

问题:图表 JSON 格式正确但不显示

解决方案

  1. 检查 JSON 格式是否正确(注意大括号匹配)
  2. 确认 type 字段是否存在
  3. 确认 data 字段是否为数组且不为空
  4. 检查浏览器控制台是否有错误

实时渲染卡顿

问题:流式输出时界面卡顿

解决方案

  1. 减少单次输出的内容量
  2. 检查是否有大量图表同时渲染
  3. 优化数据结构,减少嵌套层级
  4. 使用浏览器性能分析工具定位瓶颈

配置 DeepSeek API

  1. 获取 API Key

  2. 配置环境变量(推荐)

    复制 .env.example.env

    cp .env.example .env

    编辑 .env 文件,填入你的 API Key:

    VITE_DEEPSEEK_API_KEY=your-api-key-here

    ⚠️ 重要.env 文件已添加到 .gitignore,不会被提交到 Git 仓库。

  3. 生产环境配置

    如果部署到生产环境,需要:

    • 在部署平台(Vercel、Netlify 等)配置环境变量
    • 配置后端代理(避免 CORS 问题)
    • 或使用服务器端调用 DeepSeek API

高级功能

自定义数字员工

编辑 src/services/agents.ts 添加新的数字员工:

{
  id: 'custom-agent',
  name: '自定义员工',
  title: '专业领域',
  badge: '标签',
  description: '员工描述',
  suggestedQuestions: [
    { label: '问题1', query: '查询语句1' },
    { label: '问题2', query: '查询语句2' },
  ],
}

自定义图表类型

系统支持任何图表类型,会自动适配。如果需要自定义渲染逻辑:

  1. src/components/Charts.tsx 中添加新的图表组件
  2. SmartChart 的 switch 语句中添加对应的 case
  3. 或使用通用渲染器自动适配

扩展知识库

编辑 src/services/deepseekApi.ts 中的 YIWEN_KNOWLEDGE_BASE 常量,添加你的业务知识。

📊 成功指标 - 如何衡量产品成功

🎯 核心指标(KPI)

用户活跃度指标

指标 定义 目标值 说明
日活跃用户(DAU) 每天使用系统的独立用户数 > 50% 注册用户 反映产品粘性
周活跃用户(WAU) 每周使用系统的独立用户数 > 70% 注册用户 反映用户留存
月活跃用户(MAU) 每月使用系统的独立用户数 > 80% 注册用户 反映长期留存
用户留存率 次日/7日/30日留存率 次日 > 40%, 7日 > 25%, 30日 > 15% 核心留存指标

使用频率指标

指标 定义 目标值 说明
日均提问次数 每个用户每天平均提问数 > 5 次/天 反映使用深度
会话时长 用户单次使用平均时长 > 5 分钟 反映参与度
会话深度 单次会话平均对话轮数 > 3 轮 反映交互质量
功能使用率 使用图表/KPI/下钻等功能的用户占比 > 60% 反映功能价值

业务价值指标

指标 定义 目标值 说明
问题解决率 用户问题得到满意回答的比例 > 85% 反映产品有效性
图表生成成功率 图表正确渲染的比例 > 95% 反映技术稳定性
平均响应时间 从提问到首次响应的时间 < 2 秒 反映性能体验
用户满意度(NPS) 净推荐值 > 50 反映用户推荐意愿

数据质量指标

指标 定义 目标值 说明
意图识别准确率 数字员工自动切换准确率 > 90% 反映智能程度
图表类型匹配度 推荐图表类型与用户需求匹配度 > 85% 反映推荐质量
知识库命中率 问题能从知识库找到答案的比例 > 70% 反映知识库完整性

📈 监控与评估

实时监控

  • 使用数据分析平台(如 Google Analytics、Mixpanel)实时监控核心指标
  • 设置告警阈值,异常时及时通知

定期评估

  • 周报:每周回顾 DAU、WAU、提问次数等核心指标
  • 月报:每月分析用户留存、满意度、功能使用率等
  • 季度复盘:每季度评估产品目标达成情况,调整策略

成功标准

  • 初期(0-3个月):DAU > 30%,日均提问 > 3 次,问题解决率 > 80%
  • 成长期(3-6个月):DAU > 50%,日均提问 > 5 次,7日留存 > 25%
  • 成熟期(6个月+):DAU > 70%,日均提问 > 8 次,30日留存 > 15%,NPS > 50

🚀 未来规划 - 产品演进路线

📅 短期规划(3-6个月)

1. 数据源扩展

  • 多数据源接入

    • 支持 MySQL、PostgreSQL、MongoDB 等主流数据库
    • 支持 REST API、GraphQL 等接口数据源
    • 支持 Excel、CSV 文件导入
    • 支持实时数据流接入(Kafka、RabbitMQ)
  • 数据源管理

    • 可视化数据源配置界面
    • 数据源连接测试和监控
    • 数据权限管理(按用户/角色)

2. 数字员工生态

  • 员工能力增强

    • 支持自定义数字员工(用户可创建专属员工)
    • 员工能力插件化(可扩展专业技能)
    • 员工协作机制(多员工联合分析)
  • 开放平台(Beta)

    • 数字员工市场(第三方开发者可发布员工)
    • 员工能力 API(开发者可扩展员工功能)
    • 员工模板库(快速创建常见类型员工)

3. 功能增强

  • 高级分析能力

    • 机器学习预测模型集成
    • 异常检测算法优化
    • 多维度关联分析
  • 协作功能

    • 分析报告分享和协作
    • 团队知识库共享
    • 分析结果评论和讨论

📅 中期规划(6-12个月)

1. 企业级功能

  • 多租户支持

    • 企业独立部署
    • 数据隔离和权限管理
    • 企业级安全认证(SSO、LDAP)
  • 高级报表

    • 自定义报表模板
    • 定时报表生成和推送
    • 报表版本管理

2. 智能化升级

  • AI 能力增强

    • 多模型支持(OpenAI、Claude、本地模型)
    • 模型自动切换和负载均衡
    • 本地模型部署(支持私有化部署)
  • 智能推荐系统

    • 基于用户行为的智能问题推荐
    • 异常数据自动发现和提醒
    • 业务洞察自动生成

3. 生态建设

  • 开发者生态

    • SDK 和 API 开放
    • 插件市场
    • 开发者文档和社区
  • 集成能力

    • 与主流 BI 工具集成(Tableau、Power BI)
    • 与办公软件集成(钉钉、企微、飞书)
    • 与数据平台集成(Snowflake、Databricks)

📅 长期愿景(12个月+)

1. 平台化战略

  • 数字员工开放平台

    • 完整的开发者工具链
    • 员工能力标准化和认证体系
    • 员工交易和分成机制
  • 数据智能中台

    • 统一的数据接入和管理
    • 智能数据治理
    • 数据资产化运营

2. 行业解决方案

  • 垂直行业版本
    • 零售行业版(销售分析、库存管理)
    • 金融行业版(风控分析、合规监控)
    • 制造业版(生产分析、质量监控)

3. 技术突破

  • 下一代 AI 能力
    • 多模态理解(文本、图表、语音)
    • 自主学习和进化
    • 跨领域知识迁移

⚠️ 风险预案 - 应对策略

🔴 核心风险识别

1. AI 服务依赖风险

风险描述

  • DeepSeek API 涨价或服务不稳定
  • API 服务商政策变更(限制使用、停止服务)
  • 网络问题导致 API 调用失败
  • API 响应延迟影响用户体验

影响评估

  • 严重性:🔴 高(核心功能依赖)
  • 可能性:🟡 中(服务商政策可能变化)
  • 影响范围:所有用户的核心问答功能

2. 数据安全风险

风险描述

  • 用户数据泄露
  • 敏感业务数据外传
  • API 调用过程中的数据安全

影响评估

  • 严重性:🔴 高(涉及数据安全)
  • 可能性:🟡 中(需要严格的安全措施)
  • 影响范围:所有用户数据

3. 成本控制风险

风险描述

  • API 调用成本随用户增长快速上升
  • 流量费用超出预算
  • 存储成本增加

影响评估

  • 严重性:🟡 中(影响盈利能力)
  • 可能性:🟢 高(用户增长必然带来成本增加)
  • 影响范围:运营成本

🛡️ 风险应对策略(Plan B)

Plan A: 多模型支持(降低单点依赖)

实施步骤

  1. 多模型接入

    // 支持多个 AI 服务商
    const AI_PROVIDERS = {
      deepseek: { api: 'https://api.deepseek.com', priority: 1 },
      openai: { api: 'https://api.openai.com', priority: 2 },
      claude: { api: 'https://api.anthropic.com', priority: 3 },
      local: { api: 'http://localhost:8000', priority: 4 } // 本地模型
    };
  2. 智能切换机制

    • 根据服务可用性自动切换
    • 根据成本优化选择模型
    • 根据响应时间选择最优模型
  3. 负载均衡

    • 多模型并发调用,选择最快响应
    • 按模型成本分配流量
    • 失败自动重试其他模型

时间表:3个月内完成多模型支持

Plan B: 本地模型部署(完全自主可控)

实施步骤

  1. 本地模型集成

    • 支持 Ollama、LM Studio 等本地模型
    • 支持私有化部署(企业内网)
    • 支持模型量化(降低硬件要求)
  2. 混合模式

    • 优先使用本地模型(低成本)
    • 复杂问题回退到云端模型(高质量)
    • 用户可选择使用模式
  3. 成本优化

    • 本地模型:零 API 成本
    • 云端模型:按需使用,控制调用量

时间表:6个月内完成本地模型支持

Plan C: 缓存和优化(降低 API 调用)

实施步骤

  1. 智能缓存

    • 常见问题答案缓存(减少重复调用)
    • 相似问题匹配(复用已有答案)
    • 用户记忆系统(个性化缓存)
  2. 请求优化

    • 批量处理相似问题
    • 压缩请求内容
    • 使用更经济的模型(简单问题用轻量模型)
  3. 成本监控

    • 实时监控 API 调用量和成本
    • 设置成本告警阈值
    • 自动限流和降级策略

时间表:1个月内完成缓存优化

Plan D: 数据安全加固

实施步骤

  1. 数据脱敏

    • 敏感数据自动识别和脱敏
    • 用户可选择数据脱敏级别
    • 本地处理敏感数据(不发送到 API)
  2. 私有化部署

    • 支持完全私有化部署(数据不出内网)
    • 支持混合部署(敏感数据本地,通用数据云端)
    • 支持企业级安全认证
  3. 合规保障

    • 符合 GDPR、等保等合规要求
    • 数据加密传输和存储
    • 审计日志和访问控制

时间表:3个月内完成安全加固

📋 应急预案

场景 1: API 服务突然中断

应对措施

  1. 立即切换:自动切换到备用 AI 服务商
  2. 降级服务:使用本地模型或缓存答案
  3. 用户通知:及时通知用户服务状态
  4. 快速恢复:监控服务恢复情况,自动切回

恢复时间目标(RTO):< 5 分钟

场景 2: API 大幅涨价

应对措施

  1. 成本分析:分析涨价影响和成本结构
  2. 模型切换:切换到更经济的模型
  3. 优化策略:加强缓存和优化,降低调用量
  4. 用户沟通:透明沟通,必要时调整定价

决策时间:1 周内完成评估和切换

场景 3: 数据安全事件

应对措施

  1. 立即响应:停止相关服务,隔离问题
  2. 安全审计:全面检查安全漏洞
  3. 用户通知:及时通知受影响用户
  4. 修复加固:修复漏洞,加强安全措施

响应时间目标(RTO):< 1 小时

📊 风险监控

实时监控指标

  • API 服务可用性(目标:> 99.9%)
  • API 响应时间(目标:< 2 秒)
  • API 调用成本(每日/每月)
  • 错误率和失败率(目标:< 1%)

告警机制

  • API 服务中断 → 立即告警
  • 成本超预算 80% → 提前告警
  • 错误率 > 5% → 告警并自动切换
  • 响应时间 > 5 秒 → 性能告警

📝 License

MIT

About

智能数据问答界面 - 数字员工2.0

Resources

License

Contributing

Stars

Watchers

Forks

Releases

No releases published

Packages

 
 
 

Contributors