迁移百家乐事件脚本

resources/js/chat-room.js

@@ -24,6 +24,7 @@
  * - welcome-menu.js：处理欢迎菜单交互。
  * - admin-menu.js：处理聊天室管理菜单交互。
  * - baccarat-fab.js：处理百家乐悬浮按钮拖动与打开面板。
+ * - baccarat-events.js：处理百家乐广播事件和页面恢复当前局。
  * - baccarat-loss-cover-admin.js：处理百家乐买单活动管理弹层。
  * - baccarat-loss-cover.js：处理百家乐买单活动前台弹窗。
  * - game-hall.js：处理娱乐大厅弹窗和游戏入口卡片。
@@ -91,6 +92,7 @@ export { bindUserTargetActions, openUserCard, switchTarget } from "./chat-room/u
 export { bindWelcomeMenuControls } from "./chat-room/welcome-menu.js";
 export { bindAdminMenuControls } from "./chat-room/admin-menu.js";
 export { baccaratFab, bindBaccaratFabControls } from "./chat-room/baccarat-fab.js";
+export { bindBaccaratEvents } from "./chat-room/baccarat-events.js";
 export {
     bindBaccaratLossCoverAdminControls,
     closeAdminBaccaratLossCoverModal,
@@ -238,6 +240,7 @@ import { bindUserTargetActions, openUserCard, switchTarget } from "./chat-room/u
 import { bindWelcomeMenuControls } from "./chat-room/welcome-menu.js";
 import { bindAdminMenuControls } from "./chat-room/admin-menu.js";
 import { baccaratFab, bindBaccaratFabControls } from "./chat-room/baccarat-fab.js";
+import { bindBaccaratEvents } from "./chat-room/baccarat-events.js";
 import {
     bindBaccaratLossCoverAdminControls,
     closeAdminBaccaratLossCoverModal,
@@ -396,6 +399,7 @@ if (typeof window !== "undefined") {
         bindAdminMenuControls,
         baccaratFab,
         bindBaccaratFabControls,
+        bindBaccaratEvents,
         bindBaccaratLossCoverAdminControls,
         closeAdminBaccaratLossCoverModal,
         closeCurrentBaccaratLossCoverEvent,
@@ -651,6 +655,7 @@ if (typeof window !== "undefined") {
     bindUserTargetActions();
     bindAdminMenuControls();
     bindBaccaratFabControls();
+    bindBaccaratEvents();
     bindBaccaratLossCoverAdminControls();
     bindBaccaratLossCoverControls();
     bindGameHallControls();

resources/js/chat-room/baccarat-events.js

@@ -0,0 +1,129 @@
+// 乐彩百家乐事件监听模块，负责广播事件转发和页面恢复当前局。
+
+/**
+ * 读取百家乐面板 Alpine 状态。
+ *
+ * @returns {Record<string, any>|null}
+ */
+function getBaccaratPanelState() {
+    const panel = document.getElementById("baccarat-panel");
+
+    if (!panel || typeof window.Alpine?.$data !== "function") {
+        return null;
+    }
+
+    return window.Alpine.$data(panel);
+}
+
+/**
+ * 同步下注池人数统计，避免不同局的数据互相污染。
+ *
+ * @param {Record<string, any>} data 下注池广播数据
+ * @returns {void}
+ */
+function updateBaccaratPool(data) {
+    const panelState = getBaccaratPanelState();
+
+    if (!panelState || panelState.roundId !== data.round_id) {
+        return;
+    }
+
+    panelState.betCountBig = data.bet_count_big;
+    panelState.betCountSmall = data.bet_count_small;
+    panelState.betCountTriple = data.bet_count_triple;
+}
+
+/**
+ * 从当前局接口恢复下注面板状态。
+ *
+ * @param {Record<string, any>} panelState 面板 Alpine 状态
+ * @param {Record<string, any>} round 当前局数据
+ * @returns {void}
+ */
+function restoreCurrentBaccaratRound(panelState, round) {
+    const seconds = Number(round.seconds_left || 0);
+
+    if (seconds <= 0) {
+        panelState.setIdleState();
+        return;
+    }
+
+    panelState.phase = "betting";
+    panelState.roundId = round.id;
+    panelState.totalSeconds = 60;
+    panelState.countdown = seconds;
+    panelState.totalBetBig = round.total_bet_big;
+    panelState.totalBetSmall = round.total_bet_small;
+    panelState.totalBetTriple = round.total_bet_triple;
+    panelState.betCountBig = round.bet_count_big;
+    panelState.betCountSmall = round.bet_count_small;
+    panelState.betCountTriple = round.bet_count_triple;
+
+    if (round.my_bet) {
+        panelState.myBet = true;
+        panelState.myBetType = round.my_bet.bet_type;
+        panelState.myBetAmount = round.my_bet.amount;
+    }
+
+    // 只显示悬浮按钮，不自动弹出全屏，避免打扰刚进入的用户。
+    panelState.updateFab(true);
+}
+
+/**
+ * 页面加载后恢复历史趋势、金币和当前局。
+ *
+ * @returns {Promise<void>}
+ */
+async function restoreBaccaratOnReady() {
+    try {
+        const panelState = getBaccaratPanelState();
+
+        if (!panelState) {
+            return;
+        }
+
+        const historyResponse = await fetch("/baccarat/history");
+        const historyData = await historyResponse.json();
+        panelState.history = (historyData.history || []).reverse();
+
+        const currentResponse = await fetch("/baccarat/current");
+        const currentData = await currentResponse.json();
+        panelState.syncUserGold(currentData.jjb);
+
+        if (currentData.round) {
+            restoreCurrentBaccaratRound(panelState, currentData.round);
+            return;
+        }
+
+        panelState.setIdleState();
+    } catch (error) {
+        console.warn("[百家乐] 初始化失败", error);
+    }
+}
+
+/**
+ * 绑定百家乐广播事件和页面恢复逻辑。
+ *
+ * @returns {void}
+ */
+export function bindBaccaratEvents() {
+    if (typeof window === "undefined" || typeof document === "undefined" || window.__baccaratEventsBound) {
+        return;
+    }
+
+    window.__baccaratEventsBound = true;
+
+    window.addEventListener("chat:baccarat.opened", (event) => {
+        getBaccaratPanelState()?.openRound(event.detail);
+    });
+
+    window.addEventListener("chat:baccarat.settled", (event) => {
+        getBaccaratPanelState()?.showResult(event.detail);
+    });
+
+    window.addEventListener("chat:baccarat.pool_updated", (event) => {
+        updateBaccaratPool(event.detail || {});
+    });
+
+    document.addEventListener("DOMContentLoaded", () => window.deferChatGameBootstrap?.(restoreBaccaratOnReady));
+}

resources/views/chat/partials/games/baccarat-panel.blade.php

@@ -716,87 +716,5 @@
         };
     }
 
-    // ─── WebSocket 监听 ──────────────────────────────────────────────
+    {{-- 乐彩百家乐广播监听和页面恢复逻辑已迁移到 resources/js/chat-room/baccarat-events.js --}}
-
-    /** 收到开局事件：弹出押注面板 */
-    window.addEventListener('chat:baccarat.opened', (e) => {
-        const panel = document.getElementById('baccarat-panel');
-        if (panel) Alpine.$data(panel).openRound(e.detail);
-    });
-
-    /** 收到结算事件：展示骰子动画和结果 */
-    window.addEventListener('chat:baccarat.settled', (e) => {
-        const panel = document.getElementById('baccarat-panel');
-        if (panel) Alpine.$data(panel).showResult(e.detail);
-    });
-
-    /** 收到下注池更新：更新押注人数 */
-    window.addEventListener('chat:baccarat.pool_updated', (e) => {
-        const panel = document.getElementById('baccarat-panel');
-        if (panel) {
-            const pd = Alpine.$data(panel);
-            const data = e.detail;
-            // 判断 round_id 是否一致
-            if (pd.roundId === data.round_id) {
-                pd.betCountBig = data.bet_count_big;
-                pd.betCountSmall = data.bet_count_small;
-                pd.betCountTriple = data.bet_count_triple;
-            }
-        }
-    });
-
-    /** 页面空闲时：检查是否有进行中的局，有则自动恢复面板 */
-    document.addEventListener('DOMContentLoaded', () => window.deferChatGameBootstrap(async () => {
-        try {
-            // 先加载历史趋势
-            const histRes = await fetch('/baccarat/history');
-            const histData = await histRes.json();
-            const panel = document.getElementById('baccarat-panel');
-            if (panel) {
-                Alpine.$data(panel).history = (histData.history || []).reverse();
-            }
-
-            // 再检查是否有正在进行的局
-            const curRes = await fetch('/baccarat/current');
-            const curData = await curRes.json();
-            if (panel) {
-                Alpine.$data(panel).syncUserGold(curData.jjb);
-            }
-
-            if (curData.round && panel) {
-                const round = curData.round;
-                const seconds = round.seconds_left || 0;
-                const panelData = Alpine.$data(panel);
-
-                if (seconds > 0) {
-                    // 有进行中的局且还在押注时间内 → 恢复押注面板
-                    panelData.phase = 'betting';
-                    panelData.roundId = round.id;
-                    panelData.totalSeconds = 60; // 服务端配置的窗口
-                    panelData.countdown = seconds;
-                    panelData.totalBetBig = round.total_bet_big;
-                    panelData.totalBetSmall = round.total_bet_small;
-                    panelData.totalBetTriple = round.total_bet_triple;
-                    panelData.betCountBig = round.bet_count_big;
-                    panelData.betCountSmall = round.bet_count_small;
-                    panelData.betCountTriple = round.bet_count_triple;
-
-                    if (round.my_bet) {
-                        panelData.myBet = true;
-                        panelData.myBetType = round.my_bet.bet_type;
-                        panelData.myBetAmount = round.my_bet.amount;
-                    }
-
-                    // 只显示悬浮按钮，不自动弹出全屏（避免打扰刚进入的用户）
-                    panelData.updateFab(true);
-                } else {
-                    panelData.setIdleState();
-                }
-            } else if (panel) {
-                Alpine.$data(panel).setIdleState();
-            }
-        } catch (e) {
-            console.warn('[百家乐] 初始化失败', e);
-        }
-    }));
 </script>