feat(app-shell): 桌面端集成自动更新（electron-updater）

- 集成 electron-updater：检查更新/下载/安装/忽略此版本，并推送下载进度到前端

- 打包版启动后自动检查更新；托盘菜单支持手动检查

- preload 暴露 updater IPC + __brand 标记；前端新增更新弹窗与设置页版本/检查更新入口

- 补全发布配置：artifactName/publish；release workflow 增加上传 latest.yml

frontend/app.vue

@@ -8,6 +8,22 @@
         <NuxtPage />
       </div>
     </div>
+
+    <ClientOnly v-if="isDesktopUpdater">
+      <DesktopUpdateDialog
+        :open="desktopUpdate.open"
+        :info="desktopUpdate.info"
+        :is-downloading="desktopUpdate.isDownloading"
+        :ready-to-install="desktopUpdate.readyToInstall"
+        :progress="desktopUpdate.progress"
+        :error="desktopUpdate.error"
+        :has-ignore="true"
+        @close="desktopUpdate.dismiss"
+        @update="desktopUpdate.startUpdate"
+        @install="desktopUpdate.installUpdate"
+        @ignore="desktopUpdate.ignore"
+      />
+    </ClientOnly>
   </div>
 </template>
 
@@ -16,12 +32,14 @@ import { useChatAccountsStore } from '~/stores/chatAccounts'
 import { usePrivacyStore } from '~/stores/privacy'
 
 const route = useRoute()
+const desktopUpdate = useDesktopUpdate()
 
 // In Electron the server/pre-render doesn't know about `window.wechatDesktop`.
 // If we render different DOM on server vs client, Vue hydration will keep the
 // server HTML (no patch) and the layout/CSS fixes won't apply reliably.
 // So we detect desktop onMounted and update reactively.
 const isDesktop = ref(false)
+const isDesktopUpdater = ref(false)
 
 const updateDprVar = () => {
   const dpr = window.devicePixelRatio || 1
@@ -29,10 +47,22 @@ const updateDprVar = () => {
 }
 
 onMounted(() => {
-  isDesktop.value = !!window?.wechatDesktop
+  const isElectron = /electron/i.test(String(navigator.userAgent || ''))
+  const api = window?.wechatDesktop
+  isDesktop.value = isElectron && !!api
+  const brandOk = !api?.__brand || api.__brand === 'WeChatDataAnalysisDesktop'
+  isDesktopUpdater.value =
+    isDesktop.value &&
+    brandOk &&
+    typeof api?.checkForUpdates === 'function' &&
+    typeof api?.downloadAndInstall === 'function'
   updateDprVar()
   window.addEventListener('resize', updateDprVar)
 
+  if (isDesktopUpdater.value) {
+    void desktopUpdate.initListeners()
+  }
+
   // Init global UI state.
   const chatAccounts = useChatAccountsStore()
   const privacy = usePrivacyStore()

frontend/components/DesktopUpdateDialog.vue

@@ -0,0 +1,164 @@
+<template>
+  <Teleport to="body">
+    <div v-if="open && info" class="fixed inset-0 z-[9999] flex items-center justify-center">
+      <div class="absolute inset-0 bg-black/40" @click="onBackdropClick" />
+
+      <div class="relative w-[min(520px,calc(100vw-32px))] rounded-lg bg-white shadow-xl border border-gray-200">
+        <button
+          class="absolute right-3 top-3 h-8 w-8 rounded-md text-gray-500 hover:bg-gray-100 hover:text-gray-700"
+          type="button"
+          @click="emitClose"
+          aria-label="Close"
+        >
+          <span class="text-xl leading-none">&times;</span>
+        </button>
+
+        <div class="px-5 pt-5 pb-4">
+          <div class="text-xs text-gray-500">
+            {{ readyToInstall ? '更新已下载完成' : '发现新版本' }}
+          </div>
+          <div class="mt-1 text-lg font-semibold text-gray-900">
+            {{ info.version || '—' }}
+          </div>
+
+          <div v-if="readyToInstall" class="mt-2 text-xs text-gray-600">
+            你可以选择现在重启安装，或稍后再安装。
+          </div>
+
+          <div class="mt-4 rounded-md border border-gray-200 bg-gray-50 p-3">
+            <div class="text-xs font-medium text-gray-700">更新内容</div>
+            <div class="mt-2 text-xs text-gray-700 whitespace-pre-wrap break-words">
+              {{ info.releaseNotes || '修复了一些已知问题，提升了稳定性。' }}
+            </div>
+          </div>
+
+          <div v-if="error" class="mt-3 text-xs text-red-600 whitespace-pre-wrap break-words">
+            {{ error }}
+          </div>
+
+          <div v-if="isDownloading" class="mt-4">
+            <div class="flex items-center justify-between gap-3 text-xs text-gray-600">
+              <span v-if="speedText">{{ speedText }}</span>
+              <span v-else>下载中...</span>
+              <span>{{ percentText }}</span>
+              <span v-if="remainingText">剩余 {{ remainingText }}</span>
+            </div>
+            <div class="mt-2 h-2 w-full rounded bg-gray-200 overflow-hidden">
+              <div class="h-2 bg-emerald-500" :style="{ width: `${percent}%` }" />
+            </div>
+          </div>
+
+          <div v-if="isDownloading" class="mt-5 flex items-center justify-end gap-2">
+            <button
+              class="px-3 py-1.5 rounded-md border border-gray-200 bg-white text-sm text-gray-700 hover:bg-gray-50"
+              type="button"
+              @click="emitClose"
+            >
+              后台下载
+            </button>
+          </div>
+
+          <div v-else class="mt-5 flex items-center justify-end gap-2">
+            <button
+              class="px-3 py-1.5 rounded-md border border-gray-200 bg-white text-sm text-gray-700 hover:bg-gray-50"
+              type="button"
+              @click="emitClose"
+            >
+              稍后
+            </button>
+
+            <button
+              v-if="readyToInstall"
+              class="px-3 py-1.5 rounded-md bg-emerald-600 text-white text-sm hover:bg-emerald-700"
+              type="button"
+              @click="emitInstall"
+            >
+              立即重启安装
+            </button>
+
+            <template v-else>
+              <button
+                v-if="hasIgnore"
+                class="px-3 py-1.5 rounded-md border border-gray-200 bg-white text-sm text-gray-700 hover:bg-gray-50"
+                type="button"
+                @click="emitIgnore"
+              >
+                忽略此版本
+              </button>
+              <button
+                class="px-3 py-1.5 rounded-md bg-emerald-600 text-white text-sm hover:bg-emerald-700"
+                type="button"
+                @click="emitUpdate"
+              >
+                立即更新
+              </button>
+            </template>
+          </div>
+        </div>
+      </div>
+    </div>
+  </Teleport>
+</template>
+
+<script setup>
+const props = defineProps({
+  open: { type: Boolean, default: false },
+  info: { type: Object, default: null }, // { version, releaseNotes }
+  isDownloading: { type: Boolean, default: false },
+  readyToInstall: { type: Boolean, default: false },
+  progress: { type: [Number, Object], default: () => ({ percent: 0 }) },
+  error: { type: String, default: "" },
+  hasIgnore: { type: Boolean, default: true },
+});
+
+const emit = defineEmits(["close", "update", "install", "ignore"]);
+
+const safeProgress = computed(() => {
+  if (typeof props.progress === "number") return { percent: props.progress };
+  if (props.progress && typeof props.progress === "object") return props.progress;
+  return { percent: 0 };
+});
+
+const percent = computed(() => {
+  const p = Number(safeProgress.value?.percent || 0);
+  if (!Number.isFinite(p)) return 0;
+  return Math.max(0, Math.min(100, p));
+});
+
+const percentText = computed(() => `${percent.value.toFixed(0)}%`);
+
+const formatBytes = (bytes) => {
+  const b = Number(bytes || 0);
+  if (!Number.isFinite(b) || b <= 0) return "0 B";
+  const k = 1024;
+  const sizes = ["B", "KB", "MB", "GB", "TB"];
+  const i = Math.floor(Math.log(b) / Math.log(k));
+  const idx = Math.max(0, Math.min(i, sizes.length - 1));
+  return `${(b / Math.pow(k, idx)).toFixed(1)} ${sizes[idx]}`;
+};
+
+const speedText = computed(() => {
+  const bps = safeProgress.value?.bytesPerSecond;
+  if (bps == null) return "";
+  return `${formatBytes(bps)}/s`;
+});
+
+const remainingText = computed(() => {
+  const s = safeProgress.value?.remaining;
+  const sec = Number(s);
+  if (!Number.isFinite(sec)) return "";
+  if (sec < 60) return `${Math.ceil(sec)} 秒`;
+  const min = Math.floor(sec / 60);
+  const rem = Math.ceil(sec % 60);
+  return `${min} 分 ${rem} 秒`;
+});
+
+const emitClose = () => emit("close");
+const emitUpdate = () => emit("update");
+const emitInstall = () => emit("install");
+const emitIgnore = () => emit("ignore");
+
+const onBackdropClick = () => {
+  emitClose();
+};
+</script>

frontend/composables/useDesktopUpdate.js

@@ -0,0 +1,236 @@
+let listenersInitialized = false;
+let removeListeners = [];
+
+const getDesktopApi = () => {
+  if (!process.client) return null;
+  if (typeof window === "undefined") return null;
+  return window?.wechatDesktop || null;
+};
+
+const isDesktopShell = () => !!getDesktopApi();
+
+const isUpdaterSupported = () => {
+  const api = getDesktopApi();
+  if (!api) return false;
+
+  // If the bridge exposes a brand marker, ensure it's our Electron shell.
+  if (api.__brand && api.__brand !== "WeChatDataAnalysisDesktop") return false;
+
+  // Require updater IPC to avoid showing update UI in the pure web build.
+  return (
+    typeof api.getVersion === "function" &&
+    typeof api.checkForUpdates === "function" &&
+    typeof api.downloadAndInstall === "function"
+  );
+};
+
+export const useDesktopUpdate = () => {
+  const info = useState("desktopUpdate.info", () => null);
+  const open = useState("desktopUpdate.open", () => false);
+  const isDownloading = useState("desktopUpdate.isDownloading", () => false);
+  const readyToInstall = useState("desktopUpdate.readyToInstall", () => false);
+  const progress = useState("desktopUpdate.progress", () => ({ percent: 0 }));
+  const error = useState("desktopUpdate.error", () => "");
+  const currentVersion = useState("desktopUpdate.currentVersion", () => "");
+
+  const manualCheckLoading = useState("desktopUpdate.manualCheckLoading", () => false);
+  const lastCheckMessage = useState("desktopUpdate.lastCheckMessage", () => "");
+  const lastCheckAt = useState("desktopUpdate.lastCheckAt", () => 0);
+
+  const setUpdateInfo = (payload) => {
+    if (!payload) return;
+    const version = String(payload?.version || "").trim();
+    const releaseNotes = String(payload?.releaseNotes || "");
+    if (!version) return;
+    info.value = { version, releaseNotes };
+    readyToInstall.value = false;
+  };
+
+  const dismiss = () => {
+    open.value = false;
+  };
+
+  const refreshVersion = async () => {
+    if (!isUpdaterSupported()) return "";
+    try {
+      const v = await getDesktopApi()?.getVersion?.();
+      currentVersion.value = String(v || "");
+      return currentVersion.value;
+    } catch {
+      return currentVersion.value || "";
+    }
+  };
+
+  const initListeners = async () => {
+    if (!isUpdaterSupported()) return;
+    if (listenersInitialized) return;
+    listenersInitialized = true;
+
+    await refreshVersion();
+
+    const unsubs = [];
+
+    const unUpdate = window.wechatDesktop?.onUpdateAvailable?.((payload) => {
+      error.value = "";
+      isDownloading.value = false;
+      readyToInstall.value = false;
+      progress.value = { percent: 0 };
+      setUpdateInfo(payload);
+      open.value = true;
+    });
+    if (typeof unUpdate === "function") unsubs.push(unUpdate);
+
+    const unProgress = window.wechatDesktop?.onDownloadProgress?.((p) => {
+      progress.value = p || { percent: 0 };
+      const percent = Number(progress.value?.percent || 0);
+      if (Number.isFinite(percent) && percent > 0) {
+        isDownloading.value = true;
+      }
+    });
+    if (typeof unProgress === "function") unsubs.push(unProgress);
+
+    const unDownloaded = window.wechatDesktop?.onUpdateDownloaded?.((payload) => {
+      // Download finished. Keep the dialog open and let the user decide when to install.
+      setUpdateInfo(payload || info.value || {});
+      isDownloading.value = false;
+      readyToInstall.value = true;
+      progress.value = { ...(progress.value || {}), percent: 100 };
+      open.value = true;
+    });
+    if (typeof unDownloaded === "function") unsubs.push(unDownloaded);
+
+    const unError = window.wechatDesktop?.onUpdateError?.((payload) => {
+      const msg = String(payload?.message || "");
+      if (msg) error.value = msg;
+      isDownloading.value = false;
+      readyToInstall.value = false;
+    });
+    if (typeof unError === "function") unsubs.push(unError);
+
+    removeListeners = unsubs;
+  };
+
+  const startUpdate = async () => {
+    if (!isUpdaterSupported()) return;
+
+    error.value = "";
+    isDownloading.value = true;
+    readyToInstall.value = false;
+    progress.value = { percent: 0 };
+
+    try {
+      await getDesktopApi()?.downloadAndInstall?.();
+    } catch (e) {
+      const msg = e?.message || String(e);
+      error.value = msg;
+      isDownloading.value = false;
+    }
+  };
+
+  const installUpdate = async () => {
+    if (!isUpdaterSupported()) return;
+    if (!getDesktopApi()?.installUpdate) return;
+
+    error.value = "";
+    try {
+      await getDesktopApi()?.installUpdate?.();
+    } catch (e) {
+      const msg = e?.message || String(e);
+      error.value = msg;
+    }
+  };
+
+  const ignore = async () => {
+    if (!isUpdaterSupported()) return;
+    const version = String(info.value?.version || "").trim();
+    if (!version) return;
+
+    try {
+      await getDesktopApi()?.ignoreUpdate?.(version);
+    } catch (e) {
+      const msg = e?.message || String(e);
+      error.value = msg;
+    } finally {
+      // Hide the dialog locally; startup auto-check will also respect the ignore.
+      open.value = false;
+      info.value = null;
+    }
+  };
+
+  const manualCheck = async () => {
+    if (!isDesktopShell()) {
+      lastCheckMessage.value = "仅桌面端可用。";
+      return { hasUpdate: false };
+    }
+    if (!isUpdaterSupported()) {
+      lastCheckMessage.value = "当前桌面端版本不支持自动更新。";
+      return { hasUpdate: false };
+    }
+
+    manualCheckLoading.value = true;
+    error.value = "";
+    lastCheckMessage.value = "";
+
+    try {
+      await refreshVersion();
+
+      const res = await getDesktopApi()?.checkForUpdates?.();
+      lastCheckAt.value = Date.now();
+
+      if (res?.enabled === false) {
+        lastCheckMessage.value = "自动更新已禁用（仅打包版本可用）。";
+        return res;
+      }
+
+      if (res?.error) {
+        lastCheckMessage.value = `检查更新失败：${String(res.error)}`;
+        return res;
+      }
+
+      if (res?.hasUpdate && res?.version) {
+        setUpdateInfo({ version: res.version, releaseNotes: res.releaseNotes || "" });
+        open.value = true;
+        lastCheckMessage.value = `发现新版本：${String(res.version)}`;
+        return res;
+      }
+
+      lastCheckMessage.value = "当前已是最新版本。";
+      return res;
+    } catch (e) {
+      const msg = e?.message || String(e);
+      lastCheckMessage.value = `检查更新失败：${msg}`;
+      return { hasUpdate: false, error: msg };
+    } finally {
+      manualCheckLoading.value = false;
+    }
+  };
+
+  const cleanup = () => {
+    try {
+      for (const fn of removeListeners) fn?.();
+    } catch {}
+    removeListeners = [];
+    listenersInitialized = false;
+  };
+
+  return {
+    info,
+    open,
+    isDownloading,
+    readyToInstall,
+    progress,
+    error,
+    currentVersion,
+    manualCheckLoading,
+    lastCheckMessage,
+    lastCheckAt,
+    initListeners,
+    refreshVersion,
+    manualCheck,
+    startUpdate,
+    installUpdate,
+    ignore,
+    dismiss,
+    cleanup,
+  };
+};

frontend/pages/settings.vue

@@ -90,6 +90,33 @@
                 </div>
               </div>
 
+              <div class="rounded-lg border border-gray-200">
+                <div class="px-4 py-3 border-b border-gray-200 bg-gray-50">
+                  <div class="text-sm font-medium text-gray-900">更新</div>
+                </div>
+                <div class="px-4 py-3 space-y-3">
+                  <div class="flex items-center justify-between gap-4">
+                    <div class="min-w-0">
+                      <div class="text-sm font-medium text-gray-900">当前版本</div>
+                      <div class="text-xs text-gray-500">
+                        {{ desktopVersionText }}
+                      </div>
+                    </div>
+                    <button
+                      type="button"
+                      class="text-sm px-3 py-1.5 rounded-md border border-gray-200 bg-white hover:bg-gray-50 disabled:opacity-50"
+                      :disabled="!isDesktopEnv || desktopUpdate.manualCheckLoading"
+                      @click="onDesktopCheckUpdates"
+                    >
+                      {{ desktopUpdate.manualCheckLoading ? '检查中...' : '检查更新' }}
+                    </button>
+                  </div>
+                  <div v-if="desktopUpdate.lastCheckMessage" class="text-xs text-gray-600 whitespace-pre-wrap break-words">
+                    {{ desktopUpdate.lastCheckMessage }}
+                  </div>
+                </div>
+              </div>
+
               <div class="rounded-lg border border-gray-200">
                 <div class="px-4 py-3 border-b border-gray-200 bg-gray-50">
                   <div class="text-sm font-medium text-gray-900">朋友圈</div>
@@ -123,6 +150,13 @@ import { DESKTOP_SETTING_AUTO_REALTIME_KEY, DESKTOP_SETTING_DEFAULT_TO_CHAT_KEY,
 useHead({ title: '设置 - 微信数据分析助手' })
 
 const isDesktopEnv = ref(false)
+const desktopUpdate = useDesktopUpdate()
+
+const desktopVersionText = computed(() => {
+  if (!isDesktopEnv.value) return '仅桌面端可用'
+  const v = String(desktopUpdate.currentVersion.value || '').trim()
+  return v || '—'
+})
 
 const desktopAutoRealtime = ref(false)
 const desktopDefaultToChatWhenData = ref(false)
@@ -225,9 +259,14 @@ const onSnsUseCacheToggle = (ev) => {
   writeLocalBoolSetting(SNS_SETTING_USE_CACHE_KEY, checked)
 }
 
+const onDesktopCheckUpdates = async () => {
+  await desktopUpdate.manualCheck()
+}
+
 onMounted(async () => {
   if (process.client && typeof window !== 'undefined') {
-    isDesktopEnv.value = !!window.wechatDesktop
+    const isElectron = /electron/i.test(String(navigator.userAgent || ''))
+    isDesktopEnv.value = isElectron && !!window.wechatDesktop
   }
 
   desktopAutoRealtime.value = readLocalBoolSetting(DESKTOP_SETTING_AUTO_REALTIME_KEY, false)
@@ -235,6 +274,7 @@ onMounted(async () => {
   snsUseCache.value = readLocalBoolSetting(SNS_SETTING_USE_CACHE_KEY, true)
 
   if (isDesktopEnv.value) {
+    void desktopUpdate.initListeners()
     await refreshDesktopAutoLaunch()
     await refreshDesktopCloseBehavior()
   }