jean/airsonic-refix
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

add play button to album page

Browse Source
This commit is contained in:
Thomas Amland 2020-08-15 09:32:59 +02:00
parent 8fb1f8db78
commit 4e0f49792c
1 changed files with 20 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

23
src/library/album/AlbumDetails.vue
View File

@ -1,8 +1,10 @@
<template> <template>
<div v-if="album"> <div v-if="album">
<div class="d-flex mb-3"> <div class="d-flex mb-3">
<b-img height="300" width="300" fluid :src="album.image" /> <div class="mr-3 mr-md-4 image-container">
<div class="ml-3 ml-md-4"> <b-img height="300" width="300" fluid :src="album.image" />
</div>
<div>
<h1>{{ album.name }}</h1> <h1>{{ album.name }}</h1>
<p> <p>
by by
@ -12,6 +14,11 @@
<span v-if="album.year"> · {{ album.year }}</span> <span v-if="album.year"> · {{ album.year }}</span>
<span v-if="album.genre"> · {{ album.genre }}</span> <span v-if="album.genre"> · {{ album.genre }}</span>
</p> </p>
<div class="text-nowrap">
<b-btn variant="secondary" class="mr-2" @click="play">
<Icon icon="play-fill" /> Play
</b-btn>
</div>
</div> </div>
</div> </div>
<div class="row"> <div class="row">
@ -22,7 +29,7 @@
</div> </div>
</template> </template>
<style scoped> <style scoped>
img { .image-container {
max-width: 50%; max-width: 50%;
} }
</style> </style>
@ -45,6 +52,16 @@
}, },
async mounted() { async mounted() {
this.album = await this.$api.getAlbumDetails(this.id) this.album = await this.$api.getAlbumDetails(this.id)
},
methods: {
play() {
if (this.album?.tracks) {
return this.$store.dispatch('player/playQueue', {
index: 0,
queue: this.album.tracks,
})
}
},
} }
}) })
</script> </script>