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