lkddi/chatroom
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 4 Wiki Activity

迁移婚姻状态脚本

Browse Source
This commit is contained in:
流星
2026-04-25 15:00:04 +08:00
parent b622053bc2
commit 3bbde9b4dd
3 changed files with 613 additions and 373 deletions
Download Patch File Download Diff File Expand all files Collapse all files
resources/views/chat/partials/layout/toolbar.blade.php
+1 -333
View File
@@ -959,339 +959,7 @@
</div>
</div>
<script>
/**
* 婚姻状态弹窗——工具栏点击「婚姻」按钮触发。
* 调用 /marriage/status 接口，展示当前用户婚姻状态（单身/求婚中/已婚）。
*/
(function() {
const CSRF = () => document.querySelector('meta[name="csrf-token"]')?.content ?? '';
const $ = id => document.getElementById(id);
window.marriedListPage = 1;
/** 打开弹窗并拉取状态 */
window.openMarriageStatusModal = function() {
$('marriage-status-modal').style.display = 'flex';
switchMarriageTab('mine');
};
/** 切换 Tab */
window.switchMarriageTab = function(tabName) {
$('marriage-tabbtn-mine').classList.toggle('active', tabName === 'mine');
$('marriage-tabbtn-list').classList.toggle('active', tabName === 'list');
$('marriage-view-mine').style.display = tabName === 'mine' ? 'flex' : 'none';
$('marriage-view-list').style.display = tabName === 'list' ? 'flex' : 'none';
if (tabName === 'mine') {
fetchMyMarriageStatus();
} else {
fetchMarriedList(1);
}
};
async function fetchMyMarriageStatus() {
$('marriage-status-body').innerHTML =
'<div style="text-align:center;color:#aaa;padding:30px 0;font-size:12px;">加载中…</div>';
$('marriage-status-footer').innerHTML = '';
try {
const res = await fetch('/marriage/status', {
headers: { Accept: 'application/json' }
});
const data = await res.json();
renderMarriageStatus(data);
} catch (e) {
$('marriage-status-body').innerHTML =
'<div style="text-align:center;color:#e55;padding:30px 0;font-size:12px;">❌ 加载失败，请稍后重试</div>';
}
}
window.fetchMarriedList = async function(page) {
if (page < 1) return;
const container = $('married-list-container');
container.innerHTML = '<div style="text-align:center;color:#aaa;padding:30px 0;font-size:12px;">加载中…</div>';
try {
const res = await fetch(`/marriage/list?page=${page}`, {
headers: { Accept: 'application/json' }
});
const json = await res.json();
if (json.status === 'success') {
marriedListPage = json.pagination.current_page;
renderMarriedList(json.data, json.pagination);
}
} catch (e) {
container.innerHTML = '<div style="text-align:center;color:#e55;padding:30px 0;font-size:12px;">❌ 加载失败</div>';
}
};
function renderMarriedList(data, pagination) {
const container = $('married-list-container');
if (!data || data.length === 0) {
container.innerHTML = '<div style="text-align:center;color:#aaa;padding:40px 0;font-size:12px;">💖 暂无婚姻记录，快去寻找你的另一半吧</div>';
$('married-list-pagination').style.display = 'none';
return;
}
$('married-list-pagination').style.display = 'flex';
$('married-page-info').textContent = `${pagination.current_page} / ${pagination.last_page}`;
$('married-prev-btn').disabled = pagination.current_page <= 1;
$('married-prev-btn').style.opacity = pagination.current_page <= 1 ? 0.5 : 1;
$('married-next-btn').disabled = pagination.current_page >= pagination.last_page;
$('married-next-btn').style.opacity = pagination.current_page >= pagination.last_page ? 0.5 : 1;
container.innerHTML = data.map(m => {
const user = m.user;
const partner = m.partner;
const ring = m.ring_item;
const date = m.married_at ? m.married_at.substring(0, 10) : '—';
const userColor = (user && user.sex == 2) ? 'color:#e91e8c;' : '';
const partnerColor = (partner && partner.sex == 2) ? 'color:#e91e8c;' : '';
return `
<div class="married-list-item">
<div class="married-couple-info">
<div class="married-user-box" style="cursor:pointer;" data-marriage-user-card="${user.username}">
<img src="${user.headface_url || '/images/headface/1.gif'}" class="married-user-avatar" onerror="this.src='/images/headface/1.gif'">
<span class="married-user-name" style="${userColor}" title="${user.username}">${user.username}</span>
</div>
<div class="married-heart">💖</div>
<div class="married-user-box" style="cursor:pointer;" data-marriage-user-card="${partner.username}">
<img src="${partner.headface_url || '/images/headface/1.gif'}" class="married-user-avatar" onerror="this.src='/images/headface/1.gif'">
<span class="married-user-name" style="${partnerColor}" title="${partner.username}">${partner.username}</span>
</div>
</div>
<div class="married-meta-info">
<span>💍 ${ring ? ring.name : '无戒指'}</span>
<span>💞 <span class="married-intimacy">${Number(m.intimacy).toLocaleString()}</span></span>
<span>📅 ${date}</span>
</div>
</div>
`;
}).join('');
}
/** 关闭弹窗 */
window.closeMarriageStatusModal = function() {
$('marriage-status-modal').style.display = 'none';
};
// 点击遮罩关闭
$('marriage-status-modal').addEventListener('click', function(e) {
if (e.target === this) closeMarriageStatusModal();
});
/**
* 根据接口返回数据渲染弹窗内容。
*
* @param {object} data `/marriage/status` 响应 JSON
*/
function renderMarriageStatus(data) {
const body = $('marriage-status-body');
const footer = $('marriage-status-footer');
// ── 单身 ────────────────────────────────────
if (!data.status || data.status === 'none' || !data.marriage) {
body.innerHTML = `
<div style="text-align:center; padding:16px 0;">
<div style="font-size:40px; margin-bottom:10px;">🕊️</div>
<div style="font-size:14px; font-weight:bold; color:#555;">目前单身</div>
<div style="font-size:11px; color:#999; margin-top:6px; line-height:1.7;">
还没有婚姻记录。<br>可在用户名片上点击「求婚」发起求婚。
</div>
</div>`;
footer.innerHTML = `
<button data-marriage-modal-close
style="flex:1; padding:9px; background:#f3f4f6; color:#555;
border:1px solid #d1d5db; border-radius:6px; font-size:13px; cursor:pointer;">
关闭
</button>`;
return;
}
const m = data.marriage;
const isMine = (m.user && m.user.username === window.__chatUser?.username) ||
window.__chatUser?.id === m.user?.id ||
window.__chatUser?.id === m.partner?.id;
// 确定"另一方"信息（我可能是 user 也可能是 partner）
const me = window.__chatUser;
const other = (m.user?.id === me?.id) ? m.partner : m.user;
const iAmUser = (m.user?.id === me?.id);
// ── 求婚中 ──────────────────────────────────
if (data.status === 'pending') {
const iProposed = iAmUser; // user_id 是发起方
const expireAt = m.expires_at ? new Date(m.expires_at).toLocaleString('zh-CN', {
hour12: false
}) : '—';
const ringHtml = m.ring ?
`<span style="font-size:13px;">${m.ring.icon ?? '💍'} ${m.ring.name}</span>` : '';
body.innerHTML = `
<div style="text-align:center; padding:8px 0;">
<div style="font-size:36px; margin-bottom:8px;">💌</div>
<div style="font-size:14px; font-weight:bold; color:#be185d;">
${iProposed ? '你向 ' + (other?.username ?? '—') + ' 发出了求婚' : (other?.username ?? '—') + ' 向你求婚啦！'}
</div>
${ringHtml ? `<div style="margin:8px 0; font-size:12px; color:#666;">戒指：${ringHtml}</div>` : ''}
<div style="font-size:11px; color:#999; margin-top:6px;">
过期时间：${expireAt}
</div>
</div>`;
if (!iProposed) {
// 被求婚方：可以接受 / 拒绝
footer.innerHTML = `
<button data-marriage-action="reject" data-marriage-id="${m.id}" data-marriage-close-after-action="1"
style="flex:1;padding:9px;background:#f3f4f6;color:#555;
border:1px solid #d1d5db;border-radius:6px;font-size:13px;cursor:pointer;">
😢 婉拒
</button>
<button data-marriage-action="accept" data-marriage-id="${m.id}" data-marriage-close-after-action="1"
style="flex:1;padding:9px;background:linear-gradient(135deg,#be185d,#f43f5e);
color:#fff;border:none;border-radius:6px;font-size:13px;
font-weight:bold;cursor:pointer;">
💑 答应啦！
</button>`;
} else {
footer.innerHTML = `
<button data-marriage-modal-close
style="flex:1;padding:9px;background:#f3f4f6;color:#555;
border:1px solid #d1d5db;border-radius:6px;font-size:13px;cursor:pointer;">
关闭（等待对方回应）
</button>`;
}
return;
}
// ── 已婚 ────────────────────────────────────
if (data.status === 'married') {
const levelIcon = m.level_icon ?? '💑';
const levelName = m.level_name ?? '新婚';
const days = m.days ?? 0;
const intimacy = m.intimacy ?? 0;
const marriedAt = m.married_at ?? '—';
const ringHtml = m.ring ? `${m.ring.icon ?? '💍'} ${m.ring.name}` : '无';
body.innerHTML = `
<div style="text-align:center; margin-bottom:12px;">
<div style="font-size:36px; margin-bottom:6px;">${levelIcon}</div>
<div style="font-size:14px; font-weight:bold; color:#be185d;">
已与 <strong>${other?.username ?? '—'}</strong> 成婚 🎉
</div>
<div style="font-size:12px; color:#999; margin-top:4px;">婚姻等级：${levelName}</div>
</div>
<div style="display:grid; grid-template-columns:1fr 1fr; gap:8px; font-size:12px;">
<div style="background:#fdf2f8;border:1px solid #fbcfe8;border-radius:6px;padding:10px;text-align:center;">
<div style="color:#be185d;font-weight:bold;font-size:18px;">${days}</div>
<div style="color:#888;margin-top:2px;">携手天数</div>
</div>
<div style="background:#fdf4ff;border:1px solid #e9d5ff;border-radius:6px;padding:10px;text-align:center;">
<div style="color:#7c3aed;font-weight:bold;font-size:18px;">${Number(intimacy).toLocaleString()}</div>
<div style="color:#888;margin-top:2px;">亲密度</div>
</div>
<div style="background:#f0fdf4;border:1px solid #bbf7d0;border-radius:6px;padding:8px 10px;grid-column:1/-1;">
<span style="color:#666;">💍 戒指：</span><span style="color:#333;">${ringHtml}</span>
&nbsp;｜&nbsp;
<span style="color:#666;">📅 婚期：</span><span style="color:#333;">${marriedAt}</span>
</div>
</div>`;
// 已婚底部：离婚入口（需要二次确认）
footer.innerHTML = `
<button data-marriage-modal-close
style="flex:1;padding:9px;background:#f3f4f6;color:#555;
border:1px solid #d1d5db;border-radius:6px;font-size:13px;cursor:pointer;">
关闭
</button>
<button data-marriage-divorce="${m.id}"
style="flex:.8;padding:9px;border:1px solid #fca5a5;background:#fff;
color:#dc2626;border-radius:6px;font-size:12px;cursor:pointer;">
💔 申请离婚
</button>`;
return;
}
// 其他状态（divorced 等）
body.innerHTML =
`<div style="text-align:center;color:#999;padding:30px 0;font-size:12px;">暂无有效婚姻记录</div>`;
footer.innerHTML = `
<button data-marriage-modal-close
style="flex:1;padding:9px;background:#f3f4f6;color:#555;
border:1px solid #d1d5db;border-radius:6px;font-size:13px;cursor:pointer;">关闭</button>`;
}
/**
* 通用婚姻操作（接受 / 拒绝求婚）
*
* @param {string|number} marriageId marriage 记录 ID
* @param {string} action 'accept' | 'reject'
*/
window.marriageAction = async function(marriageId, action) {
try {
const res = await fetch(`/marriage/${marriageId}/${action}`, {
method: 'POST',
headers: {
'X-CSRF-TOKEN': CSRF(),
'Content-Type': 'application/json',
Accept: 'application/json',
},
});
const data = await res.json();
if (data.ok) {
window.chatDialog?.alert(data.message || (action === 'accept' ? '已接受求婚！' : '已婉拒求婚'),
action === 'accept' ? '💑 恭喜！' : '提示', action === 'accept' ? '#be185d' :
'#6b7280');
} else {
window.chatDialog?.alert(data.message || '操作失败', '提示', '#f59e0b');
}
} catch {
window.chatDialog?.alert('网络异常，请稍后重试', '错误', '#ef4444');
}
};
/**
* 申请离婚（先弹确认框，再调接口）
*
* @param {string|number} marriageId marriage 记录 ID
*/
window.tryDivorce = async function(marriageId) {
closeMarriageStatusModal();
const confirmed = await window.chatDialog?.confirm(
'申请协议离婚后，对方有权同意或拒绝（拒绝即转为强制离婚，双方均扣除魅力值）。\n\n确定要申请吗？',
'💔 申请离婚',
'#dc2626',
);
if (!confirmed) {
return;
}
try {
const res = await fetch(`/marriage/${marriageId}/divorce`, {
method: 'POST',
headers: {
'X-CSRF-TOKEN': CSRF(),
'Content-Type': 'application/json',
Accept: 'application/json',
},
body: JSON.stringify({
type: 'mutual'
}),
});
const data = await res.json();
window.chatDialog?.alert(data.message || '申请已发送', '提示', data.ok ? '#10b981' : '#f59e0b');
} catch {
window.chatDialog?.alert('网络异常，请稍后重试', '错误', '#ef4444');
}
};
})();
</script>
{{-- 婚姻状态弹窗业务脚本已迁移到 resources/js/chat-room/marriage-status.js --}}
{{-- ═══════════ 银行弹窗 ═══════════ --}}
<style>