打包你快修好啊 我服了

Dev

.github/workflows/release.yml

@@ -21,48 +21,41 @@ jobs:
       - name: Install Node.js
         uses: actions/setup-node@v4
         with:
-          node-version: 20
+          node-version: 22.12
           cache: 'npm'
 
       - name: Install Dependencies
-        run: npm install
+        run: npm ci
+
+      - name: Sync version with tag
+        shell: bash
+        run: |
+          VERSION=${GITHUB_REF_NAME#v}
+          echo "Syncing package.json version to $VERSION"
+          npm version $VERSION --no-git-tag-version --allow-same-version
 
       - name: Build Frontend & Type Check
         run: |
           npx tsc
           npx vite build
 
-      - name: Build Changelog
-        id: build_changelog
-        uses: mikepenz/release-changelog-builder-action@v4
-        with:
-          outputFile: "release-notes.md"
-          configurationJson: |
-            {
-              "template": "#  v${{ github.ref_name }} 版本发布\n\n{{CHANGELOG}}\n\n---\n> 此更新由系统自动构建",
-              "categories": [
-                {
-                  "title": "##  新功能",
-                  "filter": { "pattern": "^feat:.*", "flags": "i" }
-                },
-                {
-                  "title": "##  修复",
-                  "filter": { "pattern": "^fix:.*", "flags": "i" }
-                },
-                {
-                  "title": "##  性能与维护",
-                  "filter": { "pattern": "^(chore|docs|perf|refactor):.*", "flags": "i" }
-                }
-              ],
-              "ignore_labels": true,
-              "commitMode": true,
-              "empty_summary": "##  更新详情\n- 常规代码优化与维护"
-            }
-        env:
-          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
-
       - name: Package and Publish
         env:
           GH_TOKEN: ${{ secrets.GITHUB_TOKEN }}
         run: |
-          npx electron-builder --publish always "-c.releaseInfo.releaseNotesFile=release-notes.md"
+          npx electron-builder --publish always
+
+      - name: Update Release Notes
+        env:
+          GH_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+        shell: bash
+        run: |
+          cat <<EOF > release_notes.md
+          ## 更新日志
+          修复了一些已知问题
+
+          ## 加入我们的群
+          [点击加入 Telegram 群](https://t.me/+hn3QzNc4DbA0MzNl)
+          EOF
+          
+          gh release edit "$GITHUB_REF_NAME" --notes-file release_notes.md

.gitignore

@@ -13,6 +13,7 @@ dist
 dist-electron
 dist-ssr
 *.local
+test/
 
 # Editor directories and files
 .vscode/*
@@ -42,6 +43,10 @@ release
 # OS
 Thumbs.db
 
+# Electron dev cache
+.electron/
+.cache/
+
 
 
 # 忽略 Visual Studio 临时文件夹
@@ -50,4 +55,5 @@ Thumbs.db
 *.ipch
 *.aps
 
-wcdb/
+wcdb/
+*info

README.md

@@ -20,21 +20,34 @@ WeFlow 是一个**完全本地**的微信**实时**聊天记录查看、分析
 <a href="https://github.com/hicccc77/WeFlow/issues">
 <img src="https://img.shields.io/github/issues/hicccc77/WeFlow?style=flat-square" alt="Issues">
 </a>
-<a href="https://github.com/hicccc77/WeFlow/blob/main/LICENSE">
+<a href="https://t.me/+hn3QzNc4DbA0MzNl">
-<img src="https://img.shields.io/github/license/hicccc77/WeFlow?style=flat-square" alt="License">
+<img src="https://img.shields.io/badge/Telegram%20交流群-点击加入-0088cc?style=flat-square&logo=telegram&logoColor=0088cc&labelColor=white" alt="Telegram">
 </a>
 </p>
 
+
 > [!TIP]
 > 如果导出聊天记录后，想深入分析聊天内容可以试试 [ChatLab](https://chatlab.fun/)
 
+> [!NOTE]
+> 仅支持微信 **4.0 及以上**版本，确保你的微信版本符合要求
+
+
+# 加入微信交流群
+
+> 🎉 扫码加入微信群，与其他 WeFlow 用户一起交流问题和使用心得。
+
+<p align="center">
+  <img src="mdassets/us.png" alt="WeFlow 微信交流群二维码" width="220" style="margin-right: 16px;"
+</p>
+
 ## 主要功能
 
 - 本地实时查看聊天记录
 - 统计分析与群聊画像
 - 年度报告与可视化概览
 - 导出聊天记录为 HTML 等格式
-- 本地解密与数据库管理
+
 
 ## 快速开始
 
@@ -61,38 +74,18 @@ npm run build
 
 打包产物在 `release` 目录下。
 
-## 技术栈
 
-- **前端**: React 19 + TypeScript + Zustand
-- **桌面**: Electron 39
-- **构建**: Vite + electron-builder
-- **数据库**: better-sqlite3 + WCDB DLL
-- **样式**: SCSS + CSS Variables
-
-## 项目结构
-
-```
-WeFlow/
-├── electron/              # Electron 主进程
-│   ├── main.ts           # 主进程入口
-│   ├── preload.ts        # 预加载脚本
-│   └── services/         # 后端服务
-│       ├── chatService.ts      # 聊天数据服务
-│       ├── wcdbService.ts      # 数据库服务
-│       └── ...
-├── src/                   # React 前端
-│   ├── components/       # 通用组件
-│   ├── pages/            # 页面组件
-│   ├── stores/           # Zustand 状态管理
-│   ├── services/         # 前端服务
-│   └── types/            # TypeScript 类型定义
-├── public/               # 静态资源
-└── resources/            # 打包资源
-```
 
 ## 致谢
 
-- [miyu](https://github.com/ILoveBingLu/miyu) 为本项目提供了基础框架
+- [密语 CipherTalk](https://github.com/ILoveBingLu/miyu) 为本项目提供了基础框架
+
+## 支持我们
+
+如果 WeFlow 确实帮到了你，可以考虑请我们喝杯咖啡：
+
+
+> TRC20  **Address:** `TZCtAw8CaeARWZBfvjidCnTcfnAtf6nvS6`
 
 
 ## Star History
@@ -111,6 +104,4 @@ WeFlow/
 
 **请负责任地使用本工具，遵守相关法律法规**
 
-我们总是在向前走，却很少有机会回头看看
-
 </div>

electron/imageSearchWorker.ts

@@ -62,6 +62,12 @@ function isThumbnailDat(fileName: string): boolean {
   return fileName.includes('.t.dat') || fileName.includes('_t.dat')
 }
 
+function isHdDat(fileName: string): boolean {
+  const lower = fileName.toLowerCase()
+  const base = lower.endsWith('.dat') ? lower.slice(0, -4) : lower
+  return base.endsWith('_hd') || base.endsWith('_h')
+}
+
 function walkForDat(
   root: string,
   datName: string,
@@ -101,6 +107,8 @@ function walkForDat(
       if (!isLikelyImageDatBase(baseLower)) continue
       if (!hasXVariant(baseLower)) continue
       if (!matchesDatName(lower, datName)) continue
+      // 排除高清图片格式 (_hd, _h)
+      if (isHdDat(lower)) continue
       matchedBases.add(baseLower)
       const isThumb = isThumbnailDat(lower)
       if (!allowThumbnail && isThumb) continue

electron/main.ts

@@ -1,6 +1,7 @@
-import { app, BrowserWindow, ipcMain, nativeTheme } from 'electron'
+import './preload-env'
+import { app, BrowserWindow, ipcMain, nativeTheme, session } from 'electron'
 import { Worker } from 'worker_threads'
-import { join } from 'path'
+import { join, dirname } from 'path'
 import { autoUpdater } from 'electron-updater'
 import { readFile, writeFile, mkdir } from 'fs/promises'
 import { existsSync } from 'fs'
@@ -13,8 +14,14 @@ import { imagePreloadService } from './services/imagePreloadService'
 import { analyticsService } from './services/analyticsService'
 import { groupAnalyticsService } from './services/groupAnalyticsService'
 import { annualReportService } from './services/annualReportService'
-import { exportService, ExportOptions } from './services/exportService'
+import { exportService, ExportOptions, ExportProgress } from './services/exportService'
 import { KeyService } from './services/keyService'
+import { voiceTranscribeService } from './services/voiceTranscribeService'
+import { videoService } from './services/videoService'
+import { snsService } from './services/snsService'
+import { contactExportService } from './services/contactExportService'
+import { windowsHelloService } from './services/windowsHelloService'
+
 
 // 配置自动更新
 autoUpdater.autoDownload = false
@@ -25,6 +32,47 @@ const AUTO_UPDATE_ENABLED =
   process.env.AUTO_UPDATE_ENABLED === '1' ||
   (process.env.AUTO_UPDATE_ENABLED == null && !process.env.VITE_DEV_SERVER_URL)
 
+// 使用白名单过滤 PATH，避免被第三方目录中的旧版 VC++ 运行库劫持。
+// 仅保留系统目录（Windows/System32/SysWOW64）和应用自身目录（可执行目录、resources）。
+function sanitizePathEnv() {
+  // 开发模式不做裁剪，避免影响本地工具链
+  if (process.env.VITE_DEV_SERVER_URL) return
+
+  const rawPath = process.env.PATH || process.env.Path
+  if (!rawPath) return
+
+  const sep = process.platform === 'win32' ? ';' : ':'
+  const parts = rawPath.split(sep).filter(Boolean)
+
+  const systemRoot = process.env.SystemRoot || process.env.WINDIR || ''
+  const safePrefixes = [
+    systemRoot,
+    systemRoot ? join(systemRoot, 'System32') : '',
+    systemRoot ? join(systemRoot, 'SysWOW64') : '',
+    dirname(process.execPath),
+    process.resourcesPath,
+    join(process.resourcesPath || '', 'resources')
+  ].filter(Boolean)
+
+  const normalize = (p: string) => p.replace(/\\/g, '/').toLowerCase()
+  const isSafe = (p: string) => {
+    const np = normalize(p)
+    return safePrefixes.some((prefix) => np.startsWith(normalize(prefix)))
+  }
+
+  const filtered = parts.filter(isSafe)
+  if (filtered.length !== parts.length) {
+    const removed = parts.filter((p) => !isSafe(p))
+    console.warn('[WeFlow] 使用白名单裁剪 PATH，移除目录:', removed)
+    const nextPath = filtered.join(sep)
+    process.env.PATH = nextPath
+    process.env.Path = nextPath
+  }
+}
+
+// 启动时立即清理 PATH，后续创建的 worker 也能继承安全的环境
+sanitizePathEnv()
+
 // 单例服务
 let configService: ConfigService | null = null
 
@@ -91,6 +139,28 @@ function createWindow(options: { autoShow?: boolean } = {}) {
     win.loadFile(join(__dirname, '../dist/index.html'))
   }
 
+  // 拦截请求，修改 Referer 和 User-Agent 以通过微信 CDN 鉴权
+  session.defaultSession.webRequest.onBeforeSendHeaders(
+    {
+      urls: [
+        '*://*.qpic.cn/*',
+        '*://*.qlogo.cn/*',
+        '*://*.wechat.com/*',
+        '*://*.weixin.qq.com/*'
+      ]
+    },
+    (details, callback) => {
+      details.requestHeaders['User-Agent'] = "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/107.0.0.0 Safari/537.36 MicroMessenger/7.0.20.1781(0x6700143B) WindowsWechat(0x63090719) XWEB/8351"
+      details.requestHeaders['Accept'] = "image/avif,image/webp,image/apng,image/svg+xml,image/*,*/*;q=0.8"
+      details.requestHeaders['Accept-Encoding'] = "gzip, deflate, br"
+      details.requestHeaders['Accept-Language'] = "zh-CN,zh;q=0.9"
+      details.requestHeaders['Referer'] = "https://servicewechat.com/"
+      details.requestHeaders['Connection'] = "keep-alive"
+      details.requestHeaders['Range'] = "bytes=0-"
+      callback({ cancel: false, requestHeaders: details.requestHeaders })
+    }
+  )
+
   return win
 }
 
@@ -164,10 +234,11 @@ function createOnboardingWindow() {
     : join(process.resourcesPath, 'icon.ico')
 
   onboardingWindow = new BrowserWindow({
-    width: 1100,
+    width: 960,
-    height: 720,
+    height: 680,
     minWidth: 900,
-    minHeight: 600,
+    minHeight: 620,
+    resizable: false,
     frame: false,
     transparent: true,
     backgroundColor: '#00000000',
@@ -198,6 +269,167 @@ function createOnboardingWindow() {
   return onboardingWindow
 }
 
+/**
+ * 创建独立的视频播放窗口
+ * 窗口大小会根据视频比例自动调整
+ */
+function createVideoPlayerWindow(videoPath: string, videoWidth?: number, videoHeight?: number) {
+  const isDev = !!process.env.VITE_DEV_SERVER_URL
+  const iconPath = isDev
+    ? join(__dirname, '../public/icon.ico')
+    : join(process.resourcesPath, 'icon.ico')
+
+  // 获取屏幕尺寸
+  const { screen } = require('electron')
+  const primaryDisplay = screen.getPrimaryDisplay()
+  const { width: screenWidth, height: screenHeight } = primaryDisplay.workAreaSize
+
+  // 计算窗口尺寸，只有标题栏 40px，控制栏悬浮
+  let winWidth = 854
+  let winHeight = 520
+  const titleBarHeight = 40
+
+  if (videoWidth && videoHeight && videoWidth > 0 && videoHeight > 0) {
+    const aspectRatio = videoWidth / videoHeight
+
+    const maxWidth = Math.floor(screenWidth * 0.85)
+    const maxHeight = Math.floor(screenHeight * 0.85)
+
+    if (aspectRatio >= 1) {
+      // 横向视频
+      winWidth = Math.min(videoWidth, maxWidth)
+      winHeight = Math.floor(winWidth / aspectRatio) + titleBarHeight
+
+      if (winHeight > maxHeight) {
+        winHeight = maxHeight
+        winWidth = Math.floor((winHeight - titleBarHeight) * aspectRatio)
+      }
+    } else {
+      // 竖向视频
+      const videoDisplayHeight = Math.min(videoHeight, maxHeight - titleBarHeight)
+      winHeight = videoDisplayHeight + titleBarHeight
+      winWidth = Math.floor(videoDisplayHeight * aspectRatio)
+
+      if (winWidth < 300) {
+        winWidth = 300
+        winHeight = Math.floor(winWidth / aspectRatio) + titleBarHeight
+      }
+    }
+
+    winWidth = Math.max(winWidth, 360)
+    winHeight = Math.max(winHeight, 280)
+  }
+
+  const win = new BrowserWindow({
+    width: winWidth,
+    height: winHeight,
+    minWidth: 360,
+    minHeight: 280,
+    icon: iconPath,
+    webPreferences: {
+      preload: join(__dirname, 'preload.js'),
+      contextIsolation: true,
+      nodeIntegration: false,
+      webSecurity: false
+    },
+    titleBarStyle: 'hidden',
+    titleBarOverlay: {
+      color: '#1a1a1a',
+      symbolColor: '#ffffff',
+      height: 40
+    },
+    show: false,
+    backgroundColor: '#000000',
+    autoHideMenuBar: true
+  })
+
+  win.once('ready-to-show', () => {
+    win.show()
+  })
+
+  const videoParam = `videoPath=${encodeURIComponent(videoPath)}`
+  if (process.env.VITE_DEV_SERVER_URL) {
+    win.loadURL(`${process.env.VITE_DEV_SERVER_URL}#/video-player-window?${videoParam}`)
+
+    win.webContents.on('before-input-event', (event, input) => {
+      if (input.key === 'F12' || (input.control && input.shift && input.key === 'I')) {
+        if (win.webContents.isDevToolsOpened()) {
+          win.webContents.closeDevTools()
+        } else {
+          win.webContents.openDevTools()
+        }
+        event.preventDefault()
+      }
+    })
+  } else {
+    win.loadFile(join(__dirname, '../dist/index.html'), {
+      hash: `/video-player-window?${videoParam}`
+    })
+  }
+
+  return win
+}
+
+/**
+ * 创建独立的聊天记录窗口
+ */
+function createChatHistoryWindow(sessionId: string, messageId: number) {
+  const isDev = !!process.env.VITE_DEV_SERVER_URL
+  const iconPath = isDev
+    ? join(__dirname, '../public/icon.ico')
+    : join(process.resourcesPath, 'icon.ico')
+
+  // 根据系统主题设置窗口背景色
+  const isDark = nativeTheme.shouldUseDarkColors
+
+  const win = new BrowserWindow({
+    width: 600,
+    height: 800,
+    minWidth: 400,
+    minHeight: 500,
+    icon: iconPath,
+    webPreferences: {
+      preload: join(__dirname, 'preload.js'),
+      contextIsolation: true,
+      nodeIntegration: false
+    },
+    titleBarStyle: 'hidden',
+    titleBarOverlay: {
+      color: '#00000000',
+      symbolColor: isDark ? '#ffffff' : '#1a1a1a',
+      height: 32
+    },
+    show: false,
+    backgroundColor: isDark ? '#1A1A1A' : '#F0F0F0',
+    autoHideMenuBar: true
+  })
+
+  win.once('ready-to-show', () => {
+    win.show()
+  })
+
+  if (process.env.VITE_DEV_SERVER_URL) {
+    win.loadURL(`${process.env.VITE_DEV_SERVER_URL}#/chat-history/${sessionId}/${messageId}`)
+
+    win.webContents.on('before-input-event', (event, input) => {
+      if (input.key === 'F12' || (input.control && input.shift && input.key === 'I')) {
+        if (win.webContents.isDevToolsOpened()) {
+          win.webContents.closeDevTools()
+        } else {
+          win.webContents.openDevTools()
+        }
+        event.preventDefault()
+      }
+    })
+  } else {
+    win.loadFile(join(__dirname, '../dist/index.html'), {
+      hash: `/chat-history/${sessionId}/${messageId}`
+    })
+  }
+
+  return win
+}
+
 function showMainWindow() {
   shouldShowMain = true
   if (mainWindowReady) {
@@ -304,7 +536,7 @@ function registerIpcHandlers() {
 
     // 监听下载进度
     autoUpdater.on('download-progress', (progress) => {
-      win?.webContents.send('app:downloadProgress', progress.percent)
+      win?.webContents.send('app:downloadProgress', progress)
     })
 
     // 下载完成后自动安装
@@ -354,6 +586,85 @@ function registerIpcHandlers() {
     }
   })
 
+  // 打开视频播放窗口
+  ipcMain.handle('window:openVideoPlayerWindow', (_, videoPath: string, videoWidth?: number, videoHeight?: number) => {
+    createVideoPlayerWindow(videoPath, videoWidth, videoHeight)
+  })
+
+  // 打开聊天记录窗口
+  ipcMain.handle('window:openChatHistoryWindow', (_, sessionId: string, messageId: number) => {
+    createChatHistoryWindow(sessionId, messageId)
+    return true
+  })
+
+  // 根据视频尺寸调整窗口大小
+  ipcMain.handle('window:resizeToFitVideo', (event, videoWidth: number, videoHeight: number) => {
+    const win = BrowserWindow.fromWebContents(event.sender)
+    if (!win || !videoWidth || !videoHeight) return
+
+    const { screen } = require('electron')
+    const primaryDisplay = screen.getPrimaryDisplay()
+    const { width: screenWidth, height: screenHeight } = primaryDisplay.workAreaSize
+
+    // 只有标题栏 40px，控制栏悬浮在视频上
+    const titleBarHeight = 40
+    const aspectRatio = videoWidth / videoHeight
+
+    const maxWidth = Math.floor(screenWidth * 0.85)
+    const maxHeight = Math.floor(screenHeight * 0.85)
+
+    let winWidth: number
+    let winHeight: number
+
+    if (aspectRatio >= 1) {
+      // 横向视频 - 以宽度为基准
+      winWidth = Math.min(videoWidth, maxWidth)
+      winHeight = Math.floor(winWidth / aspectRatio) + titleBarHeight
+
+      if (winHeight > maxHeight) {
+        winHeight = maxHeight
+        winWidth = Math.floor((winHeight - titleBarHeight) * aspectRatio)
+      }
+    } else {
+      // 竖向视频 - 以高度为基准
+      const videoDisplayHeight = Math.min(videoHeight, maxHeight - titleBarHeight)
+      winHeight = videoDisplayHeight + titleBarHeight
+      winWidth = Math.floor(videoDisplayHeight * aspectRatio)
+
+      // 确保宽度不会太窄
+      if (winWidth < 300) {
+        winWidth = 300
+        winHeight = Math.floor(winWidth / aspectRatio) + titleBarHeight
+      }
+    }
+
+    winWidth = Math.max(winWidth, 360)
+    winHeight = Math.max(winHeight, 280)
+
+    // 调整窗口大小并居中
+    win.setSize(winWidth, winHeight)
+    win.center()
+  })
+
+  // 视频相关
+  ipcMain.handle('video:getVideoInfo', async (_, videoMd5: string) => {
+    try {
+      const result = await videoService.getVideoInfo(videoMd5)
+      return { success: true, ...result }
+    } catch (e) {
+      return { success: false, error: String(e), exists: false }
+    }
+  })
+
+  ipcMain.handle('video:parseVideoMd5', async (_, content: string) => {
+    try {
+      const md5 = videoService.parseVideoMd5(content)
+      return { success: true, md5 }
+    } catch (e) {
+      return { success: false, error: String(e) }
+    }
+  })
+
   // 数据库路径相关
   ipcMain.handle('dbpath:autoDetect', async () => {
     return dbPathService.autoDetect()
@@ -381,6 +692,8 @@ function registerIpcHandlers() {
     return true
   })
 
+
+
   // 聊天相关
   ipcMain.handle('chat:connect', async () => {
     return chatService.connect()
@@ -390,8 +703,12 @@ function registerIpcHandlers() {
     return chatService.getSessions()
   })
 
-  ipcMain.handle('chat:getMessages', async (_, sessionId: string, offset?: number, limit?: number) => {
+  ipcMain.handle('chat:enrichSessionsContactInfo', async (_, usernames: string[]) => {
-    return chatService.getMessages(sessionId, offset, limit)
+    return chatService.enrichSessionsContactInfo(usernames)
+  })
+
+  ipcMain.handle('chat:getMessages', async (_, sessionId: string, offset?: number, limit?: number, startTime?: number, endTime?: number, ascending?: boolean) => {
+    return chatService.getMessages(sessionId, offset, limit, startTime, endTime, ascending)
   })
 
   ipcMain.handle('chat:getLatestMessages', async (_, sessionId: string, limit?: number) => {
@@ -399,11 +716,19 @@ function registerIpcHandlers() {
   })
 
   ipcMain.handle('chat:getContact', async (_, username: string) => {
-    return chatService.getContact(username)
+    return await chatService.getContact(username)
   })
 
   ipcMain.handle('chat:getContactAvatar', async (_, username: string) => {
-    return chatService.getContactAvatar(username)
+    return await chatService.getContactAvatar(username)
+  })
+
+  ipcMain.handle('chat:getContacts', async () => {
+    return await chatService.getContacts()
+  })
+
+  ipcMain.handle('chat:getCachedMessages', async (_, sessionId: string) => {
+    return chatService.getCachedSessionMessages(sessionId)
   })
 
   ipcMain.handle('chat:getMyAvatarUrl', async () => {
@@ -427,14 +752,42 @@ function registerIpcHandlers() {
     return chatService.getImageData(sessionId, msgId)
   })
 
-  ipcMain.handle('chat:getVoiceData', async (_, sessionId: string, msgId: string) => {
+  ipcMain.handle('chat:getVoiceData', async (_, sessionId: string, msgId: string, createTime?: number, serverId?: string | number) => {
-    return chatService.getVoiceData(sessionId, msgId)
+    return chatService.getVoiceData(sessionId, msgId, createTime, serverId)
+  })
+  ipcMain.handle('chat:resolveVoiceCache', async (_, sessionId: string, msgId: string) => {
+    return chatService.resolveVoiceCache(sessionId, msgId)
   })
 
-  ipcMain.handle('chat:getMessageById', async (_, sessionId: string, localId: number) => {
+  ipcMain.handle('chat:getVoiceTranscript', async (event, sessionId: string, msgId: string, createTime?: number) => {
+    return chatService.getVoiceTranscript(sessionId, msgId, createTime, (text) => {
+      event.sender.send('chat:voiceTranscriptPartial', { msgId, text })
+    })
+  })
+
+  ipcMain.handle('chat:getMessage', async (_, sessionId: string, localId: number) => {
     return chatService.getMessageById(sessionId, localId)
   })
 
+  ipcMain.handle('chat:execQuery', async (_, kind: string, path: string | null, sql: string) => {
+    return chatService.execQuery(kind, path, sql)
+  })
+
+  ipcMain.handle('sns:getTimeline', async (_, limit: number, offset: number, usernames?: string[], keyword?: string, startTime?: number, endTime?: number) => {
+    return snsService.getTimeline(limit, offset, usernames, keyword, startTime, endTime)
+  })
+
+  ipcMain.handle('sns:debugResource', async (_, url: string) => {
+    return snsService.debugResource(url)
+  })
+
+  ipcMain.handle('sns:proxyImage', async (_, url: string) => {
+    return snsService.proxyImage(url)
+  })
+
+  // 私聊克隆
+
+
   ipcMain.handle('image:decrypt', async (_, payload: { sessionId?: string; imageMd5?: string; imageDatName?: string; force?: boolean }) => {
     return imageDecryptService.decryptImage(payload)
   })
@@ -446,18 +799,38 @@ function registerIpcHandlers() {
     return true
   })
 
+  // Windows Hello
+  ipcMain.handle('auth:hello', async (event, message?: string) => {
+    // 无论哪个窗口调用，都尝试强制附着到主窗口，确保体验一致
+    // 如果主窗口不存在（极其罕见），则回退到调用者窗口
+    const targetWin = (mainWindow && !mainWindow.isDestroyed())
+      ? mainWindow
+      : (BrowserWindow.fromWebContents(event.sender) || undefined)
+
+    return windowsHelloService.verify(message, targetWin)
+  })
+
   // 导出相关
-  ipcMain.handle('export:exportSessions', async (_, sessionIds: string[], outputDir: string, options: ExportOptions) => {
+  ipcMain.handle('export:exportSessions', async (event, sessionIds: string[], outputDir: string, options: ExportOptions) => {
-    return exportService.exportSessions(sessionIds, outputDir, options)
+    const onProgress = (progress: ExportProgress) => {
+      if (!event.sender.isDestroyed()) {
+        event.sender.send('export:progress', progress)
+      }
+    }
+    return exportService.exportSessions(sessionIds, outputDir, options, onProgress)
   })
 
   ipcMain.handle('export:exportSession', async (_, sessionId: string, outputPath: string, options: ExportOptions) => {
     return exportService.exportSessionToChatLab(sessionId, outputPath, options)
   })
 
+  ipcMain.handle('export:exportContacts', async (_, outputDir: string, options: any) => {
+    return contactExportService.exportContacts(outputDir, options)
+  })
+
   // 数据分析相关
-  ipcMain.handle('analytics:getOverallStatistics', async () => {
+  ipcMain.handle('analytics:getOverallStatistics', async (_, force?: boolean) => {
-    return analyticsService.getOverallStatistics()
+    return analyticsService.getOverallStatistics(force)
   })
 
   ipcMain.handle('analytics:getContactRankings', async (_, limit?: number) => {
@@ -468,6 +841,50 @@ function registerIpcHandlers() {
     return analyticsService.getTimeDistribution()
   })
 
+  // 缓存管理
+  ipcMain.handle('cache:clearAnalytics', async () => {
+    return analyticsService.clearCache()
+  })
+
+  ipcMain.handle('cache:clearImages', async () => {
+    const imageResult = await imageDecryptService.clearCache()
+    const emojiResult = chatService.clearCaches({ includeMessages: false, includeContacts: false, includeEmojis: true })
+    const errors = [imageResult, emojiResult]
+      .filter((result) => !result.success)
+      .map((result) => result.error)
+      .filter(Boolean) as string[]
+    if (errors.length > 0) {
+      return { success: false, error: errors.join('; ') }
+    }
+    return { success: true }
+  })
+
+  ipcMain.handle('cache:clearAll', async () => {
+    const [analyticsResult, imageResult] = await Promise.all([
+      analyticsService.clearCache(),
+      imageDecryptService.clearCache()
+    ])
+    const chatResult = chatService.clearCaches()
+    const errors = [analyticsResult, imageResult, chatResult]
+      .filter((result) => !result.success)
+      .map((result) => result.error)
+      .filter(Boolean) as string[]
+    if (errors.length > 0) {
+      return { success: false, error: errors.join('; ') }
+    }
+    return { success: true }
+  })
+
+  ipcMain.handle('whisper:downloadModel', async (event) => {
+    return voiceTranscribeService.downloadModel((progress) => {
+      event.sender.send('whisper:downloadProgress', progress)
+    })
+  })
+
+  ipcMain.handle('whisper:getModelStatus', async () => {
+    return voiceTranscribeService.getModelStatus()
+  })
+
   // 群聊分析相关
   ipcMain.handle('groupAnalytics:getGroupChats', async () => {
     return groupAnalyticsService.getGroupChats()
@@ -489,6 +906,10 @@ function registerIpcHandlers() {
     return groupAnalyticsService.getGroupMediaStats(chatroomId, startTime, endTime)
   })
 
+  ipcMain.handle('groupAnalytics:exportGroupMembers', async (_, chatroomId: string, outputPath: string) => {
+    return groupAnalyticsService.exportGroupMembers(chatroomId, outputPath)
+  })
+
   // 打开协议窗口
   ipcMain.handle('window:openAgreementWindow', async () => {
     createAgreementWindow()
@@ -671,9 +1092,11 @@ function checkForUpdatesOnStartup() {
 
 app.whenReady().then(() => {
   configService = new ConfigService()
-  const resourcesPath = app.isPackaged
+  const candidateResources = app.isPackaged
     ? join(process.resourcesPath, 'resources')
     : join(app.getAppPath(), 'resources')
+  const fallbackResources = join(process.cwd(), 'resources')
+  const resourcesPath = existsSync(candidateResources) ? candidateResources : fallbackResources
   const userDataPath = app.getPath('userData')
   wcdbService.setPaths(resourcesPath, userDataPath)
   wcdbService.setLogEnabled(configService.get('logEnabled') === true)
@@ -686,6 +1109,17 @@ app.whenReady().then(() => {
     createOnboardingWindow()
   }
 
+  // 解决朋友圈图片无法加载问题（添加 Referer）
+  session.defaultSession.webRequest.onBeforeSendHeaders(
+    {
+      urls: ['*://*.qpic.cn/*', '*://*.wx.qq.com/*']
+    },
+    (details, callback) => {
+      details.requestHeaders['Referer'] = 'https://wx.qq.com/'
+      callback({ requestHeaders: details.requestHeaders })
+    }
+  )
+
   // 启动时检测更新
   checkForUpdatesOnStartup()
 

electron/nodert.d.ts

@@ -0,0 +1,24 @@
+declare module '@nodert-win10-rs4/windows.security.credentials.ui' {
+    export enum UserConsentVerificationResult {
+        Verified = 0,
+        DeviceNotPresent = 1,
+        NotConfiguredForUser = 2,
+        DisabledByPolicy = 3,
+        DeviceBusy = 4,
+        RetriesExhausted = 5,
+        Canceled = 6
+    }
+
+    export enum UserConsentVerifierAvailability {
+        Available = 0,
+        DeviceNotPresent = 1,
+        NotConfiguredForUser = 2,
+        DisabledByPolicy = 3,
+        DeviceBusy = 4
+    }
+
+    export class UserConsentVerifier {
+        static checkAvailabilityAsync(callback: (err: Error | null, availability: UserConsentVerifierAvailability) => void): void;
+        static requestVerificationAsync(message: string, callback: (err: Error | null, result: UserConsentVerificationResult) => void): void;
+    }
+}

electron/preload-env.ts

@@ -0,0 +1,39 @@
+import { join, dirname } from 'path'
+
+/**
+ * 强制将本地资源目录添加到 PATH 最前端，确保优先加载本地 DLL
+ * 解决系统中存在冲突版本的 DLL 导致的应用崩溃问题
+ */
+function enforceLocalDllPriority() {
+    const isDev = !!process.env.VITE_DEV_SERVER_URL
+    const sep = process.platform === 'win32' ? ';' : ':'
+
+    let possiblePaths: string[] = []
+
+    if (isDev) {
+        // 开发环境
+        possiblePaths.push(join(process.cwd(), 'resources'))
+    } else {
+        // 生产环境
+        possiblePaths.push(dirname(process.execPath))
+        if (process.resourcesPath) {
+            possiblePaths.push(process.resourcesPath)
+        }
+    }
+
+    const dllPaths = possiblePaths.join(sep)
+
+    if (process.env.PATH) {
+        process.env.PATH = dllPaths + sep + process.env.PATH
+    } else {
+        process.env.PATH = dllPaths
+    }
+
+    console.log('[WeFlow] Environment PATH updated to enforce local DLL priority:', dllPaths)
+}
+
+try {
+    enforceLocalDllPriority()
+} catch (e) {
+    console.error('[WeFlow] Failed to enforce local DLL priority:', e)
+}

electron/preload.ts

@@ -9,6 +9,11 @@ contextBridge.exposeInMainWorld('electronAPI', {
     clear: () => ipcRenderer.invoke('config:clear')
   },
 
+  // 认证
+  auth: {
+    hello: (message?: string) => ipcRenderer.invoke('auth:hello', message)
+  },
+
 
   // 对话框
   dialog: {
@@ -29,7 +34,7 @@ contextBridge.exposeInMainWorld('electronAPI', {
     getVersion: () => ipcRenderer.invoke('app:getVersion'),
     checkForUpdates: () => ipcRenderer.invoke('app:checkForUpdates'),
     downloadAndInstall: () => ipcRenderer.invoke('app:downloadAndInstall'),
-    onDownloadProgress: (callback: (progress: number) => void) => {
+    onDownloadProgress: (callback: (progress: any) => void) => {
       ipcRenderer.on('app:downloadProgress', (_, progress) => callback(progress))
       return () => ipcRenderer.removeAllListeners('app:downloadProgress')
     },
@@ -53,7 +58,13 @@ contextBridge.exposeInMainWorld('electronAPI', {
     openAgreementWindow: () => ipcRenderer.invoke('window:openAgreementWindow'),
     completeOnboarding: () => ipcRenderer.invoke('window:completeOnboarding'),
     openOnboardingWindow: () => ipcRenderer.invoke('window:openOnboardingWindow'),
-    setTitleBarOverlay: (options: { symbolColor: string }) => ipcRenderer.send('window:setTitleBarOverlay', options)
+    setTitleBarOverlay: (options: { symbolColor: string }) => ipcRenderer.send('window:setTitleBarOverlay', options),
+    openVideoPlayerWindow: (videoPath: string, videoWidth?: number, videoHeight?: number) =>
+      ipcRenderer.invoke('window:openVideoPlayerWindow', videoPath, videoWidth, videoHeight),
+    resizeToFitVideo: (videoWidth: number, videoHeight: number) =>
+      ipcRenderer.invoke('window:resizeToFitVideo', videoWidth, videoHeight),
+    openChatHistoryWindow: (sessionId: string, messageId: number) =>
+      ipcRenderer.invoke('window:openChatHistoryWindow', sessionId, messageId)
   },
 
   // 数据库路径
@@ -69,7 +80,8 @@ contextBridge.exposeInMainWorld('electronAPI', {
       ipcRenderer.invoke('wcdb:testConnection', dbPath, hexKey, wxid),
     open: (dbPath: string, hexKey: string, wxid: string) =>
       ipcRenderer.invoke('wcdb:open', dbPath, hexKey, wxid),
-    close: () => ipcRenderer.invoke('wcdb:close')
+    close: () => ipcRenderer.invoke('wcdb:close'),
+
   },
 
   // 密钥获取
@@ -91,20 +103,38 @@ contextBridge.exposeInMainWorld('electronAPI', {
   chat: {
     connect: () => ipcRenderer.invoke('chat:connect'),
     getSessions: () => ipcRenderer.invoke('chat:getSessions'),
-    getMessages: (sessionId: string, offset?: number, limit?: number) =>
+    enrichSessionsContactInfo: (usernames: string[]) =>
-      ipcRenderer.invoke('chat:getMessages', sessionId, offset, limit),
+      ipcRenderer.invoke('chat:enrichSessionsContactInfo', usernames),
+    getMessages: (sessionId: string, offset?: number, limit?: number, startTime?: number, endTime?: number, ascending?: boolean) =>
+      ipcRenderer.invoke('chat:getMessages', sessionId, offset, limit, startTime, endTime, ascending),
     getLatestMessages: (sessionId: string, limit?: number) =>
       ipcRenderer.invoke('chat:getLatestMessages', sessionId, limit),
     getContact: (username: string) => ipcRenderer.invoke('chat:getContact', username),
     getContactAvatar: (username: string) => ipcRenderer.invoke('chat:getContactAvatar', username),
     getMyAvatarUrl: () => ipcRenderer.invoke('chat:getMyAvatarUrl'),
     downloadEmoji: (cdnUrl: string, md5?: string) => ipcRenderer.invoke('chat:downloadEmoji', cdnUrl, md5),
+    getCachedMessages: (sessionId: string) => ipcRenderer.invoke('chat:getCachedMessages', sessionId),
     close: () => ipcRenderer.invoke('chat:close'),
     getSessionDetail: (sessionId: string) => ipcRenderer.invoke('chat:getSessionDetail', sessionId),
     getImageData: (sessionId: string, msgId: string) => ipcRenderer.invoke('chat:getImageData', sessionId, msgId),
-    getVoiceData: (sessionId: string, msgId: string) => ipcRenderer.invoke('chat:getVoiceData', sessionId, msgId)
+    getVoiceData: (sessionId: string, msgId: string, createTime?: number, serverId?: string | number) =>
+      ipcRenderer.invoke('chat:getVoiceData', sessionId, msgId, createTime, serverId),
+    resolveVoiceCache: (sessionId: string, msgId: string) => ipcRenderer.invoke('chat:resolveVoiceCache', sessionId, msgId),
+    getVoiceTranscript: (sessionId: string, msgId: string, createTime?: number) => ipcRenderer.invoke('chat:getVoiceTranscript', sessionId, msgId, createTime),
+    onVoiceTranscriptPartial: (callback: (payload: { msgId: string; text: string }) => void) => {
+      const listener = (_: any, payload: { msgId: string; text: string }) => callback(payload)
+      ipcRenderer.on('chat:voiceTranscriptPartial', listener)
+      return () => ipcRenderer.removeListener('chat:voiceTranscriptPartial', listener)
+    },
+    execQuery: (kind: string, path: string | null, sql: string) =>
+      ipcRenderer.invoke('chat:execQuery', kind, path, sql),
+    getContacts: () => ipcRenderer.invoke('chat:getContacts'),
+    getMessage: (sessionId: string, localId: number) =>
+      ipcRenderer.invoke('chat:getMessage', sessionId, localId)
   },
 
+
+
   // 图片解密
   image: {
     decrypt: (payload: { sessionId?: string; imageMd5?: string; imageDatName?: string; force?: boolean }) =>
@@ -123,6 +153,12 @@ contextBridge.exposeInMainWorld('electronAPI', {
     }
   },
 
+  // 视频
+  video: {
+    getVideoInfo: (videoMd5: string) => ipcRenderer.invoke('video:getVideoInfo', videoMd5),
+    parseVideoMd5: (content: string) => ipcRenderer.invoke('video:parseVideoMd5', content)
+  },
+
   // 数据分析
   analytics: {
     getOverallStatistics: () => ipcRenderer.invoke('analytics:getOverallStatistics'),
@@ -134,13 +170,21 @@ contextBridge.exposeInMainWorld('electronAPI', {
     }
   },
 
+  // 缓存管理
+  cache: {
+    clearAnalytics: () => ipcRenderer.invoke('cache:clearAnalytics'),
+    clearImages: () => ipcRenderer.invoke('cache:clearImages'),
+    clearAll: () => ipcRenderer.invoke('cache:clearAll')
+  },
+
   // 群聊分析
   groupAnalytics: {
     getGroupChats: () => ipcRenderer.invoke('groupAnalytics:getGroupChats'),
     getGroupMembers: (chatroomId: string) => ipcRenderer.invoke('groupAnalytics:getGroupMembers', chatroomId),
     getGroupMessageRanking: (chatroomId: string, limit?: number, startTime?: number, endTime?: number) => ipcRenderer.invoke('groupAnalytics:getGroupMessageRanking', chatroomId, limit, startTime, endTime),
     getGroupActiveHours: (chatroomId: string, startTime?: number, endTime?: number) => ipcRenderer.invoke('groupAnalytics:getGroupActiveHours', chatroomId, startTime, endTime),
-    getGroupMediaStats: (chatroomId: string, startTime?: number, endTime?: number) => ipcRenderer.invoke('groupAnalytics:getGroupMediaStats', chatroomId, startTime, endTime)
+    getGroupMediaStats: (chatroomId: string, startTime?: number, endTime?: number) => ipcRenderer.invoke('groupAnalytics:getGroupMediaStats', chatroomId, startTime, endTime),
+    exportGroupMembers: (chatroomId: string, outputPath: string) => ipcRenderer.invoke('groupAnalytics:exportGroupMembers', chatroomId, outputPath)
   },
 
   // 年度报告
@@ -160,6 +204,31 @@ contextBridge.exposeInMainWorld('electronAPI', {
     exportSessions: (sessionIds: string[], outputDir: string, options: any) =>
       ipcRenderer.invoke('export:exportSessions', sessionIds, outputDir, options),
     exportSession: (sessionId: string, outputPath: string, options: any) =>
-      ipcRenderer.invoke('export:exportSession', sessionId, outputPath, options)
+      ipcRenderer.invoke('export:exportSession', sessionId, outputPath, options),
+    exportContacts: (outputDir: string, options: any) =>
+      ipcRenderer.invoke('export:exportContacts', outputDir, options),
+    onProgress: (callback: (payload: { current: number; total: number; currentSession: string; phase: string }) => void) => {
+      ipcRenderer.on('export:progress', (_, payload) => callback(payload))
+      return () => ipcRenderer.removeAllListeners('export:progress')
+    }
+  },
+
+  whisper: {
+    downloadModel: () =>
+      ipcRenderer.invoke('whisper:downloadModel'),
+    getModelStatus: () =>
+      ipcRenderer.invoke('whisper:getModelStatus'),
+    onDownloadProgress: (callback: (payload: { modelName: string; downloadedBytes: number; totalBytes?: number; percent?: number }) => void) => {
+      ipcRenderer.on('whisper:downloadProgress', (_, payload) => callback(payload))
+      return () => ipcRenderer.removeAllListeners('whisper:downloadProgress')
+    }
+  },
+
+  // 朋友圈
+  sns: {
+    getTimeline: (limit: number, offset: number, usernames?: string[], keyword?: string, startTime?: number, endTime?: number) =>
+      ipcRenderer.invoke('sns:getTimeline', limit, offset, usernames, keyword, startTime, endTime),
+    debugResource: (url: string) => ipcRenderer.invoke('sns:debugResource', url),
+    proxyImage: (url: string) => ipcRenderer.invoke('sns:proxyImage', url)
   }
 })

electron/services/analyticsService.ts

@@ -1,5 +1,8 @@
 import { ConfigService } from './config'
 import { wcdbService } from './wcdbService'
+import { join } from 'path'
+import { readFile, writeFile, rm } from 'fs/promises'
+import { app } from 'electron'
 
 export interface ChatStatistics {
   totalMessages: number
@@ -253,15 +256,31 @@ class AnalyticsService {
     sessionIds: string[],
     beginTimestamp = 0,
     endTimestamp = 0,
-    window?: any
+    window?: any,
+    force = false
   ): Promise<{ success: boolean; data?: any; source?: string; error?: string }> {
     const cacheKey = this.buildAggregateCacheKey(sessionIds, beginTimestamp, endTimestamp)
-    if (this.aggregateCache && this.aggregateCache.key === cacheKey) {
+
+    if (force) {
+      if (this.aggregateCache) this.aggregateCache = null
+      if (this.fallbackAggregateCache) this.fallbackAggregateCache = null
+    }
+
+    if (!force && this.aggregateCache && this.aggregateCache.key === cacheKey) {
       if (Date.now() - this.aggregateCache.updatedAt < 5 * 60 * 1000) {
         return { success: true, data: this.aggregateCache.data, source: 'cache' }
       }
     }
 
+    // 尝试从文件加载缓存
+    if (!force) {
+      const fileCache = await this.loadCacheFromFile()
+      if (fileCache && fileCache.key === cacheKey) {
+        this.aggregateCache = fileCache
+        return { success: true, data: fileCache.data, source: 'file-cache' }
+      }
+    }
+
     if (this.aggregatePromise && this.aggregatePromise.key === cacheKey) {
       return this.aggregatePromise.promise
     }
@@ -291,7 +310,12 @@ class AnalyticsService {
 
     this.aggregatePromise = { key: cacheKey, promise }
     try {
-      return await promise
+      const result = await promise
+      // 如果计算成功，同时写入此文件缓存
+      if (result.success && result.data && result.source !== 'cache') {
+        this.saveCacheToFile({ key: cacheKey, data: this.aggregateCache?.data, updatedAt: Date.now() })
+      }
+      return result
     } finally {
       if (this.aggregatePromise && this.aggregatePromise.key === cacheKey) {
         this.aggregatePromise = null
@@ -299,6 +323,25 @@ class AnalyticsService {
     }
   }
 
+  private getCacheFilePath(): string {
+    return join(app.getPath('documents'), 'WeFlow', 'analytics_cache.json')
+  }
+
+  private async loadCacheFromFile(): Promise<{ key: string; data: any; updatedAt: number } | null> {
+    try {
+      const raw = await readFile(this.getCacheFilePath(), 'utf-8')
+      return JSON.parse(raw)
+    } catch { return null }
+  }
+
+  private async saveCacheToFile(data: any) {
+    try {
+      await writeFile(this.getCacheFilePath(), JSON.stringify(data))
+    } catch (e) {
+      console.error('保存统计缓存失败:', e)
+    }
+  }
+
   private normalizeAggregateSessions(
     sessions: Record<string, any> | undefined,
     idMap: Record<string, string> | undefined
@@ -326,7 +369,7 @@ class AnalyticsService {
     void results
   }
 
-  async getOverallStatistics(): Promise<{ success: boolean; data?: ChatStatistics; error?: string }> {
+  async getOverallStatistics(force = false): Promise<{ success: boolean; data?: ChatStatistics; error?: string }> {
     try {
       const conn = await this.ensureConnected()
       if (!conn.success || !conn.cleanedWxid) return { success: false, error: conn.error }
@@ -340,7 +383,7 @@ class AnalyticsService {
       const win = BrowserWindow.getAllWindows()[0]
       this.setProgress(win, '正在执行原生数据聚合...', 30)
 
-      const result = await this.getAggregateWithFallback(sessionInfo.usernames, 0, 0, win)
+      const result = await this.getAggregateWithFallback(sessionInfo.usernames, 0, 0, win, force)
 
       if (!result.success || !result.data) {
         return { success: false, error: result.error || '聚合统计失败' }
@@ -458,8 +501,8 @@ class AnalyticsService {
 
       const d = result.data
 
-      // SQLite strftime('%w') 返回 0=Sun, 1=Mon...6=Sat
+      // SQLite strftime('%w') 返回 0=周日, 1=周一...6=周六
-      // 前端期望 1=Mon...7=Sun
+      // 前端期望 1=周一...7=周日
       const weekdayDistribution: Record<number, number> = {}
       for (const [w, count] of Object.entries(d.weekday)) {
         const sqliteW = parseInt(w, 10)
@@ -485,6 +528,18 @@ class AnalyticsService {
       return { success: false, error: String(e) }
     }
   }
+
+  async clearCache(): Promise<{ success: boolean; error?: string }> {
+    this.aggregateCache = null
+    this.fallbackAggregateCache = null
+    this.aggregatePromise = null
+    try {
+      await rm(this.getCacheFilePath(), { force: true })
+      return { success: true }
+    } catch (e) {
+      return { success: false, error: String(e) }
+    }
+  }
 }
 
 export const analyticsService = new AnalyticsService()

electron/services/config.ts

@@ -8,17 +8,30 @@ interface ConfigSchema {
   onboardingDone: boolean
   imageXorKey: number
   imageAesKey: string
-  
+  wxidConfigs: Record<string, { decryptKey?: string; imageXorKey?: number; imageAesKey?: string; updatedAt?: number }>
+
   // 缓存相关
   cachePath: string
   lastOpenedDb: string
   lastSession: string
-  
+
   // 界面相关
   theme: 'light' | 'dark' | 'system'
   themeId: string
   language: string
   logEnabled: boolean
+  llmModelPath: string
+  whisperModelName: string
+  whisperModelDir: string
+  whisperDownloadSource: string
+  autoTranscribeVoice: boolean
+  transcribeLanguages: string[]
+  exportDefaultConcurrency: number
+
+  // 安全相关
+  authEnabled: boolean
+  authPassword: string // SHA-256 hash
+  authUseHello: boolean
 }
 
 export class ConfigService {
@@ -34,13 +47,25 @@ export class ConfigService {
         onboardingDone: false,
         imageXorKey: 0,
         imageAesKey: '',
+        wxidConfigs: {},
         cachePath: '',
         lastOpenedDb: '',
         lastSession: '',
         theme: 'system',
         themeId: 'cloud-dancer',
         language: 'zh-CN',
-        logEnabled: false
+        logEnabled: false,
+        llmModelPath: '',
+        whisperModelName: 'base',
+        whisperModelDir: '',
+        whisperDownloadSource: 'tsinghua',
+        autoTranscribeVoice: false,
+        transcribeLanguages: ['zh'],
+        exportDefaultConcurrency: 2,
+
+        authEnabled: false,
+        authPassword: '',
+        authUseHello: false
       }
     })
   }

electron/services/contactCacheService.ts

@@ -0,0 +1,92 @@
+import { join, dirname } from 'path'
+import { existsSync, mkdirSync, readFileSync, writeFileSync, rmSync } from 'fs'
+import { app } from 'electron'
+
+export interface ContactCacheEntry {
+  displayName?: string
+  avatarUrl?: string
+  updatedAt: number
+}
+
+export class ContactCacheService {
+  private readonly cacheFilePath: string
+  private cache: Record<string, ContactCacheEntry> = {}
+
+  constructor(cacheBasePath?: string) {
+    const basePath = cacheBasePath && cacheBasePath.trim().length > 0
+      ? cacheBasePath
+      : join(app.getPath('documents'), 'WeFlow')
+    this.cacheFilePath = join(basePath, 'contacts.json')
+    this.ensureCacheDir()
+    this.loadCache()
+  }
+
+  private ensureCacheDir() {
+    const dir = dirname(this.cacheFilePath)
+    if (!existsSync(dir)) {
+      mkdirSync(dir, { recursive: true })
+    }
+  }
+
+  private loadCache() {
+    if (!existsSync(this.cacheFilePath)) return
+    try {
+      const raw = readFileSync(this.cacheFilePath, 'utf8')
+      const parsed = JSON.parse(raw)
+      if (parsed && typeof parsed === 'object') {
+        // 清除无效的头像数据（hex 格式而非正确的 base64）
+        for (const key of Object.keys(parsed)) {
+          const entry = parsed[key]
+          if (entry?.avatarUrl && entry.avatarUrl.includes('base64,ffd8')) {
+            // 这是错误的 hex 格式，清除它
+            entry.avatarUrl = undefined
+          }
+        }
+        this.cache = parsed
+      }
+    } catch (error) {
+      console.error('ContactCacheService: 载入缓存失败', error)
+      this.cache = {}
+    }
+  }
+
+  get(username: string): ContactCacheEntry | undefined {
+    return this.cache[username]
+  }
+
+  getAllEntries(): Record<string, ContactCacheEntry> {
+    return { ...this.cache }
+  }
+
+  setEntries(entries: Record<string, ContactCacheEntry>): void {
+    if (Object.keys(entries).length === 0) return
+    let changed = false
+    for (const [username, entry] of Object.entries(entries)) {
+      const existing = this.cache[username]
+      if (!existing || entry.updatedAt >= existing.updatedAt) {
+        this.cache[username] = entry
+        changed = true
+      }
+    }
+    if (changed) {
+      this.persist()
+    }
+  }
+
+  private persist() {
+    try {
+      writeFileSync(this.cacheFilePath, JSON.stringify(this.cache), 'utf8')
+    } catch (error) {
+      console.error('ContactCacheService: 保存缓存失败', error)
+    }
+  }
+
+  clear(): void {
+    this.cache = {}
+    try {
+      rmSync(this.cacheFilePath, { force: true })
+    } catch (error) {
+      console.error('ContactCacheService: 清理缓存失败', error)
+    }
+  }
+}

electron/services/contactExportService.ts

@@ -0,0 +1,159 @@
+import * as fs from 'fs'
+import * as path from 'path'
+import { chatService } from './chatService'
+
+interface ContactExportOptions {
+    format: 'json' | 'csv' | 'vcf'
+    exportAvatars: boolean
+    contactTypes: {
+        friends: boolean
+        groups: boolean
+        officials: boolean
+    }
+}
+
+/**
+ * 联系人导出服务
+ */
+class ContactExportService {
+    /**
+     * 导出联系人
+     */
+    async exportContacts(
+        outputDir: string,
+        options: ContactExportOptions
+    ): Promise<{ success: boolean; successCount?: number; error?: string }> {
+        try {
+            // 获取所有联系人
+            const contactsResult = await chatService.getContacts()
+            if (!contactsResult.success || !contactsResult.contacts) {
+                return { success: false, error: contactsResult.error || '获取联系人失败' }
+            }
+
+            let contacts = contactsResult.contacts
+
+            // 根据类型过滤
+            contacts = contacts.filter(c => {
+                if (c.type === 'friend' && !options.contactTypes.friends) return false
+                if (c.type === 'group' && !options.contactTypes.groups) return false
+                if (c.type === 'official' && !options.contactTypes.officials) return false
+                return true
+            })
+
+            if (contacts.length === 0) {
+                return { success: false, error: '没有符合条件的联系人' }
+            }
+
+            // 确保输出目录存在
+            if (!fs.existsSync(outputDir)) {
+                fs.mkdirSync(outputDir, { recursive: true })
+            }
+
+            const timestamp = new Date().toISOString().replace(/[:.]/g, '-').slice(0, -5)
+            let outputPath: string
+
+            switch (options.format) {
+                case 'json':
+                    outputPath = path.join(outputDir, `contacts_${timestamp}.json`)
+                    await this.exportToJSON(contacts, outputPath)
+                    break
+                case 'csv':
+                    outputPath = path.join(outputDir, `contacts_${timestamp}.csv`)
+                    await this.exportToCSV(contacts, outputPath)
+                    break
+                case 'vcf':
+                    outputPath = path.join(outputDir, `contacts_${timestamp}.vcf`)
+                    await this.exportToVCF(contacts, outputPath)
+                    break
+                default:
+                    return { success: false, error: '不支持的导出格式' }
+            }
+
+            return { success: true, successCount: contacts.length }
+        } catch (e) {
+            return { success: false, error: String(e) }
+        }
+    }
+
+    /**
+     * 导出为JSON格式
+     */
+    private async exportToJSON(contacts: any[], outputPath: string): Promise<void> {
+        const data = {
+            exportedAt: new Date().toISOString(),
+            count: contacts.length,
+            contacts: contacts.map(c => ({
+                username: c.username,
+                displayName: c.displayName,
+                remark: c.remark,
+                nickname: c.nickname,
+                type: c.type
+            }))
+        }
+        fs.writeFileSync(outputPath, JSON.stringify(data, null, 2), 'utf-8')
+    }
+
+    /**
+     * 导出为CSV格式
+     */
+    private async exportToCSV(contacts: any[], outputPath: string): Promise<void> {
+        const headers = ['用户名', '显示名称', '备注', '昵称', '类型']
+        const rows = contacts.map(c => [
+            c.username || '',
+            c.displayName || '',
+            c.remark || '',
+            c.nickname || '',
+            this.getTypeLabel(c.type)
+        ])
+
+        const csvContent = [
+            headers.join(','),
+            ...rows.map(row => row.map(cell => `"${cell}"`).join(','))
+        ].join('\n')
+
+        fs.writeFileSync(outputPath, '\uFEFF' + csvContent, 'utf-8') // 添加BOM以支持Excel
+    }
+
+    /**
+     * 导出为VCF格式（vCard）
+     */
+    private async exportToVCF(contacts: any[], outputPath: string): Promise<void> {
+        const vcards = contacts
+            .filter(c => c.type === 'friend') // VCF通常只用于个人联系人
+            .map(c => {
+                const lines = ['BEGIN:VCARD', 'VERSION:3.0']
+
+                // 全名
+                lines.push(`FN:${c.displayName || c.username}`)
+
+                // 昵称
+                if (c.nickname) {
+                    lines.push(`NICKNAME:${c.nickname}`)
+                }
+
+                // 备注
+                if (c.remark) {
+                    lines.push(`NOTE:${c.remark}`)
+                }
+
+                // 微信ID
+                lines.push(`X-WECHAT-ID:${c.username}`)
+
+                lines.push('END:VCARD')
+                return lines.join('\r\n')
+            })
+
+        fs.writeFileSync(outputPath, vcards.join('\r\n\r\n'), 'utf-8')
+    }
+
+    private getTypeLabel(type: string): string {
+        switch (type) {
+            case 'friend': return '好友'
+            case 'group': return '群聊'
+            case 'official': return '公众号'
+            default: return '其他'
+        }
+    }
+}
+
+export const contactExportService = new ContactExportService()

electron/services/dbPathService.ts

@@ -18,8 +18,7 @@ export class DbPathService {
 
       // 微信4.x 数据目录
       possiblePaths.push(join(home, 'Documents', 'xwechat_files'))
-      // 旧版微信数据目录
+
-      possiblePaths.push(join(home, 'Documents', 'WeChat Files'))
 
       for (const path of possiblePaths) {
         if (existsSync(path)) {
@@ -27,7 +26,7 @@ export class DbPathService {
           if (rootName !== 'xwechat_files' && rootName !== 'wechat files') {
             continue
           }
-          
+
           // 检查是否有有效的账号目录
           const accounts = this.findAccountDirs(path)
           if (accounts.length > 0) {
@@ -47,10 +46,10 @@ export class DbPathService {
    */
   findAccountDirs(rootPath: string): string[] {
     const accounts: string[] = []
-    
+
     try {
       const entries = readdirSync(rootPath)
-      
+
       for (const entry of entries) {
         const entryPath = join(rootPath, entry)
         let stat: ReturnType<typeof statSync>
@@ -59,7 +58,7 @@ export class DbPathService {
         } catch {
           continue
         }
-        
+
         if (stat.isDirectory()) {
           if (!this.isPotentialAccountName(entry)) continue
 
@@ -69,8 +68,8 @@ export class DbPathService {
           }
         }
       }
-    } catch {}
+    } catch { }
-    
+
     return accounts
   }
 
@@ -124,7 +123,7 @@ export class DbPathService {
    */
   scanWxids(rootPath: string): WxidInfo[] {
     const wxids: WxidInfo[] = []
-    
+
     try {
       if (this.isAccountDir(rootPath)) {
         const wxid = basename(rootPath)
@@ -133,14 +132,14 @@ export class DbPathService {
       }
 
       const accounts = this.findAccountDirs(rootPath)
-      
+
       for (const account of accounts) {
         const fullPath = join(rootPath, account)
         const modifiedTime = this.getAccountModifiedTime(fullPath)
         wxids.push({ wxid: account, modifiedTime })
       }
-    } catch {}
+    } catch { }
-    
+
     return wxids.sort((a, b) => {
       if (b.modifiedTime !== a.modifiedTime) return b.modifiedTime - a.modifiedTime
       return a.wxid.localeCompare(b.wxid)

electron/services/exportHtml.css

@@ -0,0 +1,301 @@
+:root {
+  color-scheme: light;
+  --bg: #f6f7fb;
+  --card: #ffffff;
+  --text: #1f2a37;
+  --muted: #6b7280;
+  --accent: #4f46e5;
+  --sent: #dbeafe;
+  --received: #ffffff;
+  --border: #e5e7eb;
+  --shadow: 0 12px 30px rgba(15, 23, 42, 0.08);
+  --radius: 16px;
+}
+
+* {
+  box-sizing: border-box;
+}
+
+body {
+  margin: 0;
+  font-family: "PingFang SC", "Microsoft YaHei", system-ui, -apple-system, sans-serif;
+  background: var(--bg);
+  color: var(--text);
+}
+
+.page {
+  max-width: 1080px;
+  margin: 32px auto 60px;
+  padding: 0 20px;
+}
+
+.header {
+  background: var(--card);
+  border-radius: var(--radius);
+  box-shadow: var(--shadow);
+  padding: 24px;
+  margin-bottom: 24px;
+}
+
+.title {
+  font-size: 24px;
+  font-weight: 600;
+  margin: 0 0 8px;
+}
+
+.meta {
+  color: var(--muted);
+  font-size: 14px;
+  display: flex;
+  flex-wrap: wrap;
+  gap: 12px;
+}
+
+.controls {
+  display: grid;
+  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
+  gap: 16px;
+  margin-top: 20px;
+}
+
+.control {
+  display: flex;
+  flex-direction: column;
+  gap: 6px;
+}
+
+.control label {
+  font-size: 13px;
+  color: var(--muted);
+}
+
+.control input,
+.control select,
+.control button {
+  border-radius: 12px;
+  border: 1px solid var(--border);
+  padding: 10px 12px;
+  font-size: 14px;
+  font-family: inherit;
+}
+
+.control button {
+  background: var(--accent);
+  color: #fff;
+  border: none;
+  cursor: pointer;
+  transition: transform 0.1s ease;
+}
+
+.control button:active {
+  transform: scale(0.98);
+}
+
+.stats {
+  font-size: 13px;
+  color: var(--muted);
+  display: flex;
+  align-items: flex-end;
+}
+
+.message-list {
+  display: flex;
+  flex-direction: column;
+  gap: 18px;
+}
+
+.message {
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+}
+
+.message.hidden {
+  display: none;
+}
+
+.message-time {
+  font-size: 12px;
+  color: var(--muted);
+  margin-bottom: 6px;
+}
+
+.message-row {
+  display: flex;
+  gap: 12px;
+  align-items: flex-end;
+}
+
+.message.sent .message-row {
+  flex-direction: row-reverse;
+}
+
+.avatar {
+  width: 40px;
+  height: 40px;
+  border-radius: 12px;
+  background: #eef2ff;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  overflow: hidden;
+  flex-shrink: 0;
+  color: #475569;
+  font-weight: 600;
+}
+
+.avatar img {
+  width: 100%;
+  height: 100%;
+  object-fit: cover;
+}
+
+.bubble {
+  max-width: min(70%, 720px);
+  background: var(--received);
+  border-radius: 18px;
+  padding: 12px 14px;
+  border: 1px solid var(--border);
+  box-shadow: 0 8px 20px rgba(15, 23, 42, 0.06);
+}
+
+.message.sent .bubble {
+  background: var(--sent);
+  border-color: transparent;
+}
+
+.sender-name {
+  font-size: 12px;
+  color: var(--muted);
+  margin-bottom: 6px;
+}
+
+.message-content {
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+  font-size: 14px;
+  line-height: 1.6;
+}
+
+.message-text {
+  word-break: break-word;
+}
+
+.inline-emoji {
+  width: 22px;
+  height: 22px;
+  vertical-align: text-bottom;
+  margin: 0 2px;
+}
+
+.message-media {
+  border-radius: 14px;
+  max-width: 100%;
+}
+
+.previewable {
+  cursor: zoom-in;
+}
+
+.message-media.image,
+.message-media.emoji {
+  max-height: 260px;
+  object-fit: contain;
+  background: #f1f5f9;
+  padding: 6px;
+}
+
+.message-media.emoji {
+  max-height: 160px;
+  width: auto;
+}
+
+.message-media.video {
+  max-height: 360px;
+  background: #111827;
+}
+
+.message-media.audio {
+  width: 260px;
+}
+
+.image-preview {
+  position: fixed;
+  inset: 0;
+  background: rgba(15, 23, 42, 0.7);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  opacity: 0;
+  pointer-events: none;
+  transition: opacity 0.2s ease;
+  z-index: 999;
+}
+
+.image-preview.active {
+  opacity: 1;
+  pointer-events: auto;
+}
+
+.image-preview img {
+  max-width: min(90vw, 1200px);
+  max-height: 90vh;
+  border-radius: 18px;
+  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.35);
+  background: #0f172a;
+  transition: transform 0.1s ease;
+  cursor: zoom-out;
+}
+
+body[data-theme="cloud-dancer"] {
+  --accent: #6b8cff;
+  --sent: #e0e7ff;
+  --received: #ffffff;
+  --border: #d8e0f7;
+  --bg: #f6f7fb;
+}
+
+body[data-theme="corundum-blue"] {
+  --accent: #2563eb;
+  --sent: #dbeafe;
+  --received: #ffffff;
+  --border: #c7d2fe;
+  --bg: #eef2ff;
+}
+
+body[data-theme="kiwi-green"] {
+  --accent: #16a34a;
+  --sent: #dcfce7;
+  --received: #ffffff;
+  --border: #bbf7d0;
+  --bg: #f0fdf4;
+}
+
+body[data-theme="spicy-red"] {
+  --accent: #e11d48;
+  --sent: #ffe4e6;
+  --received: #ffffff;
+  --border: #fecdd3;
+  --bg: #fff1f2;
+}
+
+body[data-theme="teal-water"] {
+  --accent: #0f766e;
+  --sent: #ccfbf1;
+  --received: #ffffff;
+  --border: #99f6e4;
+  --bg: #f0fdfa;
+}
+
+.highlight {
+  outline: 2px solid var(--accent);
+  outline-offset: 4px;
+  border-radius: 18px;
+}
+
+.empty {
+  text-align: center;
+  color: var(--muted);
+  padding: 40px;
+}

electron/services/exportHtmlStyles.ts

@@ -0,0 +1,302 @@
+export const EXPORT_HTML_STYLES = `:root {
+  color-scheme: light;
+  --bg: #f6f7fb;
+  --card: #ffffff;
+  --text: #1f2a37;
+  --muted: #6b7280;
+  --accent: #4f46e5;
+  --sent: #dbeafe;
+  --received: #ffffff;
+  --border: #e5e7eb;
+  --shadow: 0 12px 30px rgba(15, 23, 42, 0.08);
+  --radius: 16px;
+}
+
+* {
+  box-sizing: border-box;
+}
+
+body {
+  margin: 0;
+  font-family: "PingFang SC", "Microsoft YaHei", system-ui, -apple-system, sans-serif;
+  background: var(--bg);
+  color: var(--text);
+}
+
+.page {
+  max-width: 1080px;
+  margin: 32px auto 60px;
+  padding: 0 20px;
+}
+
+.header {
+  background: var(--card);
+  border-radius: var(--radius);
+  box-shadow: var(--shadow);
+  padding: 24px;
+  margin-bottom: 24px;
+}
+
+.title {
+  font-size: 24px;
+  font-weight: 600;
+  margin: 0 0 8px;
+}
+
+.meta {
+  color: var(--muted);
+  font-size: 14px;
+  display: flex;
+  flex-wrap: wrap;
+  gap: 12px;
+}
+
+.controls {
+  display: grid;
+  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
+  gap: 16px;
+  margin-top: 20px;
+}
+
+.control {
+  display: flex;
+  flex-direction: column;
+  gap: 6px;
+}
+
+.control label {
+  font-size: 13px;
+  color: var(--muted);
+}
+
+.control input,
+.control select,
+.control button {
+  border-radius: 12px;
+  border: 1px solid var(--border);
+  padding: 10px 12px;
+  font-size: 14px;
+  font-family: inherit;
+}
+
+.control button {
+  background: var(--accent);
+  color: #fff;
+  border: none;
+  cursor: pointer;
+  transition: transform 0.1s ease;
+}
+
+.control button:active {
+  transform: scale(0.98);
+}
+
+.stats {
+  font-size: 13px;
+  color: var(--muted);
+  display: flex;
+  align-items: flex-end;
+}
+
+.message-list {
+  display: flex;
+  flex-direction: column;
+  gap: 18px;
+}
+
+.message {
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+}
+
+.message.hidden {
+  display: none;
+}
+
+.message-time {
+  font-size: 12px;
+  color: var(--muted);
+  margin-bottom: 6px;
+}
+
+.message-row {
+  display: flex;
+  gap: 12px;
+  align-items: flex-end;
+}
+
+.message.sent .message-row {
+  flex-direction: row-reverse;
+}
+
+.avatar {
+  width: 40px;
+  height: 40px;
+  border-radius: 12px;
+  background: #eef2ff;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  overflow: hidden;
+  flex-shrink: 0;
+  color: #475569;
+  font-weight: 600;
+}
+
+.avatar img {
+  width: 100%;
+  height: 100%;
+  object-fit: cover;
+}
+
+.bubble {
+  max-width: min(70%, 720px);
+  background: var(--received);
+  border-radius: 18px;
+  padding: 12px 14px;
+  border: 1px solid var(--border);
+  box-shadow: 0 8px 20px rgba(15, 23, 42, 0.06);
+}
+
+.message.sent .bubble {
+  background: var(--sent);
+  border-color: transparent;
+}
+
+.sender-name {
+  font-size: 12px;
+  color: var(--muted);
+  margin-bottom: 6px;
+}
+
+.message-content {
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+  font-size: 14px;
+  line-height: 1.6;
+}
+
+.message-text {
+  word-break: break-word;
+}
+
+.inline-emoji {
+  width: 22px;
+  height: 22px;
+  vertical-align: text-bottom;
+  margin: 0 2px;
+}
+
+.message-media {
+  border-radius: 14px;
+  max-width: 100%;
+}
+
+.previewable {
+  cursor: zoom-in;
+}
+
+.message-media.image,
+.message-media.emoji {
+  max-height: 260px;
+  object-fit: contain;
+  background: #f1f5f9;
+  padding: 6px;
+}
+
+.message-media.emoji {
+  max-height: 160px;
+  width: auto;
+}
+
+.message-media.video {
+  max-height: 360px;
+  background: #111827;
+}
+
+.message-media.audio {
+  width: 260px;
+}
+
+.image-preview {
+  position: fixed;
+  inset: 0;
+  background: rgba(15, 23, 42, 0.7);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  opacity: 0;
+  pointer-events: none;
+  transition: opacity 0.2s ease;
+  z-index: 999;
+}
+
+.image-preview.active {
+  opacity: 1;
+  pointer-events: auto;
+}
+
+.image-preview img {
+  max-width: min(90vw, 1200px);
+  max-height: 90vh;
+  border-radius: 18px;
+  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.35);
+  background: #0f172a;
+  transition: transform 0.1s ease;
+  cursor: zoom-out;
+}
+
+body[data-theme="cloud-dancer"] {
+  --accent: #6b8cff;
+  --sent: #e0e7ff;
+  --received: #ffffff;
+  --border: #d8e0f7;
+  --bg: #f6f7fb;
+}
+
+body[data-theme="corundum-blue"] {
+  --accent: #2563eb;
+  --sent: #dbeafe;
+  --received: #ffffff;
+  --border: #c7d2fe;
+  --bg: #eef2ff;
+}
+
+body[data-theme="kiwi-green"] {
+  --accent: #16a34a;
+  --sent: #dcfce7;
+  --received: #ffffff;
+  --border: #bbf7d0;
+  --bg: #f0fdf4;
+}
+
+body[data-theme="spicy-red"] {
+  --accent: #e11d48;
+  --sent: #ffe4e6;
+  --received: #ffffff;
+  --border: #fecdd3;
+  --bg: #fff1f2;
+}
+
+body[data-theme="teal-water"] {
+  --accent: #0f766e;
+  --sent: #ccfbf1;
+  --received: #ffffff;
+  --border: #99f6e4;
+  --bg: #f0fdfa;
+}
+
+.highlight {
+  outline: 2px solid var(--accent);
+  outline-offset: 4px;
+  border-radius: 18px;
+}
+
+.empty {
+  text-align: center;
+  color: var(--muted);
+  padding: 40px;
+}
+`;

electron/services/groupAnalyticsService.ts

@@ -1,5 +1,9 @@
+import * as fs from 'fs'
+import * as path from 'path'
+import ExcelJS from 'exceljs'
 import { ConfigService } from './config'
 import { wcdbService } from './wcdbService'
+import { chatService } from './chatService'
 
 export interface GroupChatInfo {
   username: string
@@ -41,6 +45,30 @@ class GroupAnalyticsService {
     this.configService = new ConfigService()
   }
 
+  // 并发控制：限制同时执行的 Promise 数量
+  private async parallelLimit<T, R>(
+    items: T[],
+    limit: number,
+    fn: (item: T, index: number) => Promise<R>
+  ): Promise<R[]> {
+    const results: R[] = new Array(items.length)
+    let currentIndex = 0
+
+    async function runNext(): Promise<void> {
+      while (currentIndex < items.length) {
+        const index = currentIndex++
+        results[index] = await fn(items[index], index)
+      }
+    }
+
+    const workers = Array(Math.min(limit, items.length))
+      .fill(null)
+      .map(() => runNext())
+
+    await Promise.all(workers)
+    return results
+  }
+
   private cleanAccountDirName(name: string): string {
     const trimmed = name.trim()
     if (!trimmed) return trimmed
@@ -65,6 +93,139 @@ class GroupAnalyticsService {
     return { success: true }
   }
 
+  private looksLikeHex(s: string): boolean {
+    if (s.length % 2 !== 0) return false
+    return /^[0-9a-fA-F]+$/.test(s)
+  }
+
+  private looksLikeBase64(s: string): boolean {
+    if (s.length % 4 !== 0) return false
+    return /^[A-Za-z0-9+/=]+$/.test(s)
+  }
+
+  /**
+   * 解析 ext_buffer 二进制数据，提取群成员的群昵称
+   */
+  private parseGroupNicknamesFromExtBuffer(buffer: Buffer): Map<string, string> {
+    const nicknameMap = new Map<string, string>()
+
+    try {
+      const raw = buffer.toString('utf8')
+      const wxidPattern = /wxid_[a-z0-9_]+/gi
+      const wxids = raw.match(wxidPattern) || []
+
+      for (const wxid of wxids) {
+        const wxidLower = wxid.toLowerCase()
+        const wxidIndex = raw.toLowerCase().indexOf(wxidLower)
+        if (wxidIndex === -1) continue
+
+        const afterWxid = raw.slice(wxidIndex + wxid.length)
+        let nickname = ''
+        let foundStart = false
+
+        for (let i = 0; i < afterWxid.length && i < 100; i++) {
+          const char = afterWxid[i]
+          const code = char.charCodeAt(0)
+          const isPrintable = (
+            (code >= 0x4E00 && code <= 0x9FFF) ||
+            (code >= 0x3000 && code <= 0x303F) ||
+            (code >= 0xFF00 && code <= 0xFFEF) ||
+            (code >= 0x20 && code <= 0x7E)
+          )
+
+          if (isPrintable && code !== 0x01 && code !== 0x18) {
+            foundStart = true
+            nickname += char
+          } else if (foundStart) {
+            break
+          }
+        }
+
+        nickname = nickname.trim().replace(/[\x00-\x1F\x7F]/g, '')
+        if (nickname && nickname.length < 50) {
+          nicknameMap.set(wxidLower, nickname)
+        }
+      }
+    } catch (e) {
+      console.error('Failed to parse ext_buffer:', e)
+    }
+
+    return nicknameMap
+  }
+
+  /**
+   * 从 contact.db 的 chat_room 表获取群成员的群昵称
+   */
+  private async getGroupNicknamesForRoom(chatroomId: string): Promise<Map<string, string>> {
+    try {
+      const sql = `SELECT ext_buffer FROM chat_room WHERE username = '${chatroomId.replace(/'/g, "''")}'`
+      const result = await wcdbService.execQuery('contact', null, sql)
+
+      if (!result.success || !result.rows || result.rows.length === 0) {
+        return new Map<string, string>()
+      }
+
+      let extBuffer = result.rows[0].ext_buffer
+
+      if (typeof extBuffer === 'string') {
+        if (this.looksLikeHex(extBuffer)) {
+          extBuffer = Buffer.from(extBuffer, 'hex')
+        } else if (this.looksLikeBase64(extBuffer)) {
+          extBuffer = Buffer.from(extBuffer, 'base64')
+        } else {
+          try {
+            extBuffer = Buffer.from(extBuffer, 'hex')
+          } catch {
+            extBuffer = Buffer.from(extBuffer, 'base64')
+          }
+        }
+      }
+
+      if (!extBuffer || !Buffer.isBuffer(extBuffer)) {
+        return new Map<string, string>()
+      }
+
+      return this.parseGroupNicknamesFromExtBuffer(extBuffer)
+    } catch (e) {
+      console.error('getGroupNicknamesForRoom error:', e)
+      return new Map<string, string>()
+    }
+  }
+
+  private escapeCsvValue(value: string): string {
+    if (value == null) return ''
+    const str = String(value)
+    if (/[",\n\r]/.test(str)) {
+      return `"${str.replace(/"/g, '""')}"`
+    }
+    return str
+  }
+
+  private normalizeGroupNickname(value: string, wxid: string, fallback: string): string {
+    const trimmed = (value || '').trim()
+    if (!trimmed) return fallback
+    if (/^["'@]+$/.test(trimmed)) return fallback
+    if (trimmed.toLowerCase() === (wxid || '').toLowerCase()) return fallback
+    return trimmed
+  }
+
+  private sanitizeWorksheetName(name: string): string {
+    const cleaned = (name || '').replace(/[*?:\\/\\[\\]]/g, '_').trim()
+    const limited = cleaned.slice(0, 31)
+    return limited || 'Sheet1'
+  }
+
+  private formatDateTime(date: Date): string {
+    const pad = (value: number) => String(value).padStart(2, '0')
+    const year = date.getFullYear()
+    const month = pad(date.getMonth() + 1)
+    const day = pad(date.getDate())
+    const hour = pad(date.getHours())
+    const minute = pad(date.getMinutes())
+    const second = pad(date.getSeconds())
+    return `${year}-${month}-${day} ${hour}:${minute}:${second}`
+  }
+
   async getGroupChats(): Promise<{ success: boolean; data?: GroupChatInfo[]; error?: string }> {
     try {
       const conn = await this.ensureConnected()
@@ -80,23 +241,38 @@ class GroupAnalyticsService {
         .map((row) => row.username || row.user_name || row.userName || '')
         .filter((username) => username.includes('@chatroom'))
 
-      const [displayNames, avatarUrls, memberCounts] = await Promise.all([
+      const [memberCounts, contactInfo] = await Promise.all([
-        wcdbService.getDisplayNames(groupIds),
+        wcdbService.getGroupMemberCounts(groupIds),
-        wcdbService.getAvatarUrls(groupIds),
+        chatService.enrichSessionsContactInfo(groupIds)
-        wcdbService.getGroupMemberCounts(groupIds)
       ])
 
+      let fallbackNames: { success: boolean; map?: Record<string, string> } | null = null
+      let fallbackAvatars: { success: boolean; map?: Record<string, string> } | null = null
+      if (!contactInfo.success || !contactInfo.contacts) {
+        const [displayNames, avatarUrls] = await Promise.all([
+          wcdbService.getDisplayNames(groupIds),
+          wcdbService.getAvatarUrls(groupIds)
+        ])
+        fallbackNames = displayNames
+        fallbackAvatars = avatarUrls
+      }
+
       const groups: GroupChatInfo[] = []
       for (const groupId of groupIds) {
+        const contact = contactInfo.success && contactInfo.contacts ? contactInfo.contacts[groupId] : undefined
+        const displayName = contact?.displayName ||
+          (fallbackNames && fallbackNames.success && fallbackNames.map ? (fallbackNames.map[groupId] || '') : '') ||
+          groupId
+        const avatarUrl = contact?.avatarUrl ||
+          (fallbackAvatars && fallbackAvatars.success && fallbackAvatars.map ? fallbackAvatars.map[groupId] : undefined)
+
         groups.push({
           username: groupId,
-          displayName: displayNames.success && displayNames.map
+          displayName,
-            ? (displayNames.map[groupId] || groupId)
-            : groupId,
           memberCount: memberCounts.success && memberCounts.map && typeof memberCounts.map[groupId] === 'number'
             ? memberCounts.map[groupId]
             : 0,
-          avatarUrl: avatarUrls.success && avatarUrls.map ? avatarUrls.map[groupId] : undefined
+          avatarUrl
         })
       }
 
@@ -181,6 +357,8 @@ class GroupAnalyticsService {
     }
   }
 
+
+
   async getGroupActiveHours(chatroomId: string, startTime?: number, endTime?: number): Promise<{ success: boolean; data?: GroupActiveHours; error?: string }> {
     try {
       const conn = await this.ensureConnected()
@@ -246,6 +424,187 @@ class GroupAnalyticsService {
       return { success: false, error: String(e) }
     }
   }
+
+  async exportGroupMembers(chatroomId: string, outputPath: string): Promise<{ success: boolean; count?: number; error?: string }> {
+    try {
+      const conn = await this.ensureConnected()
+      if (!conn.success) return { success: false, error: conn.error }
+
+      const exportDate = new Date()
+      const exportTime = this.formatDateTime(exportDate)
+      const exportVersion = '0.0.2'
+      const exportGenerator = 'WeFlow'
+      const exportPlatform = 'wechat'
+
+      const groupDisplay = await wcdbService.getDisplayNames([chatroomId])
+      const groupName = groupDisplay.success && groupDisplay.map
+        ? (groupDisplay.map[chatroomId] || chatroomId)
+        : chatroomId
+
+      const groupContact = await wcdbService.getContact(chatroomId)
+      const sessionRemark = (groupContact.success && groupContact.contact)
+        ? (groupContact.contact.remark || '')
+        : ''
+
+      const membersResult = await wcdbService.getGroupMembers(chatroomId)
+      if (!membersResult.success || !membersResult.members) {
+        return { success: false, error: membersResult.error || '获取群成员失败' }
+      }
+
+      const members = membersResult.members as { username: string; avatarUrl?: string }[]
+      if (members.length === 0) {
+        return { success: false, error: '群成员为空' }
+      }
+
+      const usernames = members.map((m) => m.username).filter(Boolean)
+      const [displayNames, groupNicknames] = await Promise.all([
+        wcdbService.getDisplayNames(usernames),
+        this.getGroupNicknamesForRoom(chatroomId)
+      ])
+
+      const contactMap = new Map<string, { remark?: string; nickName?: string; alias?: string }>()
+      const concurrency = 6
+      await this.parallelLimit(usernames, concurrency, async (username) => {
+        const result = await wcdbService.getContact(username)
+        if (result.success && result.contact) {
+          const contact = result.contact as any
+          contactMap.set(username, {
+            remark: contact.remark || '',
+            nickName: contact.nickName || contact.nick_name || '',
+            alias: contact.alias || ''
+          })
+        } else {
+          contactMap.set(username, { remark: '', nickName: '', alias: '' })
+        }
+      })
+
+      const infoTitleRow = ['会话信息']
+      const infoRow = ['微信ID', chatroomId, '', '昵称', groupName, '备注', sessionRemark || '', '']
+      const metaRow = ['导出工具', exportGenerator, '导出版本', exportVersion, '平台', exportPlatform, '导出时间', exportTime]
+
+      const header = ['微信昵称', '微信备注', '群昵称', 'wxid', '微信号']
+      const rows: string[][] = [infoTitleRow, infoRow, metaRow, header]
+      const myWxid = this.cleanAccountDirName(this.configService.get('myWxid') || '')
+
+      for (const member of members) {
+        const wxid = member.username
+        const normalizedWxid = this.cleanAccountDirName(wxid || '')
+        const contact = contactMap.get(wxid)
+        const fallbackName = displayNames.success && displayNames.map ? (displayNames.map[wxid] || '') : ''
+        const nickName = contact?.nickName || fallbackName || ''
+        const remark = contact?.remark || ''
+        const rawGroupNickname = groupNicknames.get(wxid.toLowerCase()) || ''
+        const alias = contact?.alias || ''
+        const groupNickname = this.normalizeGroupNickname(
+          rawGroupNickname,
+          normalizedWxid === myWxid ? myWxid : wxid,
+          ''
+        )
+
+        rows.push([nickName, remark, groupNickname, wxid, alias])
+      }
+
+      const ext = path.extname(outputPath).toLowerCase()
+      if (ext === '.csv') {
+        const csvLines = rows.map((row) => row.map((cell) => this.escapeCsvValue(cell)).join(','))
+        const content = '\ufeff' + csvLines.join('\n')
+        fs.writeFileSync(outputPath, content, 'utf8')
+      } else {
+        const workbook = new ExcelJS.Workbook()
+        const sheet = workbook.addWorksheet(this.sanitizeWorksheetName('群成员列表'))
+
+        let currentRow = 1
+        const titleCell = sheet.getCell(currentRow, 1)
+        titleCell.value = '会话信息'
+        titleCell.font = { name: 'Calibri', bold: true, size: 11 }
+        titleCell.alignment = { vertical: 'middle', horizontal: 'left' }
+        sheet.getRow(currentRow).height = 25
+        currentRow++
+
+        sheet.getCell(currentRow, 1).value = '微信ID'
+        sheet.getCell(currentRow, 1).font = { name: 'Calibri', bold: true, size: 11 }
+        sheet.mergeCells(currentRow, 2, currentRow, 3)
+        sheet.getCell(currentRow, 2).value = chatroomId
+        sheet.getCell(currentRow, 2).font = { name: 'Calibri', size: 11 }
+
+        sheet.getCell(currentRow, 4).value = '昵称'
+        sheet.getCell(currentRow, 4).font = { name: 'Calibri', bold: true, size: 11 }
+        sheet.getCell(currentRow, 5).value = groupName
+        sheet.getCell(currentRow, 5).font = { name: 'Calibri', size: 11 }
+
+        sheet.getCell(currentRow, 6).value = '备注'
+        sheet.getCell(currentRow, 6).font = { name: 'Calibri', bold: true, size: 11 }
+        sheet.mergeCells(currentRow, 7, currentRow, 8)
+        sheet.getCell(currentRow, 7).value = sessionRemark
+        sheet.getCell(currentRow, 7).font = { name: 'Calibri', size: 11 }
+
+        sheet.getRow(currentRow).height = 20
+        currentRow++
+
+        sheet.getCell(currentRow, 1).value = '导出工具'
+        sheet.getCell(currentRow, 1).font = { name: 'Calibri', bold: true, size: 11 }
+        sheet.getCell(currentRow, 2).value = exportGenerator
+        sheet.getCell(currentRow, 2).font = { name: 'Calibri', size: 10 }
+
+        sheet.getCell(currentRow, 3).value = '导出版本'
+        sheet.getCell(currentRow, 3).font = { name: 'Calibri', bold: true, size: 11 }
+        sheet.getCell(currentRow, 4).value = exportVersion
+        sheet.getCell(currentRow, 4).font = { name: 'Calibri', size: 10 }
+
+        sheet.getCell(currentRow, 5).value = '平台'
+        sheet.getCell(currentRow, 5).font = { name: 'Calibri', bold: true, size: 11 }
+        sheet.getCell(currentRow, 6).value = exportPlatform
+        sheet.getCell(currentRow, 6).font = { name: 'Calibri', size: 10 }
+
+        sheet.getCell(currentRow, 7).value = '导出时间'
+        sheet.getCell(currentRow, 7).font = { name: 'Calibri', bold: true, size: 11 }
+        sheet.getCell(currentRow, 8).value = exportTime
+        sheet.getCell(currentRow, 8).font = { name: 'Calibri', size: 10 }
+
+        sheet.getRow(currentRow).height = 20
+        currentRow++
+
+        const headerRow = sheet.getRow(currentRow)
+        headerRow.height = 22
+        header.forEach((text, index) => {
+          const cell = headerRow.getCell(index + 1)
+          cell.value = text
+          cell.font = { name: 'Calibri', bold: true, size: 11 }
+        })
+        currentRow++
+
+        sheet.getColumn(1).width = 28
+        sheet.getColumn(2).width = 28
+        sheet.getColumn(3).width = 28
+        sheet.getColumn(4).width = 36
+        sheet.getColumn(5).width = 28
+        sheet.getColumn(6).width = 18
+        sheet.getColumn(7).width = 24
+        sheet.getColumn(8).width = 22
+
+        for (let i = 4; i < rows.length; i++) {
+          const [nickName, remark, groupNickname, wxid, alias] = rows[i]
+          const row = sheet.getRow(currentRow)
+          row.getCell(1).value = nickName
+          row.getCell(2).value = remark
+          row.getCell(3).value = groupNickname
+          row.getCell(4).value = wxid
+          row.getCell(5).value = alias
+          row.alignment = { vertical: 'top', wrapText: true }
+          currentRow++
+        }
+
+        await workbook.xlsx.writeFile(outputPath)
+      }
+
+      return { success: true, count: members.length }
+    } catch (e) {
+      return { success: false, error: String(e) }
+    }
+  }
+
+
+
 }
 
 export const groupAnalyticsService = new GroupAnalyticsService()

electron/services/imageDecryptService.ts

@@ -1,14 +1,46 @@
 import { app, BrowserWindow } from 'electron'
 import { basename, dirname, extname, join } from 'path'
 import { pathToFileURL } from 'url'
-import { existsSync, mkdirSync, readdirSync, readFileSync, statSync } from 'fs'
+import { existsSync, mkdirSync, readdirSync, readFileSync, statSync, appendFileSync } from 'fs'
-import { writeFile } from 'fs/promises'
+import { writeFile, rm, readdir } from 'fs/promises'
 import crypto from 'crypto'
 import { Worker } from 'worker_threads'
 import { ConfigService } from './config'
 import { wcdbService } from './wcdbService'
 
-type DecryptResult = { 
+// 获取 ffmpeg-static 的路径
+function getStaticFfmpegPath(): string | null {
+  try {
+    // 方法1: 直接 require ffmpeg-static
+    // eslint-disable-next-line @typescript-eslint/no-var-requires
+    const ffmpegStatic = require('ffmpeg-static')
+
+    if (typeof ffmpegStatic === 'string' && existsSync(ffmpegStatic)) {
+      return ffmpegStatic
+    }
+
+    // 方法2: 手动构建路径（开发环境）
+    const devPath = join(process.cwd(), 'node_modules', 'ffmpeg-static', 'ffmpeg.exe')
+    if (existsSync(devPath)) {
+      return devPath
+    }
+
+    // 方法3: 打包后的路径
+    if (app.isPackaged) {
+      const resourcesPath = process.resourcesPath
+      const packedPath = join(resourcesPath, 'app.asar.unpacked', 'node_modules', 'ffmpeg-static', 'ffmpeg.exe')
+      if (existsSync(packedPath)) {
+        return packedPath
+      }
+    }
+
+    return null
+  } catch {
+    return null
+  }
+}
+
+type DecryptResult = {
   success: boolean
   localPath?: string
   error?: string
@@ -32,10 +64,37 @@ export class ImageDecryptService {
 
   private logInfo(message: string, meta?: Record<string, unknown>): void {
     if (!this.configService.get('logEnabled')) return
-    if (meta) {
+    const timestamp = new Date().toISOString()
-      console.info(message, meta)
+    const metaStr = meta ? ` ${JSON.stringify(meta)}` : ''
-    } else {
+    const logLine = `[${timestamp}] [ImageDecrypt] ${message}${metaStr}\n`
-      console.info(message)
+
+    // 只写入文件，不输出到控制台
+    this.writeLog(logLine)
+  }
+
+  private logError(message: string, error?: unknown, meta?: Record<string, unknown>): void {
+    if (!this.configService.get('logEnabled')) return
+    const timestamp = new Date().toISOString()
+    const errorStr = error ? ` Error: ${String(error)}` : ''
+    const metaStr = meta ? ` ${JSON.stringify(meta)}` : ''
+    const logLine = `[${timestamp}] [ImageDecrypt] ERROR: ${message}${errorStr}${metaStr}\n`
+
+    // 同时输出到控制台
+    console.error(message, error, meta)
+
+    // 写入日志文件
+    this.writeLog(logLine)
+  }
+
+  private writeLog(line: string): void {
+    try {
+      const logDir = join(app.getPath('userData'), 'logs')
+      if (!existsSync(logDir)) {
+        mkdirSync(logDir, { recursive: true })
+      }
+      appendFileSync(join(logDir, 'wcdb.log'), line, { encoding: 'utf8' })
+    } catch (err) {
+      console.error('写入日志失败:', err)
     }
   }
 
@@ -81,6 +140,7 @@ export class ImageDecryptService {
         return { success: true, localPath: dataUrl || this.filePathToUrl(existing), hasUpdate }
       }
     }
+    this.logInfo('未找到缓存', { md5: payload.imageMd5, datName: payload.imageDatName })
     return { success: false, error: '未找到缓存图片' }
   }
 
@@ -120,15 +180,18 @@ export class ImageDecryptService {
     payload: { sessionId?: string; imageMd5?: string; imageDatName?: string; force?: boolean },
     cacheKey: string
   ): Promise<DecryptResult> {
+    this.logInfo('开始解密图片', { md5: payload.imageMd5, datName: payload.imageDatName, force: payload.force })
     try {
       const wxid = this.configService.get('myWxid')
       const dbPath = this.configService.get('dbPath')
       if (!wxid || !dbPath) {
+        this.logError('配置缺失', undefined, { wxid: !!wxid, dbPath: !!dbPath })
         return { success: false, error: '未配置账号或数据库路径' }
       }
 
       const accountDir = this.resolveAccountDir(dbPath, wxid)
       if (!accountDir) {
+        this.logError('未找到账号目录', undefined, { dbPath, wxid })
         return { success: false, error: '未找到账号目录' }
       }
 
@@ -139,15 +202,19 @@ export class ImageDecryptService {
         payload.sessionId,
         { allowThumbnail: !payload.force, skipResolvedCache: Boolean(payload.force) }
       )
-      
+
       // 如果要求高清图但没找到，直接返回提示
       if (!datPath && payload.force) {
+        this.logError('未找到高清图', undefined, { md5: payload.imageMd5, datName: payload.imageDatName })
         return { success: false, error: '未找到高清图，请在微信中点开该图片查看后重试' }
       }
       if (!datPath) {
+        this.logError('未找到DAT文件', undefined, { md5: payload.imageMd5, datName: payload.imageDatName })
         return { success: false, error: '未找到图片文件' }
       }
 
+      this.logInfo('找到DAT文件', { datPath })
+
       if (!extname(datPath).toLowerCase().includes('dat')) {
         this.cacheResolvedPaths(cacheKey, payload.imageMd5, payload.imageDatName, datPath)
         const dataUrl = this.fileToDataUrl(datPath)
@@ -160,6 +227,7 @@ export class ImageDecryptService {
       // 查找已缓存的解密文件
       const existing = this.findCachedOutput(cacheKey, payload.force, payload.sessionId)
       if (existing) {
+        this.logInfo('找到已解密文件', { existing, isHd: this.isHdPath(existing) })
         const isHd = this.isHdPath(existing)
         // 如果要求高清但找到的是缩略图，继续解密高清图
         if (!(payload.force && !isHd)) {
@@ -192,23 +260,45 @@ export class ImageDecryptService {
       const aesKeyRaw = this.configService.get('imageAesKey')
       const aesKey = this.resolveAesKey(aesKeyRaw)
 
-      const decrypted = await this.decryptDatAuto(datPath, xorKey, aesKey)
+      this.logInfo('开始解密DAT文件', { datPath, xorKey, hasAesKey: !!aesKey })
-      
+      let decrypted = await this.decryptDatAuto(datPath, xorKey, aesKey)
-      const ext = this.detectImageExtension(decrypted) || '.jpg'
 
-      const outputPath = this.getCacheOutputPathFromDat(datPath, ext, payload.sessionId)
+      // 检查是否是 wxgf 格式，如果是则尝试提取真实图片数据
+      const wxgfResult = await this.unwrapWxgf(decrypted)
+      decrypted = wxgfResult.data
+
+      let ext = this.detectImageExtension(decrypted)
+
+      // 如果是 wxgf 格式且没检测到扩展名
+      if (wxgfResult.isWxgf && !ext) {
+        ext = '.hevc'
+      }
+
+      const finalExt = ext || '.jpg'
+
+      const outputPath = this.getCacheOutputPathFromDat(datPath, finalExt, payload.sessionId)
       await writeFile(outputPath, decrypted)
-      
+      this.logInfo('解密成功', { outputPath, size: decrypted.length })
+
+      // 对于 hevc 格式，返回错误提示
+      if (finalExt === '.hevc') {
+        return {
+          success: false,
+          error: '此图片为微信新格式(wxgf)，需要安装 ffmpeg 才能显示',
+          isThumb: this.isThumbnailPath(datPath)
+        }
+      }
       const isThumb = this.isThumbnailPath(datPath)
       this.cacheResolvedPaths(cacheKey, payload.imageMd5, payload.imageDatName, outputPath)
       if (!isThumb) {
         this.clearUpdateFlags(cacheKey, payload.imageMd5, payload.imageDatName)
       }
-      const dataUrl = this.bufferToDataUrl(decrypted, ext)
+      const dataUrl = this.bufferToDataUrl(decrypted, finalExt)
       const localPath = dataUrl || this.filePathToUrl(outputPath)
       this.emitCacheResolved(payload, cacheKey, localPath)
       return { success: true, localPath, isThumb }
     } catch (e) {
+      this.logError('解密失败', e, { md5: payload.imageMd5, datName: payload.imageDatName })
       return { success: false, error: String(e) }
     }
   }
@@ -233,7 +323,7 @@ export class ImageDecryptService {
           if (this.isAccountDir(entryPath)) return entryPath
         }
       }
-    } catch {}
+    } catch { }
 
     return null
   }
@@ -244,10 +334,10 @@ export class ImageDecryptService {
   private getDecryptedCacheDir(wxid: string): string | null {
     const cachePath = this.configService.get('cachePath')
     if (!cachePath) return null
-    
+
     const cleanedWxid = this.cleanAccountDirName(wxid)
     const cacheAccountDir = join(cachePath, cleanedWxid)
-    
+
     // 检查缓存目录下是否有 hardlink.db
     if (existsSync(join(cacheAccountDir, 'hardlink.db'))) {
       return cacheAccountDir
@@ -312,7 +402,7 @@ export class ImageDecryptService {
       allowThumbnail,
       skipResolvedCache
     })
-    
+
     // 优先通过 hardlink.db 查询
     if (imageMd5) {
       this.logInfo('[ImageDecrypt] hardlink lookup (md5)', { imageMd5, sessionId })
@@ -474,7 +564,7 @@ export class ImageDecryptService {
       if (!hasUpdate) return
       this.updateFlags.set(cacheKey, true)
       this.emitImageUpdate(payload, cacheKey)
-    }).catch(() => {})
+    }).catch(() => { })
   }
 
   private looksLikeMd5(value: string): boolean {
@@ -528,7 +618,7 @@ export class ImageDecryptService {
         this.logInfo('[ImageDecrypt] hardlink row miss', { md5, table: state.imageTable })
         return null
       }
-      
+
       const dir1 = this.getRowValue(row, 'dir1')
       const dir2 = this.getRowValue(row, 'dir2')
       const fileName = this.getRowValue(row, 'file_name') ?? this.getRowValue(row, 'fileName')
@@ -549,7 +639,7 @@ export class ImageDecryptService {
       // dir1 和 dir2 是 rowid，需要从 dir2id 表查询对应的目录名
       let dir1Name: string | null = null
       let dir2Name: string | null = null
-      
+
       if (state.dirTable) {
         try {
           // 通过 rowid 查询目录名
@@ -562,7 +652,7 @@ export class ImageDecryptService {
             const value = this.getRowValue(dir1Result.rows[0], 'username')
             if (value) dir1Name = String(value)
           }
-          
+
           const dir2Result = await wcdbService.execQuery(
             'media',
             hardlinkPath,
@@ -588,14 +678,14 @@ export class ImageDecryptService {
         join(accountDir, 'msg', 'attach', dir1Name, dir2Name, 'mg', fileName),
         join(accountDir, 'msg', 'attach', dir1Name, dir2Name, fileName),
       ]
-      
+
       for (const fullPath of possiblePaths) {
         if (existsSync(fullPath)) {
           this.logInfo('[ImageDecrypt] hardlink path hit', { fullPath })
           return fullPath
         }
       }
-      
+
       this.logInfo('[ImageDecrypt] hardlink path miss', { possiblePaths })
       return null
     } catch {
@@ -809,44 +899,73 @@ export class ImageDecryptService {
   }
 
   private findCachedOutput(cacheKey: string, preferHd: boolean = false, sessionId?: string): string | null {
-    const root = this.getCacheRoot()
+    const allRoots = this.getAllCacheRoots()
     const normalizedKey = this.normalizeDatBase(cacheKey.toLowerCase())
     const extensions = ['.jpg', '.jpeg', '.png', '.gif', '.webp']
 
-    if (sessionId) {
+    // 遍历所有可能的缓存根路径
-      const sessionDir = join(root, this.sanitizeDirName(sessionId))
+    for (const root of allRoots) {
-      if (existsSync(sessionDir)) {
+      // 策略1: 新目录结构 Images/{sessionId}/{YYYY-MM}/{file}_hd.jpg
-        try {
+      if (sessionId) {
-          const sessionEntries = readdirSync(sessionDir)
+        const sessionDir = join(root, this.sanitizeDirName(sessionId))
-          for (const entry of sessionEntries) {
+        if (existsSync(sessionDir)) {
-            const timeDir = join(sessionDir, entry)
+          try {
-            if (!this.isDirectory(timeDir)) continue
+            const dateDirs = readdirSync(sessionDir, { withFileTypes: true })
-            const hit = this.findCachedOutputInDir(timeDir, normalizedKey, extensions, preferHd)
+              .filter(d => d.isDirectory() && /^\d{4}-\d{2}$/.test(d.name))
-            if (hit) return hit
+              .map(d => d.name)
-          }
+              .sort()
-        } catch {
+              .reverse() // 最新的日期优先
-          // ignore
+
+            for (const dateDir of dateDirs) {
+              const imageDir = join(sessionDir, dateDir)
+              const hit = this.findCachedOutputInDir(imageDir, normalizedKey, extensions, preferHd)
+              if (hit) return hit
+            }
+          } catch { }
         }
       }
+
+      // 策略2: 遍历所有 sessionId 目录查找（如果没有指定 sessionId）
+      try {
+        const sessionDirs = readdirSync(root, { withFileTypes: true })
+          .filter(d => d.isDirectory())
+          .map(d => d.name)
+
+        for (const session of sessionDirs) {
+          const sessionDir = join(root, session)
+          // 检查是否是日期目录结构
+          try {
+            const subDirs = readdirSync(sessionDir, { withFileTypes: true })
+              .filter(d => d.isDirectory() && /^\d{4}-\d{2}$/.test(d.name))
+              .map(d => d.name)
+
+            for (const dateDir of subDirs) {
+              const imageDir = join(sessionDir, dateDir)
+              const hit = this.findCachedOutputInDir(imageDir, normalizedKey, extensions, preferHd)
+              if (hit) return hit
+            }
+          } catch { }
+        }
+      } catch { }
+
+      // 策略3: 旧目录结构 Images/{normalizedKey}/{normalizedKey}_thumb.jpg
+      const oldImageDir = join(root, normalizedKey)
+      if (existsSync(oldImageDir)) {
+        const hit = this.findCachedOutputInDir(oldImageDir, normalizedKey, extensions, preferHd)
+        if (hit) return hit
+      }
+
+      // 策略4: 最旧的平铺结构 Images/{file}.jpg
+      for (const ext of extensions) {
+        const candidate = join(root, `${cacheKey}${ext}`)
+        if (existsSync(candidate)) return candidate
+      }
+      for (const ext of extensions) {
+        const candidate = join(root, `${cacheKey}_t${ext}`)
+        if (existsSync(candidate)) return candidate
+      }
     }
-    
+
-    // 新目录结构: Images/{normalizedKey}/{normalizedKey}_thumb.jpg 或 _hd.jpg
-    const imageDir = join(root, normalizedKey)
-    if (existsSync(imageDir)) {
-      const hit = this.findCachedOutputInDir(imageDir, normalizedKey, extensions, preferHd)
-      if (hit) return hit
-    }
-    
-    // 兼容旧的平铺结构
-    for (const ext of extensions) {
-      const candidate = join(root, `${cacheKey}${ext}`)
-      if (existsSync(candidate)) return candidate
-    }
-    for (const ext of extensions) {
-      const candidate = join(root, `${cacheKey}_t${ext}`)
-      if (existsSync(candidate)) return candidate
-    }
-    
     return null
   }
 
@@ -856,6 +975,18 @@ export class ImageDecryptService {
     extensions: string[],
     preferHd: boolean
   ): string | null {
+    // 先检查并删除旧的 .hevc 文件（ffmpeg 转换失败时遗留的）
+    const hevcThumb = join(dirPath, `${normalizedKey}_thumb.hevc`)
+    const hevcHd = join(dirPath, `${normalizedKey}_hd.hevc`)
+    try {
+      if (existsSync(hevcThumb)) {
+        require('fs').unlinkSync(hevcThumb)
+      }
+      if (existsSync(hevcHd)) {
+        require('fs').unlinkSync(hevcHd)
+      }
+    } catch { }
+
     for (const ext of extensions) {
       if (preferHd) {
         const hdPath = join(dirPath, `${normalizedKey}_hd${ext}`)
@@ -863,6 +994,8 @@ export class ImageDecryptService {
       }
       const thumbPath = join(dirPath, `${normalizedKey}_thumb${ext}`)
       if (existsSync(thumbPath)) return thumbPath
+
+      // 允许返回 _hd 格式（因为它有 _hd 变体后缀）
       if (!preferHd) {
         const hdPath = join(dirPath, `${normalizedKey}_hd${ext}`)
         if (existsSync(hdPath)) return hdPath
@@ -875,14 +1008,14 @@ export class ImageDecryptService {
     const name = basename(datPath)
     const lower = name.toLowerCase()
     const base = lower.endsWith('.dat') ? name.slice(0, -4) : name
-    
+
     // 提取基础名称（去掉 _t, _h 等后缀）
     const normalizedBase = this.normalizeDatBase(base)
-    
+
     // 判断是缩略图还是高清图
     const isThumb = this.isThumbnailDat(lower)
     const suffix = isThumb ? '_thumb' : '_hd'
-    
+
     const contactDir = this.sanitizeDirName(sessionId || 'unknown')
     const timeDir = this.resolveTimeDir(datPath)
     const outputDir = join(this.getCacheRoot(), contactDir, timeDir)
@@ -960,8 +1093,9 @@ export class ImageDecryptService {
       const lower = entry.toLowerCase()
       if (!lower.endsWith('.dat')) continue
       if (this.isThumbnailDat(lower)) continue
-      if (!this.hasXVariant(lower.slice(0, -4))) continue
       const baseLower = lower.slice(0, -4)
+      // 只排除没有 _x 变体后缀的文件（允许 _hd、_h 等所有带变体的）
+      if (!this.hasXVariant(baseLower)) continue
       if (this.normalizeDatBase(baseLower) !== target) continue
       return join(dirPath, entry)
     }
@@ -973,6 +1107,7 @@ export class ImageDecryptService {
     if (!lower.endsWith('.dat')) return false
     if (this.isThumbnailDat(lower)) return false
     const baseLower = lower.slice(0, -4)
+    // 只检查是否有 _x 变体后缀（允许 _hd、_h 等所有带变体的）
     return this.hasXVariant(baseLower)
   }
 
@@ -998,15 +1133,19 @@ export class ImageDecryptService {
     if (this.cacheIndexed) return
     if (this.cacheIndexing) return this.cacheIndexing
     this.cacheIndexing = new Promise((resolve) => {
-      const root = this.getCacheRoot()
+      // 扫描所有可能的缓存根目录
-      try {
+      const allRoots = this.getAllCacheRoots()
-        this.indexCacheDir(root, 2, 0)
+      this.logInfo('开始索引缓存', { roots: allRoots.length })
-      } catch {
+      
-        this.cacheIndexed = true
+      for (const root of allRoots) {
-        this.cacheIndexing = null
+        try {
-        resolve()
+          this.indexCacheDir(root, 3, 0) // 增加深度到3，支持 sessionId/YYYY-MM 结构
-        return
+        } catch (e) {
+          this.logError('索引目录失败', e, { root })
+        }
       }
+      
+      this.logInfo('缓存索引完成', { entries: this.resolvedCache.size })
       this.cacheIndexed = true
       this.cacheIndexing = null
       resolve()
@@ -1014,6 +1153,39 @@ export class ImageDecryptService {
     return this.cacheIndexing
   }
 
+  /**
+   * 获取所有可能的缓存根路径（用于查找已缓存的图片）
+   * 包含当前路径、配置路径、旧版本路径
+   */
+  private getAllCacheRoots(): string[] {
+    const roots: string[] = []
+    const configured = this.configService.get('cachePath')
+    const documentsPath = app.getPath('documents')
+
+    // 主要路径（当前使用的）
+    const mainRoot = this.getCacheRoot()
+    roots.push(mainRoot)
+
+    // 如果配置了自定义路径，也检查其下的 Images
+    if (configured) {
+      roots.push(join(configured, 'Images'))
+      roots.push(join(configured, 'images'))
+    }
+
+    // 默认路径
+    roots.push(join(documentsPath, 'WeFlow', 'Images'))
+    roots.push(join(documentsPath, 'WeFlow', 'images'))
+    
+    // 兼容旧路径（如果有的话）
+    roots.push(join(documentsPath, 'WeFlowData', 'Images'))
+
+    // 去重并过滤存在的路径
+    const uniqueRoots = Array.from(new Set(roots))
+    const existingRoots = uniqueRoots.filter(r => existsSync(r))
+
+    return existingRoots
+  }
+
   private indexCacheDir(root: string, maxDepth: number, depth: number): void {
     let entries: string[]
     try {
@@ -1079,7 +1251,7 @@ export class ImageDecryptService {
 
   private async decryptDatAuto(datPath: string, xorKey: number, aesKey: Buffer | null): Promise<Buffer> {
     const version = this.getDatVersion(datPath)
-    
+
     if (version === 0) {
       return this.decryptDatV3(datPath, xorKey)
     }
@@ -1136,7 +1308,7 @@ export class ImageDecryptService {
     // 当 aesSize % 16 === 0 时，仍需要额外 16 字节的填充
     const remainder = ((aesSize % 16) + 16) % 16
     const alignedAesSize = aesSize + (16 - remainder)
-    
+
     if (alignedAesSize > data.length) {
       throw new Error('文件格式异常：AES 数据长度超过文件实际长度')
     }
@@ -1147,7 +1319,7 @@ export class ImageDecryptService {
       const decipher = crypto.createDecipheriv('aes-128-ecb', aesKey, null)
       decipher.setAutoPadding(false)
       const decrypted = Buffer.concat([decipher.update(aesData), decipher.final()])
-      
+
       // 使用 PKCS7 填充移除
       unpadded = this.strictRemovePadding(decrypted)
     }
@@ -1214,7 +1386,7 @@ export class ImageDecryptService {
     if (buffer[0] === 0x89 && buffer[1] === 0x50 && buffer[2] === 0x4e && buffer[3] === 0x47) return '.png'
     if (buffer[0] === 0xff && buffer[1] === 0xd8 && buffer[2] === 0xff) return '.jpg'
     if (buffer[0] === 0x52 && buffer[1] === 0x49 && buffer[2] === 0x46 && buffer[3] === 0x46 &&
-        buffer[8] === 0x57 && buffer[9] === 0x45 && buffer[10] === 0x42 && buffer[11] === 0x50) {
+      buffer[8] === 0x57 && buffer[9] === 0x45 && buffer[10] === 0x42 && buffer[11] === 0x50) {
       return '.webp'
     }
     return null
@@ -1332,10 +1504,10 @@ export class ImageDecryptService {
                 keyCount.set(key, (keyCount.get(key) || 0) + 1)
                 filesChecked++
               }
-            } catch {}
+            } catch { }
           }
         }
-      } catch {}
+      } catch { }
     }
 
     scanDir(dirPath)
@@ -1354,6 +1526,159 @@ export class ImageDecryptService {
     return mostCommonKey
   }
 
+  /**
+   * 解包 wxgf 格式
+   * wxgf 是微信的图片格式，内部使用 HEVC 编码
+   */
+  private async unwrapWxgf(buffer: Buffer): Promise<{ data: Buffer; isWxgf: boolean }> {
+    // 检查是否是 wxgf 格式 (77 78 67 66 = "wxgf")
+    if (buffer.length < 20 ||
+      buffer[0] !== 0x77 || buffer[1] !== 0x78 ||
+      buffer[2] !== 0x67 || buffer[3] !== 0x66) {
+      return { data: buffer, isWxgf: false }
+    }
+
+    // 先尝试搜索内嵌的传统图片签名
+    for (let i = 4; i < Math.min(buffer.length - 12, 4096); i++) {
+      if (buffer[i] === 0xff && buffer[i + 1] === 0xd8 && buffer[i + 2] === 0xff) {
+        return { data: buffer.subarray(i), isWxgf: false }
+      }
+      if (buffer[i] === 0x89 && buffer[i + 1] === 0x50 &&
+        buffer[i + 2] === 0x4e && buffer[i + 3] === 0x47) {
+        return { data: buffer.subarray(i), isWxgf: false }
+      }
+    }
+
+    // 提取 HEVC NALU 裸流
+    const hevcData = this.extractHevcNalu(buffer)
+    if (!hevcData || hevcData.length < 100) {
+      return { data: buffer, isWxgf: true }
+    }
+
+    // 尝试用 ffmpeg 转换
+    try {
+      const jpgData = await this.convertHevcToJpg(hevcData)
+      if (jpgData && jpgData.length > 0) {
+        return { data: jpgData, isWxgf: false }
+      }
+    } catch {
+      // ffmpeg 转换失败
+    }
+
+    return { data: hevcData, isWxgf: true }
+  }
+
+  /**
+   * 从 wxgf 数据中提取 HEVC NALU 裸流
+   */
+  private extractHevcNalu(buffer: Buffer): Buffer | null {
+    const nalUnits: Buffer[] = []
+    let i = 4
+
+    while (i < buffer.length - 4) {
+      if (buffer[i] === 0x00 && buffer[i + 1] === 0x00 &&
+        buffer[i + 2] === 0x00 && buffer[i + 3] === 0x01) {
+        let nalStart = i
+        let nalEnd = buffer.length
+
+        for (let j = i + 4; j < buffer.length - 3; j++) {
+          if (buffer[j] === 0x00 && buffer[j + 1] === 0x00) {
+            if (buffer[j + 2] === 0x01 ||
+              (buffer[j + 2] === 0x00 && j + 3 < buffer.length && buffer[j + 3] === 0x01)) {
+              nalEnd = j
+              break
+            }
+          }
+        }
+
+        const nalUnit = buffer.subarray(nalStart, nalEnd)
+        if (nalUnit.length > 3) {
+          nalUnits.push(nalUnit)
+        }
+        i = nalEnd
+      } else {
+        i++
+      }
+    }
+
+    if (nalUnits.length === 0) {
+      for (let j = 4; j < buffer.length - 4; j++) {
+        if (buffer[j] === 0x00 && buffer[j + 1] === 0x00 &&
+          buffer[j + 2] === 0x00 && buffer[j + 3] === 0x01) {
+          return buffer.subarray(j)
+        }
+      }
+      return null
+    }
+
+    return Buffer.concat(nalUnits)
+  }
+
+  /**
+   * 获取 ffmpeg 可执行文件路径
+   */
+  private getFfmpegPath(): string {
+    const staticPath = getStaticFfmpegPath()
+    this.logInfo('ffmpeg 路径检测', { staticPath, exists: staticPath ? existsSync(staticPath) : false })
+
+    if (staticPath) {
+      return staticPath
+    }
+
+    // 回退到系统 ffmpeg
+    return 'ffmpeg'
+  }
+
+  /**
+   * 使用 ffmpeg 将 HEVC 裸流转换为 JPG
+   */
+  private convertHevcToJpg(hevcData: Buffer): Promise<Buffer | null> {
+    const ffmpeg = this.getFfmpegPath()
+    this.logInfo('ffmpeg 转换开始', { ffmpegPath: ffmpeg, hevcSize: hevcData.length })
+
+    return new Promise((resolve) => {
+      const { spawn } = require('child_process')
+      const chunks: Buffer[] = []
+      const errChunks: Buffer[] = []
+
+      const proc = spawn(ffmpeg, [
+        '-hide_banner',
+        '-loglevel', 'error',
+        '-f', 'hevc',
+        '-i', 'pipe:0',
+        '-vframes', '1',
+        '-q:v', '3',
+        '-f', 'mjpeg',
+        'pipe:1'
+      ], {
+        stdio: ['pipe', 'pipe', 'pipe'],
+        windowsHide: true
+      })
+
+      proc.stdout.on('data', (chunk: Buffer) => chunks.push(chunk))
+      proc.stderr.on('data', (chunk: Buffer) => errChunks.push(chunk))
+
+      proc.on('close', (code: number) => {
+        if (code === 0 && chunks.length > 0) {
+          this.logInfo('ffmpeg 转换成功', { outputSize: Buffer.concat(chunks).length })
+          resolve(Buffer.concat(chunks))
+        } else {
+          const errMsg = Buffer.concat(errChunks).toString()
+          this.logInfo('ffmpeg 转换失败', { code, error: errMsg })
+          resolve(null)
+        }
+      })
+
+      proc.on('error', (err: Error) => {
+        this.logInfo('ffmpeg 进程错误', { error: err.message })
+        resolve(null)
+      })
+
+      proc.stdin.write(hevcData)
+      proc.stdin.end()
+    })
+  }
+
   // 保留原有的解密到文件方法（用于兼容）
   async decryptToFile(inputPath: string, outputPath: string, xorKey: number, aesKey?: Buffer): Promise<void> {
     const version = this.getDatVersion(inputPath)
@@ -1378,6 +1703,71 @@ export class ImageDecryptService {
 
     await writeFile(outputPath, decrypted)
   }
+
+  async clearCache(): Promise<{ success: boolean; error?: string }> {
+    this.resolvedCache.clear()
+    this.hardlinkCache.clear()
+    this.pending.clear()
+    this.updateFlags.clear()
+    this.cacheIndexed = false
+    this.cacheIndexing = null
+
+    const configured = this.configService.get('cachePath')
+    const root = configured
+      ? join(configured, 'Images')
+      : join(app.getPath('documents'), 'WeFlow', 'Images')
+
+    try {
+      if (!existsSync(root)) {
+        return { success: true }
+      }
+      const monthPattern = /^\d{4}-\d{2}$/
+      const clearFilesInDir = async (dirPath: string): Promise<void> => {
+        let entries: Array<{ name: string; isDirectory: () => boolean }>
+        try {
+          entries = await readdir(dirPath, { withFileTypes: true })
+        } catch {
+          return
+        }
+        for (const entry of entries) {
+          const fullPath = join(dirPath, entry.name)
+          if (entry.isDirectory()) {
+            await clearFilesInDir(fullPath)
+            continue
+          }
+          try {
+            await rm(fullPath, { force: true })
+          } catch { }
+        }
+      }
+      const traverse = async (dirPath: string): Promise<void> => {
+        let entries: Array<{ name: string; isDirectory: () => boolean }>
+        try {
+          entries = await readdir(dirPath, { withFileTypes: true })
+        } catch {
+          return
+        }
+        for (const entry of entries) {
+          const fullPath = join(dirPath, entry.name)
+          if (entry.isDirectory()) {
+            if (monthPattern.test(entry.name)) {
+              await clearFilesInDir(fullPath)
+            } else {
+              await traverse(fullPath)
+            }
+            continue
+          }
+          try {
+            await rm(fullPath, { force: true })
+          } catch { }
+        }
+      }
+      await traverse(root)
+      return { success: true }
+    } catch (e) {
+      return { success: false, error: String(e) }
+    }
+  }
 }
 
 export const imageDecryptService = new ImageDecryptService()

electron/services/keyService.ts

@@ -1,9 +1,10 @@
 import { app } from 'electron'
 import { join, dirname, basename } from 'path'
-import { existsSync, readdirSync, readFileSync, statSync } from 'fs'
+import { existsSync, readdirSync, readFileSync, statSync, copyFileSync, mkdirSync } from 'fs'
 import { execFile, spawn } from 'child_process'
 import { promisify } from 'util'
 import crypto from 'crypto'
+import os from 'os'
 
 const execFileAsync = promisify(execFile)
 
@@ -32,6 +33,7 @@ export class KeyService {
   private ReadProcessMemory: any = null
   private MEMORY_BASIC_INFORMATION: any = null
   private TerminateProcess: any = null
+  private QueryFullProcessImageNameW: any = null
 
   // User32
   private EnumWindows: any = null
@@ -57,18 +59,94 @@ export class KeyService {
   private readonly ERROR_SUCCESS = 0
 
   private getDllPath(): string {
-    const resourcesPath = app.isPackaged
+    const isPackaged = typeof app !== 'undefined' && app ? app.isPackaged : process.env.NODE_ENV === 'production'
-      ? join(process.resourcesPath, 'resources')
+
-      : join(app.getAppPath(), 'resources')
+    // 候选路径列表
-    return join(resourcesPath, 'wx_key.dll')
+    const candidates: string[] = []
+
+    // 1. 显式环境变量 (最高优先级)
+    if (process.env.WX_KEY_DLL_PATH) {
+      candidates.push(process.env.WX_KEY_DLL_PATH)
+    }
+
+    if (isPackaged) {
+      // 生产环境: 通常在 resources 目录下，但也可能直接在 resources 根目录
+      candidates.push(join(process.resourcesPath, 'resources', 'wx_key.dll'))
+      candidates.push(join(process.resourcesPath, 'wx_key.dll'))
+    } else {
+      // 开发环境
+      const cwd = process.cwd()
+      candidates.push(join(cwd, 'resources', 'wx_key.dll'))
+      candidates.push(join(app.getAppPath(), 'resources', 'wx_key.dll'))
+    }
+
+    // 检查并返回第一个存在的路径
+    for (const path of candidates) {
+      if (existsSync(path)) {
+        return path
+      }
+    }
+
+    // 如果都没找到，返回最可能的路径以便报错信息有参考
+    return candidates[0]
+  }
+
+  // 检查路径是否为 UNC 路径或网络路径
+  private isNetworkPath(path: string): boolean {
+    // UNC 路径以 \\ 开头
+    if (path.startsWith('\\\\')) {
+      return true
+    }
+    // 检查是否为网络映射驱动器（简化检测：A: 表示驱动器）
+    // 注意：这是一个启发式检测，更准确的方式需要调用 GetDriveType Windows API
+    // 但对于大多数 VM 共享场景，UNC 路径检测已足够
+    return false
+  }
+
+  // 将 DLL 复制到本地临时目录
+  private localizeNetworkDll(originalPath: string): string {
+    try {
+      const tempDir = join(os.tmpdir(), 'weflow_dll_cache')
+      if (!existsSync(tempDir)) {
+        mkdirSync(tempDir, { recursive: true })
+      }
+      const localPath = join(tempDir, 'wx_key.dll')
+
+      // 检查是否已经有本地副本，如果有就使用它
+      if (existsSync(localPath)) {
+        console.log(`使用已存在的 DLL 本地副本: ${localPath}`)
+        return localPath
+      }
+
+      console.log(`检测到网络路径 DLL，正在复制到本地: ${originalPath} -> ${localPath}`)
+      copyFileSync(originalPath, localPath)
+      console.log('DLL 本地化成功')
+      return localPath
+    } catch (e) {
+      console.error('DLL 本地化失败:', e)
+      // 如果本地化失败，返回原路径
+      return originalPath
+    }
   }
 
   private ensureLoaded(): boolean {
     if (this.initialized) return true
+
+    let dllPath = ''
     try {
       this.koffi = require('koffi')
-      const dllPath = this.getDllPath()
+      dllPath = this.getDllPath()
-      if (!existsSync(dllPath)) return false
+
+      if (!existsSync(dllPath)) {
+        console.error(`wx_key.dll 不存在于路径: ${dllPath}`)
+        return false
+      }
+
+      // 检查是否为网络路径，如果是则本地化
+      if (this.isNetworkPath(dllPath)) {
+        console.log('检测到网络路径，将进行本地化处理')
+        dllPath = this.localizeNetworkDll(dllPath)
+      }
 
       this.lib = this.koffi.load(dllPath)
       this.initHook = this.lib.func('bool InitializeHook(uint32 targetPid)')
@@ -80,7 +158,14 @@ export class KeyService {
       this.initialized = true
       return true
     } catch (e) {
-      console.error('加载 wx_key.dll 失败:', e)
+      const errorMsg = e instanceof Error ? e.message : String(e)
+      const errorStack = e instanceof Error ? e.stack : ''
+      console.error(`加载 wx_key.dll 失败`)
+      console.error(`  路径: ${dllPath}`)
+      console.error(`  错误: ${errorMsg}`)
+      if (errorStack) {
+        console.error(`  堆栈: ${errorStack}`)
+      }
       return false
     }
   }
@@ -110,6 +195,7 @@ export class KeyService {
       this.OpenProcess = this.kernel32.func('OpenProcess', 'HANDLE', ['uint32', 'bool', 'uint32'])
       this.CloseHandle = this.kernel32.func('CloseHandle', 'bool', ['HANDLE'])
       this.TerminateProcess = this.kernel32.func('TerminateProcess', 'bool', ['HANDLE', 'uint32'])
+      this.QueryFullProcessImageNameW = this.kernel32.func('QueryFullProcessImageNameW', 'bool', ['HANDLE', 'uint32', this.koffi.out('uint16*'), this.koffi.out('uint32*')])
       this.VirtualQueryEx = this.kernel32.func('VirtualQueryEx', 'uint64', ['HANDLE', 'uint64', this.koffi.out(this.koffi.pointer(this.MEMORY_BASIC_INFORMATION)), 'uint64'])
       this.ReadProcessMemory = this.kernel32.func('ReadProcessMemory', 'bool', ['HANDLE', 'uint64', 'void*', 'uint64', this.koffi.out(this.koffi.pointer('uint64'))])
 
@@ -226,7 +312,46 @@ export class KeyService {
     }
   }
 
+  private async getProcessExecutablePath(pid: number): Promise<string | null> {
+    if (!this.ensureKernel32()) return null
+    // 0x1000 = PROCESS_QUERY_LIMITED_INFORMATION
+    const hProcess = this.OpenProcess(0x1000, false, pid)
+    if (!hProcess) return null
+
+    try {
+      const sizeBuf = Buffer.alloc(4)
+      sizeBuf.writeUInt32LE(1024, 0)
+      const pathBuf = Buffer.alloc(1024 * 2)
+
+      const ret = this.QueryFullProcessImageNameW(hProcess, 0, pathBuf, sizeBuf)
+      if (ret) {
+        const len = sizeBuf.readUInt32LE(0)
+        return pathBuf.toString('ucs2', 0, len * 2)
+      }
+      return null
+    } catch (e) {
+      console.error('获取进程路径失败:', e)
+      return null
+    } finally {
+      this.CloseHandle(hProcess)
+    }
+  }
+
   private async findWeChatInstallPath(): Promise<string | null> {
+    // 0. 优先尝试获取正在运行的微信进程路径
+    try {
+      const pid = await this.findWeChatPid()
+      if (pid) {
+        const runPath = await this.getProcessExecutablePath(pid)
+        if (runPath && existsSync(runPath)) {
+          console.log('发现正在运行的微信进程，使用路径:', runPath)
+          return runPath
+        }
+      }
+    } catch (e) {
+      console.error('尝试获取运行中微信路径失败:', e)
+    }
+
     // 1. Registry - Uninstall Keys
     const uninstallKeys = [
       'SOFTWARE\\Microsoft\\Windows\\CurrentVersion\\Uninstall',
@@ -504,6 +629,11 @@ export class KeyService {
     if (!ok) {
       const error = this.getLastErrorMsg ? this.decodeCString(this.getLastErrorMsg()) : ''
       if (error) {
+        // 检测权限不足错误 (NTSTATUS 0xC0000022 = STATUS_ACCESS_DENIED)
+        if (error.includes('0xC0000022') || error.includes('ACCESS_DENIED') || error.includes('打开目标进程失败')) {
+          const friendlyError = '权限不足：无法访问微信进程。\n\n解决方法：\n1. 右键 WeFlow 图标，选择"以管理员身份运行"\n2. 关闭可能拦截的安全软件（如360、火绒等）\n3. 确保微信没有以管理员权限运行'
+          return { success: false, error: friendlyError }
+        }
         return { success: false, error }
       }
       const statusBuffer = Buffer.alloc(256)
@@ -695,33 +825,41 @@ export class KeyService {
   }
 
   private getXorKey(templateFiles: string[]): number | null {
-    const counts = new Map<string, number>()
+    const counts = new Map<number, number>()
+    const tailSignatures = [
+      Buffer.from([0xFF, 0xD9]),
+      Buffer.from([0x49, 0x45, 0x4E, 0x44, 0xAE, 0x42, 0x60, 0x82])
+    ]
     for (const file of templateFiles) {
       try {
         const bytes = readFileSync(file)
-        if (bytes.length < 2) continue
+        for (const signature of tailSignatures) {
-        const x = bytes[bytes.length - 2]
+          if (bytes.length < signature.length) continue
-        const y = bytes[bytes.length - 1]
+          const tail = bytes.subarray(bytes.length - signature.length)
-        const key = `${x}_${y}`
+          const xorKey = tail[0] ^ signature[0]
-        counts.set(key, (counts.get(key) ?? 0) + 1)
+          let valid = true
+          for (let i = 1; i < signature.length; i++) {
+            if ((tail[i] ^ xorKey) !== signature[i]) {
+              valid = false
+              break
+            }
+          }
+          if (valid) {
+            counts.set(xorKey, (counts.get(xorKey) ?? 0) + 1)
+          }
+        }
       } catch { }
     }
     if (!counts.size) return null
-    let mostKey = ''
+    let bestKey: number | null = null
-    let mostCount = 0
+    let bestCount = 0
     for (const [key, count] of counts) {
-      if (count > mostCount) {
+      if (count > bestCount) {
-        mostCount = count
+        bestCount = count
-        mostKey = key
+        bestKey = key
       }
     }
-    if (!mostKey) return null
+    return bestKey
-    const [xStr, yStr] = mostKey.split('_')
-    const x = Number(xStr)
-    const y = Number(yStr)
-    const xorKey = x ^ 0xFF
-    const check = y ^ 0xD9
-    return xorKey === check ? xorKey : null
   }
 
   private getCiphertextFromTemplate(templateFiles: string[]): Buffer | null {
@@ -744,16 +882,17 @@ export class KeyService {
     return null
   }
 
-  private isAlphaNumAscii(byte: number): boolean {
+  private isAlphaNumLower(byte: number): boolean {
-    return (byte >= 0x61 && byte <= 0x7a) || (byte >= 0x41 && byte <= 0x5a) || (byte >= 0x30 && byte <= 0x39)
+    // 只匹配小写字母 a-z 和数字 0-9（AES密钥格式）
+    return (byte >= 0x61 && byte <= 0x7a) || (byte >= 0x30 && byte <= 0x39)
   }
 
-  private isUtf16AsciiKey(buf: Buffer, start: number): boolean {
+  private isUtf16LowerKey(buf: Buffer, start: number): boolean {
     if (start + 64 > buf.length) return false
     for (let j = 0; j < 32; j++) {
       const charByte = buf[start + j * 2]
       const nullByte = buf[start + j * 2 + 1]
-      if (nullByte !== 0x00 || !this.isAlphaNumAscii(charByte)) {
+      if (nullByte !== 0x00 || !this.isAlphaNumLower(charByte)) {
         return false
       }
     }
@@ -766,7 +905,17 @@ export class KeyService {
       const decipher = crypto.createDecipheriv('aes-128-ecb', key, null)
       decipher.setAutoPadding(false)
       const decrypted = Buffer.concat([decipher.update(ciphertext), decipher.final()])
-      return decrypted[0] === 0xff && decrypted[1] === 0xd8 && decrypted[2] === 0xff
+      const isJpeg = decrypted.length >= 3 && decrypted[0] === 0xff && decrypted[1] === 0xd8 && decrypted[2] === 0xff
+      const isPng = decrypted.length >= 8 &&
+        decrypted[0] === 0x89 &&
+        decrypted[1] === 0x50 &&
+        decrypted[2] === 0x4e &&
+        decrypted[3] === 0x47 &&
+        decrypted[4] === 0x0d &&
+        decrypted[5] === 0x0a &&
+        decrypted[6] === 0x1a &&
+        decrypted[7] === 0x0a
+      return isJpeg || isPng
     } catch {
       return false
     }
@@ -776,8 +925,6 @@ export class KeyService {
     const regions: Array<[number, number]> = []
     const MEM_COMMIT = 0x1000
     const MEM_PRIVATE = 0x20000
-    const MEM_MAPPED = 0x40000
-    const MEM_IMAGE = 0x1000000
     const PAGE_NOACCESS = 0x01
     const PAGE_GUARD = 0x100
 
@@ -792,10 +939,9 @@ export class KeyService {
       const protect = info.Protect
       const type = info.Type
       const regionSize = Number(info.RegionSize)
-      if (state === MEM_COMMIT && (protect & PAGE_NOACCESS) === 0 && (protect & PAGE_GUARD) === 0) {
+      // 只收集已提交的私有内存（大幅减少扫描区域）
-        if (type === MEM_PRIVATE || type === MEM_MAPPED || type === MEM_IMAGE) {
+      if (state === MEM_COMMIT && type === MEM_PRIVATE && (protect & PAGE_NOACCESS) === 0 && (protect & PAGE_GUARD) === 0) {
-          regions.push([Number(info.BaseAddress), regionSize])
+        regions.push([Number(info.BaseAddress), regionSize])
-        }
       }
 
       const nextAddress = address + regionSize
@@ -813,70 +959,61 @@ export class KeyService {
     return buffer.subarray(0, bytesRead[0])
   }
 
-  private async getAesKeyFromMemory(pid: number, ciphertext: Buffer): Promise<string | null> {
+  private async getAesKeyFromMemory(
+    pid: number,
+    ciphertext: Buffer,
+    onProgress?: (current: number, total: number, message: string) => void
+  ): Promise<string | null> {
     if (!this.ensureKernel32()) return null
     const hProcess = this.OpenProcess(this.PROCESS_ALL_ACCESS, false, pid)
     if (!hProcess) return null
 
     try {
-      const regions = this.getMemoryRegions(hProcess)
+      const allRegions = this.getMemoryRegions(hProcess)
-      const chunkSize = 4 * 1024 * 1024
+      const totalRegions = allRegions.length
-      const overlap = 65
+      let scannedCount = 0
-      for (const [baseAddress, regionSize] of regions) {
+      let skippedCount = 0
-        if (regionSize > 100 * 1024 * 1024) continue
+
-        let offset = 0
+      for (const [baseAddress, regionSize] of allRegions) {
-        let trailing: Buffer | null = null
+        // 跳过太大的内存区域（> 100MB）
-        while (offset < regionSize) {
+        if (regionSize > 100 * 1024 * 1024) {
-          const remaining = regionSize - offset
+          skippedCount++
-          const currentChunkSize = remaining > chunkSize ? chunkSize : remaining
+          continue
-          const chunk = this.readProcessMemory(hProcess, baseAddress + offset, currentChunkSize)
+        }
-          if (!chunk || !chunk.length) {
+
-            offset += currentChunkSize
+        scannedCount++
-            trailing = null
+        if (scannedCount % 10 === 0) {
+          onProgress?.(scannedCount, totalRegions, `正在扫描微信内存... (${scannedCount}/${totalRegions})`)
+          await new Promise(resolve => setImmediate(resolve))
+        }
+
+        const memory = this.readProcessMemory(hProcess, baseAddress, regionSize)
+        if (!memory) continue
+
+        // 直接在原始字节中搜索32字节的小写字母数字序列
+        for (let i = 0; i < memory.length - 34; i++) {
+          // 检查前导字符（不是小写字母或数字）
+          if (this.isAlphaNumLower(memory[i])) continue
+
+          // 检查接下来32个字节是否都是小写字母或数字
+          let valid = true
+          for (let j = 1; j <= 32; j++) {
+            if (!this.isAlphaNumLower(memory[i + j])) {
+              valid = false
+              break
+            }
+          }
+          if (!valid) continue
+
+          // 检查尾部字符（不是小写字母或数字）
+          if (i + 33 < memory.length && this.isAlphaNumLower(memory[i + 33])) {
             continue
           }
 
-          let dataToScan: Buffer
+          const keyBytes = memory.subarray(i + 1, i + 33)
-          if (trailing && trailing.length) {
+          if (this.verifyKey(ciphertext, keyBytes)) {
-            dataToScan = Buffer.concat([trailing, chunk])
+            return keyBytes.toString('ascii')
-          } else {
-            dataToScan = chunk
           }
-
-          for (let i = 0; i < dataToScan.length - 34; i++) {
-            if (this.isAlphaNumAscii(dataToScan[i])) continue
-            let valid = true
-            for (let j = 1; j <= 32; j++) {
-              if (!this.isAlphaNumAscii(dataToScan[i + j])) {
-                valid = false
-                break
-              }
-            }
-            if (valid && this.isAlphaNumAscii(dataToScan[i + 33])) {
-              valid = false
-            }
-            if (valid) {
-              const keyBytes = dataToScan.subarray(i + 1, i + 33)
-              if (this.verifyKey(ciphertext, keyBytes)) {
-                return keyBytes.toString('ascii')
-              }
-            }
-          }
-
-          for (let i = 0; i < dataToScan.length - 65; i++) {
-            if (!this.isUtf16AsciiKey(dataToScan, i)) continue
-            const keyBytes = Buffer.alloc(32)
-            for (let j = 0; j < 32; j++) {
-              keyBytes[j] = dataToScan[i + j * 2]
-            }
-            if (this.verifyKey(ciphertext, keyBytes)) {
-              return keyBytes.toString('ascii')
-            }
-          }
-
-          const start = dataToScan.length - overlap
-          trailing = dataToScan.subarray(start < 0 ? 0 : start)
-          offset += currentChunkSize
         }
       }
       return null
@@ -915,7 +1052,9 @@ export class KeyService {
     if (!pid) return { success: false, error: '未检测到微信进程' }
 
     onProgress?.('正在扫描内存获取 AES 密钥...')
-    const aesKey = await this.getAesKeyFromMemory(pid, ciphertext)
+    const aesKey = await this.getAesKeyFromMemory(pid, ciphertext, (current, total, msg) => {
+      onProgress?.(`${msg} (${current}/${total})`)
+    })
     if (!aesKey) {
       return {
         success: false,

electron/services/messageCacheService.ts

@@ -0,0 +1,77 @@
+import { join, dirname } from 'path'
+import { existsSync, mkdirSync, readFileSync, writeFileSync, rmSync } from 'fs'
+import { app } from 'electron'
+
+export interface SessionMessageCacheEntry {
+  updatedAt: number
+  messages: any[]
+}
+
+export class MessageCacheService {
+  private readonly cacheFilePath: string
+  private cache: Record<string, SessionMessageCacheEntry> = {}
+  private readonly sessionLimit = 150
+
+  constructor(cacheBasePath?: string) {
+    const basePath = cacheBasePath && cacheBasePath.trim().length > 0
+      ? cacheBasePath
+      : join(app.getPath('documents'), 'WeFlow')
+    this.cacheFilePath = join(basePath, 'session-messages.json')
+    this.ensureCacheDir()
+    this.loadCache()
+  }
+
+  private ensureCacheDir() {
+    const dir = dirname(this.cacheFilePath)
+    if (!existsSync(dir)) {
+      mkdirSync(dir, { recursive: true })
+    }
+  }
+
+  private loadCache() {
+    if (!existsSync(this.cacheFilePath)) return
+    try {
+      const raw = readFileSync(this.cacheFilePath, 'utf8')
+      const parsed = JSON.parse(raw)
+      if (parsed && typeof parsed === 'object') {
+        this.cache = parsed
+      }
+    } catch (error) {
+      console.error('MessageCacheService: 载入缓存失败', error)
+      this.cache = {}
+    }
+  }
+
+  get(sessionId: string): SessionMessageCacheEntry | undefined {
+    return this.cache[sessionId]
+  }
+
+  set(sessionId: string, messages: any[]): void {
+    if (!sessionId) return
+    const trimmed = messages.length > this.sessionLimit
+      ? messages.slice(-this.sessionLimit)
+      : messages.slice()
+    this.cache[sessionId] = {
+      updatedAt: Date.now(),
+      messages: trimmed
+    }
+    this.persist()
+  }
+
+  private persist() {
+    try {
+      writeFileSync(this.cacheFilePath, JSON.stringify(this.cache), 'utf8')
+    } catch (error) {
+      console.error('MessageCacheService: 保存缓存失败', error)
+    }
+  }
+
+  clear(): void {
+    this.cache = {}
+    try {
+      rmSync(this.cacheFilePath, { force: true })
+    } catch (error) {
+      console.error('MessageCacheService: 清理缓存失败', error)
+    }
+  }
+}

electron/services/snsService.ts

@@ -0,0 +1,255 @@
+import { wcdbService } from './wcdbService'
+import { ConfigService } from './config'
+import { ContactCacheService } from './contactCacheService'
+
+export interface SnsLivePhoto {
+    url: string
+    thumb: string
+    md5?: string
+    token?: string
+    key?: string
+    encIdx?: string
+}
+
+export interface SnsMedia {
+    url: string
+    thumb: string
+    md5?: string
+    token?: string
+    key?: string
+    encIdx?: string
+    livePhoto?: SnsLivePhoto
+}
+
+export interface SnsPost {
+    id: string
+    username: string
+    nickname: string
+    avatarUrl?: string
+    createTime: number
+    contentDesc: string
+    type?: number
+    media: SnsMedia[]
+    likes: string[]
+    comments: { id: string; nickname: string; content: string; refCommentId: string; refNickname?: string }[]
+    rawXml?: string  // 原始 XML 数据
+}
+
+const fixSnsUrl = (url: string, token?: string) => {
+    if (!url) return url;
+
+    // 1. 统一使用 https
+    // 2. 将 /150 (缩略图) 强制改为 /0 (原图)
+    let fixedUrl = url.replace('http://', 'https://').replace(/\/150($|\?)/, '/0$1');
+
+    if (!token || fixedUrl.includes('token=')) return fixedUrl;
+
+    const connector = fixedUrl.includes('?') ? '&' : '?';
+    return `${fixedUrl}${connector}token=${token}&idx=1`;
+};
+
+class SnsService {
+    private contactCache: ContactCacheService
+
+    constructor() {
+        const config = new ConfigService()
+        this.contactCache = new ContactCacheService(config.get('cachePath') as string)
+    }
+
+    async getTimeline(limit: number = 20, offset: number = 0, usernames?: string[], keyword?: string, startTime?: number, endTime?: number): Promise<{ success: boolean; timeline?: SnsPost[]; error?: string }> {
+        console.log('[SnsService] getTimeline called with:', { limit, offset, usernames, keyword, startTime, endTime })
+
+        const result = await wcdbService.getSnsTimeline(limit, offset, usernames, keyword, startTime, endTime)
+
+        console.log('[SnsService] getSnsTimeline result:', {
+            success: result.success,
+            timelineCount: result.timeline?.length,
+            error: result.error
+        })
+
+        if (result.success && result.timeline) {
+            const enrichedTimeline = result.timeline.map((post: any, index: number) => {
+                const contact = this.contactCache.get(post.username)
+
+                // 修复媒体 URL
+                const fixedMedia = post.media.map((m: any, mIdx: number) => {
+                    const base = {
+                        url: fixSnsUrl(m.url, m.token),
+                        thumb: fixSnsUrl(m.thumb, m.token),
+                        md5: m.md5,
+                        token: m.token,
+                        key: m.key,
+                        encIdx: m.encIdx || m.enc_idx, // 兼容不同命名
+                        livePhoto: m.livePhoto ? {
+                            ...m.livePhoto,
+                            url: fixSnsUrl(m.livePhoto.url, m.livePhoto.token),
+                            thumb: fixSnsUrl(m.livePhoto.thumb, m.livePhoto.token),
+                            token: m.livePhoto.token,
+                            key: m.livePhoto.key
+                        } : undefined
+                    }
+
+                    // [MOCK] 模拟数据：如果后端没返回 key (说明 DLL 未更新)，注入一些 Mock 数据以便前端开发
+                    if (!base.key) {
+                        base.key = 'mock_key_for_dev'
+                        if (!base.token) {
+                            base.token = 'mock_token_for_dev'
+                            base.url = fixSnsUrl(base.url, base.token)
+                            base.thumb = fixSnsUrl(base.thumb, base.token)
+                        }
+                        base.encIdx = '1'
+
+                        // 强制给第一个帖子的第一张图加 LivePhoto 模拟
+                        if (index === 0 && mIdx === 0 && !base.livePhoto) {
+                            base.livePhoto = {
+                                url: fixSnsUrl('https://tm.sh/d4cb0.mp4', 'mock_live_token'),
+                                thumb: base.thumb,
+                                token: 'mock_live_token',
+                                key: 'mock_live_key'
+                            }
+                        }
+                    }
+
+                    return base
+                })
+
+                return {
+                    ...post,
+                    avatarUrl: contact?.avatarUrl,
+                    nickname: post.nickname || contact?.displayName || post.username,
+                    media: fixedMedia
+                }
+            })
+
+            console.log('[SnsService] Returning enriched timeline with', enrichedTimeline.length, 'posts')
+            return { ...result, timeline: enrichedTimeline }
+        }
+
+        console.log('[SnsService] Returning result:', result)
+        return result
+    }
+    async debugResource(url: string): Promise<{ success: boolean; status?: number; headers?: any; error?: string }> {
+        return new Promise((resolve) => {
+            try {
+                const { app, net } = require('electron')
+                // Remove mocking 'require' if it causes issues, but here we need 'net' or 'https'
+                // implementing with 'https' for reliability if 'net' is main-process only special
+                const https = require('https')
+                const urlObj = new URL(url)
+
+                const options = {
+                    hostname: urlObj.hostname,
+                    path: urlObj.pathname + urlObj.search,
+                    method: 'GET',
+                    headers: {
+                        "User-Agent": "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/107.0.0.0 Safari/537.36 MicroMessenger/7.0.20.1781(0x6700143B) WindowsWechat(0x63090719) XWEB/8351",
+                        "Accept": "image/avif,image/webp,image/apng,image/svg+xml,image/*,*/*;q=0.8",
+                        "Accept-Encoding": "gzip, deflate, br",
+                        "Accept-Language": "zh-CN,zh;q=0.9",
+                        "Referer": "https://servicewechat.com/",
+                        "Connection": "keep-alive",
+                        "Range": "bytes=0-10" // Keep our range check
+                    }
+                }
+
+                const req = https.request(options, (res: any) => {
+                    resolve({
+                        success: true,
+                        status: res.statusCode,
+                        headers: {
+                            'x-enc': res.headers['x-enc'],
+                            'content-length': res.headers['content-length'],
+                            'content-type': res.headers['content-type']
+                        }
+                    })
+                    req.destroy() // We only need headers
+                })
+
+                req.on('error', (e: any) => {
+                    resolve({ success: false, error: e.message })
+                })
+
+                req.end()
+            } catch (e: any) {
+                resolve({ success: false, error: e.message })
+            }
+        })
+    }
+
+    private imageCache = new Map<string, string>()
+
+    async proxyImage(url: string): Promise<{ success: boolean; dataUrl?: string; error?: string }> {
+        // Check cache
+        if (this.imageCache.has(url)) {
+            return { success: true, dataUrl: this.imageCache.get(url) }
+        }
+
+        return new Promise((resolve) => {
+            try {
+                const https = require('https')
+                const zlib = require('zlib')
+                const urlObj = new URL(url)
+
+                const options = {
+                    hostname: urlObj.hostname,
+                    path: urlObj.pathname + urlObj.search,
+                    method: 'GET',
+                    headers: {
+                        "User-Agent": "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/107.0.0.0 Safari/537.36 MicroMessenger/7.0.20.1781(0x6700143B) WindowsWechat(0x63090719) XWEB/8351",
+                        "Accept": "image/avif,image/webp,image/apng,image/svg+xml,image/*,*/*;q=0.8",
+                        "Accept-Encoding": "gzip, deflate, br",
+                        "Accept-Language": "zh-CN,zh;q=0.9",
+                        "Referer": "https://servicewechat.com/",
+                        "Connection": "keep-alive"
+                    }
+                }
+
+                const req = https.request(options, (res: any) => {
+                    if (res.statusCode !== 200) {
+                        resolve({ success: false, error: `HTTP ${res.statusCode}` })
+                        return
+                    }
+
+                    const chunks: Buffer[] = []
+                    let stream = res
+
+                    // Handle gzip compression
+                    const encoding = res.headers['content-encoding']
+                    if (encoding === 'gzip') {
+                        stream = res.pipe(zlib.createGunzip())
+                    } else if (encoding === 'deflate') {
+                        stream = res.pipe(zlib.createInflate())
+                    } else if (encoding === 'br') {
+                        stream = res.pipe(zlib.createBrotliDecompress())
+                    }
+
+                    stream.on('data', (chunk: Buffer) => chunks.push(chunk))
+                    stream.on('end', () => {
+                        const buffer = Buffer.concat(chunks)
+                        const contentType = res.headers['content-type'] || 'image/jpeg'
+                        const base64 = buffer.toString('base64')
+                        const dataUrl = `data:${contentType};base64,${base64}`
+
+                        // Cache
+                        this.imageCache.set(url, dataUrl)
+
+                        resolve({ success: true, dataUrl })
+                    })
+                    stream.on('error', (e: any) => {
+                        resolve({ success: false, error: e.message })
+                    })
+                })
+
+                req.on('error', (e: any) => {
+                    resolve({ success: false, error: e.message })
+                })
+
+                req.end()
+            } catch (e: any) {
+                resolve({ success: false, error: e.message })
+            }
+        })
+    }
+}
+
+export const snsService = new SnsService()

electron/services/videoService.ts

@@ -0,0 +1,256 @@
+import { join } from 'path'
+import { existsSync, readdirSync, statSync, readFileSync } from 'fs'
+import { ConfigService } from './config'
+import Database from 'better-sqlite3'
+import { wcdbService } from './wcdbService'
+
+export interface VideoInfo {
+    videoUrl?: string       // 视频文件路径（用于 readFile）
+    coverUrl?: string       // 封面 data URL
+    thumbUrl?: string       // 缩略图 data URL
+    exists: boolean
+}
+
+class VideoService {
+    private configService: ConfigService
+
+    constructor() {
+        this.configService = new ConfigService()
+    }
+
+    /**
+     * 获取数据库根目录
+     */
+    private getDbPath(): string {
+        return this.configService.get('dbPath') || ''
+    }
+
+    /**
+     * 获取当前用户的wxid
+     */
+    private getMyWxid(): string {
+        return this.configService.get('myWxid') || ''
+    }
+
+    /**
+     * 获取缓存目录（解密后的数据库存放位置）
+     */
+    private getCachePath(): string {
+        return this.configService.get('cachePath') || ''
+    }
+
+    /**
+     * 清理 wxid 目录名（去掉后缀）
+     */
+    private cleanWxid(wxid: string): string {
+        const trimmed = wxid.trim()
+        if (!trimmed) return trimmed
+
+        if (trimmed.toLowerCase().startsWith('wxid_')) {
+            const match = trimmed.match(/^(wxid_[^_]+)/i)
+            if (match) return match[1]
+            return trimmed
+        }
+
+        const suffixMatch = trimmed.match(/^(.+)_([a-zA-Z0-9]{4})$/)
+        if (suffixMatch) return suffixMatch[1]
+
+        return trimmed
+    }
+
+    /**
+     * 从 video_hardlink_info_v4 表查询视频文件名
+     * 优先使用 cachePath 中解密后的 hardlink.db（使用 better-sqlite3）
+     * 如果失败，则尝试使用 wcdbService.execQuery 查询加密的 hardlink.db
+     */
+    private async queryVideoFileName(md5: string): Promise<string | undefined> {
+        const cachePath = this.getCachePath()
+        const dbPath = this.getDbPath()
+        const wxid = this.getMyWxid()
+        const cleanedWxid = this.cleanWxid(wxid)
+
+        if (!wxid) return undefined
+
+        // 方法1：优先在 cachePath 下查找解密后的 hardlink.db
+        if (cachePath) {
+            const cacheDbPaths = [
+                join(cachePath, cleanedWxid, 'hardlink.db'),
+                join(cachePath, wxid, 'hardlink.db'),
+                join(cachePath, 'hardlink.db'),
+                join(cachePath, 'databases', cleanedWxid, 'hardlink.db'),
+                join(cachePath, 'databases', wxid, 'hardlink.db')
+            ]
+
+            for (const p of cacheDbPaths) {
+                if (existsSync(p)) {
+                    try {
+                        const db = new Database(p, { readonly: true })
+                        const row = db.prepare(`
+                            SELECT file_name, md5 FROM video_hardlink_info_v4 
+                            WHERE md5 = ? 
+                            LIMIT 1
+                        `).get(md5) as { file_name: string; md5: string } | undefined
+                        db.close()
+
+                        if (row?.file_name) {
+                            const realMd5 = row.file_name.replace(/\.[^.]+$/, '')
+                            return realMd5
+                        }
+                    } catch (e) {
+                        // Silently fail
+                    }
+                }
+            }
+        }
+
+        // 方法2：使用 wcdbService.execQuery 查询加密的 hardlink.db
+        if (dbPath) {
+            const encryptedDbPaths = [
+                join(dbPath, wxid, 'db_storage', 'hardlink', 'hardlink.db'),
+                join(dbPath, cleanedWxid, 'db_storage', 'hardlink', 'hardlink.db')
+            ]
+
+            for (const p of encryptedDbPaths) {
+                if (existsSync(p)) {
+                    try {
+                        const escapedMd5 = md5.replace(/'/g, "''")
+                        
+                        // 用 md5 字段查询，获取 file_name
+                        const sql = `SELECT file_name FROM video_hardlink_info_v4 WHERE md5 = '${escapedMd5}' LIMIT 1`
+                        
+                        const result = await wcdbService.execQuery('media', p, sql)
+
+                        if (result.success && result.rows && result.rows.length > 0) {
+                            const row = result.rows[0]
+                            if (row?.file_name) {
+                                // 提取不带扩展名的文件名作为实际视频 MD5
+                                const realMd5 = String(row.file_name).replace(/\.[^.]+$/, '')
+                                return realMd5
+                            }
+                        }
+                    } catch (e) {
+                    }
+                }
+            }
+        }
+        return undefined
+    }
+
+    /**
+     * 将文件转换为 data URL
+     */
+    private fileToDataUrl(filePath: string, mimeType: string): string | undefined {
+        try {
+            if (!existsSync(filePath)) return undefined
+            const buffer = readFileSync(filePath)
+            return `data:${mimeType};base64,${buffer.toString('base64')}`
+        } catch {
+            return undefined
+        }
+    }
+
+    /**
+     * 根据视频MD5获取视频文件信息
+     * 视频存放在: {数据库根目录}/{用户wxid}/msg/video/{年月}/
+     * 文件命名: {md5}.mp4, {md5}.jpg, {md5}_thumb.jpg
+     */
+    async getVideoInfo(videoMd5: string): Promise<VideoInfo> {
+
+        const dbPath = this.getDbPath()
+        const wxid = this.getMyWxid()
+
+        if (!dbPath || !wxid || !videoMd5) {
+            return { exists: false }
+        }
+
+        // 先尝试从数据库查询真正的视频文件名
+        const realVideoMd5 = await this.queryVideoFileName(videoMd5) || videoMd5
+
+        const videoBaseDir = join(dbPath, wxid, 'msg', 'video')
+
+        if (!existsSync(videoBaseDir)) {
+            return { exists: false }
+        }
+
+        // 遍历年月目录查找视频文件
+        try {
+            const allDirs = readdirSync(videoBaseDir)
+
+            // 支持多种目录格式: YYYY-MM, YYYYMM, 或其他
+            const yearMonthDirs = allDirs
+                .filter(dir => {
+                    const dirPath = join(videoBaseDir, dir)
+                    return statSync(dirPath).isDirectory()
+                })
+                .sort((a, b) => b.localeCompare(a)) // 从最新的目录开始查找
+
+            for (const yearMonth of yearMonthDirs) {
+                const dirPath = join(videoBaseDir, yearMonth)
+
+                const videoPath = join(dirPath, `${realVideoMd5}.mp4`)
+                const coverPath = join(dirPath, `${realVideoMd5}.jpg`)
+                const thumbPath = join(dirPath, `${realVideoMd5}_thumb.jpg`)
+
+                // 检查视频文件是否存在
+                if (existsSync(videoPath)) {
+                    return {
+                        videoUrl: videoPath,  // 返回文件路径，前端通过 readFile 读取
+                        coverUrl: this.fileToDataUrl(coverPath, 'image/jpeg'),
+                        thumbUrl: this.fileToDataUrl(thumbPath, 'image/jpeg'),
+                        exists: true
+                    }
+                }
+            }
+        } catch (e) {
+            console.error('[VideoService] Error searching for video:', e)
+        }
+
+        return { exists: false }
+    }
+
+    /**
+     * 根据消息内容解析视频MD5
+     */
+    parseVideoMd5(content: string): string | undefined {
+        
+        // 打印前500字符看看 XML 结构
+
+        if (!content) return undefined
+
+        try {
+            // 提取所有可能的 md5 值进行日志
+            const allMd5s: string[] = []
+            const md5Regex = /(?:md5|rawmd5|newmd5|originsourcemd5)\s*=\s*['"]([a-fA-F0-9]+)['"]/gi
+            let match
+            while ((match = md5Regex.exec(content)) !== null) {
+                allMd5s.push(`${match[0]}`)
+            }
+
+            // 提取 md5（用于查询 hardlink.db）
+            // 注意：不是 rawmd5，rawmd5 是另一个值
+            // 格式: md5="xxx" 或 <md5>xxx</md5>
+            
+            // 尝试从videomsg标签中提取md5
+            const videoMsgMatch = /<videomsg[^>]*\smd5\s*=\s*['"]([a-fA-F0-9]+)['"]/i.exec(content)
+            if (videoMsgMatch) {
+                return videoMsgMatch[1].toLowerCase()
+            }
+
+            const attrMatch = /\smd5\s*=\s*['"]([a-fA-F0-9]+)['"]/i.exec(content)
+            if (attrMatch) {
+                return attrMatch[1].toLowerCase()
+            }
+
+            const md5Match = /<md5>([a-fA-F0-9]+)<\/md5>/i.exec(content)
+            if (md5Match) {
+                return md5Match[1].toLowerCase()
+            }
+        } catch (e) {
+            console.error('[VideoService] 解析视频MD5失败:', e)
+        }
+
+        return undefined
+    }
+}
+
+export const videoService = new VideoService()

electron/services/voiceTranscribeService.ts

@@ -0,0 +1,377 @@
+import { app } from 'electron'
+import { existsSync, mkdirSync, statSync, unlinkSync, createWriteStream } from 'fs'
+import { join } from 'path'
+import * as https from 'https'
+import * as http from 'http'
+import { ConfigService } from './config'
+
+// Sherpa-onnx 类型定义
+type OfflineRecognizer = any
+type OfflineStream = any
+
+type ModelInfo = {
+  name: string
+  files: {
+    model: string
+    tokens: string
+  }
+  sizeBytes: number
+  sizeLabel: string
+}
+
+type DownloadProgress = {
+  modelName: string
+  downloadedBytes: number
+  totalBytes?: number
+  percent?: number
+}
+
+const SENSEVOICE_MODEL: ModelInfo = {
+  name: 'SenseVoiceSmall',
+  files: {
+    model: 'model.int8.onnx',
+    tokens: 'tokens.txt'
+  },
+  sizeBytes: 245_000_000,
+  sizeLabel: '245 MB'
+}
+
+const MODEL_DOWNLOAD_URLS = {
+  model: 'https://modelscope.cn/models/pengzhendong/sherpa-onnx-sense-voice-zh-en-ja-ko-yue/resolve/master/model.int8.onnx',
+  tokens: 'https://modelscope.cn/models/pengzhendong/sherpa-onnx-sense-voice-zh-en-ja-ko-yue/resolve/master/tokens.txt'
+}
+
+export class VoiceTranscribeService {
+  private configService = new ConfigService()
+  private downloadTasks = new Map<string, Promise<{ success: boolean; path?: string; error?: string }>>()
+  private recognizer: OfflineRecognizer | null = null
+  private isInitializing = false
+
+  private resolveModelDir(): string {
+    const configured = this.configService.get('whisperModelDir') as string | undefined
+    if (configured) return configured
+    return join(app.getPath('documents'), 'WeFlow', 'models', 'sensevoice')
+  }
+
+  private resolveModelPath(fileName: string): string {
+    return join(this.resolveModelDir(), fileName)
+  }
+
+  /**
+   * 检查模型状态
+   */
+  async getModelStatus(): Promise<{
+    success: boolean
+    exists?: boolean
+    modelPath?: string
+    tokensPath?: string
+    sizeBytes?: number
+    error?: string
+  }> {
+    try {
+      const modelPath = this.resolveModelPath(SENSEVOICE_MODEL.files.model)
+      const tokensPath = this.resolveModelPath(SENSEVOICE_MODEL.files.tokens)
+      const modelExists = existsSync(modelPath)
+      const tokensExists = existsSync(tokensPath)
+      const exists = modelExists && tokensExists
+
+      if (!exists) {
+        return { success: true, exists: false, modelPath, tokensPath }
+      }
+
+      const modelSize = statSync(modelPath).size
+      const tokensSize = statSync(tokensPath).size
+      const totalSize = modelSize + tokensSize
+
+      return {
+        success: true,
+        exists: true,
+        modelPath,
+        tokensPath,
+        sizeBytes: totalSize
+      }
+    } catch (error) {
+      return { success: false, error: String(error) }
+    }
+  }
+
+  /**
+   * 下载模型文件
+   */
+  async downloadModel(
+    onProgress?: (progress: DownloadProgress) => void
+  ): Promise<{ success: boolean; modelPath?: string; tokensPath?: string; error?: string }> {
+    const cacheKey = 'sensevoice'
+    const pending = this.downloadTasks.get(cacheKey)
+    if (pending) return pending
+
+    const task = (async () => {
+      try {
+        const modelDir = this.resolveModelDir()
+        if (!existsSync(modelDir)) {
+          mkdirSync(modelDir, { recursive: true })
+        }
+
+        const modelPath = this.resolveModelPath(SENSEVOICE_MODEL.files.model)
+        const tokensPath = this.resolveModelPath(SENSEVOICE_MODEL.files.tokens)
+
+        // 初始进度
+        onProgress?.({
+          modelName: SENSEVOICE_MODEL.name,
+          downloadedBytes: 0,
+          totalBytes: SENSEVOICE_MODEL.sizeBytes,
+          percent: 0
+        })
+
+        // 下载模型文件 (40%)
+        console.info('[VoiceTranscribe] 开始下载模型文件...')
+        await this.downloadToFile(
+          MODEL_DOWNLOAD_URLS.model,
+          modelPath,
+          'model',
+          (downloaded, total) => {
+            const percent = total ? (downloaded / total) * 40 : undefined
+            onProgress?.({
+              modelName: SENSEVOICE_MODEL.name,
+              downloadedBytes: downloaded,
+              totalBytes: SENSEVOICE_MODEL.sizeBytes,
+              percent
+            })
+          }
+        )
+
+        // 下载 tokens 文件 (30%)
+        console.info('[VoiceTranscribe] 开始下载 tokens 文件...')
+        await this.downloadToFile(
+          MODEL_DOWNLOAD_URLS.tokens,
+          tokensPath,
+          'tokens',
+          (downloaded, total) => {
+            const modelSize = existsSync(modelPath) ? statSync(modelPath).size : 0
+            const percent = total ? 40 + (downloaded / total) * 30 : 40
+            onProgress?.({
+              modelName: SENSEVOICE_MODEL.name,
+              downloadedBytes: modelSize + downloaded,
+              totalBytes: SENSEVOICE_MODEL.sizeBytes,
+              percent
+            })
+          }
+        )
+
+        console.info('[VoiceTranscribe] 模型下载完成')
+
+        console.info('[VoiceTranscribe] 所有文件下载完成')
+        return { success: true, modelPath, tokensPath }
+      } catch (error) {
+        const modelPath = this.resolveModelPath(SENSEVOICE_MODEL.files.model)
+        const tokensPath = this.resolveModelPath(SENSEVOICE_MODEL.files.tokens)
+        try {
+          if (existsSync(modelPath)) unlinkSync(modelPath)
+          if (existsSync(tokensPath)) unlinkSync(tokensPath)
+        } catch { }
+        return { success: false, error: String(error) }
+      } finally {
+        this.downloadTasks.delete(cacheKey)
+      }
+    })()
+
+    this.downloadTasks.set(cacheKey, task)
+    return task
+  }
+
+  /**
+   * 转写 WAV 音频数据 (后台 Worker Threads 版本)
+   */
+  async transcribeWavBuffer(
+    wavData: Buffer,
+    onPartial?: (text: string) => void,
+    languages?: string[]
+  ): Promise<{ success: boolean; transcript?: string; error?: string }> {
+    return new Promise((resolve) => {
+      try {
+        const modelPath = this.resolveModelPath(SENSEVOICE_MODEL.files.model)
+        const tokensPath = this.resolveModelPath(SENSEVOICE_MODEL.files.tokens)
+
+        if (!existsSync(modelPath) || !existsSync(tokensPath)) {
+          resolve({ success: false, error: '模型文件不存在，请先下载模型' })
+          return
+        }
+
+        // 获取配置的语言列表，如果没有传入则从配置读取
+        let supportedLanguages = languages
+        if (!supportedLanguages || supportedLanguages.length === 0) {
+          supportedLanguages = this.configService.get('transcribeLanguages')
+          // 如果配置中也没有或为空，使用默认值
+          if (!supportedLanguages || supportedLanguages.length === 0) {
+            supportedLanguages = ['zh', 'yue']
+          }
+        }
+
+        const { Worker } = require('worker_threads')
+        // main.js 和 transcribeWorker.js 同在 dist-electron 目录下
+        const workerPath = join(__dirname, 'transcribeWorker.js')
+
+        const worker = new Worker(workerPath, {
+          workerData: {
+            modelPath,
+            tokensPath,
+            wavData,
+            sampleRate: 16000,
+            languages: supportedLanguages
+          }
+        })
+
+        let finalTranscript = ''
+
+        worker.on('message', (msg: any) => {
+          console.log('[VoiceTranscribe] Worker 消息:', msg)
+          if (msg.type === 'partial') {
+            onPartial?.(msg.text)
+          } else if (msg.type === 'final') {
+            finalTranscript = msg.text
+            console.log('[VoiceTranscribe] 最终文本:', finalTranscript)
+            resolve({ success: true, transcript: finalTranscript })
+            worker.terminate()
+          } else if (msg.type === 'error') {
+            console.error('[VoiceTranscribe] Worker 错误:', msg.error)
+            resolve({ success: false, error: msg.error })
+            worker.terminate()
+          }
+        })
+
+        worker.on('error', (err: Error) => {
+          resolve({ success: false, error: String(err) })
+        })
+
+        worker.on('exit', (code: number) => {
+          if (code !== 0) {
+            console.error(`[VoiceTranscribe] Worker stopped with exit code ${code}`)
+            resolve({ success: false, error: `Worker exited with code ${code}` })
+          }
+        })
+
+      } catch (error) {
+        resolve({ success: false, error: String(error) })
+      }
+    })
+  }
+
+  /**
+   * 下载文件
+   */
+  private downloadToFile(
+    url: string,
+    targetPath: string,
+    fileName: string,
+    onProgress?: (downloaded: number, total?: number) => void,
+    remainingRedirects = 5
+  ): Promise<void> {
+    return new Promise((resolve, reject) => {
+      const protocol = url.startsWith('https') ? https : http
+      console.info(`[VoiceTranscribe] 下载 ${fileName}:`, url)
+
+      const options = {
+        headers: {
+          'User-Agent': 'Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/120.0.0.0 Safari/537.36'
+        },
+        timeout: 30000 // 30秒连接超时
+      }
+
+      const request = protocol.get(url, options, (response) => {
+        console.info(`[VoiceTranscribe] ${fileName} 响应状态:`, response.statusCode)
+
+        // 处理重定向
+        if ([301, 302, 303, 307, 308].includes(response.statusCode || 0) && response.headers.location) {
+          if (remainingRedirects <= 0) {
+            reject(new Error('重定向次数过多'))
+            return
+          }
+          console.info(`[VoiceTranscribe] 重定向到:`, response.headers.location)
+          this.downloadToFile(response.headers.location, targetPath, fileName, onProgress, remainingRedirects - 1)
+            .then(resolve)
+            .catch(reject)
+          return
+        }
+
+        if (response.statusCode !== 200) {
+          reject(new Error(`下载失败: HTTP ${response.statusCode}`))
+          return
+        }
+
+        const totalBytes = Number(response.headers['content-length'] || 0) || undefined
+        let downloadedBytes = 0
+
+        console.info(`[VoiceTranscribe] ${fileName} 文件大小:`, totalBytes ? `${(totalBytes / 1024 / 1024).toFixed(2)} MB` : '未知')
+
+        const writer = createWriteStream(targetPath)
+
+        // 设置数据接收超时（60秒没有数据则超时）
+        let lastDataTime = Date.now()
+        const dataTimeout = setInterval(() => {
+          if (Date.now() - lastDataTime > 60000) {
+            clearInterval(dataTimeout)
+            response.destroy()
+            writer.close()
+            reject(new Error('下载超时：60秒内未收到数据'))
+          }
+        }, 5000)
+
+        response.on('data', (chunk) => {
+          lastDataTime = Date.now()
+          downloadedBytes += chunk.length
+          onProgress?.(downloadedBytes, totalBytes)
+        })
+
+        response.on('error', (error) => {
+          clearInterval(dataTimeout)
+          try { writer.close() } catch { }
+          console.error(`[VoiceTranscribe] ${fileName} 响应错误:`, error)
+          reject(error)
+        })
+
+        writer.on('error', (error) => {
+          clearInterval(dataTimeout)
+          try { writer.close() } catch { }
+          console.error(`[VoiceTranscribe] ${fileName} 写入错误:`, error)
+          reject(error)
+        })
+
+        writer.on('finish', () => {
+          clearInterval(dataTimeout)
+          writer.close()
+          console.info(`[VoiceTranscribe] ${fileName} 下载完成:`, targetPath)
+          resolve()
+        })
+
+        response.pipe(writer)
+      })
+
+      request.on('timeout', () => {
+        request.destroy()
+        console.error(`[VoiceTranscribe] ${fileName} 连接超时`)
+        reject(new Error('连接超时'))
+      })
+
+      request.on('error', (error) => {
+        console.error(`[VoiceTranscribe] ${fileName} 请求错误:`, error)
+        reject(error)
+      })
+    })
+  }
+
+  /**
+   * 清理资源
+   */
+  dispose() {
+    if (this.recognizer) {
+      try {
+        // sherpa-onnx 的 recognizer 可能需要手动释放
+        this.recognizer = null
+      } catch (error) {
+      }
+    }
+  }
+}
+
+export const voiceTranscribeService = new VoiceTranscribeService()
+

electron/services/windowsHelloService.ts

@@ -0,0 +1,32 @@
+import { wcdbService } from './wcdbService'
+import { BrowserWindow } from 'electron'
+
+export class WindowsHelloService {
+    private verificationPromise: Promise<{ success: boolean; error?: string }> | null = null
+
+    /**
+     * 验证 Windows Hello
+     * @param message 提示信息
+     */
+    async verify(message: string = '请验证您的身份以解锁 WeFlow', targetWindow?: BrowserWindow): Promise<{ success: boolean; error?: string }> {
+        // Prevent concurrent verification requests
+        if (this.verificationPromise) {
+            return this.verificationPromise
+        }
+
+        // 获取窗口句柄: 优先使用传入的窗口，否则尝试获取焦点窗口，最后兜底主窗口
+        const window = targetWindow || BrowserWindow.getFocusedWindow() || BrowserWindow.getAllWindows()[0]
+        const hwndBuffer = window?.getNativeWindowHandle()
+        // Convert buffer to int string for transport
+        const hwndStr = hwndBuffer ? BigInt('0x' + hwndBuffer.toString('hex')).toString() : undefined
+
+        this.verificationPromise = wcdbService.verifyUser(message, hwndStr)
+            .finally(() => {
+                this.verificationPromise = null
+            })
+
+        return this.verificationPromise
+    }
+}
+
+export const windowsHelloService = new WindowsHelloService()

electron/transcribeWorker.ts

@@ -0,0 +1,166 @@
+import { parentPort, workerData } from 'worker_threads'
+
+interface WorkerParams {
+    modelPath: string
+    tokensPath: string
+    wavData: Buffer
+    sampleRate: number
+    languages?: string[]
+}
+
+// 语言标记映射
+const LANGUAGE_TAGS: Record<string, string> = {
+    'zh': '<|zh|>',
+    'en': '<|en|>',
+    'ja': '<|ja|>',
+    'ko': '<|ko|>',
+    'yue': '<|yue|>' // 粤语
+}
+
+// 技术标签（识别语言、语速、ITN等），需要从最终文本中移除
+const TECH_TAGS = [
+    '<|zh|>', '<|en|>', '<|ja|>', '<|ko|>', '<|yue|>',
+    '<|nospeech|>', '<|speech|>',
+    '<|itn|>', '<|wo_itn|>',
+    '<|NORMAL|>'
+]
+
+// 情感与事件标签映射，转换为直观的 Emoji
+const RICH_TAG_MAP: Record<string, string> = {
+    '<|HAPPY|>': '😊',
+    '<|SAD|>': '😔',
+    '<|ANGRY|>': '😠',
+    '<|NEUTRAL|>': '', // 中性情感不特别标记
+    '<|FEARFUL|>': '😨',
+    '<|DISGUSTED|>': '🤢',
+    '<|SURPRISED|>': '😮',
+    '<|BGM|>': '🎵',
+    '<|Applause|>': '👏',
+    '<|Laughter|>': '😂',
+    '<|Cry|>': '😭',
+    '<|Cough|>': ' (咳嗽) ',
+    '<|Sneeze|>': ' (喷嚏) ',
+}
+
+/**
+ * 富文本后处理：移除技术标签，转换识别出的情感和声音事件
+ */
+function richTranscribePostProcess(text: string): string {
+    if (!text) return ''
+
+    let processed = text
+
+    // 1. 转换情感和事件标签
+    for (const [tag, replacement] of Object.entries(RICH_TAG_MAP)) {
+        // 使用正则全局替换，不区分大小写以防不同版本差异
+        const escapedTag = tag.replace(/[|<>]/g, '\\$&')
+        processed = processed.replace(new RegExp(escapedTag, 'gi'), replacement)
+    }
+
+    // 2. 移除所有剩余的技术标签
+    for (const tag of TECH_TAGS) {
+        const escapedTag = tag.replace(/[|<>]/g, '\\$&')
+        processed = processed.replace(new RegExp(escapedTag, 'gi'), '')
+    }
+
+    // 3. 清理多余空格并返回
+    return processed.replace(/\s+/g, ' ').trim()
+}
+
+// 检查识别结果是否在允许的语言列表中
+function isLanguageAllowed(result: any, allowedLanguages: string[]): boolean {
+    if (!result || !result.lang) {
+        // 如果没有语言信息，默认允许（或从文本开头尝试提取）
+        return true
+    }
+
+    // 如果没有指定语言或语言列表为空，默认允许中文和粤语
+    if (!allowedLanguages || allowedLanguages.length === 0) {
+        allowedLanguages = ['zh', 'yue']
+    }
+
+    const langTag = result.lang
+    console.log('[TranscribeWorker] 检测到语言标记:', langTag)
+
+    // 检查是否在允许的语言列表中
+    for (const lang of allowedLanguages) {
+        if (LANGUAGE_TAGS[lang] === langTag) {
+            console.log('[TranscribeWorker] 语言匹配，允许:', lang)
+            return true
+        }
+    }
+
+    console.log('[TranscribeWorker] 语言不在白名单中，过滤掉')
+    return false
+}
+
+async function run() {
+    if (!parentPort) {
+        return;
+    }
+
+    try {
+        // 动态加载以捕获可能的加载错误（如 C++ 运行库缺失等）
+        let sherpa: any;
+        try {
+            sherpa = require('sherpa-onnx-node');
+        } catch (requireError) {
+            parentPort.postMessage({ type: 'error', error: 'Failed to load speech engine: ' + String(requireError) });
+            return;
+        }
+
+        const { modelPath, tokensPath, wavData: rawWavData, sampleRate, languages } = workerData as WorkerParams
+        const wavData = Buffer.from(rawWavData);
+        // 确保有有效的语言列表，默认只允许中文
+        let allowedLanguages = languages || ['zh']
+        if (allowedLanguages.length === 0) {
+            allowedLanguages = ['zh']
+        }
+
+        console.log('[TranscribeWorker] 使用的语言白名单:', allowedLanguages)
+
+        // 1. 初始化识别器 (SenseVoiceSmall)
+        const recognizerConfig = {
+            modelConfig: {
+                senseVoice: {
+                    model: modelPath,
+                    useInverseTextNormalization: 1
+                },
+                tokens: tokensPath,
+                numThreads: 2,
+                debug: 0
+            }
+        }
+        const recognizer = new sherpa.OfflineRecognizer(recognizerConfig)
+
+        // 2. 处理音频数据 (全量识别)
+        const pcmData = wavData.slice(44)
+        const samples = new Float32Array(pcmData.length / 2)
+        for (let i = 0; i < samples.length; i++) {
+            samples[i] = pcmData.readInt16LE(i * 2) / 32768.0
+        }
+
+        const stream = recognizer.createStream()
+        stream.acceptWaveform({ sampleRate, samples })
+        recognizer.decode(stream)
+        const result = recognizer.getResult(stream)
+
+        console.log('[TranscribeWorker] 识别完成 - 结果对象:', JSON.stringify(result, null, 2))
+
+        // 3. 检查语言是否在白名单中
+        if (isLanguageAllowed(result, allowedLanguages)) {
+            const processedText = richTranscribePostProcess(result.text)
+            console.log('[TranscribeWorker] 语言匹配，返回文本:', processedText)
+            parentPort.postMessage({ type: 'final', text: processedText })
+        } else {
+            console.log('[TranscribeWorker] 语言不匹配，返回空文本')
+            parentPort.postMessage({ type: 'final', text: '' })
+        }
+
+    } catch (error) {
+        parentPort.postMessage({ type: 'error', error: String(error) })
+    }
+}
+
+run();
+

electron/types/sherpa-onnx-node.d.ts

@@ -0,0 +1,4 @@
+declare module 'sherpa-onnx-node' {
+    const content: any;
+    export = content;
+}

electron/types/whisper-node.d.ts

@@ -0,0 +1,22 @@
+declare module 'whisper-node' {
+  export type WhisperSegment = {
+    start: string
+    end: string
+    speech: string
+  }
+
+  export type WhisperOptions = {
+    modelName?: string
+    modelPath?: string
+    whisperOptions?: {
+      language?: string
+      gen_file_txt?: boolean
+      gen_file_subtitle?: boolean
+      gen_file_vtt?: boolean
+      word_timestamps?: boolean
+      timestamp_size?: number
+    }
+  }
+
+  export default function whisper(filePath: string, options?: WhisperOptions): Promise<WhisperSegment[]>
+}

electron/wcdbWorker.ts

@@ -0,0 +1,134 @@
+import { parentPort, workerData } from 'worker_threads'
+import { WcdbCore } from './services/wcdbCore'
+
+const core = new WcdbCore()
+
+if (parentPort) {
+    parentPort.on('message', async (msg) => {
+        const { id, type, payload } = msg
+
+        try {
+            let result: any
+
+            switch (type) {
+                case 'setPaths':
+                    core.setPaths(payload.resourcesPath, payload.userDataPath)
+                    result = { success: true }
+                    break
+                case 'setLogEnabled':
+                    core.setLogEnabled(payload.enabled)
+                    result = { success: true }
+                    break
+                case 'testConnection':
+                    result = await core.testConnection(payload.dbPath, payload.hexKey, payload.wxid)
+                    break
+                case 'open':
+                    result = await core.open(payload.dbPath, payload.hexKey, payload.wxid)
+                    break
+                case 'close':
+                    core.close()
+                    result = { success: true }
+                    break
+                case 'isConnected':
+                    result = core.isConnected()
+                    break
+                case 'getSessions':
+                    result = await core.getSessions()
+                    break
+                case 'getMessages':
+                    result = await core.getMessages(payload.sessionId, payload.limit, payload.offset)
+                    break
+                case 'getMessageCount':
+                    result = await core.getMessageCount(payload.sessionId)
+                    break
+                case 'getDisplayNames':
+                    result = await core.getDisplayNames(payload.usernames)
+                    break
+                case 'getAvatarUrls':
+                    result = await core.getAvatarUrls(payload.usernames)
+                    break
+                case 'getGroupMemberCount':
+                    result = await core.getGroupMemberCount(payload.chatroomId)
+                    break
+                case 'getGroupMemberCounts':
+                    result = await core.getGroupMemberCounts(payload.chatroomIds)
+                    break
+                case 'getGroupMembers':
+                    result = await core.getGroupMembers(payload.chatroomId)
+                    break
+                case 'getMessageTables':
+                    result = await core.getMessageTables(payload.sessionId)
+                    break
+                case 'getMessageTableStats':
+                    result = await core.getMessageTableStats(payload.sessionId)
+                    break
+                case 'getMessageMeta':
+                    result = await core.getMessageMeta(payload.dbPath, payload.tableName, payload.limit, payload.offset)
+                    break
+                case 'getContact':
+                    result = await core.getContact(payload.username)
+                    break
+                case 'getAggregateStats':
+                    result = await core.getAggregateStats(payload.sessionIds, payload.beginTimestamp, payload.endTimestamp)
+                    break
+                case 'getAvailableYears':
+                    result = await core.getAvailableYears(payload.sessionIds)
+                    break
+                case 'getAnnualReportStats':
+                    result = await core.getAnnualReportStats(payload.sessionIds, payload.beginTimestamp, payload.endTimestamp)
+                    break
+                case 'getAnnualReportExtras':
+                    result = await core.getAnnualReportExtras(payload.sessionIds, payload.beginTimestamp, payload.endTimestamp, payload.peakDayBegin, payload.peakDayEnd)
+                    break
+                case 'getGroupStats':
+                    result = await core.getGroupStats(payload.chatroomId, payload.beginTimestamp, payload.endTimestamp)
+                    break
+                case 'openMessageCursor':
+                    result = await core.openMessageCursor(payload.sessionId, payload.batchSize, payload.ascending, payload.beginTimestamp, payload.endTimestamp)
+                    break
+                case 'openMessageCursorLite':
+                    result = await core.openMessageCursorLite(payload.sessionId, payload.batchSize, payload.ascending, payload.beginTimestamp, payload.endTimestamp)
+                    break
+                case 'fetchMessageBatch':
+                    result = await core.fetchMessageBatch(payload.cursor)
+                    break
+                case 'closeMessageCursor':
+                    result = await core.closeMessageCursor(payload.cursor)
+                    break
+                case 'execQuery':
+                    result = await core.execQuery(payload.kind, payload.path, payload.sql)
+                    break
+                case 'getEmoticonCdnUrl':
+                    result = await core.getEmoticonCdnUrl(payload.dbPath, payload.md5)
+                    break
+                case 'listMessageDbs':
+                    result = await core.listMessageDbs()
+                    break
+                case 'listMediaDbs':
+                    result = await core.listMediaDbs()
+                    break
+                case 'getMessageById':
+                    result = await core.getMessageById(payload.sessionId, payload.localId)
+                    break
+                case 'getVoiceData':
+                    result = await core.getVoiceData(payload.sessionId, payload.createTime, payload.candidates, payload.localId, payload.svrId)
+                    if (!result.success) {
+                        console.error('[wcdbWorker] getVoiceData failed:', result.error)
+                    }
+                    break
+                case 'getSnsTimeline':
+                    result = await core.getSnsTimeline(payload.limit, payload.offset, payload.usernames, payload.keyword, payload.startTime, payload.endTime)
+                    break
+                case 'verifyUser':
+                    result = await core.verifyUser(payload.message, payload.hwnd)
+                    break
+                default:
+                    result = { success: false, error: `Unknown method: ${type}` }
+            }
+
+            parentPort!.postMessage({ id, result })
+        } catch (e) {
+            parentPort!.postMessage({ id, error: String(e) })
+        }
+    })
+}

installer.nsh

@@ -2,6 +2,7 @@
 ManifestDPIAware true
 
 !include "WordFunc.nsh"
+!include "nsDialogs.nsh"
 
 !macro customInit
   ; 设置 DPI 感知
@@ -16,3 +17,49 @@ ManifestDPIAware true
     StrCpy $INSTDIR "$INSTDIR\WeFlow"
   ${EndIf}
 !macroend
+
+; 安装完成后检测并安装 VC++ Redistributable
+!macro customInstall
+  ; 检查 VC++ 2015-2022 x64 是否已安装
+  ReadRegStr $0 HKLM "SOFTWARE\Microsoft\VisualStudio\14.0\VC\Runtimes\x64" "Installed"
+  ${If} $0 != "1"
+    ; 未安装，显示提示并下载
+    MessageBox MB_YESNO|MB_ICONQUESTION "检测到系统缺少 Visual C++ 运行库，这可能导致程序无法正常运行。$\n$\n是否立即下载并安装？（约 24MB）" IDYES downloadVC IDNO skipVC
+    
+    downloadVC:
+      DetailPrint "正在下载 Visual C++ Redistributable..."
+      SetOutPath "$TEMP"
+      
+      ; 从微软官方下载 VC++ Redistributable x64
+      inetc::get /TIMEOUT=30000 /CAPTION "下载 Visual C++ 运行库" /BANNER "正在下载，请稍候..." \
+        "https://aka.ms/vs/17/release/vc_redist.x64.exe" "$TEMP\vc_redist.x64.exe" /END
+      Pop $0
+      
+      ${If} $0 == "OK"
+        DetailPrint "下载完成，正在安装..."
+        ; 使用 ShellExecute 以管理员权限运行
+        ExecShell "runas" '"$TEMP\vc_redist.x64.exe"' "/install /quiet /norestart" SW_HIDE
+        ; 等待安装完成
+        Sleep 5000
+        ; 检查是否安装成功
+        ReadRegStr $1 HKLM "SOFTWARE\Microsoft\VisualStudio\14.0\VC\Runtimes\x64" "Installed"
+        ${If} $1 == "1"
+          DetailPrint "Visual C++ Redistributable 安装成功"
+          MessageBox MB_OK|MB_ICONINFORMATION "Visual C++ 运行库安装成功！"
+        ${Else}
+          MessageBox MB_OK|MB_ICONEXCLAMATION "Visual C++ 运行库安装失败，你可能需要手动安装。"
+        ${EndIf}
+        Delete "$TEMP\vc_redist.x64.exe"
+      ${Else}
+        MessageBox MB_OK|MB_ICONEXCLAMATION "下载失败：$0$\n$\n你可以稍后手动下载安装 Visual C++ Redistributable。"
+      ${EndIf}
+      Goto doneVC
+    
+    skipVC:
+      DetailPrint "用户跳过 Visual C++ Redistributable 安装"
+    
+    doneVC:
+  ${Else}
+    DetailPrint "Visual C++ Redistributable 已安装"
+  ${EndIf}
+!macroend

package.json

@@ -1,16 +1,18 @@
 {
   "name": "weflow",
-  "version": "1.0.2",
+  "version": "1.4.3",
-  "description": "WeFlow - 微信聊天记录查看工具",
+  "description": "WeFlow",
   "main": "dist-electron/main.js",
-  "author": "cc", 
+  "author": "cc",
+  "//": "二改不应改变此处的作者与应用信息",
   "scripts": {
+    "postinstall": "echo 'No native modules to rebuild'",
+    "rebuild": "electron-rebuild",
     "dev": "vite",
     "build": "tsc && vite build && electron-builder",
     "preview": "vite preview",
     "electron:dev": "vite --mode electron",
-    "electron:build": "npm run build",
+    "electron:build": "npm run build"
-    "postinstall": "electron-rebuild"
   },
   "dependencies": {
     "better-sqlite3": "^12.5.0",
@@ -18,6 +20,8 @@
     "echarts-for-react": "^3.0.2",
     "electron-store": "^10.0.0",
     "electron-updater": "^6.3.9",
+    "exceljs": "^4.4.0",
+    "ffmpeg-static": "^5.3.0",
     "fzstd": "^0.1.1",
     "html2canvas": "^1.4.1",
     "jieba-wasm": "^2.2.0",
@@ -27,6 +31,8 @@
     "react": "^19.2.3",
     "react-dom": "^19.2.3",
     "react-router-dom": "^7.1.1",
+    "sherpa-onnx-node": "^1.10.38",
+    "silk-wasm": "^3.7.1",
     "wechat-emojis": "^1.0.2",
     "zustand": "^5.0.2"
   },
@@ -64,7 +70,7 @@
     },
     "nsis": {
       "oneClick": false,
-      "differentialPackage":false,
+      "differentialPackage": false,
       "allowToChangeInstallationDirectory": true,
       "createDesktopShortcut": true,
       "unicode": true,
@@ -96,6 +102,28 @@
     "files": [
       "dist/**/*",
       "dist-electron/**/*"
+    ],
+    "asarUnpack": [
+      "node_modules/silk-wasm/**/*",
+      "node_modules/sherpa-onnx-node/**/*"
+    ],
+    "extraFiles": [
+      {
+        "from": "resources/msvcp140.dll",
+        "to": "."
+      },
+      {
+        "from": "resources/msvcp140_1.dll",
+        "to": "."
+      },
+      {
+        "from": "resources/vcruntime140.dll",
+        "to": "."
+      },
+      {
+        "from": "resources/vcruntime140_1.dll",
+        "to": "."
+      }
     ]
   }
 }

src/App.tsx

@@ -7,38 +7,65 @@ import WelcomePage from './pages/WelcomePage'
 import HomePage from './pages/HomePage'
 import ChatPage from './pages/ChatPage'
 import AnalyticsPage from './pages/AnalyticsPage'
+import AnalyticsWelcomePage from './pages/AnalyticsWelcomePage'
 import AnnualReportPage from './pages/AnnualReportPage'
 import AnnualReportWindow from './pages/AnnualReportWindow'
 import AgreementPage from './pages/AgreementPage'
 import GroupAnalyticsPage from './pages/GroupAnalyticsPage'
-import DataManagementPage from './pages/DataManagementPage'
 import SettingsPage from './pages/SettingsPage'
 import ExportPage from './pages/ExportPage'
+import VideoWindow from './pages/VideoWindow'
+import SnsPage from './pages/SnsPage'
+import ContactsPage from './pages/ContactsPage'
+import ChatHistoryPage from './pages/ChatHistoryPage'
+
 import { useAppStore } from './stores/appStore'
 import { themes, useThemeStore, type ThemeId } from './stores/themeStore'
 import * as configService from './services/config'
 import { Download, X, Shield } from 'lucide-react'
 import './App.scss'
 
+import UpdateDialog from './components/UpdateDialog'
+import UpdateProgressCapsule from './components/UpdateProgressCapsule'
+import LockScreen from './components/LockScreen'
+
 function App() {
   const navigate = useNavigate()
   const location = useLocation()
-  const { setDbConnected } = useAppStore()
+  const {
+    setDbConnected,
+    updateInfo,
+    setUpdateInfo,
+    isDownloading,
+    setIsDownloading,
+    downloadProgress,
+    setDownloadProgress,
+    showUpdateDialog,
+    setShowUpdateDialog,
+    setUpdateError,
+    isLocked,
+    setLocked
+  } = useAppStore()
+
   const { currentTheme, themeMode, setTheme, setThemeMode } = useThemeStore()
   const isAgreementWindow = location.pathname === '/agreement-window'
   const isOnboardingWindow = location.pathname === '/onboarding-window'
+  const isVideoPlayerWindow = location.pathname === '/video-player-window'
+  const isChatHistoryWindow = location.pathname.startsWith('/chat-history/')
   const [themeHydrated, setThemeHydrated] = useState(false)
 
+  // 锁定状态
+  // const [isLocked, setIsLocked] = useState(false) // Moved to store
+  const [lockAvatar, setLockAvatar] = useState<string | undefined>(
+    localStorage.getItem('app_lock_avatar') || undefined
+  )
+  const [lockUseHello, setLockUseHello] = useState(false)
+
   // 协议同意状态
   const [showAgreement, setShowAgreement] = useState(false)
   const [agreementChecked, setAgreementChecked] = useState(false)
   const [agreementLoading, setAgreementLoading] = useState(true)
 
-  // 更新提示状态
-  const [updateInfo, setUpdateInfo] = useState<{ version: string; releaseNotes: string } | null>(null)
-  const [isDownloading, setIsDownloading] = useState(false)
-  const [downloadProgress, setDownloadProgress] = useState(0)
-
   useEffect(() => {
     const root = document.documentElement
     const body = document.body
@@ -143,26 +170,34 @@ function App() {
 
   // 监听启动时的更新通知
   useEffect(() => {
-    const removeUpdateListener = window.electronAPI.app.onUpdateAvailable?.((info) => {
+    const removeUpdateListener = window.electronAPI.app.onUpdateAvailable?.((info: any) => {
-      setUpdateInfo(info)
+      // 发现新版本时自动打开更新弹窗
+      if (info) {
+        setUpdateInfo({ ...info, hasUpdate: true })
+        setShowUpdateDialog(true)
+      }
     })
-    const removeProgressListener = window.electronAPI.app.onDownloadProgress?.((progress) => {
+    const removeProgressListener = window.electronAPI.app.onDownloadProgress?.((progress: any) => {
       setDownloadProgress(progress)
     })
     return () => {
       removeUpdateListener?.()
       removeProgressListener?.()
     }
-  }, [])
+  }, [setUpdateInfo, setDownloadProgress, setShowUpdateDialog])
 
   const handleUpdateNow = async () => {
+    setShowUpdateDialog(false)
     setIsDownloading(true)
-    setDownloadProgress(0)
+    setDownloadProgress({ percent: 0 })
     try {
       await window.electronAPI.app.downloadAndInstall()
-    } catch (e) {
+    } catch (e: any) {
       console.error('更新失败:', e)
       setIsDownloading(false)
+      // Extract clean error message if possible
+      const errorMsg = e.message || String(e)
+      setUpdateError(errorMsg.includes('暂时禁用') ? '自动更新已暂时禁用' : errorMsg)
     }
   }
 
@@ -180,15 +215,21 @@ function App() {
         const decryptKey = await configService.getDecryptKey()
         const wxid = await configService.getMyWxid()
         const onboardingDone = await configService.getOnboardingDone()
+        const wxidConfig = wxid ? await configService.getWxidConfig(wxid) : null
+        const effectiveDecryptKey = wxidConfig?.decryptKey || decryptKey
+
+        if (wxidConfig?.decryptKey && wxidConfig.decryptKey !== decryptKey) {
+          await configService.setDecryptKey(wxidConfig.decryptKey)
+        }
 
         // 如果配置完整，自动测试连接
-        if (dbPath && decryptKey && wxid) {
+        if (dbPath && effectiveDecryptKey && wxid) {
           if (!onboardingDone) {
             await configService.setOnboardingDone(true)
           }
           console.log('检测到已保存的配置，正在自动连接...')
           const result = await window.electronAPI.chat.connect()
-          
+
           if (result.success) {
             console.log('自动连接成功')
             setDbConnected(true, dbPath)
@@ -198,16 +239,57 @@ function App() {
             }
           } else {
             console.log('自动连接失败:', result.error)
+            // 如果错误信息包含 VC++ 或 DLL 相关内容，不清除配置，只提示用户
+            // 其他错误可能需要重新配置
+            const errorMsg = result.error || ''
+            if (errorMsg.includes('Visual C++') ||
+              errorMsg.includes('DLL') ||
+              errorMsg.includes('Worker') ||
+              errorMsg.includes('126') ||
+              errorMsg.includes('模块')) {
+              console.warn('检测到可能的运行时依赖问题:', errorMsg)
+              // 不清除配置，让用户安装 VC++ 后重试
+            }
           }
         }
       } catch (e) {
         console.error('自动连接出错:', e)
+        // 捕获异常但不清除配置，防止循环重新引导
       }
     }
 
     autoConnect()
   }, [isAgreementWindow, isOnboardingWindow, navigate, setDbConnected])
 
+  // 检查应用锁
+  useEffect(() => {
+    if (isAgreementWindow || isOnboardingWindow || isVideoPlayerWindow) return
+
+    const checkLock = async () => {
+      // 并行获取配置，减少等待
+      const [enabled, useHello] = await Promise.all([
+        configService.getAuthEnabled(),
+        configService.getAuthUseHello()
+      ])
+
+      if (enabled) {
+        setLockUseHello(useHello)
+        setLocked(true)
+        // 尝试获取头像
+        try {
+          const result = await window.electronAPI.chat.getMyAvatarUrl()
+          if (result && result.success && result.avatarUrl) {
+            setLockAvatar(result.avatarUrl)
+            localStorage.setItem('app_lock_avatar', result.avatarUrl)
+          }
+        } catch (e) {
+          console.error('获取锁屏头像失败', e)
+        }
+      }
+    }
+    checkLock()
+  }, [isAgreementWindow, isOnboardingWindow, isVideoPlayerWindow])
+
   // 独立协议窗口
   if (isAgreementWindow) {
     return <AgreementPage />
@@ -217,11 +299,31 @@ function App() {
     return <WelcomePage standalone />
   }
 
+  // 独立视频播放窗口
+  if (isVideoPlayerWindow) {
+    return <VideoWindow />
+  }
+
+  // 独立聊天记录窗口
+  if (isChatHistoryWindow) {
+    return <ChatHistoryPage />
+  }
+
   // 主窗口 - 完整布局
   return (
     <div className="app-container">
+      {isLocked && (
+        <LockScreen
+          onUnlock={() => setLocked(false)}
+          avatar={lockAvatar}
+          useHello={lockUseHello}
+        />
+      )}
       <TitleBar />
 
+      {/* 全局悬浮进度胶囊 (处理：新版本提示、下载进度、错误提示) */}
+      <UpdateProgressCapsule />
+
       {/* 用户协议弹窗 */}
       {showAgreement && !agreementLoading && (
         <div className="agreement-overlay">
@@ -243,13 +345,13 @@ function App() {
               </div>
               <div className="agreement-text">
                 <h4>1. 数据安全</h4>
-                <p>本软件所有数据处理均在本地完成，不会上传任何聊天记录、个人信息到服务器。您的数据完全由您自己掌控。</p>
+                <p>本软件所有数据处理均在本地完成，不会上传任何聊天记录、个人信息到服务器。你的数据完全由你自己掌控。</p>
 
                 <h4>2. 使用须知</h4>
-                <p>本软件仅供个人学习研究使用，请勿用于任何非法用途。使用本软件解密、查看、分析的数据应为您本人所有或已获得授权。</p>
+                <p>本软件仅供个人学习研究使用，请勿用于任何非法用途。使用本软件解密、查看、分析的数据应为你本人所有或已获得授权。</p>
 
                 <h4>3. 免责声明</h4>
-                <p>因使用本软件产生的任何直接或间接损失，开发者不承担任何责任。请确保您的使用行为符合当地法律法规。</p>
+                <p>因使用本软件产生的任何直接或间接损失，开发者不承担任何责任。请确保你的使用行为符合当地法律法规。</p>
 
                 <h4>4. 隐私保护</h4>
                 <p>本软件不收集任何用户数据。软件更新检测仅获取版本信息，不涉及任何个人隐私。</p>
@@ -273,31 +375,15 @@ function App() {
         </div>
       )}
 
-      {/* 更新提示条 */}
+      {/* 更新提示对话框 */}
-      {updateInfo && (
+      <UpdateDialog
-        <div className="update-banner">
+        open={showUpdateDialog}
-          <span className="update-text">
+        updateInfo={updateInfo}
-            发现新版本 <strong>v{updateInfo.version}</strong>
+        onClose={() => setShowUpdateDialog(false)}
-          </span>
+        onUpdate={handleUpdateNow}
-          {isDownloading ? (
+        isDownloading={isDownloading}
-            <div className="update-progress">
+        progress={downloadProgress}
-              <div className="progress-bar">
+      />
-                <div className="progress-fill" style={{ width: `${downloadProgress}%` }} />
-              </div>
-              <span>{downloadProgress.toFixed(0)}%</span>
-            </div>
-          ) : (
-            <>
-              <button className="update-btn" onClick={handleUpdateNow}>
-                <Download size={14} /> 立即更新
-              </button>
-              <button className="dismiss-btn" onClick={dismissUpdate}>
-                <X size={14} />
-              </button>
-            </>
-          )}
-        </div>
-      )}
 
       <div className="main-layout">
         <Sidebar />
@@ -307,13 +393,17 @@ function App() {
               <Route path="/" element={<HomePage />} />
               <Route path="/home" element={<HomePage />} />
               <Route path="/chat" element={<ChatPage />} />
-              <Route path="/analytics" element={<AnalyticsPage />} />
+              <Route path="/analytics" element={<AnalyticsWelcomePage />} />
+              <Route path="/analytics/view" element={<AnalyticsPage />} />
               <Route path="/group-analytics" element={<GroupAnalyticsPage />} />
               <Route path="/annual-report" element={<AnnualReportPage />} />
               <Route path="/annual-report/view" element={<AnnualReportWindow />} />
-              <Route path="/data-management" element={<DataManagementPage />} />
+
               <Route path="/settings" element={<SettingsPage />} />
               <Route path="/export" element={<ExportPage />} />
+              <Route path="/sns" element={<SnsPage />} />
+              <Route path="/contacts" element={<ContactsPage />} />
+              <Route path="/chat-history/:sessionId/:messageId" element={<ChatHistoryPage />} />
             </Routes>
           </RouteGuard>
         </main>

src/components/AnimatedStreamingText.tsx

@@ -0,0 +1,73 @@
+import React, { memo, useEffect, useState, useRef } from 'react'
+
+interface AnimatedStreamingTextProps {
+    text: string
+    className?: string
+    loading?: boolean
+}
+
+export const AnimatedStreamingText = memo(({ text, className, loading }: AnimatedStreamingTextProps) => {
+    const [displayedSegments, setDisplayedSegments] = useState<string[]>([])
+    const prevTextRef = useRef('')
+
+    useEffect(() => {
+        const currentText = (text || '').trim()
+        const prevText = prevTextRef.current
+
+        if (currentText === prevText) return
+        if (!currentText.startsWith(prevText) && prevText !== '') {
+            // 如果不是追加而是全新的文本（比如重新识别），则重置
+            setDisplayedSegments([currentText])
+            prevTextRef.current = currentText
+            return
+        }
+
+        const newPart = currentText.slice(prevText.length)
+        if (newPart) {
+            // 将新部分作为单独的段加入，以触发动画
+            setDisplayedSegments(prev => [...prev, newPart])
+        }
+        prevTextRef.current = currentText
+    }, [text])
+
+    // 处理 loading 状态的显示
+    if (loading && !text) {
+        return <span className={className}>转写中<span className="dot-flashing">...</span></span>
+    }
+
+    return (
+        <span className={className}>
+            {displayedSegments.map((segment, index) => (
+                <span key={index} className="fade-in-text">
+                    {segment}
+                </span>
+            ))}
+            <style>{`
+        .fade-in-text {
+          animation: premiumFadeIn 0.8s cubic-bezier(0.16, 1, 0.3, 1) forwards;
+          opacity: 0;
+          display: inline-block;
+          filter: blur(4px);
+        }
+        @keyframes premiumFadeIn {
+          from { 
+            opacity: 0; 
+            transform: translateY(4px) scale(0.98);
+            filter: blur(4px);
+          }
+          to { 
+            opacity: 1; 
+            transform: translateY(0) scale(1);
+            filter: blur(0);
+          }
+        }
+        .dot-flashing {
+           animation: blink 1s infinite;
+        }
+        @keyframes blink { 50% { opacity: 0; } }
+      `}</style>
+        </span>
+    )
+})
+
+AnimatedStreamingText.displayName = 'AnimatedStreamingText'

src/components/Avatar.scss

@@ -0,0 +1,79 @@
+.avatar-component {
+    position: relative;
+    display: inline-block;
+    overflow: hidden;
+    background-color: var(--bg-tertiary, #f5f5f5);
+    flex-shrink: 0;
+    border-radius: 4px;
+    /* Default radius */
+
+    &.circle {
+        border-radius: 50%;
+    }
+
+    &.rounded {
+        border-radius: 6px;
+    }
+
+    /* Image styling */
+    img.avatar-image {
+        width: 100%;
+        height: 100%;
+        object-fit: cover;
+        opacity: 0;
+        transition: opacity 0.3s ease-in-out;
+        border-radius: inherit;
+
+        &.loaded {
+            opacity: 1;
+        }
+
+        &.instant {
+            transition: none !important;
+            opacity: 1 !important;
+        }
+    }
+
+    /* Placeholder/Letter styling */
+    .avatar-placeholder {
+        width: 100%;
+        height: 100%;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        font-weight: 500;
+        color: var(--text-secondary, #666);
+        background-color: var(--bg-tertiary, #e0e0e0);
+        font-size: 1.2em;
+        text-transform: uppercase;
+        user-select: none;
+        border-radius: inherit;
+    }
+
+    /* Loading Skeleton */
+    .avatar-skeleton {
+        position: absolute;
+        top: 0;
+        left: 0;
+        width: 100%;
+        height: 100%;
+        background: linear-gradient(90deg,
+                var(--bg-tertiary, #f0f0f0) 25%,
+                var(--bg-secondary, #e0e0e0) 50%,
+                var(--bg-tertiary, #f0f0f0) 75%);
+        background-size: 200% 100%;
+        animation: shimmer 1.5s infinite;
+        z-index: 1;
+        border-radius: inherit;
+    }
+
+    @keyframes shimmer {
+        0% {
+            background-position: 200% 0;
+        }
+
+        100% {
+            background-position: -200% 0;
+        }
+    }
+}

src/components/Avatar.tsx

@@ -0,0 +1,129 @@
+import React, { useState, useEffect, useRef, useMemo } from 'react'
+import { User } from 'lucide-react'
+import { avatarLoadQueue } from '../utils/AvatarLoadQueue'
+import './Avatar.scss'
+
+// 全局缓存已成功加载过的头像 URL，用于控制后续是否显示动画
+const loadedAvatarCache = new Set<string>()
+
+interface AvatarProps {
+    src?: string
+    name?: string
+    size?: number | string
+    shape?: 'circle' | 'square' | 'rounded'
+    className?: string
+    lazy?: boolean
+    onClick?: () => void
+}
+
+export const Avatar = React.memo(function Avatar({
+    src,
+    name,
+    size = 48,
+    shape = 'rounded',
+    className = '',
+    lazy = true,
+    onClick
+}: AvatarProps) {
+    // 如果 URL 已在缓存中，则直接标记为已加载，不显示骨架屏和淡入动画
+    const isCached = useMemo(() => src ? loadedAvatarCache.has(src) : false, [src])
+    const [imageLoaded, setImageLoaded] = useState(isCached)
+    const [imageError, setImageError] = useState(false)
+    const [shouldLoad, setShouldLoad] = useState(!lazy || isCached)
+    const [isInQueue, setIsInQueue] = useState(false)
+    const imgRef = useRef<HTMLImageElement>(null)
+    const containerRef = useRef<HTMLDivElement>(null)
+
+    const getAvatarLetter = (): string => {
+        if (!name) return '?'
+        const chars = [...name]
+        return chars[0] || '?'
+    }
+
+    // Intersection Observer for lazy loading
+    useEffect(() => {
+        if (!lazy || shouldLoad || isInQueue || !src || !containerRef.current || isCached) return
+
+        const observer = new IntersectionObserver(
+            (entries) => {
+                entries.forEach((entry) => {
+                    if (entry.isIntersecting && !isInQueue) {
+                        setIsInQueue(true)
+                        avatarLoadQueue.enqueue(src).then(() => {
+                            setShouldLoad(true)
+                        }).catch(() => {
+                            // 加载失败不要立刻显示错误，让浏览器渲染去报错
+                            setShouldLoad(true)
+                        }).finally(() => {
+                            setIsInQueue(false)
+                        })
+                        observer.disconnect()
+                    }
+                })
+            },
+            { rootMargin: '100px' }
+        )
+
+        observer.observe(containerRef.current)
+
+        return () => observer.disconnect()
+    }, [src, lazy, shouldLoad, isInQueue, isCached])
+
+    // Reset state when src changes
+    useEffect(() => {
+        const cached = src ? loadedAvatarCache.has(src) : false
+        setImageLoaded(cached)
+        setImageError(false)
+        if (lazy && !cached) {
+            setShouldLoad(false)
+            setIsInQueue(false)
+        } else {
+            setShouldLoad(true)
+        }
+    }, [src, lazy])
+
+    // Check if image is already cached/loaded
+    useEffect(() => {
+        if (shouldLoad && imgRef.current?.complete && imgRef.current?.naturalWidth > 0) {
+            setImageLoaded(true)
+        }
+    }, [src, shouldLoad])
+
+    const style = {
+        width: typeof size === 'number' ? `${size}px` : size,
+        height: typeof size === 'number' ? `${size}px` : size,
+    }
+
+    const hasValidUrl = !!src && !imageError && shouldLoad
+
+    return (
+        <div
+            ref={containerRef}
+            className={`avatar-component ${shape} ${className}`}
+            style={style}
+            onClick={onClick}
+        >
+            {hasValidUrl ? (
+                <>
+                    {!imageLoaded && <div className="avatar-skeleton" />}
+                    <img
+                        ref={imgRef}
+                        src={src}
+                        alt={name || 'avatar'}
+                        className={`avatar-image ${imageLoaded ? 'loaded' : ''} ${isCached ? 'instant' : ''}`}
+                        onLoad={() => {
+                            if (src) loadedAvatarCache.add(src)
+                            setImageLoaded(true)
+                        }}
+                        onError={() => setImageError(true)}
+                        loading={lazy ? "lazy" : "eager"}
+                    />
+                </>
+            ) : (
+                <div className="avatar-placeholder">
+                    {name ? <span className="avatar-letter">{getAvatarLetter()}</span> : <User size="50%" />}
+                </div>
+            )}
+        </div>
+    )
+})

src/components/ImagePreview.scss

@@ -0,0 +1,46 @@
+.image-preview-overlay {
+  position: fixed;
+  inset: 0;
+  background: rgba(0, 0, 0, 0.9);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  z-index: 9999;
+  user-select: none;
+}
+
+.preview-image {
+  max-width: 90vw;
+  max-height: 90vh;
+  object-fit: contain;
+  transition: transform 0.15s ease-out;
+  
+  &.dragging {
+    transition: none;
+  }
+}
+
+.image-preview-close {
+  position: absolute;
+  bottom: 40px;
+  left: 50%;
+  transform: translateX(-50%);
+  width: 48px;
+  height: 48px;
+  border-radius: 50%;
+  border: 2px solid rgba(255, 255, 255, 0.3);
+  background: rgba(0, 0, 0, 0.7);
+  color: #fff;
+  cursor: pointer;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  transition: all 0.2s;
+  backdrop-filter: blur(10px);
+
+  &:hover {
+    background: rgba(255, 255, 255, 0.2);
+    border-color: rgba(255, 255, 255, 0.5);
+    transform: translateX(-50%) scale(1.1);
+  }
+}

src/components/ImagePreview.tsx

@@ -0,0 +1,101 @@
+import React, { useState, useRef, useCallback, useEffect } from 'react'
+import { X } from 'lucide-react'
+import { createPortal } from 'react-dom'
+import './ImagePreview.scss'
+
+interface ImagePreviewProps {
+  src: string
+  onClose: () => void
+}
+
+export const ImagePreview: React.FC<ImagePreviewProps> = ({ src, onClose }) => {
+  const [scale, setScale] = useState(1)
+  const [position, setPosition] = useState({ x: 0, y: 0 })
+  const [isDragging, setIsDragging] = useState(false)
+  const dragStart = useRef({ x: 0, y: 0 })
+  const positionStart = useRef({ x: 0, y: 0 })
+  const containerRef = useRef<HTMLDivElement>(null)
+
+  // 滚轮缩放
+  const handleWheel = useCallback((e: React.WheelEvent) => {
+    e.preventDefault()
+    const delta = e.deltaY > 0 ? 0.9 : 1.1
+    setScale(prev => Math.min(Math.max(prev * delta, 0.5), 5))
+  }, [])
+
+  // 开始拖动
+  const handleMouseDown = useCallback((e: React.MouseEvent) => {
+    if (scale <= 1) return
+    e.preventDefault()
+    setIsDragging(true)
+    dragStart.current = { x: e.clientX, y: e.clientY }
+    positionStart.current = { ...position }
+  }, [scale, position])
+
+  // 拖动中
+  const handleMouseMove = useCallback((e: React.MouseEvent) => {
+    if (!isDragging) return
+    const dx = e.clientX - dragStart.current.x
+    const dy = e.clientY - dragStart.current.y
+    setPosition({
+      x: positionStart.current.x + dx,
+      y: positionStart.current.y + dy
+    })
+  }, [isDragging])
+
+  // 结束拖动
+  const handleMouseUp = useCallback(() => {
+    setIsDragging(false)
+  }, [])
+
+  // 双击重置
+  const handleDoubleClick = useCallback(() => {
+    setScale(1)
+    setPosition({ x: 0, y: 0 })
+  }, [])
+
+  // 点击背景关闭
+  const handleOverlayClick = useCallback((e: React.MouseEvent) => {
+    if (e.target === containerRef.current) {
+      onClose()
+    }
+  }, [onClose])
+
+  // ESC 关闭
+  useEffect(() => {
+    const handleKeyDown = (e: KeyboardEvent) => {
+      if (e.key === 'Escape') onClose()
+    }
+    window.addEventListener('keydown', handleKeyDown)
+    return () => window.removeEventListener('keydown', handleKeyDown)
+  }, [onClose])
+
+  return createPortal(
+    <div
+      ref={containerRef}
+      className="image-preview-overlay"
+      onClick={handleOverlayClick}
+      onMouseMove={handleMouseMove}
+      onMouseUp={handleMouseUp}
+      onMouseLeave={handleMouseUp}
+    >
+      <img
+        src={src}
+        alt="图片预览"
+        className={`preview-image ${isDragging ? 'dragging' : ''}`}
+        style={{
+          transform: `translate(${position.x}px, ${position.y}px) scale(${scale})`,
+          cursor: scale > 1 ? (isDragging ? 'grabbing' : 'grab') : 'default'
+        }}
+        onWheel={handleWheel}
+        onMouseDown={handleMouseDown}
+        onDoubleClick={handleDoubleClick}
+        draggable={false}
+      />
+      <button className="image-preview-close" onClick={onClose}>
+        <X size={20} />
+      </button>
+    </div>,
+    document.body
+  )
+}

src/components/JumpToDateDialog.scss

@@ -0,0 +1,238 @@
+.jump-date-overlay {
+    position: fixed;
+    inset: 0;
+    background: rgba(0, 0, 0, 0.4);
+    backdrop-filter: blur(4px);
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    z-index: 2000;
+    animation: fadeIn 0.2s ease-out;
+}
+
+.jump-date-modal {
+    background: var(--card-bg);
+    width: 340px;
+    border-radius: 16px;
+    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.25);
+    display: flex;
+    flex-direction: column;
+    overflow: hidden;
+    animation: modalSlideUp 0.3s cubic-bezier(0.16, 1, 0.3, 1);
+}
+
+.jump-date-header {
+    padding: 18px 20px;
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    border-bottom: 1px solid var(--border-color);
+
+    .title-area {
+        display: flex;
+        align-items: center;
+        gap: 10px;
+        color: var(--text-primary);
+
+        svg {
+            color: var(--primary);
+        }
+
+        h3 {
+            font-size: 16px;
+            font-weight: 600;
+            margin: 0;
+        }
+    }
+
+    .close-btn {
+        background: none;
+        border: none;
+        color: var(--text-tertiary);
+        cursor: pointer;
+        padding: 4px;
+        border-radius: 6px;
+        display: flex;
+        transition: all 0.2s;
+
+        &:hover {
+            background: var(--bg-hover);
+            color: var(--text-primary);
+        }
+    }
+}
+
+.calendar-view {
+    padding: 20px;
+
+    .calendar-nav {
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+        margin-bottom: 16px;
+
+        .current-month {
+            font-size: 15px;
+            font-weight: 600;
+            color: var(--text-primary);
+        }
+
+        .nav-btn {
+            width: 32px;
+            height: 32px;
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            background: var(--bg-secondary);
+            border: 1px solid var(--border-color);
+            border-radius: 8px;
+            color: var(--text-secondary);
+            cursor: pointer;
+            transition: all 0.2s;
+
+            &:hover {
+                background: var(--bg-hover);
+                border-color: var(--primary);
+                color: var(--primary);
+            }
+        }
+    }
+}
+
+.calendar-grid {
+    .weekdays {
+        display: grid;
+        grid-template-columns: repeat(7, 1fr);
+        margin-bottom: 8px;
+
+        .weekday {
+            text-align: center;
+            font-size: 12px;
+            font-weight: 500;
+            color: var(--text-tertiary);
+            padding: 4px 0;
+        }
+    }
+
+    .days {
+        display: grid;
+        grid-template-columns: repeat(7, 1fr);
+        gap: 4px;
+
+        .day-cell {
+            aspect-ratio: 1;
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            font-size: 14px;
+            color: var(--text-primary);
+            border-radius: 8px;
+            cursor: pointer;
+            transition: all 0.2s;
+
+            &.empty {
+                cursor: default;
+            }
+
+            &:not(.empty):hover {
+                background: var(--bg-hover);
+            }
+
+            &.selected {
+                background: var(--primary);
+                color: #fff;
+                font-weight: 600;
+            }
+
+            &.today:not(.selected) {
+                color: var(--primary);
+                font-weight: 600;
+                background: var(--primary-light);
+            }
+        }
+    }
+}
+
+.quick-options {
+    display: flex;
+    gap: 8px;
+    padding: 0 20px 16px;
+
+    button {
+        flex: 1;
+        padding: 8px;
+        font-size: 12px;
+        background: var(--bg-secondary);
+        border: 1px solid var(--border-color);
+        border-radius: 6px;
+        color: var(--text-secondary);
+        cursor: pointer;
+        transition: all 0.2s;
+
+        &:hover {
+            background: var(--bg-hover);
+            color: var(--primary);
+            border-color: var(--primary);
+        }
+    }
+}
+
+.dialog-footer {
+    padding: 16px 20px;
+    display: flex;
+    gap: 12px;
+    background: var(--bg-secondary);
+
+    button {
+        flex: 1;
+        padding: 10px;
+        border-radius: 8px;
+        font-size: 14px;
+        font-weight: 600;
+        cursor: pointer;
+        transition: all 0.2s;
+    }
+
+    .cancel-btn {
+        background: transparent;
+        border: 1px solid var(--border-color);
+        color: var(--text-secondary);
+
+        &:hover {
+            background: var(--bg-hover);
+            color: var(--text-primary);
+        }
+    }
+
+    .confirm-btn {
+        background: var(--primary);
+        border: none;
+        color: #fff;
+
+        &:hover {
+            background: var(--primary-hover);
+        }
+    }
+}
+
+@keyframes fadeIn {
+    from {
+        opacity: 0;
+    }
+
+    to {
+        opacity: 1;
+    }
+}
+
+@keyframes modalSlideUp {
+    from {
+        opacity: 0;
+        transform: translateY(20px);
+    }
+
+    to {
+        opacity: 1;
+        transform: translateY(0);
+    }
+}

src/components/JumpToDateDialog.tsx

@@ -0,0 +1,156 @@
+import React, { useState } from 'react'
+import { X, ChevronLeft, ChevronRight, Calendar as CalendarIcon } from 'lucide-react'
+import './JumpToDateDialog.scss'
+
+interface JumpToDateDialogProps {
+    isOpen: boolean
+    onClose: () => void
+    onSelect: (date: Date) => void
+    currentDate?: Date
+}
+
+const JumpToDateDialog: React.FC<JumpToDateDialogProps> = ({
+    isOpen,
+    onClose,
+    onSelect,
+    currentDate = new Date()
+}) => {
+    const [calendarDate, setCalendarDate] = useState(new Date(currentDate))
+    const [selectedDate, setSelectedDate] = useState(new Date(currentDate))
+
+    if (!isOpen) return null
+
+    const getDaysInMonth = (date: Date) => {
+        const year = date.getFullYear()
+        const month = date.getMonth()
+        return new Date(year, month + 1, 0).getDate()
+    }
+
+    const getFirstDayOfMonth = (date: Date) => {
+        const year = date.getFullYear()
+        const month = date.getMonth()
+        return new Date(year, month, 1).getDay()
+    }
+
+    const generateCalendar = () => {
+        const daysInMonth = getDaysInMonth(calendarDate)
+        const firstDay = getFirstDayOfMonth(calendarDate)
+        const days: (number | null)[] = []
+
+        for (let i = 0; i < firstDay; i++) {
+            days.push(null)
+        }
+
+        for (let i = 1; i <= daysInMonth; i++) {
+            days.push(i)
+        }
+
+        return days
+    }
+
+    const handleDateClick = (day: number) => {
+        const newDate = new Date(calendarDate.getFullYear(), calendarDate.getMonth(), day)
+        setSelectedDate(newDate)
+    }
+
+    const handleConfirm = () => {
+        onSelect(selectedDate)
+        onClose()
+    }
+
+    const isToday = (day: number) => {
+        const today = new Date()
+        return day === today.getDate() &&
+            calendarDate.getMonth() === today.getMonth() &&
+            calendarDate.getFullYear() === today.getFullYear()
+    }
+
+    const isSelected = (day: number) => {
+        return day === selectedDate.getDate() &&
+            calendarDate.getMonth() === selectedDate.getMonth() &&
+            calendarDate.getFullYear() === selectedDate.getFullYear()
+    }
+
+    const weekdays = ['日', '一', '二', '三', '四', '五', '六']
+    const days = generateCalendar()
+
+    return (
+        <div className="jump-date-overlay" onClick={onClose}>
+            <div className="jump-date-modal" onClick={e => e.stopPropagation()}>
+                <div className="jump-date-header">
+                    <div className="title-area">
+                        <CalendarIcon size={18} />
+                        <h3>跳转到日期</h3>
+                    </div>
+                    <button className="close-btn" onClick={onClose}>
+                        <X size={18} />
+                    </button>
+                </div>
+
+                <div className="calendar-view">
+                    <div className="calendar-nav">
+                        <button
+                            className="nav-btn"
+                            onClick={() => setCalendarDate(new Date(calendarDate.getFullYear(), calendarDate.getMonth() - 1, 1))}
+                        >
+                            <ChevronLeft size={18} />
+                        </button>
+                        <span className="current-month">
+                            {calendarDate.getFullYear()}年{calendarDate.getMonth() + 1}月
+                        </span>
+                        <button
+                            className="nav-btn"
+                            onClick={() => setCalendarDate(new Date(calendarDate.getFullYear(), calendarDate.getMonth() + 1, 1))}
+                        >
+                            <ChevronRight size={18} />
+                        </button>
+                    </div>
+
+                    <div className="calendar-grid">
+                        <div className="weekdays">
+                            {weekdays.map(d => <div key={d} className="weekday">{d}</div>)}
+                        </div>
+                        <div className="days">
+                            {days.map((day, i) => (
+                                <div
+                                    key={i}
+                                    className={`day-cell ${day === null ? 'empty' : ''} ${day !== null && isSelected(day) ? 'selected' : ''} ${day !== null && isToday(day) ? 'today' : ''}`}
+                                    onClick={() => day !== null && handleDateClick(day)}
+                                >
+                                    {day}
+                                </div>
+                            ))}
+                        </div>
+                    </div>
+                </div>
+
+                <div className="quick-options">
+                    <button onClick={() => {
+                        const d = new Date()
+                        setSelectedDate(d)
+                        setCalendarDate(new Date(d))
+                    }}>今天</button>
+                    <button onClick={() => {
+                        const d = new Date()
+                        d.setDate(d.getDate() - 7)
+                        setSelectedDate(d)
+                        setCalendarDate(new Date(d))
+                    }}>一周前</button>
+                    <button onClick={() => {
+                        const d = new Date()
+                        d.setMonth(d.getMonth() - 1)
+                        setSelectedDate(d)
+                        setCalendarDate(new Date(d))
+                    }}>一月前</button>
+                </div>
+
+                <div className="dialog-footer">
+                    <button className="cancel-btn" onClick={onClose}>取消</button>
+                    <button className="confirm-btn" onClick={handleConfirm}>跳转</button>
+                </div>
+            </div>
+        </div>
+    )
+}
+
+export default JumpToDateDialog

src/components/LivePhotoIcon.tsx

@@ -0,0 +1,29 @@
+import React from 'react';
+
+interface LivePhotoIconProps {
+    size?: number | string;
+    className?: string;
+    style?: React.CSSProperties;
+}
+
+export const LivePhotoIcon: React.FC<LivePhotoIconProps> = ({ size = 24, className = '', style = {} }) => {
+    return (
+        <svg
+            width={size}
+            height={size}
+            viewBox="0 0 24 24"
+            version="1.1"
+            xmlns="http://www.w3.org/2000/svg"
+            className={className}
+            style={style}
+        >
+            <g stroke="none" strokeWidth="1" fill="none" fillRule="evenodd" strokeLinecap="round" strokeLinejoin="round">
+                <g stroke="currentColor" strokeWidth="2">
+                    <circle fill="currentColor" stroke="none" cx="12" cy="12" r="2.5"></circle>
+                    <circle cx="12" cy="12" r="5.5"></circle>
+                    <circle cx="12" cy="12" r="9" strokeDasharray="1 3.7"></circle>
+                </g>
+            </g>
+        </svg>
+    );
+};

src/components/LockScreen.scss

@@ -0,0 +1,185 @@
+.lock-screen {
+    position: fixed;
+    top: 0;
+    left: 0;
+    width: 100vw;
+    height: 100vh;
+    background-color: var(--bg-primary);
+    z-index: 9999;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    user-select: none;
+    -webkit-app-region: drag;
+    transition: all 0.5s cubic-bezier(0.22, 1, 0.36, 1);
+    backdrop-filter: blur(25px) saturate(180%);
+    background-color: var(--bg-primary);
+    // 让背景带一点透明度以增强毛玻璃效果
+    opacity: 1;
+
+    &.unlocked {
+        opacity: 0;
+        pointer-events: none;
+        backdrop-filter: blur(0) saturate(100%);
+        transform: scale(1.02);
+
+        .lock-content {
+            transform: translateY(-20px) scale(0.95);
+            filter: blur(10px);
+            opacity: 0;
+        }
+    }
+
+    .lock-content {
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+        width: 320px;
+        -webkit-app-region: no-drag;
+        animation: fadeIn 0.5s cubic-bezier(0.4, 0, 0.2, 1);
+        transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
+
+        .lock-avatar {
+            width: 100px;
+            height: 100px;
+            border-radius: 50%;
+            margin-bottom: 24px;
+            box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1);
+            border: 4px solid var(--bg-total);
+            background-color: var(--bg-secondary);
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            color: var(--text-secondary);
+        }
+
+        .lock-title {
+            font-size: 24px;
+            font-weight: 600;
+            color: var(--text-primary);
+            margin-bottom: 32px;
+        }
+
+        .lock-form {
+            width: 100%;
+            display: flex;
+            flex-direction: column;
+            gap: 16px;
+
+            .input-group {
+                position: relative;
+                width: 100%;
+
+                input {
+                    width: 100%;
+                    height: 48px;
+                    padding: 0 16px;
+                    padding-right: 48px;
+                    border-radius: 12px;
+                    border: 1px solid var(--border-color);
+                    background-color: var(--bg-input);
+                    color: var(--text-primary);
+                    font-size: 16px;
+                    outline: none;
+                    transition: all 0.2s;
+
+                    &:focus {
+                        border-color: var(--primary-color);
+                        box-shadow: 0 0 0 2px var(--primary-color-alpha);
+                    }
+                }
+
+                .submit-btn {
+                    position: absolute;
+                    right: 8px;
+                    top: 8px;
+                    width: 32px;
+                    height: 32px;
+                    display: flex;
+                    align-items: center;
+                    justify-content: center;
+                    border-radius: 8px;
+                    border: none;
+                    background: var(--primary-color);
+                    color: white;
+                    cursor: pointer;
+                    transition: opacity 0.2s;
+
+                    &:hover {
+                        opacity: 0.9;
+                    }
+                }
+            }
+
+            .hello-btn {
+                width: 100%;
+                height: 48px;
+                display: flex;
+                align-items: center;
+                justify-content: center;
+                gap: 8px;
+                border-radius: 12px;
+                border: 1px solid var(--border-color);
+                background-color: var(--bg-secondary);
+                color: var(--text-primary);
+                font-size: 15px;
+                font-weight: 500;
+                cursor: pointer;
+                transition: all 0.2s;
+
+                &:hover {
+                    background-color: var(--bg-hover);
+                    transform: translateY(-1px);
+                }
+
+                &.loading {
+                    opacity: 0.7;
+                    pointer-events: none;
+                }
+            }
+        }
+
+        .lock-error {
+            margin-top: 16px;
+            color: #ff4d4f;
+            font-size: 14px;
+            animation: shake 0.5s ease-in-out;
+        }
+    }
+}
+
+@keyframes fadeIn {
+    from {
+        opacity: 0;
+        transform: translateY(20px);
+    }
+
+    to {
+        opacity: 1;
+        transform: translateY(0);
+    }
+}
+
+@keyframes shake {
+
+    0%,
+    100% {
+        transform: translateX(0);
+    }
+
+    10%,
+    30%,
+    50%,
+    70%,
+    90% {
+        transform: translateX(-4px);
+    }
+
+    20%,
+    40%,
+    60%,
+    80% {
+        transform: translateX(4px);
+    }
+}

src/components/LockScreen.tsx

@@ -0,0 +1,169 @@
+import { useState, useEffect, useRef } from 'react'
+import * as configService from '../services/config'
+import { ArrowRight, Fingerprint, Lock, ScanFace, ShieldCheck } from 'lucide-react'
+import './LockScreen.scss'
+
+interface LockScreenProps {
+    onUnlock: () => void
+    avatar?: string
+    useHello?: boolean
+}
+
+async function sha256(message: string) {
+    const msgBuffer = new TextEncoder().encode(message)
+    const hashBuffer = await crypto.subtle.digest('SHA-256', msgBuffer)
+    const hashArray = Array.from(new Uint8Array(hashBuffer))
+    const hashHex = hashArray.map(b => b.toString(16).padStart(2, '0')).join('')
+    return hashHex
+}
+
+export default function LockScreen({ onUnlock, avatar, useHello = false }: LockScreenProps) {
+    const [password, setPassword] = useState('')
+    const [error, setError] = useState('')
+    const [isVerifying, setIsVerifying] = useState(false)
+    const [isUnlocked, setIsUnlocked] = useState(false)
+    const [showHello, setShowHello] = useState(false)
+    const [helloAvailable, setHelloAvailable] = useState(false)
+
+    // 用于取消 WebAuthn 请求
+    const abortControllerRef = useRef<AbortController | null>(null)
+    const inputRef = useRef<HTMLInputElement>(null)
+
+    useEffect(() => {
+        // 快速检查配置并启动
+        quickStartHello()
+        inputRef.current?.focus()
+
+        return () => {
+            // 组件卸载时取消请求
+            abortControllerRef.current?.abort()
+        }
+    }, [])
+
+    const handleUnlock = () => {
+        setIsUnlocked(true)
+        setTimeout(() => {
+            onUnlock()
+        }, 1500)
+    }
+
+    const quickStartHello = async () => {
+        try {
+            // 如果父组件已经告诉我们要用 Hello，直接开始，不等待 IPC
+            let shouldUseHello = useHello
+
+            // 为了稳健，如果 prop 没传（虽然现在都传了），再 check 一次 config
+            if (!shouldUseHello) {
+                shouldUseHello = await configService.getAuthUseHello()
+            }
+
+            if (shouldUseHello) {
+                // 标记为可用，显示按钮
+                setHelloAvailable(true)
+                setShowHello(true)
+                // 立即执行验证 (0延迟)
+                verifyHello()
+            }
+        } catch (e) {
+            console.error('Quick start hello failed', e)
+        }
+    }
+
+    const verifyHello = async () => {
+        if (isVerifying || isUnlocked) return
+
+        setIsVerifying(true)
+        setError('')
+
+        try {
+            const result = await window.electronAPI.auth.hello()
+
+            if (result.success) {
+                handleUnlock()
+            } else {
+                console.error('Hello verification failed:', result.error)
+                setError(result.error || '验证失败')
+            }
+        } catch (e: any) {
+            console.error('Hello verification error:', e)
+            setError(`验证失败: ${e.message || String(e)}`)
+        } finally {
+            setIsVerifying(false)
+        }
+    }
+
+    const handlePasswordSubmit = async (e?: React.FormEvent) => {
+        e?.preventDefault()
+        if (!password || isUnlocked) return
+
+        // 如果正在进行 Hello 验证，它会自动失败或被取代，UI上不用特意取消
+        // 因为 native 调用是模态的或者独立的，我们只要让 JS 状态不对锁住即可
+
+        // 不再检查 isVerifying，因为我们允许打断 Hello
+        setIsVerifying(true)
+        setError('')
+
+        try {
+            const storedHash = await configService.getAuthPassword()
+            const inputHash = await sha256(password)
+
+            if (inputHash === storedHash) {
+                handleUnlock()
+            } else {
+                setError('密码错误')
+                setPassword('')
+                setIsVerifying(false)
+                // 如果密码错误，是否重新触发 Hello? 
+                // 用户可能想重试密码，暂时不自动触发
+            }
+        } catch (e) {
+            setError('验证失败')
+            setIsVerifying(false)
+        }
+    }
+
+    return (
+        <div className={`lock-screen ${isUnlocked ? 'unlocked' : ''}`}>
+            <div className="lock-content">
+                <div className="lock-avatar">
+                    {avatar ? (
+                        <img src={avatar} alt="User" style={{ width: '100%', height: '100%', borderRadius: '50%' }} />
+                    ) : (
+                        <Lock size={40} />
+                    )}
+                </div>
+
+                <h2 className="lock-title">WeFlow 已锁定</h2>
+
+                <form className="lock-form" onSubmit={handlePasswordSubmit}>
+                    <div className="input-group">
+                        <input
+                            ref={inputRef}
+                            type="password"
+                            placeholder="输入应用密码"
+                            value={password}
+                            onChange={(e) => setPassword(e.target.value)}
+                        // 移除 disabled，允许用户随时输入
+                        />
+                        <button type="submit" className="submit-btn" disabled={!password}>
+                            <ArrowRight size={18} />
+                        </button>
+                    </div>
+
+                    {showHello && (
+                        <button
+                            type="button"
+                            className={`hello-btn ${isVerifying ? 'loading' : ''}`}
+                            onClick={verifyHello}
+                        >
+                            <Fingerprint size={20} />
+                            {isVerifying ? '验证中...' : '使用 Windows Hello 解锁'}
+                        </button>
+                    )}
+                </form>
+
+                {error && <div className="lock-error">{error}</div>}
+            </div>
+        </div>
+    )
+}

src/components/RouteGuard.tsx

@@ -6,8 +6,7 @@ interface RouteGuardProps {
   children: React.ReactNode
 }
 
-// 不需要数据库连接的页面
+const PUBLIC_ROUTES = ['/', '/home', '/settings']
-const PUBLIC_ROUTES = ['/', '/home', '/settings', '/data-management']
 
 function RouteGuard({ children }: RouteGuardProps) {
   const navigate = useNavigate()

src/components/Sidebar.scss

@@ -1,24 +1,24 @@
 .sidebar {
-  width: 200px;
+  width: 220px;
   background: var(--bg-secondary);
   border-right: 1px solid var(--border-color);
   display: flex;
   flex-direction: column;
   padding: 16px 0;
   transition: width 0.25s ease;
-  
+
   &.collapsed {
     width: 64px;
-    
+
     .nav-menu,
     .sidebar-footer {
       padding: 0 8px;
     }
-    
+
     .nav-label {
       display: none;
     }
-    
+
     .nav-item {
       justify-content: center;
       padding: 10px;
@@ -32,14 +32,14 @@
   display: flex;
   flex-direction: column;
   gap: 4px;
-  padding: 0 8px;
+  padding: 0 12px;
 }
 
 .nav-item {
   display: flex;
   align-items: center;
   gap: 12px;
-  padding: 10px 16px;
+  padding: 10px 12px;
   border-radius: 9999px;
   color: var(--text-secondary);
   text-decoration: none;
@@ -49,13 +49,12 @@
   background: transparent;
   cursor: pointer;
   font-family: inherit;
-  width: 100%;
+
-  
   &:hover {
     background: var(--bg-tertiary);
     color: var(--text-primary);
   }
-  
+
   &.active {
     background: var(--primary);
     color: white;
@@ -77,7 +76,7 @@
 }
 
 .sidebar-footer {
-  padding: 0 8px;
+  padding: 0 12px;
   border-top: 1px solid var(--border-color);
   padding-top: 12px;
   margin-top: 8px;
@@ -99,9 +98,9 @@
   border-radius: 9999px;
   transition: all 0.2s ease;
   margin-top: 4px;
-  
+
   &:hover {
     background: var(--bg-tertiary);
     color: var(--text-primary);
   }
-}
+}

src/components/Sidebar.tsx

@@ -1,11 +1,19 @@
-import { useState } from 'react'
+import { useState, useEffect } from 'react'
 import { NavLink, useLocation } from 'react-router-dom'
-import { Home, MessageSquare, BarChart3, Users, FileText, Database, Settings, ChevronLeft, ChevronRight, Download } from 'lucide-react'
+import { Home, MessageSquare, BarChart3, Users, FileText, Database, Settings, ChevronLeft, ChevronRight, Download, Bot, Aperture, UserCircle, Lock } from 'lucide-react'
+import { useAppStore } from '../stores/appStore'
+import * as configService from '../services/config'
 import './Sidebar.scss'
 
 function Sidebar() {
   const location = useLocation()
   const [collapsed, setCollapsed] = useState(false)
+  const [authEnabled, setAuthEnabled] = useState(false)
+  const setLocked = useAppStore(state => state.setLocked)
+
+  useEffect(() => {
+    configService.getAuthEnabled().then(setAuthEnabled)
+  }, [])
 
   const isActive = (path: string) => {
     return location.pathname === path || location.pathname.startsWith(`${path}/`)
@@ -34,6 +42,26 @@ function Sidebar() {
           <span className="nav-label">聊天</span>
         </NavLink>
 
+        {/* 朋友圈 */}
+        <NavLink
+          to="/sns"
+          className={`nav-item ${isActive('/sns') ? 'active' : ''}`}
+          title={collapsed ? '朋友圈' : undefined}
+        >
+          <span className="nav-icon"><Aperture size={20} /></span>
+          <span className="nav-label">朋友圈</span>
+        </NavLink>
+
+        {/* 通讯录 */}
+        <NavLink
+          to="/contacts"
+          className={`nav-item ${isActive('/contacts') ? 'active' : ''}`}
+          title={collapsed ? '通讯录' : undefined}
+        >
+          <span className="nav-icon"><UserCircle size={20} /></span>
+          <span className="nav-label">通讯录</span>
+        </NavLink>
+
         {/* 私聊分析 */}
         <NavLink
           to="/analytics"
@@ -74,20 +102,23 @@ function Sidebar() {
           <span className="nav-label">导出</span>
         </NavLink>
 
-        {/* 数据管理 */}
+
-        <NavLink
-          to="/data-management"
-          className={`nav-item ${isActive('/data-management') ? 'active' : ''}`}
-          title={collapsed ? '数据管理' : undefined}
-        >
-          <span className="nav-icon"><Database size={20} /></span>
-          <span className="nav-label">数据管理</span>
-        </NavLink>
       </nav>
-      
+
       <div className="sidebar-footer">
-        <NavLink 
+        {authEnabled && (
-          to="/settings" 
+          <button
+            className="nav-item"
+            onClick={() => setLocked(true)}
+            title={collapsed ? '锁定' : undefined}
+          >
+            <span className="nav-icon"><Lock size={20} /></span>
+            <span className="nav-label">锁定</span>
+          </button>
+        )}
+
+        <NavLink
+          to="/settings"
           className={`nav-item ${isActive('/settings') ? 'active' : ''}`}
           title={collapsed ? '设置' : undefined}
         >
@@ -96,8 +127,8 @@ function Sidebar() {
           </span>
           <span className="nav-label">设置</span>
         </NavLink>
-        
+
-        <button 
+        <button
           className="collapse-btn"
           onClick={() => setCollapsed(!collapsed)}
           title={collapsed ? '展开菜单' : '收起菜单'}

src/components/TitleBar.tsx

@@ -1,10 +1,14 @@
 import './TitleBar.scss'
 
-function TitleBar() {
+interface TitleBarProps {
+  title?: string
+}
+
+function TitleBar({ title }: TitleBarProps = {}) {
   return (
     <div className="title-bar">
       <img src="./logo.png" alt="WeFlow" className="title-logo" />
-      <span className="titles">WeFlow</span>
+      <span className="titles">{title || 'WeFlow'}</span>
     </div>
   )
 }

src/components/UpdateDialog.scss

@@ -0,0 +1,251 @@
+.update-dialog-overlay {
+    position: fixed;
+    top: 0;
+    left: 0;
+    right: 0;
+    bottom: 0;
+    background: rgba(0, 0, 0, 0.6);
+    backdrop-filter: blur(4px);
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    z-index: 9999;
+    animation: fadeIn 0.3s ease-out;
+
+    .update-dialog {
+        width: 680px;
+        background: #f5f5f5;
+        border-radius: 24px;
+        box-shadow: 0 20px 40px rgba(0, 0, 0, 0.2);
+        overflow: hidden;
+        position: relative;
+        animation: slideUp 0.3s ease-out;
+        display: flex;
+        flex-direction: column;
+
+        /* Top Section (White/Gradient) */
+        .dialog-header {
+            background: #ffffff;
+            padding: 40px 20px 30px;
+            display: flex;
+            flex-direction: column;
+            align-items: center;
+            text-align: center;
+            position: relative;
+
+            /* Subtle radial gradient effect in top left as seen in image */
+            &::before {
+                content: '';
+                position: absolute;
+                top: -50px;
+                left: -50px;
+                width: 200px;
+                height: 200px;
+                background: radial-gradient(circle, rgba(255, 235, 220, 0.4) 0%, rgba(255, 255, 255, 0) 70%);
+                opacity: 0.8;
+                pointer-events: none;
+            }
+
+            .version-tag {
+                background: #f0eee9;
+                color: #8c7b6e;
+                padding: 4px 16px;
+                border-radius: 12px;
+                font-size: 13px;
+                font-weight: 600;
+                margin-bottom: 24px;
+                letter-spacing: 0.5px;
+            }
+
+            h2 {
+                font-size: 32px;
+                font-weight: 800;
+                color: #333333;
+                margin: 0 0 12px;
+                letter-spacing: -0.5px;
+            }
+
+            .subtitle {
+                font-size: 15px;
+                color: #999999;
+                font-weight: 400;
+            }
+        }
+
+        /* Content Section (Light Gray) */
+        .dialog-content {
+            background: #f2f2f2;
+            padding: 24px 40px 40px;
+            flex: 1;
+            display: flex;
+            flex-direction: column;
+
+            .update-notes-container {
+                display: flex;
+                align-items: flex-start;
+                padding: 20px 0;
+                margin-bottom: 30px;
+
+                .icon-box {
+                    background: #fbfbfb; // Beige-ish white
+                    width: 48px;
+                    height: 48px;
+                    border-radius: 16px;
+                    display: flex;
+                    align-items: center;
+                    justify-content: center;
+                    margin-right: 20px;
+                    flex-shrink: 0;
+                    color: #8c7b6e;
+                    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.03);
+
+                    svg {
+                        opacity: 0.8;
+                    }
+                }
+
+                .text-box {
+                    flex: 1;
+
+                    h3 {
+                        font-size: 18px;
+                        font-weight: 700;
+                        color: #333333;
+                        margin: 0 0 8px;
+                    }
+
+                    p {
+                        font-size: 14px;
+                        color: #666666;
+                        line-height: 1.6;
+                        margin: 0;
+                    }
+
+                    ul {
+                        margin: 8px 0 0 18px;
+                        padding: 0;
+
+                        li {
+                            font-size: 14px;
+                            color: #666666;
+                            line-height: 1.6;
+                        }
+                    }
+                }
+            }
+
+            .progress-section {
+                margin-bottom: 30px;
+
+                .progress-info-row {
+                    display: flex;
+                    justify-content: space-between;
+                    margin-bottom: 8px;
+                    font-size: 12px;
+                    color: #888;
+                    font-weight: 500;
+                }
+
+                .progress-bar-bg {
+                    height: 6px;
+                    background: #e0e0e0;
+                    border-radius: 3px;
+                    overflow: hidden;
+
+                    .progress-bar-fill {
+                        height: 100%;
+                        background: #000000;
+                        border-radius: 3px;
+                        transition: width 0.3s ease;
+                    }
+                }
+
+                .status-text {
+                    text-align: center;
+                    margin-top: 12px;
+                    font-size: 13px;
+                    color: #666;
+                }
+            }
+
+            .actions {
+                display: flex;
+                justify-content: center;
+
+                .btn-update {
+                    background: #000000;
+                    color: #ffffff;
+                    border: none;
+                    padding: 16px 48px;
+                    border-radius: 20px; // Pill shape
+                    font-size: 16px;
+                    font-weight: 600;
+                    cursor: pointer;
+                    transition: transform 0.2s, box-shadow 0.2s;
+                    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
+
+                    &:hover {
+                        transform: translateY(-2px);
+                        box-shadow: 0 6px 16px rgba(0, 0, 0, 0.2);
+                    }
+
+                    &:active {
+                        transform: translateY(0);
+                    }
+
+                    &:disabled {
+                        opacity: 0.7;
+                        cursor: not-allowed;
+                        transform: none;
+                    }
+                }
+            }
+        }
+
+        .close-btn {
+            position: absolute;
+            top: 16px;
+            right: 16px;
+            background: rgba(0, 0, 0, 0.05);
+            border: none;
+            color: #999;
+            cursor: pointer;
+            width: 32px;
+            height: 32px;
+            border-radius: 50%;
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            transition: all 0.2s ease;
+            z-index: 10;
+
+            &:hover {
+                background: rgba(0, 0, 0, 0.1);
+                color: #333;
+                transform: rotate(90deg);
+            }
+        }
+    }
+}
+
+@keyframes fadeIn {
+    from {
+        opacity: 0;
+    }
+
+    to {
+        opacity: 1;
+    }
+}
+
+@keyframes slideUp {
+    from {
+        transform: translateY(20px);
+        opacity: 0;
+    }
+
+    to {
+        transform: translateY(0);
+        opacity: 1;
+    }
+}

src/components/UpdateDialog.tsx

@@ -0,0 +1,132 @@
+import React, { useEffect, useState } from 'react'
+import { Quote, X } from 'lucide-react'
+import './UpdateDialog.scss'
+
+interface UpdateInfo {
+    version?: string
+    releaseNotes?: string
+}
+
+interface UpdateDialogProps {
+    open: boolean
+    updateInfo: UpdateInfo | null
+    onClose: () => void
+    onUpdate: () => void
+    isDownloading: boolean
+    progress: number | {
+        percent: number
+        bytesPerSecond?: number
+        transferred?: number
+        total?: number
+        remaining?: number // seconds
+    }
+}
+
+const UpdateDialog: React.FC<UpdateDialogProps> = ({
+    open,
+    updateInfo,
+    onClose,
+    onUpdate,
+    isDownloading,
+    progress
+}) => {
+    if (!open || !updateInfo) return null
+
+    // Safe normalize progress
+    const safeProgress = typeof progress === 'number' ? { percent: progress } : (progress || { percent: 0 })
+    const percent = safeProgress.percent || 0
+    const bytesPerSecond = safeProgress.bytesPerSecond
+    const total = safeProgress.total
+    const transferred = safeProgress.transferred
+    const remaining = safeProgress.remaining
+
+    // Format bytes
+    const formatBytes = (bytes: number) => {
+        if (!Number.isFinite(bytes) || bytes === 0) return '0 B'
+        const k = 1024
+        const sizes = ['B', 'KB', 'MB', 'GB', 'TB']
+        const i = Math.floor(Math.log(bytes) / Math.log(k))
+        const unitIndex = Math.max(0, Math.min(i, sizes.length - 1))
+        return parseFloat((bytes / Math.pow(k, unitIndex)).toFixed(1)) + ' ' + sizes[unitIndex]
+    }
+
+    // Format speed
+    const formatSpeed = (bytesPerSecond: number) => {
+        return `${formatBytes(bytesPerSecond)}/s`
+    }
+
+    // Format time
+    const formatTime = (seconds: number) => {
+        if (!Number.isFinite(seconds)) return '计算中...'
+        if (seconds < 60) return `${Math.ceil(seconds)} 秒`
+        const minutes = Math.floor(seconds / 60)
+        const remainingSeconds = Math.ceil(seconds % 60)
+        return `${minutes} 分 ${remainingSeconds} 秒`
+    }
+
+    return (
+        <div className="update-dialog-overlay">
+            <div className="update-dialog">
+                {!isDownloading && (
+                    <button className="close-btn" onClick={onClose}>
+                        <X size={20} />
+                    </button>
+                )}
+
+                <div className="dialog-header">
+                    <div className="version-tag">
+                        新版本 {updateInfo.version}
+                    </div>
+                    <h2>欢迎体验全新的 WeFlow</h2>
+                    <div className="subtitle">我们带来了一些改进</div>
+                </div>
+
+                <div className="dialog-content">
+                    <div className="update-notes-container">
+                        <div className="icon-box">
+                            <Quote size={20} />
+                        </div>
+                        <div className="text-box">
+                            <h3>优化</h3>
+                            {updateInfo.releaseNotes ? (
+                                <div dangerouslySetInnerHTML={{ __html: updateInfo.releaseNotes }} />
+                            ) : (
+                                <p>修复了一些已知问题，提升了稳定性。</p>
+                            )}
+                        </div>
+                    </div>
+
+                    {isDownloading ? (
+                        <div className="progress-section">
+                            <div className="progress-info-row">
+                                <span>{bytesPerSecond ? formatSpeed(bytesPerSecond) : '下载中...'}</span>
+                                <span>{total ? `${formatBytes(transferred || 0)} / ${formatBytes(total)}` : `${percent.toFixed(1)}%`}</span>
+                                {remaining !== undefined && <span>剩余 {formatTime(remaining)}</span>}
+                            </div>
+
+                            <div className="progress-bar-bg">
+                                <div
+                                    className="progress-bar-fill"
+                                    style={{ width: `${percent}%` }}
+                                />
+                            </div>
+
+                            {/* Fallback status text if detailed info is missing */}
+                            {(!bytesPerSecond && !total) && (
+                                <div className="status-text">{percent.toFixed(0)}% 已下载</div>
+                            )}
+                        </div>
+                    ) : (
+                        <div className="actions">
+                            <button className="btn-update" onClick={onUpdate}>
+                                开启新旅程
+                            </button>
+                        </div>
+                    )}
+                </div>
+            </div>
+        </div>
+    )
+}
+
+export default UpdateDialog

src/components/UpdateProgressCapsule.scss

@@ -0,0 +1,192 @@
+.update-progress-capsule {
+    position: fixed;
+    top: 38px; // Just below title bar
+    left: 50%;
+    transform: translateX(-50%);
+    z-index: 9998;
+    cursor: pointer;
+    animation: capsuleSlideDown 0.4s cubic-bezier(0.16, 1, 0.3, 1);
+    user-select: none;
+
+    &:hover {
+        .capsule-content {
+            background: rgba(255, 255, 255, 0.95);
+            box-shadow: 0 8px 20px rgba(0, 0, 0, 0.12);
+            transform: scale(1.02);
+        }
+    }
+
+    .capsule-content {
+        background: var(--bg-primary);
+        backdrop-filter: blur(12px);
+        -webkit-backdrop-filter: blur(12px);
+        padding: 8px 18px;
+        border-radius: 24px;
+        border: 1px solid var(--border-color);
+        box-shadow: 0 8px 16px rgba(0, 0, 0, 0.12);
+        display: flex;
+        align-items: center;
+        gap: 12px;
+        height: 40px;
+        position: relative;
+        overflow: hidden;
+        transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
+
+        .icon-wrapper {
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            color: var(--text-primary);
+
+            .download-icon {
+                animation: capsulePulse 2s infinite ease-in-out;
+            }
+        }
+
+        .info-wrapper {
+            display: flex;
+            align-items: baseline;
+            gap: 10px;
+            z-index: 1;
+
+            .percent-text {
+                font-size: 15px;
+                font-weight: 700;
+                color: var(--text-primary);
+                font-variant-numeric: tabular-nums;
+            }
+
+            .speed-text {
+                font-size: 13px;
+                color: var(--text-tertiary);
+                font-weight: 500;
+                font-variant-numeric: tabular-nums;
+            }
+
+            .error-text {
+                font-size: 15px;
+                color: #ff4d4f;
+                font-weight: 600;
+            }
+
+            .available-text {
+                font-size: 15px;
+                color: var(--text-primary);
+                font-weight: 600;
+            }
+        }
+
+        .progress-bg {
+            position: absolute;
+            bottom: 0;
+            left: 0;
+            right: 0;
+            height: 3px;
+            background: rgba(0, 0, 0, 0.05);
+
+            .progress-fill {
+                height: 100%;
+                background: var(--primary);
+                transition: width 0.3s ease;
+            }
+        }
+
+        .capsule-close {
+            background: none;
+            border: none;
+            padding: 4px;
+            margin-left: -4px;
+            margin-right: -8px;
+            cursor: pointer;
+            opacity: 0.5;
+            transition: all 0.2s ease;
+            display: flex;
+            align-items: center;
+            color: var(--text-secondary);
+
+            &:hover {
+                opacity: 1;
+                background: var(--bg-tertiary);
+                border-radius: 50%;
+            }
+        }
+    }
+
+    // State Modifiers
+    &.state-available {
+        .capsule-content {
+            background: var(--primary);
+            border-color: rgba(255, 255, 255, 0.1);
+            color: white;
+
+            .icon-wrapper {
+                color: white;
+            }
+
+            .info-wrapper {
+                .available-text {
+                    color: white;
+                }
+            }
+
+            .capsule-close {
+                color: rgba(255, 255, 255, 0.8);
+
+                &:hover {
+                    background: rgba(255, 255, 255, 0.1);
+                }
+            }
+        }
+    }
+
+    &.state-downloading {
+        .capsule-content {
+            background: var(--bg-primary);
+        }
+    }
+
+    &.state-error {
+        .capsule-content {
+            background: #fff1f0;
+            border-color: #ffa39e;
+
+            .icon-wrapper {
+                color: #ff4d4f;
+            }
+
+            .info-wrapper .error-text {
+                color: #cf1322;
+            }
+
+            .capsule-close {
+                color: #cf1322;
+            }
+        }
+    }
+}
+
+@keyframes capsuleSlideDown {
+    from {
+        transform: translate(-50%, -40px);
+        opacity: 0;
+    }
+
+    to {
+        transform: translate(-50%, 0);
+        opacity: 1;
+    }
+}
+
+@keyframes capsulePulse {
+
+    0%,
+    100% {
+        transform: translateY(0);
+        opacity: 1;
+    }
+
+    50% {
+        transform: translateY(2px);
+        opacity: 0.6;
+    }
+}

src/components/UpdateProgressCapsule.tsx

@@ -0,0 +1,118 @@
+import React from 'react'
+import { useAppStore } from '../stores/appStore'
+import { Download, X, AlertCircle, Info } from 'lucide-react'
+import './UpdateProgressCapsule.scss'
+
+const UpdateProgressCapsule: React.FC = () => {
+    const {
+        isDownloading,
+        downloadProgress,
+        showUpdateDialog,
+        setShowUpdateDialog,
+        updateInfo,
+        setUpdateInfo,
+        updateError,
+        setUpdateError
+    } = useAppStore()
+
+    // Control visibility
+    // If dialog is open, we usually hide the capsule UNLESS we want it as a mini-indicator
+    // For now, let's hide it if the dialog is open
+    if (showUpdateDialog) return null
+
+    // State mapping
+    const hasError = !!updateError
+    const hasUpdate = !!updateInfo && updateInfo.hasUpdate
+
+    if (!hasError && !isDownloading && !hasUpdate) return null
+
+    // Safe normalize progress
+    const safeProgress = typeof downloadProgress === 'number' ? { percent: downloadProgress } : (downloadProgress || { percent: 0 })
+    const percent = safeProgress.percent || 0
+    const bytesPerSecond = safeProgress.bytesPerSecond
+
+    const formatBytes = (bytes: number) => {
+        if (!Number.isFinite(bytes) || bytes === 0) return '0 B'
+        const k = 1024
+        const sizes = ['B', 'KB', 'MB', 'GB']
+        const i = Math.floor(Math.log(bytes) / Math.log(k))
+        const unitIndex = Math.max(0, Math.min(i, sizes.length - 1))
+        return parseFloat((bytes / Math.pow(k, unitIndex)).toFixed(1)) + ' ' + sizes[unitIndex]
+    }
+
+    const formatSpeed = (bps: number) => {
+        return `${formatBytes(bps)}/s`
+    }
+
+    const handleClose = (e: React.MouseEvent) => {
+        e.stopPropagation()
+        if (hasError) {
+            setUpdateError(null)
+        } else if (hasUpdate && !isDownloading) {
+            setUpdateInfo(null)
+        }
+    }
+
+    // Determine appearance class and content
+    let capsuleClass = 'update-progress-capsule'
+    let content = null
+
+    if (hasError) {
+        capsuleClass += ' state-error'
+        content = (
+            <>
+                <div className="icon-wrapper">
+                    <AlertCircle size={14} />
+                </div>
+                <div className="info-wrapper">
+                    <span className="error-text">更新失败: {updateError}</span>
+                </div>
+            </>
+        )
+    } else if (isDownloading) {
+        capsuleClass += ' state-downloading'
+        content = (
+            <>
+                <div className="icon-wrapper">
+                    <Download size={14} className="download-icon" />
+                </div>
+                <div className="info-wrapper">
+                    <span className="percent-text">{percent.toFixed(0)}%</span>
+                    {bytesPerSecond > 0 && (
+                        <span className="speed-text">{formatSpeed(bytesPerSecond)}</span>
+                    )}
+                </div>
+                <div className="progress-bg">
+                    <div className="progress-fill" style={{ width: `${percent}%` }} />
+                </div>
+            </>
+        )
+    } else if (hasUpdate) {
+        capsuleClass += ' state-available'
+        content = (
+            <>
+                <div className="icon-wrapper">
+                    <Info size={14} />
+                </div>
+                <div className="info-wrapper">
+                    <span className="available-text">发现新版本 v{updateInfo?.version}</span>
+                </div>
+            </>
+        )
+    }
+
+    return (
+        <div className={capsuleClass} onClick={() => setShowUpdateDialog(true)}>
+            <div className="capsule-content">
+                {content}
+                {!isDownloading && (
+                    <button className="capsule-close" onClick={handleClose}>
+                        <X size={12} />
+                    </button>
+                )}
+            </div>
+        </div>
+    )
+}
+
+export default UpdateProgressCapsule

src/components/VoiceTranscribeDialog.scss

@@ -0,0 +1,262 @@
+.voice-transcribe-dialog-overlay {
+    position: fixed;
+    top: 0;
+    left: 0;
+    right: 0;
+    bottom: 0;
+    background: rgba(0, 0, 0, 0.6);
+    backdrop-filter: blur(4px);
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    z-index: 10000;
+    animation: fadeIn 0.2s ease-out;
+}
+
+.voice-transcribe-dialog {
+    background: var(--bg-secondary);
+    border-radius: 16px;
+    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.3);
+    width: 90%;
+    max-width: 480px;
+    animation: slideUp 0.3s ease-out;
+    overflow: hidden;
+}
+
+.dialog-header {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    padding: 20px 24px;
+    border-bottom: 1px solid var(--border-color);
+
+    h3 {
+        margin: 0;
+        font-size: 18px;
+        font-weight: 600;
+        color: var(--text-primary);
+    }
+
+    .close-button {
+        background: none;
+        border: none;
+        cursor: pointer;
+        padding: 4px;
+        color: var(--text-secondary);
+        border-radius: 6px;
+        transition: all 0.15s ease;
+
+        &:hover {
+            background: var(--bg-hover);
+            color: var(--text-primary);
+        }
+    }
+}
+
+.dialog-content {
+    padding: 24px;
+}
+
+.info-section {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    text-align: center;
+    gap: 16px;
+
+    .info-icon {
+        color: var(--primary);
+        opacity: 0.8;
+    }
+
+    .info-text {
+        font-size: 15px;
+        color: var(--text-primary);
+        margin: 0;
+    }
+
+    .model-info {
+        width: 100%;
+        background: var(--bg-tertiary);
+        border-radius: 12px;
+        padding: 16px;
+        display: flex;
+        flex-direction: column;
+        gap: 12px;
+
+        .model-item {
+            display: flex;
+            justify-content: space-between;
+            align-items: center;
+            font-size: 14px;
+
+            .label {
+                color: var(--text-secondary);
+            }
+
+            .value {
+                color: var(--text-primary);
+                font-weight: 500;
+            }
+        }
+    }
+}
+
+.download-section {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    gap: 16px;
+    padding: 20px 0;
+
+    .download-icon {
+        .downloading-icon {
+            color: var(--primary);
+            animation: bounce 1s ease-in-out infinite;
+        }
+    }
+
+    .download-text {
+        font-size: 15px;
+        color: var(--text-primary);
+        margin: 0;
+    }
+
+    .progress-bar {
+        width: 100%;
+        height: 6px;
+        background: var(--bg-tertiary);
+        border-radius: 3px;
+        overflow: hidden;
+
+        .progress-fill {
+            height: 100%;
+            background: var(--primary-gradient);
+            border-radius: 3px;
+            transition: width 0.3s ease;
+        }
+    }
+
+    .progress-text {
+        font-size: 14px;
+        color: var(--text-secondary);
+        margin: 0;
+        font-variant-numeric: tabular-nums;
+    }
+
+    .download-hint {
+        font-size: 12px;
+        color: var(--text-tertiary);
+        margin: 8px 0 0 0;
+        text-align: center;
+    }
+}
+
+.complete-section {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    gap: 16px;
+    padding: 20px 0;
+
+    .complete-icon {
+        color: #10b981;
+    }
+
+    .complete-text {
+        font-size: 15px;
+        color: var(--text-primary);
+        margin: 0;
+    }
+}
+
+.error-message {
+    display: flex;
+    align-items: center;
+    gap: 8px;
+    padding: 12px 16px;
+    background: rgba(239, 68, 68, 0.1);
+    border: 1px solid rgba(239, 68, 68, 0.3);
+    border-radius: 8px;
+    color: #ef4444;
+    font-size: 14px;
+    margin-top: 16px;
+}
+
+.dialog-actions {
+    display: flex;
+    gap: 12px;
+    margin-top: 24px;
+
+    button {
+        flex: 1;
+        padding: 12px 20px;
+        border-radius: 8px;
+        font-size: 14px;
+        font-weight: 500;
+        cursor: pointer;
+        transition: all 0.15s ease;
+        border: none;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        gap: 6px;
+
+        &.btn-secondary {
+            background: var(--bg-tertiary);
+            color: var(--text-primary);
+
+            &:hover {
+                background: var(--bg-hover);
+            }
+        }
+
+        &.btn-primary {
+            background: var(--primary);
+            color: white;
+
+            &:hover {
+                opacity: 0.9;
+                transform: translateY(-1px);
+            }
+
+            &:active {
+                transform: translateY(0);
+            }
+        }
+    }
+}
+
+@keyframes fadeIn {
+    from {
+        opacity: 0;
+    }
+
+    to {
+        opacity: 1;
+    }
+}
+
+@keyframes slideUp {
+    from {
+        opacity: 0;
+        transform: translateY(20px);
+    }
+
+    to {
+        opacity: 1;
+        transform: translateY(0);
+    }
+}
+
+@keyframes bounce {
+
+    0%,
+    100% {
+        transform: translateY(0);
+    }
+
+    50% {
+        transform: translateY(-10px);
+    }
+}

src/components/VoiceTranscribeDialog.tsx

@@ -0,0 +1,160 @@
+import React, { useState, useEffect } from 'react'
+import { Download, X, CheckCircle, AlertCircle } from 'lucide-react'
+import './VoiceTranscribeDialog.scss'
+
+interface VoiceTranscribeDialogProps {
+    onClose: () => void
+    onDownloadComplete: () => void
+}
+
+export const VoiceTranscribeDialog: React.FC<VoiceTranscribeDialogProps> = ({
+    onClose,
+    onDownloadComplete
+}) => {
+    const [isDownloading, setIsDownloading] = useState(false)
+    const [downloadProgress, setDownloadProgress] = useState(0)
+    const [downloadError, setDownloadError] = useState<string | null>(null)
+    const [isComplete, setIsComplete] = useState(false)
+
+    useEffect(() => {
+        // 监听下载进度
+        if (!window.electronAPI?.whisper?.onDownloadProgress) {
+            console.warn('[VoiceTranscribeDialog] whisper API 不可用')
+            return
+        }
+
+        const removeListener = window.electronAPI.whisper.onDownloadProgress((payload: { modelName: string; downloadedBytes: number; totalBytes?: number; percent?: number }) => {
+            if (payload.percent !== undefined) {
+                setDownloadProgress(payload.percent)
+            }
+        })
+
+        return () => {
+            removeListener?.()
+        }
+    }, [])
+
+    const handleDownload = async () => {
+        if (!window.electronAPI?.whisper?.downloadModel) {
+            setDownloadError('语音转文字功能不可用')
+            return
+        }
+
+        setIsDownloading(true)
+        setDownloadError(null)
+        setDownloadProgress(0)
+
+        try {
+            const result = await window.electronAPI.whisper.downloadModel()
+
+            if (result?.success) {
+                setIsComplete(true)
+                setDownloadProgress(100)
+
+                // 延迟关闭弹窗并触发转写
+                setTimeout(() => {
+                    onDownloadComplete()
+                }, 1000)
+            } else {
+                setDownloadError(result?.error || '下载失败')
+                setIsDownloading(false)
+            }
+        } catch (error) {
+            setDownloadError(String(error))
+            setIsDownloading(false)
+        }
+    }
+
+    const handleCancel = () => {
+        if (!isDownloading && !isComplete) {
+            onClose()
+        }
+    }
+
+    return (
+        <div className="voice-transcribe-dialog-overlay" onClick={handleCancel}>
+            <div className="voice-transcribe-dialog" onClick={(e) => e.stopPropagation()}>
+                <div className="dialog-header">
+                    <h3>语音转文字</h3>
+                    {!isDownloading && !isComplete && (
+                        <button className="close-button" onClick={onClose}>
+                            <X size={20} />
+                        </button>
+                    )}
+                </div>
+
+                <div className="dialog-content">
+                    {!isDownloading && !isComplete && (
+                        <>
+                            <div className="info-section">
+                                <AlertCircle size={48} className="info-icon" />
+                                <p className="info-text">
+                                    首次使用语音转文字功能需要下载 AI 模型
+                                </p>
+                                <div className="model-info">
+                                    <div className="model-item">
+                                        <span className="label">模型名称：</span>
+                                        <span className="value">SenseVoiceSmall</span>
+                                    </div>
+                                    <div className="model-item">
+                                        <span className="label">文件大小：</span>
+                                        <span className="value">约 240 MB</span>
+                                    </div>
+                                    <div className="model-item">
+                                        <span className="label">支持语言：</span>
+                                        <span className="value">中文、粤语、英文、日文、韩文</span>
+                                    </div>
+                                </div>
+                            </div>
+
+                            {downloadError && (
+                                <div className="error-message">
+                                    <AlertCircle size={16} />
+                                    <span>{downloadError}</span>
+                                </div>
+                            )}
+
+                            <div className="dialog-actions">
+                                <button className="btn-secondary" onClick={onClose}>
+                                    取消
+                                </button>
+                                <button className="btn-primary" onClick={handleDownload}>
+                                    <Download size={16} />
+                                    <span>立即下载</span>
+                                </button>
+                            </div>
+                        </>
+                    )}
+
+                    {isDownloading && !isComplete && (
+                        <div className="download-section">
+                            <div className="download-icon">
+                                <Download size={48} className="downloading-icon" />
+                            </div>
+                            <p className="download-text">
+                                {downloadProgress < 1 ? '正在连接服务器...' : '正在下载模型...'}
+                            </p>
+                            <div className="progress-bar">
+                                <div
+                                    className="progress-fill"
+                                    style={{ width: `${downloadProgress}%` }}
+                                />
+                            </div>
+                            <p className="progress-text">{downloadProgress.toFixed(1)}%</p>
+                            {downloadProgress < 1 && (
+                                <p className="download-hint">首次连接可能需要较长时间，请耐心等待</p>
+                            )}
+                        </div>
+                    )}
+
+                    {isComplete && (
+                        <div className="complete-section">
+                            <CheckCircle size={48} className="complete-icon" />
+                            <p className="complete-text">下载完成！正在转写语音...</p>
+                        </div>
+                    )}
+                </div>
+            </div>
+        </div>
+    )
+}

src/pages/AgreementPage.tsx

@@ -9,40 +9,40 @@ function AgreementPage() {
       <div className="agreement-content">
         {/* 协议内容 - 请替换为完整的协议文本 */}
         <h2>用户协议</h2>
-        
+
         <h3>一、总则</h3>
-        <p>欢迎使用WeFlow（WeFlow）软件。请在使用本软件前仔细阅读本协议。一旦您开始使用本软件，即表示您已充分理解并同意本协议的全部内容。</p>
+        <p>欢迎使用WeFlow（WeFlow）软件。请在使用本软件前仔细阅读本协议。一旦你开始使用本软件，即表示你已充分理解并同意本协议的全部内容。</p>
-        
+
         <h3>二、软件说明</h3>
         <p>WeFlow是一款本地化的微信聊天记录查看与分析工具，所有数据处理均在用户本地设备上完成。</p>
-        
+
         <h3>三、使用条款</h3>
         <p>1. 本软件仅供个人学习、研究使用，严禁用于任何商业用途或非法目的。</p>
         <p>2. 用户应确保所查看、分析的数据为本人所有或已获得合法授权。</p>
         <p>3. 用户不得利用本软件侵犯他人隐私、窃取他人信息或从事其他违法活动。</p>
-        
+
         <h3>四、免责声明</h3>
         <p>1. 本软件按"现状"提供，开发者不对软件的适用性、可靠性、准确性作任何明示或暗示的保证。</p>
         <p>2. 因使用或无法使用本软件而产生的任何直接、间接、偶然、特殊或后果性损害，开发者不承担任何责任。</p>
         <p>3. 用户因违反本协议或相关法律法规而产生的一切后果由用户自行承担。</p>
-        
+
         <h3>五、知识产权</h3>
         <p>本软件的所有权、知识产权及相关权益均归开发者所有。未经授权，不得复制、修改、传播本软件。</p>
-        
+
         <h2>隐私政策</h2>
-        
+
         <h3>一、数据收集</h3>
         <p>本软件不收集、不上传、不存储任何用户个人信息或聊天数据。所有数据处理均在本地完成。</p>
-        
+
         <h3>二、数据安全</h3>
-        <p>您的聊天记录和个人数据完全存储在您的本地设备上，本软件不会将任何数据传输至外部服务器。</p>
+        <p>你的聊天记录和个人数据完全存储在你的本地设备上，本软件不会将任何数据传输至外部服务器。</p>
-        
+
         <h3>三、网络请求</h3>
         <p>本软件仅在检查更新时会访问更新服务器获取版本信息，不涉及任何用户数据的传输。</p>
-        
+
         <h3>四、第三方服务</h3>
         <p>本软件不集成任何第三方数据分析、广告或追踪服务。</p>
-        
+
         <p className="agreement-footer-text">最后更新日期：2025年1月</p>
       </div>
     </div>

src/pages/AnalyticsPage.tsx

@@ -1,10 +1,11 @@
-import { useState, useEffect } from 'react'
+import { useState, useEffect, useCallback } from 'react'
+import { useLocation } from 'react-router-dom'
 import { Users, Clock, MessageSquare, Send, Inbox, Calendar, Loader2, RefreshCw, User, Medal } from 'lucide-react'
 import ReactECharts from 'echarts-for-react'
 import { useAnalyticsStore } from '../stores/analyticsStore'
 import { useThemeStore } from '../stores/themeStore'
 import './AnalyticsPage.scss'
-import './DataManagementPage.scss'
+import { Avatar } from '../components/Avatar'
 
 function AnalyticsPage() {
   const [isLoading, setIsLoading] = useState(false)
@@ -14,7 +15,7 @@ function AnalyticsPage() {
 
   const themeMode = useThemeStore((state) => state.themeMode)
   const { statistics, rankings, timeDistribution, isLoaded, setStatistics, setRankings, setTimeDistribution, markLoaded } = useAnalyticsStore()
-  const loadData = async (forceRefresh = false) => {
+  const loadData = useCallback(async (forceRefresh = false) => {
     if (isLoaded && !forceRefresh) return
     setIsLoading(true)
     setError(null)
@@ -28,7 +29,7 @@ function AnalyticsPage() {
 
     try {
       setLoadingStatus('正在统计消息数据...')
-      const statsResult = await window.electronAPI.analytics.getOverallStatistics()
+      const statsResult = await window.electronAPI.analytics.getOverallStatistics(forceRefresh)
       if (statsResult.success && statsResult.data) {
         setStatistics(statsResult.data)
       } else {
@@ -53,9 +54,22 @@ function AnalyticsPage() {
       setIsLoading(false)
       if (removeListener) removeListener()
     }
-  }
+  }, [isLoaded, markLoaded, setRankings, setStatistics, setTimeDistribution])
 
-  useEffect(() => { loadData() }, [])
+  const location = useLocation()
+
+  useEffect(() => {
+    const force = location.state?.forceRefresh === true
+    loadData(force)
+  }, [location.state, loadData])
+
+  useEffect(() => {
+    const handleChange = () => {
+      loadData(true)
+    }
+    window.addEventListener('wxid-changed', handleChange as EventListener)
+    return () => window.removeEventListener('wxid-changed', handleChange as EventListener)
+  }, [loadData])
 
   const handleRefresh = () => loadData(true)
 
@@ -289,7 +303,7 @@ function AnalyticsPage() {
               <div key={contact.username} className="ranking-item">
                 <span className={`rank ${index < 3 ? 'top' : ''}`}>{index + 1}</span>
                 <div className="contact-avatar">
-                  {contact.avatarUrl ? <img src={contact.avatarUrl} alt="" /> : <div className="avatar-placeholder"><User size={20} /></div>}
+                  <Avatar src={contact.avatarUrl} name={contact.displayName} size={36} />
                   {index < 3 && <div className={`medal medal-${index + 1}`}><Medal size={10} /></div>}
                 </div>
                 <div className="contact-info">

src/pages/AnalyticsWelcomePage.scss

@@ -0,0 +1,119 @@
+.analytics-welcome-container {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    height: 100%;
+    padding: 40px;
+    background: var(--bg-primary);
+    color: var(--text-primary);
+    animation: fadeIn 0.4s ease-out;
+
+    .welcome-content {
+        text-align: center;
+        max-width: 600px;
+
+        .icon-wrapper {
+            width: 80px;
+            height: 80px;
+            margin: 0 auto 24px;
+            background: rgba(7, 193, 96, 0.1);
+            border-radius: 20px;
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            color: #07c160;
+
+            svg {
+                width: 40px;
+                height: 40px;
+            }
+        }
+
+        h1 {
+            font-size: 28px;
+            margin-bottom: 12px;
+            font-weight: 600;
+        }
+
+        p {
+            color: var(--text-secondary);
+            margin-bottom: 40px;
+            font-size: 16px;
+            line-height: 1.6;
+        }
+
+        .action-cards {
+            display: grid;
+            grid-template-columns: 1fr 1fr;
+            gap: 20px;
+            margin-top: 20px;
+
+            button {
+                display: flex;
+                flex-direction: column;
+                align-items: center;
+                padding: 30px 20px;
+                background: var(--bg-secondary);
+                border: 1px solid var(--border-color);
+                border-radius: 12px;
+                cursor: pointer;
+                transition: all 0.2s ease;
+                text-align: center;
+
+                &:hover:not(:disabled) {
+                    transform: translateY(-2px);
+                    border-color: #07c160;
+                    box-shadow: 0 4px 12px rgba(7, 193, 96, 0.1);
+
+                    .card-icon {
+                        color: #07c160;
+                        background: rgba(7, 193, 96, 0.1);
+                    }
+                }
+
+                &:disabled {
+                    opacity: 0.6;
+                    cursor: not-allowed;
+                    filter: grayscale(100%);
+                }
+
+                .card-icon {
+                    width: 50px;
+                    height: 50px;
+                    border-radius: 12px;
+                    background: var(--bg-tertiary);
+                    display: flex;
+                    align-items: center;
+                    justify-content: center;
+                    margin-bottom: 16px;
+                    color: var(--text-secondary);
+                    transition: all 0.2s ease;
+                }
+
+                h3 {
+                    font-size: 18px;
+                    margin-bottom: 8px;
+                    color: var(--text-primary);
+                }
+
+                span {
+                    font-size: 13px;
+                    color: var(--text-tertiary);
+                }
+            }
+        }
+    }
+}
+
+@keyframes fadeIn {
+    from {
+        opacity: 0;
+        transform: translateY(10px);
+    }
+
+    to {
+        opacity: 1;
+        transform: translateY(0);
+    }
+}

src/pages/AnalyticsWelcomePage.tsx

@@ -0,0 +1,63 @@
+import { useNavigate } from 'react-router-dom'
+import { BarChart2, History, RefreshCcw } from 'lucide-react'
+import { useAnalyticsStore } from '../stores/analyticsStore'
+import './AnalyticsWelcomePage.scss'
+
+function AnalyticsWelcomePage() {
+    const navigate = useNavigate()
+    // 检查是否有任何缓存数据加载或基本的存储状态表明它已准备好。
+    // 实际上，如果 store 没有持久化，`isLoaded` 可能会在应用刷新时重置。
+    // 如果用户点击“加载缓存”但缓存为空，AnalyticsPage 的逻辑（loadData 不带 force）将尝试从后端缓存加载。
+    // 如果后端缓存也为空，则会重新计算。
+
+    // 我们也可以检查 `lastLoadTime` 来显示“上次更新：xxx”（如果已持久化）。
+    const { lastLoadTime } = useAnalyticsStore()
+
+    const handleLoadCache = () => {
+        navigate('/analytics/view')
+    }
+
+    const handleNewAnalysis = () => {
+        navigate('/analytics/view', { state: { forceRefresh: true } })
+    }
+
+    const formatLastTime = (ts: number | null) => {
+        if (!ts) return '无记录'
+        return new Date(ts).toLocaleString()
+    }
+
+    return (
+        <div className="analytics-welcome-container">
+            <div className="welcome-content">
+                <div className="icon-wrapper">
+                    <BarChart2 size={40} />
+                </div>
+                <h1>私聊数据分析</h1>
+                <p>
+                    WeFlow 可以分析你的聊天记录，生成详细的统计报表。<br />
+                    你可以选择加载上次的分析结果（速度快），或者开始新的分析（数据最新）。
+                </p>
+
+                <div className="action-cards">
+                    <button onClick={handleLoadCache}>
+                        <div className="card-icon">
+                            <History size={24} />
+                        </div>
+                        <h3>加载缓存</h3>
+                        <span>查看上次分析结果<br />(上次更新: {formatLastTime(lastLoadTime)})</span>
+                    </button>
+
+                    <button onClick={handleNewAnalysis}>
+                        <div className="card-icon">
+                            <RefreshCcw size={24} />
+                        </div>
+                        <h3>新的分析</h3>
+                        <span>重新扫描并计算数据<br />(可能需要几分钟)</span>
+                    </button>
+                </div>
+            </div>
+        </div>
+    )
+}
+
+export default AnalyticsWelcomePage

src/pages/AnnualReportWindow.tsx

@@ -1,5 +1,5 @@
 import { useState, useEffect, useRef } from 'react'
-import { Loader2, Download, Image, Check, X } from 'lucide-react'
+import { Loader2, Download, Image, Check, X, SlidersHorizontal } from 'lucide-react'
 import html2canvas from 'html2canvas'
 import { useThemeStore } from '../stores/themeStore'
 import './AnnualReportWindow.scss'
@@ -249,6 +249,7 @@ function AnnualReportWindow() {
   const [fabOpen, setFabOpen] = useState(false)
   const [loadingProgress, setLoadingProgress] = useState(0)
   const [loadingStage, setLoadingStage] = useState('正在初始化...')
+  const [exportMode, setExportMode] = useState<'separate' | 'long'>('separate')
 
   const { currentTheme, themeMode } = useThemeStore()
 
@@ -490,7 +491,7 @@ function AnnualReportWindow() {
   }
 
   // 导出整个报告为长图
-  const exportFullReport = async () => {
+  const exportFullReport = async (filterIds?: Set<string>) => {
     if (!containerRef.current) {
       return
     }
@@ -516,6 +517,16 @@ function AnnualReportWindow() {
         el.style.padding = '40px 0'
       })
 
+      // 如果有筛选，隐藏未选中的板块
+      if (filterIds) {
+        const available = getAvailableSections()
+        available.forEach(s => {
+          if (!filterIds.has(s.id) && s.ref.current) {
+            s.ref.current.style.display = 'none'
+          }
+        })
+      }
+
       // 修复词云导出问题
       const wordCloudInner = container.querySelector('.word-cloud-inner') as HTMLElement
       const wordTags = container.querySelectorAll('.word-tag') as NodeListOf<HTMLElement>
@@ -584,7 +595,7 @@ function AnnualReportWindow() {
 
       const dataUrl = outputCanvas.toDataURL('image/png')
       const link = document.createElement('a')
-      link.download = `${reportData?.year}年度报告.png`
+      link.download = `${reportData?.year}年度报告${filterIds ? '_自定义' : ''}.png`
       link.href = dataUrl
       document.body.appendChild(link)
       link.click()
@@ -607,6 +618,13 @@ function AnnualReportWindow() {
       return
     }
 
+    if (exportMode === 'long') {
+      setShowExportModal(false)
+      await exportFullReport(selectedSections)
+      setSelectedSections(new Set())
+      return
+    }
+
     setIsExporting(true)
     setShowExportModal(false)
 
@@ -735,9 +753,12 @@ function AnnualReportWindow() {
 
       {/* 浮动操作按钮 */}
       <div className={`fab-container ${fabOpen ? 'open' : ''}`}>
-        <button className="fab-item" onClick={() => { setFabOpen(false); setShowExportModal(true) }} title="分模块导出">
+        <button className="fab-item" onClick={() => { setFabOpen(false); setExportMode('separate'); setShowExportModal(true) }} title="分模块导出">
           <Image size={18} />
         </button>
+        <button className="fab-item" onClick={() => { setFabOpen(false); setExportMode('long'); setShowExportModal(true) }} title="自定义导出长图">
+          <SlidersHorizontal size={18} />
+        </button>
         <button className="fab-item" onClick={() => { setFabOpen(false); exportFullReport() }} title="导出长图">
           <Download size={18} />
         </button>
@@ -765,7 +786,7 @@ function AnnualReportWindow() {
         <div className="export-overlay" onClick={() => setShowExportModal(false)}>
           <div className="export-modal section-selector" onClick={e => e.stopPropagation()}>
             <div className="modal-header">
-              <h3>选择要导出的板块</h3>
+              <h3>{exportMode === 'long' ? '自定义导出长图' : '选择要导出的板块'}</h3>
               <button className="close-btn" onClick={() => setShowExportModal(false)}>
                 <X size={20} />
               </button>
@@ -793,7 +814,7 @@ function AnnualReportWindow() {
                 onClick={exportSelectedSections}
                 disabled={selectedSections.size === 0}
               >
-                导出 {selectedSections.size > 0 ? `(${selectedSections.size})` : ''}
+                {exportMode === 'long' ? '生成长图' : '导出'} {selectedSections.size > 0 ? `(${selectedSections.size})` : ''}
               </button>
             </div>
           </div>
@@ -838,7 +859,7 @@ function AnnualReportWindow() {
                 你发出 <span className="hl">{formatNumber(topFriend.sentCount)}</span> 条 ·
                 TA发来 <span className="hl">{formatNumber(topFriend.receivedCount)}</span> 条
               </p>
-              <br/>
+              <br />
               <p className="hero-desc">
                 在一起，就可以
               </p>

src/pages/ChatHistoryPage.scss

@@ -0,0 +1,132 @@
+.chat-history-page {
+  display: flex;
+  flex-direction: column;
+  height: 100vh;
+  background: var(--bg-primary);
+
+  .history-list {
+    flex: 1;
+    overflow-y: auto;
+    padding: 16px;
+    display: flex;
+    flex-direction: column;
+    gap: 12px;
+
+    .status-msg {
+      text-align: center;
+      padding: 40px 20px;
+      color: var(--text-tertiary);
+      font-size: 14px;
+
+      &.error {
+        color: var(--danger);
+      }
+
+      &.empty {
+        color: var(--text-tertiary);
+      }
+    }
+  }
+
+  .history-item {
+    display: flex;
+    gap: 12px;
+    align-items: flex-start;
+
+    .avatar {
+      width: 40px;
+      height: 40px;
+      border-radius: 4px;
+      overflow: hidden;
+      flex-shrink: 0;
+      background: var(--bg-tertiary);
+
+      img {
+        width: 100%;
+        height: 100%;
+        object-fit: cover;
+      }
+
+      .avatar-placeholder {
+        width: 100%;
+        height: 100%;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        color: var(--text-tertiary);
+        font-size: 16px;
+        font-weight: 500;
+        background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+        color: white;
+      }
+    }
+
+    .content-wrapper {
+      flex: 1;
+      min-width: 0;
+
+      .header {
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+        margin-bottom: 6px;
+
+        .sender {
+          font-size: 14px;
+          font-weight: 500;
+          color: var(--text-primary);
+        }
+
+        .time {
+          font-size: 12px;
+          color: var(--text-tertiary);
+          flex-shrink: 0;
+          margin-left: 8px;
+        }
+      }
+
+      .bubble {
+        background: var(--bg-secondary);
+        padding: 10px 14px;
+        border-radius: 18px 18px 18px 4px;
+        word-wrap: break-word;
+        max-width: 100%;
+        display: inline-block;
+
+        &.image-bubble {
+          padding: 0;
+          background: transparent;
+        }
+
+        .text-content {
+          font-size: 14px;
+          line-height: 1.6;
+          color: var(--text-primary);
+          white-space: pre-wrap;
+          word-break: break-word;
+        }
+
+        .media-content {
+          img {
+            max-width: 100%;
+            max-height: 300px;
+            border-radius: 8px;
+            display: block;
+          }
+
+          .media-tip {
+            padding: 8px 12px;
+            color: var(--text-tertiary);
+            font-size: 13px;
+          }
+        }
+
+        .media-placeholder {
+          font-size: 14px;
+          color: var(--text-secondary);
+          padding: 4px 0;
+        }
+      }
+    }
+  }
+}

src/pages/ChatHistoryPage.tsx

@@ -0,0 +1,250 @@
+import { useEffect, useState } from 'react'
+import { useParams, useLocation } from 'react-router-dom'
+import { ChatRecordItem } from '../types/models'
+import TitleBar from '../components/TitleBar'
+import './ChatHistoryPage.scss'
+
+export default function ChatHistoryPage() {
+  const params = useParams<{ sessionId: string; messageId: string }>()
+  const location = useLocation()
+  const [recordList, setRecordList] = useState<ChatRecordItem[]>([])
+  const [loading, setLoading] = useState(true)
+  const [title, setTitle] = useState('聊天记录')
+  const [error, setError] = useState('')
+
+  // 简单的 XML 标签内容提取
+  const extractXmlValue = (xml: string, tag: string): string => {
+    const match = new RegExp(`<${tag}>([\\s\\S]*?)<\\/${tag}>`).exec(xml)
+    return match ? match[1] : ''
+  }
+
+  // 简单的 HTML 实体解码
+  const decodeHtmlEntities = (text?: string): string | undefined => {
+    if (!text) return text
+    return text
+      .replace(/&lt;/g, '<')
+      .replace(/&gt;/g, '>')
+      .replace(/&amp;/g, '&')
+      .replace(/&quot;/g, '"')
+      .replace(/&#39;/g, "'")
+  }
+
+  // 前端兜底解析合并转发聊天记录
+  const parseChatHistory = (content: string): ChatRecordItem[] | undefined => {
+    try {
+      const type = extractXmlValue(content, 'type')
+      if (type !== '19') return undefined
+
+      const match = /<recorditem>[\s\S]*?<!\[CDATA\[([\s\S]*?)\]\]>[\s\S]*?<\/recorditem>/.exec(content)
+      if (!match) return undefined
+
+      const innerXml = match[1]
+      const items: ChatRecordItem[] = []
+      const itemRegex = /<dataitem\s+(.*?)>([\s\S]*?)<\/dataitem>/g
+      let itemMatch: RegExpExecArray | null
+
+      while ((itemMatch = itemRegex.exec(innerXml)) !== null) {
+        const attrs = itemMatch[1]
+        const body = itemMatch[2]
+
+        const datatypeMatch = /datatype="(\d+)"/.exec(attrs)
+        const datatype = datatypeMatch ? parseInt(datatypeMatch[1]) : 0
+
+        const sourcename = extractXmlValue(body, 'sourcename')
+        const sourcetime = extractXmlValue(body, 'sourcetime')
+        const sourceheadurl = extractXmlValue(body, 'sourceheadurl')
+        const datadesc = extractXmlValue(body, 'datadesc')
+        const datatitle = extractXmlValue(body, 'datatitle')
+        const fileext = extractXmlValue(body, 'fileext')
+        const datasize = parseInt(extractXmlValue(body, 'datasize') || '0')
+        const messageuuid = extractXmlValue(body, 'messageuuid')
+
+        const dataurl = extractXmlValue(body, 'dataurl')
+        const datathumburl = extractXmlValue(body, 'datathumburl') || extractXmlValue(body, 'thumburl')
+        const datacdnurl = extractXmlValue(body, 'datacdnurl') || extractXmlValue(body, 'cdnurl')
+        const aeskey = extractXmlValue(body, 'aeskey') || extractXmlValue(body, 'qaeskey')
+        const md5 = extractXmlValue(body, 'md5') || extractXmlValue(body, 'datamd5')
+        const imgheight = parseInt(extractXmlValue(body, 'imgheight') || '0')
+        const imgwidth = parseInt(extractXmlValue(body, 'imgwidth') || '0')
+        const duration = parseInt(extractXmlValue(body, 'duration') || '0')
+
+        items.push({
+          datatype,
+          sourcename,
+          sourcetime,
+          sourceheadurl,
+          datadesc: decodeHtmlEntities(datadesc),
+          datatitle: decodeHtmlEntities(datatitle),
+          fileext,
+          datasize,
+          messageuuid,
+          dataurl: decodeHtmlEntities(dataurl),
+          datathumburl: decodeHtmlEntities(datathumburl),
+          datacdnurl: decodeHtmlEntities(datacdnurl),
+          aeskey: decodeHtmlEntities(aeskey),
+          md5,
+          imgheight,
+          imgwidth,
+          duration
+        })
+      }
+
+      return items.length > 0 ? items : undefined
+    } catch (e) {
+      console.error('前端解析聊天记录失败:', e)
+      return undefined
+    }
+  }
+
+  // 统一从路由参数或 pathname 中解析 sessionId / messageId
+  const getIds = () => {
+    const sessionId = params.sessionId || ''
+    const messageId = params.messageId || ''
+    
+    if (sessionId && messageId) {
+      return { sid: sessionId, mid: messageId }
+    }
+    
+    // 独立窗口场景下没有 Route 包裹，用 pathname 手动解析
+    const match = /^\/chat-history\/([^/]+)\/([^/]+)/.exec(location.pathname)
+    if (match) {
+      return { sid: match[1], mid: match[2] }
+    }
+    
+    return { sid: '', mid: '' }
+  }
+
+  useEffect(() => {
+    const loadData = async () => {
+      const { sid, mid } = getIds()
+      if (!sid || !mid) {
+        setError('无效的聊天记录链接')
+        setLoading(false)
+        return
+      }
+      try {
+        const result = await window.electronAPI.chat.getMessage(sid, parseInt(mid, 10))
+        if (result.success && result.message) {
+          const msg = result.message
+          // 优先使用后端解析好的列表
+          let records: ChatRecordItem[] | undefined = msg.chatRecordList
+
+          // 如果后端没有解析到，则在前端兜底解析一次
+          if ((!records || records.length === 0) && msg.content) {
+            records = parseChatHistory(msg.content) || []
+          }
+
+          if (records && records.length > 0) {
+            setRecordList(records)
+            const match = /<title>(.*?)<\/title>/.exec(msg.content || '')
+            if (match) setTitle(match[1])
+          } else {
+            setError('暂时无法解析这条聊天记录')
+          }
+        } else {
+          setError(result.error || '获取消息失败')
+        }
+      } catch (e) {
+        console.error(e)
+        setError('加载详情失败')
+      } finally {
+        setLoading(false)
+      }
+    }
+    loadData()
+  }, [params.sessionId, params.messageId, location.pathname])
+
+  return (
+    <div className="chat-history-page">
+      <TitleBar title={title} />
+      <div className="history-list">
+        {loading ? (
+          <div className="status-msg">加载中...</div>
+        ) : error ? (
+          <div className="status-msg error">{error}</div>
+        ) : recordList.length === 0 ? (
+          <div className="status-msg empty">暂无可显示的聊天记录</div>
+        ) : (
+          recordList.map((item, i) => (
+            <HistoryItem key={i} item={item} />
+          ))
+        )}
+      </div>
+    </div>
+  )
+}
+
+function HistoryItem({ item }: { item: ChatRecordItem }) {
+  // sourcetime 在合并转发里有两种格式：
+  // 1) 时间戳（秒） 2) 已格式化的字符串 "2026-01-21 09:56:46"
+  let time = ''
+  if (item.sourcetime) {
+    if (/^\d+$/.test(item.sourcetime)) {
+      time = new Date(parseInt(item.sourcetime, 10) * 1000).toLocaleString()
+    } else {
+      time = item.sourcetime
+    }
+  }
+
+  const renderContent = () => {
+    if (item.datatype === 1) {
+      // 文本消息
+      return <div className="text-content">{item.datadesc || ''}</div>
+    }
+    if (item.datatype === 3) {
+      // 图片
+      const src = item.datathumburl || item.datacdnurl
+      if (src) {
+        return (
+          <div className="media-content">
+            <img 
+              src={src} 
+              alt="图片" 
+              referrerPolicy="no-referrer" 
+              onError={(e) => {
+                const target = e.target as HTMLImageElement
+                target.style.display = 'none'
+                const placeholder = document.createElement('div')
+                placeholder.className = 'media-tip'
+                placeholder.textContent = '图片无法加载'
+                target.parentElement?.appendChild(placeholder)
+              }} 
+            />
+          </div>
+        )
+      }
+      return <div className="media-placeholder">[图片]</div>
+    }
+    if (item.datatype === 43) {
+      return <div className="media-placeholder">[视频] {item.datatitle}</div>
+    }
+    if (item.datatype === 34) {
+      return <div className="media-placeholder">[语音] {item.duration ? (item.duration / 1000).toFixed(0) + '"' : ''}</div>
+    }
+    // Fallback
+    return <div className="text-content">{item.datadesc || item.datatitle || '[不支持的消息类型]'}</div>
+  }
+
+  return (
+    <div className="history-item">
+      <div className="avatar">
+        {item.sourceheadurl ? (
+          <img src={item.sourceheadurl} alt="" referrerPolicy="no-referrer" />
+        ) : (
+          <div className="avatar-placeholder">
+            {item.sourcename?.slice(0, 1)}
+          </div>
+        )}
+      </div>
+      <div className="content-wrapper">
+        <div className="header">
+          <span className="sender">{item.sourcename || '未知发送者'}</span>
+          <span className="time">{time}</span>
+        </div>
+        <div className={`bubble ${item.datatype === 3 ? 'image-bubble' : ''}`}>
+          {renderContent()}
+        </div>
+      </div>
+    </div>
+  )
+}

src/pages/ChatPage.scss

@@ -1,4 +1,4 @@
-.chat-page {
+.chat-page {
   display: flex;
   height: 100%;
   gap: 16px;
@@ -370,9 +370,23 @@
       }
 
       .message-bubble {
-        max-width: 65%;
+        display: flex;
+        gap: 12px;
+        max-width: 80%;
+        margin-bottom: 4px;
+        align-items: flex-start;
+
+        .bubble-body {
+          display: flex;
+          flex-direction: column;
+          max-width: 100%;
+          min-width: 0; // 允许收缩
+          width: fit-content; // 让气泡宽度由内容决定
+        }
 
         &.sent {
+          flex-direction: row-reverse;
+
           .bubble-content {
             background: var(--primary-gradient);
             color: #fff;
@@ -382,6 +396,10 @@
             line-height: 1.5;
             box-shadow: 0 2px 10px var(--primary-light);
           }
+
+          .bubble-body {
+            align-items: flex-end;
+          }
         }
 
         &.received {
@@ -395,6 +413,10 @@
             backdrop-filter: blur(10px);
             border: 1px solid var(--border-color);
           }
+
+          .bubble-body {
+            align-items: flex-start;
+          }
         }
 
         &.system {
@@ -428,6 +450,11 @@
         font-size: 12px;
         color: var(--text-secondary);
         margin-bottom: 4px;
+        // 防止名字撑开气泡宽度
+        max-width: 100%;
+        overflow: hidden;
+        text-overflow: ellipsis;
+        white-space: nowrap;
       }
 
       .quoted-message {
@@ -462,8 +489,21 @@
       }
 
       .load-more-trigger {
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        gap: 8px;
+        padding: 12px 0;
         color: var(--text-tertiary);
-        font-size: 12px;
+        font-size: 13px;
+
+        &.later {
+          padding: 24px 0 12px;
+        }
+
+        svg {
+          animation: spin 1s linear infinite;
+        }
       }
 
       .empty-chat {
@@ -790,6 +830,100 @@
 }
 
 // 右侧消息区域
+// ... (previous content) ...
+
+// 链接卡片消息样式
+.link-message {
+  width: 280px;
+  background: var(--card-bg);
+  border-radius: 8px;
+  overflow: hidden;
+  cursor: pointer;
+  transition: all 0.2s ease;
+  border: 1px solid var(--border-color);
+
+  &:hover {
+    background: var(--bg-hover);
+    border-color: var(--primary);
+  }
+
+  .link-header {
+    padding: 10px 12px 6px;
+    display: flex;
+    gap: 8px;
+
+    .link-title {
+      font-size: 14px;
+      font-weight: 500;
+      color: var(--text-primary);
+      line-height: 1.4;
+      display: -webkit-box;
+      -webkit-line-clamp: 2;
+      line-clamp: 2;
+      -webkit-box-orient: vertical;
+      overflow: hidden;
+      flex: 1;
+    }
+  }
+
+  .link-body {
+    padding: 6px 12px 10px;
+    display: flex;
+    gap: 10px;
+
+    .link-desc {
+      font-size: 12px;
+      color: var(--text-secondary);
+      line-height: 1.4;
+      display: -webkit-box;
+      -webkit-line-clamp: 3;
+      line-clamp: 3;
+      -webkit-box-orient: vertical;
+      overflow: hidden;
+      flex: 1;
+    }
+
+    .link-thumb {
+      width: 48px;
+      height: 48px;
+      border-radius: 4px;
+      object-fit: cover;
+      flex-shrink: 0;
+      background: var(--bg-tertiary);
+    }
+
+    .link-thumb-placeholder {
+      width: 48px;
+      height: 48px;
+      border-radius: 4px;
+      background: var(--bg-tertiary);
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      flex-shrink: 0;
+      color: var(--text-tertiary);
+
+      svg {
+        opacity: 0.5;
+      }
+    }
+  }
+}
+
+// 适配发送出去的消息中的链接卡片
+.message-bubble.sent .link-message {
+  background: var(--card-bg);
+  border: 1px solid var(--border-color);
+
+  .link-title {
+    color: var(--text-primary);
+  }
+
+  .link-desc {
+    color: var(--text-secondary);
+  }
+}
+
 .message-area {
   flex: 1 1 70%;
   display: flex;
@@ -883,6 +1017,23 @@
   min-height: 0;
   overflow: hidden;
   -webkit-app-region: no-drag;
+  position: relative;
+
+  &.loading .message-list {
+    opacity: 0;
+    transform: translateY(8px);
+    pointer-events: none;
+  }
+
+  &.loaded .message-list {
+    opacity: 1;
+    transform: translateY(0);
+  }
+
+  &.loaded .loading-overlay {
+    opacity: 0;
+    pointer-events: none;
+  }
 }
 
 .message-list {
@@ -898,6 +1049,7 @@
   background-color: var(--bg-tertiary);
   position: relative;
   -webkit-app-region: no-drag !important;
+  transition: opacity 240ms ease, transform 240ms ease;
 
   // 滚动条样式
   &::-webkit-scrollbar {
@@ -918,6 +1070,18 @@
   }
 }
 
+.loading-messages.loading-overlay {
+  position: absolute;
+  inset: 0;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  gap: 10px;
+  background: var(--bg-tertiary);
+  transition: opacity 200ms ease;
+  z-index: 2;
+}
+
 .message-list * {
   -webkit-app-region: no-drag !important;
 }
@@ -1077,6 +1241,14 @@
       border-radius: 16px;
     }
   }
+
+  // 使发送的语音消息和转文字也使用接收者的样式 (浅色)
+  &.sent.voice {
+    .bubble-content {
+      background: var(--bg-secondary);
+      color: var(--text-primary);
+    }
+  }
 }
 
 .bubble-avatar {
@@ -1108,6 +1280,7 @@
   font-size: 14px;
   line-height: 1.6;
   word-break: break-word;
+  white-space: pre-wrap;
 }
 
 // 表情包消息
@@ -1259,36 +1432,6 @@
   color: var(--text-quaternary);
 }
 
-.image-preview-overlay {
-  position: fixed;
-  inset: 0;
-  background: rgba(0, 0, 0, 0.75);
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  z-index: 1000;
-
-  img {
-    max-width: 88vw;
-    max-height: 88vh;
-    border-radius: 12px;
-    box-shadow: 0 16px 40px rgba(0, 0, 0, 0.35);
-  }
-}
-
-.image-preview-close {
-  position: absolute;
-  top: 20px;
-  right: 20px;
-  width: 36px;
-  height: 36px;
-  border-radius: 50%;
-  border: none;
-  background: rgba(0, 0, 0, 0.6);
-  color: #fff;
-  cursor: pointer;
-}
-
 // 语音消息
 .voice-message {
   display: flex;
@@ -1301,8 +1444,10 @@
   cursor: pointer;
 }
 
-.message-bubble.sent .voice-message {
+.voice-stack {
-  background: rgba(255, 255, 255, 0.18);
+  display: flex;
+  flex-direction: column;
+  gap: 6px;
 }
 
 .voice-play-btn {
@@ -1337,6 +1482,50 @@
   }
 }
 
+.voice-waveform {
+  flex: 1;
+  display: flex;
+  align-items: center;
+  gap: 2px;
+  height: 24px;
+  min-width: 120px;
+}
+
+.waveform-bar {
+  flex: 1;
+  width: 2px;
+  background: rgba(0, 0, 0, 0.1);
+  border-radius: 1px;
+  transition: transform 0.2s ease, background 0.2s ease;
+
+  &.played {
+    background: var(--primary);
+  }
+}
+
+.message-bubble.sent.voice .waveform-bar {
+  background: rgba(0, 0, 0, 0.1); // 基色改为透明黑
+
+  &.played {
+    background: var(--primary);
+  }
+}
+
+.voice-wave-placeholder {
+  display: flex;
+  align-items: flex-end;
+  gap: 3px;
+  height: 18px;
+
+  span {
+    width: 3px;
+    height: 8px;
+    border-radius: 2px;
+    background: var(--text-tertiary);
+    opacity: 0.6;
+  }
+}
+
 .voice-message.playing .voice-wave span {
   animation: voicePulse 0.9s ease-in-out infinite;
 }
@@ -1389,15 +1578,35 @@
   color: #d9480f;
 }
 
+.voice-transcript {
+  max-width: 260px;
+  padding: 8px 12px;
+  border-radius: 14px;
+  font-size: 13px;
+  line-height: 1.5;
+  background: var(--card-bg);
+  color: var(--text-primary);
+  border: 1px solid var(--border-color);
+  word-break: break-word;
+  white-space: pre-wrap;
+}
+
+.voice-transcript.error {
+  color: #d9480f;
+  cursor: pointer;
+}
+
 @keyframes voicePulse {
   0% {
     height: 6px;
     opacity: 0.5;
   }
+
   50% {
     height: 16px;
     opacity: 1;
   }
+
   100% {
     height: 6px;
     opacity: 0.5;
@@ -1409,6 +1618,11 @@
   font-size: 12px;
   color: var(--text-tertiary);
   margin-bottom: 4px;
+  // 防止名字撑开气泡宽度
+  max-width: 100%;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
 }
 
 // 引用消息样式
@@ -1432,6 +1646,7 @@
 
   .quoted-text {
     color: var(--text-secondary);
+    white-space: pre-wrap;
   }
 }
 
@@ -1456,7 +1671,11 @@
   display: flex;
   flex-direction: column;
   max-width: 100%;
+  min-width: 0; // 允许收缩
   -webkit-app-region: no-drag;
+
+  // 让气泡宽度由内容决定，而不是被父容器撑开
+  width: fit-content;
 }
 
 .bubble-content {
@@ -1843,3 +2062,413 @@
     transform: translateX(0);
   }
 }
+
+/* 语音转文字按钮样式 */
+.voice-transcribe-btn {
+  width: 28px;
+  height: 28px;
+  padding: 0;
+  margin-left: 8px;
+  border: none;
+  background: var(--primary-light);
+  border-radius: 50%;
+  color: var(--primary);
+  cursor: pointer;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  transition: all 0.2s;
+  flex-shrink: 0;
+
+  &:hover {
+    background: var(--primary);
+    color: #fff;
+    transform: scale(1.05);
+  }
+
+  svg {
+    width: 14px;
+    height: 14px;
+  }
+}
+
+// 视频消息样式
+.video-thumb-wrapper {
+  position: relative;
+  max-width: 300px;
+  min-width: 200px;
+  border-radius: 12px;
+  overflow: hidden;
+  cursor: pointer;
+  background: var(--bg-tertiary);
+  transition: transform 0.2s;
+
+  &:hover {
+    transform: scale(1.02);
+
+    .video-play-button {
+      opacity: 1;
+      transform: translate(-50%, -50%) scale(1.1);
+    }
+  }
+
+  .video-thumb {
+    width: 100%;
+    height: auto;
+    display: block;
+  }
+
+  .video-thumb-placeholder {
+    width: 100%;
+    aspect-ratio: 16/9;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    background: var(--bg-hover);
+    color: var(--text-tertiary);
+
+    svg {
+      width: 32px;
+      height: 32px;
+    }
+  }
+
+  .video-play-button {
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    transform: translate(-50%, -50%);
+    opacity: 0.9;
+    transition: all 0.2s;
+    color: #fff;
+    filter: drop-shadow(0 2px 8px rgba(0, 0, 0, 0.5));
+  }
+}
+
+.video-placeholder,
+.video-loading,
+.video-unavailable {
+  min-width: 120px;
+  min-height: 80px;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  gap: 8px;
+  padding: 16px;
+  border-radius: 12px;
+  background: var(--bg-tertiary);
+  color: var(--text-tertiary);
+  font-size: 13px;
+
+  svg {
+    width: 24px;
+    height: 24px;
+  }
+}
+
+.video-loading {
+  .spin {
+    animation: spin 1s linear infinite;
+  }
+}
+
+
+// 名片消息
+.card-message {
+  display: flex;
+  align-items: center;
+  gap: 12px;
+  padding: 12px;
+  background: var(--bg-tertiary);
+  border-radius: 8px;
+  min-width: 200px;
+  
+  .card-icon {
+    flex-shrink: 0;
+    color: var(--primary);
+  }
+  
+  .card-info {
+    flex: 1;
+    min-width: 0;
+  }
+  
+  .card-name {
+    font-size: 14px;
+    font-weight: 500;
+    color: var(--text-primary);
+    margin-bottom: 2px;
+  }
+  
+  .card-label {
+    font-size: 12px;
+    color: var(--text-tertiary);
+  }
+}
+
+// 通话消息
+.call-message {
+  display: flex;
+  align-items: center;
+  gap: 6px;
+  padding: 8px 12px;
+  color: var(--text-secondary);
+  font-size: 13px;
+  
+  svg {
+    flex-shrink: 0;
+  }
+}
+
+// 文件消息
+// 文件消息
+.file-message {
+  display: flex;
+  align-items: center;
+  gap: 12px;
+  padding: 12px;
+  background: var(--bg-tertiary);
+  border-radius: 8px;
+  min-width: 220px;
+  cursor: pointer;
+  transition: background 0.2s;
+  
+  &:hover {
+    background: var(--bg-hover);
+  }
+  
+  .file-icon {
+    flex-shrink: 0;
+    color: var(--primary);
+  }
+  
+  .file-info {
+    flex: 1;
+    min-width: 0;
+  }
+  
+  .file-name {
+    font-size: 14px;
+    font-weight: 500;
+    color: var(--text-primary);
+    margin-bottom: 2px;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+  }
+  
+  .file-meta {
+    font-size: 12px;
+    color: var(--text-tertiary);
+  }
+}
+
+// 发送的文件消息样式
+.message-bubble.sent .file-message {
+  background: #fff;
+  border: 1px solid rgba(0, 0, 0, 0.1);
+
+  .file-name {
+    color: #333;
+  }
+
+  .file-meta {
+    color: #999;
+  }
+}
+
+// 聊天记录消息 - 复用 link-message 基础样式
+.chat-record-message {
+  cursor: pointer;
+  
+  .link-header {
+    padding-bottom: 4px;
+  }
+
+  .chat-record-preview {
+    display: flex;
+    flex-direction: column;
+    gap: 4px;
+    flex: 1;
+    min-width: 0;
+  }
+
+  .chat-record-meta-line {
+    font-size: 11px;
+    color: var(--text-tertiary);
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+  }
+
+  .chat-record-list {
+    display: flex;
+    flex-direction: column;
+    gap: 2px;
+    max-height: 70px;
+    overflow: hidden;
+  }
+
+  .chat-record-item {
+    font-size: 12px;
+    color: var(--text-secondary);
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+  }
+
+  .source-name {
+    color: var(--text-primary);
+    font-weight: 500;
+    margin-right: 4px;
+  }
+
+  .chat-record-more {
+    font-size: 12px;
+    color: var(--primary);
+  }
+
+  .chat-record-desc {
+    font-size: 12px;
+    color: var(--text-secondary);
+  }
+
+  .chat-record-icon {
+    width: 40px;
+    height: 40px;
+    border-radius: 10px;
+    background: var(--primary-gradient);
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    color: #fff;
+    flex-shrink: 0;
+  }
+}
+
+// 小程序消息
+.miniapp-message {
+  display: flex;
+  align-items: center;
+  gap: 12px;
+  padding: 12px;
+  background: var(--bg-tertiary);
+  border-radius: 8px;
+  min-width: 200px;
+  
+  .miniapp-icon {
+    flex-shrink: 0;
+    color: var(--primary);
+  }
+  
+  .miniapp-info {
+    flex: 1;
+    min-width: 0;
+  }
+  
+  .miniapp-title {
+    font-size: 14px;
+    font-weight: 500;
+    color: var(--text-primary);
+    margin-bottom: 2px;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+  }
+  
+  .miniapp-label {
+    font-size: 12px;
+    color: var(--text-tertiary);
+  }
+}
+
+// 转账消息卡片
+.transfer-message {
+  width: 240px;
+  background: linear-gradient(135deg, #f59e42 0%, #f5a742 100%);
+  border-radius: 12px;
+  padding: 14px 16px;
+  display: flex;
+  gap: 12px;
+  align-items: center;
+  cursor: default;
+
+  &.received {
+    background: linear-gradient(135deg, #b8b8b8 0%, #a8a8a8 100%);
+  }
+
+  .transfer-icon {
+    flex-shrink: 0;
+
+    svg {
+      width: 32px;
+      height: 32px;
+      filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.1));
+    }
+  }
+
+  .transfer-info {
+    flex: 1;
+    color: white;
+
+    .transfer-amount {
+      font-size: 18px;
+      font-weight: 600;
+      margin-bottom: 2px;
+      text-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
+    }
+
+    .transfer-memo {
+      font-size: 13px;
+      margin-bottom: 8px;
+      opacity: 0.95;
+    }
+
+    .transfer-label {
+      font-size: 12px;
+      opacity: 0.85;
+    }
+  }
+}
+
+// 发送消息中的特殊消息类型适配（除了文件和转账）
+.message-bubble.sent {
+  .card-message,
+  .chat-record-message,
+  .miniapp-message {
+    background: rgba(255, 255, 255, 0.15);
+    
+    .card-name,
+    .miniapp-title,
+    .source-name {
+      color: white;
+    }
+    
+    .card-label,
+    .miniapp-label,
+    .chat-record-item,
+    .chat-record-meta-line,
+    .chat-record-desc {
+      color: rgba(255, 255, 255, 0.8);
+    }
+    
+    .card-icon,
+    .miniapp-icon,
+    .chat-record-icon {
+      color: white;
+    }
+    
+    .chat-record-more {
+      color: rgba(255, 255, 255, 0.9);
+    }
+  }
+  
+  .call-message {
+    color: rgba(255, 255, 255, 0.9);
+    
+    svg {
+      color: white;
+    }
+  }
+}

src/pages/ContactsPage.scss

@@ -0,0 +1,551 @@
+.contacts-page {
+  display: flex;
+  height: calc(100% + 48px);
+  margin: -24px;
+  background: var(--bg-primary);
+  overflow: hidden;
+
+  // 左侧联系人面板
+  .contacts-panel {
+    width: 380px;
+    min-width: 380px;
+    display: flex;
+    flex-direction: column;
+    border-right: 1px solid var(--border-color);
+    background: var(--card-bg);
+  }
+
+  .panel-header {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    padding: 20px 24px;
+    border-bottom: 1px solid var(--border-color);
+
+    h2 {
+      font-size: 18px;
+      font-weight: 600;
+      color: var(--text-primary);
+      margin: 0;
+    }
+
+    .icon-btn {
+      width: 32px;
+      height: 32px;
+      border: none;
+      background: var(--bg-tertiary);
+      border-radius: 8px;
+      cursor: pointer;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      color: var(--text-secondary);
+      transition: all 0.2s;
+
+      &:hover {
+        background: var(--bg-hover);
+        color: var(--text-primary);
+      }
+
+      &:disabled {
+        opacity: 0.5;
+        cursor: not-allowed;
+      }
+
+      .spin {
+        animation: contactsSpin 1s linear infinite;
+      }
+    }
+  }
+
+  .search-bar {
+    display: flex;
+    align-items: center;
+    gap: 10px;
+    margin: 16px 20px;
+    padding: 10px 14px;
+    background: var(--bg-secondary);
+    border-radius: 10px;
+    border: 1px solid var(--border-color);
+    transition: border-color 0.2s;
+
+    &:focus-within {
+      border-color: var(--primary);
+    }
+
+    svg {
+      color: var(--text-tertiary);
+      flex-shrink: 0;
+    }
+
+    input {
+      flex: 1;
+      border: none;
+      background: none;
+      outline: none;
+      font-size: 14px;
+      color: var(--text-primary);
+
+      &::placeholder {
+        color: var(--text-tertiary);
+      }
+    }
+
+    .clear-btn {
+      background: none;
+      border: none;
+      padding: 4px;
+      cursor: pointer;
+      color: var(--text-tertiary);
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      border-radius: 4px;
+
+      &:hover {
+        background: var(--bg-hover);
+        color: var(--text-primary);
+      }
+    }
+  }
+
+  .type-filters {
+    display: flex;
+    gap: 8px;
+    padding: 0 20px 16px;
+    flex-wrap: nowrap;
+    overflow-x: auto;
+
+    &::-webkit-scrollbar {
+      display: none;
+    }
+
+    .filter-chip {
+      display: flex;
+      align-items: center;
+      gap: 6px;
+      padding: 8px 14px;
+      background: var(--bg-secondary);
+      border: 1px solid var(--border-color);
+      border-radius: 10px;
+      cursor: pointer;
+      user-select: none;
+      font-size: 13px;
+      font-weight: 500;
+      color: var(--text-secondary);
+      transition: all 0.2s ease;
+      white-space: nowrap;
+
+      input[type="checkbox"] {
+        display: none;
+      }
+
+      svg {
+        opacity: 0.7;
+        transition: transform 0.2s;
+      }
+
+      &:hover {
+        background: var(--bg-hover);
+        border-color: var(--text-tertiary);
+        color: var(--text-primary);
+
+        svg {
+          transform: translateY(-1px);
+        }
+      }
+
+      &.active {
+        background: var(--primary-light);
+        border-color: var(--primary);
+        color: var(--primary);
+
+        svg {
+          opacity: 1;
+          color: var(--primary);
+        }
+      }
+    }
+  }
+
+  .contacts-count {
+    padding: 0 20px 12px;
+    font-size: 13px;
+    color: var(--text-secondary);
+  }
+
+  .loading-state,
+  .empty-state {
+    flex: 1;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    gap: 12px;
+    color: var(--text-tertiary);
+    font-size: 14px;
+
+    .spin {
+      animation: contactsSpin 1s linear infinite;
+    }
+  }
+
+  .contacts-list {
+    flex: 1;
+    overflow-y: auto;
+    padding: 0 12px 12px;
+
+    &::-webkit-scrollbar {
+      width: 6px;
+    }
+
+    &::-webkit-scrollbar-thumb {
+      background: var(--text-tertiary);
+      border-radius: 3px;
+      opacity: 0.3;
+    }
+  }
+
+  .contact-item {
+    display: flex;
+    align-items: center;
+    gap: 12px;
+    padding: 12px;
+    border-radius: 10px;
+    transition: all 0.2s;
+    margin-bottom: 4px;
+
+    &:hover {
+      background: var(--bg-hover);
+    }
+
+    .contact-avatar {
+      width: 44px;
+      height: 44px;
+      border-radius: 10px;
+      background: linear-gradient(135deg, var(--primary), var(--primary-hover));
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      overflow: hidden;
+      flex-shrink: 0;
+
+      img {
+        width: 100%;
+        height: 100%;
+        object-fit: cover;
+      }
+
+      span {
+        color: #fff;
+        font-size: 16px;
+        font-weight: 600;
+      }
+    }
+
+    .contact-info {
+      flex: 1;
+      min-width: 0;
+    }
+
+    .contact-name {
+      font-size: 14px;
+      font-weight: 500;
+      color: var(--text-primary);
+      white-space: nowrap;
+      overflow: hidden;
+      text-overflow: ellipsis;
+    }
+
+    .contact-remark {
+      font-size: 12px;
+      color: var(--text-tertiary);
+      white-space: nowrap;
+      overflow: hidden;
+      text-overflow: ellipsis;
+      margin-top: 2px;
+    }
+
+    .contact-type {
+      display: flex;
+      align-items: center;
+      gap: 4px;
+      padding: 4px 10px;
+      border-radius: 6px;
+      font-size: 12px;
+      font-weight: 500;
+      flex-shrink: 0;
+
+      &.friend {
+        background: rgba(var(--primary-rgb), 0.1);
+        color: var(--primary);
+      }
+
+      &.group {
+        background: rgba(52, 211, 153, 0.1);
+        color: rgb(52, 211, 153);
+      }
+
+      &.official {
+        background: rgba(251, 191, 36, 0.1);
+        color: rgb(251, 191, 36);
+      }
+
+      svg {
+        flex-shrink: 0;
+      }
+    }
+  }
+
+  // 右侧设置面板
+  .settings-panel {
+    flex: 1;
+    display: flex;
+    flex-direction: column;
+    overflow: hidden;
+  }
+
+  .settings-content {
+    flex: 1;
+    overflow-y: auto;
+    padding: 20px 24px;
+
+    &::-webkit-scrollbar {
+      width: 6px;
+    }
+
+    &::-webkit-scrollbar-thumb {
+      background: var(--text-tertiary);
+      border-radius: 3px;
+    }
+  }
+
+  .setting-section {
+    margin-bottom: 28px;
+
+    h3 {
+      font-size: 13px;
+      font-weight: 600;
+      color: var(--text-secondary);
+      text-transform: uppercase;
+      letter-spacing: 0.5px;
+      margin: 0 0 14px;
+    }
+  }
+
+  .format-select {
+    position: relative;
+    /* margin-bottom 移到 .setting-section */
+
+    .select-trigger {
+      width: 100%;
+      padding: 10px 16px;
+      border: 1px solid var(--border-color);
+      border-radius: 9999px;
+      /* Rounded pill shape */
+      font-size: 14px;
+      background: var(--bg-primary);
+      color: var(--text-primary);
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+      gap: 8px;
+      cursor: pointer;
+      transition: all 0.2s;
+
+      &:hover {
+        border-color: var(--text-tertiary);
+      }
+
+      &.open {
+        border-color: var(--primary);
+        box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary) 15%, transparent);
+      }
+    }
+
+    .select-value {
+      flex: 1;
+      min-width: 0;
+      text-align: left;
+      white-space: nowrap;
+      overflow: hidden;
+      text-overflow: ellipsis;
+    }
+
+    .select-dropdown {
+      position: absolute;
+      top: calc(100% + 6px);
+      left: 0;
+      right: 0;
+      background: color-mix(in srgb, var(--bg-primary) 85%, var(--bg-secondary));
+      border: 1px solid var(--border-color);
+      border-radius: 12px;
+      padding: 6px;
+      box-shadow: var(--shadow-md);
+      z-index: 20;
+      max-height: 260px;
+      overflow-y: auto;
+      backdrop-filter: blur(14px);
+      -webkit-backdrop-filter: blur(14px);
+    }
+
+    .select-option {
+      width: 100%;
+      text-align: left;
+      display: flex;
+      flex-direction: column;
+      gap: 4px;
+      padding: 10px 12px;
+      border: none;
+      border-radius: 10px;
+      background: transparent;
+      cursor: pointer;
+      transition: all 0.15s;
+      color: var(--text-primary);
+      font-size: 14px;
+
+      &:hover {
+        background: var(--bg-tertiary);
+      }
+
+      &.active {
+        background: color-mix(in srgb, var(--primary) 12%, transparent);
+        color: var(--primary);
+
+        .option-desc {
+          color: var(--primary);
+        }
+      }
+    }
+
+    .option-label {
+      font-weight: 500;
+    }
+
+    .option-desc {
+      font-size: 12px;
+      color: var(--text-tertiary);
+    }
+  }
+
+  .checkbox-item {
+    display: flex;
+    align-items: center;
+    gap: 10px;
+    cursor: pointer;
+    font-size: 14px;
+    color: var(--text-primary);
+
+    input[type="checkbox"] {
+      width: 18px;
+      height: 18px;
+      accent-color: var(--primary);
+      cursor: pointer;
+    }
+  }
+
+  .export-path-display {
+    display: flex;
+    align-items: center;
+    gap: 10px;
+    padding: 12px 16px;
+    background: var(--bg-secondary);
+    border-radius: 10px;
+    font-size: 13px;
+    color: var(--text-primary);
+    margin-bottom: 12px;
+
+    svg {
+      color: var(--primary);
+      flex-shrink: 0;
+    }
+
+    span {
+      flex: 1;
+      white-space: nowrap;
+      overflow: hidden;
+      text-overflow: ellipsis;
+    }
+  }
+
+  .select-folder-btn {
+    width: 100%;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    gap: 8px;
+    padding: 10px 16px;
+    background: var(--bg-secondary);
+    border: 1px solid var(--border-color);
+    border-radius: 8px;
+    font-size: 13px;
+    font-weight: 500;
+    color: var(--text-primary);
+    cursor: pointer;
+    transition: all 0.2s;
+
+    &:hover {
+      background: var(--bg-hover);
+      border-color: var(--primary);
+      color: var(--primary);
+
+      svg {
+        color: var(--primary);
+      }
+    }
+
+    &:active {
+      transform: scale(0.98);
+    }
+
+    svg {
+      color: var(--text-secondary);
+      transition: color 0.2s;
+    }
+  }
+
+  .export-action {
+    padding: 20px 24px;
+    border-top: 1px solid var(--border-color);
+  }
+
+  .export-btn {
+    width: 100%;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    gap: 10px;
+    padding: 14px 24px;
+    background: var(--primary);
+    color: #fff;
+    border: none;
+    border-radius: 12px;
+    font-size: 15px;
+    font-weight: 600;
+    cursor: pointer;
+    transition: all 0.2s;
+
+    &:hover:not(:disabled) {
+      background: var(--primary-hover);
+    }
+
+    &:disabled {
+      opacity: 0.5;
+      cursor: not-allowed;
+    }
+
+    .spin {
+      animation: contactsSpin 1s linear infinite;
+    }
+  }
+}
+
+@keyframes contactsSpin {
+  from {
+    transform: rotate(0deg);
+  }
+
+  to {
+    transform: rotate(360deg);
+  }
+}

src/pages/ContactsPage.tsx

@@ -0,0 +1,384 @@
+import { useState, useEffect, useCallback, useRef } from 'react'
+import { Search, RefreshCw, X, User, Users, MessageSquare, Loader2, FolderOpen, Download, ChevronDown } from 'lucide-react'
+import './ContactsPage.scss'
+
+interface ContactInfo {
+    username: string
+    displayName: string
+    remark?: string
+    nickname?: string
+    avatarUrl?: string
+    type: 'friend' | 'group' | 'official' | 'other'
+}
+
+function ContactsPage() {
+    const [contacts, setContacts] = useState<ContactInfo[]>([])
+    const [filteredContacts, setFilteredContacts] = useState<ContactInfo[]>([])
+    const [isLoading, setIsLoading] = useState(true)
+    const [searchKeyword, setSearchKeyword] = useState('')
+    const [contactTypes, setContactTypes] = useState({
+        friends: true,
+        groups: true,
+        officials: true
+    })
+
+    // 导出相关状态
+    const [exportFormat, setExportFormat] = useState<'json' | 'csv' | 'vcf'>('json')
+    const [exportAvatars, setExportAvatars] = useState(true)
+    const [exportFolder, setExportFolder] = useState('')
+    const [isExporting, setIsExporting] = useState(false)
+    const [showFormatSelect, setShowFormatSelect] = useState(false)
+    const formatDropdownRef = useRef<HTMLDivElement>(null)
+
+    // 加载通讯录
+    const loadContacts = useCallback(async () => {
+        setIsLoading(true)
+        try {
+            const result = await window.electronAPI.chat.connect()
+            if (!result.success) {
+                console.error('连接失败:', result.error)
+                setIsLoading(false)
+                return
+            }
+            const contactsResult = await window.electronAPI.chat.getContacts()
+            console.log('📞 getContacts结果:', contactsResult)
+            if (contactsResult.success && contactsResult.contacts) {
+                console.log('📊 总联系人数:', contactsResult.contacts.length)
+                console.log('📊 按类型统计:', {
+                    friends: contactsResult.contacts.filter((c: ContactInfo) => c.type === 'friend').length,
+                    groups: contactsResult.contacts.filter((c: ContactInfo) => c.type === 'group').length,
+                    officials: contactsResult.contacts.filter((c: ContactInfo) => c.type === 'official').length,
+                    other: contactsResult.contacts.filter((c: ContactInfo) => c.type === 'other').length
+                })
+
+                // 获取头像URL
+                const usernames = contactsResult.contacts.map((c: ContactInfo) => c.username)
+                if (usernames.length > 0) {
+                    const avatarResult = await window.electronAPI.chat.enrichSessionsContactInfo(usernames)
+                    if (avatarResult.success && avatarResult.contacts) {
+                        contactsResult.contacts.forEach((contact: ContactInfo) => {
+                            const enriched = avatarResult.contacts?.[contact.username]
+                            if (enriched?.avatarUrl) {
+                                contact.avatarUrl = enriched.avatarUrl
+                            }
+                        })
+                    }
+                }
+
+                setContacts(contactsResult.contacts)
+                setFilteredContacts(contactsResult.contacts)
+            }
+        } catch (e) {
+            console.error('加载通讯录失败:', e)
+        } finally {
+            setIsLoading(false)
+        }
+    }, [])
+
+    useEffect(() => {
+        loadContacts()
+    }, [loadContacts])
+
+    // 搜索和类型过滤
+    useEffect(() => {
+        let filtered = contacts
+
+        // 类型过滤
+        filtered = filtered.filter(c => {
+            if (c.type === 'friend' && !contactTypes.friends) return false
+            if (c.type === 'group' && !contactTypes.groups) return false
+            if (c.type === 'official' && !contactTypes.officials) return false
+            return true
+        })
+
+        // 关键词过滤
+        if (searchKeyword.trim()) {
+            const lower = searchKeyword.toLowerCase()
+            filtered = filtered.filter(c =>
+                c.displayName?.toLowerCase().includes(lower) ||
+                c.remark?.toLowerCase().includes(lower) ||
+                c.username.toLowerCase().includes(lower)
+            )
+        }
+
+        setFilteredContacts(filtered)
+    }, [searchKeyword, contacts, contactTypes])
+
+    // 点击外部关闭下拉菜单
+    useEffect(() => {
+        const handleClickOutside = (event: MouseEvent) => {
+            const target = event.target as Node
+            if (showFormatSelect && formatDropdownRef.current && !formatDropdownRef.current.contains(target)) {
+                setShowFormatSelect(false)
+            }
+        }
+        document.addEventListener('mousedown', handleClickOutside)
+        return () => document.removeEventListener('mousedown', handleClickOutside)
+    }, [showFormatSelect])
+
+    const getAvatarLetter = (name: string) => {
+        if (!name) return '?'
+        return [...name][0] || '?'
+    }
+
+    const getContactTypeIcon = (type: string) => {
+        switch (type) {
+            case 'friend': return <User size={14} />
+            case 'group': return <Users size={14} />
+            case 'official': return <MessageSquare size={14} />
+            default: return <User size={14} />
+        }
+    }
+
+    const getContactTypeName = (type: string) => {
+        switch (type) {
+            case 'friend': return '好友'
+            case 'group': return '群聊'
+            case 'official': return '公众号'
+            default: return '其他'
+        }
+    }
+
+    // 选择导出文件夹
+    const selectExportFolder = async () => {
+        try {
+            const result = await window.electronAPI.dialog.openDirectory({
+                title: '选择导出位置'
+            })
+            if (result && !result.canceled && result.filePaths && result.filePaths.length > 0) {
+                setExportFolder(result.filePaths[0])
+            }
+        } catch (e) {
+            console.error('选择文件夹失败:', e)
+        }
+    }
+
+    // 开始导出
+    const startExport = async () => {
+        if (!exportFolder) {
+            alert('请先选择导出位置')
+            return
+        }
+
+        setIsExporting(true)
+        try {
+            const exportOptions = {
+                format: exportFormat,
+                exportAvatars,
+                contactTypes: {
+                    friends: contactTypes.friends,
+                    groups: contactTypes.groups,
+                    officials: contactTypes.officials
+                }
+            }
+
+            const result = await window.electronAPI.export.exportContacts(exportFolder, exportOptions)
+
+            if (result.success) {
+                alert(`导出成功！共导出 ${result.successCount} 个联系人`)
+            } else {
+                alert(`导出失败：${result.error}`)
+            }
+        } catch (e) {
+            console.error('导出失败:', e)
+            alert(`导出失败：${String(e)}`)
+        } finally {
+            setIsExporting(false)
+        }
+    }
+
+    const exportFormatOptions = [
+        { value: 'json', label: 'JSON', desc: '详细格式，包含完整联系人信息' },
+        { value: 'csv', label: 'CSV (Excel)', desc: '电子表格格式，适合Excel查看' },
+        { value: 'vcf', label: 'VCF (vCard)', desc: '标准名片格式，支持导入手机' }
+    ]
+
+    const getOptionLabel = (value: string) => {
+        return exportFormatOptions.find(opt => opt.value === value)?.label || value
+    }
+
+    return (
+        <div className="contacts-page">
+            {/* 左侧：联系人列表 */}
+            <div className="contacts-panel">
+                <div className="panel-header">
+                    <h2>通讯录</h2>
+                    <button className="icon-btn" onClick={loadContacts} disabled={isLoading}>
+                        <RefreshCw size={18} className={isLoading ? 'spin' : ''} />
+                    </button>
+                </div>
+
+                <div className="search-bar">
+                    <Search size={16} />
+                    <input
+                        type="text"
+                        placeholder="搜索联系人..."
+                        value={searchKeyword}
+                        onChange={e => setSearchKeyword(e.target.value)}
+                    />
+                    {searchKeyword && (
+                        <button className="clear-btn" onClick={() => setSearchKeyword('')}>
+                            <X size={14} />
+                        </button>
+                    )}
+                </div>
+
+                <div className="type-filters">
+                    <label className={`filter-chip ${contactTypes.friends ? 'active' : ''}`}>
+                        <input
+                            type="checkbox"
+                            checked={contactTypes.friends}
+                            onChange={e => setContactTypes({ ...contactTypes, friends: e.target.checked })}
+                        />
+                        <User size={16} />
+                        <span>好友</span>
+                    </label>
+                    <label className={`filter-chip ${contactTypes.groups ? 'active' : ''}`}>
+                        <input
+                            type="checkbox"
+                            checked={contactTypes.groups}
+                            onChange={e => setContactTypes({ ...contactTypes, groups: e.target.checked })}
+                        />
+                        <Users size={16} />
+                        <span>群聊</span>
+                    </label>
+                    <label className={`filter-chip ${contactTypes.officials ? 'active' : ''}`}>
+                        <input
+                            type="checkbox"
+                            checked={contactTypes.officials}
+                            onChange={e => setContactTypes({ ...contactTypes, officials: e.target.checked })}
+                        />
+                        <MessageSquare size={16} />
+                        <span>公众号</span>
+                    </label>
+                </div>
+
+                <div className="contacts-count">
+                    共 {filteredContacts.length} 个联系人
+                </div>
+
+                {isLoading ? (
+                    <div className="loading-state">
+                        <Loader2 size={32} className="spin" />
+                        <span>加载中...</span>
+                    </div>
+                ) : filteredContacts.length === 0 ? (
+                    <div className="empty-state">
+                        <span>暂无联系人</span>
+                    </div>
+                ) : (
+                    <div className="contacts-list">
+                        {filteredContacts.map(contact => (
+                            <div key={contact.username} className="contact-item">
+                                <div className="contact-avatar">
+                                    {contact.avatarUrl ? (
+                                        <img src={contact.avatarUrl} alt="" />
+                                    ) : (
+                                        <span>{getAvatarLetter(contact.displayName)}</span>
+                                    )}
+                                </div>
+                                <div className="contact-info">
+                                    <div className="contact-name">{contact.displayName}</div>
+                                    {contact.remark && contact.remark !== contact.displayName && (
+                                        <div className="contact-remark">备注: {contact.remark}</div>
+                                    )}
+                                </div>
+                                <div className={`contact-type ${contact.type}`}>
+                                    {getContactTypeIcon(contact.type)}
+                                    <span>{getContactTypeName(contact.type)}</span>
+                                </div>
+                            </div>
+                        ))}
+                    </div>
+                )}
+            </div>
+
+            {/* 右侧：导出设置 */}
+            <div className="settings-panel">
+                <div className="panel-header">
+                    <h2>导出设置</h2>
+                </div>
+
+                <div className="settings-content">
+                    <div className="setting-section">
+                        <h3>导出格式</h3>
+                        <div className="format-select" ref={formatDropdownRef}>
+                            <button
+                                type="button"
+                                className={`select-trigger ${showFormatSelect ? 'open' : ''}`}
+                                onClick={() => setShowFormatSelect(!showFormatSelect)}
+                            >
+                                <span className="select-value">{getOptionLabel(exportFormat)}</span>
+                                <ChevronDown size={16} />
+                            </button>
+                            {showFormatSelect && (
+                                <div className="select-dropdown">
+                                    {exportFormatOptions.map(option => (
+                                        <button
+                                            key={option.value}
+                                            type="button"
+                                            className={`select-option ${exportFormat === option.value ? 'active' : ''}`}
+                                            onClick={() => {
+                                                setExportFormat(option.value as 'json' | 'csv' | 'vcf')
+                                                setShowFormatSelect(false)
+                                            }}
+                                        >
+                                            <span className="option-label">{option.label}</span>
+                                            <span className="option-desc">{option.desc}</span>
+                                        </button>
+                                    ))}
+                                </div>
+                            )}
+                        </div>
+                    </div>
+
+                    <div className="setting-section">
+                        <h3>导出选项</h3>
+                        <label className="checkbox-item">
+                            <input
+                                type="checkbox"
+                                checked={exportAvatars}
+                                onChange={e => setExportAvatars(e.target.checked)}
+                            />
+                            <span>导出头像</span>
+                        </label>
+                    </div>
+
+                    <div className="setting-section">
+                        <h3>导出位置</h3>
+                        <div className="export-path-display">
+                            <FolderOpen size={16} />
+                            <span>{exportFolder || '未设置'}</span>
+                        </div>
+                        <button className="select-folder-btn" onClick={selectExportFolder}>
+                            <FolderOpen size={16} />
+                            <span>选择导出目录</span>
+                        </button>
+                    </div>
+                </div>
+
+                <div className="export-action">
+                    <button
+                        className="export-btn"
+                        onClick={startExport}
+                        disabled={!exportFolder || isExporting}
+                    >
+                        {isExporting ? (
+                            <>
+                                <Loader2 size={18} className="spin" />
+                                <span>导出中...</span>
+                            </>
+                        ) : (
+                            <>
+                                <Download size={18} />
+                                <span>开始导出</span>
+                            </>
+                        )}
+                    </button>
+                </div>
+            </div>
+        </div>
+    )
+}
+
+export default ContactsPage

src/pages/DataManagementPage.scss

@@ -1,569 +0,0 @@
-.page-header {
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  margin-bottom: 24px;
-  
-  h1 {
-    font-size: 24px;
-    font-weight: 600;
-    color: var(--text-primary);
-    margin: 0;
-  }
-
-  .header-tabs {
-    display: flex;
-    gap: 8px;
-
-    .tab-btn {
-      display: flex;
-      align-items: center;
-      gap: 6px;
-      padding: 8px 16px;
-      border: none;
-      background: var(--bg-tertiary);
-      color: var(--text-secondary);
-      font-size: 14px;
-      cursor: pointer;
-      border-radius: 9999px;
-      transition: all 0.2s;
-
-      &:hover {
-        background: var(--border-color);
-        color: var(--text-primary);
-      }
-
-      &.active {
-        background: var(--primary);
-        color: white;
-      }
-    }
-  }
-}
-
-.page-scroll {
-  display: flex;
-  flex-direction: column;
-  gap: 24px;
-}
-
-.page-section {
-  background: var(--bg-secondary);
-  border-radius: 16px;
-  padding: 20px 24px;
-  
-  h2 {
-    font-size: 16px;
-    font-weight: 600;
-    color: var(--text-primary);
-    margin: 0 0 4px;
-  }
-  
-  .section-desc {
-    font-size: 13px;
-    color: var(--text-tertiary);
-    margin: 0;
-  }
-
-  .section-header {
-    display: flex;
-    justify-content: space-between;
-    align-items: flex-start;
-    margin-bottom: 20px;
-
-    .section-actions {
-      display: flex;
-      gap: 10px;
-    }
-  }
-}
-
-.btn {
-  display: flex;
-  align-items: center;
-  gap: 6px;
-  padding: 8px 16px;
-  border: none;
-  border-radius: 9999px;
-  font-size: 14px;
-  font-weight: 500;
-  cursor: pointer;
-  transition: all 0.2s;
-  
-  &:disabled {
-    opacity: 0.6;
-    cursor: not-allowed;
-  }
-
-  .spin {
-    animation: spin 1s linear infinite;
-  }
-}
-
-.btn-primary {
-  background: var(--primary);
-  color: white;
-  
-  &:hover:not(:disabled) {
-    background: var(--primary-hover);
-  }
-}
-
-.btn-secondary {
-  background: var(--bg-tertiary);
-  color: var(--text-primary);
-  
-  &:hover:not(:disabled) {
-    background: var(--border-color);
-  }
-}
-
-.btn-warning {
-  background: #f59e0b;
-  color: white;
-  
-  &:hover:not(:disabled) {
-    background: #d97706;
-  }
-}
-
-.database-list {
-  display: flex;
-  flex-direction: column;
-  gap: 8px;
-}
-
-.database-item {
-  display: flex;
-  align-items: center;
-  gap: 12px;
-  padding: 12px 16px;
-  background: var(--bg-primary);
-  border-radius: 12px;
-  transition: all 0.2s;
-
-  &:hover {
-    background: var(--bg-tertiary);
-  }
-
-  .status-icon {
-    width: 28px;
-    height: 28px;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    border-radius: 50%;
-
-    &.decrypted {
-      background: var(--primary);
-      color: white;
-    }
-
-    &.needs-update {
-      background: #f59e0b;
-      color: white;
-    }
-
-    &.pending {
-      background: var(--bg-tertiary);
-      color: var(--text-tertiary);
-    }
-  }
-
-  .db-info {
-    flex: 1;
-    min-width: 0;
-
-    .db-name {
-      font-size: 14px;
-      font-weight: 500;
-      color: var(--text-primary);
-      margin-bottom: 2px;
-      white-space: nowrap;
-      overflow: hidden;
-      text-overflow: ellipsis;
-    }
-
-    .db-meta {
-      display: flex;
-      gap: 6px;
-      font-size: 12px;
-      color: var(--text-tertiary);
-    }
-  }
-
-  .db-status {
-    padding: 4px 10px;
-    border-radius: 9999px;
-    font-size: 12px;
-    font-weight: 500;
-    flex-shrink: 0;
-
-    &.decrypted {
-      background: rgba(34, 197, 94, 0.15);
-      color: #16a34a;
-    }
-
-    &.needs-update {
-      background: rgba(245, 158, 11, 0.15);
-      color: #b45309;
-    }
-
-    &.pending {
-      background: rgba(234, 179, 8, 0.15);
-      color: #b45309;
-    }
-  }
-}
-
-.empty-state {
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  justify-content: center;
-  padding: 48px 20px;
-  color: var(--text-tertiary);
-
-  svg {
-    margin-bottom: 16px;
-    opacity: 0.5;
-  }
-
-  p {
-    margin: 0;
-    font-size: 14px;
-
-    &.hint {
-      margin-top: 6px;
-      font-size: 13px;
-      opacity: 0.7;
-    }
-  }
-}
-
-.unavailable-state {
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  justify-content: center;
-  padding: 64px 20px;
-  color: var(--text-tertiary);
-
-  svg {
-    margin-bottom: 20px;
-    opacity: 0.4;
-  }
-
-  p {
-    margin: 0;
-    font-size: 15px;
-    color: var(--text-secondary);
-
-    &.hint {
-      margin-top: 8px;
-      font-size: 13px;
-      color: var(--text-tertiary);
-    }
-  }
-}
-
-.message-toast {
-  position: fixed;
-  top: 60px;
-  left: 50%;
-  transform: translateX(-50%);
-  padding: 10px 24px;
-  border-radius: 9999px;
-  font-size: 14px;
-  z-index: 100;
-  animation: slideDown 0.3s ease;
-  
-  &.success {
-    background: var(--primary);
-    color: white;
-  }
-  
-  &.error {
-    background: var(--danger);
-    color: white;
-  }
-}
-
-@keyframes slideDown {
-  from {
-    opacity: 0;
-    transform: translateX(-50%) translateY(-10px);
-  }
-  to {
-    opacity: 1;
-    transform: translateX(-50%) translateY(0);
-  }
-}
-
-@keyframes spin {
-  from {
-    transform: rotate(0deg);
-  }
-  to {
-    transform: rotate(360deg);
-  }
-}
-
-
-.decrypt-progress-overlay {
-  position: fixed;
-  top: 0;
-  left: 0;
-  right: 0;
-  bottom: 0;
-  background: rgba(0, 0, 0, 0.5);
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  z-index: 1000;
-
-  .progress-card {
-    background: var(--bg-primary);
-    border-radius: 16px;
-    padding: 32px 40px;
-    min-width: 400px;
-    text-align: center;
-    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.2);
-
-    h3 {
-      margin: 0 0 8px;
-      font-size: 18px;
-      font-weight: 600;
-      color: var(--text-primary);
-    }
-
-    .progress-file {
-      margin: 0 0 20px;
-      font-size: 14px;
-      color: var(--text-secondary);
-      white-space: nowrap;
-      overflow: hidden;
-      text-overflow: ellipsis;
-    }
-
-    .progress-bar {
-      height: 8px;
-      background: var(--bg-tertiary);
-      border-radius: 9999px;
-      overflow: hidden;
-      margin-bottom: 12px;
-
-      .progress-fill {
-        height: 100%;
-        background: var(--primary);
-        border-radius: 9999px;
-        transition: width 0.2s ease;
-      }
-    }
-
-    .progress-text {
-      margin: 0;
-      font-size: 13px;
-      color: var(--text-tertiary);
-    }
-  }
-}
-
-
-// 图片列表样式
-.current-dir {
-  display: flex;
-  align-items: center;
-  gap: 8px;
-  padding: 10px 14px;
-  background: var(--bg-tertiary);
-  border-radius: 8px;
-  margin-bottom: 16px;
-  font-size: 13px;
-
-  .dir-label {
-    color: var(--text-tertiary);
-    flex-shrink: 0;
-  }
-
-  .dir-path {
-    color: var(--text-primary);
-    white-space: nowrap;
-    overflow: hidden;
-    text-overflow: ellipsis;
-  }
-}
-
-.image-list {
-  display: grid;
-  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
-  gap: 8px;
-  max-height: 500px;
-  overflow-y: auto;
-  padding-right: 4px;
-
-  &::-webkit-scrollbar {
-    width: 6px;
-  }
-
-  &::-webkit-scrollbar-track {
-    background: var(--bg-tertiary);
-    border-radius: 3px;
-  }
-
-  &::-webkit-scrollbar-thumb {
-    background: var(--border-color);
-    border-radius: 3px;
-
-    &:hover {
-      background: var(--text-tertiary);
-    }
-  }
-}
-
-.image-item {
-  display: flex;
-  align-items: center;
-  gap: 10px;
-  padding: 10px 14px;
-  background: var(--bg-primary);
-  border-radius: 10px;
-  transition: all 0.2s;
-
-  &:hover {
-    background: var(--bg-tertiary);
-  }
-
-  &.clickable {
-    cursor: pointer;
-
-    &:hover {
-      background: var(--bg-tertiary);
-      
-      .decrypt-hint {
-        opacity: 1;
-      }
-    }
-  }
-
-  .status-icon {
-    width: 24px;
-    height: 24px;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    border-radius: 50%;
-    flex-shrink: 0;
-
-    &.decrypted {
-      background: var(--primary);
-      color: white;
-    }
-
-    &.pending {
-      background: var(--bg-tertiary);
-      color: var(--text-tertiary);
-    }
-
-    .spin {
-      animation: spin 1s linear infinite;
-    }
-  }
-
-  .img-info {
-    flex: 1;
-    min-width: 0;
-    display: flex;
-    align-items: center;
-    justify-content: space-between;
-    gap: 8px;
-
-    .img-name {
-      font-size: 13px;
-      color: var(--text-primary);
-      white-space: nowrap;
-      overflow: hidden;
-      text-overflow: ellipsis;
-    }
-
-    .img-meta {
-      display: flex;
-      align-items: center;
-      gap: 8px;
-      flex-shrink: 0;
-    }
-
-    .version-tag {
-      font-size: 10px;
-      padding: 2px 6px;
-      border-radius: 4px;
-      font-weight: 500;
-
-      &.v3 {
-        background: rgba(59, 130, 246, 0.15);
-        color: #3b82f6;
-      }
-
-      &.v4 {
-        background: rgba(168, 85, 247, 0.15);
-        color: #a855f7;
-      }
-    }
-
-    .img-size {
-      font-size: 12px;
-      color: var(--text-tertiary);
-      flex-shrink: 0;
-    }
-  }
-
-  .decrypt-hint {
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    width: 20px;
-    height: 20px;
-    color: var(--text-tertiary);
-    opacity: 0;
-    transition: opacity 0.2s;
-  }
-}
-
-.more-hint {
-  grid-column: 1 / -1;
-  text-align: center;
-  padding: 16px;
-  font-size: 13px;
-  color: var(--text-tertiary);
-}
-
-
-// 账号选择器
-.account-selector {
-  display: flex;
-  gap: 8px;
-  margin-bottom: 12px;
-  flex-wrap: wrap;
-
-  .account-btn {
-    padding: 6px 14px;
-    border: 1px solid var(--border-color);
-    background: var(--bg-primary);
-    color: var(--text-secondary);
-    font-size: 13px;
-    border-radius: 9999px;
-    cursor: pointer;
-    transition: all 0.2s;
-
-    &:hover {
-      border-color: var(--primary);
-      color: var(--primary);
-    }
-
-    &.active {
-      background: var(--primary);
-      border-color: var(--primary);
-      color: white;
-    }
-  }
-}

src/pages/DataManagementPage.tsx

@@ -1,62 +0,0 @@
-import { useEffect, useState } from 'react'
-import * as configService from '../services/config'
-import './DataManagementPage.scss'
-
-function DataManagementPage() {
-  const [dbPath, setDbPath] = useState<string | null>(null)
-  const [wxid, setWxid] = useState<string | null>(null)
-
-  useEffect(() => {
-    const loadConfig = async () => {
-      const [path, id] = await Promise.all([
-        configService.getDbPath(),
-        configService.getMyWxid()
-      ])
-      setDbPath(path)
-      setWxid(id)
-    }
-    loadConfig()
-  }, [])
-
-  return (
-    <>
-      <div className="page-header">
-        <h1>数据管理</h1>
-      </div>
-
-      <div className="page-scroll">
-        <section className="page-section">
-          <div className="section-header">
-            <div>
-              <h2>WCDB 直连模式</h2>
-              <p className="section-desc">
-                当前版本通过 WCDB DLL 直接读取加密数据库，不再需要解密流程。
-              </p>
-            </div>
-          </div>
-
-          <div className="database-list">
-            <div className="database-item decrypted">
-              <div className="db-info">
-                <div className="db-name">
-                  数据库目录
-                </div>
-                <div className="db-path">{dbPath || '未配置'}</div>
-              </div>
-            </div>
-            <div className="database-item decrypted">
-              <div className="db-info">
-                <div className="db-name">
-                  微信ID
-                </div>
-                <div className="db-path">{wxid || '未配置'}</div>
-              </div>
-            </div>
-          </div>
-        </section>
-      </div>
-    </>
-  )
-}
-
-export default DataManagementPage

src/pages/ExportPage.scss

@@ -338,64 +338,129 @@
     }
   }
 
-  .time-options {
+  .time-range-picker-item {
-    display: flex;
-    flex-direction: column;
-    gap: 12px;
-  }
-
-  .checkbox-item {
     display: flex;
     align-items: center;
-    gap: 10px;
+    justify-content: space-between;
+    padding: 14px 16px;
     cursor: pointer;
-    font-size: 14px;
+    transition: background 0.2s;
-    color: var(--text-primary);
+    background: transparent;
-
-    input[type="checkbox"] {
-      width: 18px;
-      height: 18px;
-      accent-color: var(--primary);
-      cursor: pointer;
-    }
-
-    svg {
-      color: var(--text-secondary);
-    }
-
-    &.main-toggle {
-      padding: 12px 16px;
-      background: var(--bg-secondary);
-      border-radius: 10px;
-    }
-  }
-
-  .date-range {
-    display: flex;
-    align-items: center;
-    gap: 10px;
-    padding: 12px 16px;
-    background: var(--bg-secondary);
-    border-radius: 10px;
-    font-size: 14px;
-    color: var(--text-primary);
-    cursor: pointer;
-    transition: all 0.2s;
 
     &:hover {
       background: var(--bg-hover);
     }
 
-    svg {
+    .time-picker-info {
-      color: var(--text-tertiary);
+      display: flex;
-      flex-shrink: 0;
+      align-items: center;
+      gap: 10px;
+      font-size: 14px;
+      color: var(--text-primary);
+
+      svg {
+        color: var(--primary);
+      }
     }
 
-    span {
+    svg {
-      flex: 1;
+      color: var(--text-tertiary);
     }
   }
 
+  .select-field {
+    position: relative;
+  }
+
+  .select-trigger {
+    width: 100%;
+    padding: 10px 16px;
+    border: 1px solid var(--border-color);
+    border-radius: 9999px;
+    font-size: 14px;
+    background: var(--bg-primary);
+    color: var(--text-primary);
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    gap: 8px;
+    cursor: pointer;
+    transition: all 0.2s;
+
+    &:hover {
+      border-color: var(--text-tertiary);
+    }
+
+    &.open {
+      border-color: var(--primary);
+      box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary) 15%, transparent);
+    }
+  }
+
+  .select-value {
+    flex: 1;
+    min-width: 0;
+    text-align: left;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+  }
+
+  .select-dropdown {
+    position: absolute;
+    top: calc(100% + 6px);
+    left: 0;
+    right: 0;
+    background: color-mix(in srgb, var(--bg-primary) 85%, var(--bg-secondary));
+    border: 1px solid var(--border-color);
+    border-radius: 12px;
+    padding: 6px;
+    box-shadow: var(--shadow-md);
+    z-index: 20;
+    max-height: 260px;
+    overflow-y: auto;
+    backdrop-filter: blur(14px);
+    -webkit-backdrop-filter: blur(14px);
+  }
+
+  .select-option {
+    width: 100%;
+    text-align: left;
+    display: flex;
+    flex-direction: column;
+    gap: 4px;
+    padding: 10px 12px;
+    border: none;
+    border-radius: 10px;
+    background: transparent;
+    cursor: pointer;
+    transition: all 0.15s;
+    color: var(--text-primary);
+    font-size: 14px;
+
+    &:hover {
+      background: var(--bg-tertiary);
+    }
+
+    &.active {
+      background: color-mix(in srgb, var(--primary) 12%, transparent);
+      color: var(--primary);
+    }
+  }
+
+  .option-label {
+    font-weight: 500;
+  }
+
+  .option-desc {
+    font-size: 12px;
+    color: var(--text-tertiary);
+  }
+
+  .select-option.active .option-desc {
+    color: var(--primary);
+  }
+
   .media-options {
     display: flex;
     flex-wrap: wrap;
@@ -463,6 +528,43 @@
     margin: 8px 0 0;
   }
 
+  .select-folder-btn {
+    width: 100%;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    gap: 8px;
+    padding: 10px 16px;
+    margin-top: 12px;
+    background: var(--bg-secondary);
+    border: 1px solid var(--border-color);
+    border-radius: 8px;
+    font-size: 13px;
+    font-weight: 500;
+    color: var(--text-primary);
+    cursor: pointer;
+    transition: all 0.2s;
+
+    &:hover {
+      background: var(--bg-hover);
+      border-color: var(--primary);
+      color: var(--primary);
+
+      svg {
+        color: var(--primary);
+      }
+    }
+
+    &:active {
+      transform: scale(0.98);
+    }
+
+    svg {
+      color: var(--text-secondary);
+      transition: color 0.2s;
+    }
+  }
+
   .export-action {
     padding: 20px 24px;
     border-top: 1px solid var(--border-color);
@@ -565,6 +667,87 @@
     }
   }
 
+  .export-layout-modal {
+    background: var(--card-bg);
+    padding: 28px 32px;
+    border-radius: 16px;
+    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.25);
+    text-align: center;
+    width: min(520px, 90vw);
+
+    h3 {
+      font-size: 18px;
+      font-weight: 600;
+      color: var(--text-primary);
+      margin: 0 0 8px;
+    }
+
+    .layout-subtitle {
+      font-size: 14px;
+      color: var(--text-secondary);
+      margin: 0 0 20px;
+    }
+
+    .layout-options {
+      display: grid;
+      gap: 12px;
+    }
+
+    .layout-option-btn {
+      display: flex;
+      flex-direction: column;
+      gap: 6px;
+      padding: 14px 18px;
+      border-radius: 12px;
+      border: 1px solid var(--border-color);
+      background: var(--bg-secondary);
+      text-align: left;
+      cursor: pointer;
+      transition: all 0.2s;
+
+      &:hover {
+        border-color: var(--primary);
+        background: rgba(var(--primary-rgb), 0.08);
+      }
+
+      &.primary {
+        border-color: var(--primary);
+        background: rgba(var(--primary-rgb), 0.12);
+      }
+
+      .layout-title {
+        font-size: 15px;
+        font-weight: 600;
+        color: var(--text-primary);
+      }
+
+      .layout-desc {
+        font-size: 12px;
+        color: var(--text-tertiary);
+      }
+    }
+
+    .layout-actions {
+      margin-top: 18px;
+      display: flex;
+      justify-content: center;
+    }
+
+    .layout-cancel-btn {
+      padding: 8px 20px;
+      border-radius: 8px;
+      border: 1px solid var(--border-color);
+      background: var(--bg-secondary);
+      color: var(--text-primary);
+      cursor: pointer;
+      transition: all 0.2s;
+
+      &:hover {
+        background: var(--bg-hover);
+      }
+    }
+  }
+
   .export-result-modal {
     background: var(--card-bg);
     padding: 32px 40px;
@@ -882,4 +1065,95 @@
   to {
     transform: rotate(360deg);
   }
-}
+}
+
+// 媒体导出选项卡片样式
+.setting-subtitle {
+  font-size: 12px;
+  color: var(--text-tertiary);
+  margin: 4px 0 12px 0;
+}
+
+.media-options-card {
+  background: var(--card-bg);
+  border: 1px solid var(--border-color);
+  border-radius: 12px;
+  overflow: hidden;
+}
+
+.media-switch-row {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 14px 16px;
+}
+
+.media-switch-info {
+  display: flex;
+  flex-direction: column;
+  gap: 2px;
+}
+
+.media-switch-title {
+  font-size: 14px;
+  font-weight: 500;
+  color: var(--text-primary);
+}
+
+.media-switch-desc {
+  font-size: 11px;
+  color: var(--text-tertiary);
+}
+
+.media-option-divider {
+  height: 1px;
+  background: var(--border-color);
+  margin-left: 16px;
+}
+
+.media-checkbox-row {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 12px 16px;
+  cursor: pointer;
+  transition: background 0.2s;
+
+  &:hover:not(.disabled) {
+    background: var(--bg-hover);
+  }
+
+  &.disabled {
+    opacity: 0.5;
+    cursor: not-allowed;
+  }
+
+  input[type="checkbox"] {
+    width: 18px;
+    height: 18px;
+    accent-color: var(--primary);
+    cursor: pointer;
+
+    &:disabled {
+      cursor: not-allowed;
+    }
+  }
+}
+
+.media-checkbox-info {
+  display: flex;
+  flex-direction: column;
+  gap: 2px;
+}
+
+.media-checkbox-title {
+  font-size: 14px;
+  color: var(--text-primary);
+}
+
+.media-checkbox-desc {
+  font-size: 11px;
+  color: var(--text-tertiary);
+}
+
+// 全局样式已在 main.scss 中定义

src/pages/ExportPage.tsx

@@ -1,4 +1,4 @@
-import { useState, useEffect, useCallback } from 'react'
+import { useState, useEffect, useCallback, useRef } from 'react'
 import { Search, Download, FolderOpen, RefreshCw, Check, Calendar, FileJson, FileText, Table, Loader2, X, ChevronDown, ChevronLeft, ChevronRight, FileSpreadsheet, Database, FileCode, CheckCircle, XCircle, ExternalLink } from 'lucide-react'
 import * as configService from '../services/config'
 import './ExportPage.scss'
@@ -16,6 +16,16 @@ interface ExportOptions {
   dateRange: { start: Date; end: Date } | null
   useAllTime: boolean
   exportAvatars: boolean
+  exportMedia: boolean
+  exportImages: boolean
+  exportVoices: boolean
+  exportVideos: boolean
+  exportEmojis: boolean
+  exportVoiceAsText: boolean
+  excelCompactColumns: boolean
+  txtColumns: string[]
+  displayNamePreference: 'group-nickname' | 'remark' | 'nickname'
+  exportConcurrency: number
 }
 
 interface ExportResult {
@@ -25,7 +35,10 @@ interface ExportResult {
   error?: string
 }
 
+type SessionLayout = 'shared' | 'per-session'
+
 function ExportPage() {
+  const defaultTxtColumns = ['index', 'time', 'senderRole', 'messageType', 'content']
   const [sessions, setSessions] = useState<ChatSession[]>([])
   const [filteredSessions, setFilteredSessions] = useState<ChatSession[]>([])
   const [selectedSessions, setSelectedSessions] = useState<Set<string>>(new Set())
@@ -38,17 +51,49 @@ function ExportPage() {
   const [showDatePicker, setShowDatePicker] = useState(false)
   const [calendarDate, setCalendarDate] = useState(new Date())
   const [selectingStart, setSelectingStart] = useState(true)
+  const [showMediaLayoutPrompt, setShowMediaLayoutPrompt] = useState(false)
+  const [showDisplayNameSelect, setShowDisplayNameSelect] = useState(false)
+  const displayNameDropdownRef = useRef<HTMLDivElement>(null)
 
   const [options, setOptions] = useState<ExportOptions>({
-    format: 'chatlab',
+    format: 'excel',
     dateRange: {
-      start: new Date(Date.now() - 7 * 24 * 60 * 60 * 1000),
+      start: new Date(new Date().setHours(0, 0, 0, 0)),
       end: new Date()
     },
-    useAllTime: true,
+    useAllTime: false,
-    exportAvatars: true
+    exportAvatars: true,
+    exportMedia: false,
+    exportImages: true,
+    exportVoices: true,
+    exportVideos: true,
+    exportEmojis: true,
+    exportVoiceAsText: true,
+    excelCompactColumns: true,
+    txtColumns: defaultTxtColumns,
+    displayNamePreference: 'remark',
+    exportConcurrency: 2
   })
 
+  const buildDateRangeFromPreset = (preset: string) => {
+    const now = new Date()
+    if (preset === 'all') {
+      return { useAllTime: true, dateRange: { start: now, end: now } }
+    }
+    let rangeMs = 0
+    if (preset === '7d') rangeMs = 7 * 24 * 60 * 60 * 1000
+    if (preset === '30d') rangeMs = 30 * 24 * 60 * 60 * 1000
+    if (preset === '90d') rangeMs = 90 * 24 * 60 * 60 * 1000
+    if (preset === 'today' || rangeMs === 0) {
+      const start = new Date(now)
+      start.setHours(0, 0, 0, 0)
+      return { useAllTime: false, dateRange: { start, end: now } }
+    }
+    const start = new Date(now.getTime() - rangeMs)
+    start.setHours(0, 0, 0, 0)
+    return { useAllTime: false, dateRange: { start, end: now } }
+  }
+
   const loadSessions = useCallback(async () => {
     setIsLoading(true)
     try {
@@ -84,10 +129,87 @@ function ExportPage() {
     }
   }, [])
 
+  const loadExportDefaults = useCallback(async () => {
+    try {
+      const [
+        savedFormat,
+        savedRange,
+        savedMedia,
+        savedVoiceAsText,
+        savedExcelCompactColumns,
+        savedTxtColumns,
+        savedConcurrency
+      ] = await Promise.all([
+        configService.getExportDefaultFormat(),
+        configService.getExportDefaultDateRange(),
+        configService.getExportDefaultMedia(),
+        configService.getExportDefaultVoiceAsText(),
+        configService.getExportDefaultExcelCompactColumns(),
+        configService.getExportDefaultTxtColumns(),
+        configService.getExportDefaultConcurrency()
+      ])
+
+      const preset = savedRange || 'today'
+      const rangeDefaults = buildDateRangeFromPreset(preset)
+      const txtColumns = savedTxtColumns && savedTxtColumns.length > 0 ? savedTxtColumns : defaultTxtColumns
+
+      setOptions((prev) => ({
+        ...prev,
+        format: (savedFormat as ExportOptions['format']) || 'excel',
+        useAllTime: rangeDefaults.useAllTime,
+        dateRange: rangeDefaults.dateRange,
+        exportMedia: savedMedia ?? false,
+        exportVoiceAsText: savedVoiceAsText ?? true,
+        excelCompactColumns: savedExcelCompactColumns ?? true,
+        txtColumns,
+        exportConcurrency: savedConcurrency ?? 2
+      }))
+    } catch (e) {
+      console.error('加载导出默认设置失败:', e)
+    }
+  }, [])
+
   useEffect(() => {
     loadSessions()
     loadExportPath()
-  }, [loadSessions, loadExportPath])
+    loadExportDefaults()
+  }, [loadSessions, loadExportPath, loadExportDefaults])
+
+  useEffect(() => {
+    const handleChange = () => {
+      setSelectedSessions(new Set())
+      setSearchKeyword('')
+      setExportResult(null)
+      setSessions([])
+      setFilteredSessions([])
+      loadSessions()
+    }
+    window.addEventListener('wxid-changed', handleChange as EventListener)
+    return () => window.removeEventListener('wxid-changed', handleChange as EventListener)
+  }, [loadSessions])
+
+  useEffect(() => {
+    const removeListener = window.electronAPI.export.onProgress?.((payload: { current: number; total: number; currentSession: string; phase: string }) => {
+      setExportProgress({
+        current: payload.current,
+        total: payload.total,
+        currentName: payload.currentSession
+      })
+    })
+    return () => {
+      removeListener?.()
+    }
+  }, [])
+  useEffect(() => {
+    const handleClickOutside = (event: MouseEvent) => {
+      const target = event.target as Node
+      if (showDisplayNameSelect && displayNameDropdownRef.current && !displayNameDropdownRef.current.contains(target)) {
+        setShowDisplayNameSelect(false)
+      }
+    }
+    document.addEventListener('mousedown', handleClickOutside)
+    return () => document.removeEventListener('mousedown', handleClickOutside)
+  }, [showDisplayNameSelect])
 
   useEffect(() => {
     if (!searchKeyword.trim()) {
@@ -128,13 +250,31 @@ function ExportPage() {
     return date.toLocaleDateString('zh-CN', { year: 'numeric', month: '2-digit', day: '2-digit' })
   }
 
+  const handleFormatChange = (format: ExportOptions['format']) => {
+    setOptions((prev) => {
+      const next = { ...prev, format }
+      if (format === 'html') {
+        return {
+          ...next,
+          exportMedia: true,
+          exportImages: true,
+          exportVoices: true,
+          exportVideos: true,
+          exportEmojis: true,
+          exportVoiceAsText: true
+        }
+      }
+      return next
+    })
+  }
+
   const openExportFolder = async () => {
     if (exportFolder) {
       await window.electronAPI.shell.openPath(exportFolder)
     }
   }
 
-  const startExport = async () => {
+  const runExport = async (sessionLayout: SessionLayout) => {
     if (selectedSessions.size === 0 || !exportFolder) return
 
     setIsExporting(true)
@@ -146,14 +286,25 @@ function ExportPage() {
       const exportOptions = {
         format: options.format,
         exportAvatars: options.exportAvatars,
+        exportMedia: options.exportMedia,
+        exportImages: options.exportMedia && options.exportImages,
+        exportVoices: options.exportMedia && options.exportVoices,
+        exportVideos: options.exportMedia && options.exportVideos,
+        exportEmojis: options.exportMedia && options.exportEmojis,
+        exportVoiceAsText: options.exportVoiceAsText,  // 即使不导出媒体，也可以导出语音转文字内容
+        excelCompactColumns: options.excelCompactColumns,
+        txtColumns: options.txtColumns,
+        displayNamePreference: options.displayNamePreference,
+        exportConcurrency: options.exportConcurrency,
+        sessionLayout,
         dateRange: options.useAllTime ? null : options.dateRange ? {
           start: Math.floor(options.dateRange.start.getTime() / 1000),
-          // 将结束日期设置为当天的 23:59:59,以包含当天的所有消息
+          // 将结束日期设置为当天的 23:59:59，确保包含当天的所有记录
           end: Math.floor(new Date(options.dateRange.end.getFullYear(), options.dateRange.end.getMonth(), options.dateRange.end.getDate(), 23, 59, 59).getTime() / 1000)
         } : null
       }
 
-      if (options.format === 'chatlab' || options.format === 'chatlab-jsonl' || options.format === 'json') {
+      if (options.format === 'chatlab' || options.format === 'chatlab-jsonl' || options.format === 'json' || options.format === 'excel' || options.format === 'txt' || options.format === 'html') {
         const result = await window.electronAPI.export.exportSessions(
           sessionList,
           exportFolder,
@@ -161,16 +312,28 @@ function ExportPage() {
         )
         setExportResult(result)
       } else {
-        setExportResult({ success: false, error: `${options.format.toUpperCase()} 格式导出功能开发中...` })
+        setExportResult({ success: false, error: `${options.format.toUpperCase()} 格式目前暂未实现，请选择其他格式。` })
       }
     } catch (e) {
-      console.error('导出失败:', e)
+      console.error('导出过程中发生异常:', e)
       setExportResult({ success: false, error: String(e) })
     } finally {
       setIsExporting(false)
     }
   }
 
+  const startExport = () => {
+    if (selectedSessions.size === 0 || !exportFolder) return
+
+    if (options.exportMedia && selectedSessions.size > 1) {
+      setShowMediaLayoutPrompt(true)
+      return
+    }
+
+    const layout: SessionLayout = options.exportMedia ? 'per-session' : 'shared'
+    runExport(layout)
+  }
+
   const getDaysInMonth = (date: Date) => {
     const year = date.getFullYear()
     const month = date.getMonth()
@@ -203,18 +366,54 @@ function ExportPage() {
     const year = calendarDate.getFullYear()
     const month = calendarDate.getMonth()
     const selectedDate = new Date(year, month, day)
+    // 设置时间为当天的开始或结束
+    selectedDate.setHours(selectingStart ? 0 : 23, selectingStart ? 0 : 59, selectingStart ? 0 : 59, selectingStart ? 0 : 999)
+
+    const now = new Date()
+    // 如果选择的日期晚于当前时间，限制为当前时间
+    if (selectedDate > now) {
+      selectedDate.setTime(now.getTime())
+    }
 
     if (selectingStart) {
-      setOptions({
+      // 选择开始日期
-        ...options,
+      const currentEnd = options.dateRange?.end || new Date()
-        dateRange: options.dateRange ? { ...options.dateRange, start: selectedDate } : { start: selectedDate, end: new Date() }
+      // 如果选择的开始日期晚于结束日期，则同时更新结束日期
-      })
+      if (selectedDate > currentEnd) {
+        const newEnd = new Date(selectedDate)
+        newEnd.setHours(23, 59, 59, 999)
+        // 确保结束日期也不晚于当前时间
+        if (newEnd > now) {
+          newEnd.setTime(now.getTime())
+        }
+        setOptions({
+          ...options,
+          dateRange: { start: selectedDate, end: newEnd }
+        })
+      } else {
+        setOptions({
+          ...options,
+          dateRange: options.dateRange ? { ...options.dateRange, start: selectedDate } : { start: selectedDate, end: new Date() }
+        })
+      }
       setSelectingStart(false)
     } else {
-      setOptions({
+      // 选择结束日期
-        ...options,
+      const currentStart = options.dateRange?.start || new Date(Date.now() - 7 * 24 * 60 * 60 * 1000)
-        dateRange: options.dateRange ? { ...options.dateRange, end: selectedDate } : { start: new Date(), end: selectedDate }
+      // 如果选择的结束日期早于开始日期，则同时更新开始日期
-      })
+      if (selectedDate < currentStart) {
+        const newStart = new Date(selectedDate)
+        newStart.setHours(0, 0, 0, 0)
+        setOptions({
+          ...options,
+          dateRange: { start: newStart, end: selectedDate }
+        })
+      } else {
+        setOptions({
+          ...options,
+          dateRange: options.dateRange ? { ...options.dateRange, end: selectedDate } : { start: new Date(), end: selectedDate }
+        })
+      }
       setSelectingStart(true)
     }
   }
@@ -228,6 +427,25 @@ function ExportPage() {
     { value: 'excel', label: 'Excel', icon: FileSpreadsheet, desc: '电子表格，适合统计分析' },
     { value: 'sql', label: 'PostgreSQL', icon: Database, desc: '数据库脚本，便于导入到数据库' }
   ]
+  const displayNameOptions = [
+    {
+      value: 'group-nickname',
+      label: '群昵称优先',
+      desc: '仅群聊有效，私聊显示备注/昵称'
+    },
+    {
+      value: 'remark',
+      label: '备注优先',
+      desc: '有备注显示备注，否则显示昵称'
+    },
+    {
+      value: 'nickname',
+      label: '微信昵称',
+      desc: '始终显示微信昵称'
+    }
+  ]
+  const displayNameOption = displayNameOptions.find(option => option.value === options.displayNamePreference)
+  const displayNameLabel = displayNameOption?.label || '备注优先'
 
   return (
     <div className="export-page">
@@ -311,7 +529,7 @@ function ExportPage() {
                 <div
                   key={fmt.value}
                   className={`format-card ${options.format === fmt.value ? 'active' : ''}`}
-                  onClick={() => setOptions({ ...options, format: fmt.value as any })}
+                  onClick={() => handleFormatChange(fmt.value as ExportOptions['format'])}
                 >
                   <fmt.icon size={24} />
                   <span className="format-label">{fmt.label}</span>
@@ -323,36 +541,189 @@ function ExportPage() {
 
           <div className="setting-section">
             <h3>时间范围</h3>
-            <div className="time-options">
+            <p className="setting-subtitle">选择要导出的消息时间区间</p>
-              <label className="checkbox-item">
+            <div className="media-options-card">
-                <input
+              <div className="media-switch-row">
-                  type="checkbox"
+                <div className="media-switch-info">
-                  checked={options.useAllTime}
+                  <span className="media-switch-title">导出全部时间</span>
-                  onChange={e => setOptions({ ...options, useAllTime: e.target.checked })}
+                  <span className="media-switch-desc">关闭此项以选择特定的起止日期</span>
-                />
-                <span>导出全部时间</span>
-              </label>
-              {!options.useAllTime && options.dateRange && (
-                <div className="date-range" onClick={() => setShowDatePicker(true)}>
-                  <Calendar size={16} />
-                  <span>{formatDate(options.dateRange.start)} - {formatDate(options.dateRange.end)}</span>
-                  <ChevronDown size={14} />
                 </div>
+                <label className="switch">
+                  <input
+                    type="checkbox"
+                    checked={options.useAllTime}
+                    onChange={e => setOptions({ ...options, useAllTime: e.target.checked })}
+                  />
+                  <span className="switch-slider"></span>
+                </label>
+              </div>
+
+              {!options.useAllTime && options.dateRange && (
+                <>
+                  <div className="media-option-divider"></div>
+                  <div className="time-range-picker-item" onClick={() => setShowDatePicker(true)}>
+                    <div className="time-picker-info">
+                      <Calendar size={16} />
+                      <span>{formatDate(options.dateRange.start)} - {formatDate(options.dateRange.end)}</span>
+                    </div>
+                    <ChevronDown size={14} />
+                  </div>
+                </>
               )}
             </div>
           </div>
 
+          {/* 发送者名称显示偏好 */}
+          {(options.format === 'html' || options.format === 'json' || options.format === 'txt') && (
+            <div className="setting-section">
+              <h3>发送者名称显示</h3>
+              <p className="setting-subtitle">选择导出时优先显示的名称</p>
+              <div className="select-field" ref={displayNameDropdownRef}>
+                <button
+                  type="button"
+                  className={`select-trigger ${showDisplayNameSelect ? 'open' : ''}`}
+                  onClick={() => setShowDisplayNameSelect(!showDisplayNameSelect)}
+                >
+                  <span className="select-value">{displayNameLabel}</span>
+                  <ChevronDown size={16} />
+                </button>
+                {showDisplayNameSelect && (
+                  <div className="select-dropdown">
+                    {displayNameOptions.map(option => (
+                      <button
+                        key={option.value}
+                        type="button"
+                        className={`select-option ${options.displayNamePreference === option.value ? 'active' : ''}`}
+                        onClick={() => {
+                          setOptions({
+                            ...options,
+                            displayNamePreference: option.value as ExportOptions['displayNamePreference']
+                          })
+                          setShowDisplayNameSelect(false)
+                        }}
+                      >
+                        <span className="option-label">{option.label}</span>
+                        <span className="option-desc">{option.desc}</span>
+                      </button>
+                    ))}
+                  </div>
+                )}
+              </div>
+            </div>
+          )}
           <div className="setting-section">
-            <h3>导出头像</h3>
+            <h3>媒体文件</h3>
-            <div className="time-options">
+            <p className="setting-subtitle">导出图片/语音/视频/表情并在记录内写入相对路径</p>
-              <label className="checkbox-item">
+            <div className="media-options-card">
+              <div className="media-switch-row">
+                <div className="media-switch-info">
+                  <span className="media-switch-title">导出媒体文件</span>
+                  <span className="media-switch-desc">会创建子文件夹并保存媒体资源</span>
+                </div>
+                <label className="switch">
+                  <input
+                    type="checkbox"
+                    checked={options.exportMedia}
+                    onChange={e => setOptions({ ...options, exportMedia: e.target.checked })}
+                  />
+                  <span className="switch-slider"></span>
+                </label>
+              </div>
+
+              <div className="media-option-divider"></div>
+
+              <label className={`media-checkbox-row ${!options.exportMedia ? 'disabled' : ''}`}>
+                <div className="media-checkbox-info">
+                  <span className="media-checkbox-title">图片</span>
+                  <span className="media-checkbox-desc">已有文件直接复制，缺失时尝试解密</span>
+                </div>
                 <input
                   type="checkbox"
-                  checked={options.exportAvatars}
+                  checked={options.exportImages}
-                  onChange={e => setOptions({ ...options, exportAvatars: e.target.checked })}
+                  disabled={!options.exportMedia}
+                  onChange={e => setOptions({ ...options, exportImages: e.target.checked })}
                 />
-                <span>导出头像图片</span>
               </label>
+
+              <div className="media-option-divider"></div>
+
+              <label className={`media-checkbox-row ${!options.exportMedia ? 'disabled' : ''}`}>
+                <div className="media-checkbox-info">
+                  <span className="media-checkbox-title">语音</span>
+                  <span className="media-checkbox-desc">缺失时会解码生成 MP3</span>
+                </div>
+                <input
+                  type="checkbox"
+                  checked={options.exportVoices}
+                  disabled={!options.exportMedia}
+                  onChange={e => setOptions({ ...options, exportVoices: e.target.checked })}
+                />
+              </label>
+
+              <div className="media-option-divider"></div>
+
+              <label className="media-checkbox-row">
+                <div className="media-checkbox-info">
+                  <span className="media-checkbox-title">语音转文字</span>
+                  <span className="media-checkbox-desc">将语音消息转换为文字导出</span>
+                </div>
+                <input
+                  type="checkbox"
+                  checked={options.exportVoiceAsText}
+                  onChange={e => setOptions({ ...options, exportVoiceAsText: e.target.checked })}
+                />
+              </label>
+
+              <div className="media-option-divider"></div>
+
+              <label className={`media-checkbox-row ${!options.exportMedia ? 'disabled' : ''}`}>
+                <div className="media-checkbox-info">
+                  <span className="media-checkbox-title">视频</span>
+                  <span className="media-checkbox-desc">直接复制视频文件到导出目录</span>
+                </div>
+                <input
+                  type="checkbox"
+                  checked={options.exportVideos}
+                  disabled={!options.exportMedia}
+                  onChange={e => setOptions({ ...options, exportVideos: e.target.checked })}
+                />
+              </label>
+
+              <div className="media-option-divider"></div>
+
+              <label className={`media-checkbox-row ${!options.exportMedia ? 'disabled' : ''}`}>
+                <div className="media-checkbox-info">
+                  <span className="media-checkbox-title">表情</span>
+                  <span className="media-checkbox-desc">本地无缓存时尝试下载</span>
+                </div>
+                <input
+                  type="checkbox"
+                  checked={options.exportEmojis}
+                  disabled={!options.exportMedia}
+                  onChange={e => setOptions({ ...options, exportEmojis: e.target.checked })}
+                />
+              </label>
+            </div>
+          </div>
+
+          <div className="setting-section">
+            <h3>头像</h3>
+            <p className="setting-subtitle">可选导出头像索引，关闭则不下载头像</p>
+            <div className="media-options-card">
+              <div className="media-switch-row">
+                <div className="media-switch-info">
+                  <span className="media-switch-title">导出头像</span>
+                  <span className="media-switch-desc">用于展示发送者头像，可能会读取或下载头像文件</span>
+                </div>
+                <label className="switch">
+                  <input
+                    type="checkbox"
+                    checked={options.exportAvatars}
+                    onChange={e => setOptions({ ...options, exportAvatars: e.target.checked })}
+                  />
+                  <span className="switch-slider"></span>
+                </label>
+              </div>
             </div>
           </div>
 
@@ -362,7 +733,26 @@ function ExportPage() {
               <FolderOpen size={16} />
               <span>{exportFolder || '未设置'}</span>
             </div>
-            <p className="path-hint">可在设置页面修改导出目录</p>
+            <button
+              className="select-folder-btn"
+              onClick={async () => {
+                try {
+                  const result = await window.electronAPI.dialog.openFile({
+                    title: '选择导出目录',
+                    properties: ['openDirectory']
+                  })
+                  if (!result.canceled && result.filePaths.length > 0) {
+                    setExportFolder(result.filePaths[0])
+                    await configService.setExportPath(result.filePaths[0])
+                  }
+                } catch (e) {
+                  console.error('选择目录失败:', e)
+                }
+              }}
+            >
+              <FolderOpen size={16} />
+              <span>选择导出目录</span>
+            </button>
           </div>
         </div>
 
@@ -387,6 +777,43 @@ function ExportPage() {
         </div>
       </div>
 
+      {/* 媒体导出布局选择弹窗 */}
+      {showMediaLayoutPrompt && (
+        <div className="export-overlay" onClick={() => setShowMediaLayoutPrompt(false)}>
+          <div className="export-layout-modal" onClick={e => e.stopPropagation()}>
+            <h3>导出文件夹布局</h3>
+            <p className="layout-subtitle">检测到同时导出多个会话并包含媒体文件，请选择存放方式：</p>
+            <div className="layout-options">
+              <button
+                className="layout-option-btn primary"
+                onClick={() => {
+                  setShowMediaLayoutPrompt(false)
+                  runExport('shared')
+                }}
+              >
+                <span className="layout-title">所有会话在同一文件夹</span>
+                <span className="layout-desc">媒体会按会话名归档到 media 子目录</span>
+              </button>
+              <button
+                className="layout-option-btn"
+                onClick={() => {
+                  setShowMediaLayoutPrompt(false)
+                  runExport('per-session')
+                }}
+              >
+                <span className="layout-title">每个会话一个文件夹</span>
+                <span className="layout-desc">每个会话单独包含导出文件和媒体</span>
+              </button>
+            </div>
+            <div className="layout-actions">
+              <button className="layout-cancel-btn" onClick={() => setShowMediaLayoutPrompt(false)}>
+                取消
+              </button>
+            </div>
+          </div>
+        </div>
+      )}
+
       {/* 导出进度弹窗 */}
       {isExporting && (
         <div className="export-overlay">
@@ -443,6 +870,9 @@ function ExportPage() {
         <div className="export-overlay" onClick={() => setShowDatePicker(false)}>
           <div className="date-picker-modal" onClick={e => e.stopPropagation()}>
             <h3>选择时间范围</h3>
+            <p style={{ fontSize: '13px', color: 'var(--text-secondary)', margin: '8px 0 16px 0' }}>
+              点击选择开始和结束日期，系统会自动调整确保时间顺序正确
+            </p>
             <div className="quick-select">
               <button
                 className="quick-btn"
@@ -537,12 +967,16 @@ function ExportPage() {
                   const isStart = options.dateRange?.start.toDateString() === currentDate.toDateString()
                   const isEnd = options.dateRange?.end.toDateString() === currentDate.toDateString()
                   const isInRange = options.dateRange && currentDate >= options.dateRange.start && currentDate <= options.dateRange.end
+                  const today = new Date()
+                  today.setHours(0, 0, 0, 0)
+                  const isFuture = currentDate > today
 
                   return (
                     <div
                       key={day}
-                      className={`calendar-day ${isStart ? 'start' : ''} ${isEnd ? 'end' : ''} ${isInRange ? 'in-range' : ''}`}
+                      className={`calendar-day ${isStart ? 'start' : ''} ${isEnd ? 'end' : ''} ${isInRange ? 'in-range' : ''} ${isFuture ? 'disabled' : ''}`}
-                      onClick={() => handleDateSelect(day)}
+                      onClick={() => !isFuture && handleDateSelect(day)}
+                      style={{ cursor: isFuture ? 'not-allowed' : 'pointer', opacity: isFuture ? 0.3 : 1 }}
                     >
                       {day}
                     </div>

src/pages/GroupAnalyticsPage.scss

@@ -333,7 +333,7 @@
   .group-avatar {
     width: 44px;
     height: 44px;
-    border-radius: 50%;
+    border-radius: 8px;
     overflow: hidden;
     flex-shrink: 0;
 
@@ -346,11 +346,11 @@
     .avatar-placeholder {
       width: 100%;
       height: 100%;
-      background: linear-gradient(135deg, #11998e 0%, #38ef7d 100%);
+      background: var(--bg-tertiary);
       display: flex;
       align-items: center;
       justify-content: center;
-      color: #fff;
+      color: var(--text-secondary);
     }
   }
 
@@ -390,7 +390,7 @@
   .skeleton-avatar {
     width: 44px;
     height: 44px;
-    border-radius: 50%;
+    border-radius: 8px;
     background: var(--bg-tertiary);
     animation: pulse 1.5s infinite;
   }
@@ -500,7 +500,7 @@
     .group-avatar.large {
       width: 80px;
       height: 80px;
-      border-radius: 50%;
+      border-radius: 10px;
       overflow: hidden;
       margin: 0 auto 16px;
 
@@ -513,11 +513,11 @@
       .avatar-placeholder {
         width: 100%;
         height: 100%;
-        background: linear-gradient(135deg, #11998e 0%, #38ef7d 100%);
+        background: var(--bg-tertiary);
         display: flex;
         align-items: center;
         justify-content: center;
-        color: #fff;
+        color: var(--text-secondary);
       }
     }
 
@@ -656,6 +656,32 @@
         cursor: not-allowed;
       }
     }
+
+    .export-btn {
+      display: inline-flex;
+      align-items: center;
+      gap: 6px;
+      padding: 6px 10px;
+      border: none;
+      background: var(--bg-tertiary);
+      border-radius: 8px;
+      color: var(--text-secondary);
+      cursor: pointer;
+      transition: all 0.2s;
+      -webkit-app-region: no-drag;
+      font-size: 12px;
+      flex-shrink: 0;
+
+      &:hover {
+        background: var(--bg-hover);
+        color: var(--text-primary);
+      }
+
+      &:disabled {
+        opacity: 0.4;
+        cursor: not-allowed;
+      }
+    }
   }
 
   .content-body {

src/pages/GroupAnalyticsPage.tsx

@@ -1,5 +1,6 @@
-import { useState, useEffect, useRef } from 'react'
+import { useState, useEffect, useRef, useCallback } from 'react'
-import { Users, BarChart3, Clock, Image, Loader2, RefreshCw, User, Medal, Search, X, ChevronLeft, Copy, Check } from 'lucide-react'
+import { Users, BarChart3, Clock, Image, Loader2, RefreshCw, User, Medal, Search, X, ChevronLeft, Copy, Check, Download } from 'lucide-react'
+import { Avatar } from '../components/Avatar'
 import ReactECharts from 'echarts-for-react'
 import DateRangePicker from '../components/DateRangePicker'
 import './GroupAnalyticsPage.scss'
@@ -38,6 +39,7 @@ function GroupAnalyticsPage() {
   const [activeHours, setActiveHours] = useState<Record<number, number>>({})
   const [mediaStats, setMediaStats] = useState<{ typeCounts: Array<{ type: number; name: string; count: number }>; total: number } | null>(null)
   const [functionLoading, setFunctionLoading] = useState(false)
+  const [isExportingMembers, setIsExportingMembers] = useState(false)
 
   // 成员详情弹框
   const [selectedMember, setSelectedMember] = useState<GroupMember | null>(null)
@@ -92,7 +94,7 @@ function GroupAnalyticsPage() {
     }
   }, [dateRangeReady])
 
-  const loadGroups = async () => {
+  const loadGroups = useCallback(async () => {
     setIsLoading(true)
     try {
       const result = await window.electronAPI.groupAnalytics.getGroupChats()
@@ -105,7 +107,23 @@ function GroupAnalyticsPage() {
     } finally {
       setIsLoading(false)
     }
-  }
+  }, [])
+
+  useEffect(() => {
+    const handleChange = () => {
+      setGroups([])
+      setFilteredGroups([])
+      setSelectedGroup(null)
+      setSelectedFunction(null)
+      setMembers([])
+      setRankings([])
+      setActiveHours({})
+      setMediaStats(null)
+      void loadGroups()
+    }
+    window.addEventListener('wxid-changed', handleChange as EventListener)
+    return () => window.removeEventListener('wxid-changed', handleChange as EventListener)
+  }, [loadGroups])
 
   const handleGroupSelect = (group: GroupChatInfo) => {
     if (selectedGroup?.username !== group.username) {
@@ -164,6 +182,10 @@ function GroupAnalyticsPage() {
     return num.toLocaleString()
   }
 
+  const sanitizeFileName = (name: string) => {
+    return name.replace(/[<>:"/\\|?*]+/g, '_').trim()
+  }
+
   const getHourlyOption = () => {
     const hours = Array.from({ length: 24 }, (_, i) => i)
     const data = hours.map(h => activeHours[h] || 0)
@@ -177,7 +199,7 @@ function GroupAnalyticsPage() {
 
   const getMediaOption = () => {
     if (!mediaStats || mediaStats.typeCounts.length === 0) return {}
-    
+
     // 定义颜色映射
     const colorMap: Record<number, string> = {
       1: '#3b82f6',   // 文本 - 蓝色
@@ -188,13 +210,13 @@ function GroupAnalyticsPage() {
       49: '#14b8a6',  // 链接/文件 - 青色
       [-1]: '#6b7280', // 其他 - 灰色
     }
-    
+
     const data = mediaStats.typeCounts.map(item => ({
       name: item.name,
       value: item.count,
       itemStyle: { color: colorMap[item.type] || '#6b7280' }
     }))
-    
+
     return {
       tooltip: { trigger: 'item', formatter: '{b}: {c} ({d}%)' },
       series: [{
@@ -202,8 +224,8 @@ function GroupAnalyticsPage() {
         radius: ['40%', '70%'],
         center: ['50%', '50%'],
         itemStyle: { borderRadius: 8, borderColor: 'rgba(255,255,255,0.1)', borderWidth: 2 },
-        label: { 
+        label: {
-          show: true, 
+          show: true,
           formatter: (params: { name: string; percent: number }) => {
             // 只显示占比大于3%的标签
             return params.percent > 3 ? `${params.name}\n${params.percent.toFixed(1)}%` : ''
@@ -235,6 +257,35 @@ function GroupAnalyticsPage() {
     setCopiedField(null)
   }
 
+  const handleExportMembers = async () => {
+    if (!selectedGroup || isExportingMembers) return
+    setIsExportingMembers(true)
+    try {
+      const downloadsPath = await window.electronAPI.app.getDownloadsPath()
+      const baseName = sanitizeFileName(`${selectedGroup.displayName || selectedGroup.username}_群成员列表`)
+      const separator = downloadsPath && downloadsPath.includes('\\') ? '\\' : '/'
+      const defaultPath = downloadsPath ? `${downloadsPath}${separator}${baseName}.xlsx` : `${baseName}.xlsx`
+      const saveResult = await window.electronAPI.dialog.saveFile({
+        title: '导出群成员列表',
+        defaultPath,
+        filters: [{ name: 'Excel', extensions: ['xlsx'] }]
+      })
+      if (!saveResult || saveResult.canceled || !saveResult.filePath) return
+
+      const result = await window.electronAPI.groupAnalytics.exportGroupMembers(selectedGroup.username, saveResult.filePath)
+      if (result.success) {
+        alert(`导出成功，共 ${result.count ?? members.length} 人`)
+      } else {
+        alert(`导出失败：${result.error || '未知错误'}`)
+      }
+    } catch (e) {
+      console.error('导出群成员失败:', e)
+      alert(`导出失败：${String(e)}`)
+    } finally {
+      setIsExportingMembers(false)
+    }
+  }
+
   const handleCopy = async (text: string, field: string) => {
     try {
       await navigator.clipboard.writeText(text)
@@ -256,11 +307,7 @@ function GroupAnalyticsPage() {
           </button>
           <div className="modal-content">
             <div className="member-avatar large">
-              {selectedMember.avatarUrl ? (
+              <Avatar src={selectedMember.avatarUrl} name={selectedMember.displayName} size={96} />
-                <img src={selectedMember.avatarUrl} alt="" />
-              ) : (
-                <div className="avatar-placeholder"><User size={48} /></div>
-              )}
             </div>
             <h3 className="member-display-name">{selectedMember.displayName}</h3>
             <div className="member-details">
@@ -334,7 +381,7 @@ function GroupAnalyticsPage() {
               onClick={() => handleGroupSelect(group)}
             >
               <div className="group-avatar">
-                {group.avatarUrl ? <img src={group.avatarUrl} alt="" /> : <div className="avatar-placeholder"><Users size={20} /></div>}
+                <Avatar src={group.avatarUrl} name={group.displayName} size={44} />
               </div>
               <div className="group-info">
                 <span className="group-name">{group.displayName}</span>
@@ -352,7 +399,7 @@ function GroupAnalyticsPage() {
     <div className="function-menu">
       <div className="selected-group-info">
         <div className="group-avatar large">
-          {selectedGroup?.avatarUrl ? <img src={selectedGroup.avatarUrl} alt="" /> : <div className="avatar-placeholder"><Users size={40} /></div>}
+          <Avatar src={selectedGroup?.avatarUrl} name={selectedGroup?.displayName} size={80} />
         </div>
         <h2>{selectedGroup?.displayName}</h2>
         <p>{selectedGroup?.memberCount} 位成员</p>
@@ -410,6 +457,12 @@ function GroupAnalyticsPage() {
               onRangeComplete={handleDateRangeComplete}
             />
           )}
+          {selectedFunction === 'members' && (
+            <button className="export-btn" onClick={handleExportMembers} disabled={functionLoading || isExportingMembers}>
+              {isExportingMembers ? <Loader2 size={16} className="spin" /> : <Download size={16} />}
+              <span>导出成员</span>
+            </button>
+          )}
           <button className="refresh-btn" onClick={handleRefresh} disabled={functionLoading}>
             <RefreshCw size={16} className={functionLoading ? 'spin' : ''} />
           </button>
@@ -424,7 +477,7 @@ function GroupAnalyticsPage() {
                   {members.map(member => (
                     <div key={member.username} className="member-card" onClick={() => handleMemberClick(member)}>
                       <div className="member-avatar">
-                        {member.avatarUrl ? <img src={member.avatarUrl} alt="" /> : <div className="avatar-placeholder"><User size={20} /></div>}
+                        <Avatar src={member.avatarUrl} name={member.displayName} size={48} />
                       </div>
                       <span className="member-name">{member.displayName}</span>
                     </div>
@@ -437,7 +490,7 @@ function GroupAnalyticsPage() {
                     <div key={item.member.username} className="ranking-item">
                       <span className={`rank ${index < 3 ? 'top' : ''}`}>{index + 1}</span>
                       <div className="contact-avatar">
-                        {item.member.avatarUrl ? <img src={item.member.avatarUrl} alt="" /> : <div className="avatar-placeholder"><User size={20} /></div>}
+                        <Avatar src={item.member.avatarUrl} name={item.member.displayName} size={40} />
                         {index < 3 && <div className={`medal medal-${index + 1}`}><Medal size={10} /></div>}
                       </div>
                       <div className="contact-info">

src/pages/SettingsPage.scss

@@ -13,7 +13,7 @@
   justify-content: space-between;
   margin-bottom: 20px;
   flex-shrink: 0;
-  
+
   h1 {
     font-size: 24px;
     font-weight: 600;
@@ -51,12 +51,12 @@
   transition: all 0.2s;
   background: transparent;
   color: var(--text-secondary);
-  
+
   &:hover {
     color: var(--text-primary);
     background: var(--bg-secondary);
   }
-  
+
   &.active {
     background: var(--card-bg);
     color: var(--primary);
@@ -68,15 +68,15 @@
   flex: 1;
   overflow-y: auto;
   padding-right: 8px;
-  
+
   &::-webkit-scrollbar {
     width: 6px;
   }
-  
+
   &::-webkit-scrollbar-track {
     background: transparent;
   }
-  
+
   &::-webkit-scrollbar-thumb {
     background: var(--border-color);
     border-radius: 3px;
@@ -87,7 +87,7 @@
   background: var(--bg-secondary);
   border-radius: 16px;
   padding: 24px;
-  
+
   .section-desc {
     font-size: 13px;
     color: var(--text-tertiary);
@@ -110,7 +110,7 @@
   border-radius: 10px;
   margin-bottom: 20px;
   color: var(--text-secondary);
-  
+
   p {
     margin: 0;
     font-size: 14px;
@@ -124,24 +124,24 @@
 
 .form-group {
   margin-bottom: 20px;
-  
+
   &:last-child {
     margin-bottom: 0;
   }
-  
+
   label {
     display: block;
     font-size: 14px;
     font-weight: 500;
     color: var(--text-primary);
     margin-bottom: 2px;
-    
+
     .optional {
       font-weight: 400;
       color: var(--text-tertiary);
     }
   }
-  
+
   .form-hint {
     display: block;
     font-size: 12px;
@@ -171,7 +171,7 @@
       margin: 0;
     }
   }
-  
+
   .key-status {
     display: block;
     font-size: 13px;
@@ -179,7 +179,7 @@
     margin-bottom: 10px;
     animation: pulse 1.5s ease-in-out infinite;
   }
-  
+
   input {
     width: 100%;
     padding: 10px 16px;
@@ -189,32 +189,143 @@
     background: var(--bg-primary);
     color: var(--text-primary);
     margin-bottom: 10px;
-    
+
     &:focus {
       outline: none;
       border-color: var(--primary);
     }
-    
+
     &::placeholder {
       color: var(--text-tertiary);
     }
-    
+
     &:read-only {
       cursor: pointer;
     }
   }
-  
+
+  select {
+    width: 100%;
+    padding: 10px 16px;
+    border: 1px solid var(--border-color);
+    border-radius: 9999px;
+    font-size: 14px;
+    background: var(--bg-primary);
+    color: var(--text-primary);
+    margin-bottom: 10px;
+    cursor: pointer;
+
+    &:focus {
+      outline: none;
+      border-color: var(--primary);
+    }
+  }
+
+  .select-field {
+    position: relative;
+    margin-bottom: 10px;
+  }
+
+  .select-trigger {
+    width: 100%;
+    padding: 10px 16px;
+    border: 1px solid var(--border-color);
+    border-radius: 9999px;
+    font-size: 14px;
+    background: var(--bg-primary);
+    color: var(--text-primary);
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    gap: 8px;
+    cursor: pointer;
+    transition: all 0.2s;
+
+    &:hover {
+      border-color: var(--text-tertiary);
+    }
+
+    &.open {
+      border-color: var(--primary);
+      box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary) 15%, transparent);
+    }
+  }
+
+  .select-value {
+    flex: 1;
+    min-width: 0;
+    text-align: left;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+  }
+
+  .select-dropdown {
+    position: absolute;
+    top: calc(100% + 6px);
+    left: 0;
+    right: 0;
+    background: color-mix(in srgb, var(--bg-primary) 85%, var(--bg-secondary));
+    border: 1px solid var(--border-color);
+    border-radius: 12px;
+    padding: 6px;
+    box-shadow: var(--shadow-md);
+    z-index: 20;
+    max-height: 320px;
+    overflow-y: auto;
+    backdrop-filter: blur(14px);
+    -webkit-backdrop-filter: blur(14px);
+  }
+
+  .select-option {
+    width: 100%;
+    text-align: left;
+    display: flex;
+    flex-direction: column;
+    gap: 4px;
+    padding: 10px 12px;
+    border: none;
+    border-radius: 10px;
+    background: transparent;
+    cursor: pointer;
+    transition: all 0.15s;
+    color: var(--text-primary);
+    font-size: 14px;
+
+    &:hover {
+      background: var(--bg-tertiary);
+    }
+
+    &.active {
+      background: color-mix(in srgb, var(--primary) 12%, transparent);
+      color: var(--primary);
+    }
+  }
+
+  .option-label {
+    font-weight: 500;
+  }
+
+  .option-desc {
+    font-size: 12px;
+    color: var(--text-tertiary);
+  }
+
+  .select-option.active .option-desc {
+    color: var(--primary);
+  }
+
   .input-with-toggle {
     position: relative;
     display: flex;
     align-items: center;
     margin-bottom: 10px;
-    
+
     input {
       margin-bottom: 0;
       padding-right: 70px;
     }
-    
+
     .toggle-visibility {
       position: absolute;
       right: 12px;
@@ -226,7 +337,7 @@
       color: var(--text-secondary);
       cursor: pointer;
       transition: all 0.2s;
-      
+
       &:hover {
         background: var(--border-color);
         color: var(--text-primary);
@@ -235,6 +346,184 @@
   }
 }
 
+.whisper-section {
+  background: color-mix(in srgb, var(--primary) 3%, transparent);
+  border: 1px solid var(--border-color);
+  border-radius: 16px;
+  padding: 20px;
+  margin-top: 24px;
+
+  label {
+    font-size: 15px;
+    font-weight: 600;
+    color: var(--text-primary);
+    margin-bottom: 4px;
+  }
+
+  .whisper-grid {
+    display: grid;
+    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
+    gap: 12px;
+  }
+
+  .whisper-field {
+    display: flex;
+    flex-direction: column;
+  }
+
+  .field-label {
+    font-size: 12px;
+    color: var(--text-tertiary);
+    margin-bottom: 6px;
+  }
+
+  .whisper-status-line {
+    display: flex;
+    align-items: center;
+    gap: 10px;
+    font-size: 12px;
+    color: var(--text-secondary);
+    margin: 12px 0 16px;
+    padding: 10px 14px;
+    background: var(--bg-primary);
+    border-radius: 12px;
+    border: 1px solid var(--border-color);
+
+    .status {
+      padding: 4px 10px;
+      border-radius: 999px;
+      font-size: 11px;
+      font-weight: 600;
+      white-space: nowrap;
+    }
+
+    .status.ok {
+      background: rgba(16, 185, 129, 0.1);
+      color: #10b981;
+      border: 1px solid rgba(16, 185, 129, 0.2);
+    }
+
+    .status.warn {
+      background: rgba(245, 158, 11, 0.1);
+      color: #f59e0b;
+      border: 1px solid rgba(245, 158, 11, 0.2);
+    }
+
+    .path {
+      flex: 1;
+      min-width: 0;
+      font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
+      font-size: 11px;
+      color: var(--text-tertiary);
+      overflow: hidden;
+      text-overflow: ellipsis;
+      white-space: nowrap;
+      opacity: 0.8;
+    }
+  }
+
+  .whisper-progress {
+    display: flex;
+    flex-direction: column;
+    gap: 8px;
+    width: 100%;
+    margin-top: 10px;
+
+    .progress-bar-container {
+      display: flex;
+      align-items: center;
+      gap: 12px;
+    }
+
+    .progress-bar {
+      flex: 1;
+      height: 8px;
+      background: var(--bg-tertiary);
+      border-radius: 999px;
+      overflow: hidden;
+      box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
+
+      .progress-fill {
+        height: 100%;
+        background: linear-gradient(90deg, var(--primary) 0%, var(--primary-hover) 100%);
+        border-radius: 999px;
+        transition: width 0.3s cubic-bezier(0.4, 0, 0.2, 1);
+        position: relative;
+
+        &::after {
+          content: '';
+          position: absolute;
+          top: 0;
+          left: 0;
+          right: 0;
+          bottom: 0;
+          background: linear-gradient(90deg,
+              rgba(255, 255, 255, 0) 0%,
+              rgba(255, 255, 255, 0.2) 50%,
+              rgba(255, 255, 255, 0) 100%);
+          animation: progress-shimmer 2s infinite;
+        }
+      }
+    }
+
+    .progress-info {
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+
+      span {
+        font-size: 12px;
+        color: var(--text-secondary);
+        font-weight: 500;
+
+        &.percent {
+          color: var(--primary);
+          font-weight: 600;
+        }
+      }
+    }
+  }
+
+  .btn-download-model {
+    width: 100%;
+    height: 44px;
+    justify-content: center;
+    font-size: 15px;
+    font-weight: 600;
+    margin-top: 8px;
+    background: linear-gradient(135deg, var(--primary) 0%, var(--primary-hover) 100%);
+    box-shadow: 0 4px 12px color-mix(in srgb, var(--primary) 20%, transparent);
+    border: 1px solid rgba(255, 255, 255, 0.1);
+
+    &:hover:not(:disabled) {
+      transform: translateY(-1px);
+      box-shadow: 0 6px 16px color-mix(in srgb, var(--primary) 30%, transparent);
+    }
+
+    &:active:not(:disabled) {
+      transform: translateY(0);
+    }
+
+    svg {
+      transition: transform 0.2s;
+    }
+
+    &:hover svg {
+      transform: translateY(2px);
+    }
+  }
+}
+
+@keyframes progress-shimmer {
+  from {
+    transform: translateX(-100%);
+  }
+
+  to {
+    transform: translateX(100%);
+  }
+}
+
 .log-toggle-line {
   display: flex;
   align-items: center;
@@ -248,54 +537,73 @@
   color: var(--text-secondary);
 }
 
-.switch {
+.language-checkboxes {
-  position: relative;
+  display: flex;
-  width: 46px;
+  flex-wrap: wrap;
-  height: 24px;
+  gap: 10px;
-  display: inline-block;
+  margin-top: 10px;
-  user-select: none;
 }
 
-.switch-input {
+.language-checkbox {
-  opacity: 0;
+  display: flex;
-  width: 0;
+  align-items: center;
-  height: 0;
+  gap: 8px;
-}
-
-.switch-slider {
-  position: absolute;
   cursor: pointer;
-  top: 0;
+  user-select: none;
-  left: 0;
+  position: relative;
-  right: 0;
+
-  bottom: 0;
+  input[type="checkbox"] {
-  background: var(--bg-tertiary);
+    position: absolute;
-  border: 1px solid var(--border-color);
+    opacity: 0;
-  border-radius: 999px;
+    cursor: pointer;
-  transition: all 0.2s ease;
+    height: 0;
+    width: 0;
+  }
+
+  .checkbox-custom {
+    display: flex;
+    align-items: center;
+    gap: 8px;
+    padding: 8px 16px;
+    background: var(--bg-primary);
+    border: 1.5px solid var(--border-color);
+    border-radius: 12px;
+    font-size: 14px;
+    font-weight: 500;
+    color: var(--text-secondary);
+    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
+
+    svg {
+      opacity: 0;
+      transform: scale(0.5);
+      transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
+    }
+  }
+
+  &:hover .checkbox-custom {
+    border-color: var(--text-tertiary);
+    background: var(--bg-tertiary);
+    color: var(--text-primary);
+  }
+
+  input:checked+.checkbox-custom {
+    background: color-mix(in srgb, var(--primary) 10%, transparent);
+    border-color: var(--primary);
+    color: var(--primary);
+    box-shadow: 0 4px 12px color-mix(in srgb, var(--primary) 10%, transparent);
+
+    svg {
+      opacity: 1;
+      transform: scale(1);
+    }
+  }
+
+  &:active .checkbox-custom {
+    transform: scale(0.96);
+  }
 }
 
-.switch-slider::before {
+// 全局样式已在 main.scss 中定义
-  content: '';
-  position: absolute;
-  height: 18px;
-  width: 18px;
-  left: 3px;
-  top: 2px;
-  background: var(--text-tertiary);
-  border-radius: 50%;
-  transition: all 0.2s ease;
-}
-
-.switch-input:checked + .switch-slider {
-  background: var(--primary);
-  border-color: var(--primary);
-}
-
-.switch-input:checked + .switch-slider::before {
-  transform: translateX(22px);
-  background: #ffffff;
-}
 
 .log-actions {
   display: flex;
@@ -321,7 +629,7 @@
   font-weight: 500;
   cursor: pointer;
   transition: all 0.2s;
-  
+
   &:disabled {
     opacity: 0.6;
     cursor: not-allowed;
@@ -331,25 +639,40 @@
 .btn-primary {
   background: var(--primary);
   color: white;
-  
+  box-shadow: 0 2px 6px color-mix(in srgb, var(--primary) 15%, transparent);
+
   &:hover:not(:disabled) {
     background: var(--primary-hover);
+    box-shadow: 0 4px 12px color-mix(in srgb, var(--primary) 25%, transparent);
+    transform: translateY(-1px);
+  }
+
+  &:active:not(:disabled) {
+    transform: translateY(0);
   }
 }
 
 .btn-secondary {
   background: var(--bg-tertiary);
   color: var(--text-primary);
-  
+  border: 1px solid var(--border-color);
+
   &:hover:not(:disabled) {
-    background: var(--border-color);
+    background: var(--bg-primary);
+    border-color: var(--text-tertiary);
+    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
+    transform: translateY(-1px);
+  }
+
+  &:active:not(:disabled) {
+    transform: translateY(0);
   }
 }
 
 .btn-danger {
   background: var(--danger);
   color: white;
-  
+
   &:hover:not(:disabled) {
     opacity: 0.9;
   }
@@ -378,12 +701,12 @@
   font-size: 14px;
   z-index: 100;
   animation: slideDown 0.3s ease;
-  
+
   &.success {
     background: var(--primary);
     color: white;
   }
-  
+
   &.error {
     background: var(--danger);
     color: white;
@@ -395,6 +718,7 @@
     opacity: 0;
     transform: translateX(-50%) translateY(-10px);
   }
+
   to {
     opacity: 1;
     transform: translateX(-50%) translateY(0);
@@ -402,9 +726,12 @@
 }
 
 @keyframes pulse {
-  0%, 100% {
+
+  0%,
+  100% {
     opacity: 1;
   }
+
   50% {
     opacity: 0.6;
   }
@@ -419,7 +746,7 @@
   background: var(--bg-tertiary);
   border-radius: 12px;
   width: fit-content;
-  
+
   .mode-btn {
     display: flex;
     align-items: center;
@@ -433,11 +760,11 @@
     transition: all 0.2s;
     background: transparent;
     color: var(--text-secondary);
-    
+
     &:hover {
       color: var(--text-primary);
     }
-    
+
     &.active {
       background: var(--card-bg);
       color: var(--primary);
@@ -460,26 +787,26 @@
   cursor: pointer;
   transition: all 0.2s;
   background: var(--bg-primary);
-  
+
   &:hover {
     border-color: var(--text-tertiary);
   }
-  
+
   &.active {
     border-color: var(--primary);
-    
+
     .theme-preview {
       box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
     }
   }
-  
+
   .theme-preview {
     height: 60px;
     border-radius: 8px;
     margin-bottom: 8px;
     position: relative;
     overflow: hidden;
-    
+
     .theme-accent {
       position: absolute;
       bottom: 8px;
@@ -490,24 +817,24 @@
       box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
     }
   }
-  
+
   .theme-info {
     display: flex;
     flex-direction: column;
     gap: 2px;
-    
+
     .theme-name {
       font-size: 13px;
       font-weight: 500;
       color: var(--text-primary);
     }
-    
+
     .theme-desc {
       font-size: 11px;
       color: var(--text-tertiary);
     }
   }
-  
+
   .theme-check {
     position: absolute;
     top: 8px;
@@ -667,8 +994,13 @@
 }
 
 @keyframes spin {
-  from { transform: rotate(0deg); }
+  from {
-  to { transform: rotate(360deg); }
+    transform: rotate(0deg);
+  }
+
+  to {
+    transform: rotate(360deg);
+  }
 }
 
 
@@ -767,3 +1099,169 @@
     }
   }
 }
+
+
+// wxid 输入框下拉
+.wxid-input-wrapper {
+  position: relative;
+  display: flex;
+  align-items: center;
+
+  input {
+    flex: 1;
+  }
+}
+
+.wxid-dropdown-btn {
+  position: absolute;
+  right: 8px;
+  width: 28px;
+  height: 28px;
+  border: none;
+  border-radius: 6px;
+  background: transparent;
+  color: var(--text-secondary);
+  cursor: pointer;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  transition: all 0.2s;
+
+  &:hover {
+    color: var(--text-primary);
+  }
+
+  &.open {
+    transform: rotate(180deg);
+  }
+}
+
+.wxid-dropdown {
+  position: absolute;
+  top: 100%;
+  left: 0;
+  right: 0;
+  margin-top: 4px;
+  background: color-mix(in srgb, var(--bg-primary) 85%, var(--bg-secondary));
+  border: 1px solid var(--border-primary);
+  border-radius: 8px;
+  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
+  z-index: 100;
+  max-height: 200px;
+  overflow-y: auto;
+  backdrop-filter: blur(14px);
+  -webkit-backdrop-filter: blur(14px);
+}
+
+.wxid-option {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: 10px 12px;
+  cursor: pointer;
+  transition: background 0.15s;
+
+  &:hover {
+    background: var(--bg-tertiary);
+  }
+
+  &.active {
+    background: var(--primary-light);
+    color: var(--primary);
+  }
+
+  .wxid-value {
+    font-weight: 500;
+    font-size: 13px;
+  }
+
+  .wxid-time {
+    font-size: 11px;
+    color: var(--text-tertiary);
+  }
+}
+
+// 多账号选择对话框
+.wxid-dialog-overlay {
+  position: fixed;
+  inset: 0;
+  background: rgba(0, 0, 0, 0.5);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  z-index: 1000;
+}
+
+.wxid-dialog {
+  background: var(--bg-primary);
+  border-radius: 16px;
+  width: 400px;
+  max-width: 90vw;
+  max-height: 80vh;
+  overflow: hidden;
+  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.2);
+}
+
+.wxid-dialog-header {
+  padding: 20px 24px;
+  border-bottom: 1px solid var(--border-primary);
+
+  h3 {
+    margin: 0 0 4px;
+    font-size: 18px;
+    font-weight: 600;
+    color: var(--text-primary);
+  }
+
+  p {
+    margin: 0;
+    font-size: 13px;
+    color: var(--text-secondary);
+  }
+}
+
+.wxid-dialog-list {
+  padding: 8px;
+  max-height: 300px;
+  overflow-y: auto;
+}
+
+.wxid-dialog-item {
+  display: flex;
+  flex-direction: column;
+  gap: 4px;
+  padding: 14px 16px;
+  border-radius: 10px;
+  cursor: pointer;
+  transition: all 0.15s;
+
+  &:hover {
+    background: var(--bg-tertiary);
+  }
+
+  &.active {
+    background: var(--primary-light);
+
+    .wxid-id {
+      color: var(--primary);
+    }
+  }
+
+  .wxid-id {
+    font-size: 14px;
+    font-weight: 600;
+    color: var(--text-primary);
+  }
+
+  .wxid-date {
+    font-size: 12px;
+    color: var(--text-tertiary);
+  }
+}
+
+.wxid-dialog-footer {
+  padding: 16px 24px;
+  border-top: 1px solid var(--border-primary);
+  display: flex;
+  justify-content: flex-end;
+}

src/pages/SnsPage.tsx

@@ -0,0 +1,806 @@
+import { useEffect, useState, useRef, useCallback, useMemo } from 'react'
+import { RefreshCw, Heart, Search, Calendar, User, X, Filter, Play, ImageIcon, Zap, Download, ChevronRight } from 'lucide-react'
+import { Avatar } from '../components/Avatar'
+import { ImagePreview } from '../components/ImagePreview'
+import JumpToDateDialog from '../components/JumpToDateDialog'
+import { LivePhotoIcon } from '../components/LivePhotoIcon'
+import './SnsPage.scss'
+
+interface SnsPost {
+    id: string
+    username: string
+    nickname: string
+    avatarUrl?: string
+    createTime: number
+    contentDesc: string
+    type?: number
+    media: {
+        url: string
+        thumb: string
+        md5?: string
+        token?: string
+        key?: string
+        encIdx?: string
+        livePhoto?: {
+            url: string
+            thumb: string
+            token?: string
+            key?: string
+            encIdx?: string
+        }
+    }[]
+    likes: string[]
+    comments: { id: string; nickname: string; content: string; refCommentId: string; refNickname?: string }[]
+    rawXml?: string  // 原始 XML 数据
+}
+
+const MediaItem = ({ media, onPreview }: { media: any, onPreview: () => void }) => {
+    const [error, setError] = useState(false);
+    const { url, thumb, livePhoto } = media;
+    const isLive = !!livePhoto;
+    const targetUrl = thumb || url;
+
+    const handleDownload = (e: React.MouseEvent) => {
+        e.stopPropagation();
+
+        let downloadUrl = url;
+        let downloadKey = media.key || '';
+
+        if (isLive && media.livePhoto) {
+            downloadUrl = media.livePhoto.url;
+            downloadKey = media.livePhoto.key || '';
+        }
+
+        // TODO: 调用后端下载服务
+        // window.electronAPI.sns.download(downloadUrl, downloadKey);
+    };
+
+    return (
+        <div className={`media-item ${error ? 'error' : ''}`} onClick={onPreview}>
+            <img
+                src={targetUrl}
+                alt=""
+                referrerPolicy="no-referrer"
+                loading="lazy"
+                onError={() => setError(true)}
+            />
+            {isLive && (
+                <div className="live-badge">
+                    <LivePhotoIcon size={16} className="live-icon" />
+                </div>
+            )}
+            <button className="download-btn-overlay" onClick={handleDownload} title="下载原图">
+                <Download size={14} />
+            </button>
+        </div>
+    );
+};
+
+interface Contact {
+    username: string
+    displayName: string
+    avatarUrl?: string
+}
+
+export default function SnsPage() {
+    const [posts, setPosts] = useState<SnsPost[]>([])
+    const [loading, setLoading] = useState(false)
+    const [offset, setOffset] = useState(0)
+    const [hasMore, setHasMore] = useState(true)
+    const loadingRef = useRef(false)
+
+    // 筛选与搜索状态
+    const [searchKeyword, setSearchKeyword] = useState('')
+    const [selectedUsernames, setSelectedUsernames] = useState<string[]>([])
+    const [isSidebarOpen, setIsSidebarOpen] = useState(true)
+
+    // 联系人列表状态
+    const [contacts, setContacts] = useState<Contact[]>([])
+    const [contactSearch, setContactSearch] = useState('')
+    const [contactsLoading, setContactsLoading] = useState(false)
+    const [showJumpDialog, setShowJumpDialog] = useState(false)
+    const [jumpTargetDate, setJumpTargetDate] = useState<Date | undefined>(undefined)
+    const [previewImage, setPreviewImage] = useState<string | null>(null)
+    const [debugPost, setDebugPost] = useState<SnsPost | null>(null)
+
+    const postsContainerRef = useRef<HTMLDivElement>(null)
+
+    const [hasNewer, setHasNewer] = useState(false)
+    const [loadingNewer, setLoadingNewer] = useState(false)
+    const postsRef = useRef<SnsPost[]>([])
+    const scrollAdjustmentRef = useRef<number>(0)
+
+    // 同步 posts 到 ref 供 loadPosts 使用
+    useEffect(() => {
+        postsRef.current = posts
+    }, [posts])
+
+    // 处理向上加载动态时的滚动位置保持
+    useEffect(() => {
+        if (scrollAdjustmentRef.current !== 0 && postsContainerRef.current) {
+            const container = postsContainerRef.current;
+            const newHeight = container.scrollHeight;
+            const diff = newHeight - scrollAdjustmentRef.current;
+            if (diff > 0) {
+                container.scrollTop += diff;
+            }
+            scrollAdjustmentRef.current = 0;
+        }
+    }, [posts])
+
+    const loadPosts = useCallback(async (options: { reset?: boolean, direction?: 'older' | 'newer' } = {}) => {
+        const { reset = false, direction = 'older' } = options
+        if (loadingRef.current) return
+
+        loadingRef.current = true
+        if (direction === 'newer') setLoadingNewer(true)
+        else setLoading(true)
+
+        try {
+            const limit = 20
+            let startTs: number | undefined = undefined
+            let endTs: number | undefined = undefined
+
+            if (reset) {
+                if (jumpTargetDate) {
+                    endTs = Math.floor(jumpTargetDate.getTime() / 1000) + 86399
+                }
+            } else if (direction === 'newer') {
+                const currentPosts = postsRef.current
+                if (currentPosts.length > 0) {
+                    const topTs = currentPosts[0].createTime
+                    console.log('[SnsPage] Fetching newer posts starts from:', topTs + 1);
+
+                    const result = await window.electronAPI.sns.getTimeline(
+                        limit,
+                        0,
+                        selectedUsernames,
+                        searchKeyword,
+                        topTs + 1,
+                        undefined
+                    );
+
+                    if (result.success && result.timeline && result.timeline.length > 0) {
+                        if (postsContainerRef.current) {
+                            scrollAdjustmentRef.current = postsContainerRef.current.scrollHeight;
+                        }
+
+                        const existingIds = new Set(currentPosts.map((p: SnsPost) => p.id));
+                        const uniqueNewer = result.timeline.filter((p: SnsPost) => !existingIds.has(p.id));
+
+                        if (uniqueNewer.length > 0) {
+                            setPosts(prev => [...uniqueNewer, ...prev]);
+                        }
+                        setHasNewer(result.timeline.length >= limit);
+                    } else {
+                        setHasNewer(false);
+                    }
+                }
+                setLoadingNewer(false);
+                loadingRef.current = false;
+                return;
+            } else {
+                const currentPosts = postsRef.current
+                if (currentPosts.length > 0) {
+                    endTs = currentPosts[currentPosts.length - 1].createTime - 1
+                }
+            }
+
+            const result = await window.electronAPI.sns.getTimeline(
+                limit,
+                0,
+                selectedUsernames,
+                searchKeyword,
+                startTs,
+                endTs
+            )
+
+            if (result.success && result.timeline) {
+                if (reset) {
+                    setPosts(result.timeline)
+                    setHasMore(result.timeline.length >= limit)
+
+                    // 探测上方是否还有新动态（利用 DLL 过滤，而非底层 SQL）
+                    const topTs = result.timeline[0]?.createTime || 0;
+                    if (topTs > 0) {
+                        const checkResult = await window.electronAPI.sns.getTimeline(1, 0, selectedUsernames, searchKeyword, topTs + 1, undefined);
+                        setHasNewer(!!(checkResult.success && checkResult.timeline && checkResult.timeline.length > 0));
+                    } else {
+                        setHasNewer(false);
+                    }
+
+                    if (postsContainerRef.current) {
+                        postsContainerRef.current.scrollTop = 0
+                    }
+                } else {
+                    if (result.timeline.length > 0) {
+                        setPosts(prev => [...prev, ...result.timeline!])
+                    }
+                    if (result.timeline.length < limit) {
+                        setHasMore(false)
+                    }
+                }
+            }
+        } catch (error) {
+            console.error('Failed to load SNS timeline:', error)
+        } finally {
+            setLoading(false)
+            setLoadingNewer(false)
+            loadingRef.current = false
+        }
+    }, [selectedUsernames, searchKeyword, jumpTargetDate])
+
+    // 获取联系人列表
+    const loadContacts = useCallback(async () => {
+        setContactsLoading(true)
+        try {
+            const result = await window.electronAPI.chat.getSessions()
+            if (result.success && result.sessions) {
+                const systemAccounts = ['filehelper', 'fmessage', 'newsapp', 'weixin', 'qqmail', 'tmessage', 'floatbottle', 'medianote', 'brandsessionholder'];
+                const initialContacts = result.sessions
+                    .filter((s: any) => {
+                        if (!s.username) return false;
+                        const u = s.username.toLowerCase();
+                        if (u.includes('@chatroom') || u.endsWith('@chatroom') || u.endsWith('@openim')) return false;
+                        if (u.startsWith('gh_')) return false;
+                        if (systemAccounts.includes(u) || u.includes('helper') || u.includes('sessionholder')) return false;
+                        return true;
+                    })
+                    .map((s: any) => ({
+                        username: s.username,
+                        displayName: s.displayName || s.username,
+                        avatarUrl: s.avatarUrl
+                    }))
+                setContacts(initialContacts)
+
+                const usernames = initialContacts.map((c: { username: string }) => c.username)
+                const enriched = await window.electronAPI.chat.enrichSessionsContactInfo(usernames)
+                if (enriched.success && enriched.contacts) {
+                    setContacts(prev => prev.map(c => {
+                        const extra = enriched.contacts![c.username]
+                        if (extra) {
+                            return {
+                                ...c,
+                                displayName: extra.displayName || c.displayName,
+                                avatarUrl: extra.avatarUrl || c.avatarUrl
+                            }
+                        }
+                        return c
+                    }))
+                }
+            }
+        } catch (error) {
+            console.error('Failed to load contacts:', error)
+        } finally {
+            setContactsLoading(false)
+        }
+    }, [])
+
+    // 初始加载
+    useEffect(() => {
+        const checkSchema = async () => {
+            try {
+                const schema = await window.electronAPI.chat.execQuery('sns', null, "PRAGMA table_info(SnsTimeLine)");
+                console.log('[SnsPage] SnsTimeLine Schema:', schema);
+                if (schema.success && schema.rows) {
+                    const columns = schema.rows.map((r: any) => r.name);
+                    console.log('[SnsPage] Available columns:', columns);
+                }
+            } catch (e) {
+                console.error('[SnsPage] Failed to check schema:', e);
+            }
+        };
+        checkSchema();
+        loadContacts()
+    }, [loadContacts])
+
+    useEffect(() => {
+        const handleChange = () => {
+            setPosts([])
+            setHasMore(true)
+            setHasNewer(false)
+            setSelectedUsernames([])
+            setSearchKeyword('')
+            setJumpTargetDate(undefined)
+            loadContacts()
+            loadPosts({ reset: true })
+        }
+        window.addEventListener('wxid-changed', handleChange as EventListener)
+        return () => window.removeEventListener('wxid-changed', handleChange as EventListener)
+    }, [loadContacts, loadPosts])
+
+    useEffect(() => {
+        loadPosts({ reset: true })
+    }, [selectedUsernames, searchKeyword, jumpTargetDate])
+
+    const handleScroll = (e: React.UIEvent<HTMLDivElement>) => {
+        const { scrollTop, clientHeight, scrollHeight } = e.currentTarget
+
+        // 加载更旧的动态（触底）
+        if (scrollHeight - scrollTop - clientHeight < 400 && hasMore && !loading && !loadingNewer) {
+            loadPosts({ direction: 'older' })
+        }
+
+        // 加载更新的动态（触顶触发）
+        // 这里的阈值可以保留，但主要依赖下面的 handleWheel 捕获到顶后的上划
+        if (scrollTop < 10 && hasNewer && !loading && !loadingNewer) {
+            loadPosts({ direction: 'newer' })
+        }
+    }
+
+    // 处理到顶后的手动上滚意图
+    const handleWheel = (e: React.WheelEvent<HTMLDivElement>) => {
+        const container = postsContainerRef.current
+        if (!container) return
+
+        // deltaY < 0 表示向上滚，scrollTop === 0 表示已经在最顶端
+        if (e.deltaY < -20 && container.scrollTop <= 0 && hasNewer && !loading && !loadingNewer) {
+            console.log('[SnsPage] Wheel-up detected at top, loading newer posts...');
+            loadPosts({ direction: 'newer' })
+        }
+    }
+
+    const formatTime = (ts: number) => {
+        const date = new Date(ts * 1000)
+        const isCurrentYear = date.getFullYear() === new Date().getFullYear()
+
+        return date.toLocaleString('zh-CN', {
+            year: isCurrentYear ? undefined : 'numeric',
+            month: 'short',
+            day: 'numeric',
+            hour: '2-digit',
+            minute: '2-digit'
+        })
+    }
+
+    const toggleUserSelection = (username: string) => {
+        // 选择联系人时，如果当前有时间跳转，建议清除时间跳转以避免“跳到旧动态”的困惑
+        // 或者保持原样。根据用户反馈“乱跳”，我们在这里选择：
+        // 如果用户选择了新的一个人，而之前有时间跳转，我们重置时间跳转到最新。
+        setJumpTargetDate(undefined);
+
+        setSelectedUsernames(prev => {
+            if (prev.includes(username)) {
+                return prev.filter(u => u !== username)
+            } else {
+                return [...prev, username]
+            }
+        })
+    }
+
+    const clearFilters = () => {
+        setSearchKeyword('')
+        setSelectedUsernames([])
+        setJumpTargetDate(undefined)
+    }
+
+    const filteredContacts = contacts.filter(c =>
+        c.displayName.toLowerCase().includes(contactSearch.toLowerCase()) ||
+        c.username.toLowerCase().includes(contactSearch.toLowerCase())
+    )
+
+
+
+    return (
+        <div className="sns-page">
+            <div className="sns-container">
+                <main className="sns-main">
+                    <div className="sns-header">
+                        <div className="header-left">
+                            <h2>社交动态</h2>
+                        </div>
+                        <div className="header-right">
+                            <button
+                                className={`icon-btn sidebar-trigger ${isSidebarOpen ? 'active' : ''}`}
+                                onClick={() => setIsSidebarOpen(!isSidebarOpen)}
+                                title={isSidebarOpen ? "收起筛选" : "打开筛选"}
+                            >
+                                <Filter size={18} />
+                            </button>
+                            <button
+                                onClick={() => {
+                                    if (jumpTargetDate) setJumpTargetDate(undefined);
+                                    loadPosts({ reset: true });
+                                }}
+                                disabled={loading || loadingNewer}
+                                className="icon-btn refresh-btn"
+                                title="刷新"
+                            >
+                                <RefreshCw size={18} className={(loading || loadingNewer) ? 'spinning' : ''} />
+                            </button>
+                        </div>
+                    </div>
+
+                    <div className="sns-content-wrapper">
+                        <div className="sns-content custom-scrollbar" onScroll={handleScroll} onWheel={handleWheel} ref={postsContainerRef}>
+                            <div className="posts-list">
+                                {loadingNewer && (
+                                    <div className="status-indicator loading-newer">
+                                        <RefreshCw size={16} className="spinning" />
+                                        <span>正在检查更新的动态...</span>
+                                    </div>
+                                )}
+                                {!loadingNewer && hasNewer && (
+                                    <div className="status-indicator newer-hint" onClick={() => loadPosts({ direction: 'newer' })}>
+                                        查看更新的动态
+                                    </div>
+                                )}
+                                {posts.map((post, index) => {
+                                    return (
+                                        <div key={post.id} className="sns-post-row">
+                                            <div className="sns-post-wrapper">
+                                                <div className="sns-post">
+                                                    <div className="post-header">
+                                                        <Avatar
+                                                            src={post.avatarUrl}
+                                                            name={post.nickname}
+                                                            size={44}
+                                                            shape="rounded"
+                                                        />
+                                                        <div className="post-info">
+                                                            <div className="nickname">{post.nickname}</div>
+                                                            <div className="time">{formatTime(post.createTime)}</div>
+                                                        </div>
+                                                        <button
+                                                            className="debug-btn"
+                                                            onClick={(e) => {
+                                                                e.stopPropagation();
+                                                                setDebugPost(post);
+                                                            }}
+                                                            title="查看原始数据"
+                                                        >
+                                                            <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2">
+                                                                <polyline points="16 18 22 12 16 6"></polyline>
+                                                                <polyline points="8 6 2 12 8 18"></polyline>
+                                                            </svg>
+                                                        </button>
+                                                    </div>
+
+                                                    <div className="post-body">
+                                                        {post.contentDesc && <div className="post-text">{post.contentDesc}</div>}
+
+                                                        {post.type === 15 ? (
+                                                            <div className="post-video-placeholder">
+                                                                <Play size={20} />
+                                                                <span>视频动态</span>
+                                                            </div>
+                                                        ) : post.media.length > 0 && (
+                                                            <div className={`post-media-grid media-count-${Math.min(post.media.length, 9)}`}>
+                                                                {post.media.map((m, idx) => (
+                                                                    <MediaItem key={idx} media={m} onPreview={() => setPreviewImage(m.url)} />
+                                                                ))}
+                                                            </div>
+                                                        )}
+                                                    </div>
+
+                                                    {(post.likes.length > 0 || post.comments.length > 0) && (
+                                                        <div className="post-footer">
+                                                            {post.likes.length > 0 && (
+                                                                <div className="likes-section">
+                                                                    <Heart size={14} className="icon" />
+                                                                    <span className="likes-list">
+                                                                        {post.likes.join('、')}
+                                                                    </span>
+                                                                </div>
+                                                            )}
+
+                                                            {post.comments.length > 0 && (
+                                                                <div className="comments-section">
+                                                                    {post.comments.map((c, idx) => (
+                                                                        <div key={idx} className="comment-item">
+                                                                            <span className="comment-user">{c.nickname}</span>
+                                                                            {c.refNickname && (
+                                                                                <>
+                                                                                    <span className="reply-text">回复</span>
+                                                                                    <span className="comment-user">{c.refNickname}</span>
+                                                                                </>
+                                                                            )}
+                                                                            <span className="comment-separator">: </span>
+                                                                            <span className="comment-content">{c.content}</span>
+                                                                        </div>
+                                                                    ))}
+                                                                </div>
+                                                            )}
+                                                        </div>
+                                                    )}
+                                                </div>
+                                            </div>
+                                        </div>
+                                    )
+                                })}
+                            </div>
+
+                            {loading && <div className="status-indicator loading-more">
+                                <RefreshCw size={16} className="spinning" />
+                                <span>正在加载更多...</span>
+                            </div>}
+                            {!hasMore && posts.length > 0 && <div className="status-indicator no-more">已经到底啦</div>}
+                            {!loading && posts.length === 0 && (
+                                <div className="no-results">
+                                    <div className="no-results-icon"><Search size={48} /></div>
+                                    <p>未找到相关动态</p>
+                                    {(selectedUsernames.length > 0 || searchKeyword) && (
+                                        <button onClick={clearFilters} className="reset-inline">
+                                            重置搜索条件
+                                        </button>
+                                    )}
+                                </div>
+                            )}
+                        </div>
+                    </div>
+                </main>
+
+                {/* 侧边栏：过滤与搜索 (moved to right) */}
+                <aside className={`sns-sidebar ${isSidebarOpen ? 'open' : 'closed'}`}>
+                    <div className="sidebar-header">
+                        <h3>筛选条件</h3>
+
+                    </div>
+
+                    <div className="filter-content custom-scrollbar">
+                        {/* 1. 搜索分组 (放到最顶上) */}
+                        <div className="filter-card">
+                            <div className="filter-section">
+                                <label><Search size={14} /> 关键词搜索</label>
+                                <div className="search-input-wrapper">
+                                    <Search size={14} className="input-icon" />
+                                    <input
+                                        type="text"
+                                        placeholder="搜索动态内容..."
+                                        value={searchKeyword}
+                                        onChange={e => setSearchKeyword(e.target.value)}
+                                    />
+                                    {searchKeyword && (
+                                        <button className="clear-input" onClick={() => setSearchKeyword('')}>
+                                            <X size={14} />
+                                        </button>
+                                    )}
+                                </div>
+                            </div>
+                        </div>
+
+                        {/* 2. 日期跳转 (放搜索下面) */}
+                        <div className="filter-card jump-date-card">
+                            <div className="filter-section">
+                                <label><Calendar size={14} /> 时间跳转</label>
+                                <button className={`jump-date-btn ${jumpTargetDate ? 'active' : ''}`} onClick={() => setShowJumpDialog(true)}>
+                                    <span className="text">
+                                        {jumpTargetDate ? jumpTargetDate.toLocaleDateString('zh-CN', { year: 'numeric', month: 'long', day: 'numeric' }) : '选择跳转日期...'}
+                                    </span>
+                                    <Calendar size={14} className="icon" />
+                                </button>
+                                {jumpTargetDate && (
+                                    <button className="clear-jump-date-inline" onClick={() => setJumpTargetDate(undefined)}>
+                                        返回最新动态
+                                    </button>
+                                )}
+                            </div>
+                        </div>
+
+
+                        {/* 3. 联系人筛选 (放最下面，高度自适应) */}
+                        <div className="filter-card contact-card">
+                            <div className="contact-filter-section">
+                                <div className="section-header">
+                                    <label><User size={14} /> 联系人</label>
+                                    <div className="header-actions">
+                                        {selectedUsernames.length > 0 && (
+                                            <button className="clear-selection-btn" onClick={() => setSelectedUsernames([])}>清除</button>
+                                        )}
+                                        {selectedUsernames.length > 0 && (
+                                            <span className="selected-count">{selectedUsernames.length}</span>
+                                        )}
+                                    </div>
+                                </div>
+                                <div className="contact-search">
+                                    <Search size={12} className="search-icon" />
+                                    <input
+                                        type="text"
+                                        placeholder="搜索好友..."
+                                        value={contactSearch}
+                                        onChange={e => setContactSearch(e.target.value)}
+                                    />
+                                    {contactSearch && (
+                                        <X size={12} className="clear-search-icon" onClick={() => setContactSearch('')} />
+                                    )}
+                                </div>
+                                <div className="contact-list custom-scrollbar">
+                                    {filteredContacts.map(contact => (
+                                        <div
+                                            key={contact.username}
+                                            className={`contact-item ${selectedUsernames.includes(contact.username) ? 'active' : ''}`}
+                                            onClick={() => toggleUserSelection(contact.username)}
+                                        >
+                                            <div className="avatar-wrapper">
+                                                <Avatar src={contact.avatarUrl} name={contact.displayName} size={32} shape="rounded" />
+                                                {selectedUsernames.includes(contact.username) && (
+                                                    <div className="active-badge"></div>
+                                                )}
+                                            </div>
+                                            <span className="contact-name">{contact.displayName}</span>
+                                            <div className="check-box">
+                                                {selectedUsernames.includes(contact.username) && <div className="inner-check"></div>}
+                                            </div>
+                                        </div>
+                                    ))}
+                                    {filteredContacts.length === 0 && (
+                                        <div className="empty-contacts">无可显示联系人</div>
+                                    )}
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+
+                    <div className="sidebar-footer">
+                        <button className="clear-btn" onClick={clearFilters}>
+                            <RefreshCw size={14} />
+                            重置所有筛选
+                        </button>
+                    </div>
+                </aside>
+            </div>
+            {previewImage && (
+                <ImagePreview src={previewImage} onClose={() => setPreviewImage(null)} />
+            )}
+            <JumpToDateDialog
+                isOpen={showJumpDialog}
+                onClose={() => {
+                    setShowJumpDialog(false)
+                }}
+                onSelect={(date) => {
+                    setJumpTargetDate(date)
+                    setShowJumpDialog(false)
+                }}
+                currentDate={jumpTargetDate || new Date()}
+            />
+
+            {/* Debug Info Dialog */}
+            {debugPost && (
+                <div className="modal-overlay" onClick={() => setDebugPost(null)}>
+                    <div className="debug-dialog" onClick={(e) => e.stopPropagation()}>
+                        <div className="debug-dialog-header">
+                            <h3>原始数据 - {debugPost.nickname}</h3>
+                            <button className="close-btn" onClick={() => setDebugPost(null)}>
+                                <X size={20} />
+                            </button>
+                        </div>
+                        <div className="debug-dialog-body">
+
+                            <div className="debug-section">
+                                <h4>ℹ 基本信息</h4>
+                                <div className="debug-item">
+                                    <span className="debug-key">ID:</span>
+                                    <span className="debug-value">{debugPost.id}</span>
+                                </div>
+                                <div className="debug-item">
+                                    <span className="debug-key">用户名:</span>
+                                    <span className="debug-value">{debugPost.username}</span>
+                                </div>
+                                <div className="debug-item">
+                                    <span className="debug-key">昵称:</span>
+                                    <span className="debug-value">{debugPost.nickname}</span>
+                                </div>
+                                <div className="debug-item">
+                                    <span className="debug-key">时间:</span>
+                                    <span className="debug-value">{new Date(debugPost.createTime * 1000).toLocaleString()}</span>
+                                </div>
+                                <div className="debug-item">
+                                    <span className="debug-key">类型:</span>
+                                    <span className="debug-value">{debugPost.type}</span>
+                                </div>
+                            </div>
+
+                            <div className="debug-section">
+                                <h4> 媒体信息 ({debugPost.media.length} 项)</h4>
+                                {debugPost.media.map((media, idx) => (
+                                    <div key={idx} className="media-debug-item">
+                                        <div className="media-debug-header">媒体 {idx + 1}</div>
+                                        <div className="debug-item">
+                                            <span className="debug-key">URL:</span>
+                                            <span className="debug-value">{media.url}</span>
+                                        </div>
+                                        <div className="debug-item">
+                                            <span className="debug-key">缩略图:</span>
+                                            <span className="debug-value">{media.thumb}</span>
+                                        </div>
+                                        {media.md5 && (
+                                            <div className="debug-item">
+                                                <span className="debug-key">MD5:</span>
+                                                <span className="debug-value">{media.md5}</span>
+                                            </div>
+                                        )}
+                                        {media.token && (
+                                            <div className="debug-item">
+                                                <span className="debug-key">Token:</span>
+                                                <span className="debug-value">{media.token}</span>
+                                            </div>
+                                        )}
+                                        {media.key && (
+                                            <div className="debug-item">
+                                                <span className="debug-key">Key (解密密钥):</span>
+                                                <span className="debug-value">{media.key}</span>
+                                            </div>
+                                        )}
+                                        {media.encIdx && (
+                                            <div className="debug-item">
+                                                <span className="debug-key">Enc Index:</span>
+                                                <span className="debug-value">{media.encIdx}</span>
+                                            </div>
+                                        )}
+                                        {media.livePhoto && (
+                                            <div className="live-photo-debug">
+                                                <div className="live-photo-label"> Live Photo 视频部分:</div>
+                                                <div className="debug-item">
+                                                    <span className="debug-key">视频 URL:</span>
+                                                    <span className="debug-value">{media.livePhoto.url}</span>
+                                                </div>
+                                                <div className="debug-item">
+                                                    <span className="debug-key">视频缩略图:</span>
+                                                    <span className="debug-value">{media.livePhoto.thumb}</span>
+                                                </div>
+                                                {media.livePhoto.token && (
+                                                    <div className="debug-item">
+                                                        <span className="debug-key">视频 Token:</span>
+                                                        <span className="debug-value">{media.livePhoto.token}</span>
+                                                    </div>
+                                                )}
+                                                {media.livePhoto.key && (
+                                                    <div className="debug-item">
+                                                        <span className="debug-key">视频 Key:</span>
+                                                        <span className="debug-value">{media.livePhoto.key}</span>
+                                                    </div>
+                                                )}
+                                            </div>
+                                        )}
+                                    </div>
+                                ))}
+                            </div>
+
+                            {/* 原始 XML */}
+                            {debugPost.rawXml && (
+                                <div className="debug-section">
+                                    <h4> 原始 XML 数据</h4>
+                                    <pre className="json-code">{(() => {
+                                        // XML 缩进格式化
+                                        let formatted = '';
+                                        let indent = 0;
+                                        const tab = '  ';
+                                        const parts = debugPost.rawXml.split(/(<[^>]+>)/g).filter(p => p.trim());
+
+                                        for (const part of parts) {
+                                            if (!part.startsWith('<')) {
+                                                if (part.trim()) formatted += part;
+                                                continue;
+                                            }
+
+                                            if (part.startsWith('</')) {
+                                                indent = Math.max(0, indent - 1);
+                                                formatted += '\n' + tab.repeat(indent) + part;
+                                            } else if (part.endsWith('/>')) {
+                                                formatted += '\n' + tab.repeat(indent) + part;
+                                            } else {
+                                                formatted += '\n' + tab.repeat(indent) + part;
+                                                indent++;
+                                            }
+                                        }
+
+                                        return formatted.trim();
+                                    })()}</pre>
+                                    <button
+                                        className="copy-json-btn"
+                                        onClick={() => {
+                                            navigator.clipboard.writeText(debugPost.rawXml || '');
+                                            alert('已复制 XML 到剪贴板');
+                                        }}
+                                    >
+                                        复制 XML
+                                    </button>
+                                </div>
+                            )}
+                        </div>
+                    </div>
+                </div>
+            )}
+        </div>
+    )
+}

src/pages/VideoWindow.scss

@@ -0,0 +1,216 @@
+.video-window-container {
+  width: 100vw;
+  height: 100vh;
+  background-color: #000;
+  display: flex;
+  flex-direction: column;
+  overflow: hidden;
+  user-select: none;
+
+  .title-bar {
+    height: 40px;
+    min-height: 40px;
+    display: flex;
+    background: #1a1a1a;
+    padding-right: 140px;
+    position: relative;
+    z-index: 10;
+
+    .window-drag-area {
+      flex: 1;
+      height: 100%;
+      -webkit-app-region: drag;
+    }
+  }
+
+  .video-viewport {
+    flex: 1;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    position: relative;
+    cursor: pointer;
+    background: #000;
+    overflow: hidden;
+    min-height: 0; // 重要：让 flex 子元素可以收缩
+
+    video {
+      max-width: 100%;
+      max-height: 100%;
+      width: auto;
+      height: auto;
+      object-fit: contain;
+    }
+
+    .video-loading-overlay,
+    .video-error-overlay {
+      position: absolute;
+      inset: 0;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      background: rgba(0, 0, 0, 0.5);
+      z-index: 5;
+    }
+
+    .video-error-overlay {
+      color: #ff6b6b;
+      font-size: 14px;
+    }
+
+    .spinner {
+      width: 40px;
+      height: 40px;
+      border: 3px solid rgba(255, 255, 255, 0.2);
+      border-top-color: #fff;
+      border-radius: 50%;
+      animation: spin 1s linear infinite;
+    }
+
+    .play-overlay {
+      position: absolute;
+      inset: 0;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      background: rgba(0, 0, 0, 0.3);
+      opacity: 0;
+      transition: opacity 0.2s;
+      z-index: 4;
+
+      svg {
+        filter: drop-shadow(0 2px 8px rgba(0, 0, 0, 0.5));
+      }
+    }
+
+    &:hover .play-overlay {
+      opacity: 1;
+    }
+  }
+
+  .video-controls {
+    position: absolute;
+    bottom: 0;
+    left: 0;
+    right: 0;
+    background: linear-gradient(to top, rgba(0, 0, 0, 0.85), rgba(0, 0, 0, 0.4) 60%, transparent);
+    padding: 40px 16px 12px;
+    opacity: 0;
+    transition: opacity 0.25s;
+    z-index: 6;
+
+    .progress-bar {
+      height: 16px;
+      display: flex;
+      align-items: center;
+      cursor: pointer;
+      margin-bottom: 8px;
+
+      .progress-track {
+        flex: 1;
+        height: 3px;
+        background: rgba(255, 255, 255, 0.3);
+        border-radius: 2px;
+        overflow: hidden;
+        transition: height 0.15s;
+
+        .progress-fill {
+          height: 100%;
+          background: var(--primary, #4a9eff);
+          border-radius: 2px;
+        }
+      }
+
+      &:hover .progress-track {
+        height: 5px;
+      }
+    }
+
+    .controls-row {
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+    }
+
+    .controls-left,
+    .controls-right {
+      display: flex;
+      align-items: center;
+      gap: 6px;
+    }
+
+    button {
+      background: transparent;
+      border: none;
+      color: #fff;
+      cursor: pointer;
+      padding: 6px;
+      border-radius: 4px;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      transition: background 0.2s;
+
+      &:hover {
+        background: rgba(255, 255, 255, 0.15);
+      }
+    }
+
+    .time-display {
+      color: rgba(255, 255, 255, 0.9);
+      font-size: 12px;
+      font-variant-numeric: tabular-nums;
+      margin-left: 4px;
+    }
+
+    .volume-control {
+      display: flex;
+      align-items: center;
+      gap: 4px;
+
+      .volume-slider {
+        width: 60px;
+        height: 3px;
+        appearance: none;
+        -webkit-appearance: none;
+        background: rgba(255, 255, 255, 0.3);
+        border-radius: 2px;
+        cursor: pointer;
+
+        &::-webkit-slider-thumb {
+          appearance: none;
+          -webkit-appearance: none;
+          width: 10px;
+          height: 10px;
+          background: #fff;
+          border-radius: 50%;
+          cursor: pointer;
+        }
+      }
+    }
+  }
+
+  // 鼠标悬停时显示控制栏
+  &:hover .video-controls {
+    opacity: 1;
+  }
+
+  // 播放时如果鼠标不动，隐藏控制栏
+  &.hide-controls .video-controls {
+    opacity: 0;
+  }
+}
+
+.video-window-empty {
+  height: 100vh;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  color: rgba(255, 255, 255, 0.6);
+  background-color: #000;
+}
+
+@keyframes spin {
+  from { transform: rotate(0deg); }
+  to { transform: rotate(360deg); }
+}

src/pages/VideoWindow.tsx

@@ -0,0 +1,199 @@
+import { useState, useEffect, useRef, useCallback } from 'react'
+import { useSearchParams } from 'react-router-dom'
+import { Play, Pause, Volume2, VolumeX, RotateCcw } from 'lucide-react'
+import './VideoWindow.scss'
+
+export default function VideoWindow() {
+    const [searchParams] = useSearchParams()
+    const videoPath = searchParams.get('videoPath')
+    const [isPlaying, setIsPlaying] = useState(false)
+    const [isMuted, setIsMuted] = useState(false)
+    const [currentTime, setCurrentTime] = useState(0)
+    const [duration, setDuration] = useState(0)
+    const [volume, setVolume] = useState(1)
+    const [isLoading, setIsLoading] = useState(true)
+    const [error, setError] = useState<string | null>(null)
+    const videoRef = useRef<HTMLVideoElement>(null)
+    const progressRef = useRef<HTMLDivElement>(null)
+
+    // 格式化时间
+    const formatTime = (seconds: number) => {
+        const mins = Math.floor(seconds / 60)
+        const secs = Math.floor(seconds % 60)
+        return `${mins}:${secs.toString().padStart(2, '0')}`
+    }
+
+    //播放/暂停
+    const togglePlay = useCallback(() => {
+        if (!videoRef.current) return
+        if (isPlaying) {
+            videoRef.current.pause()
+        } else {
+            videoRef.current.play()
+        }
+    }, [isPlaying])
+
+    // 静音切换
+    const toggleMute = useCallback(() => {
+        if (!videoRef.current) return
+        videoRef.current.muted = !isMuted
+        setIsMuted(!isMuted)
+    }, [isMuted])
+
+    // 进度条点击
+    const handleProgressClick = useCallback((e: React.MouseEvent<HTMLDivElement>) => {
+        if (!videoRef.current || !progressRef.current) return
+        e.stopPropagation()
+        const rect = progressRef.current.getBoundingClientRect()
+        const percent = (e.clientX - rect.left) / rect.width
+        videoRef.current.currentTime = percent * duration
+    }, [duration])
+
+    // 音量调节
+    const handleVolumeChange = useCallback((e: React.ChangeEvent<HTMLInputElement>) => {
+        const newVolume = parseFloat(e.target.value)
+        setVolume(newVolume)
+        if (videoRef.current) {
+            videoRef.current.volume = newVolume
+            setIsMuted(newVolume === 0)
+        }
+    }, [])
+
+    // 重新播放
+    const handleReplay = useCallback(() => {
+        if (!videoRef.current) return
+        videoRef.current.currentTime = 0
+        videoRef.current.play()
+    }, [])
+
+    // 快捷键
+    useEffect(() => {
+        const handleKeyDown = (e: KeyboardEvent) => {
+            if (e.key === 'Escape') window.electronAPI.window.close()
+            if (e.key === ' ') {
+                e.preventDefault()
+                togglePlay()
+            }
+            if (e.key === 'm' || e.key === 'M') toggleMute()
+            if (e.key === 'ArrowLeft' && videoRef.current) {
+                videoRef.current.currentTime -= 5
+            }
+            if (e.key === 'ArrowRight' && videoRef.current) {
+                videoRef.current.currentTime += 5
+            }
+            if (e.key === 'ArrowUp' && videoRef.current) {
+                videoRef.current.volume = Math.min(1, videoRef.current.volume + 0.1)
+                setVolume(videoRef.current.volume)
+            }
+            if (e.key === 'ArrowDown' && videoRef.current) {
+                videoRef.current.volume = Math.max(0, videoRef.current.volume - 0.1)
+                setVolume(videoRef.current.volume)
+            }
+        }
+        window.addEventListener('keydown', handleKeyDown)
+        return () => window.removeEventListener('keydown', handleKeyDown)
+    }, [togglePlay, toggleMute])
+
+    if (!videoPath) {
+        return (
+            <div className="video-window-empty">
+                <span>无效的视频路径</span>
+            </div>
+        )
+    }
+
+    const progress = duration > 0 ? (currentTime / duration) * 100 : 0
+
+    return (
+        <div className="video-window-container">
+            <div className="title-bar">
+                <div className="window-drag-area"></div>
+            </div>
+
+            <div className="video-viewport" onClick={togglePlay}>
+                {isLoading && (
+                    <div className="video-loading-overlay">
+                        <div className="spinner"></div>
+                    </div>
+                )}
+                {error && (
+                    <div className="video-error-overlay">
+                        <span>{error}</span>
+                    </div>
+                )}
+                <video
+                    ref={videoRef}
+                    src={videoPath}
+                    onLoadedMetadata={(e) => {
+                        const video = e.currentTarget
+                        setDuration(video.duration)
+                        setIsLoading(false)
+                        // 根据视频尺寸调整窗口大小
+                        if (video.videoWidth && video.videoHeight) {
+                            window.electronAPI.window.resizeToFitVideo(video.videoWidth, video.videoHeight)
+                        }
+                    }}
+                    onTimeUpdate={(e) => setCurrentTime(e.currentTarget.currentTime)}
+                    onPlay={() => setIsPlaying(true)}
+                    onPause={() => setIsPlaying(false)}
+                    onEnded={() => setIsPlaying(false)}
+                    onError={() => {
+                        setError('视频加载失败')
+                        setIsLoading(false)
+                    }}
+                    onWaiting={() => setIsLoading(true)}
+                    onCanPlay={() => setIsLoading(false)}
+                    autoPlay
+                />
+                {!isPlaying && !isLoading && !error && (
+                    <div className="play-overlay">
+                        <Play size={64} fill="white" />
+                    </div>
+                )}
+
+                <div className="video-controls" onClick={(e) => e.stopPropagation()}>
+                    <div
+                        className="progress-bar"
+                        ref={progressRef}
+                        onClick={handleProgressClick}
+                    >
+                        <div className="progress-track">
+                            <div className="progress-fill" style={{ width: `${progress}%` }}></div>
+                        </div>
+                    </div>
+
+                    <div className="controls-row">
+                        <div className="controls-left">
+                            <button onClick={togglePlay} title={isPlaying ? '暂停 (空格)' : '播放 (空格)'}>
+                                {isPlaying ? <Pause size={18} /> : <Play size={18} />}
+                            </button>
+                            <button onClick={handleReplay} title="重新播放">
+                                <RotateCcw size={16} />
+                            </button>
+                            <span className="time-display">
+                                {formatTime(currentTime)} / {formatTime(duration)}
+                            </span>
+                        </div>
+
+                        <div className="controls-right">
+                            <div className="volume-control">
+                                <button onClick={toggleMute} title={isMuted ? '取消静音 (M)' : '静音 (M)'}>
+                                    {isMuted || volume === 0 ? <VolumeX size={16} /> : <Volume2 size={16} />}
+                                </button>
+                                <input
+                                    type="range"
+                                    min="0"
+                                    max="1"
+                                    step="0.1"
+                                    value={isMuted ? 0 : volume}
+                                    onChange={handleVolumeChange}
+                                    className="volume-slider"
+                                />
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    )
+}

src/pages/WelcomePage.tsx

@@ -15,7 +15,8 @@ const steps = [
   { id: 'db', title: '数据库目录', desc: '定位 xwechat_files 目录' },
   { id: 'cache', title: '缓存目录', desc: '设置本地缓存存储位置（可选）' },
   { id: 'key', title: '解密密钥', desc: '获取密钥与自动识别账号' },
-  { id: 'image', title: '图片密钥', desc: '获取 XOR 与 AES 密钥' }
+  { id: 'image', title: '图片密钥', desc: '获取 XOR 与 AES 密钥' },
+  { id: 'security', title: '安全防护', desc: '保护你的数据' }
 ]
 
 interface WelcomePageProps {
@@ -46,11 +47,69 @@ function WelcomePage({ standalone = false }: WelcomePageProps) {
   const [imageKeyStatus, setImageKeyStatus] = useState('')
   const [isManualStartPrompt, setIsManualStartPrompt] = useState(false)
 
+  // 安全相关 state
+  const [enableAuth, setEnableAuth] = useState(false)
+  const [authPassword, setAuthPassword] = useState('')
+  const [authConfirmPassword, setAuthConfirmPassword] = useState('')
+  const [enableHello, setEnableHello] = useState(false)
+  const [helloAvailable, setHelloAvailable] = useState(false)
+  const [isSettingHello, setIsSettingHello] = useState(false)
+
+  // 检查 Hello 可用性
   useEffect(() => {
-    const removeDb = window.electronAPI.key.onDbKeyStatus((payload) => {
+    if (window.PublicKeyCredential) {
+      void PublicKeyCredential.isUserVerifyingPlatformAuthenticatorAvailable().then(setHelloAvailable)
+    }
+  }, [])
+
+  async function sha256(message: string) {
+    const msgBuffer = new TextEncoder().encode(message)
+    const hashBuffer = await crypto.subtle.digest('SHA-256', msgBuffer)
+    const hashArray = Array.from(new Uint8Array(hashBuffer))
+    const hashHex = hashArray.map(b => b.toString(16).padStart(2, '0')).join('')
+    return hashHex
+  }
+
+  const handleSetupHello = async () => {
+    setIsSettingHello(true)
+    try {
+      // 注册凭证 (WebAuthn)
+      const challenge = new Uint8Array(32)
+      window.crypto.getRandomValues(challenge)
+
+      const credential = await navigator.credentials.create({
+        publicKey: {
+          challenge,
+          rp: { name: 'WeFlow', id: 'localhost' },
+          user: {
+            id: new Uint8Array([1]),
+            name: 'user',
+            displayName: 'User'
+          },
+          pubKeyCredParams: [{ alg: -7, type: 'public-key' }],
+          authenticatorSelection: { userVerification: 'required' },
+          timeout: 60000
+        }
+      })
+
+      if (credential) {
+        setEnableHello(true)
+        // 成功提示?
+      }
+    } catch (e: any) {
+      if (e.name !== 'NotAllowedError') {
+        setError('Windows Hello 设置失败: ' + e.message)
+      }
+    } finally {
+      setIsSettingHello(false)
+    }
+  }
+
+  useEffect(() => {
+    const removeDb = window.electronAPI.key.onDbKeyStatus((payload: { message: string; level: number }) => {
       setDbKeyStatus(payload.message)
     })
-    const removeImage = window.electronAPI.key.onImageKeyStatus((payload) => {
+    const removeImage = window.electronAPI.key.onImageKeyStatus((payload: { message: string }) => {
       setImageKeyStatus(payload.message)
     })
     return () => {
@@ -227,6 +286,12 @@ function WelcomePage({ standalone = false }: WelcomePageProps) {
     if (currentStep.id === 'cache') return true
     if (currentStep.id === 'key') return decryptKey.length === 64 && Boolean(wxid)
     if (currentStep.id === 'image') return true
+    if (currentStep.id === 'security') {
+      if (enableAuth) {
+        return authPassword.length > 0 && authPassword === authConfirmPassword
+      }
+      return true
+    }
     return false
   }
 
@@ -269,15 +334,23 @@ function WelcomePage({ standalone = false }: WelcomePageProps) {
       await configService.setDecryptKey(decryptKey)
       await configService.setMyWxid(wxid)
       await configService.setCachePath(cachePath)
-      if (imageXorKey) {
+      const parsedXorKey = imageXorKey ? parseInt(imageXorKey.replace(/^0x/i, ''), 16) : null
-        const parsed = parseInt(imageXorKey.replace(/^0x/i, ''), 16)
+      await configService.setImageXorKey(typeof parsedXorKey === 'number' && !Number.isNaN(parsedXorKey) ? parsedXorKey : 0)
-        if (!Number.isNaN(parsed)) {
+      await configService.setImageAesKey(imageAesKey || '')
-          await configService.setImageXorKey(parsed)
+      await configService.setWxidConfig(wxid, {
-        }
+        decryptKey,
-      }
+        imageXorKey: typeof parsedXorKey === 'number' && !Number.isNaN(parsedXorKey) ? parsedXorKey : 0,
-      if (imageAesKey) {
+        imageAesKey
-        await configService.setImageAesKey(imageAesKey)
+      })
+
+      // 保存安全配置
+      if (enableAuth && authPassword) {
+        const hash = await sha256(authPassword)
+        await configService.setAuthEnabled(true)
+        await configService.setAuthPassword(hash)
+        await configService.setAuthUseHello(enableHello)
       }
+
       await configService.setOnboardingDone(true)
 
       setDbConnected(true, dbPath)
@@ -313,6 +386,67 @@ function WelcomePage({ standalone = false }: WelcomePageProps) {
   if (isDbConnected) {
     return (
       <div className={rootClassName}>
+        <div className="welcome-container">
+          {showWindowControls && (
+            <div className="window-controls">
+              <button type="button" className="window-btn" onClick={handleMinimize} aria-label="最小化">
+                <Minus size={14} />
+              </button>
+              <button type="button" className="window-btn is-close" onClick={handleCloseWindow} aria-label="关闭">
+                <X size={14} />
+              </button>
+            </div>
+          )}
+          <div className="welcome-sidebar">
+            <div className="sidebar-header">
+              <img src="./logo.png" alt="WeFlow" className="sidebar-logo" />
+              <div className="sidebar-brand">
+                <span className="brand-name">WeFlow</span>
+                <span className="brand-tag">Connected</span>
+              </div>
+            </div>
+
+            <div className="sidebar-spacer" style={{ flex: 1 }} />
+
+            <div className="sidebar-footer">
+              <ShieldCheck size={14} />
+              <span>本地安全存储</span>
+            </div>
+          </div>
+
+          <div className="welcome-content success-content">
+            <div className="success-body">
+              <div className="success-icon">
+                <CheckCircle2 size={48} />
+              </div>
+              <h1 className="success-title">配置已完成</h1>
+              <p className="success-desc">数据库已连接，你可以直接进入首页使用全部功能。</p>
+
+              <button
+                className="btn btn-primary btn-large"
+                onClick={() => {
+                  if (standalone) {
+                    setIsClosing(true)
+                    setTimeout(() => {
+                      window.electronAPI.window.completeOnboarding()
+                    }, 450)
+                  } else {
+                    navigate('/home')
+                  }
+                }}
+              >
+                进入首页 <ArrowRight size={18} />
+              </button>
+            </div>
+          </div>
+        </div>
+      </div>
+    )
+  }
+
+  return (
+    <div className={rootClassName}>
+      <div className="welcome-container">
         {showWindowControls && (
           <div className="window-controls">
             <button type="button" className="window-btn" onClick={handleMinimize} aria-label="最小化">
@@ -323,231 +457,272 @@ function WelcomePage({ standalone = false }: WelcomePageProps) {
             </button>
           </div>
         )}
-        <div className="welcome-shell">
+        <div className="welcome-sidebar">
-          <div className="welcome-panel">
+          <div className="sidebar-header">
-            <div className="panel-header">
+            <img src="./logo.png" alt="WeFlow" className="sidebar-logo" />
-              <img src="./logo.png" alt="WeFlow" className="panel-logo" />
+            <div className="sidebar-brand">
-              <div>
+              <span className="brand-name">WeFlow</span>
-                <p className="panel-kicker">WeFlow</p>
+              <span className="brand-tag">Setup</span>
-                <h1>已连接数据库</h1>
-              </div>
             </div>
-            <div className="panel-note">
-              <CheckCircle2 size={16} />
-              <span>配置已完成，可直接进入首页</span>
-            </div>
-            <button
-              className="btn btn-primary btn-full"
-              onClick={() => {
-                if (standalone) {
-                  setIsClosing(true)
-                  setTimeout(() => {
-                    window.electronAPI.window.completeOnboarding()
-                  }, 450)
-                } else {
-                  navigate('/home')
-                }
-              }}
-            >
-              进入首页
-            </button>
           </div>
-        </div>
-      </div>
-    )
-  }
 
-  return (
+          <div className="sidebar-nav">
-    <div className={rootClassName}>
-      {showWindowControls && (
-        <div className="window-controls">
-          <button type="button" className="window-btn" onClick={handleMinimize} aria-label="最小化">
-            <Minus size={14} />
-          </button>
-          <button type="button" className="window-btn is-close" onClick={handleCloseWindow} aria-label="关闭">
-            <X size={14} />
-          </button>
-        </div>
-      )}
-      <div className="welcome-shell">
-        <div className="welcome-panel">
-          <div className="panel-header">
-            <img src="./logo.png" alt="WeFlow" className="panel-logo" />
-            <div>
-              <p className="panel-kicker">首次配置</p>
-              <h1>WeFlow 初始引导</h1>
-              <p className="panel-subtitle">一步一步完成数据库与密钥设置</p>
-            </div>
-          </div>
-          <div className="step-list">
             {steps.map((step, index) => (
-              <div key={step.id} className={`step-item ${index === stepIndex ? 'active' : ''} ${index < stepIndex ? 'done' : ''}`}>
+              <div key={step.id} className={`nav-item ${index === stepIndex ? 'active' : ''} ${index < stepIndex ? 'completed' : ''}`}>
-                <div className="step-index">{index < stepIndex ? <CheckCircle2 size={14} /> : index + 1}</div>
+                <div className="nav-indicator">
-                <div>
+                  {index < stepIndex ? <CheckCircle2 size={14} /> : <div className="dot" />}
-                  <div className="step-title">{step.title}</div>
+                </div>
-                  <div className="step-desc">{step.desc}</div>
+                <div className="nav-info">
+                  <div className="nav-title">{step.title}</div>
+                  <div className="nav-desc">{step.desc}</div>
                 </div>
               </div>
             ))}
           </div>
-          <div className="panel-foot">
+
-            <ShieldCheck size={16} />
+          <div className="sidebar-footer">
+            <ShieldCheck size={14} />
             <span>数据仅在本地处理，不上传服务器</span>
           </div>
         </div>
 
-        <div className="setup-card">
+        <div className="welcome-content">
-          <div className="setup-header">
+          <div className="content-header">
-            <div className="setup-icon">
-              {currentStep.id === 'intro' && <Sparkles size={18} />}
-              {currentStep.id === 'db' && <Database size={18} />}
-              {currentStep.id === 'cache' && <HardDrive size={18} />}
-              {currentStep.id === 'key' && <KeyRound size={18} />}
-              {currentStep.id === 'image' && <ShieldCheck size={18} />}
-            </div>
             <div>
               <h2>{currentStep.title}</h2>
-              <p>{currentStep.desc}</p>
+              <p className="header-desc">{currentStep.desc}</p>
             </div>
           </div>
 
-          {currentStep.id === 'intro' && (
+          <div className="content-body">
-            <div className="setup-body">
+            {currentStep.id === 'intro' && (
-              <div className="intro-card">
+              <div className="intro-block">
-                <Wand2 size={18} />
+                {/* 内容移至底部 */}
-                <div>
+              </div>
-                  <h3>准备好了吗？</h3>
+            )}
-                  <p>接下来只需配置数据库目录和获取解密密钥。</p>
+
+            {currentStep.id === 'db' && (
+              <div className="form-group">
+                <label className="field-label">数据库根目录</label>
+                <div className="input-group">
+                  <input
+                    type="text"
+                    className="field-input"
+                    placeholder="例如：C:\\Users\\xxx\\Documents\\xwechat_files"
+                    value={dbPath}
+                    onChange={(e) => setDbPath(e.target.value)}
+                  />
                 </div>
-              </div>
+                <div className="action-row">
-            </div>
+                  <button className="btn btn-secondary" onClick={handleAutoDetectPath} disabled={isDetectingPath}>
-          )}
+                    <FolderSearch size={16} /> {isDetectingPath ? '检测中...' : '自动检测'}
-
+                  </button>
-          {currentStep.id === 'db' && (
+                  <button className="btn btn-secondary" onClick={handleSelectPath}>
-            <div className="setup-body">
+                    <FolderOpen size={16} /> 浏览...
-              <label className="field-label">数据库根目录</label>
-              <input
-                type="text"
-                className="field-input"
-                placeholder="例如：C:\\Users\\xxx\\Documents\\xwechat_files"
-                value={dbPath}
-                onChange={(e) => setDbPath(e.target.value)}
-              />
-              <div className="button-row">
-                <button className="btn btn-secondary" onClick={handleAutoDetectPath} disabled={isDetectingPath}>
-                  <FolderSearch size={16} /> {isDetectingPath ? '检测中...' : '自动检测'}
-                </button>
-                <button className="btn btn-primary" onClick={handleSelectPath}>
-                  <FolderOpen size={16} /> 浏览选择
-                </button>
-              </div>
-              <div className="field-hint">建议选择包含 xwechat_files 的目录</div>
-            </div>
-          )}
-
-          {currentStep.id === 'cache' && (
-            <div className="setup-body">
-              <label className="field-label">缓存目录</label>
-              <input
-                type="text"
-                className="field-input"
-                placeholder="留空使用默认目录"
-                value={cachePath}
-                onChange={(e) => setCachePath(e.target.value)}
-              />
-              <div className="button-row">
-                <button className="btn btn-primary" onClick={handleSelectCachePath}>
-                  <FolderOpen size={16} /> 浏览选择
-                </button>
-                <button className="btn btn-secondary" onClick={() => setCachePath('')}>
-                  <RotateCcw size={16} /> 使用默认
-                </button>
-              </div>
-              <div className="field-hint">用于头像、表情与图片缓存，留空使用默认目录</div>
-            </div>
-          )}
-
-          {currentStep.id === 'key' && (
-            <div className="setup-body">
-              <label className="field-label">微信账号 wxid</label>
-              <input
-                type="text"
-                className="field-input"
-                placeholder="获取密钥后将自动填充"
-                value={wxid}
-                onChange={(e) => setWxid(e.target.value)}
-              />
-              <label className="field-label">解密密钥</label>
-              <div className="field-with-toggle">
-                <input
-                  type={showDecryptKey ? 'text' : 'password'}
-                  className="field-input"
-                  placeholder="64 位十六进制密钥"
-                  value={decryptKey}
-                  onChange={(e) => setDecryptKey(e.target.value.trim())}
-                />
-                <button type="button" className="toggle-btn" onClick={() => setShowDecryptKey(!showDecryptKey)}>
-                  {showDecryptKey ? <EyeOff size={14} /> : <Eye size={14} />}
-                </button>
-              </div>
-
-              {isManualStartPrompt ? (
-                <div className="manual-prompt">
-                  <p className="prompt-text">未能自动启动微信，请手动启动并登录后点击下方确认</p>
-                  <button className="btn btn-primary" onClick={handleManualConfirm}>
-                    我已启动微信，继续检测
                   </button>
                 </div>
-              ) : (
+
-                <button className="btn btn-secondary btn-inline" onClick={handleAutoGetDbKey} disabled={isFetchingDbKey}>
+                <div className="field-hint">请选择微信-设置-存储位置对应的目录</div>
-                  {isFetchingDbKey ? '获取中...' : '自动获取密钥'}
+                <div className="field-hint warning">
+                  目录路径不可包含中文，如有中文请先在微信中迁移至全英文目录
+                </div>
+              </div>
+            )}
+
+            {currentStep.id === 'cache' && (
+              <div className="form-group">
+                <label className="field-label">缓存目录</label>
+                <div className="input-group">
+                  <input
+                    type="text"
+                    className="field-input"
+                    placeholder="留空即使用默认目录"
+                    value={cachePath}
+                    onChange={(e) => setCachePath(e.target.value)}
+                  />
+                </div>
+                <div className="action-row">
+                  <button className="btn btn-secondary" onClick={handleSelectCachePath}>
+                    <FolderOpen size={16} /> 浏览
+                  </button>
+                  <button className="btn btn-secondary" onClick={() => setCachePath('')}>
+                    <RotateCcw size={16} /> 重置默认
+                  </button>
+                </div>
+                <div className="field-hint">用于头像、表情与图片缓存</div>
+              </div>
+            )}
+
+            {currentStep.id === 'key' && (
+              <div className="form-group">
+                <label className="field-label">微信账号 (Wxid)</label>
+                <input
+                  type="text"
+                  className="field-input"
+                  placeholder="等待获取..."
+                  value={wxid}
+                  readOnly
+                  onChange={(e) => setWxid(e.target.value)}
+                />
+
+                <label className="field-label mt-4">解密密钥</label>
+                <div className="field-with-toggle">
+                  <input
+                    type={showDecryptKey ? 'text' : 'password'}
+                    className="field-input"
+                    placeholder="64 位十六进制密钥"
+                    value={decryptKey}
+                    onChange={(e) => setDecryptKey(e.target.value.trim())}
+                  />
+                  <button type="button" className="toggle-btn" onClick={() => setShowDecryptKey(!showDecryptKey)}>
+                    {showDecryptKey ? <EyeOff size={16} /> : <Eye size={16} />}
+                  </button>
+                </div>
+
+                <div className="key-actions">
+                  {isManualStartPrompt ? (
+                    <div className="manual-prompt">
+                      <p>未能自动启动微信，请手动启动并登录</p>
+                      <button className="btn btn-primary" onClick={handleManualConfirm}>
+                        我已登录，继续
+                      </button>
+                    </div>
+                  ) : (
+                    <button className="btn btn-secondary btn-block" onClick={handleAutoGetDbKey} disabled={isFetchingDbKey}>
+                      {isFetchingDbKey ? '正在获取...' : '自动获取密钥'}
+                    </button>
+                  )}
+                </div>
+
+                {dbKeyStatus && <div className="status-message">{dbKeyStatus}</div>}
+                <div className="field-hint">点击自动获取后微信将重启，请留意弹窗提示</div>
+              </div>
+            )}
+
+            {currentStep.id === 'security' && (
+              <div className="form-group">
+                <div className="security-toggle-header" style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center', marginBottom: 16 }}>
+                  <div className="toggle-info">
+                    <label className="field-label" style={{ marginBottom: 0 }}>启用应用锁</label>
+                    <div className="field-hint">每次启动应用时需要验证密码</div>
+                  </div>
+                  <label className="switch">
+                    <input type="checkbox" checked={enableAuth} onChange={e => setEnableAuth(e.target.checked)} />
+                    <span className="switch-slider" />
+                  </label>
+                </div>
+
+                {enableAuth && (
+                  <div className="security-settings" style={{ marginTop: 20, padding: 16, backgroundColor: 'var(--bg-secondary)', borderRadius: 8 }}>
+                    <div className="form-group">
+                      <label className="field-label">应用密码</label>
+                      <input
+                        type="password"
+                        className="field-input"
+                        placeholder="请输入密码"
+                        value={authPassword}
+                        onChange={e => setAuthPassword(e.target.value)}
+                      />
+                    </div>
+                    <div className="form-group">
+                      <label className="field-label">确认密码</label>
+                      <input
+                        type="password"
+                        className="field-input"
+                        placeholder="请再次输入密码"
+                        value={authConfirmPassword}
+                        onChange={e => setAuthConfirmPassword(e.target.value)}
+                      />
+                      {authPassword && authConfirmPassword && authPassword !== authConfirmPassword && (
+                        <div className="error-text" style={{ color: '#ff4d4f', fontSize: 12, marginTop: 4 }}>两次密码不一致</div>
+                      )}
+                    </div>
+
+                    <div className="divider" style={{ margin: '20px 0', borderTop: '1px solid var(--border-color)' }}></div>
+
+                    <div className="security-toggle-header" style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center' }}>
+                      <div className="toggle-info">
+                        <label className="field-label" style={{ marginBottom: 0 }}>Windows Hello</label>
+                        <div className="field-hint">使用面容、指纹或 PIN 码快速解锁</div>
+                      </div>
+
+                      {enableHello ? (
+                        <div style={{ color: '#52c41a', display: 'flex', alignItems: 'center', gap: 6 }}>
+                          <CheckCircle2 size={16} /> 已开启
+                          <button className="btn btn-ghost btn-sm" onClick={() => setEnableHello(false)} style={{ padding: '2px 8px', height: 24, fontSize: 12 }}>关闭</button>
+                        </div>
+                      ) : (
+                        <button
+                          className="btn btn-secondary btn-sm"
+                          disabled={!helloAvailable || isSettingHello}
+                          onClick={handleSetupHello}
+                        >
+                          {isSettingHello ? '设置中...' : (helloAvailable ? '点击开启' : '不可用')}
+                        </button>
+                      )}
+                    </div>
+                    {!helloAvailable && <div className="field-hint warning"> 当前设备不支持 Windows Hello 或未设置 PIN 码</div>}
+                  </div>
+                )}
+              </div>
+            )}
+
+            {currentStep.id === 'image' && (
+              <div className="form-group">
+                <div className="grid-2">
+                  <div>
+                    <label className="field-label">图片 XOR 密钥</label>
+                    <input
+                      type="text"
+                      className="field-input"
+                      placeholder="0x..."
+                      value={imageXorKey}
+                      onChange={(e) => setImageXorKey(e.target.value)}
+                    />
+                  </div>
+                  <div>
+                    <label className="field-label">图片 AES 密钥</label>
+                    <input
+                      type="text"
+                      className="field-input"
+                      placeholder="16位密钥"
+                      value={imageAesKey}
+                      onChange={(e) => setImageAesKey(e.target.value)}
+                    />
+                  </div>
+                </div>
+
+                <button className="btn btn-secondary btn-block mt-4" onClick={handleAutoGetImageKey} disabled={isFetchingImageKey}>
+                  {isFetchingImageKey ? '扫描中...' : '自动获取图片密钥'}
                 </button>
-              )}
 
-              {dbKeyStatus && <div className="field-hint status-text">{dbKeyStatus}</div>}
+                {imageKeyStatus && <div className="status-message">{imageKeyStatus}</div>}
-              <div className="field-hint">获取密钥会自动识别最近登录的账号</div>
+                <div className="field-hint">请在微信中打开几张图片后再点击获取</div>
-            </div>
+              </div>
-          )}
+            )}
-
+          </div>
-          {currentStep.id === 'image' && (
-            <div className="setup-body">
-              <label className="field-label">图片 XOR 密钥</label>
-              <input
-                type="text"
-                className="field-input"
-                placeholder="例如：0xA4"
-                value={imageXorKey}
-                onChange={(e) => setImageXorKey(e.target.value)}
-              />
-              <label className="field-label">图片 AES 密钥</label>
-              <input
-                type="text"
-                className="field-input"
-                placeholder="16 位密钥"
-                value={imageAesKey}
-                onChange={(e) => setImageAesKey(e.target.value)}
-              />
-              <button className="btn btn-secondary btn-inline" onClick={handleAutoGetImageKey} disabled={isFetchingImageKey}>
-                {isFetchingImageKey ? '获取中...' : '自动获取图片密钥'}
-              </button>
-              {imageKeyStatus && <div className="field-hint status-text">{imageKeyStatus}</div>}
-              <div className="field-hint">如获取失败，请先打开朋友圈图片再重试</div>
-            </div>
-          )}
 
           {error && <div className="error-message">{error}</div>}
 
-          <div className="setup-actions">
+          {currentStep.id === 'intro' && (
-            <button className="btn btn-tertiary" onClick={handleBack} disabled={stepIndex === 0}>
+            <div className="intro-footer">
+              <p>接下来的几个步骤将引导你连接本地微信数据库。</p>
+              <p>WeFlow 需要访问你的本地数据文件以提供分析与导出功能。</p>
+            </div>
+          )}
+
+          <div className="content-actions">
+            <button className="btn btn-ghost" onClick={handleBack} disabled={stepIndex === 0}>
               <ArrowLeft size={16} /> 上一步
             </button>
+
             {stepIndex < steps.length - 1 ? (
               <button className="btn btn-primary" onClick={handleNext} disabled={!canGoNext()}>
                 下一步 <ArrowRight size={16} />
               </button>
             ) : (
               <button className="btn btn-primary" onClick={handleConnect} disabled={isConnecting || !canGoNext()}>
-                {isConnecting ? '连接中...' : '测试并完成'}
+                {isConnecting ? '连接中...' : '完成配置'} <ArrowRight size={16} />
               </button>
             )}
           </div>

src/services/config.ts

@@ -6,6 +6,7 @@ export const CONFIG_KEYS = {
   DECRYPT_KEY: 'decryptKey',
   DB_PATH: 'dbPath',
   MY_WXID: 'myWxid',
+  WXID_CONFIGS: 'wxidConfigs',
   THEME: 'theme',
   THEME_ID: 'themeId',
   LAST_SESSION: 'lastSession',
@@ -15,10 +16,35 @@ export const CONFIG_KEYS = {
   AGREEMENT_ACCEPTED: 'agreementAccepted',
   LOG_ENABLED: 'logEnabled',
   ONBOARDING_DONE: 'onboardingDone',
+  LLM_MODEL_PATH: 'llmModelPath',
   IMAGE_XOR_KEY: 'imageXorKey',
-  IMAGE_AES_KEY: 'imageAesKey'
+  IMAGE_AES_KEY: 'imageAesKey',
+  WHISPER_MODEL_NAME: 'whisperModelName',
+  WHISPER_MODEL_DIR: 'whisperModelDir',
+  WHISPER_DOWNLOAD_SOURCE: 'whisperDownloadSource',
+  AUTO_TRANSCRIBE_VOICE: 'autoTranscribeVoice',
+  TRANSCRIBE_LANGUAGES: 'transcribeLanguages',
+  EXPORT_DEFAULT_FORMAT: 'exportDefaultFormat',
+  EXPORT_DEFAULT_DATE_RANGE: 'exportDefaultDateRange',
+  EXPORT_DEFAULT_MEDIA: 'exportDefaultMedia',
+  EXPORT_DEFAULT_VOICE_AS_TEXT: 'exportDefaultVoiceAsText',
+  EXPORT_DEFAULT_EXCEL_COMPACT_COLUMNS: 'exportDefaultExcelCompactColumns',
+  EXPORT_DEFAULT_TXT_COLUMNS: 'exportDefaultTxtColumns',
+  EXPORT_DEFAULT_CONCURRENCY: 'exportDefaultConcurrency',
+
+  // 安全
+  AUTH_ENABLED: 'authEnabled',
+  AUTH_PASSWORD: 'authPassword',
+  AUTH_USE_HELLO: 'authUseHello'
 } as const
 
+export interface WxidConfig {
+  decryptKey?: string
+  imageXorKey?: number
+  imageAesKey?: string
+  updatedAt?: number
+}
+
 // 获取解密密钥
 export async function getDecryptKey(): Promise<string | null> {
   const value = await config.get(CONFIG_KEYS.DECRYPT_KEY)
@@ -52,6 +78,32 @@ export async function setMyWxid(wxid: string): Promise<void> {
   await config.set(CONFIG_KEYS.MY_WXID, wxid)
 }
 
+export async function getWxidConfigs(): Promise<Record<string, WxidConfig>> {
+  const value = await config.get(CONFIG_KEYS.WXID_CONFIGS)
+  if (value && typeof value === 'object') {
+    return value as Record<string, WxidConfig>
+  }
+  return {}
+}
+
+export async function getWxidConfig(wxid: string): Promise<WxidConfig | null> {
+  if (!wxid) return null
+  const configs = await getWxidConfigs()
+  return configs[wxid] || null
+}
+
+export async function setWxidConfig(wxid: string, configValue: WxidConfig): Promise<void> {
+  if (!wxid) return
+  const configs = await getWxidConfigs()
+  const previous = configs[wxid] || {}
+  configs[wxid] = {
+    ...previous,
+    ...configValue,
+    updatedAt: Date.now()
+  }
+  await config.set(CONFIG_KEYS.WXID_CONFIGS, configs)
+}
+
 // 获取主题
 export async function getTheme(): Promise<'light' | 'dark'> {
   const value = await config.get(CONFIG_KEYS.THEME)
@@ -132,6 +184,50 @@ export async function setLogEnabled(enabled: boolean): Promise<void> {
   await config.set(CONFIG_KEYS.LOG_ENABLED, enabled)
 }
 
+// 获取 LLM 模型路径
+export async function getLlmModelPath(): Promise<string | null> {
+  const value = await config.get(CONFIG_KEYS.LLM_MODEL_PATH)
+  return (value as string) || null
+}
+
+// 设置 LLM 模型路径
+export async function setLlmModelPath(path: string): Promise<void> {
+  await config.set(CONFIG_KEYS.LLM_MODEL_PATH, path)
+}
+
+// 获取 Whisper 模型名称
+export async function getWhisperModelName(): Promise<string | null> {
+  const value = await config.get(CONFIG_KEYS.WHISPER_MODEL_NAME)
+  return (value as string) || null
+}
+
+// 设置 Whisper 模型名称
+export async function setWhisperModelName(name: string): Promise<void> {
+  await config.set(CONFIG_KEYS.WHISPER_MODEL_NAME, name)
+}
+
+// 获取 Whisper 模型目录
+export async function getWhisperModelDir(): Promise<string | null> {
+  const value = await config.get(CONFIG_KEYS.WHISPER_MODEL_DIR)
+  return (value as string) || null
+}
+
+// 设置 Whisper 模型目录
+export async function setWhisperModelDir(dir: string): Promise<void> {
+  await config.set(CONFIG_KEYS.WHISPER_MODEL_DIR, dir)
+}
+
+// 获取 Whisper 下载源
+export async function getWhisperDownloadSource(): Promise<string | null> {
+  const value = await config.get(CONFIG_KEYS.WHISPER_DOWNLOAD_SOURCE)
+  return (value as string) || null
+}
+
+// 设置 Whisper 下载源
+export async function setWhisperDownloadSource(source: string): Promise<void> {
+  await config.set(CONFIG_KEYS.WHISPER_DOWNLOAD_SOURCE, source)
+}
+
 // 清除所有配置
 export async function clearConfig(): Promise<void> {
   await config.clear()
@@ -170,3 +266,136 @@ export async function getOnboardingDone(): Promise<boolean> {
 export async function setOnboardingDone(done: boolean): Promise<void> {
   await config.set(CONFIG_KEYS.ONBOARDING_DONE, done)
 }
+
+// 获取自动语音转文字开关
+export async function getAutoTranscribeVoice(): Promise<boolean> {
+  const value = await config.get(CONFIG_KEYS.AUTO_TRANSCRIBE_VOICE)
+  return value === true
+}
+
+// 设置自动语音转文字开关
+export async function setAutoTranscribeVoice(enabled: boolean): Promise<void> {
+  await config.set(CONFIG_KEYS.AUTO_TRANSCRIBE_VOICE, enabled)
+}
+
+// 获取语音转文字支持的语言列表
+export async function getTranscribeLanguages(): Promise<string[]> {
+  const value = await config.get(CONFIG_KEYS.TRANSCRIBE_LANGUAGES)
+  // 默认只支持中文
+  return (value as string[]) || ['zh']
+}
+
+// 设置语音转文字支持的语言列表
+export async function setTranscribeLanguages(languages: string[]): Promise<void> {
+  await config.set(CONFIG_KEYS.TRANSCRIBE_LANGUAGES, languages)
+}
+
+// 获取导出默认格式
+export async function getExportDefaultFormat(): Promise<string | null> {
+  const value = await config.get(CONFIG_KEYS.EXPORT_DEFAULT_FORMAT)
+  return (value as string) || null
+}
+
+// 设置导出默认格式
+export async function setExportDefaultFormat(format: string): Promise<void> {
+  await config.set(CONFIG_KEYS.EXPORT_DEFAULT_FORMAT, format)
+}
+
+// 获取导出默认时间范围
+export async function getExportDefaultDateRange(): Promise<string | null> {
+  const value = await config.get(CONFIG_KEYS.EXPORT_DEFAULT_DATE_RANGE)
+  return (value as string) || null
+}
+
+// 设置导出默认时间范围
+export async function setExportDefaultDateRange(range: string): Promise<void> {
+  await config.set(CONFIG_KEYS.EXPORT_DEFAULT_DATE_RANGE, range)
+}
+
+// 获取导出默认媒体设置
+export async function getExportDefaultMedia(): Promise<boolean | null> {
+  const value = await config.get(CONFIG_KEYS.EXPORT_DEFAULT_MEDIA)
+  if (typeof value === 'boolean') return value
+  return null
+}
+
+// 设置导出默认媒体设置
+export async function setExportDefaultMedia(enabled: boolean): Promise<void> {
+  await config.set(CONFIG_KEYS.EXPORT_DEFAULT_MEDIA, enabled)
+}
+
+// 获取导出默认语音转文字
+export async function getExportDefaultVoiceAsText(): Promise<boolean | null> {
+  const value = await config.get(CONFIG_KEYS.EXPORT_DEFAULT_VOICE_AS_TEXT)
+  if (typeof value === 'boolean') return value
+  return null
+}
+
+// 设置导出默认语音转文字
+export async function setExportDefaultVoiceAsText(enabled: boolean): Promise<void> {
+  await config.set(CONFIG_KEYS.EXPORT_DEFAULT_VOICE_AS_TEXT, enabled)
+}
+
+// 获取导出默认 Excel 列模式
+export async function getExportDefaultExcelCompactColumns(): Promise<boolean | null> {
+  const value = await config.get(CONFIG_KEYS.EXPORT_DEFAULT_EXCEL_COMPACT_COLUMNS)
+  if (typeof value === 'boolean') return value
+  return null
+}
+
+// 设置导出默认 Excel 列模式
+export async function setExportDefaultExcelCompactColumns(enabled: boolean): Promise<void> {
+  await config.set(CONFIG_KEYS.EXPORT_DEFAULT_EXCEL_COMPACT_COLUMNS, enabled)
+}
+
+// 获取导出默认 TXT 列配置
+export async function getExportDefaultTxtColumns(): Promise<string[] | null> {
+  const value = await config.get(CONFIG_KEYS.EXPORT_DEFAULT_TXT_COLUMNS)
+  return Array.isArray(value) ? (value as string[]) : null
+}
+
+// 设置导出默认 TXT 列配置
+export async function setExportDefaultTxtColumns(columns: string[]): Promise<void> {
+  await config.set(CONFIG_KEYS.EXPORT_DEFAULT_TXT_COLUMNS, columns)
+}
+
+// 获取导出默认并发数
+export async function getExportDefaultConcurrency(): Promise<number | null> {
+  const value = await config.get(CONFIG_KEYS.EXPORT_DEFAULT_CONCURRENCY)
+  if (typeof value === 'number' && Number.isFinite(value)) return value
+  return null
+}
+
+// 设置导出默认并发数
+export async function setExportDefaultConcurrency(concurrency: number): Promise<void> {
+  await config.set(CONFIG_KEYS.EXPORT_DEFAULT_CONCURRENCY, concurrency)
+}
+
+// === 安全相关 ===
+
+export async function getAuthEnabled(): Promise<boolean> {
+  const value = await config.get(CONFIG_KEYS.AUTH_ENABLED)
+  return value === true
+}
+
+export async function setAuthEnabled(enabled: boolean): Promise<void> {
+  await config.set(CONFIG_KEYS.AUTH_ENABLED, enabled)
+}
+
+export async function getAuthPassword(): Promise<string> {
+  const value = await config.get(CONFIG_KEYS.AUTH_PASSWORD)
+  return (value as string) || ''
+}
+
+export async function setAuthPassword(passwordHash: string): Promise<void> {
+  await config.set(CONFIG_KEYS.AUTH_PASSWORD, passwordHash)
+}
+
+export async function getAuthUseHello(): Promise<boolean> {
+  const value = await config.get(CONFIG_KEYS.AUTH_USE_HELLO)
+  return value === true
+}
+
+export async function setAuthUseHello(useHello: boolean): Promise<void> {
+  await config.set(CONFIG_KEYS.AUTH_USE_HELLO, useHello)
+}

src/stores/analyticsStore.ts

@@ -1,4 +1,5 @@
 import { create } from 'zustand'
+import { persist } from 'zustand/middleware'
 
 interface ChatStatistics {
   totalMessages: number
@@ -36,11 +37,11 @@ interface AnalyticsState {
   statistics: ChatStatistics | null
   rankings: ContactRanking[]
   timeDistribution: TimeDistribution | null
-  
+
   // 状态
   isLoaded: boolean
   lastLoadTime: number | null
-  
+
   // Actions
   setStatistics: (data: ChatStatistics) => void
   setRankings: (data: ContactRanking[]) => void
@@ -49,22 +50,29 @@ interface AnalyticsState {
   clearCache: () => void
 }
 
-export const useAnalyticsStore = create<AnalyticsState>((set) => ({
+export const useAnalyticsStore = create<AnalyticsState>()(
-  statistics: null,
+  persist(
-  rankings: [],
+    (set) => ({
-  timeDistribution: null,
+      statistics: null,
-  isLoaded: false,
+      rankings: [],
-  lastLoadTime: null,
+      timeDistribution: null,
+      isLoaded: false,
+      lastLoadTime: null,
 
-  setStatistics: (data) => set({ statistics: data }),
+      setStatistics: (data) => set({ statistics: data }),
-  setRankings: (data) => set({ rankings: data }),
+      setRankings: (data) => set({ rankings: data }),
-  setTimeDistribution: (data) => set({ timeDistribution: data }),
+      setTimeDistribution: (data) => set({ timeDistribution: data }),
-  markLoaded: () => set({ isLoaded: true, lastLoadTime: Date.now() }),
+      markLoaded: () => set({ isLoaded: true, lastLoadTime: Date.now() }),
-  clearCache: () => set({ 
+      clearCache: () => set({
-    statistics: null, 
+        statistics: null,
-    rankings: [], 
+        rankings: [],
-    timeDistribution: null, 
+        timeDistribution: null,
-    isLoaded: false, 
+        isLoaded: false,
-    lastLoadTime: null 
+        lastLoadTime: null
-  }),
+      }),
-}))
+    }),
+    {
+      name: 'analytics-storage',
+    }
+  )
+)

src/stores/appStore.ts

@@ -5,15 +5,38 @@ export interface AppState {
   isDbConnected: boolean
   dbPath: string | null
   myWxid: string | null
-  
+
   // 加载状态
   isLoading: boolean
   loadingText: string
-  
+
+  // 更新状态
+  updateInfo: {
+    hasUpdate: boolean
+    version?: string
+    releaseNotes?: string
+  } | null
+  isDownloading: boolean
+  downloadProgress: any
+  showUpdateDialog: boolean
+  updateError: string | null
+
   // 操作
   setDbConnected: (connected: boolean, path?: string) => void
   setMyWxid: (wxid: string) => void
   setLoading: (loading: boolean, text?: string) => void
+
+  // 更新操作
+  setUpdateInfo: (info: any) => void
+  setIsDownloading: (isDownloading: boolean) => void
+  setDownloadProgress: (progress: any) => void
+  setShowUpdateDialog: (show: boolean) => void
+  setUpdateError: (error: string | null) => void
+
+  // 锁定状态
+  isLocked: boolean
+  setLocked: (locked: boolean) => void
+
   reset: () => void
 }
 
@@ -23,24 +46,46 @@ export const useAppStore = create<AppState>((set) => ({
   myWxid: null,
   isLoading: false,
   loadingText: '',
+  isLocked: false,
 
-  setDbConnected: (connected, path) => set({ 
+  // 更新状态初始化
-    isDbConnected: connected, 
+  updateInfo: null,
-    dbPath: path ?? null 
+  isDownloading: false,
+  downloadProgress: { percent: 0 },
+  showUpdateDialog: false,
+  updateError: null,
+
+  setDbConnected: (connected, path) => set({
+    isDbConnected: connected,
+    dbPath: path ?? null
   }),
-  
+
   setMyWxid: (wxid) => set({ myWxid: wxid }),
-  
+
-  setLoading: (loading, text) => set({ 
+  setLoading: (loading, text) => set({
-    isLoading: loading, 
+    isLoading: loading,
-    loadingText: text ?? '' 
+    loadingText: text ?? ''
   }),
-  
+
+  setLocked: (locked) => set({ isLocked: locked }),
+
+  setUpdateInfo: (info) => set({ updateInfo: info, updateError: null }),
+  setIsDownloading: (isDownloading) => set({ isDownloading: isDownloading }),
+  setDownloadProgress: (progress) => set({ downloadProgress: progress }),
+  setShowUpdateDialog: (show) => set({ showUpdateDialog: show }),
+  setUpdateError: (error) => set({ updateError: error }),
+
   reset: () => set({
     isDbConnected: false,
     dbPath: null,
     myWxid: null,
     isLoading: false,
-    loadingText: ''
+    loadingText: '',
+    isLocked: false,
+    updateInfo: null,
+    isDownloading: false,
+    downloadProgress: { percent: 0 },
+    showUpdateDialog: false,
+    updateError: null
   })
 }))

src/stores/chatStore.ts

@@ -6,25 +6,26 @@ export interface ChatState {
   isConnected: boolean
   isConnecting: boolean
   connectionError: string | null
-  
+
   // 会话列表
   sessions: ChatSession[]
   filteredSessions: ChatSession[]
   currentSessionId: string | null
   isLoadingSessions: boolean
-  
+
   // 消息
   messages: Message[]
   isLoadingMessages: boolean
   isLoadingMore: boolean
   hasMoreMessages: boolean
-  
+  hasMoreLater: boolean
+
   // 联系人缓存
   contacts: Map<string, Contact>
-  
+
   // 搜索
   searchKeyword: string
-  
+
   // 操作
   setConnected: (connected: boolean) => void
   setConnecting: (connecting: boolean) => void
@@ -38,6 +39,7 @@ export interface ChatState {
   setLoadingMessages: (loading: boolean) => void
   setLoadingMore: (loading: boolean) => void
   setHasMoreMessages: (hasMore: boolean) => void
+  setHasMoreLater: (hasMore: boolean) => void
   setContacts: (contacts: Contact[]) => void
   addContact: (contact: Contact) => void
   setSearchKeyword: (keyword: string) => void
@@ -56,48 +58,51 @@ export const useChatStore = create<ChatState>((set, get) => ({
   isLoadingMessages: false,
   isLoadingMore: false,
   hasMoreMessages: true,
+  hasMoreLater: false,
   contacts: new Map(),
   searchKeyword: '',
 
   setConnected: (connected) => set({ isConnected: connected }),
   setConnecting: (connecting) => set({ isConnecting: connecting }),
   setConnectionError: (error) => set({ connectionError: error }),
-  
+
   setSessions: (sessions) => set({ sessions, filteredSessions: sessions }),
   setFilteredSessions: (sessions) => set({ filteredSessions: sessions }),
-  
+
-  setCurrentSession: (sessionId) => set({ 
+  setCurrentSession: (sessionId) => set({
     currentSessionId: sessionId,
     messages: [],
-    hasMoreMessages: true
+    hasMoreMessages: true,
+    hasMoreLater: false
   }),
-  
+
   setLoadingSessions: (loading) => set({ isLoadingSessions: loading }),
-  
+
   setMessages: (messages) => set({ messages }),
-  
+
   appendMessages: (newMessages, prepend = false) => set((state) => ({
-    messages: prepend 
+    messages: prepend
       ? [...newMessages, ...state.messages]
       : [...state.messages, ...newMessages]
   })),
-  
+
   setLoadingMessages: (loading) => set({ isLoadingMessages: loading }),
   setLoadingMore: (loading) => set({ isLoadingMore: loading }),
   setHasMoreMessages: (hasMore) => set({ hasMoreMessages: hasMore }),
-  
+  setHasMoreLater: (hasMore) => set({ hasMoreLater: hasMore }),
-  setContacts: (contacts) => set({ 
+
-    contacts: new Map(contacts.map(c => [c.username, c])) 
+  setContacts: (contacts) => set({
+    contacts: new Map(contacts.map(c => [c.username, c]))
   }),
-  
+
   addContact: (contact) => set((state) => {
     const newContacts = new Map(state.contacts)
     newContacts.set(contact.username, contact)
     return { contacts: newContacts }
   }),
-  
+
   setSearchKeyword: (keyword) => set({ searchKeyword: keyword }),
-  
+
   reset: () => set({
     isConnected: false,
     isConnecting: false,
@@ -110,6 +115,7 @@ export const useChatStore = create<ChatState>((set, get) => ({
     isLoadingMessages: false,
     isLoadingMore: false,
     hasMoreMessages: true,
+    hasMoreLater: false,
     contacts: new Map(),
     searchKeyword: ''
   })

src/styles/main.scss

@@ -8,33 +8,33 @@
   --primary-light: rgba(139, 115, 85, 0.1);
   --danger: #dc3545;
   --warning: #ffc107;
-  
+
   // 背景
   --bg-primary: #F0EEE9;
   --bg-secondary: rgba(255, 255, 255, 0.7);
   --bg-tertiary: rgba(0, 0, 0, 0.03);
   --bg-hover: rgba(0, 0, 0, 0.05);
-  
+
   // 文字
   --text-primary: #3d3d3d;
   --text-secondary: #666666;
   --text-tertiary: #999999;
-  
+
   // 边框
   --border-color: rgba(0, 0, 0, 0.08);
   --border-radius: 9999px;
-  
+
   // 阴影
   --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.05);
   --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.08);
-  
+
   // 侧边栏
   --sidebar-width: 220px;
-  
+
   // 主题渐变
   --bg-gradient: linear-gradient(135deg, #F0EEE9 0%, #E8E6E1 100%);
   --primary-gradient: linear-gradient(135deg, #8B7355 0%, #A68B5B 100%);
-  
+
   // 卡片背景
   --card-bg: rgba(255, 255, 255, 0.7);
 }
@@ -235,7 +235,8 @@
   box-sizing: border-box;
 }
 
-html, body {
+html,
+body {
   height: 100%;
   font-family: 'HarmonyOS Sans SC', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
   font-size: 14px;
@@ -263,7 +264,7 @@ html, body {
 ::-webkit-scrollbar-thumb {
   background: var(--text-tertiary);
   border-radius: 3px;
-  
+
   &:hover {
     background: var(--text-secondary);
   }
@@ -280,20 +281,20 @@ html, body {
   font-size: 14px;
   cursor: pointer;
   transition: all 0.2s;
-  
+
   &-primary {
     background: var(--primary);
     color: white;
-    
+
     &:hover {
       background: var(--primary-hover);
     }
   }
-  
+
   &-secondary {
     background: var(--bg-tertiary);
     color: var(--text-primary);
-    
+
     &:hover {
       background: var(--border-color);
     }
@@ -307,3 +308,60 @@ html, body {
   box-shadow: var(--shadow-sm);
   padding: 16px;
 }
+
+// 全局 Switch 开关样式
+.switch {
+  position: relative;
+  display: inline-block;
+  width: 44px;
+  height: 24px;
+  flex-shrink: 0;
+
+  input {
+    opacity: 0;
+    width: 0;
+    height: 0;
+  }
+
+  .switch-slider {
+    position: absolute;
+    cursor: pointer;
+    top: 0;
+    left: 0;
+    right: 0;
+    bottom: 0;
+    background-color: var(--bg-tertiary);
+    transition: 0.3s;
+    border-radius: 24px;
+    border: 1px solid var(--border-color);
+
+    &::before {
+      position: absolute;
+      content: "";
+      height: 18px;
+      width: 18px;
+      left: 2px;
+      bottom: 2px;
+      background-color: var(--text-tertiary);
+      transition: 0.3s;
+      border-radius: 50%;
+      box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
+    }
+  }
+
+  input:checked+.switch-slider {
+    background-color: var(--primary);
+    border-color: var(--primary);
+
+    &::before {
+      transform: translateX(20px);
+      background-color: #ffffff;
+    }
+  }
+
+  // 禁用状态
+  input:disabled+.switch-slider {
+    opacity: 0.5;
+    cursor: not-allowed;
+  }
+}

src/types/analytics.ts

@@ -41,11 +41,12 @@ export const MESSAGE_TYPE_LABELS: Record<number, string> = {
   244813135921: '文本',
   3: '图片',
   34: '语音',
+  42: '名片',
   43: '视频',
   47: '表情',
   48: '位置',
   49: '链接/文件',
-  42: '名片',
+  50: '通话',
   10000: '系统消息',
 }
 

src/types/electron.d.ts

@@ -1,4 +1,4 @@
-import type { ChatSession, Message, Contact } from './models'
+import type { ChatSession, Message, Contact, ContactInfo } from './models'
 
 export interface ElectronAPI {
   window: {
@@ -9,6 +9,9 @@ export interface ElectronAPI {
     completeOnboarding: () => Promise<boolean>
     openOnboardingWindow: () => Promise<boolean>
     setTitleBarOverlay: (options: { symbolColor: string }) => void
+    openVideoPlayerWindow: (videoPath: string, videoWidth?: number, videoHeight?: number) => Promise<void>
+    resizeToFitVideo: (videoWidth: number, videoHeight: number) => Promise<void>
+    openChatHistoryWindow: (sessionId: string, messageId: number) => Promise<boolean>
   }
   config: {
     get: (key: string) => Promise<unknown>
@@ -45,6 +48,7 @@ export interface ElectronAPI {
     testConnection: (dbPath: string, hexKey: string, wxid: string) => Promise<{ success: boolean; error?: string; sessionCount?: number }>
     open: (dbPath: string, hexKey: string, wxid: string) => Promise<boolean>
     close: () => Promise<boolean>
+
   }
   key: {
     autoGetDbKey: () => Promise<{ success: boolean; key?: string; error?: string; logs?: string[] }>
@@ -55,7 +59,12 @@ export interface ElectronAPI {
   chat: {
     connect: () => Promise<{ success: boolean; error?: string }>
     getSessions: () => Promise<{ success: boolean; sessions?: ChatSession[]; error?: string }>
-    getMessages: (sessionId: string, offset?: number, limit?: number) => Promise<{
+    enrichSessionsContactInfo: (usernames: string[]) => Promise<{
+      success: boolean
+      contacts?: Record<string, { displayName?: string; avatarUrl?: string }>
+      error?: string
+    }>
+    getMessages: (sessionId: string, offset?: number, limit?: number, startTime?: number, endTime?: number, ascending?: boolean) => Promise<{
       success: boolean;
       messages?: Message[];
       hasMore?: boolean;
@@ -68,6 +77,11 @@ export interface ElectronAPI {
     }>
     getContact: (username: string) => Promise<Contact | null>
     getContactAvatar: (username: string) => Promise<{ avatarUrl?: string; displayName?: string } | null>
+    getContacts: () => Promise<{
+      success: boolean
+      contacts?: ContactInfo[]
+      error?: string
+    }>
     getMyAvatarUrl: () => Promise<{ success: boolean; avatarUrl?: string; error?: string }>
     downloadEmoji: (cdnUrl: string, md5?: string) => Promise<{ success: boolean; localPath?: string; error?: string }>
     close: () => Promise<boolean>
@@ -88,8 +102,14 @@ export interface ElectronAPI {
       error?: string
     }>
     getImageData: (sessionId: string, msgId: string) => Promise<{ success: boolean; data?: string; error?: string }>
-    getVoiceData: (sessionId: string, msgId: string) => Promise<{ success: boolean; data?: string; error?: string }>
+    getVoiceData: (sessionId: string, msgId: string, createTime?: number, serverId?: string | number) => Promise<{ success: boolean; data?: string; error?: string }>
+    resolveVoiceCache: (sessionId: string, msgId: string) => Promise<{ success: boolean; hasCache: boolean; data?: string }>
+    getVoiceTranscript: (sessionId: string, msgId: string, createTime?: number) => Promise<{ success: boolean; transcript?: string; error?: string }>
+    onVoiceTranscriptPartial: (callback: (payload: { msgId: string; text: string }) => void) => () => void
+    execQuery: (kind: string, path: string | null, sql: string) => Promise<{ success: boolean; rows?: any[]; error?: string }>
+    getMessage: (sessionId: string, localId: number) => Promise<{ success: boolean; message?: Message; error?: string }>
   }
+
   image: {
     decrypt: (payload: { sessionId?: string; imageMd5?: string; imageDatName?: string; force?: boolean }) => Promise<{ success: boolean; localPath?: string; error?: string }>
     resolveCache: (payload: { sessionId?: string; imageMd5?: string; imageDatName?: string }) => Promise<{ success: boolean; localPath?: string; hasUpdate?: boolean; error?: string }>
@@ -97,8 +117,23 @@ export interface ElectronAPI {
     onUpdateAvailable: (callback: (payload: { cacheKey: string; imageMd5?: string; imageDatName?: string }) => void) => () => void
     onCacheResolved: (callback: (payload: { cacheKey: string; imageMd5?: string; imageDatName?: string; localPath: string }) => void) => () => void
   }
+  video: {
+    getVideoInfo: (videoMd5: string) => Promise<{
+      success: boolean
+      exists: boolean
+      videoUrl?: string
+      coverUrl?: string
+      thumbUrl?: string
+      error?: string
+    }>
+    parseVideoMd5: (content: string) => Promise<{
+      success: boolean
+      md5?: string
+      error?: string
+    }>
+  }
   analytics: {
-    getOverallStatistics: () => Promise<{
+    getOverallStatistics: (force?: boolean) => Promise<{
       success: boolean
       data?: {
         totalMessages: number
@@ -141,6 +176,11 @@ export interface ElectronAPI {
     }>
     onProgress: (callback: (payload: { status: string; progress: number }) => void) => () => void
   }
+  cache: {
+    clearAnalytics: () => Promise<{ success: boolean; error?: string }>
+    clearImages: () => Promise<{ success: boolean; error?: string }>
+    clearAll: () => Promise<{ success: boolean; error?: string }>
+  }
   groupAnalytics: {
     getGroupChats: () => Promise<{
       success: boolean
@@ -192,6 +232,11 @@ export interface ElectronAPI {
       }
       error?: string
     }>
+    exportGroupMembers: (chatroomId: string, outputPath: string) => Promise<{
+      success: boolean
+      count?: number
+      error?: string
+    }>
   }
   annualReport: {
     getAvailableYears: () => Promise<{
@@ -257,12 +302,12 @@ export interface ElectronAPI {
           fastestFriend: string
           fastestTime: number
         } | null
-      topPhrases: Array<{
+        topPhrases: Array<{
-        phrase: string
+          phrase: string
-        count: number
+          count: number
-      }>
+        }>
-    }
+      }
-    error?: string
+      error?: string
     }>
     exportImages: (payload: { baseDir: string; folderName: string; images: Array<{ name: string; dataUrl: string }> }) => Promise<{
       success: boolean
@@ -282,6 +327,53 @@ export interface ElectronAPI {
       success: boolean
       error?: string
     }>
+    exportContacts: (outputDir: string, options: { format: 'json' | 'csv' | 'vcf'; exportAvatars: boolean; contactTypes: { friends: boolean; groups: boolean; officials: boolean } }) => Promise<{
+      success: boolean
+      successCount?: number
+      error?: string
+    }>
+    onProgress: (callback: (payload: ExportProgress) => void) => () => void
+  }
+  whisper: {
+    downloadModel: () => Promise<{ success: boolean; modelPath?: string; tokensPath?: string; error?: string }>
+    getModelStatus: () => Promise<{ success: boolean; exists?: boolean; modelPath?: string; tokensPath?: string; sizeBytes?: number; error?: string }>
+    onDownloadProgress: (callback: (payload: { modelName: string; downloadedBytes: number; totalBytes?: number; percent?: number }) => void) => () => void
+  }
+  sns: {
+    getTimeline: (limit: number, offset: number, usernames?: string[], keyword?: string, startTime?: number, endTime?: number) => Promise<{
+      success: boolean
+      timeline?: Array<{
+        id: string
+        username: string
+        nickname: string
+        avatarUrl?: string
+        createTime: number
+        contentDesc: string
+        type?: number
+        media: Array<{
+          url: string
+          thumb: string
+          md5?: string
+          token?: string
+          key?: string
+          encIdx?: string
+          livePhoto?: {
+            url: string
+            thumb: string
+            md5?: string
+            token?: string
+            key?: string
+            encIdx?: string
+          }
+        }>
+        likes: Array<string>
+        comments: Array<{ id: string; nickname: string; content: string; refCommentId: string; refNickname?: string }>
+        rawXml?: string
+      }>
+      error?: string
+    }>
+    debugResource: (url: string) => Promise<{ success: boolean; status?: number; headers?: any; error?: string }>
+    proxyImage: (url: string) => Promise<{ success: boolean; dataUrl?: string; error?: string }>
   }
 }
 
@@ -290,6 +382,22 @@ export interface ExportOptions {
   dateRange?: { start: number; end: number } | null
   exportMedia?: boolean
   exportAvatars?: boolean
+  exportImages?: boolean
+  exportVoices?: boolean
+  exportEmojis?: boolean
+  exportVoiceAsText?: boolean
+  excelCompactColumns?: boolean
+  txtColumns?: string[]
+  sessionLayout?: 'shared' | 'per-session'
+  displayNamePreference?: 'group-nickname' | 'remark' | 'nickname'
+  exportConcurrency?: number
+}
+
+export interface ExportProgress {
+  current: number
+  total: number
+  currentSession: string
+  phase: 'preparing' | 'exporting' | 'writing' | 'complete'
 }
 
 export interface WxidInfo {

src/types/models.ts

@@ -23,6 +23,15 @@ export interface Contact {
   smallHeadUrl: string
 }
 
+export interface ContactInfo {
+  username: string
+  displayName: string
+  remark?: string
+  nickname?: string
+  avatarUrl?: string
+  type: 'friend' | 'group' | 'official' | 'other'
+}
+
 // 消息
 export interface Message {
   localId: number
@@ -33,16 +42,55 @@ export interface Message {
   isSend: number | null
   senderUsername: string | null
   parsedContent: string
+  rawContent?: string  // 原始消息内容（保留用于兼容）
+  content?: string  // 原始消息内容（XML）
   imageMd5?: string
   imageDatName?: string
   emojiCdnUrl?: string
   emojiMd5?: string
   voiceDurationSeconds?: number
+  videoMd5?: string
   // 引用消息
   quotedContent?: string
   quotedSender?: string
+  // Type 49 细分字段
+  linkTitle?: string        // 链接/文件标题
+  linkUrl?: string          // 链接 URL
+  linkThumb?: string        // 链接缩略图
+  fileName?: string         // 文件名
+  fileSize?: number         // 文件大小
+  fileExt?: string          // 文件扩展名
+  xmlType?: string          // XML 中的 type 字段
+  // 名片消息
+  cardUsername?: string     // 名片的微信ID
+  cardNickname?: string     // 名片的昵称
+  // 聊天记录
+  chatRecordTitle?: string  // 聊天记录标题
+  chatRecordList?: ChatRecordItem[]  // 聊天记录列表
 }
 
+// 聊天记录项
+export interface ChatRecordItem {
+  datatype: number          // 消息类型
+  sourcename: string        // 发送者
+  sourcetime: string        // 时间
+  sourceheadurl?: string    // 发送者头像
+  datadesc?: string         // 内容描述
+  datatitle?: string        // 标题
+  fileext?: string          // 文件扩展名
+  datasize?: number         // 文件大小
+  messageuuid?: string      // 消息UUID
+  dataurl?: string          // 数据URL
+  datathumburl?: string     // 缩略图URL
+  datacdnurl?: string       // CDN URL
+  aeskey?: string           // AES密钥
+  md5?: string              // MD5
+  imgheight?: number        // 图片高度
+  imgwidth?: number         // 图片宽度
+  duration?: number         // 时长（毫秒）
+}
+
+
 // 分析数据
 export interface AnalyticsData {
   totalMessages: number

src/utils/AvatarLoadQueue.ts

@@ -0,0 +1,74 @@
+
+// 全局头像加载队列管理器（限制并发，避免卡顿）
+export class AvatarLoadQueue {
+    private queue: Array<{ url: string; resolve: () => void; reject: (error: Error) => void }> = []
+    private loading = new Map<string, Promise<void>>()
+    private activeCount = 0
+    private readonly maxConcurrent = 3
+    private readonly delayBetweenBatches = 10
+
+    private static instance: AvatarLoadQueue
+
+    public static getInstance(): AvatarLoadQueue {
+        if (!AvatarLoadQueue.instance) {
+            AvatarLoadQueue.instance = new AvatarLoadQueue()
+        }
+        return AvatarLoadQueue.instance
+    }
+
+    async enqueue(url: string): Promise<void> {
+        if (!url) return Promise.resolve()
+
+        // 核心修复：防止重复并发请求同一个 URL
+        const existingPromise = this.loading.get(url)
+        if (existingPromise) {
+            return existingPromise
+        }
+
+        const loadPromise = new Promise<void>((resolve, reject) => {
+            this.queue.push({ url, resolve, reject })
+            this.processQueue()
+        })
+
+        this.loading.set(url, loadPromise)
+        loadPromise.finally(() => {
+            this.loading.delete(url)
+        })
+
+        return loadPromise
+    }
+
+    private async processQueue() {
+        if (this.activeCount >= this.maxConcurrent || this.queue.length === 0) {
+            return
+        }
+
+        const task = this.queue.shift()
+        if (!task) return
+
+        this.activeCount++
+
+        const img = new Image()
+        img.onload = () => {
+            this.activeCount--
+            task.resolve()
+            setTimeout(() => this.processQueue(), this.delayBetweenBatches)
+        }
+        img.onerror = () => {
+            this.activeCount--
+            task.reject(new Error(`Failed: ${task.url}`))
+            setTimeout(() => this.processQueue(), this.delayBetweenBatches)
+        }
+        img.src = task.url
+
+        this.processQueue()
+    }
+
+    clear() {
+        this.queue = []
+        this.loading.clear()
+        this.activeCount = 0
+    }
+}
+
+export const avatarLoadQueue = AvatarLoadQueue.getInstance()

src/vite-env.d.ts

@@ -1 +1,14 @@
 /// <reference types="vite/client" />
+
+interface Window {
+    electronAPI: {
+        // ... other methods ...
+        auth: {
+            hello: (message?: string) => Promise<{ success: boolean; error?: string }>
+        }
+        // For brevity, using 'any' for other parts or properly importing types if available.
+        // In a real scenario, you'd likely want to keep the full interface definition consistent with preload.ts
+        // or import a shared type definition.
+        [key: string]: any
+    }
+}

tsconfig.node.json

@@ -13,6 +13,7 @@
   },
   "include": [
     "vite.config.ts",
-    "electron/**/*.ts"
+    "electron/**/*.ts",
+    "electron/**/*.d.ts"
   ]
-}
+}

vite.config.ts

@@ -10,6 +10,14 @@ export default defineConfig({
     port: 3000,
     strictPort: false  // 如果3000被占用，自动尝试下一个
   },
+  build: {
+    commonjsOptions: {
+      ignoreDynamicRequires: true
+    }
+  },
+  optimizeDeps: {
+    exclude: []
+  },
   plugins: [
     react(),
     electron([
@@ -19,7 +27,14 @@ export default defineConfig({
           build: {
             outDir: 'dist-electron',
             rollupOptions: {
-              external: ['better-sqlite3', 'koffi']
+              external: [
+                'better-sqlite3',
+                'koffi',
+                'fsevents',
+                'whisper-node',
+                'shelljs',
+                'exceljs'
+              ]
             }
           }
         }
@@ -30,7 +45,10 @@ export default defineConfig({
           build: {
             outDir: 'dist-electron',
             rollupOptions: {
-              external: ['koffi'],
+              external: [
+                'koffi',
+                'fsevents'
+              ],
               output: {
                 entryFileNames: 'annualReportWorker.js',
                 inlineDynamicImports: true
@@ -53,6 +71,42 @@ export default defineConfig({
           }
         }
       },
+      {
+        entry: 'electron/wcdbWorker.ts',
+        vite: {
+          build: {
+            outDir: 'dist-electron',
+            rollupOptions: {
+              external: [
+                'better-sqlite3',
+                'koffi',
+                'fsevents'
+              ],
+              output: {
+                entryFileNames: 'wcdbWorker.js',
+                inlineDynamicImports: true
+              }
+            }
+          }
+        }
+      },
+      {
+        entry: 'electron/transcribeWorker.ts',
+        vite: {
+          build: {
+            outDir: 'dist-electron',
+            rollupOptions: {
+              external: [
+                'sherpa-onnx-node'
+              ],
+              output: {
+                entryFileNames: 'transcribeWorker.js',
+                inlineDynamicImports: true
+              }
+            }
+          }
+        }
+      },
       {
         entry: 'electron/preload.ts',
         onstart(options) {