迁移好友通知监听脚本
This commit is contained in:
@@ -1361,153 +1361,4 @@
|
||||
{{-- openRewardModal 已迁移到 resources/js/chat-room/reward-modal.js --}}
|
||||
|
||||
{{-- ═══════════ 好友系统通知监听 ═══════════ --}}
|
||||
{{-- 监听好友 WebSocket 事件，与好友操作逻辑集中在同一文件维护 --}}
|
||||
<script>
|
||||
// ── 好友系统私有频道监听（仅本人可见） ────────────────
|
||||
/**
|
||||
* 监听当前用户的私有频道 `user.{id}`，
|
||||
* 收到 FriendAdded / FriendRemoved 事件时用弹窗通知。
|
||||
* FriendAdded → 居中大卡弹窗（chatBanner 风格）
|
||||
* FriendRemoved → 右下角 Toast 通知
|
||||
*/
|
||||
function setupFriendNotification() {
|
||||
if (!window.Echo || !window.chatContext) {
|
||||
setTimeout(setupFriendNotification, 500);
|
||||
return;
|
||||
}
|
||||
const myId = window.chatContext.userId;
|
||||
window.Echo.private(`user.${myId}`)
|
||||
.listen('.FriendAdded', (e) => {
|
||||
showFriendBanner(e.from_username, e.has_added_back);
|
||||
})
|
||||
.listen('.FriendRemoved', (e) => {
|
||||
if (e.had_added_back) {
|
||||
window.chatToast.show({
|
||||
title: '好友通知',
|
||||
message: `<b>${e.from_username}</b> 已将你从好友列表移除。<br><span style="color:#6b7280; font-size:12px;">你的好友列表中仍保留对方，可点击同步移除。</span>`,
|
||||
icon: '👥',
|
||||
color: '#6b7280',
|
||||
duration: 10000,
|
||||
action: {
|
||||
label: `🗑️ 同步移除 ${e.from_username}`,
|
||||
onClick: async () => {
|
||||
const url = `/friend/${encodeURIComponent(e.from_username)}/remove`;
|
||||
const csrf = document.querySelector('meta[name="csrf-token"]')
|
||||
?.content ?? '';
|
||||
await fetch(url, {
|
||||
method: 'DELETE',
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
'X-CSRF-TOKEN': csrf,
|
||||
'Accept': 'application/json'
|
||||
},
|
||||
body: JSON.stringify({
|
||||
room_id: window.chatContext?.roomId
|
||||
}),
|
||||
});
|
||||
}
|
||||
},
|
||||
});
|
||||
} else {
|
||||
window.chatToast.show({
|
||||
title: '好友通知',
|
||||
message: `<b>${e.from_username}</b> 已将你从他的好友列表移除。`,
|
||||
icon: '👥',
|
||||
color: '#9ca3af',
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
document.addEventListener('DOMContentLoaded', setupFriendNotification);
|
||||
|
||||
// ── BannerNotification：通用大卡片通知监听 ──────────────────
|
||||
/**
|
||||
* 监听 BannerNotification 事件，渲染 chatBanner 大卡片。
|
||||
* 支持私有用户频道（单推）和房间频道（全员推送）。
|
||||
*
|
||||
* 安全说明：BannerNotification 仅由后端可信代码 broadcast，
|
||||
* 私有频道需鉴权，presence 频道需加入房间，均须服务端验证身份。
|
||||
*/
|
||||
function setupBannerNotification() {
|
||||
if (!window.Echo || !window.chatContext) {
|
||||
setTimeout(setupBannerNotification, 500);
|
||||
return;
|
||||
}
|
||||
const myId = window.chatContext.userId;
|
||||
const roomId = window.chatContext.roomId;
|
||||
|
||||
// 监听私有用户频道（单独推给某人）
|
||||
window.Echo.private(`user.${myId}`)
|
||||
.listen('.BannerNotification', (e) => {
|
||||
if (e.options && typeof e.options === 'object') {
|
||||
window.chatBanner.show(e.options);
|
||||
}
|
||||
});
|
||||
|
||||
// 监听房间频道（推给房间所有人）
|
||||
if (roomId) {
|
||||
window.Echo.join(`room.${roomId}`)
|
||||
.listen('.BannerNotification', (e) => {
|
||||
if (e.options && typeof e.options === 'object') {
|
||||
window.chatBanner.show(e.options);
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
document.addEventListener('DOMContentLoaded', setupBannerNotification);
|
||||
|
||||
/**
|
||||
* 显示好友添加居中大卡弹窗（使用 chatBanner 公共组件）。
|
||||
* 互相好友 → 绿色渐变 + 互为好友文案
|
||||
* 单向添加 → 蓝绿渐变 + 提示回加 + [➕ 回加好友] 按钮
|
||||
*
|
||||
* @param {string} fromUsername 添加者用户名
|
||||
* @param {boolean} hasAddedBack 接收方是否已将添加者加为好友
|
||||
*/
|
||||
function showFriendBanner(fromUsername, hasAddedBack) {
|
||||
if (hasAddedBack) {
|
||||
window.chatBanner.show({
|
||||
id: 'friend-banner',
|
||||
icon: '🎉💚🎉',
|
||||
title: '好友通知',
|
||||
name: fromUsername,
|
||||
body: '将你加为好友了！',
|
||||
sub: '<strong style="color:#a7f3d0;">你们现在互为好友 🎊</strong>',
|
||||
gradient: ['#065f46', '#059669', '#10b981'],
|
||||
titleColor: '#a7f3d0',
|
||||
autoClose: 5000,
|
||||
});
|
||||
} else {
|
||||
window.chatBanner.show({
|
||||
id: 'friend-banner',
|
||||
icon: '💚📩',
|
||||
title: '好友申请',
|
||||
name: fromUsername,
|
||||
body: '将你加为好友了！',
|
||||
sub: '但你还没有回加对方为好友',
|
||||
gradient: ['#1e3a5f', '#1d4ed8', '#0891b2'],
|
||||
titleColor: '#bae6fd',
|
||||
autoClose: 0,
|
||||
buttons: [{
|
||||
label: '➕ 回加好友',
|
||||
color: '#10b981',
|
||||
onClick: async (btn, close) => {
|
||||
await window.quickFriendAction?.('add', fromUsername, btn);
|
||||
if (btn.textContent.startsWith('✅')) {
|
||||
setTimeout(close, 1500);
|
||||
}
|
||||
},
|
||||
},
|
||||
{
|
||||
label: '稍后再说',
|
||||
color: 'rgba(255,255,255,0.15)',
|
||||
onClick: (btn, close) => close(),
|
||||
},
|
||||
],
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
</script>
|
||||
{{-- 好友通知与 BannerNotification 监听已迁移到 resources/js/chat-room/friend-notifications.js --}}
|
||||
|
||||
Reference in New Issue
Block a user