迁移婚姻通知弹窗组件

2026-04-25 19:18:21 +08:00
parent 5b6f687db6
commit be0052119f
3 changed files with 199 additions and 156 deletions
@@ -201,6 +201,176 @@ export function marriageProposeModal() {
    };
 }

+/**
+ * 创建收到求婚弹窗 Alpine 数据，处理同意和拒绝求婚。
+ *
+ * @returns {Record<string, any>}
+ */
+export function marriageIncomingModal() {
+    return {
+        show: false,
+        proposerName: "",
+        marriageId: null,
+        ringName: "",
+        ringIcon: "💍",
+        expiresAt: "",
+        acting: false,
+
+        open(detail) {
+            this.proposerName = detail.proposer_name || detail.proposer?.username || "";
+            this.marriageId = detail.marriage_id;
+            this.ringName = detail.ring_name || "";
+            this.ringIcon = detail.ring_icon || "💍";
+            this.expiresAt = detail.expires_at || "";
+            this.show = true;
+        },
+
+        close() {
+            this.show = false;
+        },
+
+        async doAccept() {
+            if (this.acting) {
+                return;
+            }
+
+            this.acting = true;
+
+            try {
+                const response = await fetch(window.chatContext.marriage.acceptUrl(this.marriageId), {
+                    method: "POST",
+                    headers: {
+                        "Content-Type": "application/json",
+                        Accept: "application/json",
+                        "X-CSRF-TOKEN": document.querySelector("meta[name=csrf-token]").content,
+                    },
+                    body: JSON.stringify({
+                        room_id: window.chatContext.roomId,
+                    }),
+                });
+                const data = await response.json();
+
+                this.close();
+
+                if (data.status !== "success") {
+                    window.chatDialog?.alert(data.message || "操作失败", "提示", "#cc4444");
+                }
+            } catch {
+                window.chatDialog?.alert("网络异常", "错误", "#cc4444");
+            }
+
+            this.acting = false;
+        },
+
+        async doReject() {
+            if (this.acting) {
+                return;
+            }
+
+            this.acting = true;
+
+            try {
+                const response = await fetch(window.chatContext.marriage.rejectUrl(this.marriageId), {
+                    method: "POST",
+                    headers: {
+                        "Content-Type": "application/json",
+                        Accept: "application/json",
+                        "X-CSRF-TOKEN": document.querySelector("meta[name=csrf-token]").content,
+                    },
+                    body: JSON.stringify({
+                        room_id: window.chatContext.roomId,
+                    }),
+                });
+                const data = await response.json();
+
+                this.close();
+
+                if (data.status !== "success") {
+                    window.chatDialog?.alert(data.message || "操作失败", "提示", "#cc4444");
+                } else {
+                    window.chatDialog?.alert("已婉拒对方的求婚", "操作完成", "#6b7280");
+                }
+            } catch {
+                window.chatDialog?.alert("网络异常", "错误", "#cc4444");
+            }
+
+            this.acting = false;
+        },
+    };
+}
+
+/**
+ * 创建结婚成功公告弹窗 Alpine 数据，并触发婚礼礼花特效。
+ *
+ * @returns {Record<string, any>}
+ */
+export function marriageAcceptedModal() {
+    return {
+        show: false,
+        announcement: "",
+        subText: "",
+        marriageId: null,
+        isNewlywed: false,
+
+        open(detail) {
+            this.marriageId = detail.marriage_id;
+            const groomName = detail.user?.username ?? detail.groom_name ?? "??";
+            const brideName = detail.partner?.username ?? detail.bride_name ?? "??";
+
+            this.announcement = `${groomName} 与 ${brideName} 喜结连理！`;
+            this.subText = detail.message || "愿百年好合，白头偕老！";
+
+            // 只有新婚双方本人可以继续打开婚礼设置弹窗。
+            const currentUsername = window.chatContext.username;
+            this.isNewlywed = groomName === currentUsername || brideName === currentUsername;
+            this.show = true;
+
+            window.EffectManager?.play("wedding-fireworks");
+        },
+
+        close() {
+            this.show = false;
+        },
+
+        openWeddingSetup() {
+            window.openWeddingSetupModal?.(this.marriageId);
+        },
+    };
+}
+
+/**
+ * 创建离婚公告弹窗 Alpine 数据，并播放雷雨组合特效。
+ *
+ * @returns {Record<string, any>}
+ */
+export function marriageDivorcedModal() {
+    return {
+        show: false,
+        announcement: "",
+        subText: "",
+
+        open(detail) {
+            const userName = detail.user_username ?? detail.user?.username ?? "??";
+            const partnerName = detail.partner_username ?? detail.partner?.username ?? "??";
+
+            this.announcement = `${userName} 与 ${partnerName} 已解除婚姻关系`;
+            this.subText = detail.message || "往昔已矣，各自珍重。";
+            this.show = true;
+
+            window.EffectManager?.play("lightning");
+
+            // 雷电结束前后再叠加雨效，保留原本的离婚公告氛围。
+            setTimeout(() => {
+                window.EffectManager?.play("rain");
+            }, 3500);
+        },
+
+        close() {
+            this.show = false;
+        },
+    };
+}
+
 /**
 * 读取 Alpine 组件数据，避免直接访问 Alpine 私有字段。
 *
@@ -401,6 +571,9 @@ function bindMarriageModalBootstrap() {
 */
 export function bindMarriageModalControls() {
    window.appendSystemMessage = appendSystemMessage;
+    window.marriageAcceptedModal = marriageAcceptedModal;
+    window.marriageDivorcedModal = marriageDivorcedModal;
+    window.marriageIncomingModal = marriageIncomingModal;
    window.marriageProposeModal = marriageProposeModal;
    window.openProposeModal = openProposeModal;
    window.openWeddingSetupModal = openWeddingSetupModal;