From 46ac8aad39ef3c2162c37c8a7eda3661bf34d034 Mon Sep 17 00:00:00 2001
From: aaron <>
Date: Wed, 4 Jun 2025 13:05:37 +0800
Subject: [PATCH] update

---
 docker-compose.yml          |   2 +-
 src/views/ChatAgentView.vue | 200 ++++++++++++++++++++++++------------
 2 files changed, 137 insertions(+), 65 deletions(-)

diff --git a/docker-compose.yml b/docker-compose.yml
index c2a482b..92e0b61 100644
--- a/docker-compose.yml
+++ b/docker-compose.yml
@@ -3,7 +3,7 @@ services:
     build:
       context: .
       dockerfile: Dockerfile
-    image: tradus-web:1.3.43
+    image: tradus-web:1.3.44
     container_name: tradus-web
     ports:
       - '6000:80'
diff --git a/src/views/ChatAgentView.vue b/src/views/ChatAgentView.vue
index dcd7f97..3cf9499 100644
--- a/src/views/ChatAgentView.vue
+++ b/src/views/ChatAgentView.vue
@@ -1,7 +1,17 @@
 <script setup lang="ts">
-import { ref, nextTick, onMounted } from 'vue'
+import { ref, nextTick, onMounted, computed } from 'vue'
 import { http } from '../services/api'
 import { marked } from 'marked'
+import { useUserStore } from '../stores/user'
+
+// 使用用户store，与App.vue保持一致
+const userStore = useUserStore()
+const userInfo = computed(() => userStore.userInfo)
+
+// 计算属性：用户积分余额，直接从store获取
+const userPoints = computed(() => {
+  return userInfo.value?.points || 0
+})
 
 // 配置marked选项
 onMounted(() => {
@@ -672,62 +682,11 @@ const stopStreaming = async () => {
             <div class="points-notice">
               <div class="points-notice-icon">💰</div>
               <div class="points-notice-text">
-                <strong>积分消耗提示：</strong>每次分析消耗
+                每次分析消耗
                 <span class="points-amount">20 积分</span>
-              </div>
-            </div>
-
-            <div class="example-questions">
-              <p class="example-title">快速点击分析：</p>
-              <div class="example-grid">
-                <button
-                  class="example-question"
-                  @click="sendExampleMessage('分析BTC行情')"
-                  :disabled="isLoading"
+                <span class="points-balance"
+                  >（剩余积分：{{ userPoints.toLocaleString() }} 积分）</span
                 >
-                  <span class="example-icon">₿</span>
-                  <span>分析BTC行情</span>
-                </button>
-                <button
-                  class="example-question"
-                  @click="sendExampleMessage('分析ETH行情')"
-                  :disabled="isLoading"
-                >
-                  <span class="example-icon">Ξ</span>
-                  <span>分析ETH行情</span>
-                </button>
-                <button
-                  class="example-question"
-                  @click="sendExampleMessage('分析贵州茅台股票')"
-                  :disabled="isLoading"
-                >
-                  <span class="example-icon">📈</span>
-                  <span>分析贵州茅台股票</span>
-                </button>
-                <button
-                  class="example-question"
-                  @click="sendExampleMessage('分析中国平安股票')"
-                  :disabled="isLoading"
-                >
-                  <span class="example-icon">🏦</span>
-                  <span>分析中国平安股票</span>
-                </button>
-                <button
-                  class="example-question"
-                  @click="sendExampleMessage('分析苹果公司(AAPL)股票')"
-                  :disabled="isLoading"
-                >
-                  <span class="example-icon">🍎</span>
-                  <span>分析苹果公司股票</span>
-                </button>
-                <button
-                  class="example-question"
-                  @click="sendExampleMessage('分析黄金价格走势')"
-                  :disabled="isLoading"
-                >
-                  <span class="example-icon">🪙</span>
-                  <span>分析黄金价格走势</span>
-                </button>
               </div>
             </div>
           </div>
@@ -800,6 +759,51 @@ const stopStreaming = async () => {
 
       <!-- 输入区域 -->
       <div class="chat-input">
+        <!-- 快速分析按钮区域 -->
+        <div class="quick-analysis-buttons">
+          <button
+            class="quick-btn"
+            @click="sendExampleMessage('分析BTC行情')"
+            :disabled="isLoading"
+          >
+            <span class="quick-icon">₿</span>
+            <span>BTC</span>
+          </button>
+          <button
+            class="quick-btn"
+            @click="sendExampleMessage('分析ETH行情')"
+            :disabled="isLoading"
+          >
+            <span class="quick-icon">Ξ</span>
+            <span>ETH</span>
+          </button>
+          <button
+            class="quick-btn"
+            @click="sendExampleMessage('分析贵州茅台股票')"
+            :disabled="isLoading"
+          >
+            <span class="quick-icon">📈</span>
+            <span>茅台</span>
+          </button>
+
+          <button
+            class="quick-btn"
+            @click="sendExampleMessage('分析苹果公司(AAPL)股票')"
+            :disabled="isLoading"
+          >
+            <span class="quick-icon">🍎</span>
+            <span>苹果</span>
+          </button>
+          <button
+            class="quick-btn"
+            @click="sendExampleMessage('分析黄金价格走势')"
+            :disabled="isLoading"
+          >
+            <span class="quick-icon">🪙</span>
+            <span>黄金</span>
+          </button>
+        </div>
+
         <div class="input-container">
           <textarea
             v-model="messageInput"
@@ -1125,12 +1129,16 @@ const stopStreaming = async () => {
   text-align: center;
   min-height: 0;
   overflow-y: auto;
+  padding: 2rem 1rem;
 }
 
 .welcome-content {
   max-width: 500px;
-  padding: 2rem 1rem;
   width: 100%;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
 }
 
 .welcome-icon {
@@ -1152,7 +1160,7 @@ const stopStreaming = async () => {
   line-height: 1.6;
 }
 
-/* 移动端积分提示样式 */
+/* 积分消耗提示 */
 .points-notice {
   display: flex;
   align-items: center;
@@ -1188,6 +1196,11 @@ const stopStreaming = async () => {
   font-size: 1em;
 }
 
+.points-balance {
+  color: var(--color-text-secondary);
+  font-size: 0.9rem;
+}
+
 .example-questions {
   display: flex;
   flex-direction: column;
@@ -1473,6 +1486,56 @@ const stopStreaming = async () => {
   z-index: 10;
 }
 
+/* 快速分析按钮样式 */
+.quick-analysis-buttons {
+  display: flex;
+  gap: 0.5rem;
+  margin-bottom: 0.75rem;
+  padding: 0 0.25rem;
+  overflow-x: auto;
+  scrollbar-width: none;
+  -ms-overflow-style: none;
+}
+
+.quick-analysis-buttons::-webkit-scrollbar {
+  display: none;
+}
+
+.quick-btn {
+  display: flex;
+  align-items: center;
+  gap: 0.375rem;
+  padding: 0.5rem 0.75rem;
+  border: 1px solid var(--color-border);
+  border-radius: 20px;
+  background: var(--color-bg-secondary);
+  color: var(--color-text-primary);
+  cursor: pointer;
+  transition: all 0.2s ease;
+  font-size: 0.8rem;
+  white-space: nowrap;
+  flex-shrink: 0;
+  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
+}
+
+.quick-btn:hover:not(:disabled) {
+  border-color: var(--color-accent);
+  background: var(--color-bg-primary);
+  transform: translateY(-1px);
+  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
+}
+
+.quick-btn:disabled {
+  opacity: 0.5;
+  cursor: not-allowed;
+  transform: none;
+}
+
+.quick-icon {
+  font-size: 0.9rem;
+  flex-shrink: 0;
+}
+
 .input-container {
   display: flex;
   gap: 1rem;
@@ -1599,13 +1662,17 @@ const stopStreaming = async () => {
   .welcome-message {
     height: auto;
     min-height: calc(100vh - 160px); /* 减去header和输入框的高度 */
-    align-items: flex-start;
-    padding-top: 2rem;
+    align-items: center;
+    padding: 2rem 1rem;
+    justify-content: center;
   }
 
   .welcome-content {
-    padding: 0 1rem 2rem 1rem;
     max-width: 100%;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
   }
 
   .welcome-icon {
@@ -1677,7 +1744,6 @@ const stopStreaming = async () => {
     left: 0;
     right: 0;
     z-index: 100;
-    border-top: 1px solid var(--color-border);
   }
 
   .input-container {
@@ -1787,13 +1853,19 @@ const stopStreaming = async () => {
   .welcome-message {
     height: auto;
     min-height: calc(100vh - 180px); /* 减去header和输入框的高度 */
-    align-items: flex-start;
-    padding-top: 1rem;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    padding: 1rem;
+    text-align: center;
   }
 
   .welcome-content {
-    padding: 0 0.5rem 2rem 0.5rem;
     max-width: 100%;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
   }
 
   .welcome-icon {