vbv/client/src/pages/competence/CompetenceCertificateDetail...

56 lines
1.4 KiB
Vue

<script setup lang="ts">
import log from "loglevel";
import { computed } from "vue";
import { useAllCompetenceCertificates } from "@/composables";
import { getPreviousRoute } from "@/router/history";
import CompetenceCertificateComponent from "@/pages/competence/CompetenceCertificateComponent.vue";
const props = defineProps<{
courseSlug: string;
certificateSlug: string;
userId?: string;
}>();
log.debug("CompetenceCertificateDetailPage setup", props);
const { competenceCertificates } = useAllCompetenceCertificates(
props.userId,
props.courseSlug
);
const certificate = computed(() => {
if (!competenceCertificates) {
return null;
}
return competenceCertificates.value.find((cc) =>
cc.slug.endsWith(props.certificateSlug)
);
});
</script>
<template>
<div class="container-large">
<nav class="py-4">
<router-link
:to="
getPreviousRoute() || `/course/${props.courseSlug}/competence/certificates`
"
class="btn-text inline-flex items-center p-0"
data-cy="back-button"
>
<it-icon-arrow-left class="-ml-1 mr-1 h-5 w-5"></it-icon-arrow-left>
<span class="inline">{{ $t("general.back") }}</span>
</router-link>
</nav>
<div v-if="certificate">
<CompetenceCertificateComponent
:competence-certificate="certificate"
:detail-view="true"
></CompetenceCertificateComponent>
</div>
</div>
</template>
<style scoped></style>