|
|
|
@ -18,6 +18,10 @@ import { useChatStore } from "../store/chat"; |
|
|
|
import { useAudioStore } from "../store/audio"; |
|
|
|
import { useDataStore } from "@/store/dataList.js"; |
|
|
|
import { marked } from "marked"; // 引入marked库 |
|
|
|
// 导入思考过程GIF |
|
|
|
import thinkingGif from "@/assets/img/gif/思考.gif"; |
|
|
|
import analyzeGif from "@/assets/img/gif/解析.gif"; |
|
|
|
import generateGif from "@/assets/img/gif/生成.gif"; |
|
|
|
import katex from "katex"; // 引入 KaTeX 库 |
|
|
|
import { htmlToText } from "html-to-text"; |
|
|
|
import { Howl, Howler } from "howler"; |
|
|
|
@ -145,7 +149,7 @@ const playNextAudio = () => { |
|
|
|
setTimeout(() => { |
|
|
|
isCallingPlayNext = false; |
|
|
|
playNextAudio(); |
|
|
|
}, 500); |
|
|
|
}, 200); |
|
|
|
} else { |
|
|
|
console.log("🎉 所有音频播放完成，清除音频实例"); |
|
|
|
chatStore.messages[chatStore.currentUserIndex].audioStatus = false; |
|
|
|
@ -748,7 +752,6 @@ const createTypingEffect = (message, content, speed) => { |
|
|
|
if (message.end) { |
|
|
|
chatStore.getUserCount(); |
|
|
|
chatStore.isLoading = false; |
|
|
|
chatStore.searchRecord = true; |
|
|
|
console.log("打印完毕，接触输入框禁用状态"); |
|
|
|
emit("enableInput"); |
|
|
|
} |
|
|
|
@ -952,8 +955,8 @@ async function showThinkingProcess(stockName = null) { |
|
|
|
class: "ing", |
|
|
|
type: "ing", |
|
|
|
flag: true, |
|
|
|
content: "正在思考......", |
|
|
|
gif: "/src/assets/img/gif/思考.gif", |
|
|
|
content: "夺宝奇兵大模型正在思考", |
|
|
|
gif: thinkingGif, |
|
|
|
}); |
|
|
|
chatStore.messages.push(thinkingMessage1); |
|
|
|
await new Promise((resolve) => setTimeout(resolve, 1500)); |
|
|
|
@ -965,8 +968,8 @@ async function showThinkingProcess(stockName = null) { |
|
|
|
class: "ing", |
|
|
|
type: "ing", |
|
|
|
flag: true, |
|
|
|
content: "正在解析关键数据......", |
|
|
|
gif: "/src/assets/img/gif/解析.gif", |
|
|
|
content: "正在解析关键数据", |
|
|
|
gif: analyzeGif, |
|
|
|
}); |
|
|
|
chatStore.messages.push(thinkingMessage2); |
|
|
|
|
|
|
|
@ -985,8 +988,8 @@ async function showThinkingProcess(stockName = null) { |
|
|
|
class: "ing", |
|
|
|
type: "ing", |
|
|
|
flag: true, |
|
|
|
content: `正在生成${stockName}全景作战报告......`, |
|
|
|
gif: "/src/assets/img/gif/生成.gif", |
|
|
|
content: `正在生成${stockName}全景作战报告`, |
|
|
|
gif: generateGif, |
|
|
|
}); |
|
|
|
chatStore.messages.push(thinkingMessage3); |
|
|
|
await new Promise((resolve) => setTimeout(resolve, 1500)); |
|
|
|
@ -997,9 +1000,7 @@ async function showThinkingProcess(stockName = null) { |
|
|
|
sender: "ai", |
|
|
|
class: "ing", |
|
|
|
type: "ing", |
|
|
|
flag: true, |
|
|
|
content: "报告已生成！", |
|
|
|
gif: "/src/assets/img/gif/生成.gif", |
|
|
|
}); |
|
|
|
chatStore.messages.push(thinkingMessage4); |
|
|
|
await new Promise((resolve) => setTimeout(resolve, 1500)); |
|
|
|
@ -1027,8 +1028,8 @@ async function continueThinkingProcess(thinkingMessageRef, stockName) { |
|
|
|
class: "ing", |
|
|
|
type: "ing", |
|
|
|
flag: true, |
|
|
|
content: `正在生成${stockName}全景作战报告......`, |
|
|
|
gif: "/src/assets/img/gif/生成.gif", |
|
|
|
content: `正在生成${stockName}全景作战报告`, |
|
|
|
gif: generateGif, |
|
|
|
}); |
|
|
|
chatStore.messages.push(thinkingMessage3); |
|
|
|
await new Promise((resolve) => setTimeout(resolve, 1500)); |
|
|
|
@ -1039,7 +1040,6 @@ async function continueThinkingProcess(thinkingMessageRef, stockName) { |
|
|
|
sender: "ai", |
|
|
|
class: "ing", |
|
|
|
type: "ing", |
|
|
|
flag: true, |
|
|
|
content: "报告已生成！", |
|
|
|
}); |
|
|
|
chatStore.messages.push(thinkingMessage4); |
|
|
|
@ -1063,6 +1063,33 @@ watch( |
|
|
|
|
|
|
|
previousMessagesLength.value = newVal.length; |
|
|
|
if (newVal.length > 0) { |
|
|
|
// 清理语音下标 |
|
|
|
console.log("chatStore.currentUserIndex", chatStore.currentUserIndex); |
|
|
|
if (chatStore.currentUserIndex != null) { |
|
|
|
chatStore.messages[chatStore.currentUserIndex].audioStatus = false; |
|
|
|
} |
|
|
|
chatStore.currentUserIndex = null; |
|
|
|
audioStore.stop(); // 暂停语音 |
|
|
|
|
|
|
|
// 🔧 新增：重置音频队列状态，确保新音频能够自动播放 |
|
|
|
audioQueue.value = []; |
|
|
|
isPlayingAudio.value = false; |
|
|
|
currentPlayIndex = 0; |
|
|
|
isCallingPlayNext = false; |
|
|
|
|
|
|
|
// 重置音频预加载状态 |
|
|
|
audioPreloadStatus.one = { loaded: false, url: null }; |
|
|
|
audioPreloadStatus.two = { loaded: false, url: null }; |
|
|
|
audioPreloadStatus.three = { loaded: false, url: null }; |
|
|
|
audioPreloadStatus.four = { loaded: false, url: null }; |
|
|
|
|
|
|
|
// 清除音频实例 |
|
|
|
audioStore.soundInstance = null; |
|
|
|
audioStore.nowSound = null; |
|
|
|
audioStore.isPlaying = false; |
|
|
|
audioStore.isPaused = false; |
|
|
|
audioStore.playbackPosition = 0; |
|
|
|
|
|
|
|
console.log("消息列表已更新，最新消息:", newVal[newVal.length - 1]); |
|
|
|
chatStore.messages.push(newVal[newVal.length - 1]); |
|
|
|
chatStore.currentUserIndex = chatStore.messages.length - 1; |
|
|
|
@ -1101,6 +1128,8 @@ watch( |
|
|
|
console.log(codeData.value, "codeData"); |
|
|
|
// 根据意图识别结果判断 |
|
|
|
if (result.code == 200) { |
|
|
|
// 意图识别成功后，更新历史记录状态 |
|
|
|
chatStore.searchRecord = true; |
|
|
|
// 获取到股票名称后，继续思考过程 |
|
|
|
if (thinkingMessageRef && codeData.value.name) { |
|
|
|
await continueThinkingProcess( |
|
|
|
@ -1108,12 +1137,17 @@ watch( |
|
|
|
codeData.value.name |
|
|
|
); |
|
|
|
} |
|
|
|
|
|
|
|
for (let i = chatStore.messages.length - 1; i >= 0; --i) { |
|
|
|
if (chatStore.messages[i].sender == "user") { |
|
|
|
chatStore.messages[i].audioStatus = true; |
|
|
|
break; |
|
|
|
} |
|
|
|
} |
|
|
|
chatStore.messages.push({ |
|
|
|
class: "ing", |
|
|
|
type: "ing", |
|
|
|
flag: flag, |
|
|
|
content: result.data.kaishi, |
|
|
|
// class: "ing", |
|
|
|
// type: "ing", |
|
|
|
// flag: flag, |
|
|
|
// content: result.data.kaishi, |
|
|
|
}); |
|
|
|
} else { |
|
|
|
// 意图识别失败，先清理思考过程消息 |
|
|
|
@ -1148,7 +1182,7 @@ watch( |
|
|
|
class: "ing", |
|
|
|
type: "ing", |
|
|
|
flag: flag, |
|
|
|
content: aiContent, |
|
|
|
content: AIcontent, |
|
|
|
}); |
|
|
|
|
|
|
|
chatStore.isLoading = false; |
|
|
|
@ -2417,6 +2451,16 @@ watch( |
|
|
|
return; |
|
|
|
} |
|
|
|
try { |
|
|
|
// 清理语音下标 |
|
|
|
chatStore.currentUserIndex = null; |
|
|
|
audioStore.stop(); // 暂停语音 |
|
|
|
|
|
|
|
// 解开输入框 |
|
|
|
emit("enableInput"); |
|
|
|
// 清除打字机队列和状态 |
|
|
|
typingQueue.value = []; |
|
|
|
isTypingInProgress.value = false; |
|
|
|
|
|
|
|
// 清空聊天框内容 |
|
|
|
chatStore.messages = []; |
|
|
|
|
|
|
|
@ -2770,7 +2814,7 @@ function KlineCanvsEcharts(containerId) { |
|
|
|
name: "\u4eea\u8868\u76d8", |
|
|
|
type: "gauge", |
|
|
|
center: ["50%", "50%"], |
|
|
|
radius: "90%", |
|
|
|
radius: window.innerWidth > 768 ? "90%" : "70%", |
|
|
|
startAngle: 140, |
|
|
|
endAngle: -140, |
|
|
|
min: 0, |
|
|
|
@ -3286,10 +3330,10 @@ function KlineCanvsEcharts(containerId) { |
|
|
|
{ |
|
|
|
textStyle: { |
|
|
|
color: "black", |
|
|
|
fontSize: window.innerWidth > 768 ? 15 : vwToPx(1.8), |
|
|
|
fontSize: window.innerWidth > 768 ? 12 : 9, |
|
|
|
}, |
|
|
|
width: "100%", |
|
|
|
top: window.innerWidth > 768 ? "0%" : "-1%", |
|
|
|
top: window.innerWidth > 768 ? "5%" : "4%", |
|
|
|
left: "center", |
|
|
|
itemGap: window.innerWidth > 768 ? 20 : 10, |
|
|
|
itemWidth: 10, |
|
|
|
@ -3324,10 +3368,10 @@ function KlineCanvsEcharts(containerId) { |
|
|
|
{ |
|
|
|
textStyle: { |
|
|
|
color: "black", |
|
|
|
fontSize: window.innerWidth > 768 ? 15 : vwToPx(1.8), |
|
|
|
fontSize: window.innerWidth > 768 ? 12 : 9, |
|
|
|
}, |
|
|
|
orient: "horizontal", |
|
|
|
top: window.innerWidth > 768 ? "3%" : "2%", |
|
|
|
top: window.innerWidth > 768 ? "8%" : "7%", |
|
|
|
width: "100%", |
|
|
|
left: "center", |
|
|
|
itemGap: 15, |
|
|
|
@ -3339,11 +3383,11 @@ function KlineCanvsEcharts(containerId) { |
|
|
|
rich: { |
|
|
|
green: { |
|
|
|
color: "green", |
|
|
|
fontSize: window.innerWidth > 768 ? 20 : 10, |
|
|
|
fontSize: window.innerWidth > 768 ? 12 : 9, |
|
|
|
}, |
|
|
|
red: { |
|
|
|
color: "red", |
|
|
|
fontSize: window.innerWidth > 768 ? 20 : 10, |
|
|
|
fontSize: window.innerWidth > 768 ? 12 : 9, |
|
|
|
}, |
|
|
|
}, |
|
|
|
}, |
|
|
|
@ -3359,10 +3403,10 @@ function KlineCanvsEcharts(containerId) { |
|
|
|
{ |
|
|
|
textStyle: { |
|
|
|
color: "black", |
|
|
|
fontSize: window.innerWidth > 768 ? 15 : vwToPx(1.8), |
|
|
|
fontSize: window.innerWidth > 768 ? 12 : 9, |
|
|
|
}, |
|
|
|
orient: "horizontal", |
|
|
|
top: window.innerWidth > 768 ? "68%" : "64%", |
|
|
|
top: window.innerWidth > 768 ? "62%" : "60%", |
|
|
|
width: "100%", |
|
|
|
left: "center", |
|
|
|
itemGap: 15, |
|
|
|
@ -3374,11 +3418,11 @@ function KlineCanvsEcharts(containerId) { |
|
|
|
rich: { |
|
|
|
green: { |
|
|
|
color: "green", |
|
|
|
fontSize: window.innerWidth > 768 ? 20 : 10, |
|
|
|
fontSize: window.innerWidth > 768 ? 12 : 9, |
|
|
|
}, |
|
|
|
red: { |
|
|
|
color: "red", |
|
|
|
fontSize: window.innerWidth > 768 ? 20 : 10, |
|
|
|
fontSize: window.innerWidth > 768 ? 12 : 9, |
|
|
|
}, |
|
|
|
}, |
|
|
|
}, |
|
|
|
@ -3465,53 +3509,62 @@ function KlineCanvsEcharts(containerId) { |
|
|
|
}, |
|
|
|
grid: [ |
|
|
|
{ |
|
|
|
top: window.innerWidth > 768 ? "12%" : "10%", |
|
|
|
left: |
|
|
|
window.innerWidth > 1024 |
|
|
|
? "70vw" |
|
|
|
? "14%" |
|
|
|
: window.innerWidth > 768 |
|
|
|
? "65vw" |
|
|
|
: "55vw", |
|
|
|
? "18%" |
|
|
|
: window.innerWidth > 375 |
|
|
|
? "20%" |
|
|
|
: "22%", |
|
|
|
right: |
|
|
|
window.innerWidth > 1024 |
|
|
|
? "40vw" |
|
|
|
? "9%" |
|
|
|
: window.innerWidth > 768 |
|
|
|
? "30vw" |
|
|
|
: "40vw", |
|
|
|
top: window.innerWidth > 768 ? "8%" : "5%", |
|
|
|
height: window.innerWidth > 768 ? "34%" : "34%", |
|
|
|
? "12%" |
|
|
|
: "14%", |
|
|
|
|
|
|
|
height: window.innerWidth > 768 ? "27%" : "29%", |
|
|
|
containLabel: false, |
|
|
|
}, |
|
|
|
{ |
|
|
|
top: window.innerWidth > 768 ? "42%" : "42%", |
|
|
|
left: |
|
|
|
window.innerWidth > 1024 |
|
|
|
? "70vw" |
|
|
|
? "14%" |
|
|
|
: window.innerWidth > 768 |
|
|
|
? "65vw" |
|
|
|
: "55vw", |
|
|
|
? "18%" |
|
|
|
: window.innerWidth > 375 |
|
|
|
? "20%" |
|
|
|
: "22%", |
|
|
|
right: |
|
|
|
window.innerWidth > 1024 |
|
|
|
? "40vw" |
|
|
|
? "9%" |
|
|
|
: window.innerWidth > 768 |
|
|
|
? "30vw" |
|
|
|
: "40vw", |
|
|
|
top: window.innerWidth > 768 ? "45%" : "42%", |
|
|
|
height: window.innerWidth > 768 ? "22%" : "22%", |
|
|
|
? "12%" |
|
|
|
: "14%", |
|
|
|
|
|
|
|
height: window.innerWidth > 768 ? "20%" : "18%", |
|
|
|
containLabel: false, |
|
|
|
}, |
|
|
|
{ |
|
|
|
top: window.innerWidth > 768 ? "66%" : "64%", |
|
|
|
left: |
|
|
|
window.innerWidth > 1024 |
|
|
|
? "70vw" |
|
|
|
? "14%" |
|
|
|
: window.innerWidth > 768 |
|
|
|
? "65vw" |
|
|
|
: "55vw", |
|
|
|
? "18%" |
|
|
|
: window.innerWidth > 375 |
|
|
|
? "20%" |
|
|
|
: "22%", |
|
|
|
right: |
|
|
|
window.innerWidth > 1024 |
|
|
|
? "40vw" |
|
|
|
? "9%" |
|
|
|
: window.innerWidth > 768 |
|
|
|
? "30vw" |
|
|
|
: "40vw", |
|
|
|
top: window.innerWidth > 768 ? "73%" : "70%", |
|
|
|
? "12%" |
|
|
|
: "14%", |
|
|
|
|
|
|
|
height: window.innerWidth > 768 ? "20%" : "22%", |
|
|
|
containLabel: false, |
|
|
|
}, |
|
|
|
@ -3556,6 +3609,7 @@ function KlineCanvsEcharts(containerId) { |
|
|
|
axisLabel: { |
|
|
|
show: true, |
|
|
|
interval: "auto", |
|
|
|
fontSize: window.innerWidth > 768 ? 12 : 9, |
|
|
|
}, |
|
|
|
}, |
|
|
|
], |
|
|
|
@ -3652,11 +3706,15 @@ function KlineCanvsEcharts(containerId) { |
|
|
|
show: true, |
|
|
|
xAxisIndex: [0, 1, 2], |
|
|
|
type: "slider", |
|
|
|
top: window.innerWidth > 768 ? "95%" : "96%", |
|
|
|
top: window.innerWidth > 768 ? "90%" : "91%", |
|
|
|
// left: window.innerWidth > 768 ? "10%" : "8%", |
|
|
|
// right: window.innerWidth > 768 ? "4%" : "8%", |
|
|
|
height: 20, |
|
|
|
start: 98, |
|
|
|
end: 100, |
|
|
|
textStyle: { |
|
|
|
fontSize: window.innerWidth > 768 ? 12 : 9, |
|
|
|
}, |
|
|
|
}, |
|
|
|
], |
|
|
|
visualMap: [ |
|
|
|
@ -4092,6 +4150,11 @@ function KlineCanvsEcharts(containerId) { |
|
|
|
type: "solid", |
|
|
|
}, |
|
|
|
data: [{ yAxis: 20 }], |
|
|
|
label: { |
|
|
|
normal: { |
|
|
|
fontSize: window.innerWidth > 768 ? 12 : 9, |
|
|
|
}, |
|
|
|
}, |
|
|
|
}, |
|
|
|
}, |
|
|
|
{ |
|
|
|
@ -4109,6 +4172,11 @@ function KlineCanvsEcharts(containerId) { |
|
|
|
type: "solid", |
|
|
|
}, |
|
|
|
data: [{ yAxis: 50 }], |
|
|
|
label: { |
|
|
|
normal: { |
|
|
|
fontSize: window.innerWidth > 768 ? 12 : 9, |
|
|
|
}, |
|
|
|
}, |
|
|
|
}, |
|
|
|
}, |
|
|
|
{ |
|
|
|
@ -4126,6 +4194,11 @@ function KlineCanvsEcharts(containerId) { |
|
|
|
type: "solid", |
|
|
|
}, |
|
|
|
data: [{ yAxis: 80 }], |
|
|
|
label: { |
|
|
|
normal: { |
|
|
|
fontSize: window.innerWidth > 768 ? 12 : 9, |
|
|
|
}, |
|
|
|
}, |
|
|
|
}, |
|
|
|
}, |
|
|
|
{ |
|
|
|
@ -4144,6 +4217,11 @@ function KlineCanvsEcharts(containerId) { |
|
|
|
type: "solid", |
|
|
|
}, |
|
|
|
data: [{ yAxis: 100 }], |
|
|
|
label: { |
|
|
|
normal: { |
|
|
|
fontSize: window.innerWidth > 768 ? 12 : 9, |
|
|
|
}, |
|
|
|
}, |
|
|
|
}, |
|
|
|
}, |
|
|
|
], |
|
|
|
@ -4280,6 +4358,8 @@ onMounted(() => { |
|
|
|
}); |
|
|
|
renderAllKlineCharts(); |
|
|
|
console.log("组件挂载完成"); |
|
|
|
// 重置音频下标 |
|
|
|
chatStore.currentUserIndex = null; |
|
|
|
|
|
|
|
chatStore.messages.forEach((item) => { |
|
|
|
if (item.sender == "user") { |
|
|
|
@ -4376,6 +4456,8 @@ onUnmounted(() => { |
|
|
|
<div v-for="(msg, index) in chatMsg" :key="index"> |
|
|
|
<!-- 用户消息容器，包含喇叭按钮 --> |
|
|
|
<div v-if="msg.sender === 'user'" class="user-message-container"> |
|
|
|
<div class="user-msg"> |
|
|
|
<div class="user-content"> |
|
|
|
<img |
|
|
|
:src="msg.audioStatus ? voice : voiceNoActive" |
|
|
|
class="user-message-speaker" |
|
|
|
@ -4395,6 +4477,11 @@ onUnmounted(() => { |
|
|
|
<div v-html="msg.content"></div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div v-if="msg.timestamp" class="user-sendTime"> |
|
|
|
{{ moment(msg.timestamp).format("YYYY-MM-DD HH:mm:ss") }} |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
|
|
|
|
<!-- AI消息和其他类型消息 --> |
|
|
|
<div |
|
|
|
@ -4465,7 +4552,7 @@ onUnmounted(() => { |
|
|
|
</div> |
|
|
|
<div v-else-if="msg.type == 'content2'" class="content2"> |
|
|
|
<div class="kline-container content2chart"> |
|
|
|
<div :id="'kline-container-' + index" class="chart-mount-point"> |
|
|
|
<div :id="'kline-container-' + index" class="chart-mount-pointJN"> |
|
|
|
<div v-if="!msg.hasValidData" class="no-data-message"> |
|
|
|
<p>暂无数据</p> |
|
|
|
</div> |
|
|
|
@ -4677,18 +4764,37 @@ p { |
|
|
|
/* 用户消息容器样式 */ |
|
|
|
.user-message-container { |
|
|
|
display: flex; |
|
|
|
align-items: flex-start; |
|
|
|
/* align-items: flex-start; */ |
|
|
|
margin: 10px 0px; |
|
|
|
justify-content: flex-end; |
|
|
|
gap: 10px; |
|
|
|
/* align-items: center; */ |
|
|
|
flex-direction: column; |
|
|
|
} |
|
|
|
|
|
|
|
.user-msg { |
|
|
|
margin-left: auto; |
|
|
|
} |
|
|
|
|
|
|
|
.user-content { |
|
|
|
display: flex; |
|
|
|
height: 100%; |
|
|
|
align-items: center; |
|
|
|
margin-right: 5px; |
|
|
|
} |
|
|
|
|
|
|
|
.user-sendTime { |
|
|
|
width: 100%; |
|
|
|
text-align: center; |
|
|
|
color: rgba(255, 255, 255, 0.6); |
|
|
|
font-size: 0.8rem; |
|
|
|
} |
|
|
|
|
|
|
|
.user-message-speaker { |
|
|
|
width: 32px; |
|
|
|
height: 32px; |
|
|
|
object-fit: contain; |
|
|
|
margin-top: 5px; |
|
|
|
margin-right: 5px; |
|
|
|
cursor: pointer; |
|
|
|
transition: all 0.3s ease; |
|
|
|
} |
|
|
|
@ -4951,10 +5057,18 @@ p { |
|
|
|
width: 90%; |
|
|
|
} |
|
|
|
|
|
|
|
.kline-container .chart-mount-pointJN { |
|
|
|
display: flex; |
|
|
|
justify-content: center; |
|
|
|
align-items: center; |
|
|
|
height: 100%; |
|
|
|
width: 100%; |
|
|
|
} |
|
|
|
|
|
|
|
/* AI消息容器样式 */ |
|
|
|
.ai-message-container { |
|
|
|
display: flex; |
|
|
|
align-items: flex-start; |
|
|
|
align-items: center; |
|
|
|
gap: 10px; |
|
|
|
margin-right: auto; |
|
|
|
max-width: 80%; |
|
|
|
@ -4984,7 +5098,7 @@ p { |
|
|
|
.ai-message-content { |
|
|
|
display: flex; |
|
|
|
align-items: center; |
|
|
|
white-space: nowrap; |
|
|
|
/* white-space: nowrap; */ |
|
|
|
width: fit-content; |
|
|
|
overflow: visible; |
|
|
|
} |
|
|
|
|
宋杰
no99