216 lines
7.4 KiB
JavaScript
216 lines
7.4 KiB
JavaScript
if (typeof isPublicCollection !== "undefined") {
|
|
Vue.createApp({
|
|
data() {
|
|
return {
|
|
loading: false,
|
|
moreFilters: false,
|
|
items: [],
|
|
total: 0,
|
|
// eslint-disable-next-line no-undef
|
|
page: query.page || 1,
|
|
totalPages: 1,
|
|
limit: 16,
|
|
artist: "",
|
|
format: "",
|
|
year: "",
|
|
genre: "",
|
|
style: "",
|
|
sortOrder: "artists_sort-asc",
|
|
sort: "artists_sort",
|
|
order: "asc",
|
|
itemId: null,
|
|
showModalDelete: false,
|
|
showModalShare: false,
|
|
// eslint-disable-next-line no-undef
|
|
shareLink: `${protocol}//${host}/collection/${userId}`,
|
|
// eslint-disable-next-line no-undef
|
|
isPublicCollection,
|
|
// eslint-disable-next-line no-undef
|
|
query,
|
|
};
|
|
},
|
|
created() {
|
|
this.fetch();
|
|
},
|
|
methods: {
|
|
fetch() {
|
|
this.loading = true;
|
|
this.total = 0;
|
|
|
|
const queryString = window.location.search;
|
|
const urlParams = new URLSearchParams(queryString);
|
|
const entries = urlParams.entries();
|
|
|
|
const sortOrder = {
|
|
sort: "artists_sort",
|
|
order: "asc",
|
|
};
|
|
|
|
// eslint-disable-next-line no-restricted-syntax
|
|
for (const entry of entries) {
|
|
const [key, value] = entry;
|
|
switch (key) {
|
|
case "artists_sort":
|
|
this.artist = value;
|
|
break;
|
|
default:
|
|
if (["order", "sort"].indexOf(key) !== -1) {
|
|
sortOrder[key] = value;
|
|
}
|
|
this[key] = value;
|
|
}
|
|
}
|
|
|
|
this.sortOrder = `${sortOrder.sort}-${sortOrder.order}`;
|
|
|
|
let url = `/api/v1/albums?page=${this.page}&limit=${this.limit}&sort=${this.sort}&order=${this.order}`;
|
|
if (this.artist) {
|
|
url += `&artists_sort=${this.artist.replace("&", "%26")}`;
|
|
}
|
|
if (this.format) {
|
|
url += `&format=${this.format.replace("&", "%26")}`;
|
|
}
|
|
if (this.year) {
|
|
url += `&year=${this.year}`;
|
|
}
|
|
if (this.genre) {
|
|
url += `&genre=${this.genre.replace("&", "%26")}`;
|
|
}
|
|
if (this.style) {
|
|
url += `&style=${this.style.replace("&", "%26")}`;
|
|
}
|
|
|
|
axios
|
|
.get(url)
|
|
.then((response) => {
|
|
this.items = response.data.rows;
|
|
this.total = response.data.count || 0;
|
|
this.totalPages =
|
|
parseInt(response.data.count / this.limit, 10) +
|
|
(response.data.count % this.limit > 0 ? 1 : 0);
|
|
})
|
|
.catch((err) => {
|
|
showToastr(
|
|
err.response?.data?.message ||
|
|
"Impossible de charger votre collection"
|
|
);
|
|
})
|
|
.finally(() => {
|
|
this.loading = false;
|
|
});
|
|
},
|
|
changeUrl() {
|
|
let url = `?page=${this.page}&limit=${this.limit}&sort=${this.sort}&order=${this.order}`;
|
|
if (this.artist) {
|
|
url += `&artists_sort=${this.artist.replace("&", "%26")}`;
|
|
}
|
|
if (this.format) {
|
|
url += `&format=${this.format.replace("&", "%26")}`;
|
|
}
|
|
if (this.year) {
|
|
url += `&year=${this.year}`;
|
|
}
|
|
if (this.genre) {
|
|
url += `&genre=${this.genre.replace("&", "%26")}`;
|
|
}
|
|
if (this.style) {
|
|
url += `&style=${this.style.replace("&", "%26")}`;
|
|
}
|
|
|
|
window.location.href = url;
|
|
},
|
|
next(event) {
|
|
event.preventDefault();
|
|
|
|
this.page += 1;
|
|
|
|
this.changeUrl();
|
|
},
|
|
previous(event) {
|
|
event.preventDefault();
|
|
|
|
this.page -= 1;
|
|
|
|
this.changeUrl();
|
|
},
|
|
goTo(page) {
|
|
this.page = page;
|
|
|
|
this.changeUrl();
|
|
},
|
|
changeSort() {
|
|
const [sort, order] = this.sortOrder.split("-");
|
|
this.sort = sort;
|
|
this.order = order;
|
|
this.page = 1;
|
|
|
|
this.changeUrl();
|
|
},
|
|
changeFilter() {
|
|
this.page = 1;
|
|
|
|
this.changeUrl();
|
|
},
|
|
showMoreFilters() {
|
|
this.moreFilters = !this.moreFilters;
|
|
},
|
|
toggleModal() {
|
|
this.showModalDelete = !this.showModalDelete;
|
|
},
|
|
toggleModalShare() {
|
|
this.showModalShare = !this.showModalShare;
|
|
},
|
|
showConfirmDelete(itemId) {
|
|
this.itemId = itemId;
|
|
this.toggleModal();
|
|
},
|
|
deleteItem() {
|
|
axios
|
|
.delete(`/api/v1/albums/${this.itemId}`)
|
|
.then(() => {
|
|
this.fetch();
|
|
})
|
|
.catch((err) => {
|
|
showToastr(
|
|
err.response?.data?.message ||
|
|
"Impossible de supprimer cet album"
|
|
);
|
|
})
|
|
.finally(() => {
|
|
this.toggleModal();
|
|
});
|
|
},
|
|
shareCollection() {
|
|
axios
|
|
.patch(`/api/v1/me`, {
|
|
isPublicCollection: !this.isPublicCollection,
|
|
})
|
|
.then((res) => {
|
|
this.isPublicCollection = res.data.isPublicCollection;
|
|
|
|
if (this.isPublicCollection) {
|
|
showToastr(
|
|
"Votre collection est désormais publique",
|
|
true
|
|
);
|
|
} else {
|
|
showToastr(
|
|
"Votre collection n'est plus partagée",
|
|
true
|
|
);
|
|
}
|
|
})
|
|
.catch((err) => {
|
|
showToastr(
|
|
err.response?.data?.message ||
|
|
"Impossible de supprimer cet album"
|
|
);
|
|
})
|
|
.finally(() => {
|
|
this.toggleModalShare();
|
|
});
|
|
},
|
|
},
|
|
}).mount("#ma-collection");
|
|
}
|