From e1ab11c0072021fa0c34522afd3f5c7e33a8500b Mon Sep 17 00:00:00 2001
From: hubian <908234780@qq.com>
Date: Sat, 25 Apr 2026 17:20:32 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E6=B7=BB=E5=8A=A0=E5=A4=8D=E5=88=B6?=
 =?UTF-8?q?=E6=8C=89=E9=92=AE=EF=BC=88=E5=A4=8D=E5=88=B6=E5=8E=9F=E6=96=87?=
 =?UTF-8?q?=EF=BC=89?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 用户和AI消息都添加复制按钮
- 复制原始文本内容（不包含Markdown格式）
- 添加Toast提示显示复制成功
- 复制按钮hover时显示蓝色
---
 works/ai-chat-app/www/app.js    | 41 ++++++++++++++++++++++++++++++++-
 works/ai-chat-app/www/style.css | 28 ++++++++++++++++++++++
 2 files changed, 68 insertions(+), 1 deletion(-)

diff --git a/works/ai-chat-app/www/app.js b/works/ai-chat-app/www/app.js
index 2bab46d..e6921ab 100644
--- a/works/ai-chat-app/www/app.js
+++ b/works/ai-chat-app/www/app.js
@@ -174,6 +174,41 @@ async function regenerate(index) {
   await streamGenerate(userMsgIndex);
 }
 
+// 复制消息（复制原文）
+function copyMessage(index) {
+  const content = messages[index].content;
+  
+  navigator.clipboard.writeText(content).then(() => {
+    showToast('已复制到剪贴板');
+  }).catch(err => {
+    console.error('复制失败:', err);
+    // 备用方案
+    const textarea = document.createElement('textarea');
+    textarea.value = content;
+    textarea.style.position = 'fixed';
+    textarea.style.opacity = '0';
+    document.body.appendChild(textarea);
+    textarea.select();
+    document.execCommand('copy');
+    document.body.removeChild(textarea);
+    showToast('已复制到剪贴板');
+  });
+}
+
+// 显示提示
+function showToast(message) {
+  const toast = document.createElement('div');
+  toast.className = 'toast';
+  toast.textContent = message;
+  document.body.appendChild(toast);
+  
+  setTimeout(() => toast.classList.add('show'), 10);
+  setTimeout(() => {
+    toast.classList.remove('show');
+    setTimeout(() => document.body.removeChild(toast), 300);
+  }, 2000);
+}
+
 // 删除消息
 function deleteMessage(index) {
   if (isLoading) return;
@@ -212,14 +247,18 @@ function renderMessages() {
     const avatar = isUser ? '👤' : '🤖';
     const content = renderMarkdown(msg.content);
     
-    // 操作按钮
+    // 操作按钮（复制按钮放在最前面）
+    const copyIcon = `<svg viewBox="0 0 24 24" width="16" height="16"><path fill="currentColor" d="M16 1H4c-1.1 0-2 .9-2 2v14h2V3h12V1zm3 4H8c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h11c1.1 0 2-.9 2-2V7c0-1.1-.9-2-2-2zm0 16H8V7h11v14z"/></svg>`;
+    
     const actions = isUser 
       ? `<div class="message-actions">
+          <button class="action-btn copy-btn" onclick="copyMessage(${index})" title="复制">${copyIcon}</button>
           <button class="action-btn delete-btn" onclick="deleteMessage(${index})" title="删除">
             <svg viewBox="0 0 24 24" width="16" height="16"><path fill="currentColor" d="M6 19c0 1.1.9 2 2 2h8c1.1 0 2-.9 2-2V7H6v12zM19 4h-3.5l-1-1h-5l-1 1H5v2h14V4z"/></svg>
           </button>
         </div>`
       : `<div class="message-actions">
+          <button class="action-btn copy-btn" onclick="copyMessage(${index})" title="复制">${copyIcon}</button>
           <button class="action-btn regenerate-btn" onclick="regenerate(${index})" title="重新生成">
             <svg viewBox="0 0 24 24" width="16" height="16"><path fill="currentColor" d="M17.65 6.35C16.2 4.9 14.21 4 12 4c-4.42 0-7.99 3.58-7.99 8s3.57 8 7.99 8c3.73 0 6.84-2.55 7.73-6h-2.08c-.82 2.33-3.04 4-5.65 4-3.31 0-6-2.69-6-6s2.69-6 6-6c1.66 0 3.14.69 4.22 1.78L13 11h7V4l-2.35 2.35z"/></svg>
           </button>
diff --git a/works/ai-chat-app/www/style.css b/works/ai-chat-app/www/style.css
index 3009e4d..d6148d3 100644
--- a/works/ai-chat-app/www/style.css
+++ b/works/ai-chat-app/www/style.css
@@ -299,6 +299,28 @@ body {
   padding: 8px;
 }
 
+/* Toast 提示 */
+.toast {
+  position: fixed;
+  top: 80px;
+  left: 50%;
+  transform: translateX(-50%) translateY(-20px);
+  background: var(--text-color);
+  color: white;
+  padding: 12px 24px;
+  border-radius: 8px;
+  font-size: 14px;
+  opacity: 0;
+  transition: all 0.3s ease;
+  z-index: 1000;
+  box-shadow: 0 4px 12px rgba(0,0,0,0.2);
+}
+
+.toast.show {
+  opacity: 1;
+  transform: translateX(-50%) translateY(0);
+}
+
 /* 消息结构 */
 .message-body {
   display: flex;
@@ -345,6 +367,12 @@ body {
   color: var(--text-color);
 }
 
+.action-btn.copy-btn:hover {
+  background: #dbeafe;
+  border-color: var(--primary);
+  color: var(--primary);
+}
+
 .action-btn.delete-btn:hover {
   background: #fee2e2;
   border-color: #e53e3e;