#51 - Avoir une animation au chargement de la liste (#54)

Co-authored-by: dbroqua <contact@darkou.fr>
Reviewed-on: https://git.darkou.fr/dbroqua/MusicTopus/pulls/54
This commit is contained in:
Damien Broqua 2022-08-29 08:13:06 +02:00
parent 080471eb37
commit 1377b4c0c1
6 changed files with 26 additions and 2 deletions

View file

@ -89,6 +89,12 @@
</span>
<div class="grid grid-cols-1 md:grid-cols-2 list hover">
<div class="loader" v-if="loading">
<div class="animation"></div>
<div>
Chargement des données en cours…
</div>
</div>
<div class="item" v-if="!loading" v-for="item in items">
<span class="title">
<a :href="'/ma-collection/' + item._id">{{ item.artists_sort}} - {{ item.title }}</a>
@ -226,6 +232,7 @@
methods: {
fetch() {
this.loading = true;
this.total = 0;
let url = `/api/v1/albums?page=${this.page}&limit=${this.limit}&sort=${this.sort}&order=${this.order}`;
if ( this.artist ) {
@ -247,9 +254,8 @@
axios.get(url)
.then( response => {
this.items = response.data.rows;
this.total = response.data.count;
this.total = response.data.count || 0;
this.totalPages = parseInt(response.data.count / this.limit) + (response.data.count % this.limit > 0 ? 1 : 0);
})
.catch((err) => {
showToastr(err.response?.data?.message || "Impossible de charger votre collection");