32 lines
1.0 KiB
Vue
32 lines
1.0 KiB
Vue
<script setup lang="ts">
|
|
import { useCurrentCourseSession } from "@/composables";
|
|
import DueDateSingle from "@/components/dueDates/DueDateSingle.vue";
|
|
import { computed } from "vue";
|
|
import { useExpertCockpitStore } from "@/stores/expertCockpit";
|
|
|
|
const expertCockpitStore = useExpertCockpitStore();
|
|
const courseSession = useCurrentCourseSession();
|
|
|
|
const circleDates = computed(() => {
|
|
const dueDates = courseSession.value.due_dates.filter((dueDate) => {
|
|
if (!expertCockpitStore.currentCircle) return false;
|
|
return expertCockpitStore.currentCircle.id == dueDate?.circle?.id;
|
|
});
|
|
return dueDates.slice(0, 4);
|
|
});
|
|
</script>
|
|
|
|
<template>
|
|
<div class="flex flex-col space-y-2">
|
|
<h3 class="heading-3">{{ $t("Nächste Termine") }}</h3>
|
|
<div
|
|
v-for="dueDate in circleDates"
|
|
:key="dueDate.id"
|
|
class="border-t border-gray-500 pt-2"
|
|
>
|
|
<DueDateSingle :due-date="dueDate" :single-line="true"></DueDateSingle>
|
|
</div>
|
|
<div v-if="circleDates.length === 0">{{ $t("dueDates.noDueDatesAvailable") }}</div>
|
|
</div>
|
|
</template>
|