From 39245dfcacee927eaf7873247eab0e2caaefc84a Mon Sep 17 00:00:00 2001
From: ZF sun <34314687@qq.com>
Date: Wed, 13 May 2026 14:08:58 +0800
Subject: [PATCH] =?UTF-8?q?fix(ai-chat):=20=E4=BF=AE=E5=A4=8D=E8=BE=93?=
 =?UTF-8?q?=E5=85=A5=E6=A1=86=E5=AE=9A=E4=BD=8D=E5=8F=8A=E6=BB=9A=E5=8A=A8?=
 =?UTF-8?q?=E9=97=AE=E9=A2=98=E5=B9=B6=E6=9B=B4=E6=96=B0=E5=AE=A2=E6=9C=8D?=
 =?UTF-8?q?=E5=90=8D=E7=A7=B0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 common/js/customer-service.js          | 10 ++--
 pages.json                             |  2 +-
 pages_tool/ai-chat/ai-chat-message.vue | 83 ++++++++------------------
 3 files changed, 30 insertions(+), 65 deletions(-)

diff --git a/common/js/customer-service.js b/common/js/customer-service.js
index 288770f..13a2ded 100644
--- a/common/js/customer-service.js
+++ b/common/js/customer-service.js
@@ -119,7 +119,7 @@ export class CustomerService {
     }
 
     /**
-     * 跳转到 AI 客服页面（Dify）
+     * 跳转到 AI智能客服页面（Dify）
      */
     openDifyService() {
         try {
@@ -135,7 +135,7 @@ export class CustomerService {
             uni.navigateTo({
                 url: aiChatUrl,
                 fail: (err) => {
-                    console.error('跳转 AI 客服失败:', err);
+                    console.error('跳转 AI智能客服失败:', err);
                     // H5 兜底
                     // #ifdef H5
                     window.location.href = aiChatUrl;
@@ -144,7 +144,7 @@ export class CustomerService {
                 }
             });
         } catch (e) {
-            console.error('跳转 AI 客服异常:', e);
+            console.error('跳转 AI智能客服异常:', e);
             uni.showToast({ title: '打开客服失败', icon: 'none' });
         }
     }
@@ -565,7 +565,7 @@ export class CustomerService {
             uni.navigateTo({
                 url: aiChatUrl,
                 fail: (err) => {
-                    console.error('跳转 AI 客服失败:', err);
+                    console.error('跳转 AI智能客服失败:', err);
                     // #ifdef H5
                     window.location.href = aiChatUrl;
                     // #endif
@@ -573,7 +573,7 @@ export class CustomerService {
                 }
             });
         } catch (e) {
-            console.error('跳转 AI 客服异常:', e);
+            console.error('跳转 AI智能客服异常:', e);
             uni.showToast({ title: '打开客服失败', icon: 'none' });
         }
     }
diff --git a/pages.json b/pages.json
index 0c468d2..a2ea398 100644
--- a/pages.json
+++ b/pages.json
@@ -318,7 +318,7 @@
 				{
 					"path": "ai-chat/index",
 					 "style": {
-					 "navigationBarTitleText": "AI 客服"
+					 "navigationBarTitleText": "AI智能客服"
 					}
 				},
 				{
diff --git a/pages_tool/ai-chat/ai-chat-message.vue b/pages_tool/ai-chat/ai-chat-message.vue
index 6f7381c..16e5ec8 100644
--- a/pages_tool/ai-chat/ai-chat-message.vue
+++ b/pages_tool/ai-chat/ai-chat-message.vue
@@ -358,7 +358,7 @@
     </view>
     
     <!-- 头像选择弹窗 -->
-    <view v-if="showAvatarSelector" class="avatar-selector-popup" style="pointer-events: auto;">
+    <view v-if="showAvatarSelector" class="avatar-selector-popup">
       <view class="avatar-selector-mask" @click="closeAvatarSelector"></view>
       <view class="avatar-selector-panel">
         <view class="avatar-selector-header">
@@ -523,18 +523,17 @@ export default {
       return this.$util.img(IMAGE_CONFIG.aiAvatar);
     },
     chatMessagesStyle() {
-      // 键盘高度是像素值，我们需要为聊天区域添加足够的底部padding
-      // 确保最后一条消息在键盘上方可见
-      const extraPadding = 200; // 额外的padding(px)
-      const totalPadding = this.keyboardHeight > 0 ? this.keyboardHeight + extraPadding : 150; // 默认150px
+      // 输入框在 flex 流中，scroll-view 仅在键盘弹出时需要底部padding
+      // 键盘收起时：padding = 0（scroll-view 底部自然紧贴输入框顶部）
+      // 键盘弹出时：padding = 键盘高度（避免最后消息被键盘遮挡）
       return {
-        paddingBottom: totalPadding + 'px'
+        'padding-bottom': this.keyboardHeight > 0 ? this.keyboardHeight + 'px' : '0px'
       };
     },
     inputAreaStyle() {
-      return {
-        bottom: this.keyboardHeight > 0 ? this.keyboardHeight + 'px' : '0px'
-      };
+      // 输入框在 flex 流中自然定位到容器底部，无需额外样式
+      // 键盘弹出时由 <textarea adjust-position> 自动处理页面偏移
+      return {};
     },
     canSendMessage() {
       const hasContent = this.inputText && this.inputText.trim() !== ''
@@ -543,7 +542,7 @@ export default {
     }
   },
    onShow() {
-     // 如果不是 AI 客服，立即退出并跳转
+     // 如果不是 AI智能客服，立即退出并跳转
      if (customerServiceType !== 'ai') {
        uni.showToast({ title: '当前客服类型不支持此页面', icon: 'none' });
        setTimeout(() => {
@@ -622,7 +621,8 @@ export default {
         });
       }
     },
-	  // 【新增：会话 ID 本地缓存方法】
+
+    // 【新增：会话 ID 本地缓存方法】
 	   saveConversationIdToLocal(convId) {
 	      if (convId) {
 	        uni.setStorageSync('dify_conversation_id', convId);
@@ -1461,23 +1461,16 @@ _handleStreamError(msg) {
     
     // 滚动到底部 - 统一使用 scroll-into-view
     scrollToBottom() {
-      if (this.scrollTimer) {
-        clearTimeout(this.scrollTimer);
-      }
-      this.scrollTimer = setTimeout(() => {
-        if (this.messages.length > 0) {
-          const filteredMessages = this.messages.filter(msg => msg.content && msg.content.trim() !== '');
-          if (filteredMessages.length > 0) {
-            const lastMessage = filteredMessages[filteredMessages.length - 1];
-            const lastIndex = this.messages.indexOf(lastMessage);
-            // 先设为空，再设置新值，确保能触发滚动
-            this.scrollIntoViewId = null;
-            this.$nextTick(() => {
-              this.scrollIntoViewId = `msg-${lastMessage.id || lastMessage.timestamp}-${lastIndex}`;
-            });
-          }
-        }
-      }, 100);
+      if (this.messages.length === 0) return
+      // 取真实最后一条消息（包括空内容的流式消息）
+      const lastMsg = this.messages[this.messages.length - 1]
+      const lastIndex = this.messages.length - 1
+      const key = lastMsg.id || lastMsg.timestamp || lastIndex
+      // 先清空再设置，确保 scroll-into-view 重新触发
+      this.scrollIntoViewId = ''
+      this.$nextTick(() => {
+        this.scrollIntoViewId = 'msg-' + key + '-' + lastIndex
+      })
     },
     
     // 加载更多历史消息
@@ -2224,9 +2217,7 @@ $radius-lg: 36rpx;
   flex-direction: column;
   background: #f8f8f8; /* 微信聊天页面背景色 */
   overflow: hidden;
-  padding-bottom: env(safe-area-inset-bottom);
   box-sizing: border-box;
-  position: relative;
 
   .chat-messages {
     flex: 1;
@@ -2236,9 +2227,7 @@ $radius-lg: 36rpx;
     min-height: 0; /* 重要：防止flex元素溢出 */
     
     /* 微信小程序专属：聊天消息区域增加底部内边距，确保键盘弹出时最后一条消息可见 */
-    /* #ifdef MP-WEIXIN */
-    padding-bottom: 300rpx;
-    /* #endif */
+    /* 由 chatMessagesStyle 动态控制 */
     
     .load-more {
       text-align: center;
@@ -2897,24 +2886,15 @@ $radius-lg: 36rpx;
     }
   }
 
-  /* 输入区域 */
+    /* 输入区域 */
   .input-area {
     background: white; /* 白色 */
     border-top: 1rpx solid #e5e5e5;
     padding: 16rpx 24rpx;
-    /* 确保在微信小程序中紧贴底部 */
     flex-shrink: 0;
     /* 微信小程序安全区域适配 */
     padding-bottom: calc(16rpx + env(safe-area-inset-bottom));
-    /* 确保输入区域正确显示 */
-    position: fixed;
-    left: 0;
-    right: 0;
-    bottom: 0;
-    z-index: 10;
-    /* #ifdef MP-WEIXIN */
-    /* 微信小程序中使用绝对定位，方便动态设置bottom */
-    /* #endif */
+    box-sizing: border-box;
 
     .input-tools {
       display: flex;
@@ -3053,17 +3033,8 @@ $radius-lg: 36rpx;
     left: 0;
     right: 0;
     bottom: 0;
-    pointer-events: none; /* 让鼠标事件穿透容器，不影响主内容交互 */
     z-index: 999; /* 基础弹窗层级 */
     
-    /* 子弹窗需要开启 pointer-events，否则点击无效 */
-    > .tools-popup,
-    > .voice-popup,
-    > .avatar-selector-popup,
-    > .nickname-editor-popup {
-      pointer-events: auto;
-    }
-    
     /* 昵称编辑弹窗层级最高，避免被其他弹窗遮挡 */
     > .nickname-editor-popup {
       z-index: 1001;
@@ -3087,7 +3058,6 @@ $radius-lg: 36rpx;
     right: 0;
     bottom: 0;
     background-color: rgba(0, 0, 0, 0.4);
-    backdrop-filter: blur(6rpx);
   }
 
   .nickname-editor-panel {
@@ -3237,7 +3207,6 @@ $radius-lg: 36rpx;
       right: 0;
       bottom: 0;
       background-color: rgba(0, 0, 0, 0.4);
-      backdrop-filter: blur(6rpx);
     }
 
     .tools-panel {
@@ -3348,7 +3317,6 @@ $radius-lg: 36rpx;
       right: 0;
       bottom: 0;
       background-color: rgba(0, 0, 0, 0.4);
-      backdrop-filter: blur(6rpx);
     }
 
     .voice-input-panel {
@@ -3488,7 +3456,6 @@ $radius-lg: 36rpx;
       right: 0;
       bottom: 0;
       background-color: rgba(0, 0, 0, 0.4);
-      backdrop-filter: blur(6rpx);
     }
 
     .avatar-selector-panel {
@@ -3867,7 +3834,6 @@ $radius-lg: 36rpx;
     right: 0;
     bottom: 0;
     background-color: rgba(0, 0, 0, 0.4);
-    backdrop-filter: blur(6rpx);
   }
 
   .emoji-panel {
@@ -3989,7 +3955,6 @@ $radius-lg: 36rpx;
     right: 0;
     bottom: 0;
     background-color: rgba(0, 0, 0, 0.4);
-    backdrop-filter: blur(6rpx);
   }
   
   .expand-editor-panel {