From 8bd31f9006901fe93127099733c01adb8f8fc42c Mon Sep 17 00:00:00 2001
From: jiangchen <1703935164@qq.com>
Date: Tue, 1 Sep 2026 20:15:46 +0800
Subject: [PATCH] feat: tap bubble shows balance/today usage + peak mode +
 witty line

---
 src/pages/index/index.ux | 52 ++++++++++++++++++++++++++++++++++++----
 1 file changed, 47 insertions(+), 5 deletions(-)

diff --git a/src/pages/index/index.ux b/src/pages/index/index.ux
index cb1fab5..bed135b 100644
--- a/src/pages/index/index.ux
+++ b/src/pages/index/index.ux
@@ -12,7 +12,11 @@
 
     <!-- 点击吉祥物弹出的“对话小框”（类 DSH 挂件气泡） -->
     <div class="bubble" if="{{bubbleVisible}}">
-      <text class="bubble-text">{{bubbleText}}</text>
+      <text class="bubble-title">DeepSeek 余额</text>
+      <text class="bubble-balance">¥{{bubbleBalance}}</text>
+      <text class="bubble-usage">今日已用 ¥{{bubbleUsage}}</text>
+      <text class="bubble-mode {{isPeak ? 'bubble-mode-peak' : 'bubble-mode-off'}}">{{peakLabel}}</text>
+      <text class="bubble-fun">{{bubbleText}}</text>
     </div>
   </div>
 </template>
@@ -49,6 +53,8 @@ export default {
     todayCost: '--',
     bubbleVisible: false,
     bubbleText: '',
+    bubbleBalance: '--',
+    bubbleUsage: '--',
     tapAnim: false,
     lines: [
       '我算得比你快，但没你可爱。',
@@ -90,7 +96,9 @@ export default {
     // 对话小框：显示一句幽默文案 + 峰谷信息
     const idx = Math.floor(Math.random() * this.lines.length)
     const mode = this.isPeak ? '当前是峰时，钱包瑟瑟发抖' : '当前是谷时，薅羊毛好时机'
-    this.bubbleText = this.lines[idx] + ' ｜ ' + mode
+    this.bubbleText = this.lines[idx]
+    this.bubbleBalance = this.balance
+    this.bubbleUsage = this.todayCost
     this.bubbleVisible = !this.bubbleVisible
   }
 }
@@ -146,9 +154,43 @@ export default {
   background-color: #ffffff;
 }
 
-.bubble-text {
-  color: #0b1220;
-  font-size: 14px;
+.bubble-title {
+  color: #5b6b8c;
+  font-size: 13px;
   text-align: center;
 }
+
+.bubble-balance {
+  color: #1c2c47;
+  font-size: 26px;
+  font-weight: bold;
+  text-align: center;
+}
+
+.bubble-usage {
+  color: #5b6b8c;
+  font-size: 12px;
+  text-align: center;
+}
+
+.bubble-mode {
+  font-size: 13px;
+  font-weight: bold;
+  text-align: center;
+}
+
+.bubble-mode-peak {
+  color: #ff5b5b;
+}
+
+.bubble-mode-off {
+  color: #1f9e5a;
+}
+
+.bubble-fun {
+  color: #1c2c47;
+  font-size: 12px;
+  text-align: center;
+  margin-top: 4px;
+}
 </style>