71 lines
1.9 KiB
Vue
71 lines
1.9 KiB
Vue
<script setup lang="ts">
|
|
import ItFullScreenModal from '@/components/ui/ItFullScreenModal.vue'
|
|
import IconLogout from '@/components/icons/IconLogout.vue'
|
|
import IconSettings from '@/components/icons/IconSettings.vue'
|
|
import {useRouter} from "vue-router";
|
|
|
|
const router = useRouter()
|
|
|
|
const props = defineProps<{
|
|
show: boolean,
|
|
user: object,
|
|
learningPathName: string,
|
|
learningPathSlug: string
|
|
}>()
|
|
|
|
const emits = defineEmits(['closemodal'])
|
|
|
|
const clickLink = (to: string) => {
|
|
router.push(to)
|
|
emits('closemodal')
|
|
}
|
|
|
|
</script>
|
|
|
|
<template>
|
|
<ItFullScreenModal
|
|
:show="show"
|
|
@closemodal="$emit('closemodal')"
|
|
>
|
|
<div>
|
|
<div>
|
|
<div class="flex border-b border-gray-500 -mx-8 px-8 pb-4">
|
|
<div v-if="user.avatar_url">
|
|
<img class="inline-block h-16 w-16 rounded-full"
|
|
:src="user.avatar_url"
|
|
alt=""/>
|
|
</div>
|
|
<div class="ml-6">
|
|
<h3>{{user.first_name}} {{user.last_name}}</h3>
|
|
<button
|
|
@click="clickLink('/profile')"
|
|
class="mt-2 inline-block items-center">
|
|
<IconSettings class="inline-block" /><span class="ml-3">Kontoeinstellungen</span>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
<div>
|
|
<div
|
|
class="mt-6 pb-6 border-b border-gray-500"
|
|
v-if="learningPathName">
|
|
<h4 class="text-gray-900 text-sm">Kurs: {{learningPathName}}</h4>
|
|
<ul class="mt-6">
|
|
<li><button @click="clickLink('/learningpath')">Lernpfad</button></li>
|
|
<li class="mt-6">Kompetenzprofil</li>
|
|
</ul>
|
|
</div>
|
|
<div class="mt-6 pb-6 border-b border-gray-500">
|
|
<ul>
|
|
<li>Shop</li>
|
|
<li class="mt-6">Mediathek</li>
|
|
</ul>
|
|
</div>
|
|
<div class="mt-6 items-center">
|
|
<IconLogout class="inline-block" /><span class="ml-1">Abmelden</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</ItFullScreenModal>
|
|
</template>
|