MailUI4Agents

jianf/MailUI4Agents

Fork 0

Commit Graph

Author	SHA1	Message	Date
JianFeeeee	0a4b98144c	feat(webui): 通信二级页签与列表头一体 + 沉浸式（PWA 全屏）+ 日历滑动验收脚本用户三条（同一线索）：「通信页面的二级页面与其他位置极其割裂」、「不支持沉浸式网页」、「日历页面还不支持左右滑动手势」。 ## ① 二级页签不再割裂页签原先是带 shadow 的白色胶囊浮在面板上，看起来像硬贴上去的另一套控件。改成下划线页签：与列表头同一内边距、同一条下边框，选中态用蓝色下划线 + `-mb-px` 压住分隔线（否则会出现"两条线"的接缝）。 ## ② 沉浸式根因不是 viewport（`viewport-fit=cover` 早就有了，安全区也接了 `env(safe-area-inset-)`），而是没有 Web App Manifest：手机上"添加到主屏幕"后打开仍然是带地址栏的网页。现在加了 `manifest.webmanifest`（`display: standalone`） + iOS 的 `apple-mobile-web-app-capable` / `black-translucent`（状态栏内容叠在页面上）。 manifest 放在根路径而不是 /assets/ 下：它里面的 `start_url`/`scope` 是相对 manifest 自己的 URL 解析的，挂在 /assets/ 下就得写 "../"。静态只挂了 `/` 与 `/assets/`，所以显式加了一条路由（并从 embed 读，而不是读磁盘 —— 前端产物必须与应用同源同版本）。图标由项目唯一图标源生成 192/512（尺寸与声明一致，我用 struct 读文件头核对过）。实测：`/manifest.webmanifest` → HTTP 200 `application/manifest+json`。 ## ③ 日历滑动：补上真正的验收脚本 `test/manual/calendar-swipe-verify.mjs` 四条，含反向对照（纵向拖动不得翻页）与前置断言。写它时又踩了一次自己的坑：标题真实格式是「2026 年 9 月」（数字与"年月" 之间有空格），我第一版正则按无空格写 ⇒ 匹配不到 ⇒ 三个值全是 null，看起来像"滑动没生效"，其实是探针瞎了。所以脚本里第一条就是"标题读得到"。实测：9 月 →左滑→ 10 月 →右滑→ 9 月，纵向拖动不动。 ## 顺带把我为验收造的测试数据归档（不是删除）：10 个 `/tmp/scrollprobe-*` 独立会话 + 12 封"滚动验收/窄屏验收样例"邮件。	2026-09-14 11:07:03 +08:00
JianFeeeee	a404cbad54	feat(branding): 确定项目图标，并接入 Web / Electron / HarmonyOS # 唯一源 `client/electron/src/icons/agentmail.svg` 是图标唯一源（24×24 视图框，`currentColor` 跟随文字色）。此前各端用的都是占位物：Electron 的窗口/托盘指向一个不存在的 `src/icons/tray-icon.png`（`nativeImage` 拿到空图，托盘不可见）， HarmonyOS 的 `startIcon/foreground/background` 是 1×1 PNG， Web 端根本没有 favicon。 # 为什么带生成脚本 PNG/ICO 是二进制的，换一次配色要重出十几个尺寸，手工做必然出现「Web 是旧的、Harmony 是新的」这种不一致，而且没人能复核。 `generate.py` 只认上面那一份源，所有变体都由它推导（本机无 rsvg/ImageMagick，用 cairosvg + Pillow）。改图标只需改源文件再跑一次脚本。 # 各端产物 - Web：`public/assets/{agentmail.svg,favicon.ico,apple-touch-icon.png}` + `index.html` 引用。放 `assets/` 下而非根目录，是因为 Gateway 只把 `/assets/` 与 `/` 交给静态处理器（`server/cmd/server/main.go`），放根下会 404。已实测本机与 LAN 均 200。 - Electron：应用图标 `icon.png`(512) / `icon.ico`(16–256) / 各尺寸 PNG / 托盘 `tray-icon.png`(32)，`package.json` 里 `win.icon` 与 `linux.icon` 指过去。托盘用品牌色字形而非白色 —— 浅色面板下白色会消失。 - HarmonyOS：`startIcon.png`(512) 用完整应用图标（启动页底色浅 `#FFF` / 深 `#000`，白底蓝图标两套都立得住）；分层图标的 `background` 是品牌色整块、 `foreground` 是白色字形并留 12% 安全区，避免被系统圆角裁掉。 - 应用内*：新增 `BrandMarkIcon`（fill 型，与现有描边图标集不同族），替换登录页与初始化页品牌位的占位 `MailboxIcon`；后者已无引用，一并删除。图标色 `#2563eb` 与门户 Dashy 主题主色一致。 # 验证 - 前端 typecheck 与 196 项测试全绿；`npm run build` 产物含三个图标文件 - Gateway 重新部署后 `/assets/{agentmail.svg,favicon.ico,apple-touch-icon.png}` 在本机与 `192.168.2.60:8180` 都返回 200，Content-Type 正确 - 所有 PNG/ICO 用 Pillow 复核尺寸与 alpha 边界（合成失败会表现为全透明，已用 getbbox 排除）	2026-09-11 15:49:41 +08:00

Author

SHA1

Message

Date

JianFeeeee

0a4b98144c

feat(webui): 通信二级页签与列表头一体 + 沉浸式（PWA 全屏）+ 日历滑动验收脚本

用户三条（同一线索）：「通信页面的二级页面与其他位置极其割裂」、
「不支持沉浸式网页」、「日历页面还不支持左右滑动手势」。

## ① 二级页签不再割裂

页签原先是**带 shadow 的白色胶囊**浮在面板上，看起来像硬贴上去的另一套控件。
改成**下划线页签**：与列表头同一内边距、同一条下边框，选中态用蓝色下划线 +
`-mb-px` 压住分隔线（否则会出现"两条线"的接缝）。

## ② 沉浸式

根因不是 viewport（`viewport-fit=cover` 早就有了，安全区也接了
`env(safe-area-inset-*)`），而是**没有 Web App Manifest**：手机上"添加到主屏幕"后
打开仍然是带地址栏的网页。现在加了 `manifest.webmanifest`（`display: standalone`）
+ iOS 的 `apple-mobile-web-app-capable` / `black-translucent`（状态栏内容叠在页面上）。

manifest 放在**根路径**而不是 /assets/ 下：它里面的 `start_url`/`scope` 是相对
manifest 自己的 URL 解析的，挂在 /assets/ 下就得写 "../"。静态只挂了 `/` 与 `/assets/*`，
所以显式加了一条路由（并从 embed 读，而不是读磁盘 —— 前端产物必须与应用同源同版本）。
图标由项目唯一图标源生成 192/512（尺寸与声明一致，我用 struct 读文件头核对过）。

**实测**：`/manifest.webmanifest` → HTTP 200 `application/manifest+json`。

## ③ 日历滑动：补上真正的验收脚本

`test/manual/calendar-swipe-verify.mjs` 四条，含**反向对照**（纵向拖动不得翻页）
与前置断言。写它时又踩了一次自己的坑：标题真实格式是「2026 年 9 月」（数字与"年月"
之间有空格），我第一版正则按无空格写 ⇒ 匹配不到 ⇒ 三个值全是 null，
**看起来像"滑动没生效"，其实是探针瞎了**。所以脚本里第一条就是"标题读得到"。

实测：9 月 →左滑→ 10 月 →右滑→ 9 月，纵向拖动不动。

## 顺带

把我为验收造的测试数据**归档**（不是删除）：10 个 `/tmp/scrollprobe-*` 独立会话 +
12 封"滚动验收/窄屏验收样例"邮件。

2026-09-14 11:07:03 +08:00

JianFeeeee

a404cbad54

feat(branding): 确定项目图标，并接入 Web / Electron / HarmonyOS

# 唯一源

`client/electron/src/icons/agentmail.svg` 是图标唯一源（24×24 视图框，`currentColor`
跟随文字色）。此前各端用的都是占位物：Electron 的窗口/托盘指向一个**不存在**的
`src/icons/tray-icon.png`（`nativeImage` 拿到空图，托盘不可见），
HarmonyOS 的 `startIcon/foreground/background` 是 1×1 PNG，
Web 端根本没有 favicon。

# 为什么带生成脚本

PNG/ICO 是二进制的，换一次配色要重出十几个尺寸，手工做必然出现
「Web 是旧的、Harmony 是新的」这种不一致，而且没人能复核。
`generate.py` 只认上面那一份源，所有变体都由它推导（本机无 rsvg/ImageMagick，
用 cairosvg + Pillow）。改图标只需改源文件再跑一次脚本。

# 各端产物

- **Web**：`public/assets/{agentmail.svg,favicon.ico,apple-touch-icon.png}` + `index.html` 引用。
  放 `assets/` 下而非根目录，是因为 Gateway 只把 `/assets/*` 与 `/` 交给静态处理器
  （`server/cmd/server/main.go`），放根下会 404。已实测本机与 LAN 均 200。
- **Electron**：应用图标 `icon.png`(512) / `icon.ico`(16–256) / 各尺寸 PNG /
  托盘 `tray-icon.png`(32)，`package.json` 里 `win.icon` 与 `linux.icon` 指过去。
  托盘用品牌色字形而非白色 —— 浅色面板下白色会消失。
- **HarmonyOS**：`startIcon.png`(512) 用完整应用图标（启动页底色浅 `#FFF` /
  深 `#000`，白底蓝图标两套都立得住）；分层图标的 `background` 是品牌色整块、
  `foreground` 是白色字形并留 12% 安全区，避免被系统圆角裁掉。
- **应用内**：新增 `BrandMarkIcon`（fill 型，与现有描边图标集不同族），
  替换登录页与初始化页品牌位的占位 `MailboxIcon`；后者已无引用，一并删除。

图标色 `#2563eb` 与门户 Dashy 主题主色一致。

# 验证

- 前端 typecheck 与 196 项测试全绿；`npm run build` 产物含三个图标文件
- Gateway 重新部署后 `/assets/{agentmail.svg,favicon.ico,apple-touch-icon.png}`
  在本机与 `192.168.2.60:8180` 都返回 200，Content-Type 正确
- 所有 PNG/ICO 用 Pillow 复核尺寸与 alpha 边界（合成失败会表现为全透明，
  已用 getbbox 排除）

2026-09-11 15:49:41 +08:00

2 Commits