From 8950988dea539a230f6e72f5eceee617a48b1d2f Mon Sep 17 00:00:00 2001
From: Renon <renon@disroot.org>
Date: Mon, 30 Jul 2018 14:03:07 +0200
Subject: [PATCH] add duration in track table
---
changes/changelog.d/461.enhancement | 1 +
front/src/components/audio/track/Row.vue | 20 ++++++++++++++++++--
front/src/components/audio/track/Table.vue | 5 +++--
3 files changed, 22 insertions(+), 4 deletions(-)
create mode 100644 changes/changelog.d/461.enhancement
diff --git a/changes/changelog.d/461.enhancement b/changes/changelog.d/461.enhancement
new file mode 100644
index 00000000..63cd0193
--- /dev/null
+++ b/changes/changelog.d/461.enhancement
@@ -0,0 +1 @@
+Display track duration in track tables (#461)
diff --git a/front/src/components/audio/track/Row.vue b/front/src/components/audio/track/Row.vue
index cf79267c..91b10c32 100644
--- a/front/src/components/audio/track/Row.vue
+++ b/front/src/components/audio/track/Row.vue
@@ -15,7 +15,7 @@
{{ track.title }}
</router-link>
</td>
- <td colspan="6">
+ <td colspan="4">
<router-link v-if="track.artist.id === albumArtist.id" class="artist discrete link" :to="{name: 'library.artists.detail', params: {id: track.artist.id }}">
{{ track.artist.name }}
</router-link>
@@ -29,11 +29,17 @@
</router-link>
</template>
</td>
- <td colspan="6">
+ <td colspan="4">
<router-link class="album discrete link" :to="{name: 'library.albums.detail', params: {id: track.album.id }}">
{{ track.album.title }}
</router-link>
</td>
+ <td colspan="4" v-if="file && file.duration">
+ {{ time.parse(file.duration) }}
+ </td>
+ <td colspan="4" v-else>
+ <translate>N/A</translate>
+ </td>
<td>
<track-favorite-icon class="favorite-icon" :track="track"></track-favorite-icon>
<track-playlist-icon
@@ -44,6 +50,8 @@
</template>
<script>
+
+import time from '@/utils/time'
import TrackFavoriteIcon from '@/components/favorites/TrackFavoriteIcon'
import TrackPlaylistIcon from '@/components/playlists/TrackPlaylistIcon'
import PlayButton from '@/components/audio/PlayButton'
@@ -59,6 +67,11 @@ export default {
TrackPlaylistIcon,
PlayButton
},
+ data () {
+ return {
+ time
+ }
+ },
computed: {
albumArtist () {
if (this.artist) {
@@ -66,6 +79,9 @@ export default {
} else {
return this.track.album.artist
}
+ },
+ file () {
+ return this.track.files[0]
}
}
}
diff --git a/front/src/components/audio/track/Table.vue b/front/src/components/audio/track/Table.vue
index 03e9398f..2b49284c 100644
--- a/front/src/components/audio/track/Table.vue
+++ b/front/src/components/audio/track/Table.vue
@@ -5,8 +5,9 @@
<th></th>
<th></th>
<th colspan="6"><translate>Title</translate></th>
- <th colspan="6"><translate>Artist</translate></th>
- <th colspan="6"><translate>Album</translate></th>
+ <th colspan="4"><translate>Artist</translate></th>
+ <th colspan="4"><translate>Album</translate></th>
+ <th colspan="4"><translate>Duration</translate></th>
<th></th>
</tr>
</thead>
--
GitLab