wrbapp/frontend/pages/settings/index.vue
Xeovalyte 6fb439a754
All checks were successful
ci/woodpecker/push/woodpecker Pipeline was successful
large backend recreation
2023-03-20 11:23:46 +01:00

86 lines
3.0 KiB
Vue

<template>
<div class="flex flex-col gap-5 mx-auto p-2 w-full max-w-md">
<div>
<h1 class="text-xl ml-2 font-bold">Info</h1>
<div class="container">
<div class="item">
Email: <b>{{ userStore.user.email }}</b>
</div>
<div class="divider" />
<div class="item">
Personen: <b>{{ userStore.userPersons.map(a => a.fullName).join(', ')}}</b>
</div>
<div class="divider" />
<div class="item">
Groepen: <b>{{ groups.join(', ') }}</b>
</div>
<div v-if="userStore.userPersons.map(a => a.diploma).filter(n => n !== '').join('')" class="divider" />
<div v-if="userStore.userPersons.map(a => a.diploma).filter(n => n !== '').join('')" class="item">
Diploma: <b>{{ userStore.userPersons.map(a => a.diploma).filter(n => n !== '').join(', ')}}</b>
</div>
<div class="divider" />
<NuxtLink to="/settings/moreinfo" class="item-hover py-2 rounded-t flex items-center">
<span>Meer Informatie</span>
<Icon class="ml-auto" size="2em" name="ion:arrow-forward"/>
</NuxtLink>
</div>
</div>
<div>
<h1 class="text-xl ml-2 font-bold">Account</h1>
<div class="container">
<NuxtLink to="/settings/config/managerelatiecodes" class="item-hover py-2 rounded-t flex items-center">
<span>Beheer Personen</span>
<Icon class="ml-auto" size="2em" name="ion:arrow-forward"/>
</NuxtLink>
<div class="divider" />
<NuxtLink to="/settings/config/changepassword" class="item-hover py-2 flex items-center">
<span>Wachtwoord Wijzigen</span>
<Icon class="ml-auto" size="2em" name="ion:arrow-forward"/>
</NuxtLink>
<div class="divider" />
<div @click="logout" class="item-hover rounded-b flex items-center">
Uitloggen
</div>
</div>
</div>
<div v-if="userStore.userData.admin">
<h1 class="text-xl ml-2 font-bold">Admin</h1>
<div class="container">
<NuxtLink to="/settings/admin/users" class="rounded-t item-hover py-2 flex items-center">
<span>Beheer gebruikers</span>
<Icon class="ml-auto" size="2em" name="ion:arrow-forward"/>
</NuxtLink>
<div class="divider" />
<NuxtLink to="/settings/admin/ledenlijst" class="rounded-b item-hover py-2 flex items-center">
<span>Ledenlijst</span>
<Icon class="ml-auto" size="2em" name="ion:arrow-forward"/>
</NuxtLink>
</div>
</div>
<div>
<h2 class="text-center font-bold">Gemaakt door <u><a href="https://xeovalyte.com/">Timo Boomers</a></u></h2>
</div>
</div>
</template>
<script setup>
import { signOut } from "firebase/auth";
definePageMeta({
title: 'Settings'
})
const userStore = useUserStore()
const groups = computed(() => {
return [...new Set(userStore.userPersons.map(a => a.groups.join()).join().split(','))]
})
const logout = () => {
signOut(userStore.auth)
.catch((error) => {
console.log(error)
})
}
</script>