diff --git a/resources/js/chat-room.js b/resources/js/chat-room.js index 148245c..31c146b 100644 --- a/resources/js/chat-room.js +++ b/resources/js/chat-room.js @@ -2,6 +2,7 @@ export { escapeHtml, escapeHtmlWithLineBreaks } from "./chat-room/html.js"; export { applyFontSize, bindChatFontSizeControl, CHAT_FONT_SIZE_STORAGE_KEY, restoreChatFontSize } from "./chat-room/font-size.js"; +export { bindChatImageUploadControl } from "./chat-room/image-upload.js"; export { closeChatImageLightbox, initChatImageLightboxEvents, openChatImageLightbox } from "./chat-room/lightbox.js"; export { BLOCKABLE_SYSTEM_SENDERS, @@ -28,6 +29,7 @@ export { createMessageQueue } from "./chat-room/message-queue.js"; import { escapeHtml, escapeHtmlWithLineBreaks } from "./chat-room/html.js"; import { applyFontSize, bindChatFontSizeControl, CHAT_FONT_SIZE_STORAGE_KEY, restoreChatFontSize } from "./chat-room/font-size.js"; +import { bindChatImageUploadControl } from "./chat-room/image-upload.js"; import { closeChatImageLightbox, initChatImageLightboxEvents, openChatImageLightbox } from "./chat-room/lightbox.js"; import { BLOCKABLE_SYSTEM_SENDERS, @@ -58,6 +60,7 @@ if (typeof window !== "undefined") { escapeHtmlWithLineBreaks, applyFontSize, bindChatFontSizeControl, + bindChatImageUploadControl, CHAT_FONT_SIZE_STORAGE_KEY, restoreChatFontSize, closeChatImageLightbox, @@ -87,4 +90,5 @@ if (typeof window !== "undefined") { window.openChatImageLightbox = openChatImageLightbox; window.applyFontSize = applyFontSize; bindChatFontSizeControl(); + bindChatImageUploadControl(); } diff --git a/resources/js/chat-room/image-upload.js b/resources/js/chat-room/image-upload.js new file mode 100644 index 0000000..4f25860 --- /dev/null +++ b/resources/js/chat-room/image-upload.js @@ -0,0 +1,38 @@ +// 聊天室图片上传控件事件绑定,逐步替代 Blade 内联 onclick/onchange。 + +let imageUploadEventsBound = false; + +/** + * 绑定聊天图片选择按钮与文件框事件。 + * + * @returns {void} + */ +export function bindChatImageUploadControl() { + if (imageUploadEventsBound || typeof document === "undefined") { + return; + } + + imageUploadEventsBound = true; + document.addEventListener("click", (event) => { + if (!(event.target instanceof Element)) { + return; + } + + if (!event.target.closest("[data-chat-image-upload-trigger]")) { + return; + } + + event.preventDefault(); + document.getElementById("chat_image")?.click(); + }); + + document.addEventListener("change", (event) => { + if (!(event.target instanceof HTMLInputElement) || event.target.id !== "chat_image") { + return; + } + + if (typeof window.handleChatImageSelected === "function") { + window.handleChatImageSelected(event.target); + } + }); +} diff --git a/resources/views/chat/partials/layout/input-bar.blade.php b/resources/views/chat/partials/layout/input-bar.blade.php index 6d5754b..ac56258 100644 --- a/resources/views/chat/partials/layout/input-bar.blade.php +++ b/resources/views/chat/partials/layout/input-bar.blade.php @@ -111,9 +111,8 @@ $welcomeMessages = [ style="font-size: 11px; padding: 1px 6px; background: #2563eb; color: #fff; border: none; border-radius: 2px; cursor: pointer;">🎣 钓鱼 - -