fix(V0.2): OTA 发布说明改为 commit message, sha 单独展示; 版本附构建时间

- CI: notes 取 git log -1 的 commit message (标题+正文, 截断 400 字),
  commit sha 经 --commit 写入 manifest (不再把裸 sha 塞进发布说明)
- build-ota: 新增 --commit 参数; latest.json 增加 commit 字段
- 服务端 /ota/check 与 /manifest-web 透传 commit 与 sequence
- 我的页: 当前版本/新版本后附 seq 时间戳 (MM-dd HH:mm),
  发布说明下方新增「提交」行显示短 sha

src/api/ota.js

@@ -1,259 +1,262 @@
-// 前端 OTA 封装
-//   - Tauri 客户端: 直接用 tauri-plugin-hotswap-api (checkUpdate / applyUpdate / ...)
-//   - Web 浏览器:   只走我们自己的 /api/ota/manifest, 提示用户手动刷新 (Vite 资源指纹会失效)
-//
-// 设计原则:
-//   - Web 端只能"查 + 提示", 不能真下载应用, 避免误导
-//   - Tauri 端走 hotswap 插件的官方 API, 签名校验/回滚/资源替换全交给插件
-import { getApiBase } from './client.js'
-import { APP_VERSION, BUILD_ID } from '../version.js'
-
-// 判断是否在 Tauri WebView 内 (有 __TAURI_INTERNALS__ 即 Tauri 环境)
-const inTauri = typeof window !== 'undefined' && '__TAURI_INTERNALS__' in window
-
-// 拼接绝对 URL: 在 Tauri (VITE_API_BASE 有值) 时直连, 否则同源
-function resolveUrl(p) {
-  const base = getApiBase()
-  return base ? base + p : p
-}
-
-// 当前版本信息 (前端展示用)
-export function getCurrentVersionInfo() {
-  return { version: APP_VERSION, build: BUILD_ID }
-}
-
-// 启动时: 确认当前资源可用 (Tauri only)
-//   失败/异常都不抛, 仅 console.warn
-export function initOta() {
-  if (!inTauri) return
-  // 动态 import: web 模式根本不打这个 chunk
-  import('tauri-plugin-hotswap-api')
-    .then((mod) => mod.notifyReady())
-    .then(() => console.log('[ota] notifyReady ok'))
-    .catch((e) => console.warn('[ota] notifyReady failed:', e))
-}
-
-// ---------------------------------------------------------------------------
-// 判新模式 (V0.2)
-//   「开发版本」开关 (我的页 OTA 组内, 默认关闭), 值持久化在设备端 localStorage:
-//     开关 关闭 (默认 / 生产口径): 用**版本号**判新 —— 取服务端 manifest 的 version,
-//        与当前运行版本按数字字段逐段比较大小 (0.2.0 > 0.1.0)。
-//        这样即使某个旧版本分支被重新构建 (sequence 变大但版本号更小), 也不会把新设备拉回旧版。
-//     开关 打开 (开发口径): 用 **build sequence** 判新 —— 直接走插件 checkUpdate(),
-//        只要服务端 sequence 比本地大就算新, 每次提交都能推到设备上, 便于联调。
-// ---------------------------------------------------------------------------
-const OTA_DEV_MODE_KEY = 'iboard_ota_dev_mode'
-
-export function getOtaDevMode() {
-  try {
-    return localStorage.getItem(OTA_DEV_MODE_KEY) === '1'
-  } catch { /* ignore */ }
-  return false
-}
-
-export function setOtaDevMode(v) {
-  try { localStorage.setItem(OTA_DEV_MODE_KEY, v ? '1' : '0') } catch { /* ignore */ }
-}
-
-// 版本号 → 数字字段数组 / 比较函数 (纯函数放在 utils, 便于单测)
-import { compareVersion, parseVersionFields } from '../utils/version.js'
-
-export { compareVersion, parseVersionFields }
-
-// 拉服务端最新 manifest (不分平台)
-// /api/ota/check/0: current_sequence 传 0, 只要有 OTA 包就一定返回 200 + manifest
-export async function fetchOtaManifest() {
-  try {
-    const res = await fetch(resolveUrl('/api/ota/check/0'), { method: 'GET' })
-    if (res.status === 204) return null
-    if (!res.ok) return null
-    return await res.json()
-  } catch (e) {
-    console.warn('[ota] manifest 拉取失败:', e)
-    return null
-  }
-}
-
-// 检查更新
-//   返回统一结构, 调用方不关心是 Tauri 还是 web:
-//   {
-//     available: boolean,
-//     reason:    'no_package' | 'same_version' | 'ota_disabled' | 'unsupported' | 'ok',
-//     info:      { version, sequence, notes, mandatory, bundle_size }
-//   }
-//   opts.devMode: true=按 build sequence 判新, false=按版本号判新 (默认)
-export async function checkOtaUpdate(opts) {
-  const devMode = !!(opts && opts.devMode)
-  if (!inTauri) {
-    return checkOtaUpdateWeb(devMode)
-  }
-  return checkOtaUpdateTauri(devMode)
-}
-
-// 取"当前运行版本": 已应用 OTA 覆盖包则用覆盖包版本, 否则用内置包版本
-async function currentRunningVersion() {
-  try {
-    const v = await getOtaVersionInfo()
-    if (v?.active && v.version) return v.version
-  } catch { /* ignore */ }
-  return APP_VERSION
-}
-
-// 版本号口径判新 (Tauri + Web 共用): 服务端 version 比当前运行版本大才算新
-async function checkByVersion() {
-  const [manifest, current] = await Promise.all([fetchOtaManifest(), currentRunningVersion()])
-  if (!manifest || !manifest.version) {
-    return { available: false, reason: 'no_package', info: null }
-  }
-  if (compareVersion(manifest.version, current) <= 0) {
-    return { available: false, reason: 'same_version', info: manifest }
-  }
-  return {
-    available: true,
-    reason: 'ok',
-    info: {
-      version: manifest.version,
-      sequence: manifest.sequence,
-      notes: manifest.notes || '',
-      mandatory: !!manifest.mandatory,
-      bundle_size: manifest.bundle_size || 0,
-    },
-  }
-}
-
-async function checkOtaUpdateTauri(devMode) {
-  // 开发口径: sequence 判新, 直接走插件 (插件内部用当前 sequence 请求 /api/ota/check/:seq)
-  if (devMode) {
-    const { checkUpdate } = await import('tauri-plugin-hotswap-api')
-    const r = await checkUpdate()
-    if (!r.available) {
-      return { available: false, reason: 'no_package', info: r }
-    }
-    return {
-      available: true,
-      reason: 'ok',
-      info: {
-        version: r.version,
-        sequence: r.sequence,
-        notes: r.notes,
-        mandatory: r.mandatory,
-        bundle_size: r.bundle_size,
-      },
-    }
-  }
-  // 生产口径: 版本号判新
-  return checkByVersion()
-}
-
-async function checkOtaUpdateWeb(devMode) {
-  // Web 端不能下载, 只能拿到版本号/构建号做比对, 提示用户刷新
-  try {
-    const res = await fetch(resolveUrl('/api/ota/manifest-web'), { method: 'GET' })
-    if (!res.ok) {
-      return { available: false, reason: 'unsupported', info: null }
-    }
-    const data = await res.json()
-    if (!data.available) return { available: false, reason: 'no_package', info: data }
-    // Web 端拿不到本地 sequence:
-    //   开发口径 (devMode) → 只要服务端版本与本地不同就算新 (近似 sequence 语义, 含回退)
-    //   生产口径          → 严格比较版本号大小, 只有更高版本才算新
-    const cmp = compareVersion(data.version, APP_VERSION)
-    if (devMode ? cmp === 0 : cmp <= 0) {
-      return { available: false, reason: 'same_version', info: data }
-    }
-    return {
-      available: true,
-      reason: 'ok',
-      info: {
-        version: data.version,
-        notes: data.note || '',
-        // web 端没有强制/mandatory 等字段, 仅展示
-        mandatory: false,
-        bundle_size: data.size || 0,
-      },
-    }
-  } catch (e) {
-    console.warn('[ota] web check failed:', e)
-    return { available: false, reason: 'unsupported', info: null }
-  }
-}
-
-// 下载并应用更新 (Tauri only). 调用方负责 UI 提示和错误处理
-//   onProgress(received, total) 进度回调
-//   成功后必须 reload, 新资源才会生效
-export async function applyOtaUpdate(onProgress) {
-  if (!inTauri) {
-    throw new Error('OTA 升级仅在 Tauri 客户端可用, Web 端请直接刷新页面')
-  }
-  const mod = await import('tauri-plugin-hotswap-api')
-
-  // 注册一次性进度监听 (applyUpdate 期间触发)
-  let unlisten = null
-  let unlistenLifecycle = null
-  if (onProgress) {
-    try {
-      unlisten = await mod.onDownloadProgress((p) => onProgress(p.downloaded, p.total))
-    } catch (e) {
-      console.warn('[ota] onDownloadProgress 监听失败:', e)
-    }
-  }
-
-  // 监听 lifecycle 事件, 捕获失败详情 (download-error / apply 失败时 error 字段带具体原因)
-  // applyUpdate() 抛出的错误往往只有泛化信息, 细节藏在 lifecycle 事件里
-  let lifecycleError = ''
-  try {
-    unlistenLifecycle = await mod.onLifecycle((ev) => {
-      if (ev.event === 'download-error' || ev.event === 'apply' || ev.event === 'check-error') {
-        if (ev.error) {
-          lifecycleError = ev.error
-          console.error('[ota] lifecycle', ev.event, 'error:', ev.error)
-        }
-      }
-    })
-  } catch (e) {
-    console.warn('[ota] onLifecycle 监听失败:', e)
-  }
-
-  try {
-    const newVersion = await mod.applyUpdate()
-    return newVersion
-  } catch (e) {
-    // 把 lifecycle 里的详细错误拼进抛出的异常, 方便前端展示真实原因
-    const base = e?.message || '升级失败'
-    const detail = lifecycleError ? ` (${lifecycleError})` : ''
-    const err = new Error(base + detail)
-    err.cause = e
-    throw err
-  } finally {
-    if (unlisten) {
-      try { unlisten() } catch { /* ignore */ }
-    }
-    if (unlistenLifecycle) {
-      try { unlistenLifecycle() } catch { /* ignore */ }
-    }
-  }
-}
-
-// 回滚到内置 dist (Tauri only, 一般用于 OTA 出错时手动恢复)
-export async function rollbackOta() {
-  if (!inTauri) throw new Error('仅 Tauri 客户端可用')
-  const mod = await import('tauri-plugin-hotswap-api')
-  return mod.rollback()
-}
-
-// 取当前 OTA 状态 (Tauri only)
-export async function getOtaVersionInfo() {
-  if (!inTauri) return null
-  try {
-    const mod = await import('tauri-plugin-hotswap-api')
-    return await mod.getVersionInfo()
-  } catch (e) {
-    console.warn('[ota] getVersionInfo failed:', e)
-    return null
-  }
-}
-
-// reload 当前页 (新资源生效)
-export function reloadApp() {
-  window.location.reload()
-}
+// 前端 OTA 封装
+//   - Tauri 客户端: 直接用 tauri-plugin-hotswap-api (checkUpdate / applyUpdate / ...)
+//   - Web 浏览器:   只走我们自己的 /api/ota/manifest, 提示用户手动刷新 (Vite 资源指纹会失效)
+//
+// 设计原则:
+//   - Web 端只能"查 + 提示", 不能真下载应用, 避免误导
+//   - Tauri 端走 hotswap 插件的官方 API, 签名校验/回滚/资源替换全交给插件
+import { getApiBase } from './client.js'
+import { APP_VERSION, BUILD_ID } from '../version.js'
+
+// 判断是否在 Tauri WebView 内 (有 __TAURI_INTERNALS__ 即 Tauri 环境)
+const inTauri = typeof window !== 'undefined' && '__TAURI_INTERNALS__' in window
+
+// 拼接绝对 URL: 在 Tauri (VITE_API_BASE 有值) 时直连, 否则同源
+function resolveUrl(p) {
+  const base = getApiBase()
+  return base ? base + p : p
+}
+
+// 当前版本信息 (前端展示用)
+export function getCurrentVersionInfo() {
+  return { version: APP_VERSION, build: BUILD_ID }
+}
+
+// 启动时: 确认当前资源可用 (Tauri only)
+//   失败/异常都不抛, 仅 console.warn
+export function initOta() {
+  if (!inTauri) return
+  // 动态 import: web 模式根本不打这个 chunk
+  import('tauri-plugin-hotswap-api')
+    .then((mod) => mod.notifyReady())
+    .then(() => console.log('[ota] notifyReady ok'))
+    .catch((e) => console.warn('[ota] notifyReady failed:', e))
+}
+
+// ---------------------------------------------------------------------------
+// 判新模式 (V0.2)
+//   「开发版本」开关 (我的页 OTA 组内, 默认关闭), 值持久化在设备端 localStorage:
+//     开关 关闭 (默认 / 生产口径): 用**版本号**判新 —— 取服务端 manifest 的 version,
+//        与当前运行版本按数字字段逐段比较大小 (0.2.0 > 0.1.0)。
+//        这样即使某个旧版本分支被重新构建 (sequence 变大但版本号更小), 也不会把新设备拉回旧版。
+//     开关 打开 (开发口径): 用 **build sequence** 判新 —— 直接走插件 checkUpdate(),
+//        只要服务端 sequence 比本地大就算新, 每次提交都能推到设备上, 便于联调。
+// ---------------------------------------------------------------------------
+const OTA_DEV_MODE_KEY = 'iboard_ota_dev_mode'
+
+export function getOtaDevMode() {
+  try {
+    return localStorage.getItem(OTA_DEV_MODE_KEY) === '1'
+  } catch { /* ignore */ }
+  return false
+}
+
+export function setOtaDevMode(v) {
+  try { localStorage.setItem(OTA_DEV_MODE_KEY, v ? '1' : '0') } catch { /* ignore */ }
+}
+
+// 版本号 → 数字字段数组 / 比较函数 (纯函数放在 utils, 便于单测)
+import { compareVersion, parseVersionFields } from '../utils/version.js'
+
+export { compareVersion, parseVersionFields }
+
+// 拉服务端最新 manifest (不分平台)
+// /api/ota/check/0: current_sequence 传 0, 只要有 OTA 包就一定返回 200 + manifest
+export async function fetchOtaManifest() {
+  try {
+    const res = await fetch(resolveUrl('/api/ota/check/0'), { method: 'GET' })
+    if (res.status === 204) return null
+    if (!res.ok) return null
+    return await res.json()
+  } catch (e) {
+    console.warn('[ota] manifest 拉取失败:', e)
+    return null
+  }
+}
+
+// 检查更新
+//   返回统一结构, 调用方不关心是 Tauri 还是 web:
+//   {
+//     available: boolean,
+//     reason:    'no_package' | 'same_version' | 'ota_disabled' | 'unsupported' | 'ok',
+//     info:      { version, sequence, notes, mandatory, bundle_size }
+//   }
+//   opts.devMode: true=按 build sequence 判新, false=按版本号判新 (默认)
+export async function checkOtaUpdate(opts) {
+  const devMode = !!(opts && opts.devMode)
+  if (!inTauri) {
+    return checkOtaUpdateWeb(devMode)
+  }
+  return checkOtaUpdateTauri(devMode)
+}
+
+// 取"当前运行版本": 已应用 OTA 覆盖包则用覆盖包版本, 否则用内置包版本
+async function currentRunningVersion() {
+  try {
+    const v = await getOtaVersionInfo()
+    if (v?.active && v.version) return v.version
+  } catch { /* ignore */ }
+  return APP_VERSION
+}
+
+// 版本号口径判新 (Tauri + Web 共用): 服务端 version 比当前运行版本大才算新
+async function checkByVersion() {
+  const [manifest, current] = await Promise.all([fetchOtaManifest(), currentRunningVersion()])
+  if (!manifest || !manifest.version) {
+    return { available: false, reason: 'no_package', info: null }
+  }
+  if (compareVersion(manifest.version, current) <= 0) {
+    return { available: false, reason: 'same_version', info: manifest }
+  }
+  return {
+    available: true,
+    reason: 'ok',
+    info: {
+      version: manifest.version,
+      sequence: manifest.sequence,
+      notes: manifest.notes || '',
+      commit: manifest.commit || '',
+      mandatory: !!manifest.mandatory,
+      bundle_size: manifest.bundle_size || 0,
+    },
+  }
+}
+
+async function checkOtaUpdateTauri(devMode) {
+  // 开发口径: sequence 判新, 直接走插件 (插件内部用当前 sequence 请求 /api/ota/check/:seq)
+  if (devMode) {
+    const { checkUpdate } = await import('tauri-plugin-hotswap-api')
+    const r = await checkUpdate()
+    if (!r.available) {
+      return { available: false, reason: 'no_package', info: r }
+    }
+    return {
+      available: true,
+      reason: 'ok',
+      info: {
+        version: r.version,
+        sequence: r.sequence,
+        notes: r.notes,
+        mandatory: r.mandatory,
+        bundle_size: r.bundle_size,
+      },
+    }
+  }
+  // 生产口径: 版本号判新
+  return checkByVersion()
+}
+
+async function checkOtaUpdateWeb(devMode) {
+  // Web 端不能下载, 只能拿到版本号/构建号做比对, 提示用户刷新
+  try {
+    const res = await fetch(resolveUrl('/api/ota/manifest-web'), { method: 'GET' })
+    if (!res.ok) {
+      return { available: false, reason: 'unsupported', info: null }
+    }
+    const data = await res.json()
+    if (!data.available) return { available: false, reason: 'no_package', info: data }
+    // Web 端拿不到本地 sequence:
+    //   开发口径 (devMode) → 只要服务端版本与本地不同就算新 (近似 sequence 语义, 含回退)
+    //   生产口径          → 严格比较版本号大小, 只有更高版本才算新
+    const cmp = compareVersion(data.version, APP_VERSION)
+    if (devMode ? cmp === 0 : cmp <= 0) {
+      return { available: false, reason: 'same_version', info: data }
+    }
+    return {
+      available: true,
+      reason: 'ok',
+      info: {
+        version: data.version,
+        sequence: data.sequence,
+        notes: data.note || '',
+        commit: data.commit || '',
+        // web 端没有强制/mandatory 等字段, 仅展示
+        mandatory: false,
+        bundle_size: data.size || 0,
+      },
+    }
+  } catch (e) {
+    console.warn('[ota] web check failed:', e)
+    return { available: false, reason: 'unsupported', info: null }
+  }
+}
+
+// 下载并应用更新 (Tauri only). 调用方负责 UI 提示和错误处理
+//   onProgress(received, total) 进度回调
+//   成功后必须 reload, 新资源才会生效
+export async function applyOtaUpdate(onProgress) {
+  if (!inTauri) {
+    throw new Error('OTA 升级仅在 Tauri 客户端可用, Web 端请直接刷新页面')
+  }
+  const mod = await import('tauri-plugin-hotswap-api')
+
+  // 注册一次性进度监听 (applyUpdate 期间触发)
+  let unlisten = null
+  let unlistenLifecycle = null
+  if (onProgress) {
+    try {
+      unlisten = await mod.onDownloadProgress((p) => onProgress(p.downloaded, p.total))
+    } catch (e) {
+      console.warn('[ota] onDownloadProgress 监听失败:', e)
+    }
+  }
+
+  // 监听 lifecycle 事件, 捕获失败详情 (download-error / apply 失败时 error 字段带具体原因)
+  // applyUpdate() 抛出的错误往往只有泛化信息, 细节藏在 lifecycle 事件里
+  let lifecycleError = ''
+  try {
+    unlistenLifecycle = await mod.onLifecycle((ev) => {
+      if (ev.event === 'download-error' || ev.event === 'apply' || ev.event === 'check-error') {
+        if (ev.error) {
+          lifecycleError = ev.error
+          console.error('[ota] lifecycle', ev.event, 'error:', ev.error)
+        }
+      }
+    })
+  } catch (e) {
+    console.warn('[ota] onLifecycle 监听失败:', e)
+  }
+
+  try {
+    const newVersion = await mod.applyUpdate()
+    return newVersion
+  } catch (e) {
+    // 把 lifecycle 里的详细错误拼进抛出的异常, 方便前端展示真实原因
+    const base = e?.message || '升级失败'
+    const detail = lifecycleError ? ` (${lifecycleError})` : ''
+    const err = new Error(base + detail)
+    err.cause = e
+    throw err
+  } finally {
+    if (unlisten) {
+      try { unlisten() } catch { /* ignore */ }
+    }
+    if (unlistenLifecycle) {
+      try { unlistenLifecycle() } catch { /* ignore */ }
+    }
+  }
+}
+
+// 回滚到内置 dist (Tauri only, 一般用于 OTA 出错时手动恢复)
+export async function rollbackOta() {
+  if (!inTauri) throw new Error('仅 Tauri 客户端可用')
+  const mod = await import('tauri-plugin-hotswap-api')
+  return mod.rollback()
+}
+
+// 取当前 OTA 状态 (Tauri only)
+export async function getOtaVersionInfo() {
+  if (!inTauri) return null
+  try {
+    const mod = await import('tauri-plugin-hotswap-api')
+    return await mod.getVersionInfo()
+  } catch (e) {
+    console.warn('[ota] getVersionInfo failed:', e)
+    return null
+  }
+}
+
+// reload 当前页 (新资源生效)
+export function reloadApp() {
+  window.location.reload()
+}

src/pages/MePage.jsx

@@ -1,247 +1,259 @@
-import { useEffect, useState } from 'react'
-import { useNavigate } from 'react-router-dom'
-import { Avatar, Button, List, ProgressBar, Switch, Toast } from 'antd-mobile'
-import { useAuth } from '../auth/AuthContext.jsx'
-import { APP_VERSION, BUILD_ID } from '../version.js'
-import {
-  applyOtaUpdate,
-  checkOtaUpdate,
-  getCurrentVersionInfo,
-  getOtaDevMode,
-  getOtaVersionInfo,
-  reloadApp,
-  rollbackOta,
-  setOtaDevMode,
-} from '../api/ota.js'
-
-// "我" 页: 顶部 NavBar + 用户头像卡片 + 信息列表 + OTA 升级区
-// OTA 区:
-//   - 显示当前 APP_VERSION (前端包, 对应内置 dist)
-//   - 显示当前 hotswap 状态 (是否已应用覆盖包)
-//   - [检查更新]: 走 checkOtaUpdate()
-//   - [立即升级]: 走 applyOtaUpdate(), 完成后 reload
-//   - [回滚]: 清除覆盖包, 回到内置 dist
-export default function MePage() {
-  const { user, logout } = useAuth()
-  const navigate = useNavigate()
-
-  // 顶部安全区与「我」页蓝色渐变头部无缝衔接: 给 body 打标记,
-  // 由 CSS 让 .app-safe-top 也使用同一条渐变, 避免出现一条白边/色块把蓝色割断.
-  // 离开本页时移除标记, 其他页恢复默认底色.
-  useEffect(() => {
-    document.body.classList.add('me-safe-top')
-    return () => { document.body.classList.remove('me-safe-top') }
-  }, [])
-
-  // OTA 状态
-  const [otaState, setOtaState] = useState('idle') // idle | checking | available | none | downloading | ready | error
-  const [otaInfo, setOtaInfo] = useState(null) // 检查结果中的 info
-  const [otaVersion, setOtaVersion] = useState(null) // hotswap 当前激活的覆盖包版本
-  const [progress, setProgress] = useState({ received: 0, total: 0 })
-  const [error, setError] = useState('')
-  // 判新模式: false(默认)=版本号比较, true=build sequence 比较; 值持久化在设备端
-  const [devMode, setDevMode] = useState(() => getOtaDevMode())
-
-  // 进入页面时拉一次 hotswap 状态 (Tauri 内才需要, web 下 null 也无所谓)
-  useEffect(() => {
-    let cancelled = false
-    getOtaVersionInfo().then((v) => {
-      if (!cancelled) setOtaVersion(v)
-    })
-    return () => { cancelled = true }
-  }, [])
-
-  async function onCheck() {
-    setError('')
-    setOtaState('checking')
-    try {
-      const r = await checkOtaUpdate({ devMode })
-      if (r.available) {
-        setOtaInfo(r.info)
-        setOtaState('available')
-        Toast.show({ icon: 'success', content: '发现新版本 v' + (r.info?.version || '') })
-      } else {
-        setOtaInfo(null)
-        setOtaState('none')
-        if (r.reason === 'same_version') {
-          Toast.show({ content: '已是最新版本' })
-        } else if (r.reason === 'no_package') {
-          Toast.show({ content: '当前没有可用更新' })
-        } else {
-          Toast.show({ content: '当前没有可用更新' })
-        }
-      }
-    } catch (e) {
-      setError(e?.message || '检查失败')
-      setOtaState('error')
-      Toast.show({ icon: 'fail', content: '检查失败: ' + (e?.message || '') })
-    }
-  }
-
-  async function onApply() {
-    setError('')
-    setOtaState('downloading')
-    setProgress({ received: 0, total: 0 })
-    try {
-      const newVer = await applyOtaUpdate((received, total) => {
-        setProgress({ received, total })
-      })
-      Toast.show({ icon: 'success', content: '已下载 v' + newVer + ', 即将重启' })
-      setOtaState('ready')
-      // 给用户 1s 看提示, 然后 reload
-      setTimeout(() => reloadApp(), 1000)
-    } catch (e) {
-      setError(e?.message || '升级失败')
-      setOtaState('error')
-      Toast.show({ icon: 'fail', content: '升级失败: ' + (e?.message || '') })
-    }
-  }
-
-  async function onRollback() {
-    if (!window.confirm('确认回滚到内置版本?')) return
-    try {
-      await rollbackOta()
-      Toast.show({ icon: 'success', content: '已回滚, 正在重启' })
-      setTimeout(() => reloadApp(), 800)
-    } catch (e) {
-      Toast.show({ icon: 'fail', content: '回滚失败: ' + (e?.message || '') })
-    }
-  }
-
-  async function onLogout() {
-    const confirmed = window.confirm('确定退出登录?')
-    if (!confirmed) return
-    await logout()
-    Toast.show({ icon: 'success', content: '已退出' })
-    navigate('/login', { replace: true })
-  }
-
-  const cur = getCurrentVersionInfo()
-  const isTauri = typeof window !== 'undefined' && '__TAURI_INTERNALS__' in window
-  const showProgress = otaState === 'downloading' && progress.total > 0
-  const progressPct = showProgress ? Math.min(100, Math.round((progress.received / progress.total) * 100)) : 0
-
-  return (
-    <div className="me-page">
-      <div className="me-profile">
-        <Avatar
-          className="me-avatar"
-          src={user?.avatar}
-          style={{ '--size': '64px', '--border-radius': '50%' }}
-        >
-          {(user?.name || '?').slice(0, 1).toUpperCase()}
-        </Avatar>
-        <div className="me-name">{user?.name || '用户'}</div>
-        <div className="me-email">{user?.email}</div>
-      </div>
-
-      {/* OTA 升级区 */}
-      <List className="me-list" mode="card" header="前端升级 (OTA)">
-        <List.Item extra={'v' + cur.version + ' · ' + cur.build}>当前版本</List.Item>
-        <List.Item extra={otaVersion?.active ? 'v' + (otaVersion.version || '?') : '内置'}>
-          运行资源
-        </List.Item>
-        {/* 判新口径开关: 默认关(版本号比较), 打开后按 build sequence 比较 */}
-        <List.Item
-          extra={
-            <Switch
-              checked={devMode}
-              onChange={(v) => {
-                setDevMode(v)
-                setOtaDevMode(v)
-                // 切换口径后旧检查结果失效, 重置避免误导
-                setOtaState('idle')
-                setOtaInfo(null)
-                setError('')
-                Toast.show({ content: v ? '开发版本: 按构建号判新' : '正式口径: 按版本号判新' })
-              }}
-            />
-          }
-          description={
-            devMode
-              ? '按 build sequence 判新：每次构建都算新版本，便于开发联调'
-              : '按版本号判新：仅当服务端版本号更高时才提示更新'
-          }
-        >
-          开发版本
-        </List.Item>
-        <List.Item>
-          <div className="me-ota-actions">
-            <Button
-              size="small"
-              color="primary"
-              loading={otaState === 'checking'}
-              disabled={otaState === 'downloading'}
-              onClick={onCheck}
-            >
-              检查更新
-            </Button>
-            <Button
-              size="small"
-              color="danger"
-              disabled={otaState !== 'available' || otaState === 'downloading'}
-              onClick={onApply}
-            >
-              立即升级
-            </Button>
-            {isTauri && otaVersion?.active && (
-              <Button
-                size="small"
-                fill="outline"
-                onClick={onRollback}
-                disabled={otaState === 'downloading'}
-              >
-                回滚
-              </Button>
-            )}
-          </div>
-        </List.Item>
-        {otaState === 'available' && otaInfo && (
-          <List.Item extra={'v' + otaInfo.version}>
-            新版本
-            {otaInfo.bundle_size ? ` (${(otaInfo.bundle_size / 1024).toFixed(0)} KB)` : ''}
-          </List.Item>
-        )}
-        {otaState === 'downloading' && (
-          <List.Item>
-            <div className="me-ota-progress">
-              <div className="me-ota-progress-text">
-                正在下载 {showProgress ? progressPct + '%' : ''}
-                {' '}({(progress.received / 1024).toFixed(0)} KB
-                {progress.total ? ' / ' + (progress.total / 1024).toFixed(0) + ' KB' : ''})
-              </div>
-              <ProgressBar percent={progressPct || undefined} />
-            </div>
-          </List.Item>
-        )}
-        {otaInfo?.notes && (
-          <List.Item description={otaInfo.notes}>发布说明</List.Item>
-        )}
-        {error && (
-          <List.Item>
-            <span className="me-ota-error">{error}</span>
-          </List.Item>
-        )}
-        {!isTauri && (
-          <List.Item description="Web 端仅展示提示, 实际升级需在 Tauri 客户端进行">提示</List.Item>
-        )}
-      </List>
-
-      <List className="me-list" mode="card">
-        <List.Item extra={'#' + (user?.id || '-')}>用户 ID</List.Item>
-        <List.Item extra={user?.createdAt ? new Date(user.createdAt).toLocaleDateString() : '-'}>
-          注册时间
-        </List.Item>
-        <List.Item
-          onClick={onLogout}
-          clickable
-          arrowIcon={false}
-          className="me-logout"
-        >
-          退出登录
-        </List.Item>
-      </List>
-      <div className="me-version">v{APP_VERSION} · build {BUILD_ID}</div>
-    </div>
-  )
-}
+import { useEffect, useState } from 'react'
+import { useNavigate } from 'react-router-dom'
+import { Avatar, Button, List, ProgressBar, Switch, Toast } from 'antd-mobile'
+import { useAuth } from '../auth/AuthContext.jsx'
+import { APP_VERSION, BUILD_ID } from '../version.js'
+import {
+  applyOtaUpdate,
+  checkOtaUpdate,
+  getCurrentVersionInfo,
+  getOtaDevMode,
+  getOtaVersionInfo,
+  reloadApp,
+  rollbackOta,
+  setOtaDevMode,
+} from '../api/ota.js'
+
+// seq/build 时间戳 → 'MM-dd HH:mm' (sequence 为毫秒时间戳, build_id 形如 seq-<ms>)
+export function fmtSeqTime(v) {
+  const ms = typeof v === 'string' && v.startsWith('seq-') ? Number(v.slice(4)) : Number(v)
+  if (!Number.isFinite(ms) || ms <= 0) return ''
+  const p = (n) => String(n).padStart(2, '0')
+  const d = new Date(ms)
+  return `${p(d.getMonth() + 1)}-${p(d.getDate())} ${p(d.getHours())}:${p(d.getMinutes())}`
+}
+
+// "我" 页: 顶部 NavBar + 用户头像卡片 + 信息列表 + OTA 升级区
+// OTA 区:
+//   - 显示当前 APP_VERSION (前端包, 对应内置 dist)
+//   - 显示当前 hotswap 状态 (是否已应用覆盖包)
+//   - [检查更新]: 走 checkOtaUpdate()
+//   - [立即升级]: 走 applyOtaUpdate(), 完成后 reload
+//   - [回滚]: 清除覆盖包, 回到内置 dist
+export default function MePage() {
+  const { user, logout } = useAuth()
+  const navigate = useNavigate()
+
+  // 顶部安全区与「我」页蓝色渐变头部无缝衔接: 给 body 打标记,
+  // 由 CSS 让 .app-safe-top 也使用同一条渐变, 避免出现一条白边/色块把蓝色割断.
+  // 离开本页时移除标记, 其他页恢复默认底色.
+  useEffect(() => {
+    document.body.classList.add('me-safe-top')
+    return () => { document.body.classList.remove('me-safe-top') }
+  }, [])
+
+  // OTA 状态
+  const [otaState, setOtaState] = useState('idle') // idle | checking | available | none | downloading | ready | error
+  const [otaInfo, setOtaInfo] = useState(null) // 检查结果中的 info
+  const [otaVersion, setOtaVersion] = useState(null) // hotswap 当前激活的覆盖包版本
+  const [progress, setProgress] = useState({ received: 0, total: 0 })
+  const [error, setError] = useState('')
+  // 判新模式: false(默认)=版本号比较, true=build sequence 比较; 值持久化在设备端
+  const [devMode, setDevMode] = useState(() => getOtaDevMode())
+
+  // 进入页面时拉一次 hotswap 状态 (Tauri 内才需要, web 下 null 也无所谓)
+  useEffect(() => {
+    let cancelled = false
+    getOtaVersionInfo().then((v) => {
+      if (!cancelled) setOtaVersion(v)
+    })
+    return () => { cancelled = true }
+  }, [])
+
+  async function onCheck() {
+    setError('')
+    setOtaState('checking')
+    try {
+      const r = await checkOtaUpdate({ devMode })
+      if (r.available) {
+        setOtaInfo(r.info)
+        setOtaState('available')
+        Toast.show({ icon: 'success', content: '发现新版本 v' + (r.info?.version || '') })
+      } else {
+        setOtaInfo(null)
+        setOtaState('none')
+        if (r.reason === 'same_version') {
+          Toast.show({ content: '已是最新版本' })
+        } else if (r.reason === 'no_package') {
+          Toast.show({ content: '当前没有可用更新' })
+        } else {
+          Toast.show({ content: '当前没有可用更新' })
+        }
+      }
+    } catch (e) {
+      setError(e?.message || '检查失败')
+      setOtaState('error')
+      Toast.show({ icon: 'fail', content: '检查失败: ' + (e?.message || '') })
+    }
+  }
+
+  async function onApply() {
+    setError('')
+    setOtaState('downloading')
+    setProgress({ received: 0, total: 0 })
+    try {
+      const newVer = await applyOtaUpdate((received, total) => {
+        setProgress({ received, total })
+      })
+      Toast.show({ icon: 'success', content: '已下载 v' + newVer + ', 即将重启' })
+      setOtaState('ready')
+      // 给用户 1s 看提示, 然后 reload
+      setTimeout(() => reloadApp(), 1000)
+    } catch (e) {
+      setError(e?.message || '升级失败')
+      setOtaState('error')
+      Toast.show({ icon: 'fail', content: '升级失败: ' + (e?.message || '') })
+    }
+  }
+
+  async function onRollback() {
+    if (!window.confirm('确认回滚到内置版本?')) return
+    try {
+      await rollbackOta()
+      Toast.show({ icon: 'success', content: '已回滚, 正在重启' })
+      setTimeout(() => reloadApp(), 800)
+    } catch (e) {
+      Toast.show({ icon: 'fail', content: '回滚失败: ' + (e?.message || '') })
+    }
+  }
+
+  async function onLogout() {
+    const confirmed = window.confirm('确定退出登录?')
+    if (!confirmed) return
+    await logout()
+    Toast.show({ icon: 'success', content: '已退出' })
+    navigate('/login', { replace: true })
+  }
+
+  const cur = getCurrentVersionInfo()
+  const isTauri = typeof window !== 'undefined' && '__TAURI_INTERNALS__' in window
+  const showProgress = otaState === 'downloading' && progress.total > 0
+  const progressPct = showProgress ? Math.min(100, Math.round((progress.received / progress.total) * 100)) : 0
+
+  return (
+    <div className="me-page">
+      <div className="me-profile">
+        <Avatar
+          className="me-avatar"
+          src={user?.avatar}
+          style={{ '--size': '64px', '--border-radius': '50%' }}
+        >
+          {(user?.name || '?').slice(0, 1).toUpperCase()}
+        </Avatar>
+        <div className="me-name">{user?.name || '用户'}</div>
+        <div className="me-email">{user?.email}</div>
+      </div>
+
+      {/* OTA 升级区 */}
+      <List className="me-list" mode="card" header="前端升级 (OTA)">
+        <List.Item extra={'v' + cur.version + (fmtSeqTime(cur.build) ? ' · ' + fmtSeqTime(cur.build) : '')}>当前版本</List.Item>
+        <List.Item extra={otaVersion?.active ? 'v' + (otaVersion.version || '?') : '内置'}>
+          运行资源
+        </List.Item>
+        {/* 判新口径开关: 默认关(版本号比较), 打开后按 build sequence 比较 */}
+        <List.Item
+          extra={
+            <Switch
+              checked={devMode}
+              onChange={(v) => {
+                setDevMode(v)
+                setOtaDevMode(v)
+                // 切换口径后旧检查结果失效, 重置避免误导
+                setOtaState('idle')
+                setOtaInfo(null)
+                setError('')
+                Toast.show({ content: v ? '开发版本: 按构建号判新' : '正式口径: 按版本号判新' })
+              }}
+            />
+          }
+          description={
+            devMode
+              ? '按 build sequence 判新：每次构建都算新版本，便于开发联调'
+              : '按版本号判新：仅当服务端版本号更高时才提示更新'
+          }
+        >
+          开发版本
+        </List.Item>
+        <List.Item>
+          <div className="me-ota-actions">
+            <Button
+              size="small"
+              color="primary"
+              loading={otaState === 'checking'}
+              disabled={otaState === 'downloading'}
+              onClick={onCheck}
+            >
+              检查更新
+            </Button>
+            <Button
+              size="small"
+              color="danger"
+              disabled={otaState !== 'available' || otaState === 'downloading'}
+              onClick={onApply}
+            >
+              立即升级
+            </Button>
+            {isTauri && otaVersion?.active && (
+              <Button
+                size="small"
+                fill="outline"
+                onClick={onRollback}
+                disabled={otaState === 'downloading'}
+              >
+                回滚
+              </Button>
+            )}
+          </div>
+        </List.Item>
+        {otaState === 'available' && otaInfo && (
+          <List.Item extra={'v' + otaInfo.version + (fmtSeqTime(otaInfo.sequence) ? ' · ' + fmtSeqTime(otaInfo.sequence) : '')}>
+            新版本
+            {otaInfo.bundle_size ? ` (${(otaInfo.bundle_size / 1024).toFixed(0)} KB)` : ''}
+          </List.Item>
+        )}
+        {otaState === 'downloading' && (
+          <List.Item>
+            <div className="me-ota-progress">
+              <div className="me-ota-progress-text">
+                正在下载 {showProgress ? progressPct + '%' : ''}
+                {' '}({(progress.received / 1024).toFixed(0)} KB
+                {progress.total ? ' / ' + (progress.total / 1024).toFixed(0) + ' KB' : ''})
+              </div>
+              <ProgressBar percent={progressPct || undefined} />
+            </div>
+          </List.Item>
+        )}
+        {otaInfo?.notes && (
+          <List.Item description={otaInfo.notes}>发布说明</List.Item>
+        )}
+        {otaInfo?.commit && (
+          <List.Item extra={String(otaInfo.commit).slice(0, 10)}>提交</List.Item>
+        )}
+        {error && (
+          <List.Item>
+            <span className="me-ota-error">{error}</span>
+          </List.Item>
+        )}
+        {!isTauri && (
+          <List.Item description="Web 端仅展示提示, 实际升级需在 Tauri 客户端进行">提示</List.Item>
+        )}
+      </List>
+
+      <List className="me-list" mode="card">
+        <List.Item extra={'#' + (user?.id || '-')}>用户 ID</List.Item>
+        <List.Item extra={user?.createdAt ? new Date(user.createdAt).toLocaleDateString() : '-'}>
+          注册时间
+        </List.Item>
+        <List.Item
+          onClick={onLogout}
+          clickable
+          arrowIcon={false}
+          className="me-logout"
+        >
+          退出登录
+        </List.Item>
+      </List>
+      <div className="me-version">v{APP_VERSION} · build {BUILD_ID}</div>
+    </div>
+  )
+}