2017-06-23 21:00:42 +00:00
|
|
|
<template>
|
2018-11-19 22:33:22 +00:00
|
|
|
<main v-title="labels.title">
|
|
|
|
<section class="ui vertical stripe segment">
|
2018-02-20 23:05:33 +00:00
|
|
|
<div class="ui stackable three column grid">
|
2017-06-23 21:00:42 +00:00
|
|
|
<div class="column">
|
2019-12-26 10:38:26 +00:00
|
|
|
<track-widget :url="'history/listenings/'" :filters="{scope: scope, ordering: '-creation_date'}">
|
2019-03-08 11:37:02 +00:00
|
|
|
<template slot="title"><translate translate-context="Content/Home/Title">Recently listened</translate></template>
|
2018-07-17 11:09:13 +00:00
|
|
|
</track-widget>
|
2017-06-23 21:00:42 +00:00
|
|
|
</div>
|
|
|
|
<div class="column">
|
2019-12-26 10:38:26 +00:00
|
|
|
<track-widget :url="'favorites/tracks/'" :filters="{scope: scope, ordering: '-creation_date'}">
|
2019-03-08 11:37:02 +00:00
|
|
|
<template slot="title"><translate translate-context="Content/Home/Title">Recently favorited</translate></template>
|
2018-07-17 11:09:13 +00:00
|
|
|
</track-widget>
|
2017-06-23 21:00:42 +00:00
|
|
|
</div>
|
2018-02-20 23:05:33 +00:00
|
|
|
<div class="column">
|
2019-12-26 10:38:26 +00:00
|
|
|
<playlist-widget :url="'playlists/'" :filters="{scope: scope, playable: true, ordering: '-modification_date'}">
|
2019-03-18 09:07:58 +00:00
|
|
|
<template slot="title"><translate translate-context="*/*/*">Playlists</translate></template>
|
2018-07-17 11:09:13 +00:00
|
|
|
</playlist-widget>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div class="ui section hidden divider"></div>
|
2019-03-06 16:40:26 +00:00
|
|
|
<div class="ui stackable one column grid">
|
|
|
|
<div class="column">
|
2019-12-26 10:38:26 +00:00
|
|
|
<album-widget :filters="{scope: scope, playable: true, ordering: '-creation_date'}">
|
2019-03-08 11:37:02 +00:00
|
|
|
<template slot="title"><translate translate-context="Content/Home/Title">Recently added</translate></template>
|
2018-07-17 11:09:13 +00:00
|
|
|
</album-widget>
|
2018-02-20 23:05:33 +00:00
|
|
|
</div>
|
2017-06-23 21:00:42 +00:00
|
|
|
</div>
|
2018-11-19 22:33:22 +00:00
|
|
|
</section>
|
|
|
|
</main>
|
2017-06-23 21:00:42 +00:00
|
|
|
</template>
|
|
|
|
|
|
|
|
<script>
|
2018-11-19 22:33:22 +00:00
|
|
|
import axios from "axios"
|
|
|
|
import Search from "@/components/audio/Search"
|
|
|
|
import logger from "@/logging"
|
|
|
|
import ArtistCard from "@/components/audio/artist/Card"
|
|
|
|
import TrackWidget from "@/components/audio/track/Widget"
|
|
|
|
import AlbumWidget from "@/components/audio/album/Widget"
|
|
|
|
import PlaylistWidget from "@/components/playlists/Widget"
|
2017-06-23 21:00:42 +00:00
|
|
|
|
2018-11-19 22:33:22 +00:00
|
|
|
const ARTISTS_URL = "artists/"
|
2017-06-23 21:00:42 +00:00
|
|
|
|
|
|
|
export default {
|
2018-11-19 22:33:22 +00:00
|
|
|
name: "library",
|
2019-12-26 10:38:26 +00:00
|
|
|
props: {
|
|
|
|
scope: {default: 'all'}
|
|
|
|
},
|
2017-06-23 21:00:42 +00:00
|
|
|
components: {
|
|
|
|
Search,
|
|
|
|
ArtistCard,
|
2018-07-17 11:09:13 +00:00
|
|
|
TrackWidget,
|
|
|
|
AlbumWidget,
|
|
|
|
PlaylistWidget
|
2017-06-23 21:00:42 +00:00
|
|
|
},
|
2018-11-19 22:33:22 +00:00
|
|
|
data() {
|
2017-06-23 21:00:42 +00:00
|
|
|
return {
|
|
|
|
artists: [],
|
2019-12-26 10:38:26 +00:00
|
|
|
isLoadingArtists: false,
|
2017-06-23 21:00:42 +00:00
|
|
|
}
|
|
|
|
},
|
2018-11-19 22:33:22 +00:00
|
|
|
created() {
|
2017-06-23 21:00:42 +00:00
|
|
|
this.fetchArtists()
|
|
|
|
},
|
2018-07-01 19:50:50 +00:00
|
|
|
computed: {
|
2018-11-19 22:33:22 +00:00
|
|
|
labels() {
|
2018-07-01 19:50:50 +00:00
|
|
|
return {
|
2019-02-14 09:40:20 +00:00
|
|
|
title: this.$pgettext('Head/Home/Title', "Home")
|
2018-07-01 19:50:50 +00:00
|
|
|
}
|
|
|
|
}
|
|
|
|
},
|
2017-06-23 21:00:42 +00:00
|
|
|
methods: {
|
2018-11-19 22:33:22 +00:00
|
|
|
fetchArtists() {
|
2017-06-23 21:00:42 +00:00
|
|
|
var self = this
|
|
|
|
this.isLoadingArtists = true
|
|
|
|
let params = {
|
2018-11-19 22:33:22 +00:00
|
|
|
ordering: "-creation_date",
|
2018-09-06 18:35:02 +00:00
|
|
|
playable: true
|
2017-06-23 21:00:42 +00:00
|
|
|
}
|
|
|
|
let url = ARTISTS_URL
|
2018-11-19 22:33:22 +00:00
|
|
|
logger.default.time("Loading latest artists")
|
|
|
|
axios.get(url, { params: params }).then(response => {
|
2017-06-23 21:00:42 +00:00
|
|
|
self.artists = response.data.results
|
2018-11-19 22:33:22 +00:00
|
|
|
logger.default.timeEnd("Loading latest artists")
|
2017-06-23 21:00:42 +00:00
|
|
|
self.isLoadingArtists = false
|
|
|
|
})
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
</script>
|
|
|
|
|
|
|
|
<!-- Add "scoped" attribute to limit CSS to this component only -->
|
|
|
|
<style scoped>
|
|
|
|
</style>
|