obsidian-visualiser/pages/user/profile.vue

28 lines
1.3 KiB
Vue

<script setup lang="ts">
definePageMeta({
guestsGoesTo: '/user/login',
})
let { user, clear } = useUserSession();
</script>
<template>
<Head>
<Title>Mon profil</Title>
</Head>
<div class="flex w-full items-start py-8 gap-6" v-if="user">
<div class="flex gap-4 min-w-1/3 max-w-2/3 border border-light-35 dark:border-dark-35 p-4">
<Avatar icon="radix-icons:person" :src="`/users/${user?.id}.medium.jpg`" class="w-32 h-32" />
<div class="flex flex-col items-start">
<ProseH5>{{ user.username }}</ProseH5>
<ProseH5>{{ user.email }}</ProseH5>
<HoverCard>
<template v-slot:default><div class="border-light-red dark:border-dark-red bg-light-red bg-opacity-25 dark:bg-dark-red dark:bg-opacity-25 text-light-red dark:text-dark-red py-1 px-3" v-if="user.state === 0">Votre adresse mail n'as pas encore été validée. <Button class="ms-4">Renvoyez un mail</Button></div></template>
<template v-slot:content><span>Tant que votre adresse mail n'as pas été validée, vous n'avez que des droits de lecture.</span></template>
</HoverCard>
</div>
</div>
<div class="flex-1">
<Button @click="async () => await clear()">Se deconnecter</Button>
</div>
</div>
</template>