36 lines
938 B
Vue
36 lines
938 B
Vue
<template>
|
|
<div class="w-full flex flex-col items-center">
|
|
<div @click="uiStore.closeBox()" class="cursor-pointer">
|
|
<logo />
|
|
</div>
|
|
<main>
|
|
<boxes />
|
|
</main>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup>
|
|
import { useUiStore } from '~/store/ui'
|
|
import { useDataStore } from '~/store/data'
|
|
import { usePlayerStore } from '~/store/player'
|
|
|
|
const uiStore = useUiStore()
|
|
const dataStore = useDataStore()
|
|
const playerStore = usePlayerStore()
|
|
const route = useRoute()
|
|
|
|
onMounted(async () => {
|
|
await dataStore.loadData()
|
|
const idParam = Array.isArray(route.params.id) ? route.params.id[0] : route.params.id
|
|
const id = Number(idParam)
|
|
if (!Number.isNaN(id)) {
|
|
const track = dataStore.tracks.find((t) => t.id === id)
|
|
if (track) {
|
|
// Open the box containing this track without changing global UI flow/animations
|
|
uiStore.selectBox(track.boxId)
|
|
playerStore.playTrack(track)
|
|
}
|
|
}
|
|
})
|
|
</script>
|