42 lines
1.8 KiB
Vue
42 lines
1.8 KiB
Vue
<script setup lang="ts">
|
|
definePageMeta({
|
|
guestsGoesTo: '/user/login',
|
|
})
|
|
let { user, clear } = useUserSession();
|
|
</script>
|
|
|
|
<template>
|
|
<Head>
|
|
<Title>Mon profil</Title>
|
|
</Head>
|
|
<div class="grid grid-cols-4 w-full items-start py-8 gap-6 content-start" v-if="user">
|
|
<div class="flex gap-4 col-span-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 class="flex">
|
|
<ProseTable class="!m-0">
|
|
<ProseThead>
|
|
<ProseTr>
|
|
<ProseTh>Permission</ProseTh>
|
|
</ProseTr>
|
|
</ProseThead>
|
|
<ProseTbody>
|
|
<ProseTr v-for="permission in user.permissions">
|
|
<ProseTd>{{ permission }}</ProseTd>
|
|
</ProseTr>
|
|
</ProseTbody>
|
|
</ProseTable>
|
|
</div>
|
|
</div>
|
|
</template> |