vbv/client/src/components/dashboard/MentorOpenTasksCount.vue

31 lines
887 B
Vue

<script setup lang="ts">
import { onMounted, ref, Ref } from "vue";
import { fetchOpenTasksCount } from "@/services/dashboard";
const props = defineProps<{
courseId: string;
}>();
const openTaskCount: Ref<number> = ref(0);
onMounted(async () => {
const data = await fetchOpenTasksCount(props.courseId);
openTaskCount.value = data?.open_task_count;
});
</script>
<template>
<div class="w-[325px]">
<h3 class="mb-4 text-base">{{ $t("Zu erledigen") }}</h3>
<div class="flex flex-row space-x-3 bg-white pb-6">
<div
class="flex h-[74px] w-[74px] items-center justify-center rounded-full border-2 border-green-500 px-3 py-1 text-3xl font-bold"
>
<span>{{ openTaskCount }}</span>
</div>
<p class="ml-3 mt-0 leading-[74px]">{{ $t("Elemente zu erledigen") }}</p>
</div>
<p>{{ $t("Details anschauen") }}</p>
</div>
</template>