31 lines
1.5 KiB
Vue
31 lines
1.5 KiB
Vue
<script setup lang="ts">
|
|
const route = useRoute();
|
|
const { data: user } = useFetch(`/api/users/${route.params.id}`);
|
|
const { data: projects } = useFetch(`/api/users/${route.params.id}/projects`);
|
|
const { data: comments } = useFetch(`/api/users/${route.params.id}/comments`);
|
|
</script>
|
|
|
|
<template>
|
|
<Head>
|
|
<Title>{{ user?.username ?? "Inconnu" }}</Title>
|
|
</Head>
|
|
<div v-if="user" class="border border-light-35 dark:border-dark-35 p-4 flex gap-4">
|
|
<div>
|
|
<picture :width=128 :height=128 class="flex" >
|
|
<source :src="`/users/${user?.id}/normal.jpg`" :width=128 :height=128 />
|
|
<Icon :icon="`users/unknown`" :width=128 :height=128 ></Icon>
|
|
</picture>
|
|
</div>
|
|
<div class="flex flex-col">
|
|
<span class="text-xl font-semibold">{{ user?.username }}</span>
|
|
<span>Inscrit depuis le {{ format(new Date(user.signin_timestamp), 'dd/MM/yyyy') }}</span>
|
|
<br/>
|
|
<span>A créé {{ projects?.length ?? 0 }} projet(s)</span>
|
|
<span>A créé {{ comments?.length ?? 0 }} commentaire(s)</span>
|
|
</div>
|
|
</div>
|
|
<div v-else class="h-100 w-100 flex flex-1 flex-col justify-center items-center">
|
|
<div class="text-3xl font-extralight tracking-wide text-light-60 dark:text-dark-60">Introuvable</div>
|
|
<div class="text-lg text-light-60 dark:text-dark-60">Cette page n'existe pas</div>
|
|
</div>
|
|
</template> |