Files
chatroom/resources/js/chat-room/toolbar.js
T
pllx f17f171f4b fix: 修复迁移遗留的按钮无响应、头像框层级及构建错误
迁移收尾修复:
- heartbeat.js: 移除 export { } 中重复的 startHeartbeat/stopHeartbeat(已通过 export function 导出)
- scripts.blade.php: 移除 JS 注释中的 {{ }} 避免 Blade 编译为 e() 导致 PHP 解析错误
- preferences-status.js: 补全 6 个缺失的 window.* 赋值(toggleBlockMenu/toggleFeatureMenu 等),
  实现迁移中丢失的 updateDailyStatus/clearDailyStatus,修复 handleFeatureLocalClear 清屏回调
- toolbar.js: 补全 window.runFeatureShortcut 赋值

头像框样式修复(chat-decorations.css):
- z-index 互换:头像降至 1,框升至 3,使框边缘可遮挡头像外围
- 使用 CSS mask(radial-gradient)挖环形替代旧 ::before 实心圆遮挡方案
- clip-path: circle(50%) 硬裁剪确保圆形,不受 chat.css border-radius: 2px 覆盖
- 特异性提升至 .user-item .avatar-frame-wrapper .user-head

新 Vite 模块(从 Blade 迁移):
- chat-state.js / message-renderer.js / user-list.js / chat-events.js
- composer.js(重写)/ heartbeat.js / admin-commands.js
- vip-presence.js / chat-decorations.css
2026-04-27 09:19:49 +00:00

104 lines
2.9 KiB
JavaScript

// 聊天室竖向工具条事件绑定,替代顶部工具按钮内联 onclick。
let toolbarEventsBound = false;
/**
* 执行竖向工具条动作。
*
* @param {string} action 工具条动作
* @returns {void}
*/
export function runToolbarAction(action) {
// 工具条只做入口分发,具体业务仍由原有全局函数负责。
const actions = {
shop: () => window.openShopModal?.(),
vip: () => window.openVipModal?.(),
"save-exp": () => window.saveExp?.(),
game: () => window.openGameHall?.(),
earn: () => window.dispatchEvent(new CustomEvent("open-earn-panel")),
bank: () => window.openBankModal?.(),
marriage: () => window.openMarriageStatusModal?.(),
friend: () => window.openFriendPanel?.(),
avatar: () => window.openAvatarPicker?.(),
settings: () => window.openSettingsModal?.(),
};
actions[action]?.();
}
/**
* 执行功能菜单快捷入口,并在打开目标面板前关闭功能菜单。
*
* @param {string} action 快捷入口动作
* @returns {void}
*/
export function runFeatureShortcut(action) {
// 功能菜单和竖向工具条共享同一组业务入口,只额外关闭菜单浮层。
window.closeFeatureMenu?.();
runToolbarAction(action);
}
/**
* 确认并执行离开聊天室动作。
*
* @returns {void}
*/
function confirmToolbarLeaveRoom() {
// 离开房间保留二次确认,避免误点竖向工具条直接退出。
window.chatDialog
?.confirm("确定要离开聊天室吗?", "离开聊天室")
.then((ok) => {
if (ok) {
window.leaveRoom?.();
}
});
}
/**
* 绑定竖向工具条按钮事件。
*
* @returns {void}
*/
// ── 挂载到 window ──
window.runFeatureShortcut = runFeatureShortcut;
export function bindToolbarControls() {
if (toolbarEventsBound || typeof document === "undefined") {
return;
}
toolbarEventsBound = true;
document.addEventListener("click", (event) => {
if (!(event.target instanceof Element)) {
return;
}
const actionButton = event.target.closest("[data-toolbar-action]");
if (actionButton) {
event.preventDefault();
const action = actionButton.getAttribute("data-toolbar-action") || "";
if (action === "leave") {
confirmToolbarLeaveRoom();
return;
}
runToolbarAction(action);
return;
}
const urlButton = event.target.closest("[data-toolbar-url]");
if (!urlButton) {
return;
}
event.preventDefault();
// 后端路由保留在 Blade data 属性中,Vite 模块不硬编码 Laravel URL。
const url = urlButton.getAttribute("data-toolbar-url");
if (url) {
window.open(url, "_blank");
}
});
}