跨端: 联系人栏宽度随视图模式变（卡片 400 / 列表 320，原来写死 320）

WebUI `ContactPanel.tsx:59-62` 原文：
    // 卡片要放两行摘要 + 预算条，320px 会挤；列表视图保持紧凑
    view === 'card' ? 'lg:w-[400px]' : 'lg:w-[320px]'

而鸿蒙写死 `navBarWidth(320)` —— 两个视图一样宽。
卡片视图比列表视图多一行（`N 封 · 时间`）**再加一条预算胶囊**，
320 装不下；WebUI 早就为此单独放宽了，我们没跟上。

★ 顺带一个很容易漏的点：范围也要一起抬（`navBarWidthRange([280, 400])`）。
  只改 `navBarWidth(400)` 而 range 还是 `[280, 360]`，值会被**静默夹回 360** ——
  "改了宽度但没变"，且没有任何报错。这类"值被另一处覆盖"的坑
  与 `.attributeModifier` 单一插槽（后一个挤掉前一个）是同一族。

设备验证（模拟器，密度 2.875，实测可点卡片右边界）：
· 列表视图：`ListItem [265,326,1117,…]` → 右边界 1117 ⇒ **320vp**
· 卡片视图：`ListItem [265,326,1347,…]` → 右边界 1347 ⇒ **400vp**
  同时标题从「联系人」变「工作列表」（与 WebUI 的 `view === 'card' ? '工作列表' : '联系人'` 一致）。

client/harmony/entry/src/main/ets/pages/MainPage.ets

@@ -2171,9 +2171,23 @@ struct ContactsTab {
     }
     .navDestination(this.DestinationBuilder)
     .mode(NavigationMode.Auto)
-    /* 会话列表栏宽度与通信页同一口径（320，范围 280–360） */
-    .navBarWidth(320)
-    .navBarWidthRange([280, 360])
+    /*
+     * ★★ 2026-09-20 修：联系人栏宽度**随视图模式变**（用户：「联系人页宽度」）。
+     *
+     * WebUI `ContactPanel.tsx:59-62` 原文：
+     *     // 卡片要放两行摘要 + 预算条，320px 会挤；列表视图保持紧凑
+     *     view === 'card' ? 'lg:w-[400px]' : 'lg:w-[320px]'
+     *
+     * 而鸿蒙原来**写死 320** —— 卡片视图与列表视图同宽。
+     * 卡片视图比列表视图多一行（`mail_count 封 · 时间`）**再加一条预算胶囊**
+     * （见 `CardItem` 里 `budgetLabel(...)` 那一块），320 装不下，
+     * WebUI 早就为此单独放宽到 400，我们没跟上。
+     *
+     * 范围上限也一起抬到 400（否则 `navBarWidth(400)` 会被 range 夹回 360 ——
+     * 那正是"改了宽度但没变"的典型症状，值被另一处静默覆盖）。
+     */
+    .navBarWidth(this.contactView === 'card' ? 400 : 320)
+    .navBarWidthRange([280, 400])
     .minContentWidth(360)
     .hideTitleBar(true)
     .width('100%').height('100%')