fix: 物品标签使用图片缩略图,移除emoji图标

This commit is contained in:
Your Name 2026-02-02 12:17:05 +08:00
parent 221579abb2
commit 7f67259c94

View File

@ -215,7 +215,7 @@ export function CanvasChatPanel({ chatId, initialMessages = [], onClose, onOpenF
console.log('[CanvasChat] 已插入图片标签:', url.substring(0, 50));
}, []);
// 🆕 辅助函数:在 contenteditable 中插入物品标签(带🎯图标)
// 🆕 辅助函数:在 contenteditable 中插入物品标签(带图片缩略图,样式与普通图片标签一致)
const insertPickedObjectTagInEditor = useCallback((
url: string,
objectName: string,
@ -241,12 +241,14 @@ export function CanvasChatPanel({ chatId, initialMessages = [], onClose, onOpenF
tagSpan.setAttribute('data-attachment-url', url);
tagSpan.setAttribute('data-picked-object', 'true');
tagSpan.setAttribute('data-object-name', objectName);
tagSpan.className = 'inline-flex items-center gap-1 bg-orange-50 hover:bg-orange-100 border border-orange-200 rounded-full pl-1.5 pr-2 py-0.5 mx-0.5 align-middle cursor-default select-none';
// 样式与普通图片标签一致
tagSpan.className = 'inline-flex items-center gap-1 bg-muted/60 hover:bg-muted rounded-full pl-1 pr-2 py-0.5 mx-0.5 align-middle cursor-default select-none';
// 使用图片缩略图,不使用 emoji 或图标
tagSpan.innerHTML = `
<span class="text-orange-500 text-xs">🎯</span>
<span class="text-xs text-orange-700 font-medium">${objectName}</span>
<span class="text-xs text-orange-500">·</span>
<span class="text-xs text-orange-600">${objectPosition}</span>
<img src="${url}" alt="" class="h-5 w-5 object-cover rounded-full border border-border/50" />
<span class="text-xs text-foreground/80">${objectName}</span>
<span class="text-xs text-foreground/50">·</span>
<span class="text-xs text-foreground/70">${objectPosition}</span>
`;
// 在光标位置插入,或添加到末尾