mirror of
https://github.com/qingchencloud/clawpanel.git
synced 2026-06-03 14:49:49 +08:00
feat(ux): 小白 UX 全面改造 - 错误友好度 + 致命操作强确认 + 空状态 + 新手引导 + 术语表
面向小白用户的产品定位重塑,从七大 UX 痛点逐一改造:
## U1 错误友好度(59 处改造)
- 新工具 src/lib/humanize-error.js:自动把后端原始错误(fetch failed、ENETUNREACH、ENOENT 等)
映射成「主行 + hint 行动建议 + 折叠技术详情」三段式结构化对象
- toast 组件升级支持 { message, hint, raw } 结构化入参,向后完全兼容
- 14 个 page 文件中所有 toast(t('xxx.failed') + ': ' + e, 'error') 替换为 toast(humanizeError(e, t(...)), 'error')
- common.js 加 error.* / errorHint.* 共 13 个新 i18n 键(11 语言):
网络/Gateway 未启动/命令缺失/权限/超时/限流/未找到/鉴权/服务繁忙/通用
## U2 致命操作强确认(14 处改造)
- showConfirm 升级支持结构化对象 { message, impact[], title, confirmText, cancelText, variant }
- 加 .modal-impact-list 红边样式(让小白看清楚删了会丢什么)
- 14 处致命操作改造,每处显示影响列表 + 红色「删除/移除/重置」按钮 + 灰色「保留」取消:
· agents.js 删除 Agent(动态显示 N 个绑定影响)
· channels.js 移除平台(动态算 N 个 binding)+ 移除 Agent binding
· memory.js 删除记忆文件
· services.js 卸载 Gateway(3 段影响)+ 删除备份
· models.js 批量删模型
· chat.js 删除会话 + 重置会话
· dreaming.js 重置梦境日记 + 清空 grounded 短期记忆
· agent-detail.js 解除渠道绑定
· cron.js 删除任务(OpenClaw + Hermes 两端)
- skills.js 原生 confirm() 改 showConfirm
- hermes-cron.js 原生 confirm() 改 showConfirm,顺手修末尾多余 `}` 的 syntax 残留
## U3-C 空状态 emoji+CTA(5 页面)
- 通用 .empty-state 组件(大 emoji + 标题 + 副本 + CTA 按钮 + 紧凑变体)
- agents.js: 🤖 + 「+ 新建 Agent」CTA
- memory.js: 🧠 + 「+ 新建记忆文件」CTA(紧凑版)
- cron.js: ⏰ + 「+ 新建任务」CTA
- skills.js: 🛠️ + 「技能商店」CTA(点击切 Tab)
- channels.js: 💬 + 紧凑提示
- CTA 巧妙复用页面顶部已有按钮的 click,零重复逻辑
## U3-B Dashboard 新手任务卡片
- 蓝紫渐变卡片,4 步任务自动检测:启动 Gateway / 添加模型 / 创建 Agent / 第一次聊天
- 已完成:✓ 徽章 + 删除线 + 60% 透明
- 未完成:编号徽章 + 蓝色 CTA 按钮跳对应页面
- 全部完成 → 庆祝条「🎉 全部搞定!」+ 关闭按钮
- localStorage 标记,用户主动关闭后永久隐藏
- 14 个新 i18n 键,文案小白化(Gateway 是「发动机」/ Agent 是「分身」/ 模型给 AI 装「大脑」)
## U3-A 术语表页(/glossary)
- 25 个核心术语 × 4 大分类(核心 8 / 模型 6 / 接入 5 / 进阶 6)
- 搜索框实时过滤 + Tab 切换分类 + 卡片网格布局
- 每条术语:「比喻 + 一句话」描述(避免循环引用)+ 「打开页面 →」CTA 直达配置
- 3 语言(zh-CN / en / zh-TW)完整翻译,其他 8 语言 fallback
- 双引擎(OpenClaw + Hermes)共用路由
- dashboard quick-actions 加「📖 面板术语」入口
## U3-D 术语 ⓘ tooltip
- 通用 src/lib/term-tooltip.js helper:termHelpHtml(id) + attachTermTooltips(root)
- 8 个高频术语精简表(OAuth / Webhook / Bot Token / API Key / Token / Context Window / Binding / Scope)
- channels.js 字段 label 智能匹配关键词自动追加 ⓘ(覆盖 8 个渠道全部敏感字段)
- models.js 添加/编辑 provider 的 API Key label 也加 ⓘ
- 点 ⓘ → 弹小型 modal 含解释 + 「打开术语表 →」CTA
- attachTermTooltips 内部去重,可安全多次调用
## 累计交付
- 4 个新文件(humanize-error.js / term-tooltip.js / glossary.js page / glossary.js i18n)
- 6 个升级文件(toast / modal / components.css / dashboard / channels / models)
- 14 个 page 错误 toast 友好化(59 处)
- 14 处致命操作强确认
- 5 处空状态升级 + Dashboard 新手卡片 + 术语表 + ⓘ tooltip
- 109 个新 i18n 键(11 语言)
- Build 全程通过
This commit is contained in:
@@ -181,6 +181,11 @@ export default {
|
||||
addChannelBinding: _('添加渠道绑定', 'Add Channel Binding', '新增頻道綁定'),
|
||||
enableChannelFirst: _('请先在「渠道列表」中接入并启用至少一个渠道', 'Please connect and enable at least one channel in "Channel List" first', '請先在「頻道列表」中接入並啟用至少一個頻道'),
|
||||
confirmRemoveBinding: _('确定移除该绑定?', 'Remove this binding?', '確定移除該綁定?'),
|
||||
removeBindingTitle: _('移除 Agent 绑定', 'Remove Agent binding', '移除 Agent 綁定', 'Agent 連携を削除', 'Agent 연결 제거', 'Xoá liên kết Agent', 'Eliminar vinculación de Agent', 'Remover vínculo de Agent', 'Удалить привязку Agent', 'Supprimer la liaison Agent', 'Agent-Verknüpfung entfernen'),
|
||||
removeBindingBtn: _('移除', 'Remove', '移除', '削除', '제거', 'Xoá', 'Eliminar', 'Remover', 'Удалить', 'Supprimer', 'Entfernen'),
|
||||
removeBindingCancel: _('保留', 'Keep', '保留', '保持', '유지', 'Giữ lại', 'Conservar', 'Manter', 'Оставить', 'Conserver', 'Behalten'),
|
||||
removeBindingImpactAgent: _('该 Agent 将不再通过此渠道接收消息', 'The Agent will stop receiving messages from this channel', '該 Agent 將不再透過此頻道接收訊息', 'この Agent はこのチャンネルからメッセージを受信しなくなります', '이 Agent는 이 채널을 통한 메시지 수신을 중지합니다', 'Agent sẽ không nhận tin nhắn qua kênh này nữa', 'El Agent dejará de recibir mensajes por este canal', 'O Agent deixará de receber mensagens por este canal', 'Agent перестанет принимать сообщения по этому каналу', 'L\u2019Agent ne recevra plus de messages via ce canal', 'Der Agent erhält keine Nachrichten mehr über diesen Kanal'),
|
||||
removeBindingImpactConfig: _('渠道平台本身的配置和凭证会被保留', 'The channel platform configuration and credentials will be kept', '頻道平台本身的設定和憑證會被保留', 'チャンネルプラットフォーム自体の設定と認証情報は保持されます', '채널 플랫폼 자체의 설정과 자격 증명은 유지됩니다', 'Cấu hình và thông tin xác thực của nền tảng kênh sẽ được giữ lại', 'La configuración y credenciales de la plataforma del canal se conservarán', 'A configuração e credenciais da plataforma do canal serão mantidas', 'Конфигурация и учётные данные платформы канала будут сохранены', 'La configuration et les identifiants de la plateforme du canal seront conservés', 'Konfiguration und Anmeldedaten der Kanalplattform bleiben erhalten'),
|
||||
bindingRemoved: _('绑定已移除', 'Binding removed', '綁定已移除'),
|
||||
addBindingForAgent: _('为 {agent} 添加渠道绑定', 'Add channel binding for {agent}', '為 {agent} 新增頻道綁定'),
|
||||
channel: _('渠道', 'Channel', '頻道'),
|
||||
@@ -195,6 +200,12 @@ export default {
|
||||
enabled: _('已启用', 'Enabled', '已啟用'),
|
||||
operationFailed: _('操作失败', 'Operation failed', '操作失敗'),
|
||||
confirmRemovePlatform: _('确定移除该平台及其所有配置?', 'Remove this platform and all its config?', '確定移除該平台及其所有設定?'),
|
||||
removePlatformTitle: _('移除平台「{name}」', 'Remove platform "{name}"', '移除平台「{name}」', 'プラットフォーム「{name}」を削除', '플랫폼「{name}」 제거', 'Xoá nền tảng "{name}"', 'Eliminar plataforma "{name}"', 'Remover plataforma "{name}"', 'Удалить платформу "{name}"', 'Supprimer la plateforme "{name}"', 'Plattform "{name}" entfernen'),
|
||||
removePlatformBtn: _('移除', 'Remove', '移除', '削除', '제거', 'Xoá', 'Eliminar', 'Remover', 'Удалить', 'Supprimer', 'Entfernen'),
|
||||
removePlatformCancel: _('保留', 'Keep', '保留', '保持', '유지', 'Giữ lại', 'Conservar', 'Manter', 'Оставить', 'Conserver', 'Behalten'),
|
||||
removePlatformImpactBindings: _('解除该平台关联的 {n} 个 Agent 绑定', 'Unbind the {n} Agent binding(s) linked to this platform', '解除該平台關聯的 {n} 個 Agent 綁定', 'このプラットフォームに紐づく {n} 件の Agent 連携を解除', '이 플랫폼과 연결된 {n}개 Agent 연결을 해제', 'Huỷ {n} liên kết Agent gắn với nền tảng này', 'Se desvincularán los {n} Agent vinculados a esta plataforma', 'Serão removidas as {n} vinculações de Agent ligadas a esta plataforma', 'Будут отменены {n} привязок Agent к этой платформе', 'Les {n} liaisons d\u2019Agent associées à cette plateforme seront supprimées', '{n} Agent-Verknüpfungen mit dieser Plattform werden aufgehoben'),
|
||||
removePlatformImpactConfig: _('该平台的配置和凭证将被删除', 'Platform configuration and credentials will be deleted', '該平台的設定和憑證將被刪除', 'プラットフォームの設定と認証情報が削除されます', '플랫폼 설정과 자격 증명이 삭제됩니다', 'Cấu hình và thông tin xác thực của nền tảng sẽ bị xoá', 'La configuración y las credenciales de la plataforma serán eliminadas', 'A configuração e credenciais da plataforma serão excluídas', 'Конфигурация и учётные данные платформы будут удалены', 'La configuration et les identifiants de la plateforme seront supprimés', 'Konfiguration und Anmeldedaten der Plattform werden gelöscht'),
|
||||
removePlatformImpactStop: _('Gateway 重启后该平台将停止接收消息', 'After Gateway restart, this platform will stop receiving messages', 'Gateway 重啟後該平台將停止接收訊息', 'Gateway 再起動後、このプラットフォームはメッセージの受信を停止', 'Gateway 재시작 후 이 플랫폼은 메시지 수신을 중지', 'Sau khi khởi động lại Gateway, nền tảng này sẽ ngừng nhận tin nhắn', 'Tras reiniciar el Gateway, esta plataforma dejará de recibir mensajes', 'Após reiniciar o Gateway, esta plataforma deixará de receber mensagens', 'После перезапуска Gateway эта платформа перестанет принимать сообщения', 'Après le redémarrage du Gateway, cette plateforme cessera de recevoir les messages', 'Nach Gateway-Neustart wird diese Plattform keine Nachrichten mehr empfangen'),
|
||||
supportsActions: _('支持操作', 'Supports actions', '支援操作'),
|
||||
connectedClickEdit: _('已接入,点击编辑', 'Connected, click to edit', '已接入,点擊編輯'),
|
||||
qqDiagAllPassed: _('全部检查通过 ✓', 'All checks passed ✓', '全部檢查通過 ✓'),
|
||||
|
||||
Reference in New Issue
Block a user