jingrow/jcloud
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

修复InviteTeamMemberDialog.vue错误

Browse Source
This commit is contained in:
jingrow 2025-12-30 01:33:52 +08:00
parent 345d3db483
commit b0172b9aa8
1 changed files with 77 additions and 38 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

115
dashboard/src/components/settings/InviteTeamMemberDialog.vue
View File

@ -21,27 +21,28 @@
/> />
</n-form-item> </n-form-item>
<div v-if="$resources.roles.data?.length > 0" class="space-y-4"> <div v-if="$resources.roles.data?.length > 0" class="space-y-4">
<div class="flex items-end gap-2"> <div class="role-select-row">
<n-form-item :label="$t('Select Role')" class="flex-1"> <label class="role-select-label">{{ $t('Select Role') }}</label>
<div class="flex items-center gap-2">
<n-select <n-select
v-model:value="selectedRole" v-model:value="selectedRole"
:options="roleOptions" :options="roleOptions"
:placeholder="$t('Select a role')" placeholder=""
:size="inputSize" :size="inputSize"
class="w-full" class="flex-1"
/> />
</n-form-item> <n-button
<n-button type="primary"
type="primary" :disabled="!selectedRole"
:disabled="!selectedRole" @click="addRole"
@click="addRole" :size="buttonSize"
:size="buttonSize" >
> <template #icon>
<template #icon> <n-icon><PlusIcon /></n-icon>
<n-icon><PlusIcon /></n-icon> </template>
</template> {{ $t('Add') }}
{{ $t('Add') }} </n-button>
</n-button> </div>
</div> </div>
<div v-if="selectedRoles.length > 0" class="space-y-2"> <div v-if="selectedRoles.length > 0" class="space-y-2">
<div <div
@ -64,9 +65,9 @@
</div> </div>
</div> </div>
<n-alert <n-alert
v-if="$team.inviteTeamMember.error" v-if="$team?.inviteTeamMember?.error"
type="error" type="error"
:title="getErrorMessage($team.inviteTeamMember.error)" :title="getErrorMessage($team?.inviteTeamMember?.error)"
/> />
</n-space> </n-space>
<template #action> <template #action>
@ -76,7 +77,7 @@
</n-button> </n-button>
<n-button <n-button
type="primary" type="primary"
:loading="$team.inviteTeamMember.loading" :loading="$team?.inviteTeamMember?.loading"
@click="inviteMember" @click="inviteMember"
:block="isMobile" :block="isMobile"
:size="buttonSize" :size="buttonSize"
@ -153,7 +154,7 @@ export default {
return this.isMobile ? 'medium' : 'large'; return this.isMobile ? 'medium' : 'large';
}, },
buttonSize() { buttonSize() {
return this.isMobile ? 'medium' : 'medium'; return this.isMobile ? 'medium' : 'large';
}, },
roleOptions() { roleOptions() {
if (!this.$resources.roles.data) return []; if (!this.$resources.roles.data) return [];
@ -182,12 +183,18 @@ export default {
}, },
getErrorMessage(error) { getErrorMessage(error) {
if (!error) return ''; if (!error) return '';
if (typeof error === 'string') return error; try {
if (error.message) return error.message; if (typeof error === 'string') return error;
if (error.messages && Array.isArray(error.messages)) { if (error && typeof error === 'object') {
return error.messages.join('\n'); if (error.message) return error.message;
if (error.messages && Array.isArray(error.messages)) {
return error.messages.join('\n');
}
}
return String(error);
} catch (e) {
return String(error || 'Unknown error');
} }
return String(error);
}, },
addRole() { addRole() {
if (this.selectedRole) { if (this.selectedRole) {
@ -206,25 +213,34 @@ export default {
(role) => role.value !== roleToRemove, (role) => role.value !== roleToRemove,
); );
}, },
inviteMember() { async inviteMember() {
if (!this.username) { if (!this.username) {
toast.error(this.$t('Username is required')); toast.error(this.$t('Username is required'));
return; return;
} }
if (!this.$team?.inviteTeamMember) {
toast.error(this.$t('Team service is not available'));
return;
}
if (this.$team.inviteTeamMember.loading) return; if (this.$team.inviteTeamMember.loading) return;
toast.success(this.$t('Member added to team'), { duration: 2000 }); try {
this.$team.inviteTeamMember.submit({ await this.$team.inviteTeamMember.submit({
username: this.username, username: this.username,
roles: this.selectedRoles.map((role) => role.value), roles: this.selectedRoles.map((role) => role.value),
}); });
this.hide(); toast.success(this.$t('Member added to team'), { duration: 2000 });
setTimeout(() => { this.hide();
if (this.$team?.getTeamMembers) { setTimeout(() => {
this.$team.getTeamMembers.submit(); if (this.$team?.getTeamMembers) {
} this.$team.getTeamMembers.submit();
this.$emit('success'); }
}, 500); this.$emit('success');
}, 500);
} catch (error) {
// Error will be displayed in the alert component
console.error('Failed to invite team member:', error);
}
}, },
hide() { hide() {
this.showDialog = false; this.showDialog = false;
@ -266,6 +282,29 @@ export default {
width: 100%; width: 100%;
} }
.role-select-row {
display: flex;
flex-direction: column;
gap: 8px;
}
.role-select-label {
font-size: 14px;
font-weight: 500;
color: var(--n-text-color);
margin-bottom: 0;
}
.role-select-row .flex {
display: flex;
align-items: center;
gap: 8px;
}
.role-select-row .n-select {
flex: 1;
}
:deep(.invite-member-modal .n-card__action) { :deep(.invite-member-modal .n-card__action) {
padding: 16px 24px; padding: 16px 24px;
} }