feat: tap bubble shows balance/today usage + peak mode + witty line
This commit is contained in:
@@ -12,7 +12,11 @@
|
|||||||
|
|
||||||
<!-- 点击吉祥物弹出的“对话小框”(类 DSH 挂件气泡) -->
|
<!-- 点击吉祥物弹出的“对话小框”(类 DSH 挂件气泡) -->
|
||||||
<div class="bubble" if="{{bubbleVisible}}">
|
<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>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
@@ -49,6 +53,8 @@ export default {
|
|||||||
todayCost: '--',
|
todayCost: '--',
|
||||||
bubbleVisible: false,
|
bubbleVisible: false,
|
||||||
bubbleText: '',
|
bubbleText: '',
|
||||||
|
bubbleBalance: '--',
|
||||||
|
bubbleUsage: '--',
|
||||||
tapAnim: false,
|
tapAnim: false,
|
||||||
lines: [
|
lines: [
|
||||||
'我算得比你快,但没你可爱。',
|
'我算得比你快,但没你可爱。',
|
||||||
@@ -90,7 +96,9 @@ export default {
|
|||||||
// 对话小框:显示一句幽默文案 + 峰谷信息
|
// 对话小框:显示一句幽默文案 + 峰谷信息
|
||||||
const idx = Math.floor(Math.random() * this.lines.length)
|
const idx = Math.floor(Math.random() * this.lines.length)
|
||||||
const mode = this.isPeak ? '当前是峰时,钱包瑟瑟发抖' : '当前是谷时,薅羊毛好时机'
|
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
|
this.bubbleVisible = !this.bubbleVisible
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@@ -146,9 +154,43 @@ export default {
|
|||||||
background-color: #ffffff;
|
background-color: #ffffff;
|
||||||
}
|
}
|
||||||
|
|
||||||
.bubble-text {
|
.bubble-title {
|
||||||
color: #0b1220;
|
color: #5b6b8c;
|
||||||
font-size: 14px;
|
font-size: 13px;
|
||||||
text-align: center;
|
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>
|
</style>
|
||||||
|
|||||||
Reference in New Issue
Block a user