+
+
+ )
+ }
+
if (!isAuthenticated) {
return (
+ {bootState === 'connecting' ? '正在自动连接数据库...' : '正在准备...'}
+
+
+ {bootState === 'connecting'
+ ? autoConnectSource === 'env'
+ ? '检测到环境变量中的密钥'
+ : '使用上次安全保存的密钥'
+ : 'WechatExplorer'}
+
+
@@ -476,6 +566,9 @@ function App(): React.ReactElement {
width={sidebarWidth}
dateRange={dateRange}
onDateRangeChange={handleDateRangeChange}
+ selfInfo={selfInfo}
+ dbReady={isAuthenticated}
+ onOpenSettings={() => setShowSettings(true)}
/>
selectedContact && handleSelectContact(selectedContact)}
onRefreshData={loadContacts}
/>
+ setShowSettings(false)}
+ onDbKeyChange={setDbKey}
+ onDbRootChanged={() => {
+ void refreshSelfInfo()
+ void loadContacts()
+ }}
+ />
)
}
diff --git a/src/renderer/src/assets/main.css b/src/renderer/src/assets/main.css
index e94f387..1e863c0 100644
--- a/src/renderer/src/assets/main.css
+++ b/src/renderer/src/assets/main.css
@@ -1204,3 +1204,408 @@ body {
.voip-status {
font-size: 13px;
}
+
+/* Sidebar 自助卡片 + 入口 */
+.sidebar-footer {
+ padding: 10px 12px;
+ border-top: 1px solid var(--border-color);
+ display: flex;
+ align-items: center;
+ gap: 10px;
+ cursor: pointer;
+ background-color: #f3f4f5;
+ transition: background-color 0.15s ease;
+ user-select: none;
+}
+
+.sidebar-footer:hover {
+ background-color: #e6e9eb;
+}
+
+.sidebar-self-avatar {
+ width: 36px;
+ height: 36px;
+ border-radius: 6px;
+ background-color: #07c160;
+ color: #fff;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ font-size: 14px;
+ font-weight: 500;
+ overflow: hidden;
+ flex-shrink: 0;
+}
+
+.sidebar-self-avatar img {
+ width: 100%;
+ height: 100%;
+ object-fit: cover;
+}
+
+.sidebar-self-info {
+ flex: 1;
+ min-width: 0;
+ overflow: hidden;
+}
+
+.sidebar-self-nickname {
+ font-size: 13px;
+ font-weight: 500;
+ color: #1f2429;
+ white-space: nowrap;
+ overflow: hidden;
+ text-overflow: ellipsis;
+}
+
+.sidebar-self-wxid {
+ font-size: 11px;
+ color: #8a9298;
+ margin-top: 2px;
+ white-space: nowrap;
+ overflow: hidden;
+ text-overflow: ellipsis;
+}
+
+.sidebar-self-arrow {
+ color: #8a9298;
+ font-size: 18px;
+ flex-shrink: 0;
+}
+
+/* 启动自动连接 Splash */
+.boot-splash {
+ position: fixed;
+ inset: 0;
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: center;
+ gap: 14px;
+ background: linear-gradient(180deg, #f5f7f8 0%, #eceff1 100%);
+ z-index: 2000;
+ animation: boot-splash-fade-in 0.2s ease-out;
+}
+
+@keyframes boot-splash-fade-in {
+ from {
+ opacity: 0;
+ }
+ to {
+ opacity: 1;
+ }
+}
+
+.boot-splash-spinner {
+ width: 36px;
+ height: 36px;
+ border-radius: 50%;
+ border: 3px solid rgba(7, 193, 96, 0.18);
+ border-top-color: #07c160;
+ animation: boot-splash-spin 0.9s linear infinite;
+}
+
+@keyframes boot-splash-spin {
+ to {
+ transform: rotate(360deg);
+ }
+}
+
+.boot-splash-title {
+ font-size: 15px;
+ font-weight: 500;
+ color: #1f2429;
+}
+
+.boot-splash-subtitle {
+ font-size: 12px;
+ color: #6f767c;
+}
+
+/* 设置面板 */
+.settings-overlay {
+ position: fixed;
+ inset: 0;
+ background: rgba(15, 21, 26, 0.45);
+ backdrop-filter: blur(2px);
+ z-index: 1100;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ animation: settings-fade-in 0.16s ease-out;
+}
+
+@keyframes settings-fade-in {
+ from {
+ opacity: 0;
+ }
+ to {
+ opacity: 1;
+ }
+}
+
+.settings-modal {
+ width: min(560px, 92vw);
+ max-height: 84vh;
+ background: #fff;
+ border-radius: 12px;
+ box-shadow: 0 24px 60px rgba(15, 21, 26, 0.28);
+ display: flex;
+ flex-direction: column;
+ overflow: hidden;
+ animation: settings-pop-in 0.18s ease-out;
+}
+
+@keyframes settings-pop-in {
+ from {
+ transform: translateY(8px) scale(0.98);
+ opacity: 0;
+ }
+ to {
+ transform: translateY(0) scale(1);
+ opacity: 1;
+ }
+}
+
+.settings-header {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ padding: 16px 22px;
+ border-bottom: 1px solid #ececec;
+}
+
+.settings-header h2 {
+ margin: 0;
+ font-size: 17px;
+ font-weight: 600;
+ color: #1f2429;
+}
+
+.settings-close {
+ background: transparent;
+ border: 0;
+ color: #7d858a;
+ font-size: 26px;
+ line-height: 1;
+ width: 32px;
+ height: 32px;
+ border-radius: 50%;
+ cursor: pointer;
+ transition: background-color 0.15s ease;
+}
+
+.settings-close:hover {
+ background: #f0f2f4;
+ color: #1f2429;
+}
+
+.settings-body {
+ padding: 12px 22px 22px;
+ overflow-y: auto;
+}
+
+.settings-section {
+ margin-top: 14px;
+ padding: 14px 16px;
+ border-radius: 10px;
+ background: #fafbfc;
+ border: 1px solid #ececec;
+}
+
+.settings-section:first-child {
+ margin-top: 6px;
+}
+
+.settings-section-title {
+ font-size: 12px;
+ font-weight: 600;
+ color: #6f767c;
+ letter-spacing: 0.5px;
+ text-transform: uppercase;
+ margin-bottom: 10px;
+}
+
+.settings-row {
+ display: flex;
+ align-items: center;
+ gap: 10px;
+ flex-wrap: wrap;
+ margin-top: 8px;
+}
+
+.settings-row:first-child {
+ margin-top: 0;
+}
+
+.settings-input {
+ flex: 1;
+ min-width: 0;
+ padding: 8px 11px;
+ border: 1px solid #d4d9dc;
+ border-radius: 6px;
+ background: #fff;
+ font-size: 13px;
+ color: #1f2429;
+ font-family: 'SF Mono', Menlo, Consolas, monospace;
+ outline: none;
+ transition: border-color 0.15s ease, box-shadow 0.15s ease;
+}
+
+.settings-input:focus {
+ border-color: #07c160;
+ box-shadow: 0 0 0 3px rgba(7, 193, 96, 0.12);
+}
+
+.settings-input-half {
+ flex: 0 1 140px;
+}
+
+.settings-input-quarter {
+ flex: 0 1 90px;
+}
+
+.settings-btn {
+ padding: 7px 14px;
+ border: 1px solid #d4d9dc;
+ border-radius: 6px;
+ background: #fff;
+ color: #30383d;
+ cursor: pointer;
+ font-size: 13px;
+ transition: border-color 0.15s ease, background-color 0.15s ease, color 0.15s ease;
+}
+
+.settings-btn:hover:not(:disabled) {
+ border-color: #07c160;
+ color: #078f49;
+}
+
+.settings-btn:disabled {
+ opacity: 0.55;
+ cursor: not-allowed;
+}
+
+.settings-btn-primary {
+ background: #07c160;
+ color: #fff;
+ border-color: #07c160;
+}
+
+.settings-btn-primary:hover:not(:disabled) {
+ background: #06ad56;
+ color: #fff;
+ border-color: #06ad56;
+}
+
+.settings-hint {
+ margin-top: 10px;
+ font-size: 11px;
+ color: #8a9298;
+ line-height: 1.6;
+}
+
+.settings-hint code {
+ background: #eef0f2;
+ padding: 1px 5px;
+ border-radius: 3px;
+ font-size: 10.5px;
+}
+
+.settings-status {
+ font-size: 12px;
+ color: #59636a;
+}
+
+.settings-status.ok {
+ color: #078f49;
+}
+
+.settings-status.fail {
+ color: #c73737;
+}
+
+.settings-toggle {
+ display: inline-flex;
+ align-items: center;
+ gap: 8px;
+ cursor: pointer;
+ font-size: 13px;
+ color: #30383d;
+}
+
+.settings-toggle input {
+ width: 16px;
+ height: 16px;
+ accent-color: #07c160;
+ cursor: pointer;
+}
+
+.settings-self {
+ display: flex;
+ align-items: center;
+ gap: 12px;
+}
+
+.settings-self-avatar {
+ width: 56px;
+ height: 56px;
+ border-radius: 10px;
+ background: #07c160;
+ color: #fff;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ font-size: 22px;
+ font-weight: 500;
+ overflow: hidden;
+ flex-shrink: 0;
+}
+
+.settings-self-avatar img {
+ width: 100%;
+ height: 100%;
+ object-fit: cover;
+}
+
+.settings-self-info {
+ flex: 1;
+ min-width: 0;
+}
+
+.settings-self-nickname {
+ font-size: 15px;
+ font-weight: 600;
+ color: #1f2429;
+}
+
+.settings-self-wxid {
+ font-size: 12px;
+ color: #6f767c;
+ margin-top: 2px;
+ font-family: 'SF Mono', Menlo, Consolas, monospace;
+}
+
+.settings-self-account {
+ font-size: 11px;
+ color: #8a9298;
+ margin-top: 2px;
+ word-break: break-all;
+}
+
+.settings-self-empty {
+ font-size: 13px;
+ color: #8a9298;
+}
+
+.settings-path {
+ display: inline-block;
+ font-family: 'SF Mono', Menlo, Consolas, monospace;
+ font-size: 11px;
+ background: #eef0f2;
+ padding: 3px 7px;
+ border-radius: 4px;
+ color: #30383d;
+ word-break: break-all;
+ max-width: 100%;
+}
diff --git a/src/renderer/src/components/SettingsPanel.tsx b/src/renderer/src/components/SettingsPanel.tsx
new file mode 100644
index 0000000..89798e8
--- /dev/null
+++ b/src/renderer/src/components/SettingsPanel.tsx
@@ -0,0 +1,306 @@
+import React, { useEffect, useState } from 'react'
+
+interface SelfInfo {
+ wxid: string
+ nickname: string
+ avatar?: string
+ accountRoot: string
+}
+
+interface AppSettings {
+ dbRoot: string
+ apiEnabled: boolean
+ apiHost: string
+ apiPort: number
+}
+
+interface ApiState {
+ running: boolean
+ host: string
+ port: number
+ error?: string
+}
+
+interface SettingsPanelProps {
+ open: boolean
+ selfInfo: SelfInfo | null
+ dbReady: boolean
+ dbKey: string
+ onClose: () => void
+ onDbKeyChange: (key: string) => void
+ onDbRootChanged: () => void
+}
+
+export const SettingsPanel: React.FC
+
+ )
+}
\ No newline at end of file
diff --git a/src/renderer/src/components/Sidebar.tsx b/src/renderer/src/components/Sidebar.tsx
index e5f521a..4ced1fd 100644
--- a/src/renderer/src/components/Sidebar.tsx
+++ b/src/renderer/src/components/Sidebar.tsx
@@ -1,6 +1,13 @@
import React, { useState } from 'react'
import { Contact } from '../../../shared/types'
+interface SelfInfo {
+ wxid: string
+ nickname: string
+ avatar?: string
+ accountRoot: string
+}
+
interface SidebarProps {
contacts: Contact[]
selectedContact: Contact | null
@@ -10,6 +17,9 @@ interface SidebarProps {
width: number
dateRange: string
onDateRangeChange: (range: string) => void
+ selfInfo: SelfInfo | null
+ dbReady: boolean
+ onOpenSettings: () => void
}
export const Sidebar: React.FC e.stopPropagation()}>
+
+
+
+
+ 设置
+ +
+ {/* 自我信息卡片 */}
+
+
+
+ {/* 测试连接 */}
+
+
+
+ {/* 解密密钥 */}
+
+
+
+ {/* 数据库根目录 */}
+
+
+
+ {/* API 服务 */}
+
+
+
+ {/* 配置文件位置 */}
+
+
+
+ 账号信息
+ {dbReady && selfInfo ? (
+
+
+ ) : (
+
+ {selfInfo.avatar ? (
+ 
+ ) : (
+ (selfInfo.nickname || selfInfo.wxid || '?').charAt(0)
+ )}
+
+
+
+ {selfInfo.nickname}
+ {selfInfo.wxid}
+ {selfInfo.accountRoot}
+ 尚未连接数据库
+ )}
+ 连接测试
+
+
+ {testStatus.kind !== 'idle' && (
+
+ {testStatus.kind === 'ok' ? '✓' : '✗'} {testStatus.message}
+ {testStatus.wxid ? ` · ${testStatus.wxid}` : ''}
+ {testStatus.accountRoot ? ` · ${testStatus.accountRoot}` : ''}
+
+ )}
+
+
+ 使用当前密钥 + 下方配置的根目录尝试打开数据库,只校验不持久化。
+
+ 解密密钥
+
+ onDbKeyChange(e.target.value)}
+ placeholder="64 位 hex 密钥,如 0x..."
+ spellCheck={false}
+ />
+
+
+ 密钥保存在本机 macOS Keychain(safeStorage 加密),不会上传任何服务器。
+
+ 数据库根目录
+
+ setSettings(settings ? { ...settings, dbRoot: e.target.value } : null)}
+ onBlur={(e) => handleSave({ dbRoot: e.target.value })}
+ placeholder="~/Library/Containers/com.tencent.xinWeChat/Data/Documents/xwechat_files"
+ spellCheck={false}
+ />
+
+
+
+ {reopenStatus && {reopenStatus}}
+
+
+ 指向 xwechat_files 目录,内部包含 db_storage/。修改后需重新初始化才能生效。
+
+ 本地 HTTP API
+
+
+ {apiState && (
+
+ {apiState.running ? '运行中' : '已停止'}
+ {apiState.error ? ` · ${apiState.error}` : ''}
+
+ )}
+
+
+ setSettings(settings ? { ...settings, apiHost: e.target.value } : null)}
+ onBlur={(e) => handleSave({ apiHost: e.target.value })}
+ placeholder="host"
+ spellCheck={false}
+ />
+
+ setSettings(settings ? { ...settings, apiPort: Number(e.target.value) || 6131 } : null)
+ }
+ onBlur={(e) => handleSave({ apiPort: Number(e.target.value) || 6131 })}
+ placeholder="port"
+ />
+
+
+
+ API 仅本机访问,无鉴权。关闭后 Claude / Codex 等客户端无法读取聊天数据。
+
+ 配置文档:
+ + 配置文档:
docs/skill/wechatexplorer-reader/SKILL.md
+ 配置文件
+
+
+ {settingsPath}
+ 暂无联系人
)}
- {/*
-
*/}
+ window.location.reload()}>
- ↪️ 退出
-
-
- ✅ 已获得
-
-
+
)
}
diff --git a/src/renderer/src/utils/group-report.ts b/src/renderer/src/utils/group-report.ts
index 9d3aab2..4cabec7 100644
--- a/src/renderer/src/utils/group-report.ts
+++ b/src/renderer/src/utils/group-report.ts
@@ -169,9 +169,21 @@ export const buildGroupReportInput = (
const dateRange = sameDay
? `${startDate} ${localTime(firstTimestamp)}-${localTime(lastTimestamp)}`
: `${startDate} ${localTime(firstTimestamp)} 至 ${endDate} ${localTime(lastTimestamp)}`
- const timeSpan = sameDay
- ? `${Math.max(1, Math.ceil((lastTimestamp - firstTimestamp) / 3600000))}小时`
- : `${Math.max(1, Math.ceil((lastTimestamp - firstTimestamp) / 86400000))}天`
+ // 模板"持续时长"格子:首条到末条消息的时长,紧凑半角格式
+ const durationMs = Math.max(0, lastTimestamp - firstTimestamp)
+ const durationHours = durationMs / 3600000
+ const timeSpan = (() => {
+ if (sameDay) {
+ if (durationHours < 1) {
+ const minutes = Math.max(1, Math.round(durationMs / 60000))
+ return `${minutes} min`
+ }
+ const hours = Math.max(1, Math.ceil(durationHours))
+ return `${hours} h`
+ }
+ const days = Math.max(1, Math.ceil(durationMs / 86400000))
+ return `${days} d`
+ })()
const contactName = contact?.m_nsNickName || ''
const groupName = contactName && !isInternalIdentifier(contactName) ? contactName : '未命名会话'
const metadata: GroupReportMetadata = {
diff --git a/src/shared/group-report.ts b/src/shared/group-report.ts
index cbd4547..6370b79 100644
--- a/src/shared/group-report.ts
+++ b/src/shared/group-report.ts
@@ -76,6 +76,13 @@ export interface GroupReportMetadata {
footerNote: string
heroParticipants: string[]
avatars: Record
+ {selfInfo?.avatar ? (
+
+ ) : (
+ ((selfInfo?.nickname || selfInfo?.wxid || '我').charAt(0))
+ )}
+
+
+
+
+ {dbReady && selfInfo ? selfInfo.nickname || selfInfo.wxid || '我' : '未连接'}
+
+
+ {dbReady && selfInfo ? selfInfo.wxid : '点击设置 →'}
+
+ ⚙
+