BossAgents BossAgents

演示页面使用指南

👤 BossAgents 团队 📅 2026-07-28 👁️ 阅读 6 👍 点赞 0 ☕ 44 分钟阅读

演示页面使用指南

概述

统一演示页面 (public/demo/unified-demo.html) 展示了 BossAgents 与 MTClaw 三层路由架构的性能对比和数字员工功能。通过该页面，用户可以直观地体验不同场景下的执行效果，了解端侧推理加速的优势。

访问方式

  1. 启动所有服务：
   # 启动 BossAgents 服务
   node server.js
   
   # 启动 MTClaw 服务（如果未运行）
   python mtclaw_server.py
   
   # 启动 Ollama 服务（可选，用于端侧推理）
   ollama serve
  1. 打开浏览器访问：
   https://ylxt.chat/demo/unified-demo.html

功能说明

1. 环境状态监控

  • 硬件检测：自动检测 GPU 状态，显示当前运行环境
  • 服务状态：实时监控 MTClaw、Ollama、BossAgents 服务状态
  • 最后检测时间：显示最近一次服务检测的时间

2. 场景切换

  • 场景A (MTClaw + 端侧)：
  • 适用环境：GPU 环境（RTX 3080）
  • 执行流程：确定性操作 → 端侧脚本 (<100ms)，推理任务 → Ollama deepseek-r1:8b
  • 依赖服务：MTClaw + Ollama
  • 场景B (MTClaw + 云端)：
  • 适用环境：无 GPU 环境
  • 执行流程：确定性操作 → 端侧脚本 (<100ms)，推理任务 → 云端 DeepSeek
  • 依赖服务：MTClaw
  • 场景D (无MTClaw 直连)：
  • 适用环境：基准对照模式
  • 执行流程：所有请求 → BossAgents LLM，无端侧加速
  • 依赖服务：BossAgents

3. 数字员工选择

提供8个核心数字员工：

  • 📦 采购助手 (DS-PROC-001)：处理采购请求、询价、订单创建
  • 🏭 供应商管家 (DS-VEN-001)：供应商评审、资质管理、绩效分析
  • 💰 成本优化师 (DS-COST-001)：成本评估、BOM分析、价格优化
  • 🔧 SCSAI创建 (⟦DS-SCSAI-001⟧)：创建Part、BOM、产品对象
  • ✅ ECR审核员 (DS-ECR-001)：工程变更请求审核、流程管理
  • 📄 文档员工 (DS-DATA-001)：文档生成、报告编写、内容整理
  • 🏥 系统健康检查 (DS-SYS-001)：系统状态检测、性能监控
  • 🎨 内容生成 (DS-CONTENT-001)：产品介绍、营销内容、文档撰写

4. 业务意图输入

  • 文本输入框：支持最多500字符的业务意图输入
  • 快捷模板：提供常用业务意图模板
  • 字符计数器：实时显示已输入字符数
  • 输入验证：非空校验、长度限制、XSS防护

5. 执行与结果展示

  • 执行按钮：触发当前场景和员工执行
  • 路由信息：显示 L1/L2/L3 路由层级和耗时
  • 执行结果：展示 AI 返回的业务结果
  • 耗时统计：显示端到端执行总耗时

6. 性能指标对比

  • 三场景对比：并行执行场景A/B/D，对比执行耗时
  • 加速比计算：显示端侧推理相比云端的加速倍数
  • 路由统计：展示 L1/L2/L3 路由命中比例
  • 历史记录：保留最近20次执行记录

7. 服务监控

  • 定时检测：每30秒自动检测服务状态
  • 状态指示：绿色圆点表示服务可用，红色表示不可用
  • 降级建议：根据服务状态提供智能降级建议
  • 自动恢复提示：服务恢复时显示通知

演示流程

标准演示流程

  1. 环境准备：确保所有服务正常运行
  2. 页面访问：打开演示页面，确认所有服务状态正常
  3. 场景选择：根据硬件环境选择合适场景
  • 有 GPU：选择场景A体验端侧加速
  • 无 GPU：选择场景B体验云端推理
  • 基准测试：选择场景D作为对照
  1. 员工选择：点击选择要测试的数字员工
  2. 意图输入：输入业务意图或选择快捷模板
  3. 执行测试：点击"执行当前场景"按钮
  4. 结果分析：查看执行耗时、路由信息、性能指标
  5. 对比测试：点击"三场景对比"按钮进行性能对比

快速演示脚本

// 自动演示脚本（可在浏览器控制台执行）
async function runDemo() {
  console.log('开始演示流程...');
  
  // 1. 切换到场景A
  if (window.switchScene && window.switchScene('A')) {
    console.log('已切换到场景A');
  }
  
  // 2. 选择采购助手
  if (window.selectStaff) {
    window.selectStaff('DS-PROC-001');
    console.log('已选择采购助手');
  }
  
  // 3. 输入业务意图
  const intentInput = document.getElementById('intentInput');
  if (intentInput) {
    intentInput.value = '查询供应商报价和交期';
    console.log('已输入业务意图');
  }
  
  // 4. 执行测试
  setTimeout(() => {
    if (window.handleExecute) {
      window.handleExecute();
      console.log('开始执行测试...');
    }
  }, 1000);
  
  // 5. 等待执行完成，进行三场景对比
  setTimeout(() => {
    if (window.compareThreeScenes) {
      window.compareThreeScenes('查询供应商报价和交期', 'DS-PROC-001');
      console.log('开始三场景对比测试...');
    }
  }, 5000);
}

// 运行演示
runDemo();

故障排查

常见问题

#### 1. 服务连接失败

症状：页面显示"未连接"状态

解决方法：

# 检查 BossAgents 服务
netstat -an | findstr :3006

# 检查 MTClaw 服务
netstat -an | findstr :18790

# 检查 Ollama 服务
netstat -an | findstr :11434

# 重启相应服务

#### 2. 跨域访问错误

症状：浏览器控制台显示 CORS 错误

解决方法：

  • 确认 BossAgents 服务配置了正确的 CORS 头
  • 检查 server/routes/ 下的路由文件是否包含 Access-Control-Allow-Origin: *
  • 重启服务使配置生效

#### 3. 演示页面无法访问

症状：404 错误或空白页面

解决方法：

  • 确认文件路径：public/demo/unified-demo.html
  • 检查静态资源路径是否正确
  • 确认 BossAgents 服务正在运行

#### 4. 性能数据异常

症状：加速比显示异常或路由统计不准确

解决方法：

  • 检查网络连接稳定性
  • 确认各服务响应时间正常
  • 查看浏览器控制台日志分析问题
  • 验证 MTClaw 路由配置是否正确

#### 5. L1 命中率低

症状：简单请求仍走 L3 路由

解决方法：

  • 检查 MTClaw 工具配置
  • 验证意图关键词是否匹配 L1 规则
  • 查看 MTClaw 日志分析路由决策

调试技巧

  1. 查看控制台日志：
  • 按 F12 打开开发者工具
  • 查看 Console 标签页中的日志
  • 关注 [ServiceMonitor]、[SceneSwitch]、[StaffExecute] 等标签
  1. 网络请求分析：
  • 查看 Network 标签页中的请求响应
  • 检查 API 调用是否成功
  • 分析请求耗时和响应数据
  1. 性能监控：
  • 使用 Performance 标签页记录性能数据
  • 查看关键操作的耗时分布
  • 分析渲染性能瓶颈

API 接口文档

1. 环境检测接口

// 检测服务状态
GET https://ylxt.chat/api/digital-staff/mtclaw/stats
GET http://localhost:11434/api/tags
GET https://ylxt.chat/

2. 数字员工执行接口

// 通过 MTClaw 路由执行
POST https://ylxt.chat/api/digital-staff/run
Content-Type: application/json
{
  "staffId": "DS-PROC-001",
  "intent": "业务意图",
  "parameters": {},
  "force_edge": true,    // 场景A：强制端侧
  "force_cloud": true,   // 场景B：强制云端
  "skip_mtclaw": true    // 场景D：跳过 MTClaw
}

// 直接调用 MTClaw
POST http://localhost:18790/v1/chat/completions
Content-Type: application/json
{
  "model": "mtclaw-router",
  "messages": [{"role": "user", "content": "业务意图"}],
  "stream": false
}

3. 性能数据接口

// 获取执行历史记录
localStorage.getItem('demo_performance_history')

// 获取当前场景配置
window.ENV.sceneConfigs

// 获取员工列表
window.STAFF_LIST

配置说明

服务端口配置

  • BossAgents: 3006
  • MTClaw: 18790
  • Ollama: 11434

环境变量

# BossAgents 配置
PORT=3006
API_BASE_URL=https://ylxt.chat

# MTClaw 配置
MTCLAW_URL=http://localhost:18790/v1

# Ollama 配置
OLLAMA_URL=http://localhost:11434

演示页面配置

演示页面使用以下配置：

  • API 地址: https://ylxt.chat
  • 检测间隔: 30秒
  • 执行超时: 30秒
  • 历史记录限制: 20条

扩展开发

添加新的数字员工

  1. 在 staff-manager.js 中注册新员工
  2. 在演示页面的 STAFF_LIST 数组中添加员工信息
  3. 配置员工图标、描述和执行逻辑

添加新的场景

  1. 在 ENV.sceneConfigs 中添加场景配置
  2. 实现场景对应的执行逻辑
  3. 更新场景切换和可用性检查函数

自定义性能指标

  1. 修改 addExecutionRecord 函数添加自定义指标
  2. 更新 getPerformanceMetrics 函数计算新指标
  3. 调整 updateMetricsPanel 函数展示新指标

联系支持

如遇问题，请参考以下资源：

  1. 项目文档：docs/README.md
  2. API 文档：docs/api-reference.md
  3. 问题反馈：项目 Issue 页面

或联系开发团队获取技术支持。

← 返回案例列表
分享：
🤖 Try Now →
🤖
🎁