Files
tranga-website/website/app/components/MangaconnectorIcon.vue
2025-10-12 01:02:01 +02:00

29 lines
1.1 KiB
Vue

<template>
<div class="w-6 h-6 inline-block align-middle m-1">
<NuxtLink :href="props.websiteUrl ?? ''">
<UTooltip :text="`${props.useForDownload ? 'Downloading' : 'Not downloading'}, click to see website`">
<NuxtImg
v-if="mangaConnector"
:src="mangaConnector?.iconUrl"
:class="[
'w-full rounded-full outline-2 -outline-offset-1',
props.useForDownload ? 'outline-green-500' : 'outline-red-500',
]" />
<p v-else>{{ mangaConnectorName }}</p>
</UTooltip>
</NuxtLink>
</div>
</template>
<script setup lang="ts">
import type { components } from '#open-fetch-schemas/api';
type MangaConnectorId = components['schemas']['MangaConnectorId'];
const props = defineProps<MangaConnectorId>();
const { data: mangaConnector } = await useApi('/v2/MangaConnector/{MangaConnectorName}', {
path: { MangaConnectorName: props.mangaConnectorName },
key: FetchKeys.MangaConnector.Id(props.mangaConnectorName),
});
</script>