Files
tranga-website/website/app/pages/index.vue
glax be463ae56a Add error page
Add loading skeleton
2025-10-11 22:30:25 +02:00

21 lines
703 B
Vue

<template>
<UPageBody class="p-4 flex flex-row flex-wrap gap-6 mt-0">
<USkeleton v-if="status !== 'success'" class="max-w-[600px] w-full h-[350px]" />
<MangaCard
v-else
v-for="(m, i) in manga"
:manga="m"
:expanded="i === expanded"
@click="expanded = expanded === i ? -1 : i">
<template #actions="manga">
<UButton :to="`manga/${manga.key}`">Details</UButton>
</template>
</MangaCard>
</UPageBody>
</template>
<script setup lang="ts">
const { data: manga, status } = await useApi('/v2/Manga', { key: FetchKeys.Manga.All, lazy: true });
const expanded = ref(-1);
</script>