AI Voice Platform 文档

外观

callout-webpage ​

系统二：智能外呼与协同系统前端（Quasar 2.21.x + @quasar/app-vite 3.x + Vue 3 + TypeScript）。它调用 apps/callout-server，覆盖外呼调度、流程脚本、Ollama NLU、 坐席协同、转人工和质检闭环等运营能力。

功能 ​

  • 概览仪表盘（OverviewStatsGrid）：活动 / 联系人 / 呼叫尝试数量，以及接通率、完成率、失败率和平均通话时长。
  • 活动管理（CampaignsTablePanel / CampaignEditorPanel / CampaignFormFields）：创建 / 编辑活动，选择一条或多条外呼线路，设置业务、任务并发、重试、工作时段、计划起止窗口、主叫号码，并启动 / 暂停自动调度器；任务 completed 在页面显示为“已结束”，表示当前无待调度联系人，不等于所有联系人均接通成功。
  • 流程脚本（FlowScriptsPage）：可视化编排话术、变量、节点、NLU 分支、字段抽取和结果归类；活动通过 script_id 绑定脚本，运行时由 callflow-esl 的 callout-flow-business 执行。
  • 线路管理（LinesPage）：维护外呼线路、拨号串模板、默认主叫号码和共享线路并发，并支持号码分配模式（一号多并发 / 号码池轮换 / 一号一并发）与线路号码池维护。
  • 活动详情（CampaignDetailPanels）：查看单个活动的联系人、呼叫尝试和派发批次；支持导入联系人、手动派发、重试、编辑 / 删除联系人。
  • 呼叫明细 / 详情（CallAttemptsPage / CallDetailsPage）：按意向等级 / 分类筛选的分页呼叫尝试列表，以及单次通话详情与录音回放（用 /api/media/config 下发的 baseUrl 拼接 recordingUrl 短文件名播放）；通话后情绪分析结果通过 EmotionAnalysisSummary / EmotionAnalysisDetail 以极性 + 分数 + 文本 / 音频原始结论展示。
  • 外呼策略：全局 / 任务级禁呼日期、可呼时段、号码规则、频控、重试和并发限制管理。
  • 运营监控（MonitorPage）：实时并发、调度批次、卡住联系人、近 1 分钟提交 / 失败与运行事件告警（SSE）。
  • 实时作战大屏（ShowcasePage）：面向运营 / 演示的实时大屏，聚合运行态势（ShowcaseHeroStatus）、通话流时间线（CallFlowTimeline）、坐席状态墙（AgentStatusWall）、进行中转人工会议看板（LiveConferenceBoard）、线路与任务容量、实时运行事件。
  • 转人工会议监控（ConferenceSessionsPanel / ConferenceSessionDetailDialog / LiveConferenceBoard）：查看进行中的转人工会议及成员腿，支持盲转 / 协商转目标坐席、主管监听 / 插话、移除成员，并显示 FreeSWITCH 实时成员数与在会状态。
  • 坐席工作台（AgentWorkspacePage）：统一展示示闲 / 忙碌 / 离线三态；普通坐席仅能修改本人状态，主管和管理员可修改全部坐席。顶部栏同步显示当前用户绑定坐席的状态；只有示闲坐席参与分配。
  • 合规与数据（ComplianceDataPage）：DNC 免打扰名单管理。
  • 号码导入：向非运行中任务粘贴号码，或同步导入最大 5 MiB、最多 10,000 行的 CSV/TSV，并即时展示逐行错误。
  • 系统管理（SystemAdminPage）：用户与角色、操作审计。
  • 登录与鉴权：登录页使用独立 AuthLayout（无侧边栏）；callout-server 下发的 permissions 决定侧边栏、路由与按钮的可见性（@/stores/auth.ts 的 can()），未授权访问跳转 /403，未登录跳转 /login。
  • 统一日期时间选择器（DateTimePickerInput，基于 @vuepic/vue-datepicker，由 @/boot/vue-datepicker.ts 注册）：贯穿活动计划窗口（datetime）与工作时段（time）、策略可呼时段、坐席回访时间、合规等所有日期 / 时间 / 时段输入。支持手动输入 + 掩码 + 合法性校验，并提供日历 / 时间面板选择（datetime / datetime-local-minute / date / time 四种模式）。

手动派发批次大小只是一次提交请求的期望数量。实际提交数量仍会同时受所选活动剩余并发槽位和绑定线路池剩余共享槽位限制。

开发 ​

bash
bun install          # 或：npm install
bun run dev          # quasar dev — http://localhost:19920
bun run build        # quasar build → dist/spa
bun run test         # Bun 单元测试
bun run lint         # oxfmt + oxlint --fix
bun run lint:check   # oxfmt --check + oxlint
bun run typecheck    # vue-tsc --noEmit

源码结构 ​

  • src/pages/：文件路由页面和页面级业务编排；复杂流程编辑器的纯模型放在相邻的 pages/flow-scripts/ 中。
  • src/components/：可复用展示与交互组件；来电弹窗、通话台分区和会议详情均不直接访问后端。
  • src/composables/：跨组件状态与业务控制器，包括共享 SIP 实例、活动编辑器、导入和离页保护。
  • src/services/：后端契约和 HTTP/SSE 边界。api.ts 保存 callout-server 响应类型，领域接口可按软电话等模块继续拆分。
  • src/stores/：登录态、全局参考数据及当前坐席状态。
  • src/types/、src/utils/：无组件生命周期依赖的 UI 类型与纯函数，优先通过 Bun 单元测试覆盖。

流程编辑器使用 flow-editor-types.ts 统一页面与属性面板的视图模型，并通过 flow-editor-model.ts 对历史脚本或外部 JSON 做运行时收窄。浏览器软电话遵循 “SIP 状态、全局编排、来电展示”分层；刷新/关闭保护由单一全局监听器汇总所有活跃 会话，避免软电话总览页为每张坐席卡片重复注册浏览器事件。

开发服务器端口是 19920（quasar.config.ts → devServer.port）。路由使用 hash 模式，并已启用 filenameBasedRouting：

  • 路由文件入口保留在 src/router/index.ts，鉴权守卫和 / -> /overview 跳转仍在这里维护。
  • 实际页面路由来自 src/pages/ 目录结构，不再维护 src/router/routes.ts。
  • 源码 import 统一使用 @/，不再使用 src/、components/、stores/ 等旧别名。

配置 ​

环境变量默认值用途
VITE_CALLOUT_API_BASE_URLhttp://127.0.0.1:9920（由 quasar.config.ts 的 build.defineEnv 注入）callout-server 管理 API 基址；默认直连本地 9920
VITE_SOFTPHONE_SERVICE_NUMBER5020坐席通话台默认拨打的业务号；页面输入框可临时覆盖

自定义 env 类型定义在项目根目录 env.d.ts。所有普通 JSON 请求都经过 @/api/index.ts，由它注入鉴权并解包 callout-server 返回的 { code, data, msg }；具体端点按领域拆分在 @/api/ 目录。

VITE_CALLOUT_API_BASE_URL 在构建期注入，地址必须能被最终用户的浏览器访问， 不能填写只有构建主机可访问的地址。在本项目目录中使用 Bash 构建：

bash
VITE_CALLOUT_API_BASE_URL=http://<callout-api-host>:<port> bun run build

在 PowerShell 中构建：

powershell
$env:VITE_CALLOUT_API_BASE_URL = 'http://<callout-api-host>:<port>'
bun run build
Remove-Item Env:VITE_CALLOUT_API_BASE_URL

构建产物位于 dist/spa/。未设置变量时使用默认值 http://127.0.0.1:9920；API 地址变化后必须重新构建，修改静态文件托管服务的 运行时环境变量不会改变已经生成的前端产物。

浏览器软电话的分机、密码、Realm 与 WS/WSS 地址全部取坐席配置；业务号默认取 VITE_SOFTPHONE_SERVICE_NUMBER，坐席可在通话台手动改写本次呼叫目标。

这些默认值现在集中维护在 quasar.config.ts，避免 README、类型注释和页面源码各自维护不同口径。

文档与代码在同一仓库维护，现有 Markdown 是唯一内容源。

AI Voice Platform