feat: 去掉了打字机效果
This commit is contained in:
@@ -3,6 +3,7 @@
|
||||
flex-direction: column;
|
||||
max-width: 100%; // ✅ 限制最大宽度
|
||||
overflow-x: hidden; // ✅ 防止横向撑开
|
||||
padding-bottom: 12px;
|
||||
|
||||
.chat-ai {
|
||||
margin: 6px 0;
|
||||
|
||||
@@ -153,7 +153,6 @@ import {
|
||||
recentConversation,
|
||||
} from "@/request/api/ConversationApi";
|
||||
import WebSocketManager from "@/utils/WebSocketManager";
|
||||
import TypewriterManager from "@/utils/TypewriterManager";
|
||||
import { IdUtils } from "@/utils";
|
||||
import { checkToken } from "@/hooks/useGoLogin";
|
||||
import { useAppStore } from "@/store";
|
||||
@@ -199,8 +198,7 @@ let commonType = "";
|
||||
let webSocketManager = null;
|
||||
/// WebSocket 连接状态
|
||||
let webSocketConnectStatus = false;
|
||||
// 打字机管理器
|
||||
let typewriterManager = null;
|
||||
|
||||
// 当前会话的消息ID,用于保持发送和终止的messageId一致
|
||||
let currentSessionMessageId = null;
|
||||
|
||||
@@ -352,7 +350,6 @@ const initHandler = () => {
|
||||
if (!appStore.hasToken) return;
|
||||
loadRecentConversation();
|
||||
///loadConversationMsgList();
|
||||
initTypewriterManager();
|
||||
initWebSocket();
|
||||
};
|
||||
|
||||
@@ -434,10 +431,6 @@ const initWebSocket = () => {
|
||||
webSocketConnectStatus = false;
|
||||
// 停止当前会话
|
||||
isSessionActive.value = false;
|
||||
// 停止打字机效果
|
||||
if (typewriterManager) {
|
||||
typewriterManager.stopTypewriter();
|
||||
}
|
||||
},
|
||||
|
||||
// 错误回调
|
||||
@@ -482,32 +475,20 @@ const handleWebSocketMessage = (data) => {
|
||||
data.content = String(data.content);
|
||||
}
|
||||
|
||||
// 处理content分片内容
|
||||
// 直接拼接内容到AI消息
|
||||
if (data.content) {
|
||||
// 使用打字机管理器添加内容
|
||||
if (typewriterManager) {
|
||||
typewriterManager.addContent(data.content);
|
||||
if (chatMsgList.value[aiMsgIndex].isLoading) {
|
||||
chatMsgList.value[aiMsgIndex].msg = "";
|
||||
}
|
||||
|
||||
// 确保新内容到达时页面保持在底部
|
||||
setTimeoutScrollToBottom();
|
||||
chatMsgList.value[aiMsgIndex].msg += data.content;
|
||||
chatMsgList.value[aiMsgIndex].isLoading = false;
|
||||
nextTick(() => scrollToBottom());
|
||||
}
|
||||
|
||||
// 处理完成状态
|
||||
if (data.finish) {
|
||||
// 等待打字机完成后处理其他数据
|
||||
const waitForTypingComplete = () => {
|
||||
const status = typewriterManager
|
||||
? typewriterManager.getStatus()
|
||||
: { isTyping: false };
|
||||
if (status.isTyping) {
|
||||
setTimeout(waitForTypingComplete, 50);
|
||||
return;
|
||||
}
|
||||
|
||||
const msg = chatMsgList.value[aiMsgIndex].msg;
|
||||
console.log("全量消息内容:", msg);
|
||||
if (!msg || msg === "加载中" || msg.startsWith("加载中")) {
|
||||
if (!msg || chatMsgList.value[aiMsgIndex].isLoading) {
|
||||
chatMsgList.value[aiMsgIndex].msg = "未获取到内容,请重试";
|
||||
chatMsgList.value[aiMsgIndex].isLoading = false;
|
||||
if (data.toolCall) {
|
||||
@@ -527,56 +508,11 @@ const handleWebSocketMessage = (data) => {
|
||||
|
||||
// 重置会话状态
|
||||
isSessionActive.value = false;
|
||||
};
|
||||
|
||||
waitForTypingComplete();
|
||||
}
|
||||
};
|
||||
|
||||
// 初始化打字机管理器
|
||||
const initTypewriterManager = () => {
|
||||
if (typewriterManager) {
|
||||
typewriterManager.destroy();
|
||||
}
|
||||
|
||||
typewriterManager = new TypewriterManager({
|
||||
typingSpeed: 10,
|
||||
cursorText: "",
|
||||
});
|
||||
|
||||
// 设置回调函数
|
||||
typewriterManager.setCallbacks({
|
||||
// 每个字符打字时的回调
|
||||
onCharacterTyped: (displayedContent) => {
|
||||
scrollToBottom();
|
||||
},
|
||||
// 内容更新时的回调
|
||||
onContentUpdate: (content) => {
|
||||
const aiMsgIndex = chatMsgList.value.length - 1;
|
||||
if (aiMsgIndex >= 0 && chatMsgList.value[aiMsgIndex]) {
|
||||
chatMsgList.value[aiMsgIndex].isLoading = false;
|
||||
chatMsgList.value[aiMsgIndex].msg = content;
|
||||
}
|
||||
},
|
||||
// 打字完成时的回调
|
||||
onTypingComplete: (finalContent) => {
|
||||
const aiMsgIndex = chatMsgList.value.length - 1;
|
||||
if (aiMsgIndex >= 0 && chatMsgList.value[aiMsgIndex]) {
|
||||
chatMsgList.value[aiMsgIndex].isLoading = false;
|
||||
chatMsgList.value[aiMsgIndex].msg = finalContent;
|
||||
}
|
||||
// 打字完成后最后一次滚动到底部
|
||||
setTimeoutScrollToBottom();
|
||||
},
|
||||
});
|
||||
};
|
||||
|
||||
// 重置消息状态
|
||||
const resetMessageState = () => {
|
||||
if (typewriterManager) {
|
||||
typewriterManager.reset();
|
||||
}
|
||||
};
|
||||
const resetMessageState = () => {};
|
||||
|
||||
// 初始化数据 首次数据加载的时候
|
||||
const initData = () => {
|
||||
@@ -692,40 +628,26 @@ const stopRequest = () => {
|
||||
// 发送中断消息给服务器 (messageType=2)
|
||||
sendWebSocketMessage(2, "stop_request", { silent: true });
|
||||
|
||||
// 停止打字机效果并保留当前内容
|
||||
if (typewriterManager) {
|
||||
// 获取当前已显示的内容
|
||||
const currentStatus = typewriterManager.getStatus();
|
||||
const currentDisplayedContent = currentStatus.displayedContent;
|
||||
|
||||
// 使用新的方法停止并保留当前内容
|
||||
typewriterManager.stopAndKeepCurrent();
|
||||
|
||||
// 更新最后一条AI消息的状态
|
||||
// 直接将AI消息状态设为停止
|
||||
const aiMsgIndex = chatMsgList.value.length - 1;
|
||||
if (
|
||||
chatMsgList.value[aiMsgIndex] &&
|
||||
chatMsgList.value[aiMsgIndex].msgType === MessageRole.AI
|
||||
) {
|
||||
chatMsgList.value[aiMsgIndex].isLoading = false;
|
||||
// 如果有已显示的内容,使用已显示的内容,否则显示停止消息
|
||||
if (
|
||||
currentDisplayedContent &&
|
||||
currentDisplayedContent.trim() &&
|
||||
!currentDisplayedContent.startsWith("加载中")
|
||||
chatMsgList.value[aiMsgIndex].msg &&
|
||||
chatMsgList.value[aiMsgIndex].msg.trim() &&
|
||||
!chatMsgList.value[aiMsgIndex].msg.startsWith("加载中")
|
||||
) {
|
||||
chatMsgList.value[aiMsgIndex].msg = currentDisplayedContent;
|
||||
// 保留已显示内容
|
||||
} else {
|
||||
chatMsgList.value[aiMsgIndex].msg = "请求已停止";
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 重置会话状态(但不重置消息状态,保留已显示内容)
|
||||
// 重置会话状态
|
||||
isSessionActive.value = false;
|
||||
|
||||
console.log("请求已停止,状态已重置");
|
||||
|
||||
setTimeoutScrollToBottom();
|
||||
};
|
||||
|
||||
@@ -748,12 +670,6 @@ const resetConfig = () => {
|
||||
webSocketConnectStatus = false;
|
||||
}
|
||||
|
||||
// 清理打字机管理器
|
||||
if (typewriterManager) {
|
||||
typewriterManager.destroy();
|
||||
typewriterManager = null;
|
||||
}
|
||||
|
||||
// 重置消息状态
|
||||
resetMessageState();
|
||||
|
||||
|
||||
Reference in New Issue
Block a user