diff --git a/src/views/chat.vue b/src/views/chat.vue index e1aad40..90d6f65 100644 --- a/src/views/chat.vue +++ b/src/views/chat.vue @@ -34,7 +34,7 @@ const sessionId = ref(localStorage.getItem('sessionId') || {}); const add = async () => { try { const result = await axios.post( - "http://9zebk6.natappfree.cc/api/v1/chats/8b37cd9cf0c811efa4210242ac120003/completions", + "http://c6bi3f.natappfree.cc/api/v1/chats/8b37cd9cf0c811efa4210242ac120003/completions", {}, { headers: { @@ -103,47 +103,45 @@ const scrollToBottom = () => { } // 发送消息 const sendMessage = async () => { - if (!isTokenValid.value) { - console.error('Token 验证失败,无法发送消息') - return + console.error('Token 验证失败,无法发送消息'); + return; } - if (isLoading.value) return; - const content = inputMessage.value.trim() - if (!content) return + const content = inputMessage.value.trim(); + if (!content) return; // 添加用户消息 messages.value.push({ content, sender: 'user', timestamp: new Date() - }) + }); // 清空输入框 - inputMessage.value = '' - scrollToBottom() + inputMessage.value = ''; + scrollToBottom(); // 显示加载动画 - isLoading.value = true + isLoading.value = true; messages.value.push({ content: '我正在思考...', sender: 'bot', timestamp: new Date(), isLoading: true - }) - scrollToBottom() + }); + scrollToBottom(); try { // 调用API获取回复 - const response = await fetch("http://9zebk6.natappfree.cc/api/v1/chats/8b37cd9cf0c811efa4210242ac120003/completions", { + const response = await fetch("http://c6bi3f.natappfree.cc/api/v1/chats/8b37cd9cf0c811efa4210242ac120003/completions", { method: 'POST', headers: { 'Content-Type': 'application/json', Authorization: 'Bearer ragflow-hkNjEwYjcwZjBlMDExZWZiYjYzMDI0Mm' }, body: JSON.stringify({ question: content, stream: false, session_id: sessionId.value }) - }) - const data = await response.json() + }); + const data = await response.json(); console.log(data, 'data211111'); // 移除加载消息 - messages.value = messages.value.filter(msg => !msg.isLoading) + messages.value = messages.value.filter(msg => !msg.isLoading); // 提取推理思考部分和结果部分 const regex = /(.*?)<\/think>(.*)/s; const match = data.data.answer.match(regex); @@ -158,36 +156,46 @@ const sendMessage = async () => { // 组合推理思考内容和结果内容,并添加 HTML 标签 let combinedContent = ''; // if (thinking) { - // combinedContent += `推理思考:${thinking}
`; // } - combinedContent += `${result}`; - // 添加包含推理思考和结果的消息 + // 添加初始空消息 + const botMessageIndex = messages.value.length; messages.value.push({ - content: combinedContent, + content: '', sender: 'bot', timestamp: new Date() - }) + }); + + // 使用定时器逐个字符更新消息内容 + let currentIndex = 0; + const intervalId = setInterval(() => { + if (currentIndex < combinedContent.length) { + messages.value[botMessageIndex].content += combinedContent[currentIndex]; + scrollToBottom(); + currentIndex++; + } else { + clearInterval(intervalId); + } + }, 100); // 每100毫秒添加一个字符,可以根据需要调整 - scrollToBottom() } catch (error) { - console.error('API请求失败:', error) + console.error('API请求失败:', error); // 移除加载消息 - messages.value = messages.value.filter(msg => !msg.isLoading) + messages.value = messages.value.filter(msg => !msg.isLoading); messages.value.push({ content: '服务暂时不可用,请稍后再试', sender: 'bot', timestamp: new Date() - }) - scrollToBottom() + }); + scrollToBottom(); } finally { // 隐藏加载动画 - isLoading.value = false + isLoading.value = false; } -} +}; // 格式化时间显示 const formatTime = (date) => { return new Date(date).toLocaleTimeString([], {