fix(AgentMessageComponent): 添加剪贴板兼容性处理并优化引用样式

为剪贴板功能添加降级处理方案,当现代API不可用时使用execCommand方法
优化引用样式,添加悬停提示框和箭头指示器
This commit is contained in:
Wenjie Zhang 2025-12-29 19:52:40 +08:00
parent 2271555a11
commit 26b25df027

View File

@ -128,7 +128,22 @@ const isCopied = ref(false);
const copyToClipboard = async (text) => {
try {
await navigator.clipboard.writeText(text);
if (navigator.clipboard && navigator.clipboard.writeText) {
await navigator.clipboard.writeText(text);
} else {
// 使 execCommand
const textArea = document.createElement('textarea');
textArea.value = text;
textArea.style.position = 'fixed';
textArea.style.left = '-999999px';
textArea.style.top = '-999999px';
document.body.appendChild(textArea);
textArea.focus();
textArea.select();
const successful = document.execCommand('copy');
document.body.removeChild(textArea);
if (!successful) throw new Error('execCommand failed');
}
isCopied.value = true;
setTimeout(() => {
isCopied.value = false;
@ -662,11 +677,50 @@ const parsedData = computed(() => {
cite {
font-size: 12px;
color: var(--gray-700);
color: var(--gray-800);
font-style: normal;
background-color: var(--gray-200);
border-radius: 4px;
outline: 2px solid var(--gray-200);
padding: 0rem 0.25rem;
margin-left: 4px;
cursor: pointer;
user-select: none;
position: relative;
&:hover::after {
content: attr(source);
position: absolute;
bottom: calc(100% + 6px);
left: 50%;
transform: translateX(-50%);
padding: 8px 12px;
background-color: var(--gray-900);
color: #fff;
font-size: 13px;
line-height: 1.5;
border-radius: 6px;
min-width: 200px;
max-width: 400px;
width: max-content;
white-space: normal;
word-break: break-word;
z-index: 1000;
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
pointer-events: none;
text-align: center;
}
&:hover::before {
content: '';
position: absolute;
bottom: 100%;
left: 50%;
transform: translateX(-50%);
border: 5px solid transparent;
border-top-color: var(--gray-900);
z-index: 1000;
}
}
a {