vbv/client/src/pages/learningMentor/InvitationAcceptPage.vue

78 lines
2.1 KiB
Vue

<script setup lang="ts">
import { useCSRFFetch } from "@/fetchHelpers";
import { getLearningMentorUrl } from "@/utils/utils";
const props = defineProps<{
courseId: string;
invitationId: string;
}>();
const { data, error } = useCSRFFetch(
`/api/mentor/${props.courseId}/invitations/accept`,
{
onFetchError(ctx) {
ctx.error = ctx.data;
return ctx;
},
}
)
.post({
invitation_id: props.invitationId,
})
.json();
</script>
<template>
<div class="flex-grow bg-gray-200">
<div class="container-large">
<header class="mb-8 mt-12">
<h1 class="mb-8">{{ $t("a.Einladung") }}</h1>
</header>
<main>
<div class="bg-white p-6">
<template v-if="error">
{{
$t(
"a.Die Einladung konnte nicht akzeptiert werden. Bitte melde dich beim Support."
)
}}
<ul>
<li>
{{ $t("a.Versicherungsvermittler/-in") }}
<a class="underline" href="mailto:vermittler@vbv-afa.ch">
vermittler@vbv-afa.ch
</a>
</li>
<li>
{{ $t("a.Überbetriebliche Kurse") }}
<a class="underline" href="mailto:uek-support@vbv-afa.ch">
uek-support@vbv-afa.ch
</a>
</li>
</ul>
<div v-if="error.message" class="my-4">
{{ $t("a.Fehlermeldung") }}: {{ error.message }}
</div>
</template>
<template v-else>
<i18next
:translation="
$t('a.Du hast die Einladung von {name} erfolgreich akzeptiert.')
"
>
<template #name>
<b>{{ data.user.first_name }} {{ data.user.last_name }}</b>
</template>
</i18next>
<div class="mt-4">
<a class="underline" :href="getLearningMentorUrl(data.course_slug)">
{{ $t("a.Übersicht anschauen") }}
</a>
</div>
</template>
</div>
</main>
</div>
</div>
</template>