src/views/xjc-integratedmachine/common/ai/chat.vue

@@ -13,8 +13,8 @@
             </div>
         </div>
         <div class="main-content">
-            <div v-loading="loadingHistoryRecord" class="chat-container" ref="chatContainerRef">
-                <div class="message-list">
+            <div v-loading="loadingHistoryRecord" class="chat-container">
+                <div class="message-list" ref="chatContainerRef">
                     <div v-for="(item, index) in chatRecordList" :key="item.id">
                         <div v-if="item.isUser == 1" class="user-message">
                             <img src="@/assets/images/common/ai/user.png" alt="icon" style="margin-left: 4px"/>
@@ -123,7 +123,6 @@
     let activeIndex = ref(0);
 
     // 查看所有聊天记录
-    list();
     function list() {
         loadingHistoryRecord.value = true
         let queryForm = {
@@ -133,6 +132,12 @@
         aiChatRecordList(queryForm).then(resp =>{
             chatRecordList.value = resp.rows;
             loadingHistoryRecord.value = false
+            setInterval(()=>{
+                scrollToBottom();
+            }, 100);
+            if(resp.total == 0){
+                sayHi();
+            }
         })
     }
 
@@ -146,6 +151,16 @@
 
         })
     }
+
+    function sayHi() {
+        const botMsg = {
+            isUser: false,
+            content: '你好，我是来帮助你进行学习规划、选科辅导以及志愿填报的生涯教育专家。如果你有关于这些方面的问题，欢迎随时向我咨询！', // 增量填充
+            isTyping: false, // 显示加载动画
+        }
+        chatRecordList.value.push(botMsg)
+    }
+
     const sendMessage = () => {
         if (inputMessage.value.trim()) {
             sendRequest(inputMessage.value.trim())
@@ -221,7 +236,8 @@
             streamHtmlData.value = htmlData;
             lastMsg.content = marked(streamMarkdownData.value)
             lastMsg.isTyping = false
-            // list()
+            // 组件挂载后自动滚动到底部
+            scrollToBottom();
         }
     }
 
@@ -519,22 +535,15 @@
     /*语音合成 ↑*/
 
     let chatContainerRef = ref(null)
-    let chatContainerRefObj = useTemplateRef(chatContainerRef)
-
-
-    const scrollToBottom = () => {
-        nextTick(() => {
-            chatContainerRef.value.scrollTop = chatContainerRef.value.scrollHeight;
-        });
-    };
+    function scrollToBottom(){
+        chatContainerRef.value.scrollTop = chatContainerRef.value.scrollHeight+20;
+    }
 
     onMounted(()=>{
         nextTick(()=>{
-            // 组件挂载后自动滚动到底部
-            scrollToBottom();
             initSpeechRecognition();
             initSpeechsynthesis();
-            sendMessage()
+            list();
         })
 
     })