49 lines
1.5 KiB
Vue
49 lines
1.5 KiB
Vue
<script setup lang="ts">
|
|
import * as log from 'loglevel';
|
|
import OverviewCard from '@/components/mediacenter/OverviewCard.vue';
|
|
import ItDropdownSelect from "@/components/ui/ItDropdownSelect.vue";
|
|
import {watch, ref} from "vue";
|
|
import {useMediaCenterStore} from "@/stores/mediacenter";
|
|
|
|
log.debug('MediaMainView created');
|
|
|
|
const mediaStore = useMediaCenterStore();
|
|
const dropdownSelected = ref(mediaStore.selectedLearningPath);
|
|
|
|
watch(dropdownSelected, (newValue) => mediaStore.$patch({
|
|
selectedLearningPath: newValue
|
|
})
|
|
)
|
|
|
|
</script>
|
|
|
|
<template>
|
|
<div class="mx-auto max-w-5xl">
|
|
<div class="flex flex-col lg:flex-row items-center justify-between mb-10">
|
|
<h1>Mediathek</h1>
|
|
<ItDropdownSelect
|
|
v-model="dropdownSelected"
|
|
:items="mediaStore.availableLearningPaths"></ItDropdownSelect>
|
|
</div>
|
|
<OverviewCard
|
|
title="Handlungsfelder"
|
|
call2-action="Anschauen"
|
|
link="/mediacenter/handlungsfelder"
|
|
description="Finde alle Ressourcen der Handlungsfelder wie Lernmedien, Links und andere nützliche Informationen."
|
|
icon="handlungsfelder-overview"
|
|
class="mb-6">
|
|
</OverviewCard>
|
|
<OverviewCard
|
|
title="Lernmedien"
|
|
call2-action="Anschauen"
|
|
link="/mediacenter/lernmedien"
|
|
description="Finde eine vollständige Liste der Bücher und anderen Medien, auf die im Kurs verwiesen wird."
|
|
icon="lernmedien-overview"
|
|
class="mb-6">
|
|
</OverviewCard>
|
|
</div>
|
|
</template>
|
|
|
|
<style scoped>
|
|
</style>
|