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