Skip to content

界面预览

4 屏真实界面,按 v0.1.0 实现版本设计。

在新窗口查看

👉 打开完整预览

预览页面包含:

  • iPhone 14 Pro 框架(375 × 812) 渲染,对齐真实 Android App 的视觉效果
  • 4 屏并排展示:会话列表 / 实时对话 / 设备管理 / 个人中心
  • 关键交互动效:录音脉动、typing 指示器、在线状态点
  • 配色与技术栈说明

预览是纯 HTML + TailwindCSS(CDN 加载)静态页面,可在任意浏览器查看,无需安装。

4 屏要点速查

会话列表

  • project_path 自动分组(折叠/展开记忆每个分组状态)
  • 顶部全局搜索:标题 / 项目路径 / 消息内容三合一
  • 卡片左侧色条 = 用户标记的颜色(v0.1.0 起支持)
  • 长按弹 ActionSheet:收藏 / 取消收藏 / 删除 / 重命名
  • 右下角 FAB「+」:远程新建会话(弹窗可选已有 project_path 或自定义)

实时对话

  • WebSocket 长连接接收 PTY 输出,断网自动重连
  • AI 回复支持 Markdown 渲染 + 代码块语法高亮(highlight.js 内置)
  • 工具调用渲染成卡片:工具名 + 参数 + 输出折叠展开
  • 输入框右侧麦克风按钮:按住 = 录音(红色脉动),松开 = 识别,结果自动填入输入框
  • 长按消息气泡 = 复制单条消息
  • 滚动到底部时自动跟随;向上滚动停止跟随保留阅读位置

设备管理

  • 当前活跃桌面以高亮卡片置顶,显示设备名 / 版本 / 在线状态 / 活跃 PTY 数 / 总会话数 / 延迟
  • 已配对设备列表显示其他桌面,点击切换(前端切换不影响其他桌面连接)
  • 底部「+」按钮 → 进入配对流程(扫码 / 手动 PIN)
  • 长按删除会先调 /api/v1/auth/self-revoke 撤销自己 token,再从列表移除

个人中心

  • 用户头像 + 已配对桌面数 + 移动端版本号
  • AI 回复完成提醒开关 + 测试通知按钮
  • 关于:版本 / 文档 / 开源仓库
  • 危险操作:「清空所有桌面配置」一键 selfRevoke 所有 token + 清空本地存储

与桌面端的版本号差异

当前版本命名空间
桌面端(Windows / macOS / Linux)v3.5.1com.agilefr.tauri
移动端(Android)v0.1.0com.agilefr.tauri.mobile
移动端调试包(开发者本地)0.1.0-debugcom.agilefr.tauri.mobile.debug

调试包与生产包并存

v0.1.0 起,调试包独立 applicationId,开发测试与日常使用可在同一台手机上并存安装,互不覆盖。

下一步

给 AI 编程工具一个统一的家