From 2f246f91129893d287c8ec9604a205239c7e26c9 Mon Sep 17 00:00:00 2001 From: lkddi Date: Sat, 25 Apr 2026 03:36:30 +0800 Subject: [PATCH] =?UTF-8?q?=E8=BF=81=E7=A7=BB=E8=81=8A=E5=A4=A9=E5=9B=BE?= =?UTF-8?q?=E7=89=87=E9=A2=84=E8=A7=88=E4=BA=8B=E4=BB=B6=E5=88=B0Vite?= =?UTF-8?q?=E6=A8=A1=E5=9D=97?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- resources/js/chat-room.js | 5 ++- resources/js/chat-room/lightbox.js | 43 ++++++++++++++++++- resources/views/chat/frame.blade.php | 8 ++-- .../views/chat/partials/scripts.blade.php | 3 +- 4 files changed, 50 insertions(+), 9 deletions(-) diff --git a/resources/js/chat-room.js b/resources/js/chat-room.js index d3d298b..a681207 100644 --- a/resources/js/chat-room.js +++ b/resources/js/chat-room.js @@ -2,7 +2,7 @@ export { escapeHtml, escapeHtmlWithLineBreaks } from "./chat-room/html.js"; export { applyFontSize, CHAT_FONT_SIZE_STORAGE_KEY, restoreChatFontSize } from "./chat-room/font-size.js"; -export { closeChatImageLightbox, openChatImageLightbox } from "./chat-room/lightbox.js"; +export { closeChatImageLightbox, initChatImageLightboxEvents, openChatImageLightbox } from "./chat-room/lightbox.js"; export { BLOCKABLE_SYSTEM_SENDERS, BLOCKED_SYSTEM_SENDERS_STORAGE_KEY, @@ -22,7 +22,7 @@ export { createMessageQueue } from "./chat-room/message-queue.js"; import { escapeHtml, escapeHtmlWithLineBreaks } from "./chat-room/html.js"; import { applyFontSize, CHAT_FONT_SIZE_STORAGE_KEY, restoreChatFontSize } from "./chat-room/font-size.js"; -import { closeChatImageLightbox, openChatImageLightbox } from "./chat-room/lightbox.js"; +import { closeChatImageLightbox, initChatImageLightboxEvents, openChatImageLightbox } from "./chat-room/lightbox.js"; import { BLOCKABLE_SYSTEM_SENDERS, BLOCKED_SYSTEM_SENDERS_STORAGE_KEY, @@ -48,6 +48,7 @@ if (typeof window !== "undefined") { CHAT_FONT_SIZE_STORAGE_KEY, restoreChatFontSize, closeChatImageLightbox, + initChatImageLightboxEvents, openChatImageLightbox, BLOCKABLE_SYSTEM_SENDERS, BLOCKED_SYSTEM_SENDERS_STORAGE_KEY, diff --git a/resources/js/chat-room/lightbox.js b/resources/js/chat-room/lightbox.js index c8430b5..ec457d8 100644 --- a/resources/js/chat-room/lightbox.js +++ b/resources/js/chat-room/lightbox.js @@ -1,4 +1,6 @@ -// 聊天室图片预览层控制，迁出 Blade 内联脚本后仍通过 window 全局函数兼容现有 onclick。 +// 聊天室图片预览层控制，迁出 Blade 内联脚本后通过事件委托接管打开和关闭。 + +let lightboxEventsBound = false; /** * 打开聊天图片大图预览层。 @@ -52,3 +54,42 @@ export function closeChatImageLightbox(event = null) { document.body.style.overflow = ""; } + +/** + * 绑定聊天图片预览层事件委托。 + * + * @returns {void} + */ +export function initChatImageLightboxEvents() { + if (lightboxEventsBound) { + return; + } + + lightboxEventsBound = true; + document.addEventListener("click", (event) => { + if (!(event.target instanceof Element)) { + return; + } + + const imagePreview = event.target.closest("[data-chat-image-lightbox-image]"); + if (imagePreview) { + return; + } + + const opener = event.target.closest("[data-chat-image-lightbox-open]"); + if (opener) { + event.preventDefault(); + openChatImageLightbox(opener.dataset.full || opener.href, opener.dataset.alt || "聊天图片"); + return; + } + + if (event.target.closest("[data-chat-image-lightbox-close]")) { + event.preventDefault(); + closeChatImageLightbox(); + } + }); +} + +if (typeof document !== "undefined") { + initChatImageLightboxEvents(); +} diff --git a/resources/views/chat/frame.blade.php b/resources/views/chat/frame.blade.php index c750ee1..dc605cb 100644 --- a/resources/views/chat/frame.blade.php +++ b/resources/views/chat/frame.blade.php @@ -186,15 +186,15 @@ {{-- 聊天图片大图预览层 --}}