Add baccarat loss cover activity

2026-04-11 23:27:29 +08:00
parent dd9a8c5db8
commit e43dceab2c
22 changed files with 1898 additions and 5 deletions
@@ -0,0 +1,288 @@
+{{--
+    文件功能：百家乐买单活动前台弹窗
+
+    用于在娱乐大厅中查看当前买单活动、历史活动、
+    以及当前用户在每次活动中的补偿领取状态。
+--}}
+
+<div id="baccarat-loss-cover-modal"
+    style="display:none; position:fixed; inset:0; background:rgba(0,0,0,.55); z-index:9997; justify-content:center; align-items:center;">
+    <div
+        style="width:720px; max-width:96vw; max-height:88vh; border-radius:8px; overflow:hidden; box-shadow:0 8px 32px rgba(0,0,0,.3); background:#fff; display:flex; flex-direction:column;">
+        <div
+            style="background:linear-gradient(135deg,#15803d,#22c55e); color:#fff; padding:12px 16px; display:flex; align-items:center; justify-content:space-between;">
+            <div>
+                <div style="font-size:15px; font-weight:bold;">🎁 你玩游戏我买单</div>
+                <div style="font-size:11px; color:rgba(255,255,255,.82); margin-top:2px;">查看活动历史、个人记录与补偿领取状态</div>
+            </div>
+            <span onclick="closeBaccaratLossCoverModal()"
+                style="cursor:pointer; font-size:18px; opacity:.85;">&times;</span>
+        </div>
+
+        <div style="display:flex; gap:8px; padding:10px 14px; background:#f0fdf4; border-bottom:1px solid #dcfce7;">
+            <button type="button" id="blc-tab-overview"
+                onclick="switchBaccaratLossCoverTab('overview')"
+                style="padding:6px 14px; border:none; border-radius:999px; background:#15803d; color:#fff; font-size:12px; font-weight:bold; cursor:pointer;">
+                当前活动
+            </button>
+            <button type="button" id="blc-tab-history"
+                onclick="switchBaccaratLossCoverTab('history')"
+                style="padding:6px 14px; border:none; border-radius:999px; background:#dcfce7; color:#166534; font-size:12px; font-weight:bold; cursor:pointer;">
+                活动历史
+            </button>
+        </div>
+
+        <div style="flex:1; overflow-y:auto; background:#f6fff8; padding:14px;">
+            <div id="blc-overview-pane">
+                <div id="blc-current-event"
+                    style="background:#fff; border:1px solid #dcfce7; border-radius:10px; padding:18px; color:#166534; text-align:center;">
+                    加载中…
+                </div>
+            </div>
+
+            <div id="blc-history-pane" style="display:none;">
+                <div id="blc-history-list"
+                    style="display:flex; flex-direction:column; gap:10px; color:#166534;">
+                    加载中…
+                </div>
+            </div>
+        </div>
+
+        <div style="padding:10px 16px; background:#fff; border-top:1px solid #dcfce7; text-align:center;">
+            <button type="button" onclick="closeBaccaratLossCoverModal()"
+                style="padding:8px 28px; border:none; border-radius:8px; background:#dcfce7; color:#166534; font-size:12px; font-weight:bold; cursor:pointer;">
+                关闭
+            </button>
+        </div>
+    </div>
+</div>
+
+<script>
+    (function() {
+        const SUMMARY_URL = '{{ route('baccarat-loss-cover.summary') }}';
+        const HISTORY_URL = '{{ route('baccarat-loss-cover.history') }}';
+
+        function escapeHtml(text) {
+            const div = document.createElement('div');
+            div.textContent = text ?? '';
+            return div.innerHTML;
+        }
+
+        function formatTime(value) {
+            if (!value) return '—';
+            return new Date(value).toLocaleString('zh-CN', {
+                month: '2-digit',
+                day: '2-digit',
+                hour: '2-digit',
+                minute: '2-digit'
+            });
+        }
+
+        function syncUserGold(amount) {
+            if (typeof amount !== 'number' || !window.chatContext) return;
+            window.chatContext.userJjb = Number(window.chatContext.userJjb || 0) + amount;
+            window.chatContext.myGold = Number(window.chatContext.myGold || 0) + amount;
+
+            const hallGold = document.getElementById('game-hall-jjb');
+            if (hallGold) {
+                hallGold.textContent = Number(window.chatContext.userJjb || 0).toLocaleString();
+            }
+        }
+
+        function renderCurrentEvent(event) {
+            const container = document.getElementById('blc-current-event');
+            if (!event) {
+                container.innerHTML = `
+                    <div style="font-size:30px; margin-bottom:10px;">📭</div>
+                    <div style="font-size:16px; font-weight:bold; color:#166534;">当前暂无进行中的买单活动</div>
+                    <div style="font-size:12px; color:#4b5563; margin-top:8px;">可以在输入框上方的管理员按钮中创建新活动，也可以在这里查看历史记录。</div>
+                `;
+                return;
+            }
+
+            const myRecord = event.my_record;
+            const claimButton = event.status === 'claimable' && myRecord?.claim_status === 'pending'
+                ? `<button type="button" onclick="claimBaccaratLossCover(${event.id})" style="padding:8px 18px;border:none;border-radius:999px;background:#16a34a;color:#fff;font-size:12px;font-weight:bold;cursor:pointer;">领取补偿</button>`
+                : '';
+
+            container.innerHTML = `
+                <div style="display:flex; justify-content:space-between; align-items:flex-start; gap:12px; text-align:left;">
+                    <div style="flex:1;">
+                        <div style="font-size:18px; font-weight:900; color:#166534;">${escapeHtml(event.title)}</div>
+                        <div style="font-size:12px; color:#4b5563; margin-top:6px; line-height:1.7;">${escapeHtml(event.description || '活动期间参与百家乐，输掉的金币可在活动结束后领取补偿。')}</div>
+                    </div>
+                    <span style="padding:4px 10px; border-radius:999px; background:#dcfce7; color:#166534; font-size:12px; font-weight:bold;">${escapeHtml(event.status_label)}</span>
+                </div>
+                <div style="display:grid; grid-template-columns:repeat(2,1fr); gap:10px; margin-top:16px; text-align:left;">
+                    <div style="background:#f0fdf4; border-radius:8px; padding:12px;">
+                        <div style="font-size:11px; color:#6b7280;">开启人</div>
+                        <div style="font-size:14px; font-weight:bold; color:#166534; margin-top:3px;">${escapeHtml(event.creator_username)}</div>
+                    </div>
+                    <div style="background:#f0fdf4; border-radius:8px; padding:12px;">
+                        <div style="font-size:11px; color:#6b7280;">活动时间</div>
+                        <div style="font-size:13px; font-weight:bold; color:#166534; margin-top:3px;">${formatTime(event.starts_at)} - ${formatTime(event.ends_at)}</div>
+                    </div>
+                    <div style="background:#f0fdf4; border-radius:8px; padding:12px;">
+                        <div style="font-size:11px; color:#6b7280;">最终已发补偿</div>
+                        <div style="font-size:14px; font-weight:bold; color:#166534; margin-top:3px;">${Number(event.total_claimed_amount || 0).toLocaleString()} 金币</div>
+                    </div>
+                    <div style="background:#f0fdf4; border-radius:8px; padding:12px;">
+                        <div style="font-size:11px; color:#6b7280;">我的状态</div>
+                        <div style="font-size:14px; font-weight:bold; color:#166534; margin-top:3px;">${escapeHtml(myRecord?.claim_status_label || '未参与')}</div>
+                    </div>
+                </div>
+                ${myRecord ? `
+                    <div style="margin-top:16px; background:#fffbeb; border:1px solid #fde68a; border-radius:10px; padding:14px; text-align:left;">
+                        <div style="font-size:13px; font-weight:bold; color:#a16207; margin-bottom:8px;">我的活动记录</div>
+                        <div style="display:grid; grid-template-columns:repeat(2,1fr); gap:8px; font-size:12px; color:#4b5563;">
+                            <div>累计下注：<b style="color:#166534;">${Number(myRecord.total_bet_amount || 0).toLocaleString()}</b></div>
+                            <div>累计输掉：<b style="color:#b91c1c;">${Number(myRecord.total_loss_amount || 0).toLocaleString()}</b></div>
+                            <div>可领补偿：<b style="color:#166534;">${Number(myRecord.compensation_amount || 0).toLocaleString()}</b></div>
+                            <div>已领补偿：<b style="color:#166534;">${Number(myRecord.claimed_amount || 0).toLocaleString()}</b></div>
+                        </div>
+                        ${claimButton ? `<div style="margin-top:12px;">${claimButton}</div>` : ''}
+                    </div>
+                ` : ''}
+            `;
+        }
+
+        function renderHistory(events) {
+            const container = document.getElementById('blc-history-list');
+            if (!events || events.length === 0) {
+                container.innerHTML = '<div style="text-align:center;color:#6b7280;padding:24px 0;">暂无活动记录</div>';
+                return;
+            }
+
+            container.innerHTML = events.map(event => {
+                const myRecord = event.my_record;
+                const claimButton = event.status === 'claimable' && myRecord?.claim_status === 'pending'
+                    ? `<button type="button" onclick="claimBaccaratLossCover(${event.id})" style="padding:6px 14px;border:none;border-radius:999px;background:#16a34a;color:#fff;font-size:12px;font-weight:bold;cursor:pointer;">领取补偿</button>`
+                    : '';
+
+                return `
+                    <div style="background:#fff; border:1px solid #dcfce7; border-left:4px solid #16a34a; border-radius:8px; padding:14px;">
+                        <div style="display:flex; justify-content:space-between; gap:10px; align-items:flex-start;">
+                            <div style="flex:1;">
+                                <div style="font-size:15px; font-weight:bold; color:#166534;">${escapeHtml(event.title)}</div>
+                                <div style="font-size:12px; color:#4b5563; margin-top:4px;">开启人：${escapeHtml(event.creator_username)} ｜ ${formatTime(event.starts_at)} - ${formatTime(event.ends_at)}</div>
+                            </div>
+                            <span style="padding:4px 10px; border-radius:999px; background:#f0fdf4; color:#166534; font-size:12px; font-weight:bold;">${escapeHtml(event.status_label)}</span>
+                        </div>
+                        <div style="display:grid; grid-template-columns:repeat(2,1fr); gap:8px; margin-top:12px; font-size:12px; color:#4b5563;">
+                            <div>最终补偿发放：<b style="color:#166534;">${Number(event.total_claimed_amount || 0).toLocaleString()}</b></div>
+                            <div>本次总输金币：<b style="color:#b91c1c;">${Number(event.total_loss_amount || 0).toLocaleString()}</b></div>
+                            <div>我的状态：<b style="color:#166534;">${escapeHtml(myRecord?.claim_status_label || '未参与')}</b></div>
+                            <div>我的可领：<b style="color:#166534;">${Number(myRecord?.compensation_amount || 0).toLocaleString()}</b></div>
+                        </div>
+                        ${myRecord ? `<div style="margin-top:8px; font-size:12px; color:#6b7280;">累计下注 ${Number(myRecord.total_bet_amount || 0).toLocaleString()} ｜ 累计输掉 ${Number(myRecord.total_loss_amount || 0).toLocaleString()} ｜ 已领 ${Number(myRecord.claimed_amount || 0).toLocaleString()}</div>` : ''}
+                        ${claimButton ? `<div style="margin-top:10px;">${claimButton}</div>` : ''}
+                    </div>
+                `;
+            }).join('');
+        }
+
+        async function loadSummary() {
+            const current = document.getElementById('blc-current-event');
+            current.innerHTML = '加载中…';
+
+            try {
+                const response = await fetch(SUMMARY_URL, {
+                    headers: {
+                        'Accept': 'application/json'
+                    }
+                });
+                const data = await response.json();
+                renderCurrentEvent(data.event || null);
+            } catch (error) {
+                current.innerHTML = '<div style="color:#dc2626;">活动摘要加载失败，请稍后重试。</div>';
+            }
+        }
+
+        async function loadHistory() {
+            const list = document.getElementById('blc-history-list');
+            list.innerHTML = '加载中…';
+
+            try {
+                const response = await fetch(HISTORY_URL, {
+                    headers: {
+                        'Accept': 'application/json'
+                    }
+                });
+                const data = await response.json();
+                renderHistory(data.events || []);
+            } catch (error) {
+                list.innerHTML = '<div style="color:#dc2626;">活动历史加载失败，请稍后重试。</div>';
+            }
+        }
+
+        window.switchBaccaratLossCoverTab = function(tab) {
+            const overview = document.getElementById('blc-overview-pane');
+            const history = document.getElementById('blc-history-pane');
+            const overviewBtn = document.getElementById('blc-tab-overview');
+            const historyBtn = document.getElementById('blc-tab-history');
+
+            if (tab === 'history') {
+                overview.style.display = 'none';
+                history.style.display = 'block';
+                overviewBtn.style.background = '#dcfce7';
+                overviewBtn.style.color = '#166534';
+                historyBtn.style.background = '#15803d';
+                historyBtn.style.color = '#fff';
+                return;
+            }
+
+            overview.style.display = 'block';
+            history.style.display = 'none';
+            overviewBtn.style.background = '#15803d';
+            overviewBtn.style.color = '#fff';
+            historyBtn.style.background = '#dcfce7';
+            historyBtn.style.color = '#166534';
+        };
+
+        window.openBaccaratLossCoverModal = async function(tab = 'overview') {
+            document.getElementById('baccarat-loss-cover-modal').style.display = 'flex';
+            window.switchBaccaratLossCoverTab(tab);
+            await Promise.all([loadSummary(), loadHistory()]);
+        };
+
+        window.closeBaccaratLossCoverModal = function() {
+            document.getElementById('baccarat-loss-cover-modal').style.display = 'none';
+        };
+
+        window.claimBaccaratLossCover = async function(eventId) {
+            try {
+                const response = await fetch(`/baccarat-loss-cover/${eventId}/claim`, {
+                    method: 'POST',
+                    headers: {
+                        'X-CSRF-TOKEN': document.querySelector('meta[name="csrf-token"]')?.content || '',
+                        'Accept': 'application/json'
+                    }
+                });
+                const data = await response.json();
+
+                if (data.ok) {
+                    syncUserGold(Number(data.amount || 0));
+                    if (window.chatDialog?.alert) {
+                        await window.chatDialog.alert(data.message || '补偿领取成功', '系统通知', '#16a34a');
+                    }
+                    await Promise.all([loadSummary(), loadHistory()]);
+                    return;
+                }
+
+                if (window.chatDialog?.alert) {
+                    await window.chatDialog.alert(data.message || '领取失败', '提示', '#f59e0b');
+                }
+            } catch (error) {
+                if (window.chatDialog?.alert) {
+                    await window.chatDialog.alert('领取失败，请稍后重试。', '提示', '#dc2626');
+                }
+            }
+        };
+
+        document.getElementById('baccarat-loss-cover-modal').addEventListener('click', function(event) {
+            if (event.target === this) {
+                closeBaccaratLossCoverModal();
+            }
+        });
+    })();
+</script>
@@ -127,6 +127,63 @@
                },
                btnLabel: (data) => data?.round?.status === 'betting' ? '🎲 立即下注' : '📊 查看详情',
            },
+            {
+                id: 'baccarat_loss_cover',
+                name: '🎁 买单活动',
+                desc: '查看“你玩游戏我买单”活动，补偿领取和个人历史记录',
+                accentColor: '#16a34a',
+                fetchUrl: '/baccarat-loss-cover/summary',
+                openFn: () => {
+                    closeGameHall();
+                    if (typeof openBaccaratLossCoverModal === 'function') {
+                        openBaccaratLossCoverModal('overview');
+                    }
+                },
+                renderStatus: (data) => {
+                    const event = data?.event;
+                    if (!event) {
+                        return {
+                            badge: '📭 暂无活动',
+                            badgeStyle: 'background:#e8f0f8; color:#336699; border:1px solid #b8d0e8',
+                            detail: '当前没有进行中或待领取的买单活动'
+                        };
+                    }
+
+                    const myStatus = event.my_record?.claim_status_label || '未参与';
+                    const total = Number(event.total_claimed_amount || 0).toLocaleString();
+
+                    if (event.status === 'active') {
+                        return {
+                            badge: '🟢 进行中',
+                            badgeStyle: 'background:#d1fae5; color:#065f46; border:1px solid #6ee7b7',
+                            detail: `我的状态：${myStatus} | 开启人：${event.creator_username}`
+                        };
+                    }
+
+                    if (event.status === 'settlement_pending') {
+                        return {
+                            badge: '⏳ 结算中',
+                            badgeStyle: 'background:#fef3c7; color:#92400e; border:1px solid #fcd34d',
+                            detail: `活动已结束，等待最后几局结算 | 我的状态：${myStatus}`
+                        };
+                    }
+
+                    if (event.status === 'claimable') {
+                        return {
+                            badge: '💰 可领取',
+                            badgeStyle: 'background:#dcfce7; color:#166534; border:1px solid #86efac',
+                            detail: `我的状态：${myStatus} | 已发补偿 ${total} 金币`
+                        };
+                    }
+
+                    return {
+                        badge: '🕒 即将开始',
+                        badgeStyle: 'background:#ede9fe; color:#5b21b6; border:1px solid #c4b5fd',
+                        detail: `开启人：${event.creator_username} | 我的状态：${myStatus}`
+                    };
+                },
+                btnLabel: (data) => data?.event?.status === 'claimable' ? '💰 查看并领取' : '📜 查看活动',
+            },
            {
                id: 'slot_machine',
                name: '🎰 老虎机',