torsten/trainingstagebuch
1
0
Fork 0
Code Issues 1 Pull Requests Actions Packages Projects Releases Wiki Activity

feat(clickTtPlayerRegistrationService, MembersView): enhance Click-TT registration flow and UI feedback

Browse Source 
- Replaced the abort confirmation flow with a new function to open the application after a search, improving user experience by directly navigating to the application.
- Updated error handling to provide clearer messages when a confirm dialog is encountered, enhancing traceability.
- Modified the MembersView to track application submission status and display detailed success/error messages, improving user feedback during the registration process.
- Introduced a new method to format and display trace details, aiding in debugging and user communication.
This commit is contained in:
Torsten Schulz (local)
2026-03-11 15:31:37 +01:00
parent 139d169fcc
commit 8fc754c235
3 changed files with 106 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

49
frontend/src/views/MembersView.vue
View File

@@ -256,7 +256,7 @@
⛔
</span>
<span
v-if="member.active && !member.ttr && !member.qttr"
v-if="member.active && !member.ttr && !member.qttr && !member.clickTtApplicationSubmitted"
@click.stop="requestClickTtRegistration(member)"
class="action-icon"
:class="{ 'action-icon-disabled': clickTtPendingMemberIds.includes(member.id) }"
@@ -665,7 +665,7 @@ export default {
const confirmed = await this.showConfirm(
'Click-TT-Antrag starten',
`Soll fuer ${member.firstName} ${member.lastName} der automatisierte Click-TT-Antrag gestartet werden?`,
'Aktuell ist nur der Workflow fuer bereits im click-TT-System vorhandene Spieler automatisiert.',
'Der Antrag wird im Backend automatisiert durch den Click-TT-Workflow gefuehrt.',
'info'
);
if (!confirmed) {
@@ -675,19 +675,58 @@ export default {
this.clickTtPendingMemberIds = [...this.clickTtPendingMemberIds, member.id];
try {
const response = await apiClient.post(`/clubmembers/clicktt-registration/${this.currentClub}/${member.id}`);
const traceDetails = this.formatClickTtTrace(response.data?.trace);
if (response.data?.success) {
await this.showInfo('Click-TT-Antrag', getSafeMessage(response.data.message, 'Der Click-TT-Antrag wurde erfolgreich eingereicht.'), response.data.finalUrl || '', 'success');
member.clickTtApplicationSubmitted = true;
const successDetails = [response.data.finalUrl || '', traceDetails].filter(Boolean).join('\n\n');
await this.showInfo(
'Click-TT-Antrag',
getSafeMessage(response.data.message, 'Der Click-TT-Antrag wurde erfolgreich eingereicht.'),
successDetails,
'success'
);
} else {
await this.showInfo('Click-TT-Antrag', getSafeMessage(response.data?.error, 'Der Click-TT-Antrag konnte nicht eingereicht werden.'), '', 'error');
await this.showInfo(
'Click-TT-Antrag',
getSafeMessage(response.data?.error, 'Der Click-TT-Antrag konnte nicht eingereicht werden.'),
traceDetails,
'error'
);
}
} catch (error) {
console.error('Click-TT-Antrag fehlgeschlagen', error);
const errorMessage = getSafeErrorMessage(error, 'Der Click-TT-Antrag konnte nicht eingereicht werden.');
await this.showInfo('Click-TT-Antrag', errorMessage, '', 'error');
await this.showInfo(
'Click-TT-Antrag',
errorMessage,
this.formatClickTtTrace(error?.response?.data?.trace),
'error'
);
} finally {
this.clickTtPendingMemberIds = this.clickTtPendingMemberIds.filter(id => id !== member.id);
}
},
formatClickTtTrace(trace) {
if (!Array.isArray(trace) || trace.length === 0) {
return '';
}
return trace
.slice(-12)
.map((entry) => {
const type = entry?.type || 'trace';
const parts = [type];
if (entry?.name) parts.push(entry.name);
if (entry?.label) parts.push(`label=${entry.label}`);
if (entry?.status) parts.push(`status=${entry.status}`);
if (entry?.url) parts.push(`url=${entry.url}`);
if (entry?.message) parts.push(`message=${entry.message}`);
return parts.join(' | ');
})
.join('\n');
},
toggleNewMember() {
this.memberFormIsOpen = !this.memberFormIsOpen;
},