refactor track list column toggle
This commit is contained in:
parent
bf81b34da6
commit
4fca9f417b
@ -9,13 +9,13 @@
|
|||||||
<th class="text-left">
|
<th class="text-left">
|
||||||
Title
|
Title
|
||||||
</th>
|
</th>
|
||||||
<th class="text-left d-none d-lg-table-cell">
|
<th v-if="!noArtist" class="text-left d-none d-lg-table-cell">
|
||||||
Artist
|
Artist
|
||||||
</th>
|
</th>
|
||||||
<th v-if="showAlbum" class="text-left d-none d-md-table-cell">
|
<th v-if="!noAlbum" class="text-left d-none d-md-table-cell">
|
||||||
Album
|
Album
|
||||||
</th>
|
</th>
|
||||||
<th class="text-right d-none d-md-table-cell">
|
<th v-if="!noDuration" class="text-right d-none d-md-table-cell">
|
||||||
Duration
|
Duration
|
||||||
</th>
|
</th>
|
||||||
<th class="text-right">
|
<th class="text-right">
|
||||||
@ -48,7 +48,7 @@
|
|||||||
<small>{{ item.artist }}</small>
|
<small>{{ item.artist }}</small>
|
||||||
</div>
|
</div>
|
||||||
</td>
|
</td>
|
||||||
<td class="d-none d-lg-table-cell">
|
<td v-if="!noArtist" class="d-none d-lg-table-cell">
|
||||||
<template v-if="item.artistId">
|
<template v-if="item.artistId">
|
||||||
<router-link :to="{name: 'artist', params: {id: item.artistId}}">
|
<router-link :to="{name: 'artist', params: {id: item.artistId}}">
|
||||||
{{ item.artist }}
|
{{ item.artist }}
|
||||||
@ -58,12 +58,12 @@
|
|||||||
{{ item.artist }}
|
{{ item.artist }}
|
||||||
</template>
|
</template>
|
||||||
</td>
|
</td>
|
||||||
<td v-if="showAlbum" class="d-none d-md-table-cell">
|
<td v-if="!noAlbum" class="d-none d-md-table-cell">
|
||||||
<router-link :to="{name: 'album', params: {id: item.albumId}}">
|
<router-link :to="{name: 'album', params: {id: item.albumId}}">
|
||||||
{{ item.album }}
|
{{ item.album }}
|
||||||
</router-link>
|
</router-link>
|
||||||
</td>
|
</td>
|
||||||
<td class="text-right d-none d-md-table-cell">
|
<td v-if="!noDuration" class="text-right d-none d-md-table-cell">
|
||||||
{{ $formatDuration(item.duration) }}
|
{{ $formatDuration(item.duration) }}
|
||||||
</td>
|
</td>
|
||||||
<td class="text-right">
|
<td class="text-right">
|
||||||
@ -100,7 +100,9 @@
|
|||||||
},
|
},
|
||||||
props: {
|
props: {
|
||||||
tracks: { type: Array, required: true },
|
tracks: { type: Array, required: true },
|
||||||
showAlbum: { type: Boolean, default: true },
|
noAlbum: { type: Boolean, default: false },
|
||||||
|
noArtist: { type: Boolean, default: false },
|
||||||
|
noDuration: { type: Boolean, default: false },
|
||||||
},
|
},
|
||||||
computed: {
|
computed: {
|
||||||
...mapState('player', {
|
...mapState('player', {
|
||||||
|
@ -27,7 +27,7 @@
|
|||||||
</div>
|
</div>
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col">
|
<div class="col">
|
||||||
<TrackList :tracks="album.tracks" :show-album="false" />
|
<TrackList :tracks="album.tracks" no-album />
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
Loading…
x
Reference in New Issue
Block a user