From 86b3a51206b56b312eb3bdfc61c2c1a75e1de588 Mon Sep 17 00:00:00 2001
From: yangzhe <yangzhe@qq.com>
Date: Wed, 18 Mar 2026 11:21:38 +0800
Subject: [PATCH 1/2] =?UTF-8?q?fix(home):=20=E5=B0=86=E6=B6=88=E6=81=AF?=
 =?UTF-8?q?=E5=AE=B9=E5=99=A8=E7=9A=84=E5=AE=BD=E5=BA=A6=E5=B1=9E=E6=80=A7?=
 =?UTF-8?q?=E6=94=B9=E4=B8=BA=E6=9C=80=E5=A4=A7=E5=AE=BD=E5=BA=A6?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

避免消息内容过长时超出容器宽度，保持布局的灵活性
---
 pages/home/index/index.vue | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/pages/home/index/index.vue b/pages/home/index/index.vue
index fc71d7c..a09e304 100644
--- a/pages/home/index/index.vue
+++ b/pages/home/index/index.vue
@@ -1783,12 +1783,12 @@ export default {
         }
 
         .message-content-width {
-          width: 70%;
+          max-width: 70%;
         }
 
         /* 回答反馈容器，跟随左侧消息，右下角对齐 */
         .feedback-container {
-          width: 70%;
+          max-width: 70%;
           margin-left: 80rpx; /* 头像宽度64rpx + 间距16rpx */
           display: flex;
           justify-content: flex-end;

From 227b836d937bed1b98cc49d46f99e8007d6e401f Mon Sep 17 00:00:00 2001
From: yangzhe <yangzhe@qq.com>
Date: Wed, 18 Mar 2026 13:57:41 +0800
Subject: [PATCH 2/2] =?UTF-8?q?refactor(home):=20=E4=B8=BAAI=E5=92=8C?=
 =?UTF-8?q?=E8=80=81=E5=B8=88=E6=B6=88=E6=81=AF=E5=86=85=E5=AE=B9=E6=B7=BB?=
 =?UTF-8?q?=E5=8A=A0=E5=AE=B9=E5=99=A8=E5=8C=85=E8=A3=85=E5=B1=82?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

重构消息列表布局，将AI和老师消息的avatar和内容区域分别包裹在独立的容器元素中。
---
 pages/home/index/index.vue | 93 ++++++++++++++++++++++----------------
 1 file changed, 53 insertions(+), 40 deletions(-)

diff --git a/pages/home/index/index.vue b/pages/home/index/index.vue
index a09e304..14b6ea5 100644
--- a/pages/home/index/index.vue
+++ b/pages/home/index/index.vue
@@ -248,25 +248,27 @@
               "
               :id="'msg-' + message.id"
             >
-              <image
-                class="ai-avatar"
-                src="/static/common/images/avatar_ai.png"
-                mode="scaleToFill"
-              />
-              <view
-                class="message-content"
-                :class="{
-                  'message-content-width': !message.isLoading,
-                }"
-              >
-                <!-- 加载动画 -->
-                <view v-if="message.isLoading" class="loading-dots">
-                  <view class="dot"></view>
-                  <view class="dot"></view>
-                  <view class="dot"></view>
+              <view class="message-content-container-AI">
+                <image
+                  class="ai-avatar"
+                  src="/static/common/images/avatar_ai.png"
+                  mode="scaleToFill"
+                />
+                <view
+                  class="message-content"
+                  :class="{
+                    'message-content-width': !message.isLoading,
+                  }"
+                >
+                  <!-- 加载动画 -->
+                  <view v-if="message.isLoading" class="loading-dots">
+                    <view class="dot"></view>
+                    <view class="dot"></view>
+                    <view class="dot"></view>
+                  </view>
+                  <!-- 正常消息内容 -->
+                  <markdown-viewer v-else :content="message.message" />
                 </view>
-                <!-- 正常消息内容 -->
-                <markdown-viewer v-else :content="message.message" />
               </view>
 
               <!-- 回答反馈：点赞/点踩 -->
@@ -310,23 +312,25 @@
               v-else-if="message.interactMode === 8"
               :id="'msg-' + message.id"
             >
-              <image
-                class="ai-avatar"
-                :src="receiverHeadSculptureUrl"
-                mode="scaleToFill"
-              />
-              <view
-                class="message-content"
-                :class="{
-                  'message-content-width': !message.isLoading,
-                }"
-              >
-                <view v-if="message.isLoading" class="loading-dots">
-                  <view class="dot"></view>
-                  <view class="dot"></view>
-                  <view class="dot"></view>
+              <view class="message-content-container-Teacher">
+                <image
+                  class="ai-avatar"
+                  :src="receiverHeadSculptureUrl"
+                  mode="scaleToFill"
+                />
+                <view
+                  class="message-content"
+                  :class="{
+                    'message-content-width': !message.isLoading,
+                  }"
+                >
+                  <view v-if="message.isLoading" class="loading-dots">
+                    <view class="dot"></view>
+                    <view class="dot"></view>
+                    <view class="dot"></view>
+                  </view>
+                  <markdown-viewer v-else :content="message.message" />
                 </view>
-                <markdown-viewer v-else :content="message.message" />
               </view>
             </view>
           </block>
@@ -702,10 +706,12 @@ export default {
     // 处理功能点击
     handleFeatureClick(item) {
       const actions = {
-        "首页": () => this.resetChatState({ isChat: false }),
-        "转人工": () => this.handleTransferEntryClick(),
-        "结束会话": () => this.handleEndConversation(),
-        "电话咨询": () => { this.advicePhoneShow = true; }
+        首页: () => this.resetChatState({ isChat: false }),
+        转人工: () => this.handleTransferEntryClick(),
+        结束会话: () => this.handleEndConversation(),
+        电话咨询: () => {
+          this.advicePhoneShow = true;
+        },
       };
 
       const action = actions[item.title];
@@ -1688,8 +1694,14 @@ export default {
       }
 
       .message-left {
-        justify-content: flex-start;
-        flex-wrap: wrap; /* 允许反馈区换行到消息下方 */
+        flex-direction: column;
+
+        .message-content-container-AI,
+        .message-content-container-Teacher {
+          display: flex;
+          justify-content: flex-start;
+          flex-wrap: wrap; /* 允许反馈区换行到消息下方 */
+        }
 
         .ai-avatar {
           width: 64rpx;
@@ -1785,6 +1797,7 @@ export default {
         .message-content-width {
           max-width: 70%;
         }
+        // }
 
         /* 回答反馈容器，跟随左侧消息，右下角对齐 */
         .feedback-container {