From 3489b89a0bfbaffba106ad38b8622f830e8b3dea Mon Sep 17 00:00:00 2001
From: jinhhanhan <1683105490@qq.com>
Date: Sat, 25 Apr 2026 14:15:03 +0800
Subject: [PATCH] =?UTF-8?q?chore=EF=BC=9A=E6=99=BA=E8=83=BD=E5=AE=A2?=
 =?UTF-8?q?=E6=9C=8D=E5=8A=A0=E4=BA=86=E8=A1=A8=E6=83=85?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 pages_tool/ai-chat/ai-chat-message.vue | 373 ++++++++++++++++++++++++-
 1 file changed, 367 insertions(+), 6 deletions(-)

diff --git a/pages_tool/ai-chat/ai-chat-message.vue b/pages_tool/ai-chat/ai-chat-message.vue
index 201e6c0..f432dd4 100644
--- a/pages_tool/ai-chat/ai-chat-message.vue
+++ b/pages_tool/ai-chat/ai-chat-message.vue
@@ -211,12 +211,17 @@
           @confirm="sendMessage"
           @input="onInput" />
         
+        <!-- Emoji按钮 -->
+        <button class="emoji-btn" @click="toggleEmojiPanel">
+          <text class="iconfont icon-smile">😊</text>
+        </button>
+        
         <!-- 发送按钮 -->
         <button 
           class="send-btn" 
-          :class="{ disabled: !inputText.trim() }"
+          :class="{ disabled: !canSendMessage }"
           @click="sendMessage"
-          :disabled="!inputText.trim()">
+          :disabled="!canSendMessage">
           <text>发送</text>
         </button>
       </view>
@@ -261,6 +266,28 @@
       </view>
     </view>
     
+    <!-- Emoji面板 -->
+    <view v-if="showEmojiPanel" class="emoji-popup">
+      <view class="emoji-mask" @click="hideEmojiPanel"></view>
+      <view class="emoji-panel">
+        <view class="emoji-header">
+          <text>选择表情</text>
+          <button class="close-btn" @click="hideEmojiPanel">
+            <text class="iconfont icon-close"></text>
+          </button>
+        </view>
+        <scroll-view class="emoji-grid" scroll-y>
+          <view 
+            v-for="(emoji, index) in emojiList" 
+            :key="index" 
+            class="emoji-item"
+            @click="insertEmoji(emoji)">
+            <text class="emoji-text">{{ emoji }}</text>
+          </view>
+        </scroll-view>
+      </view>
+    </view>
+    
     <!-- 语音输入面板 -->
     <view v-if="enalbeVoicePanelShow" class="voice-popup">
       <view class="voice-mask" @click="hideVoicePanel"></view>
@@ -411,6 +438,8 @@ export default {
       messageId: 0,
       showToolsPanel: false,
       enalbeVoicePanelShow: false,
+      showEmojiPanel: false,
+      emojiList: ['😀','😃','😄','😁','😆','😅','🤣','😂','🙂','🙃','😉','😊','😇','🥰','😍','🤩','😘','😗','😚','😋','😛','😜','🤪','😝','🤑','🤗','🤭','🤫','🤔','🤐','🤨','😐','😑','😶','😏','😒','🙄','😬','🤥','😌','😔','😪','🤤','😴','😷','🤒','🤕','🤢','🤮','🤧','🥵','🥶','🥴','😵','🤯','🤠','🥳','😎','🤓','🧐','😕','😟','🙁','😮','😯','😲','😳','🥺','😦','😧','😨','😰','😥','😢','😭','😱','😖','😣','😞','😓','😩','😫','🥱','😤','😡','😠','🤬','😈','👿','💀','💩','👻','👽','🤖','🎃','😺','😸','😹','😻','😼','😽','🙀','😿','😾','👋','🤚','🖐','✋','🖖','👌','🤏','✌','🤞','🤟','🤘','🤙','👈','👉','👆','🖕','👇','☝','👍','👎','✊','👊','🤛','🤜','👏','🙌','👐','🤲','🤝','🙏','✍','💅','🤳','💪','💗','💓','💕','💖','💝','💞','💘','💌','💟','💛','💙','💜','🖤','💔','💢','💣','💥','💫','💦','💨','👁','👀','👅','👄','👂','👃','👶','👦','👧','👨','👩','👴','👵','👱','👲','👳','👴','👵','👶','👼','👸','🎅','🤶','🦸','🦹','🧙','🧚','🧛','🧜','🧝','🧞','🧟','🦄','🐶','🐱','🐭','🐹','🐰','🦊','🐻','🐼','🐨','🐯','🦁','🐮','🐷','🐸','🐵','🙈','🙉','🙊','🐒','🐔','🐧','🐦','🐤','🐣','🐥','🦆','🦅','🦉','🦇','🐺','🐗','🐴','🦄','🐝','🐛','🦋','🐌','🐞','🐜','🦟','🦗','🕷','🦂','🐢','🐍','🦎','🦖','🦕','🐙','🦑','🦐','🦞','🦀','🐡','🐠','🐟','🐬','🐳','🐋','🦈','🐊','🐅','🐆','🦓','🦍','🦧','🐘','🦛','🦏','🐪','🐫','🦒','🦘','🐃','🐂','🐄','🐎','🐖','🐏','🐑','🐐','🐓','🦃','🦚','🦜','🦢','🦩','🕊','🐕','🐩','🐈','🐓','🐇','🐁','🐀','🐿','🦔','🐾','🐉','🐲'],
       streamingMessage: null,
       streamInterval: null,
       streamContent: '',
@@ -461,6 +490,11 @@ export default {
       return {
         bottom: this.keyboardHeight > 0 ? this.keyboardHeight + 'px' : '0px'
       };
+    },
+    canSendMessage() {
+      const hasContent = this.inputText && this.inputText.trim() !== ''
+      const hasEmoji = this.containsEmoji(this.inputText)
+      return hasContent || hasEmoji
     }
   },
    onShow() {
@@ -812,13 +846,17 @@ async loadChatHistoryIfExist() {
     
     // 发送消息
     async sendMessage() {
-      if (!this.inputText.trim()) return
+      // 确保有内容或表情
+      const hasContent = this.inputText && this.inputText.trim() !== ''
+      const hasEmoji = this.containsEmoji(this.inputText)
+      
+      if (!hasContent && !hasEmoji) return
       
       const userMessage = {
         id: ++this.messageId,
         role: 'user',
         type: 'text',
-        content: this.inputText.trim(),
+        content: this.inputText,
         timestamp: Date.now()
       }
        this.shouldScrollToBottom = true
@@ -846,10 +884,11 @@ async loadChatHistoryIfExist() {
         }
         
         // 使用AI服务获取回复
+        const enhancedMessage = this.enhanceEmojiMessage(userMessage.content)
         if (this.enableStreaming) {
-          await this.sendStreamMessage(userMessage.content)
+          await this.sendStreamMessage(enhancedMessage)
         } else {
-          await this.sendNormalMessage(userMessage.content)
+          await this.sendNormalMessage(enhancedMessage)
         }
         
       } catch (error) {
@@ -1251,6 +1290,22 @@ async loadChatHistoryIfExist() {
       this.showToolsPanel = false
     },
     
+    // 切换Emoji面板
+    toggleEmojiPanel() {
+      this.showEmojiPanel = !this.showEmojiPanel
+    },
+    
+    // 隐藏Emoji面板
+    hideEmojiPanel() {
+      this.showEmojiPanel = false
+    },
+    
+    // 插入Emoji
+    insertEmoji(emoji) {
+      this.inputText += emoji
+      this.hideEmojiPanel()
+    },
+    
     // 显示语音面板
     showVoicePanel() {
       this.enalbeVoicePanelShow = true
@@ -1641,6 +1696,193 @@ async loadChatHistoryIfExist() {
       this.historyOffset = 0
       // 触发清空事件
       this.$emit('messages-cleared')
+    },
+    
+    // 检测字符串中是否包含表情
+    containsEmoji(str) {
+      const emojiReg = /[\u{1f300}-\u{1f9ff}\u{1f1e0}-\u{1f1ff}\u{2600}-\u{26ff}\u{2700}-\u{27bf}\u{1f900}-\u{1f9ff}\u{1f600}-\u{1f64f}\u{1f680}-\u{1f6ff}\u{200d}\u{2640}-\u{2642}\u{2300}-\u{23ff}\u{2b50}-\u{2bff}]/gu
+      return emojiReg.test(str)
+    },
+    
+    // 根据表情生成适当的提示文本，帮助 AI 更好地理解
+    enhanceEmojiMessage(content) {
+      // 常见表情的含义映射
+      const emojiResponses = {
+        '😀': '[开心]',
+        '😂': '[大笑]',
+        '😊': '[微笑]',
+        '❤️': '[爱心]',
+        '👍': '[点赞]',
+        '😭': '[哭泣]',
+        '🙏': '[感谢/拜托]',
+        '😍': '[喜欢]',
+        '🎉': '[庆祝]',
+        '🤔': '[思考]',
+        '😅': '[尴尬]',
+        '😁': '[开心]',
+        '🥰': '[喜爱]',
+        '😘': '[飞吻]',
+        '😏': '[坏笑]',
+        '🥳': '[庆祝]',
+        '😔': '[难过]',
+        '😢': '[哭泣]',
+        '😤': '[生气]',
+        '😴': '[困]',
+        '🤗': '[拥抱]',
+        '🙂': '[微笑]',
+        '😃': '[开心]',
+        '😄': '[大笑]',
+        '😆': '[开心]',
+        '😇': '[天使]',
+        '🤩': '[惊喜]',
+        '😋': '[好吃]',
+        '😛': '[调皮]',
+        '😜': '[调皮]',
+        '🤪': '[搞怪]',
+        '😝': '[开心]',
+        '🤑': '[发财]',
+        '🤭': '[害羞]',
+        '🤫': '[嘘]',
+        '🤐': '[闭嘴]',
+        '🤨': '[疑惑]',
+        '😐': '[无语]',
+        '😑': '[无语]',
+        '😶': '[沉默]',
+        '😒': '[不屑]',
+        '🙄': '[白眼]',
+        '😬': '[尴尬]',
+        '🤥': '[说谎]',
+        '😌': '[安心]',
+        '😪': '[困]',
+        '🤤': '[流口水]',
+        '😷': '[生病]',
+        '🤒': '[发烧]',
+        '🤕': '[受伤]',
+        '🤢': '[恶心]',
+        '🤮': '[呕吐]',
+        '🤧': '[感冒]',
+        '🥵': '[热]',
+        '🥶': '[冷]',
+        '🥴': '[头晕]',
+        '😵': '[晕]',
+        '🤯': '[爆炸]',
+        '🤠': '[酷]',
+        '😎': '[酷]',
+        '🤓': '[书呆子]',
+        '🧐': '[疑惑]',
+        '😕': '[困惑]',
+        '😟': '[担心]',
+        '🙁': '[难过]',
+        '😮': '[惊讶]',
+        '😯': '[惊讶]',
+        '😲': '[震惊]',
+        '😳': '[脸红]',
+        '🥺': '[恳求]',
+        '😦': '[惊讶]',
+        '😧': '[惊讶]',
+        '😨': '[害怕]',
+        '😰': '[紧张]',
+        '😥': '[失望]',
+        '😱': '[恐惧]',
+        '😖': '[困扰]',
+        '😣': '[痛苦]',
+        '😞': '[难过]',
+        '😓': '[汗]',
+        '😩': '[累]',
+        '😫': '[累]',
+        '🥱': '[困]',
+        '😡': '[愤怒]',
+        '😠': '[生气]',
+        '🤬': '[咒骂]',
+        '😈': '[恶魔]',
+        '👿': '[生气]',
+        '💀': '[骷髅]',
+        '💩': '[便便]',
+        '👻': '[鬼]',
+        '👽': '[外星人]',
+        '🤖': '[机器人]',
+        '🎃': '[万圣节]',
+        '😺': '[开心猫]',
+        '😸': '[微笑猫]',
+        '😹': '[大笑猫]',
+        '😻': '[花痴猫]',
+        '😼': '[得意猫]',
+        '😽': '[亲亲猫]',
+        '🙀': '[惊讶猫]',
+        '😿': '[哭泣猫]',
+        '😾': '[生气猫]',
+        '👋': '[挥手]',
+        '🤚': '[举手]',
+        '🖐': '[手掌]',
+        '✋': '[手掌]',
+        '🖖': '[V]',
+        '👌': '[OK]',
+        '🤏': '[捏]',
+        '✌️': '[耶]',
+        '🤞': '[好运]',
+        '🤟': '[爱你]',
+        '🤘': '[摇滚]',
+        '🤙': '[打电话]',
+        '👈': '[左边]',
+        '👉': '[右边]',
+        '👆': '[上边]',
+        '🖕': '[竖中指]',
+        '👇': '[下边]',
+        '☝': '[向上]',
+        '👎': '[鄙视]',
+        '✊': '[拳头]',
+        '👊': '[拳头]',
+        '🤛': '[左拳]',
+        '🤜': '[右拳]',
+        '👏': '[鼓掌]',
+        '🙌': '[举手庆祝]',
+        '👐': '[张开手]',
+        '🤲': '[摊手]',
+        '🤝': '[握手]',
+        '✍️': '[写字]',
+        '💅': '[美甲]',
+        '🤳': '[自拍]',
+        '💪': '[肌肉]',
+        '💗': '[爱心]',
+        '💓': '[心跳]',
+        '💕': '[两颗心]',
+        '💖': '[闪亮心]',
+        '💝': '[礼物心]',
+        '💞': '[旋转心]',
+        '💘': '[丘比特]',
+        '💌': '[情书]',
+        '💟': '[心形]',
+        '💛': '[黄心]',
+        '💙': '[蓝心]',
+        '💜': '[紫心]',
+        '🖤': '[黑心]',
+        '💔': '[心碎]',
+        '💢': '[愤怒]',
+        '💣': '[炸弹]',
+        '💥': '[爆炸]',
+        '💫': '[头晕]',
+        '💦': '[汗]',
+        '💨': '[风]',
+        '👁️': '[眼睛]',
+        '👀': '[看]',
+        '👅': '[舌头]',
+        '👄': '[嘴巴]',
+        '👂': '[耳朵]',
+        '👃': '[鼻子]'
+      }
+      
+      // 如果是纯表情消息，添加一些提示
+      if (this.containsEmoji(content) && !content.match(/[\u4e00-\u9fa5a-zA-Z]/)) {
+        let enhancedMessage = content
+        // 为表情添加描述
+        for (let emoji in emojiResponses) {
+          if (content.includes(emoji)) {
+            enhancedMessage += ` (${emojiResponses[emoji]})`
+          }
+        }
+        return enhancedMessage
+      }
+      return content
     }
   }
 }
@@ -2382,6 +2624,25 @@ $radius-lg: 36rpx;
         }
       }
       
+      /* Emoji按钮 */
+      .emoji-btn {
+        width: 72rpx;
+        height: 72rpx;
+        border-radius: 12rpx;
+        background-color: #f2f2f2;
+        margin-left: 12rpx;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        border: none;
+        padding: 0;
+        
+        .iconfont {
+          font-size: 36rpx;
+          line-height: 1;
+        }
+      }
+      
       /* 发送按钮 - 微信聊天样式 */
       .send-btn {
         width: 120rpx;
@@ -3232,4 +3493,104 @@ $radius-lg: 36rpx;
     }
   }
 }
+
+/* Emoji面板 */
+.emoji-popup {
+  position: fixed;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  z-index: 999;
+
+  .emoji-mask {
+    position: absolute;
+    top: 0;
+    left: 0;
+    right: 0;
+    bottom: 0;
+    background-color: rgba(0, 0, 0, 0.4);
+    backdrop-filter: blur(6rpx);
+  }
+
+  .emoji-panel {
+    position: absolute;
+    bottom: 0;
+    left: 0;
+    right: 0;
+    background-color: white;
+    border-radius: $radius-lg $radius-lg 0 0;
+    padding: 32rpx;
+    box-shadow: 0 -4rpx 20rpx rgba(0, 0, 0, 0.08);
+    max-height: 60vh;
+
+    .emoji-header {
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+      margin-bottom: 24rpx;
+      border-bottom: 2rpx solid #f0f4f8;
+      padding-bottom: 16rpx;
+
+      text {
+        font-size: 34rpx;
+        font-weight: 600;
+        color: $color-text;
+      }
+
+      .close-btn {
+        width: 56rpx;
+        height: 56rpx;
+        border-radius: 50%;
+        background-color: $bg-main;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        transition: all 0.2s ease;
+        border: none;
+
+        &:hover {
+          background-color: #e8edf3;
+        }
+
+        .iconfont {
+          font-size: 28rpx;
+          color: $color-text-light;
+        }
+      }
+    }
+
+    .emoji-grid {
+      display: grid;
+      grid-template-columns: repeat(8, 1fr);
+      gap: 16rpx;
+      max-height: 40vh;
+
+      .emoji-item {
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        width: 64rpx;
+        height: 64rpx;
+        border-radius: 12rpx;
+        background-color: #f8f8f8;
+        transition: all 0.2s ease;
+
+        &:hover {
+          background-color: #e8edf3;
+          transform: scale(1.1);
+        }
+
+        &:active {
+          background-color: #d8dde3;
+        }
+
+        .emoji-text {
+          font-size: 36rpx;
+          line-height: 1;
+        }
+      }
+    }
+  }
+}
 </style>