Fix invite stuff

2026-04-18 22:33:50 +02:00 · 2025-05-26 04:53:17 +10:00
parent 2f019ac038
commit 8b93bf5d57
15 changed files with 136 additions and 147 deletions
--- a/src/app.js
+++ b/src/app.js
@@ -359,7 +359,10 @@ console.log(`isLinux: ${LINUX}`);
                showGallerySelectDialog: this.showGallerySelectDialog,
                showGalleryDialog: this.showGalleryDialog,
                getImageUrlFromImageId: this.getImageUrlFromImageId,
-                getAvatarGallery: this.getAvatarGallery
+                getAvatarGallery: this.getAvatarGallery,
+                inviteImageUpload: this.inviteImageUpload,
+                clearInviteImageUpload: this.clearInviteImageUpload,
+                isLinux: this.isLinux
            };
        },
        el: '#root',
--- a/src/components/dialogs/InviteDialog/EditAndSendInviteDialog.vue
+++ b/src/components/dialogs/InviteDialog/EditAndSendInviteDialog.vue
@@ -42,6 +42,7 @@
    const $message = instance.proxy.$message;

    const API = inject('API');
+    const clearInviteImageUpload = inject('clearInviteImageUpload');

    const props = defineProps({
        editAndSendInviteDialog: {
@@ -181,7 +182,7 @@
                notificationRequest
                    .sendRequestInvitePhoto(I.params, I.userId)
                    .catch((err) => {
-                        this.clearInviteImageUpload();
+                        clearInviteImageUpload();
                        throw err;
                    })
                    .then((args) => {
--- a/src/components/dialogs/InviteDialog/InviteDialog.vue
+++ b/src/components/dialogs/InviteDialog/InviteDialog.vue
@@ -160,7 +160,7 @@
            :send-invite-dialog="sendInviteDialog"
            :invite-dialog="inviteDialog"
            :upload-image="uploadImage"
-            @close-invite-dialog="closeInviteDialog" />
+            @closeInviteDialog="closeInviteDialog" />
    </safe-dialog>
 </template>

@@ -180,6 +180,7 @@
    const userStatusClass = inject('userStatusClass');
    const userImage = inject('userImage');
    const API = inject('API');
+    const clearInviteImageUpload = inject('clearInviteImageUpload');

    const props = defineProps({
        inviteDialog: {
@@ -209,10 +210,14 @@
        }
    });

-    const emit = defineEmits(['clearInviteImageUpload', 'inviteImageUpload', 'closeInviteDialog']);
+    const emit = defineEmits(['closeInviteDialog']);

    const sendInviteDialogVisible = ref(false);
-    const sendInviteDialog = ref({ message: '', messageSlot: 0, userId: '', messageType: '', params: {} });
+    const sendInviteDialog = ref({
+        messageSlot: {},
+        userId: '',
+        params: {}
+    });

    function closeInviteDialog() {
        emit('closeInviteDialog');
@@ -222,17 +227,13 @@
        sendInviteDialog.value = {
            params,
            userId,
-            messageType: 'invite'
+            messageSlot: {}
        };
        inviteMessagesRequest.refreshInviteMessageTableData('message');
        clearInviteImageUpload();
        sendInviteDialogVisible.value = true;
    }

-    function clearInviteImageUpload() {
-        emit('clearInviteImageUpload');
-    }
-
    function addSelfToInvite() {
        const D = props.inviteDialog;
        if (!D.userIds.includes(API.currentUser.id)) {
--- a/src/components/dialogs/InviteDialog/SendInviteConfirmDialog.vue
+++ b/src/components/dialogs/InviteDialog/SendInviteConfirmDialog.vue
@@ -33,6 +33,7 @@
    const $message = instance.proxy.$message;

    const API = inject('API');
+    const clearInviteImageUpload = inject('clearInviteImageUpload');

    const props = defineProps({
        visible: {
@@ -62,6 +63,8 @@
    function sendInviteConfirm() {
        const D = props.sendInviteDialog;
        const J = props.inviteDialog;
+        const messageType = D.messageSlot.messageType;
+        const slot = D.messageSlot.slot;
        if (J?.visible) {
            const inviteLoop = () => {
                if (J.userIds.length > 0) {
@@ -82,7 +85,7 @@
                                    instanceId: J.worldId,
                                    worldId: J.worldId,
                                    worldName: J.worldName,
-                                    messageSlot: D.messageSlot
+                                    messageSlot: slot
                                },
                                receiverUserId
                            )
@@ -94,7 +97,7 @@
                                    instanceId: J.worldId,
                                    worldId: J.worldId,
                                    worldName: J.worldName,
-                                    messageSlot: D.messageSlot
+                                    messageSlot: slot
                                },
                                receiverUserId
                            )
@@ -110,8 +113,8 @@
                }
            };
            inviteLoop();
-        } else if (D.messageType === 'invite') {
-            D.params.messageSlot = D.messageSlot;
+        } else if (messageType === 'invite') {
+            D.params.messageSlot = slot;
            if (props.uploadImage) {
                notificationRequest
                    .sendInvitePhoto(D.params, D.userId)
@@ -139,13 +142,13 @@
                        return args;
                    });
            }
-        } else if (D.messageType === 'requestInvite') {
-            D.params.requestSlot = D.messageSlot;
+        } else if (messageType === 'request') {
+            D.params.requestSlot = slot;
            if (props.uploadImage) {
                notificationRequest
                    .sendRequestInvitePhoto(D.params, D.userId)
                    .catch((err) => {
-                        this.clearInviteImageUpload();
+                        clearInviteImageUpload();
                        throw err;
                    })
                    .then((args) => {
--- a/src/components/dialogs/InviteDialog/SendInviteDialog.vue
+++ b/src/components/dialogs/InviteDialog/SendInviteDialog.vue
@@ -1,7 +1,7 @@
 <template>
    <safe-dialog
        class="x-dialog"
-        :visible.sync="sendInviteDialogVisible"
+        :visible="sendInviteDialogVisible"
        :title="t('dialog.invite_message.header')"
        width="800px"
        append-to-body
@@ -61,7 +61,7 @@
                        type="text"
                        icon="el-icon-edit"
                        size="mini"
-                        @click.stop="showEditAndSendInviteDialog('message', scope.row)"></el-button>
+                        @click.stop="showEditAndSendInviteDialog(scope.row)"></el-button>
                </template>
            </el-table-column>
        </data-tables>
@@ -98,6 +98,7 @@
    const { t } = useI18n();

    const API = inject('API');
+    const inviteImageUpload = inject('inviteImageUpload');

    const props = defineProps({
        sendInviteDialogVisible: {
@@ -123,34 +124,25 @@
        }
    });

-    const emit = defineEmits(['inviteImageUpload', 'update:sendInviteDialogVisible', 'closeInviteDialog']);
+    const emit = defineEmits(['closeInviteDialog', 'update:sendInviteDialogVisible']);

    const isSendInviteConfirmDialogVisible = ref(false);

    const editAndSendInviteDialog = ref({
        visible: false,
-        messageType: '',
-        newMessage: '',
-        inviteMessage: {}
+        newMessage: ''
    });

-    function inviteImageUpload(event) {
-        emit('inviteImageUpload', event);
-    }
-
-    function showSendInviteConfirmDialog(val) {
+    function showSendInviteConfirmDialog(row) {
+        props.sendInviteDialog.messageSlot = row;
        isSendInviteConfirmDialogVisible.value = true;
-        //
-        props.sendInviteDialog.messageSlot = val.slot;
    }

-    function showEditAndSendInviteDialog(messageType, inviteMessage) {
-        // todo
+    function showEditAndSendInviteDialog(row) {
+        props.sendInviteDialog.messageSlot = row;
        editAndSendInviteDialog.value = {
            newMessage: inviteMessage.message,
-            visible: true,
-            messageType,
-            inviteMessage
+            visible: true
        };
    }

--- a/src/components/dialogs/LaunchDialog.vue
+++ b/src/components/dialogs/LaunchDialog.vue
@@ -84,7 +84,7 @@
            :active-friends="activeFriends"
            :invite-message-table="inviteMessageTable"
            :upload-image="uploadImage"
-            @close-invite-dialog="closeInviteDialog" />
+            @closeInviteDialog="closeInviteDialog" />
    </safe-dialog>
 </template>

--- a/src/components/dialogs/NewInstanceDialog.vue
+++ b/src/components/dialogs/NewInstanceDialog.vue
@@ -490,7 +490,7 @@
            :active-friends="activeFriends"
            :invite-message-table="inviteMessageTable"
            :upload-image="uploadImage"
-            @close-invite-dialog="closeInviteDialog" />
+            @closeInviteDialog="closeInviteDialog" />
    </safe-dialog>
 </template>

--- a/src/components/dialogs/UserDialog/SendInviteRequestDialog.vue
+++ b/src/components/dialogs/UserDialog/SendInviteRequestDialog.vue
@@ -36,7 +36,7 @@
                        type="text"
                        icon="el-icon-edit"
                        size="mini"
-                        @click.stop="showEditAndSendInviteDialog('request', scope.row)"></el-button>
+                        @click.stop="showEditAndSendInviteDialog(scope.row)"></el-button>
                </template>
            </el-table-column>
        </data-tables>
@@ -73,6 +73,7 @@
    const { t } = useI18n();

    const API = inject('API');
+    const inviteImageUpload = inject('inviteImageUpload');

    const props = defineProps({
        sendInviteRequestDialogVisible: {
@@ -98,33 +99,25 @@
        }
    });

-    const emit = defineEmits(['inviteImageUpload', 'update:sendInviteRequestDialogVisible', 'closeInviteDialog']);
+    const emit = defineEmits(['update:sendInviteRequestDialogVisible', 'closeInviteDialog']);

    const isSendInviteConfirmDialogVisible = ref(false);

    const editAndSendInviteDialog = ref({
        visible: false,
-        messageType: '',
-        newMessage: '',
-        inviteMessage: {}
+        newMessage: ''
    });

-    function inviteImageUpload(event) {
-        emit('inviteImageUpload', event);
-    }
-
-    function showSendInviteConfirmDialog(val) {
+    function showSendInviteConfirmDialog(row) {
+        props.sendInviteDialog.messageSlot = row;
        isSendInviteConfirmDialogVisible.value = true;
-        //
-        props.sendInviteDialog.messageSlot = val.slot;
    }

-    function showEditAndSendInviteDialog(messageType, inviteMessage) {
+    function showEditAndSendInviteDialog(row) {
+        props.sendInviteDialog.messageSlot = row;
        editAndSendInviteDialog.value = {
-            newMessage: inviteMessage.message,
-            visible: true,
-            messageType,
-            inviteMessage
+            newMessage: row.message,
+            visible: true
        };
    }

--- a/src/components/dialogs/UserDialog/UserDialog.vue
+++ b/src/components/dialogs/UserDialog/UserDialog.vue
@@ -553,7 +553,7 @@
                                <template v-if="isRealInstance(userDialog.$location.tag)">
                                    <launch
                                        :location="userDialog.$location.tag"
-                                        @show-launch-dialog="showLaunchDialog"></launch>
+                                        @show-launch-dialog="showLaunchDialog" />
                                    <el-tooltip
                                        placement="top"
                                        :content="t('dialog.user.info.self_invite_tooltip')"
@@ -1755,13 +1755,14 @@
            :send-invite-dialog-visible.sync="sendInviteDialogVisible"
            :invite-message-table="inviteMessageTable"
            :send-invite-dialog="sendInviteDialog"
-            :upload-image="uploadImage" />
+            :upload-image="uploadImage"
+            @closeInviteDialog="closeInviteDialog" />
        <SendInviteRequestDialog
            :send-invite-request-dialog-visible.sync="sendInviteRequestDialogVisible"
            :invite-request-message-table="inviteRequestMessageTable"
            :send-invite-dialog="sendInviteDialog"
            :upload-image="uploadImage"
-            @inviteImageUpload="inviteImageUpload" />
+            @closeInviteDialog="closeInviteDialog" />
        <PreviousInstancesUserDialog
            :previous-instances-user-dialog.sync="previousInstancesUserDialog"
            :shift-held="shiftHeld" />
@@ -1848,6 +1849,7 @@

    const API = inject('API');
    const showFullscreenImageDialog = inject('showFullscreenImageDialog');
+    const clearInviteImageUpload = inject('clearInviteImageUpload');

    const userImage = inject('userImage');
    const showLaunchDialog = inject('showLaunchDialog');
@@ -2032,7 +2034,6 @@
        'saveUserMemo',
        'setGroupVisibility',
        'leaveGroupPrompt',
-        'clearInviteImageUpload',
        'refreshGalleryTable',
        'refreshVRCPlusIconsTable',
        'refreshStickerTable',
@@ -2075,7 +2076,11 @@
    const favoriteWorldsRef = ref(null);

    const sendInviteDialogVisible = ref(false);
-    const sendInviteDialog = ref({ message: '', messageSlot: 0, userId: '', messageType: '', params: {} });
+    const sendInviteDialog = ref({
+        messageSlot: {},
+        userId: '',
+        params: {}
+    });
    const sendInviteRequestDialogVisible = ref(false);

    const previousInstancesUserDialog = ref({
@@ -2308,7 +2313,7 @@
        sendInviteDialog.value = {
            params,
            userId,
-            messageType: 'invite'
+            messageSlot: {}
        };
        inviteMessagesRequest.refreshInviteMessageTableData('message');
        clearInviteImageUpload();
@@ -2319,7 +2324,7 @@
        sendInviteDialog.value = {
            params,
            userId,
-            messageType: 'requestInvite'
+            messageSlot: {}
        };
        inviteMessagesRequest.refreshInviteMessageTableData('request');
        clearInviteImageUpload();
@@ -3244,11 +3249,8 @@
    function saveUserMemo(userId, memo) {
        emit('saveUserMemo', userId, memo);
    }
-    function clearInviteImageUpload() {
-        emit('clearInviteImageUpload');
-    }
-    function inviteImageUpload(event) {
-        emit('inviteImageUpload', event);
+    function closeInviteDialog() {
+        clearInviteImageUpload();
    }
    function refreshGalleryTable() {
        emit('refreshGalleryTable');
--- a/src/mixins/dialogs/dialogs.pug
+++ b/src/mixins/dialogs/dialogs.pug
@@ -110,7 +110,6 @@ mixin dialogs
        @saveUserMemo='saveUserMemo'
        @setGroupVisibility='setGroupVisibility'
        @leaveGroupPrompt='leaveGroupPrompt'
-        @clearInviteImageUpload='clearInviteImageUpload'
        @closeGalleryDialog='galleryDialogVisible = false')

    WorldDialog(
@@ -212,4 +211,4 @@ mixin dialogs

    PrimaryPasswordDialog(
        :enablePrimaryPasswordDialog.sync='enablePrimaryPasswordDialog'
-        @setPrimaryPassword='setPrimaryPassword')
+        @setPrimaryPassword='setPrimaryPassword')
--- a/src/views/Notifications/Notification.vue
+++ b/src/views/Notifications/Notification.vue
@@ -399,15 +399,15 @@
            </el-table-column>
        </data-tables>
        <SendInviteResponseDialog
+            :send-invite-response-dialog="sendInviteResponseDialog"
            :send-invite-response-dialog-visible.sync="sendInviteResponseDialogVisible"
            :invite-response-message-table="inviteResponseMessageTable"
-            :upload-image="uploadImage"
-            @invite-image-upload="inviteImageUpload" />
+            :upload-image="uploadImage" />
        <SendInviteRequestResponseDialog
+            :send-invite-response-dialog="sendInviteResponseDialog"
            :send-invite-request-response-dialog-visible.sync="sendInviteRequestResponseDialogVisible"
            :invite-request-response-message-table="inviteRequestResponseMessageTable"
-            :upload-image="uploadImage"
-            @invite-image-upload="inviteImageUpload" />
+            :upload-image="uploadImage" />
    </div>
 </template>

@@ -439,6 +439,7 @@
    const showGroupDialog = inject('showGroupDialog');
    const showUserDialog = inject('showUserDialog');
    const showFullscreenImageDialog = inject('showFullscreenImageDialog');
+    const clearInviteImageUpload = inject('clearInviteImageUpload');

    const props = defineProps({
        menuActiveIndex: {
@@ -478,11 +479,8 @@
        }
    });

-    const emit = defineEmits(['inviteImageUpload', 'clearInviteImageUpload']);
-
    const sendInviteResponseDialog = ref({
-        message: '',
-        messageSlot: 0,
+        messageSlot: {},
        invite: {}
    });

@@ -490,10 +488,6 @@

    const sendInviteRequestResponseDialogVisible = ref(false);

-    function inviteImageUpload(event) {
-        emit('inviteImageUpload', event);
-    }
-
    function saveTableFilters() {
        configRepository.setString(
            'VRCX_notificationTableFilters',
@@ -540,18 +534,13 @@
    }

    function showSendInviteResponseDialog(invite) {
-        sendInviteResponseDialog.value = {
-            invite
-        };
+        sendInviteResponseDialog.value.invite = invite;
+        sendInviteResponseDialog.value.messageSlot = {};
        inviteMessagesRequest.refreshInviteMessageTableData('response');
        clearInviteImageUpload();
        sendInviteResponseDialogVisible.value = true;
    }

-    function clearInviteImageUpload() {
-        emit('clearInviteImageUpload');
-    }
-
    function acceptRequestInvite(row) {
        $confirm('Continue? Send Invite', 'Confirm', {
            confirmButtonText: 'Confirm',
@@ -594,9 +583,8 @@
    }

    function showSendInviteRequestResponseDialog(invite) {
-        sendInviteResponseDialog.value = {
-            invite
-        };
+        sendInviteResponseDialog.value.invite = invite;
+        sendInviteResponseDialog.value.messageSlot = {};
        inviteMessagesRequest.refreshInviteMessageTableData('requestResponse');
        clearInviteImageUpload();
        sendInviteRequestResponseDialogVisible.value = true;
--- a/src/views/Notifications/dialogs/EditAndSendInviteResponseDialog.vue
+++ b/src/views/Notifications/dialogs/EditAndSendInviteResponseDialog.vue
@@ -61,11 +61,12 @@
    }

    async function saveEditAndSendInviteResponse() {
+        const I = props.sendInviteResponseDialog;
        const D = props.editAndSendInviteResponseDialog;
        D.visible = false;
-        const messageType = D.messageType;
-        const slot = D.inviteMessage.slot;
-        if (D.inviteMessage.message !== D.newMessage) {
+        const messageType = I.messageSlot.messageType;
+        const slot = I.messageSlot.slot;
+        if (I.messageSlot.message !== D.newMessage) {
            const params = {
                message: D.newMessage
            };
@@ -88,7 +89,6 @@
                    return args;
                });
        }
-        const I = props.sendInviteResponseDialog;
        const params = {
            responseSlot: slot,
            rsvp: true
@@ -107,9 +107,10 @@
                        message: 'Invite response message sent',
                        type: 'success'
                    });
-
-                    emit('closeInviteDialog');
                    return args;
+                })
+                .finally(() => {
+                    emit('closeInviteDialog');
                });
        } else {
            notificationRequest
@@ -125,8 +126,10 @@
                        message: 'Invite response message sent',
                        type: 'success'
                    });
-                    emit('closeInviteDialog');
                    return args;
+                })
+                .finally(() => {
+                    emit('closeInviteDialog');
                });
        }
    }
--- a/src/views/Notifications/dialogs/SendInviteRequestResponseDialog.vue
+++ b/src/views/Notifications/dialogs/SendInviteRequestResponseDialog.vue
@@ -33,7 +33,7 @@
                        type="text"
                        icon="el-icon-edit"
                        size="mini"
-                        @click.stop="showEditAndSendInviteResponseDialog('requestResponse', scope.row)">
+                        @click.stop="showEditAndSendInviteResponseDialog(scope.row)">
                    </el-button>
                </template>
            </el-table-column>
@@ -50,11 +50,13 @@
        <EditAndSendInviteResponseDialog
            :edit-and-send-invite-response-dialog.sync="editAndSendInviteResponseDialog"
            :upload-image="uploadImage"
-            :send-invite-response-dialog="sendInviteResponseDialog" />
+            :send-invite-response-dialog.sync="sendInviteResponseDialog"
+            @closeInviteDialog="closeInviteDialog" />
        <SendInviteResponseConfirmDialog
-            :send-invite-response-confirm-dialog="sendInviteResponseConfirmDialog"
+            :send-invite-response-dialog.sync="sendInviteResponseDialog"
            :upload-image="uploadImage"
-            :send-invite-response-dialog.sync="sendInviteResponseDialog" />
+            :send-invite-response-confirm-dialog="sendInviteResponseConfirmDialog"
+            @closeInviteDialog="closeInviteDialog" />
    </safe-dialog>
 </template>

@@ -67,6 +69,7 @@
    const { t } = useI18n();

    const API = inject('API');
+    const inviteImageUpload = inject('inviteImageUpload');

    defineProps({
        sendInviteRequestResponseDialogVisible: {
@@ -82,12 +85,10 @@
        }
    });

-    const emit = defineEmits(['update:sendInviteRequestResponseDialogVisible', 'inviteImageUpload']);
+    const emit = defineEmits(['update:sendInviteRequestResponseDialogVisible']);

    const editAndSendInviteResponseDialog = ref({
        visible: false,
-        inviteMessage: {},
-        messageType: '',
        newMessage: ''
    });

@@ -96,27 +97,25 @@
    });

    const sendInviteResponseDialog = ref({
-        message: '',
-        messageSlot: 0,
+        messageSlot: {},
        invite: {}
    });

-    function inviteImageUpload(event) {
-        emit('inviteImageUpload', event);
+    function showEditAndSendInviteResponseDialog(row) {
+        props.sendInviteResponseDialog.messageSlot = row;
+        editAndSendInviteResponseDialog.value = {
+            newMessage: messageSlot.message,
+            visible: true
+        };
    }

    function showSendInviteResponseConfirmDialog(row) {
+        props.sendInviteResponseDialog.messageSlot = row;
        sendInviteResponseConfirmDialog.value.visible = true;
-        sendInviteResponseDialog.value.messageSlot = row.slot;
    }

-    function showEditAndSendInviteResponseDialog(messageType, inviteMessage) {
-        editAndSendInviteResponseDialog.value = {
-            newMessage: inviteMessage.message,
-            visible: true,
-            messageType,
-            inviteMessage
-        };
+    function closeInviteDialog() {
+        cancelSendInviteRequestResponse();
    }

    function cancelSendInviteRequestResponse() {
--- a/src/views/Notifications/dialogs/SendInviteResponseConfirmDialog.vue
+++ b/src/views/Notifications/dialogs/SendInviteResponseConfirmDialog.vue
@@ -31,16 +31,16 @@
    const $message = instance.proxy.$message;

    const props = defineProps({
-        sendInviteResponseConfirmDialog: {
+        sendInviteResponseDialog: {
            type: Object,
-            required: true
+            default: () => ({})
        },
        uploadImage: {
            type: String
        },
-        sendInviteResponseDialog: {
+        sendInviteResponseConfirmDialog: {
            type: Object,
-            default: () => ({})
+            required: true
        }
    });

@@ -48,17 +48,19 @@

    function cancelInviteResponseConfirm() {
        emit('update:sendInviteResponseConfirmDialog', { visible: false });
+        // TODO: temp fix to close dialog
+        props.sendInviteResponseConfirmDialog.visible = false;
    }

    function sendInviteResponseConfirm() {
        const D = props.sendInviteResponseDialog;
        const params = {
-            responseSlot: D.messageSlot,
+            responseSlot: D.messageSlot.slot,
            rsvp: true
        };
        if (props.uploadImage) {
            notificationRequest
-                .sendInviteResponsePhoto(params, D.invite.id, D.messageType)
+                .sendInviteResponsePhoto(params, D.invite.id, D.messageSlot.messageType)
                .catch((err) => {
                    throw err;
                })
@@ -71,10 +73,13 @@
                        type: 'success'
                    });
                    return args;
+                })
+                .finally(() => {
+                    emit('closeInviteDialog');
                });
        } else {
            notificationRequest
-                .sendInviteResponse(params, D.invite.id, D.messageType)
+                .sendInviteResponse(params, D.invite.id, D.messageSlot.messageType)
                .catch((err) => {
                    throw err;
                })
@@ -87,9 +92,11 @@
                        type: 'success'
                    });
                    return args;
+                })
+                .finally(() => {
+                    emit('closeInviteDialog');
                });
        }
        cancelInviteResponseConfirm();
-        emit('closeInviteDialog');
    }
 </script>
--- a/src/views/Notifications/dialogs/SendInviteResponseDialog.vue
+++ b/src/views/Notifications/dialogs/SendInviteResponseDialog.vue
@@ -36,7 +36,7 @@
                        type="text"
                        icon="el-icon-edit"
                        size="mini"
-                        @click.stop="showEditAndSendInviteResponseDialog('response', scope.row)" />
+                        @click.stop="showEditAndSendInviteResponseDialog(scope.row)" />
                </template>
            </el-table-column>
        </data-tables>
@@ -52,11 +52,13 @@
        <EditAndSendInviteResponseDialog
            :edit-and-send-invite-response-dialog.sync="editAndSendInviteResponseDialog"
            :upload-image="uploadImage"
-            :send-invite-response-confirm-dialog="sendInviteResponseDialog" />
+            :send-invite-response-dialog.sync="sendInviteResponseDialog"
+            @closeInviteDialog="closeInviteDialog" />
        <SendInviteResponseConfirmDialog
-            :send-invite-response-dialog.sync="sendInviteResponseConfirmDialog"
+            :send-invite-response-dialog.sync="sendInviteResponseDialog"
            :upload-image="uploadImage"
-            :send-invite-response-confirm-dialog="sendInviteResponseDialog" />
+            :send-invite-response-confirm-dialog="sendInviteResponseConfirmDialog"
+            @closeInviteDialog="closeInviteDialog" />
    </safe-dialog>
 </template>

@@ -69,7 +71,12 @@
    const { t } = useI18n();

    const API = inject('API');
-    defineProps({
+    const inviteImageUpload = inject('inviteImageUpload');
+    const props = defineProps({
+        sendInviteResponseDialog: {
+            type: Object,
+            default: () => ({})
+        },
        sendInviteResponseDialogVisible: {
            type: Boolean,
            default: false
@@ -85,42 +92,33 @@

    const editAndSendInviteResponseDialog = ref({
        visible: false,
-        inviteMessage: {},
-        messageType: '',
        newMessage: ''
    });

-    const emit = defineEmits(['update:sendInviteResponseDialogVisible', 'inviteImageUpload']);
+    const emit = defineEmits(['update:sendInviteResponseDialogVisible']);

    const sendInviteResponseConfirmDialog = ref({
        visible: false
    });

-    const sendInviteResponseDialog = ref({
-        message: '',
-        messageSlot: 0,
-        invite: {}
-    });
+    function closeInviteDialog() {
+        cancelSendInviteResponse();
+    }

    function cancelSendInviteResponse() {
        emit('update:sendInviteResponseDialogVisible', false);
    }

-    function showEditAndSendInviteResponseDialog(messageType, inviteMessage) {
+    function showEditAndSendInviteResponseDialog(row) {
+        props.sendInviteResponseDialog.messageSlot = row;
        editAndSendInviteResponseDialog.value = {
-            newMessage: inviteMessage.message,
-            visible: true,
-            messageType,
-            inviteMessage
+            newMessage: messageSlot.message,
+            visible: true
        };
    }

-    function inviteImageUpload(event) {
-        emit('inviteImageUpload', event);
-    }
-
    function showSendInviteResponseConfirmDialog(row) {
+        props.sendInviteResponseDialog.messageSlot = row;
        sendInviteResponseConfirmDialog.value.visible = true;
-        sendInviteResponseDialog.value.messageSlot = row.slot;
    }
 </script>