obsidian-visualiser/pages/explorer/index.vue

26 lines
1.1 KiB
Vue

<script setup lang="ts">
const { id: project } = useProject();
const { data: projects, status, error } = await useFetch('/api/project');
</script>
<template>
<Head>
<Title>Liste des projets</Title>
</Head>
<div v-if="status === 'success'" class="grid grid-cols-2 gap-4">
<div v-for="p of projects" class="border border-light-35 dark:border-dark-35 px-4 py-2">
<div class="flex justify-between">
<div>
<NuxtLink class="text-accent-blue text-xl font-semibold hover:text-opacity-75" :to="{ path: `/explorer/${p.id}/${p.home}`, force: true }">{{ p.name }}</NuxtLink>
<div class="italic">Par <NuxtLink class="font-semibold hover:underline" :to="{ path: `/users/${p.owner}`, force: true }">{{ p.username }}</NuxtLink></div>
</div>
<div>
<div class="">{{ p.pages }} pages</div>
</div>
</div>
<div class="">{{ p.summary ?? "Sans contenu" }}</div>
</div>
</div>
<div v-else-if="status === 'pending'" class="loading"></div>
</template>