百家乐结算页:10秒后自动关闭,显示倒计时,手动关闭可取消

This commit is contained in:
2026-03-17 20:46:48 +08:00
parent c8ebbc750e
commit 7d984ebe64
@@ -276,13 +276,16 @@
{{-- 底部关闭 --}} {{-- 底部关闭 --}}
<div <div
style="background:#fff; border-top:1px solid #d0e4f5; padding:12px 16px; display:flex; justify-content:center;"> style="background:#fff; border-top:1px solid #d0e4f5; padding:12px 16px; display:flex; flex-direction:column; align-items:center; gap:6px;">
<button x-on:click="close()" <button x-on:click="close()"
style="padding:10px 48px; min-width:140px; background:#f0f6ff; border:1px solid #b0d0ee; border-radius:12px; style="padding:10px 48px; min-width:140px; background:#f0f6ff; border:1px solid #b0d0ee; border-radius:12px;
font-size:14px; font-weight:bold; color:#336699; cursor:pointer; transition:all .15s; font-family:inherit;" font-size:14px; font-weight:bold; color:#336699; cursor:pointer; transition:all .15s; font-family:inherit;"
onmouseover="this.style.background='#ddeeff'" onmouseout="this.style.background='#f0f6ff'"> onmouseover="this.style.background='#ddeeff'" onmouseout="this.style.background='#f0f6ff'">
关闭 关闭
</button> </button>
{{-- 结算后显示自动关闭倒计时 --}}
<div x-show="phase === 'settled' && autoCloseCountdown > 0" style="display:none;
color:#b0c4d8; font-size:11px;" x-text="autoCloseCountdown + ' 秒后自动关闭'"></div>
</div> </div>
</div> </div>
</div> </div>
@@ -427,6 +430,10 @@
// 历史记录 // 历史记录
history: [], history: [],
// 结算后定时自动关闭
autoCloseTimer: null,
autoCloseCountdown: 0,
/** /**
* 开局:填充局次数据并开始倒计时 * 开局:填充局次数据并开始倒计时
*/ */
@@ -545,6 +552,17 @@
this.updateFab(false); this.updateFab(false);
this.loadHistory(); this.loadHistory();
// 结算后 10 秒自动关闭
this.autoCloseCountdown = 10;
clearInterval(this.autoCloseTimer);
this.autoCloseTimer = setInterval(() => {
this.autoCloseCountdown--;
if (this.autoCloseCountdown <= 0) {
clearInterval(this.autoCloseTimer);
this.close();
}
}, 1000);
}, },
/** /**
@@ -570,6 +588,9 @@
* 关闭面板 * 关闭面板
*/ */
close() { close() {
// 手动关闭时清除自动关闭定时器
clearInterval(this.autoCloseTimer);
this.autoCloseCountdown = 0;
this.show = false; this.show = false;
if (this.phase === 'betting') { if (this.phase === 'betting') {
this.updateFab(true); // 还在下注阶段时保留悬浮按钮 this.updateFab(true); // 还在下注阶段时保留悬浮按钮