24 lines
570 B
Vue
24 lines
570 B
Vue
<template>
|
|
<div v-if="songs.length > 0" class="flex flex-wrap gap-1">
|
|
<span
|
|
v-for="song in songs"
|
|
:key="song.id"
|
|
class="inline-flex items-center gap-1 rounded-full bg-primary/10 px-2 py-0.5 text-xs text-primary/70"
|
|
>
|
|
<div class="i-lucide-music h-2.5 w-2.5" />
|
|
{{ song.title }}
|
|
</span>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
const props = defineProps<{
|
|
chapterSlug: string
|
|
}>()
|
|
|
|
const bookData = useBookData()
|
|
await bookData.init()
|
|
|
|
const songs = computed(() => bookData.getChapterSongs(props.chapterSlug))
|
|
</script>
|