mirror of
https://github.com/koel/koel
synced 2024-12-23 11:03:05 +00:00
33 lines
1,001 B
Vue
33 lines
1,001 B
Vue
|
<template>
|
||
|
|
<BaseCard
|
||
|
|
:entity="podcast"
|
||
|
|
:layout="layout"
|
||
|
|
:title="`${podcast.title} by ${podcast.author}`"
|
||
|
|
@click="goToPodcast"
|
||
|
|
class="cursor-pointer"
|
||
|
|
>
|
||
|
|
<template #name>
|
||
|
|
<a :href="`#/podcasts/${podcast.id}`" class="font-medium" data-testid="title">{{ podcast.title }}</a>
|
||
|
|
<span class="text-k-text-secondary">{{ podcast.author }}</span>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<template #thumbnail>
|
||
|
|
<img :src="podcast.image" class="aspect-square w-[80px] object-cover rounded-lg" alt="Podcast image" />
|
||
|
|
</template>
|
||
|
|
</BaseCard>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script lang="ts" setup>
|
||
|
|
import { toRefs } from 'vue'
|
||
|
|
import { useRouter } from '@/composables'
|
||
|
|
|
||
|
|
import BaseCard from '@/components/ui/album-artist/AlbumOrArtistCard.vue'
|
||
|
|
|
||
|
|
const props = withDefaults(defineProps<{ podcast: Podcast, layout?: ArtistAlbumCardLayout }>(), { layout: 'full' })
|
||
|
|
const { podcast, layout } = toRefs(props)
|
||
|
|
|
||
|
|
const { go } = useRouter()
|
||
|
|
|
||
|
|
const goToPodcast = () => go(`/podcasts/${podcast.value.id}`)
|
||
|
|
</script>
|