更友好的跳转日期 #256;修复聊天记录显示不完整 #254;修复聊天 tab 对话页面“向下滚动查看更新消息”失效 #253

This commit is contained in:
cc
2026-02-15 11:44:23 +08:00
parent 4f0af3d0cb
commit 6394384be0
10 changed files with 256 additions and 19 deletions

View File

@@ -903,6 +903,9 @@ function registerIpcHandlers() {
ipcMain.handle('chat:getAllVoiceMessages', async (_, sessionId: string) => {
return chatService.getAllVoiceMessages(sessionId)
})
ipcMain.handle('chat:getMessageDates', async (_, sessionId: string) => {
return chatService.getMessageDates(sessionId)
})
ipcMain.handle('chat:resolveVoiceCache', async (_, sessionId: string, msgId: string) => {
return chatService.resolveVoiceCache(sessionId, msgId)
})

View File

@@ -142,6 +142,7 @@ contextBridge.exposeInMainWorld('electronAPI', {
getVoiceData: (sessionId: string, msgId: string, createTime?: number, serverId?: string | number) =>
ipcRenderer.invoke('chat:getVoiceData', sessionId, msgId, createTime, serverId),
getAllVoiceMessages: (sessionId: string) => ipcRenderer.invoke('chat:getAllVoiceMessages', sessionId),
getMessageDates: (sessionId: string) => ipcRenderer.invoke('chat:getMessageDates', sessionId),
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) => {

View File

@@ -72,6 +72,9 @@ export interface Message {
// 名片消息
cardUsername?: string // 名片的微信ID
cardNickname?: string // 名片的昵称
// 转账消息
transferPayerUsername?: string // 转账付款人
transferReceiverUsername?: string // 转账收款人
// 聊天记录
chatRecordTitle?: string // 聊天记录标题
chatRecordList?: Array<{
@@ -723,7 +726,7 @@ class ChatService {
// 1. 没有游标状态
// 2. offset 为 0 (重新加载会话)
// 3. batchSize 改变
// 4. startTime 改变
// 4. startTime/endTime 改变(视为全新查询)
// 5. ascending 改变
const needNewCursor = !state ||
offset === 0 ||
@@ -756,27 +759,35 @@ class ChatService {
this.messageCursors.set(sessionId, state)
// 如果需要跳过消息(offset > 0),逐批获取但不返回
// 注意:仅在 offset === 0 时重建游标最安全;
// 当 startTime/endTime 变化导致重建时offset 应由前端重置为 0
if (offset > 0) {
console.warn(`[ChatService] 新游标需跳过 ${offset} 条消息startTime=${startTime}, endTime=${endTime}`)
let skipped = 0
while (skipped < offset) {
const maxSkipAttempts = Math.ceil(offset / batchSize) + 5 // 防止无限循环
let attempts = 0
while (skipped < offset && attempts < maxSkipAttempts) {
attempts++
const skipBatch = await wcdbService.fetchMessageBatch(state.cursor)
if (!skipBatch.success) {
console.error('[ChatService] 跳过消息批次失败:', skipBatch.error)
return { success: false, error: skipBatch.error || '跳过消息失败' }
}
if (!skipBatch.rows || skipBatch.rows.length === 0) {
console.warn(`[ChatService] 跳过时数据耗尽: skipped=${skipped}/${offset}`)
return { success: true, messages: [], hasMore: false }
}
skipped += skipBatch.rows.length
state.fetched += skipBatch.rows.length
if (!skipBatch.hasMore) {
console.warn(`[ChatService] 跳过后无更多数据: skipped=${skipped}/${offset}`)
return { success: true, messages: [], hasMore: false }
}
}
if (attempts >= maxSkipAttempts) {
console.error(`[ChatService] 跳过消息超过最大尝试次数: attempts=${attempts}`)
}
console.log(`[ChatService] 跳过完成: skipped=${skipped}, fetched=${state.fetched}`)
}
} else if (state && offset !== state.fetched) {
// offset 与 fetched 不匹配,说明状态不一致
@@ -3776,6 +3787,32 @@ class ChatService {
}
}
/**
* 获取某会话中有消息的日期列表
* 返回 YYYY-MM-DD 格式的日期字符串数组
*/
async getMessageDates(sessionId: string): Promise<{ success: boolean; dates?: string[]; error?: string }> {
try {
const connectResult = await this.ensureConnected()
if (!connectResult.success) {
return { success: false, error: connectResult.error || '数据库未连接' }
}
const result = await wcdbService.getMessageDates(sessionId)
if (!result.success) {
throw new Error(result.error || '查询失败')
}
const dates = result.dates || []
console.log(`[ChatService] 会话 ${sessionId} 共有 ${dates.length} 个有消息的日期`)
return { success: true, dates }
} catch (e) {
console.error('[ChatService] 获取消息日期失败:', e)
return { success: false, error: String(e) }
}
}
async getMessageById(sessionId: string, localId: number): Promise<{ success: boolean; message?: Message; error?: string }> {
try {
// 1. 尝试从缓存获取会话表信息

View File

@@ -46,6 +46,7 @@ export class WcdbCore {
private wcdbGetAnnualReportExtras: any = null
private wcdbGetDualReportStats: any = null
private wcdbGetGroupStats: any = null
private wcdbGetMessageDates: any = null
private wcdbOpenMessageCursor: any = null
private wcdbOpenMessageCursorLite: any = null
private wcdbFetchMessageBatch: any = null
@@ -299,9 +300,6 @@ export class WcdbCore {
return false
}
// 关键修复:显式预加载依赖库 WCDB.dll 和 SDL2.dll
// Windows 加载器默认不会查找子目录中的依赖,必须先将其加载到内存
// 这可以解决部分用户因为 VC++ 运行时或 DLL 依赖问题导致的闪退
const dllDir = dirname(dllPath)
const wcdbCorePath = join(dllDir, 'WCDB.dll')
if (existsSync(wcdbCorePath)) {
@@ -478,6 +476,13 @@ export class WcdbCore {
this.wcdbGetGroupStats = null
}
// wcdb_status wcdb_get_message_dates(wcdb_handle handle, const char* session_id, char** out_json)
try {
this.wcdbGetMessageDates = this.lib.func('int32 wcdb_get_message_dates(int64 handle, const char* sessionId, _Out_ void** outJson)')
} catch {
this.wcdbGetMessageDates = null
}
// wcdb_status wcdb_open_message_cursor(wcdb_handle handle, const char* session_id, int32_t batch_size, int32_t ascending, int32_t begin_timestamp, int32_t end_timestamp, wcdb_cursor* out_cursor)
this.wcdbOpenMessageCursor = this.lib.func('int32 wcdb_open_message_cursor(int64 handle, const char* sessionId, int32 batchSize, int32 ascending, int32 beginTimestamp, int32 endTimestamp, _Out_ int64* outCursor)')
@@ -1194,6 +1199,29 @@ export class WcdbCore {
}
}
async getMessageDates(sessionId: string): Promise<{ success: boolean; dates?: string[]; error?: string }> {
if (!this.ensureReady()) {
return { success: false, error: 'WCDB 未连接' }
}
try {
if (!this.wcdbGetMessageDates) {
return { success: false, error: 'DLL 不支持 getMessageDates' }
}
const outPtr = [null as any]
const result = this.wcdbGetMessageDates(this.handle, sessionId, outPtr)
if (result !== 0 || !outPtr[0]) {
// 空结果也可能是正常的(无消息)
return { success: true, dates: [] }
}
const jsonStr = this.decodeJsonPtr(outPtr[0])
if (!jsonStr) return { success: false, error: '解析日期列表失败' }
const dates = JSON.parse(jsonStr)
return { success: true, dates }
} catch (e) {
return { success: false, error: String(e) }
}
}
async getMessageTableStats(sessionId: string): Promise<{ success: boolean; tables?: any[]; error?: string }> {
if (!this.ensureReady()) {
return { success: false, error: 'WCDB 未连接' }

View File

@@ -273,6 +273,10 @@ export class WcdbService {
return this.callWorker('getMessageTableStats', { sessionId })
}
async getMessageDates(sessionId: string): Promise<{ success: boolean; dates?: string[]; error?: string }> {
return this.callWorker('getMessageDates', { sessionId })
}
/**
* 获取消息元数据
*/

View File

@@ -78,6 +78,9 @@ if (parentPort) {
case 'getMessageTableStats':
result = await core.getMessageTableStats(payload.sessionId)
break
case 'getMessageDates':
result = await core.getMessageDates(payload.sessionId)
break
case 'getMessageMeta':
result = await core.getMessageMeta(payload.dbPath, payload.tableName, payload.limit, payload.offset)
break

Binary file not shown.

View File

@@ -100,6 +100,33 @@
}
.calendar-grid {
position: relative;
&.loading {
.weekdays,
.days {
pointer-events: none;
}
}
.calendar-loading {
position: absolute;
inset: 0;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
gap: 8px;
color: var(--text-secondary);
font-size: 13px;
.spin {
color: var(--primary);
animation: spin 1s linear infinite;
}
}
.weekdays {
display: grid;
grid-template-columns: repeat(7, 1fr);
@@ -129,12 +156,13 @@
border-radius: 8px;
cursor: pointer;
transition: all 0.2s;
position: relative;
&.empty {
cursor: default;
}
&:not(.empty):hover {
&:not(.empty):not(.no-message):hover {
background: var(--bg-hover);
}
@@ -149,10 +177,43 @@
font-weight: 600;
background: var(--primary-light);
}
// 无消息的日期 - 灰显且不可点击
&.no-message {
opacity: 0.3;
cursor: default;
pointer-events: none;
}
// 有消息的日期指示器小圆点
.message-dot {
position: absolute;
bottom: 3px;
left: 50%;
transform: translateX(-50%);
width: 4px;
height: 4px;
border-radius: 50%;
background: var(--primary);
}
&.selected .message-dot {
background: rgba(255, 255, 255, 0.7);
}
}
}
}
@keyframes spin {
from {
transform: rotate(0deg);
}
to {
transform: rotate(360deg);
}
}
.quick-options {
display: flex;
gap: 8px;

View File

@@ -1,5 +1,5 @@
import React, { useState } from 'react'
import { X, ChevronLeft, ChevronRight, Calendar as CalendarIcon } from 'lucide-react'
import React, { useState, useMemo } from 'react'
import { X, ChevronLeft, ChevronRight, Calendar as CalendarIcon, Loader2 } from 'lucide-react'
import './JumpToDateDialog.scss'
interface JumpToDateDialogProps {
@@ -7,13 +7,19 @@ interface JumpToDateDialogProps {
onClose: () => void
onSelect: (date: Date) => void
currentDate?: Date
/** 有消息的日期集合,格式为 YYYY-MM-DD */
messageDates?: Set<string>
/** 是否正在加载消息日期 */
loadingDates?: boolean
}
const JumpToDateDialog: React.FC<JumpToDateDialogProps> = ({
isOpen,
onClose,
onSelect,
currentDate = new Date()
currentDate = new Date(),
messageDates,
loadingDates = false
}) => {
const isValidDate = (d: any) => d instanceof Date && !isNaN(d.getTime())
const [calendarDate, setCalendarDate] = useState(isValidDate(currentDate) ? new Date(currentDate) : new Date())
@@ -49,7 +55,20 @@ const JumpToDateDialog: React.FC<JumpToDateDialogProps> = ({
return days
}
/**
* 判断某天是否有消息
*/
const hasMessage = (day: number): boolean => {
if (!messageDates || messageDates.size === 0) return true // 未加载时默认全部可点击
const year = calendarDate.getFullYear()
const month = calendarDate.getMonth() + 1
const dateStr = `${year}-${String(month).padStart(2, '0')}-${String(day).padStart(2, '0')}`
return messageDates.has(dateStr)
}
const handleDateClick = (day: number) => {
// 如果已加载日期数据且该日期无消息,则不可点击
if (messageDates && messageDates.size > 0 && !hasMessage(day)) return
const newDate = new Date(calendarDate.getFullYear(), calendarDate.getMonth(), day)
setSelectedDate(newDate)
}
@@ -72,6 +91,28 @@ const JumpToDateDialog: React.FC<JumpToDateDialogProps> = ({
calendarDate.getFullYear() === selectedDate.getFullYear()
}
/**
* 获取某天的 CSS 类名
*/
const getDayClassName = (day: number | null): string => {
if (day === null) return 'day-cell empty'
const classes = ['day-cell']
if (isSelected(day)) classes.push('selected')
if (isToday(day)) classes.push('today')
// 仅在已加载消息日期数据时区分有/无消息
if (messageDates && messageDates.size > 0) {
if (hasMessage(day)) {
classes.push('has-message')
} else {
classes.push('no-message')
}
}
return classes.join(' ')
}
const weekdays = ['日', '一', '二', '三', '四', '五', '六']
const days = generateCalendar()
@@ -107,18 +148,28 @@ const JumpToDateDialog: React.FC<JumpToDateDialogProps> = ({
</button>
</div>
<div className="calendar-grid">
<div className="weekdays">
<div className={`calendar-grid ${loadingDates ? 'loading' : ''}`}>
{loadingDates && (
<div className="calendar-loading">
<Loader2 size={20} className="spin" />
<span>...</span>
</div>
)}
<div className="weekdays" style={{ visibility: loadingDates ? 'hidden' : 'visible' }}>
{weekdays.map(d => <div key={d} className="weekday">{d}</div>)}
</div>
<div className="days">
<div className="days" style={{ visibility: loadingDates ? 'hidden' : 'visible' }}>
{days.map((day, i) => (
<div
key={i}
className={`day-cell ${day === null ? 'empty' : ''} ${day !== null && isSelected(day) ? 'selected' : ''} ${day !== null && isToday(day) ? 'today' : ''}`}
className={getDayClassName(day)}
style={{ visibility: loadingDates ? 'hidden' : 'visible' }}
onClick={() => day !== null && handleDateClick(day)}
>
{day}
{day !== null && messageDates && messageDates.size > 0 && hasMessage(day) && (
<span className="message-dot" />
)}
</div>
))}
</div>

View File

@@ -164,6 +164,9 @@ function ChatPage(_props: ChatPageProps) {
const [jumpStartTime, setJumpStartTime] = useState(0)
const [jumpEndTime, setJumpEndTime] = useState(0)
const [showJumpDialog, setShowJumpDialog] = useState(false)
const [messageDates, setMessageDates] = useState<Set<string>>(new Set())
const [loadingDates, setLoadingDates] = useState(false)
const messageDatesCache = useRef<Map<string, Set<string>>>(new Map())
const [myAvatarUrl, setMyAvatarUrl] = useState<string | undefined>(undefined)
const [myWxid, setMyWxid] = useState<string | undefined>(undefined)
const [showScrollToBottom, setShowScrollToBottom] = useState(false)
@@ -680,12 +683,32 @@ function ChatPage(_props: ChatPageProps) {
// 动态游标批量大小控制
const currentBatchSizeRef = useRef(50)
// 加载消息
const loadMessages = async (sessionId: string, offset = 0, startTime = 0, endTime = 0) => {
const listEl = messageListRef.current
const session = sessionMapRef.current.get(sessionId)
const unreadCount = session?.unreadCount ?? 0
const messageLimit = offset === 0 && unreadCount > 99 ? 30 : 50
let messageLimit = 50
if (offset === 0) {
// 初始加载:重置批量大小
currentBatchSizeRef.current = 50
// 首屏优化:消息过多时限制数量
messageLimit = unreadCount > 99 ? 30 : 50
} else {
// 滚动加载:动态递增 (50 -> 100 -> 200)
if (currentBatchSizeRef.current < 100) {
currentBatchSizeRef.current = 100
} else {
currentBatchSizeRef.current = 200
}
messageLimit = currentBatchSizeRef.current
}
if (offset === 0) {
setLoadingMessages(true)
@@ -1523,7 +1546,31 @@ function ChatPage(_props: ChatPageProps) {
</button>
<button
className="icon-btn jump-to-time-btn"
onClick={() => setShowJumpDialog(true)}
onClick={async () => {
setShowJumpDialog(true)
if (!currentSessionId) return
// 检查缓存
const cached = messageDatesCache.current.get(currentSessionId)
if (cached) {
setMessageDates(cached)
return
}
// 获取消息日期
setMessageDates(new Set()) // 清除旧数据
setLoadingDates(true)
try {
const result = await (window as any).electronAPI.chat.getMessageDates(currentSessionId)
if (result?.success && result.dates) {
const dateSet = new Set<string>(result.dates)
setMessageDates(dateSet)
messageDatesCache.current.set(currentSessionId, dateSet)
}
} catch (e) {
console.error('获取消息日期失败:', e)
} finally {
setLoadingDates(false)
}
}}
title="跳转到指定时间"
>
<Calendar size={18} />
@@ -1539,6 +1586,8 @@ function ChatPage(_props: ChatPageProps) {
setJumpEndTime(end)
loadMessages(currentSessionId, 0, 0, end)
}}
messageDates={messageDates}
loadingDates={loadingDates}
/>
<button
className="icon-btn refresh-messages-btn"