From 95a95c2137827a8f7d47f224486af0d1f42c2c68 Mon Sep 17 00:00:00 2001 From: no99 <17663930442@163.com> Date: Tue, 1 Jul 2025 09:59:33 +0800 Subject: [PATCH] =?UTF-8?q?=E9=BB=84=E5=AD=97=E7=9B=B4=E6=8E=A5=E6=89=93?= =?UTF-8?q?=E5=8D=B0=EF=BC=8C=E5=BA=A6=E7=89=9B=E5=B0=BA=E5=9B=BE=E8=A1=A8?= =?UTF-8?q?=E4=BC=98=E5=8C=96?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/views/AIchat.vue | 120 ++++++++++++++++++++++++++++++--------------------- 1 file changed, 72 insertions(+), 48 deletions(-) diff --git a/src/views/AIchat.vue b/src/views/AIchat.vue index 59f5f99..73e76d3 100644 --- a/src/views/AIchat.vue +++ b/src/views/AIchat.vue @@ -330,40 +330,45 @@ const isTypingInProgress = ref(false); const createTypingEffect = (message, content, speed) => { return new Promise((resolve) => { chatStore.messages.push(message); - if (content != "") { - let index = 0; + if (Array.isArray(content) && content.length > 0) { message.content = ""; message.isTyping = true; - const typingInterval = setInterval(() => { - if (index < content.length) { - message.content += content.charAt(index); - index++; - } else { - clearInterval(typingInterval); - message.isTyping = false; + let currentIndex = 0; - // 处理KaTeX渲染（如果需要） + const processNextElement = () => { + if (currentIndex >= content.length) { + message.isTyping = false; nextTick(() => { - if (message.content.includes("$$")) { - message.content = message.content.replace( - katexRegex, - (match, formula) => { - try { - return katex.renderToString(formula, { - throwOnError: false, - }); - } catch (error) { - console.error("KaTeX 渲染错误:", error); - return match; - } - } - ); - } resolve(); // 完成后resolve }); + return; } - }, speed); + + if (currentIndex % 2 === 0) { + // 偶数下标：直接加入 + message.content += content[currentIndex]; + currentIndex++; + processNextElement(); // 立即处理下一个元素 + } else { + // 奇数下标：打字机效果 + const text = content[currentIndex]; + let charIndex = 0; + + const typingInterval = setInterval(() => { + if (charIndex < text.length) { + message.content += text.charAt(charIndex); + charIndex++; + } else { + clearInterval(typingInterval); + currentIndex++; + processNextElement(); // 处理下一个元素 + } + }, speed); + } + }; + + processNextElement(); // 开始处理 } else { if (message.kline) { if (message.klineType == 1) { @@ -682,7 +687,7 @@ watch( // } // }, 50); // 调整速度为50ms/字符 - addTypingTask(aiMessage1, ac1, 50); + addTypingTask(aiMessage1, ["", ac1], 50); // chatStore.messages.push({ // sender: "ai", @@ -910,7 +915,7 @@ watch( // aiMessage2.isTyping = false; // } // }, 50); // 调整速度为50ms/字符 - addTypingTask(aiMessage2, ac2, 50); + addTypingTask(aiMessage2, ["", ac2], 50); // chatStore.messages.push({ // sender: "ai", @@ -961,6 +966,8 @@ watch( // } // } // ); + const ac31 = `

【主力行为】

`; + const ac32 = `${result23.data.zhuli1}

${result23.data.zhuli2}

${result23.data.zhuli3}

`; const ac3 = `

【主力行为】

${result23.data.zhuli1}

${result23.data.zhuli2}

${result23.data.zhuli3}

`; // 先推送初始消息 @@ -984,7 +991,7 @@ watch( // } // }, 50); // 调整速度为50ms/字符 - addTypingTask(aiMessage3, ac3, 50); + addTypingTask(aiMessage3, [ac31, ac32], 50); // chatStore.messages.push({ // sender: "ai", @@ -1016,6 +1023,15 @@ watch( const nengliang = `

【能量维度】

${result23.data.nengliang}

`; const ac4 = kongjian + shijian + nengliang; + const ac41 = `

【空间维度】

`; + const ac42 = `${arr[0]},${arr[1]}`; + const ac43 = `

`; + const ac44 = `${arr[2]},${arr[3]}

`; + const ac45 = `

【时间维度】

`; + const ac46 = `${result23.data.shijian}

`; + const ac47 = `

【能量维度】

`; + const ac48 = `${result23.data.nengliang}

`; + // const pc4 = marked( // kongjian + // "\n" + @@ -1053,7 +1069,11 @@ watch( // } // }, 50); // 调整速度为50ms/字符 - addTypingTask(aiMessage4, ac4, 50); + addTypingTask( + aiMessage4, + [ac41, ac42, ac43, ac44, ac45, ac46, ac47, ac48], + 50 + ); // chatStore.messages.push({ // sender: "ai", @@ -1095,7 +1115,10 @@ watch( const cftj = `

【触发条件】

${result24.data.cftl}

`; const gfzl = `

【攻防指令】

${result24.data.gfzl}

`; const ac5 = cftj + gfzl; - + const ac51 = `

【触发条件】

`; + const ac52 = `${result24.data.cftl}

`; + const ac53 = `

【攻防指令】

`; + const ac54 = `${result24.data.gfzl}

`; // const pc5 = marked(result24.data.cftl + "/n" + result24.data.gfzl); // const ac5 = pc5.replace(katexRegex, (match, formula) => { // try { @@ -1127,7 +1150,7 @@ watch( // } // }, 50); // 调整速度为50ms/字符 - addTypingTask(aiMessage5, ac5, 50); + addTypingTask(aiMessage5, [ac51,ac52,ac53,ac54], 50); // chatStore.messages.push({ // sender: "ai", @@ -1158,7 +1181,7 @@ watch( // } // }, 50); // 调整速度为50ms/字符 - addTypingTask(aiMessage6, ac6, 100); + addTypingTask(aiMessage6, ["", ac6], 100); // chatStore.messages.push({ // sender: "ai", @@ -2135,7 +2158,7 @@ function KlineCanvsEcharts(containerId) { fontSize: window.innerWidth > 768 ? 15 : vwToPx(1.8), }, orient: "horizontal", - top: window.innerWidth > 768 ? "72%" : "64%", + top: window.innerWidth > 768 ? "68%" : "64%", width: "100%", left: "center", itemGap: 15, @@ -2238,23 +2261,23 @@ function KlineCanvsEcharts(containerId) { }, grid: [ { - // left: window.innerWidth > 768 ? '8%' : '15%', - // right: window.innerWidth > 768 ? '4%' : '2.5%', - top: window.innerWidth > 768 ? "10%" : "5%", - height: window.innerWidth > 768 ? "36%" : "34%", + left: window.innerWidth > 1024 ? '70vw' : window.innerWidth>768? '65vw' : '55vw', + right: window.innerWidth > 1024 ? '40vw' : window.innerWidth>768? '30vw' : '40vw', + top: window.innerWidth > 768 ? "8%" : "5%", + height: window.innerWidth > 768 ? "34%" : "34%", containLabel: false, }, { - // left: window.innerWidth > 768 ? '8%' : '15%', - // right: window.innerWidth > 768 ? '4%' : '2.5%', - top: window.innerWidth > 768 ? "50%" : "42%", - height: window.innerWidth > 768 ? "20%" : "22%", + left: window.innerWidth > 1024 ? '70vw' : window.innerWidth>768? '65vw' : '55vw', + right: window.innerWidth > 1024 ? '40vw' : window.innerWidth>768? '30vw' : '40vw', + top: window.innerWidth > 768 ? "45%" : "42%", + height: window.innerWidth > 768 ? "22%" : "22%", containLabel: false, }, { - // left: window.innerWidth > 768 ? '8%' : '15%', - // right: window.innerWidth > 768 ? '4%' : '2.5%', - top: window.innerWidth > 768 ? "78%" : "70%", + left: window.innerWidth > 1024 ? '70vw' : window.innerWidth>768? '65vw' : '55vw', + right: window.innerWidth > 1024 ? '40vw' : window.innerWidth>768? '30vw' : '40vw', + top: window.innerWidth > 768 ? "73%" : "70%", height: window.innerWidth > 768 ? "20%" : "22%", containLabel: false, }, @@ -2396,7 +2419,8 @@ function KlineCanvsEcharts(containerId) { xAxisIndex: [0, 1, 2], type: "slider", top: window.innerWidth > 768 ? "95%" : "96%", - left: window.innerWidth > 768 ? "10%" : "8%", + // left: window.innerWidth > 768 ? "10%" : "8%", + // right: window.innerWidth > 768 ? "4%" : "8%", start: 98, end: 100, }, @@ -2988,7 +3012,7 @@ watch( renderAllKlineCharts(); } - }, 300); + }, 1000); }, { immediate: true } // 添加immediate属性，确保初始化时执行一次 ); @@ -3203,7 +3227,6 @@ onUnmounted(() => { /* top: -30px; */ } .logo1 { - /* position: relative; */ max-width: 350px; min-width: 200px; width: 25%; @@ -3508,6 +3531,7 @@ onUnmounted(() => { display: flex; justify-content: center; align-items: center; + height: calc(500px + 10vw) !important; } .message-bubble.ai.content3 {