左侧菜单栏收缩展开跳动问题

src/layout/index.vue

@@ -41,19 +41,19 @@
           <img src="../assets/Star.png" alt="favorites"/>
           <template #title>收藏夹</template>
         </el-menu-item>
-        <el-menu-item index="/history" v-if="userStore.isCollapse">
+        <!-- <el-menu-item index="/history" v-if="userStore.isCollapse">
           <img src="../assets/history.png" alt="history"/>
           <template #title>历史记录</template>
-        </el-menu-item>
+        </el-menu-item> -->
       </el-menu>
       </div>
       <!-- 历史记录 -->
-      <div class="history-container" v-show="!userStore.isCollapse&&historyList.length>0">
+      <div class="history-container" :class="{ 'is-collapse': userStore.isCollapse }">
         <div class="history-title">
           <img src="../assets/history.png" alt="history"/>
-          历史记录
+          <span v-show="!userStore.isCollapse&&historyList.length>0">历史记录</span>
         </div>
-        <div class="history-list">
+        <div class="history-list"  v-show="!userStore.isCollapse&&historyList.length>0">
           <div v-for="(item, index) in historyList" 
                :key="index" 
                class="history-item"
@@ -326,12 +326,21 @@ const handleNewChat = () => {
     font-weight: bold;
     display: flex;
     align-items: center;
+    white-space: nowrap;
     img{
       width: 20px;
       height: 20px;
       margin-right: 8px;
     }
   }
+  &.is-collapse{
+    .history-title{
+      justify-content: center;
+      img{
+        margin-right: 0;
+      }
+    }
+  }
   
   .history-item {
     color: $sidebar-text;

src/views/AIChat.vue

@@ -11,11 +11,11 @@
       <div v-for="(message, index) in messages" :key="index" 
            :class="['message', message.role === 'user' ? 'user' : 'assistant']">
         <div class="avatar" v-if="message.content">
-          <img :src="message.role === 'user' ? userAvatar : assistantAvatar" :alt="message.role">
+          <img :src="message.role === 'user' ? userStore.userInfo.headUrl||userAvatar : assistantAvatar" :alt="message.role">
         </div>
         <div class="content" v-if="message.content">
           <div class="text markdown-body" v-html="message.content"></div>
-          <div class="message-actions" v-if="message.role === 'assistant'">
+          <div class="message-actions" v-if="message.role === 'assistant' && !loading">
             <div class="left-actions">
               <button class="action-btn" @click="copyContent(message.content)">
                 <img src="@/assets/icon-copy.png" alt="复制">
@@ -184,6 +184,7 @@ const toggleKnowledge = (id) => {
 const scrollToBottom = async () => {
   await nextTick()
   if (messagesRef.value) {
+    console.log('messagesRef.value',messagesRef.value);
     messagesRef.value.scrollTop = messagesRef.value.scrollHeight
   }
 }
@@ -236,10 +237,9 @@ const handleSend = async () => {
   // 清空输入框
   inputMessage.value = ''
   
-  await scrollToBottom()
-
   // 开始流式响应
   loading.value = true
+  await scrollToBottom()
   simulateStreamResponse(currentMessage)
 }
 
@@ -635,6 +635,7 @@ onMounted(async () => {
           img{
             width: 40px;
             height: 40px;
+            border-radius: 50%;
           }
         }
       .text {