feat(club): enhance access request functionality in ClubView

- Added a visual indicator for access requests with a new message when access is requested.
- Disabled the request access button once the request has been made to prevent duplicate submissions.
- Improved error handling in the requestAccess method to manage access request status more effectively.
This commit is contained in:
Torsten Schulz (local)
2026-02-04 13:30:23 +01:00
parent 5b0a3baa21
commit a2e9e5e510

View File

@@ -23,7 +23,10 @@
</div>
<div v-else>
<div>{{ $t('club.noAccess') }}</div>
<button @click="requestAccess">{{ $t('club.requestAccess') }}</button>
<div v-if="accessRequested" class="access-requested">
{{ $t('club.accessRequested') }}
</div>
<button @click="requestAccess" :disabled="accessRequested">{{ $t('club.requestAccess') }}</button>
</div>
</div>
@@ -80,7 +83,8 @@ export default {
name: '',
},
openRequests: [],
accessAllowed: false
accessAllowed: false,
accessRequested: false
}
},
methods: {
@@ -152,12 +156,19 @@ export default {
},
async requestAccess() {
try {
if (this.accessRequested) return;
const clubId = this.getClubId();
const response = await apiClient.get(`/clubs/request/${clubId}`);
if (response.status === 200) {
this.accessRequested = true;
await this.showInfo(this.$t('messages.info'), this.$t('club.accessRequested'), '', 'info');
}
} catch (error) {
if (error?.response?.status === 409) {
this.accessRequested = true;
await this.showInfo(this.$t('messages.info'), this.$t('club.accessRequested'), '', 'info');
return;
}
const message = safeErrorMessage(error, this.$t('club.accessRequestFailed'));
await this.showInfo(this.$t('messages.error'), message, '', 'error');
}
@@ -230,4 +241,9 @@ ul {
.gender-symbol.gender-unknown { color: #444; }
.gender-symbol { margin-right: .35rem; opacity: .9; font-size: 1.05em; display: inline-block; width: 1.1em; text-align: center; }
.is-test { font-style: italic; }
.access-requested {
margin: 0.5rem 0;
color: #2e7d32;
font-weight: 600;
}
</style>