Skip to content

feat(ai): AIChat 输入框支持 @ 符号选择专家 Agent #259

@hrygo

Description

@hrygo

问题描述

用户需要精确指定特定专家 Agent 处理任务,而非完全依赖自动路由。当前只能通过模式切换按钮选择,缺乏在输入中直接指定的便捷方式。

解决方案

功能范围

包含

  • @ 触发 Agent 选择弹窗(仅显示可提及的专家代理)
  • 支持消息头部/尾部位置插入 @灰灰 / @时巧 标记
  • 支持多 Agent 指定(如 @灰灰 @时巧 查笔记并安排会议
  • 键盘上下键选择 + Enter 确认
  • 鼠标点击选择
  • 选择后 @ 标记显示在输入框

不包含

  • 快捷键(如 @h 快速选择)
  • 智能推荐
  • 历史记录
  • 中间位置插入 @

技术方案

数据来源

GET /api/v1/ai/parrots 动态加载 Agent 列表,过滤规则:

  • 排除AUTO, AMAZING, GEEK, EVOLUTION, GENERAL
  • 保留:配置文件中声明了 self_description 的专家代理

组件结构

ChatInput
  └── AgentMentionPopover
        ├── useParrotsList() hook
        ├── Popover (Radix)
        └── AgentList

交互流程

  1. 用户输入 @
  2. 检测光标位置(头部/尾部?)
  3. [是] → 弹出 Popover,显示可用 Agent 列表
  4. [否] → 正常输入 @
  5. 用户选择 Agent → 插入 @灰灰@时巧
  6. 关闭 Popover,焦点回输入框

多 Agent 解析

function parseMentionedAgents(message: string): {
  agents: string[];
  cleanMessage: string;
}

文件变更

文件 操作 说明
web/src/hooks/useParrotsList.ts 新增 调用 ListParrots API
web/src/components/AIChat/ChatInput.tsx 修改 集成 @ 检测 + Popover
web/src/components/AIChat/AgentMentionPopover.tsx 新增 Agent 选择弹窗组件
web/src/utils/agentMention.ts 新增 解析/位置判断工具函数
web/src/locales/zh-Hans.json 修改 新增翻译
web/src/locales/en.json 修改 新增翻译

复杂度

  • 工作量: 0.7 人周
  • 风险: 低 - 仅涉及前端组件扩展

验收标准

  • make check-all 通过
  • 输入框 @ 触发 Agent 选择弹窗
  • 支持头部/尾部位置插入
  • 支持中文名 (@灰灰) 和英文名 (@memo) 匹配
  • 已更新 i18n 翻译
  • 已测试键盘导航(上下键 + Enter)

依赖项

  • ListParrots API 已就绪 (GET /api/v1/ai/parrots)

调研时间: 2026-02-17 | 版本: v1.0

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions