Fixed #33: sort by track position in album in API vy default, also reuse that information on frontend side

front/src/components/audio/album/Card.vue

@@ -22,6 +22,9 @@
                 </td>
                 <td colspan="6">
                   <router-link class="track discrete link" :to="{name: 'library.track', params: {id: track.id }}">
+                    <template v-if="track.position">
+                      {{ track.position }}.
+                    </template>
                     {{ track.title }}
                   </router-link>
                 </td>

front/src/components/audio/track/Table.vue

@@ -20,9 +20,12 @@
           <img class="ui mini image" v-else src="../../..//assets/audio/default-cover.png">
         </td>
         <td colspan="6">
-            <router-link class="track" :to="{name: 'library.track', params: {id: track.id }}">
-              {{ track.title }}
-            </router-link>
+          <router-link class="track" :to="{name: 'library.track', params: {id: track.id }}">
+            <template v-if="displayPosition && track.position">
+              {{ track.position }}.
+            </template>
+            {{ track.title }}
+          </router-link>
         </td>
         <td colspan="6">
           <router-link class="artist discrete link" :to="{name: 'library.artist', params: {id: track.artist.id }}">
@@ -46,7 +49,10 @@ import TrackFavoriteIcon from '@/components/favorites/TrackFavoriteIcon'
 import PlayButton from '@/components/audio/PlayButton'
 
 export default {
-  props: ['tracks'],
+  props: {
+    tracks: {type: Array, required: true},
+    displayPosition: {type: Boolean, default: false}
+  },
   components: {
     TrackFavoriteIcon,
     PlayButton

front/src/components/library/Album.vue

@@ -34,7 +34,7 @@
       </div>
       <div class="ui vertical stripe segment">
         <h2>Tracks</h2>
-        <track-table v-if="album" :tracks="album.tracks"></track-table>
+        <track-table v-if="album" display-position="true" :tracks="album.tracks"></track-table>
       </div>
     </template>
   </div>