Files
dudu/design/ui_kits/desktop
wangjia 19281d9c42
ci / server (push) Failing after 10s
ci / design-system (push) Failing after 10s
feat(auth+desktop): 邮箱验证码登录 + 登录窗改版(微信/邮箱双方式,无边框)
后端(协议 → 存储 → 接口,E2E 测试全绿):
- protocol:AuthEmailCodeRequest / AuthEmailRequest DTO
- store:EmailIdentity 表(邮箱唯一索引)+ authmail:* Redis key
- auth/email.go:POST /v1/auth/email/code 发 6 位码(crypto/rand,
  60s 冷却 SetNX,10 分钟 TTL);POST /v1/auth/email 常量时间比对、
  码一次性、邮箱建号(昵称取前缀)→ JWT(与微信登录同响应形态)
- Mailer 接口 + MockMailer(验证码打日志供联调;SMTP 未配置自动降级,
  装配结果入启动日志,上线前须换真实实现)
- TestEmailLogin E2E:发码/冷却 429/错码拒绝/登录/token 可用/码防复用

桌面(Rust 命令 + UI 改版):
- api.rs:login_email_code / login_email(成功保存 token + ws 重连,
  与扫码登录同路径)
- 登录窗改版(原型 LoginPurchase 先行,dark 截图验收):logo + 分段
  切换(微信扫码 / 邮箱登录,与设置页同控件语言)+ 邮箱表单
  (60s 倒计时、错误文案、未注册自动建号提示)
- 二维码真渲染:qrcode 库画 canvas(前景/背景取主题 token),
  替换原 URL 文本占位;过期态半透明化
- 登录窗无边框化:transparent + Overlay 标题栏 + 原生贴形阴影;
  抽公共 WindowFrame 组件(设置窗同步重构复用)

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
2026-07-11 09:40:16 +08:00
..

dudu 桌面端 UI Kit

桌面端(Tauri 2Mac / Windows)四个界面的高保真交互演示,对应 MVP 设计方案 §8.1:

Tab 界面 交互
识别浮层 仿真备忘录窗口 + RecognitionOverlay 按住按钮模拟 ⌘⇧Space:聆听中 → partial 流式 → 松开 final 注入
托盘菜单 常驻菜单栏下拉 hover 高亮(accent 反白)
设置 单页设置窗口 Switch / 麦克风下拉 / 外观切换(驱动整页 Light/Dark)
登录 / 购买 微信扫码 → 选时长包 → 支付 → 完成 点击走完整流程

右上角月亮/太阳切换 Light / Dark;设置中"外观"同样生效(含跟随系统)。

设计要点

  • 浮层:--overlay-bg 深色玻璃(两种模式不变),淡入 + 上移 4px(--dur-base),final 亮 / partial 灰。
  • 一屏一个蓝色主按钮;托盘 hover 用 accent 反白是系统菜单惯例。
  • 设置窗口宽 440,行高紧凑(--control-sm 控件),分组标题 12px。
  • 二维码为占位图案(FakeQr),接入后端 /v1/auth/qr 后替换。

文件

  • index.html — 入口(tabs + 主题状态)
  • DesktopShared.jsx — Lucide 图标子集 · DuduLogo · MacWindow · FakeQr
  • OverlayDemo.jsx — push-to-talk 全流程模拟
  • SettingsTray.jsx — TrayMenu + SettingsWindow
  • LoginPurchase.jsx — 登录/时长包/支付/完成 四步