refactor: 视频/图片/文件组合发送,各走各的渲染通道

- ChatMessage 新增 _videoFrames/_videoMeta 独立字段
- msg.images 只放图片,视频帧走 _videoFrames
- 聊天卡片:图片缩略图 + 视频指示牌 + 文件 chips 可同时显示
- Ollama API 仍合并全部帧到 images 数组
This commit is contained in:
thzxx
2026-06-18 12:45:06 +08:00
parent 5251319efb
commit fed1e6d1c2
3 changed files with 44 additions and 43 deletions
+9 -18
View File
@@ -149,13 +149,6 @@ export function appendMessageDOM(msg: ChatMessage, index: number): void {
let contentHtml = '';
let safeContent = (msg.content != null) ? String(msg.content) : '';
// 视频消息:折叠帧列表,只显示摘要
const isVideoMsg = safeContent.includes('[视频帧序列');
if (isVideoMsg) {
const idx = safeContent.indexOf('[视频帧序列');
safeContent = safeContent.slice(0, idx) + safeContent.slice(idx).split('\n')[0];
}
if (msg.role === 'assistant') {
// ── 系统提示词折叠卡片(每条助理消息顶部展示)──
const sysPrompt = state.get<string>('_lastSystemPrompt', '');
@@ -183,18 +176,16 @@ export function appendMessageDOM(msg: ChatMessage, index: number): void {
}
if (msg.images && msg.images.length > 0) {
// 视频帧序列:不逐帧渲染缩略图,只显示视频指示
const isVideo = msg.content?.includes('[视频帧序列');
if (isVideo) {
const frameCount = msg.images.length;
contentHtml += `<div class="msg-video-indicator">🎬 视频帧序列 · ${frameCount} 帧 · 1fps</div>`;
} else {
contentHtml += '<div class="msg-images">';
for (const img of msg.images) {
contentHtml += `<img class="msg-img" src="data:image/png;base64,${img}" alt="用户图片" data-lightbox="true">`;
}
contentHtml += '</div>';
contentHtml += '<div class="msg-images">';
for (const img of msg.images) {
contentHtml += `<img class="msg-img" src="data:image/png;base64,${img}" alt="用户图片" data-lightbox="true">`;
}
contentHtml += '</div>';
}
if ((msg as any)._videoFrames && (msg as any)._videoFrames.length > 0) {
const n = (msg as any)._videoFrames.length;
contentHtml += `<div class="msg-video-indicator">🎬 视频帧序列 · ${n} 帧 · 1fps</div>`;
}
if (msg.files && msg.files.length > 0) {