diff --git a/src/views/AiEmotion.vue b/src/views/AiEmotion.vue
index cba25f2..dd53b74 100644
--- a/src/views/AiEmotion.vue
+++ b/src/views/AiEmotion.vue
@@ -24,6 +24,14 @@
+
+
@@ -187,6 +195,7 @@ const userInputDisplayRef = ref(null);//消息区域的引用
// 响应式数据
const messages = ref([]);
const isPageLoaded = ref(false); // 控制页面是否显示
+const isLoading = ref(false); // 控制加载状态
const isRotating = ref(false);//控制旋转
const version1 = ref(2); // 版本号
const conclusionData = ref(''); // 存储第二个工作流接口返回的结论数据
@@ -273,6 +282,7 @@ const parsedConclusion = computed(() => {
watch(currentStock, (newStock) => {
if (newStock && newStock.apiData) {
isPageLoaded.value = true;
+ isLoading.value = false; // 数据加载完成,关闭加载状态
// 停止当前播放的音频
stopAudio();
// 重置触发状态,允许新股票重新触发效果
@@ -704,6 +714,9 @@ async function handleSendMessage(input) {
if (input.trim()) {
const userMessage = reactive({ sender: 'user', text: input });
messages.value.push(userMessage);
+ // 设置加载状态,隐藏图表页面
+ isLoading.value = true;
+ isPageLoaded.value = false;
// 触发图片旋转
isRotating.value = true;
@@ -2237,4 +2250,46 @@ defineExpose({
padding-top: 10%;
}
}
+/* 加载提示样式 */
+.loading-container {
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ min-height: 60vh;
+ padding: 40px 20px;
+}
+
+.loading-content {
+ text-align: center;
+ background: linear-gradient(135deg, rgba(0, 212, 255, 0.15) 0%, rgba(0, 100, 200, 0.15) 100%);
+ border: 2px solid rgba(0, 212, 255, 0.4);
+ border-radius: 20px;
+ padding: 40px;
+ backdrop-filter: blur(15px);
+ box-shadow: 0 8px 25px rgba(0, 212, 255, 0.3);
+}
+
+.loading-spinner {
+ width: 60px;
+ height: 60px;
+ border: 4px solid rgba(0, 212, 255, 0.3);
+ border-top: 4px solid #00d4ff;
+ border-radius: 50%;
+ animation: spin 1s linear infinite;
+ margin: 0 auto 20px;
+}
+
+@keyframes spin {
+ 0% { transform: rotate(0deg); }
+ 100% { transform: rotate(360deg); }
+}
+
+.loading-text {
+ color: #00d4ff;
+ font-size: 18px;
+ font-weight: bold;
+ text-shadow: 0 2px 8px rgba(0, 212, 255, 0.5);
+ letter-spacing: 1px;
+}
+
\ No newline at end of file