39 lines
1.2 KiB
Vue
39 lines
1.2 KiB
Vue
<script setup lang="ts">
|
|
import { onMounted, ref, Ref } from "vue";
|
|
import { fetchMentorCompetenceSummary } from "@/services/dashboard";
|
|
import { AssignmentsStatisticsType } from "@/gql/graphql";
|
|
|
|
const props = defineProps<{
|
|
courseId: string;
|
|
}>();
|
|
|
|
const summary: Ref<AssignmentsStatisticsType | null> = ref(null);
|
|
|
|
onMounted(async () => {
|
|
summary.value = await fetchMentorCompetenceSummary(props.courseId);
|
|
console.log(summary.value);
|
|
});
|
|
</script>
|
|
|
|
<template>
|
|
<div v-if="summary" class="w-[325px]">
|
|
<div class="flex flex-row space-x-3 bg-white">
|
|
<div
|
|
class="flex h-[74px] items-center justify-center px-3 py-1 text-3xl font-bold"
|
|
>
|
|
<span>{{ summary.summary.total_passed }}</span>
|
|
</div>
|
|
<p class="ml-3 mt-0 leading-[74px]">{{ $t("Bestanden") }}</p>
|
|
</div>
|
|
<div class="flex flex-row space-x-3 bg-white pb-6">
|
|
<div
|
|
class="flex h-[74px] items-center justify-center px-3 py-1 text-3xl font-bold"
|
|
>
|
|
<span>{{ summary.summary.total_failed }}</span>
|
|
</div>
|
|
<p class="ml-3 mt-0 leading-[74px]">{{ $t("Nicht bestanden") }}</p>
|
|
</div>
|
|
<p>{{ $t("Details anschauen") }}</p>
|
|
</div>
|
|
</template>
|