From f1b8c0fa74f18ea89610dd6d7d4a79689f592f94 Mon Sep 17 00:00:00 2001
From: aaron <>
Date: Mon, 19 May 2025 00:33:57 +0800
Subject: [PATCH] update

---
 docker-compose.yml                  |   2 +-
 src/views/HomeView.vue              |   2 +-
 src/views/UniversalAnalysisView.vue | 202 +++++++++++++++++++++++-----
 3 files changed, 170 insertions(+), 36 deletions(-)

diff --git a/docker-compose.yml b/docker-compose.yml
index f9044a7..2e72919 100644
--- a/docker-compose.yml
+++ b/docker-compose.yml
@@ -5,7 +5,7 @@ services:
     build:
       context: .
       dockerfile: Dockerfile
-    image: tradus-web:1.3.0
+    image: tradus-web:1.3.1
     container_name: tradus-web
     ports:
       - '6000:80'
diff --git a/src/views/HomeView.vue b/src/views/HomeView.vue
index 0467418..c26b5ed 100644
--- a/src/views/HomeView.vue
+++ b/src/views/HomeView.vue
@@ -20,7 +20,7 @@ const openAuthModal = (mode: 'login' | 'register') => {
           <span class="accent">tradus</span>
           <span class="free-tag">测试版</span>
         </h1>
-        <p class="hero-subtitle">基于AI大语言模型的智能投研助理</p>
+        <p class="hero-subtitle">基于AI大语言模型的投研智能体</p>
         <div class="hero-actions" v-if="!isAuthenticated">
           <button class="btn btn-primary" @click="openAuthModal('login')">登录</button>
           <button class="btn btn-secondary" @click="openAuthModal('register')">注册</button>
diff --git a/src/views/UniversalAnalysisView.vue b/src/views/UniversalAnalysisView.vue
index 3939346..e2ef199 100644
--- a/src/views/UniversalAnalysisView.vue
+++ b/src/views/UniversalAnalysisView.vue
@@ -120,6 +120,7 @@ const handleAnalysis = async () => {
     return
   }
 
+  // 先切换到分析视图，再设置分析状态
   showInitialView.value = false
   isAnalyzing.value = true
   analysisContent.value = ''
@@ -290,7 +291,7 @@ watch(
         </div>
 
         <div class="search-section">
-          <div class="search-container" :class="{ 'is-analyzing': isAnalyzing }">
+          <div class="search-container">
             <div class="input-wrapper">
               <div class="input-container">
                 <div class="input-area">
@@ -327,7 +328,7 @@ watch(
                   @click="handleAnalysis"
                   :disabled="isAnalyzing || !symbolCode.trim()"
                 >
-                  {{ isAnalyzing ? '分析中...' : '开始分析' }}
+                  {{ isAnalyzing ? '正在跳转...' : '开始分析' }}
                 </button>
               </div>
             </div>
@@ -393,13 +394,16 @@ watch(
         </div>
 
         <div v-if="isAnalyzing" class="analysis-status">
-          <div class="progress-dots">
-            <span></span>
-            <span></span>
-            <span></span>
+          <div class="ai-progress">
+            <div class="ai-brain">
+              <span class="pulse-ring"></span>
+              <span class="inner-circle"></span>
+              <span class="brain-wave left"></span>
+              <span class="brain-wave center"></span>
+              <span class="brain-wave right"></span>
+            </div>
           </div>
           <div class="status-text">
-            <!-- <div class="status-label">Agent 正在分析</div> -->
             <div class="thought-text" v-if="currentThought">{{ currentThought }}</div>
           </div>
         </div>
@@ -422,6 +426,10 @@ watch(
 </template>
 
 <style scoped>
+:root {
+  --color-accent-rgb: 51, 85, 255; /* 假设accent颜色为#3355ff */
+}
+
 .universal-analysis-view {
   min-height: 100vh;
   height: 100vh;
@@ -595,52 +603,112 @@ watch(
   flex-direction: row;
   align-items: center;
   justify-content: center;
-  padding: 1rem;
+  padding: 1.5rem;
   text-align: center;
-  gap: 1rem;
+  gap: 1.5rem;
   margin-top: 1rem;
+  background: transparent;
+  border-radius: var(--border-radius);
 }
 
-.progress-dots {
+.ai-progress {
+  position: relative;
   display: flex;
   align-items: center;
   justify-content: center;
-  gap: 6px;
-}
-
-.progress-dots span {
-  width: 8px;
-  height: 8px;
-  background-color: var(--color-accent);
+  padding: 5px;
   border-radius: 50%;
-  opacity: 0.3;
-  animation: pulse-dot 1s infinite;
+  background: transparent;
 }
 
-.progress-dots span:nth-child(2) {
+.ai-brain {
+  position: relative;
+  width: 36px;
+  height: 36px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  transform: translateZ(0); /* 启用硬件加速 */
+  z-index: 1;
+}
+
+.pulse-ring {
+  position: absolute;
+  width: 100%;
+  height: 100%;
+  border-radius: 50%;
+  border: 1.5px solid rgba(51, 85, 255, 0.6);
+  opacity: 0;
+  animation: pulse-ring 2s cubic-bezier(0.455, 0.03, 0.515, 0.955) infinite;
+  z-index: 0;
+}
+
+.inner-circle {
+  position: absolute;
+  width: 60%;
+  height: 60%;
+  background-color: rgba(51, 85, 255, 0.7);
+  border-radius: 50%;
+  opacity: 0.7;
+  animation: pulse-core 1.5s cubic-bezier(0.455, 0.03, 0.515, 0.955) infinite alternate;
+  z-index: 2;
+}
+
+.brain-wave {
+  position: absolute;
+  width: 3px;
+  height: 8px;
+  background-color: rgba(51, 85, 255, 0.7);
+  border-radius: 1.5px;
+  animation: wave-animation 0.8s infinite ease-in-out;
+  z-index: 3;
+}
+
+.brain-wave.left {
+  animation-delay: 0;
+  left: -12px;
+}
+
+.brain-wave.center {
   animation-delay: 0.2s;
+  left: 0px;
+  margin-left: -2px;
 }
 
-.progress-dots span:nth-child(3) {
+.brain-wave.right {
   animation-delay: 0.4s;
+  left: 12px;
 }
 
 .status-text {
   display: flex;
   flex-direction: row;
   align-items: center;
-  gap: 0.5rem;
-}
-
-.status-label {
-  font-weight: 500;
-  color: var(--color-accent);
-  font-size: 0.85rem;
+  flex: 1;
 }
 
 .thought-text {
-  font-size: 0.9rem;
+  font-size: 0.95rem;
+  font-weight: 400;
   color: var(--color-text-secondary);
+  position: relative;
+  overflow: hidden;
+  padding-right: 0.5rem;
+  white-space: nowrap;
+  animation: thought-appear 0.4s ease forwards;
+  max-width: 100%;
+  transition: opacity 0.3s;
+}
+
+@keyframes thought-appear {
+  0% {
+    opacity: 0;
+    transform: translateY(3px);
+  }
+  100% {
+    opacity: 1;
+    transform: translateY(0);
+  }
 }
 
 .analysis-container {
@@ -813,15 +881,41 @@ watch(
   }
 }
 
-@keyframes pulse-dot {
-  0%,
-  100% {
-    transform: scale(1);
+@keyframes pulse-ring {
+  0% {
+    transform: scale(0.9);
     opacity: 0.3;
   }
   50% {
     transform: scale(1.2);
-    opacity: 1;
+    opacity: 0.15;
+  }
+  100% {
+    transform: scale(0.9);
+    opacity: 0.3;
+  }
+}
+
+@keyframes pulse-core {
+  0% {
+    transform: scale(0.9);
+    opacity: 0.6;
+  }
+  100% {
+    transform: scale(1);
+    opacity: 0.8;
+  }
+}
+
+@keyframes wave-animation {
+  0%,
+  100% {
+    height: 4px;
+    opacity: 0.3;
+  }
+  50% {
+    height: 12px;
+    opacity: 0.7;
   }
 }
 
@@ -897,6 +991,20 @@ watch(
   .common-analysis-container {
     padding: 0 1rem;
   }
+
+  .analysis-status {
+    padding: 1rem;
+    margin-top: 0.75rem;
+  }
+
+  .ai-progress {
+    transform: scale(0.9);
+    min-width: 32px;
+  }
+
+  .thought-text {
+    font-size: 0.85rem;
+  }
 }
 
 @media (max-width: 480px) {
@@ -981,5 +1089,31 @@ watch(
     font-size: 0.85rem;
     padding: 0.3rem 0.6rem;
   }
+
+  .analysis-status {
+    padding: 0.75rem;
+    flex-direction: column;
+    gap: 0.75rem;
+  }
+
+  .ai-brain {
+    width: 32px;
+    height: 32px;
+    margin: 0 auto;
+  }
+
+  .brain-wave.left {
+    left: -8px;
+  }
+
+  .brain-wave.right {
+    left: 8px;
+  }
+
+  .thought-text {
+    font-size: 0.8rem;
+    text-align: center;
+    white-space: normal;
+  }
 }
 </style>