迁移聊天室前端工具并优化消息渲染

2026-04-25 03:34:31 +08:00
parent e3cba255f9
commit f1d8d20180
12 changed files with 786 additions and 154 deletions
@@ -0,0 +1,54 @@
+// 聊天室图片预览层控制，迁出 Blade 内联脚本后仍通过 window 全局函数兼容现有 onclick。
+
+/**
+ * 打开聊天图片大图预览层。
+ *
+ * @param {string} imageUrl 图片地址
+ * @param {string} imageName 图片名称
+ * @returns {void}
+ */
+export function openChatImageLightbox(imageUrl, imageName = "聊天图片") {
+    const lightbox = document.getElementById("chat-image-lightbox");
+    const imageEl = document.getElementById("chat-image-lightbox-img");
+    const nameEl = document.getElementById("chat-image-lightbox-name");
+
+    if (!lightbox || !imageEl || !imageUrl) {
+        return;
+    }
+
+    imageEl.src = imageUrl;
+    imageEl.alt = imageName;
+
+    if (nameEl) {
+        nameEl.textContent = imageName;
+    }
+
+    lightbox.style.display = "block";
+    document.body.style.overflow = "hidden";
+}
+
+/**
+ * 关闭聊天图片大图预览层。
+ *
+ * @param {Event|null} event 点击事件
+ * @returns {void}
+ */
+export function closeChatImageLightbox(event = null) {
+    if (event && event.target !== event.currentTarget) {
+        return;
+    }
+
+    const lightbox = document.getElementById("chat-image-lightbox");
+    if (!lightbox) {
+        return;
+    }
+
+    lightbox.style.display = "none";
+
+    const imageEl = document.getElementById("chat-image-lightbox-img");
+    if (imageEl) {
+        imageEl.src = "";
+    }
+
+    document.body.style.overflow = "";
+}