chore:用户提问和客服回答可以看见了

This commit is contained in:
2026-04-13 09:30:08 +08:00
parent b1953a020d
commit ec1903519d

View File

@@ -1,12 +1,23 @@
<template> <template>
<view class="ai-chat-container"> <view class="ai-chat-container">
<!-- 聊天消息列表 --> <!-- 聊天消息列表 -->
<!-- #ifdef H5 -->
<scroll-view
class="chat-messages"
scroll-y
:scroll-into-view="scrollIntoViewId"
:scroll-with-animation="true"
@scroll="onScroll">
<!-- #endif -->
<!-- #ifdef MP-WEIXIN -->
<scroll-view <scroll-view
class="chat-messages" class="chat-messages"
scroll-y scroll-y
:scroll-top="scrollTop" :scroll-top="scrollTop"
@scroll="onScroll" :scroll-with-animation="true"
:scroll-with-animation="false"> @scroll="onScroll">
<!-- #endif -->
<!-- 加载更多历史消息 --> <!-- 加载更多历史消息 -->
<view class="load-more" v-if="hasMoreHistory"> <view class="load-more" v-if="hasMoreHistory">
@@ -17,6 +28,7 @@
<view <view
v-for="(message, index) in messages.filter(msg => msg.content && msg.content.trim() !== '')" v-for="(message, index) in messages.filter(msg => msg.content && msg.content.trim() !== '')"
:key="`msg-${message.id || message.timestamp}-${index}`" :key="`msg-${message.id || message.timestamp}-${index}`"
:id="`msg-${message.id || message.timestamp}-${index}`"
class="message-item" class="message-item"
:class="[message.role, { 'first-message': index === 0 }]"> :class="[message.role, { 'first-message': index === 0 }]">
@@ -166,7 +178,13 @@
</view> </view>
</view> </view>
</view> </view>
<!-- #ifdef H5 -->
</scroll-view> </scroll-view>
<!-- #endif -->
<!-- #ifdef MP-WEIXIN -->
</scroll-view>
<!-- #endif -->
<!-- 输入区域 --> <!-- 输入区域 -->
<view class="input-area"> <view class="input-area">
@@ -380,6 +398,7 @@ export default {
messages: [], messages: [],
inputText: '', inputText: '',
scrollTop: 0, scrollTop: 0,
scrollIntoViewId: null,
hasMoreHistory: false, hasMoreHistory: false,
loadingText: '加载更多历史消息', loadingText: '加载更多历史消息',
voiceInputing: false, voiceInputing: false,
@@ -466,11 +485,9 @@ export default {
messages: { messages: {
handler() { handler() {
this.$nextTick(() => { this.$nextTick(() => {
// 仅当不是加载历史、且需要滚底时,才执行滚底 // 仅当不是加载历史时,执行滚底
if (!this.isLoadingHistory && this.shouldScrollToBottom) { if (!this.isLoadingHistory) {
this.scrollToBottom() this.scrollToBottom()
// 滚底后重置状态,避免重复触发
this.shouldScrollToBottom = false
} }
}) })
}, },
@@ -878,10 +895,11 @@ async loadChatHistoryIfExist() {
await aiService.sendHttpStream( await aiService.sendHttpStream(
userMessage, userMessage,
(chunk) => { (chunk) => {
// 实时更新内容 // 实时更新内容
streamMessage.content += chunk; streamMessage.content += chunk;
this.$forceUpdate(); // 强制更新视图 this.$forceUpdate(); // 强制更新视图
}, this.scrollToBottom(); // 滚动到底部
},
(completeResult) => { (completeResult) => {
// 流结束回调 // 流结束回调
let convId = ''; let convId = '';
@@ -923,10 +941,11 @@ async loadChatHistoryIfExist() {
await aiService.sendStreamMessage( await aiService.sendStreamMessage(
userMessage, userMessage,
(chunk) => { (chunk) => {
// 实时更新内容 // 实时更新内容
streamMessage.content += chunk; streamMessage.content += chunk;
this.$forceUpdate(); this.$forceUpdate();
}, this.scrollToBottom(); // 滚动到底部
},
(completeResult) => { (completeResult) => {
// 流结束回调 // 流结束回调
let convId = completeResult?.conversation_id || ''; let convId = completeResult?.conversation_id || '';
@@ -1045,9 +1064,34 @@ async loadChatHistoryIfExist() {
// 滚动到底部 // 滚动到底部
scrollToBottom() { scrollToBottom() {
setTimeout(() => { if (this.scrollTimer) {
this.scrollTop = 999999 clearTimeout(this.scrollTimer);
}, 100) }
this.scrollTimer = setTimeout(() => {
// #ifdef H5
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 = `msg-${lastMessage.id || lastMessage.timestamp}-${lastIndex}`;
this.$nextTick(() => {
setTimeout(() => {
this.scrollIntoViewId = null;
}, 100);
});
}
}
// #endif
// #ifdef MP-WEIXIN
// 先重置为0,再设置大值,确保视图更新
this.scrollTop = 0;
this.$nextTick(() => {
this.scrollTop = 9999999;
});
// #endif
}, 50);
}, },
// 加载更多历史消息 // 加载更多历史消息