fix(ui): show table summary with hover tooltip for full table view

Table fields now show a compact summary (first row preview + table icon)
with the full rendered table appearing on hover via Tooltip component,
consistent with the existing overflow tooltip behavior.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
2026-03-23 19:45:00 +08:00
parent 93b8673363
commit cbe9a0f74e
+22 -2
View File
@@ -546,11 +546,31 @@ const ReactTableTooltip = ({ content }: { content: string }) => {
// 表格内容直接渲染表格组件,非表格内容保持原有行为
// 表格内容:主区域显示摘要,hover 悬浮显示完整表格
if (isTableLike) {
// 生成摘要文本:取第一行数据作为预览
const summaryText = (() => {
const firstLine = content.split('\n').find(l => l.trim() && !/^\s*\|[-\s:]+\|/.test(l));
return firstLine ? firstLine.trim().substring(0, 80) + (firstLine.length > 80 ? '...' : '') : content.substring(0, 80);
})();
return (
<div className="text-xs p-1 rounded cursor-text w-full text-left">
{renderedContent}
<Tooltip
content={renderedContent}
placement="top"
theme="light"
trigger="hover"
showArrow={true}
className="tooltip-custom-offset"
scrollable={true}
maxHeight={400}
>
<div className="text-gray-800 break-all overflow-hidden line-clamp-2 flex items-center gap-1">
<i className="ri-table-line text-blue-400 flex-shrink-0"></i>
<span>{summaryText}</span>
</div>
</Tooltip>
</div>
);
}