mirror of
https://github.com/C9Glax/tranga-website.git
synced 2025-10-15 09:50:48 +02:00
55 lines
2.3 KiB
Vue
55 lines
2.3 KiB
Vue
<template>
|
|
<MangaDetailPage :manga="manga">
|
|
<div class="grid gap-3 grid-cols-[70%_30%]">
|
|
<ChaptersList v-if="manga" :manga-id="manga.key" />
|
|
<UCard>
|
|
<template #header>
|
|
<h1>Download</h1>
|
|
</template>
|
|
<LibrarySelect :manga-id="mangaId" :library-id="libraryId" class="w-full" />
|
|
<div v-if="manga" class="flex flex-row gap-2 w-full flex-wrap my-2">
|
|
<div
|
|
v-for="mangaconnectorId in manga.mangaConnectorIds.sort((a, b) =>
|
|
a.mangaConnectorName < b.mangaConnectorName ? -1 : 1
|
|
)"
|
|
:key="mangaconnectorId.key"
|
|
class="bg-elevated p-1 rounded-lg w-fit flex items-center justify-center gap-2">
|
|
<MangaconnectorIcon v-bind="mangaconnectorId" />
|
|
<UTooltip
|
|
:text="
|
|
mangaconnectorId.useForDownload
|
|
? 'Stop downloading from this website'
|
|
: 'Download from this website'
|
|
">
|
|
<UButton
|
|
:icon="
|
|
mangaconnectorId.useForDownload ? 'i-lucide-cloud-off' : 'i-lucide-cloud-download'
|
|
"
|
|
variant="ghost"
|
|
disabled />
|
|
<!-- Not implemented yet -->
|
|
</UTooltip>
|
|
</div>
|
|
</div>
|
|
</UCard>
|
|
</div>
|
|
<template #actions>
|
|
<UButton trailing-icon="i-lucide-merge" :to="`${manga.key}/merge/`" color="secondary">Merge</UButton>
|
|
<UButton variant="soft" color="warning" icon="i-lucide-trash" />
|
|
</template>
|
|
</MangaDetailPage>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import MangaDetailPage from '~/components/MangaDetailPage.vue';
|
|
|
|
const route = useRoute();
|
|
const mangaId = route.params.mangaId as string;
|
|
|
|
const { data: manga } = await useApi('/v2/Manga/{MangaId}', {
|
|
path: { MangaId: mangaId },
|
|
key: FetchKeys.Manga.Id(mangaId),
|
|
});
|
|
const libraryId = ref(manga.value?.fileLibraryId);
|
|
</script>
|