58 lines
1.6 KiB
Vue
58 lines
1.6 KiB
Vue
<script setup lang="ts">
|
|
import CourseSessionsMenu from "@/components/header/CourseSessionsMenu.vue";
|
|
import type { User } from "@/stores/user";
|
|
import type { CourseSession } from "@/types";
|
|
import { useRouter } from "vue-router";
|
|
|
|
const props = defineProps<{
|
|
courseSessions: CourseSession[];
|
|
user: User;
|
|
selectedCourseSession?: string;
|
|
}>();
|
|
|
|
const emit = defineEmits(["selectCourseSession", "logout", "close"]);
|
|
|
|
const router = useRouter();
|
|
|
|
async function navigate(routeName: string) {
|
|
await router.push({ name: routeName });
|
|
emit("close");
|
|
}
|
|
</script>
|
|
|
|
<template>
|
|
<div class="text-black">
|
|
<div class="border-b py-4">
|
|
<div class="flex justify-start">
|
|
<div v-if="user.avatar_url">
|
|
<img
|
|
class="inline-block h-24 w-24 rounded-full"
|
|
:src="user.avatar_url"
|
|
alt=""
|
|
/>
|
|
</div>
|
|
<div class="ml-6">
|
|
<h3>{{ user.first_name }} {{ user.last_name }}</h3>
|
|
<div class="mb-3 text-sm text-gray-800">{{ user.email }}</div>
|
|
<button class="underline" @click="navigate('personalProfile')">
|
|
{{ $t("a.Profil anzeigen") }}
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div v-if="props.courseSessions.length" class="border-b py-4">
|
|
<CourseSessionsMenu
|
|
:items="courseSessions"
|
|
:selected="selectedCourseSession"
|
|
@select="emit('selectCourseSession', $event)"
|
|
/>
|
|
</div>
|
|
|
|
<button type="button" class="mt-6 flex items-center" @click="emit('logout')">
|
|
<it-icon-logout class="inline-block" />
|
|
<span class="ml-1">{{ $t("mainNavigation.logout") }}</span>
|
|
</button>
|
|
</div>
|
|
</template>
|