issue/19 (#20)

!19

Co-authored-by: dbroqua <contact@darkou.fr>
Reviewed-on: https://git.darkou.fr/dbroqua/MyMusicLibrary/pulls/20
Co-authored-by: Damien Broqua <dbroqua@noreply.localhost>
Co-committed-by: Damien Broqua <dbroqua@noreply.localhost>
This commit is contained in:
Damien Broqua 2022-03-01 16:09:46 +01:00
parent 18d4970ebd
commit a0f9ab1f45
35 changed files with 973 additions and 366 deletions

View file

@ -55,7 +55,7 @@
<span>
<strong>Format : </strong>
<span v-for="(format, index) in item.formats">
{{ format.name }}
{{ format.name }}
<template v-if="format.descriptions">
(<template v-for="(description, j) in format.descriptions">
{{description}}<template v-if="j < format.descriptions.length - 1">, </template>
@ -70,22 +70,20 @@
<span><strong>Style :</strong> <template v-for="(style, index) in item.styles">{{ style }}<template v-if="index < item.styles.length - 1">, </template></template></span>
</div>
</div>
</div>
</div>
</div>
<div class="total">
<strong>Nombre total d'éléments : </strong>{{total}}
</div>
<nav class="pagination" role="navigation" aria-label="Pagination">
<a class="pagination-previous" :class="{'is-disabled': page === 1}" @click="previous">Précédent</a>
<a class="pagination-next" :class="{'is-disabled': !total || (page*limit) >= total}" @click="next">Suivant</a>
<ul class="pagination-list">
<template v-for="p in Array.from({length: totalPages}, (v, i) => (i+1))">
<template v-if="p < 4 || p > (totalPages - 3) || (page - 3) <= p && page + 3 >= p">
<template v-if="p < 2 || p > (totalPages - 1) || (page - 1) <= p && page + 1 >= p">
<li>
<a class="pagination-link" :class="{'is-current': p === page}" @click="goTo(p)" aria-label="Aller à la page {{p}}">{{ p }}</a>
</li>
</template>
<template v-if="(page - 3 - 1 === p && page - 4 > 3) || (page + 4 === p && page + 3 < totalPages - 3)">
<template v-if="(page - 3 === p && page - 2 > 1) || (page + 2 === p && page + 2 < totalPages - 1)">
<li>
<a class="pagination-link is-disabled">…</a>
</li>
@ -118,7 +116,7 @@
total: 0,
page: 1,
totalPages: 1,
limit: 10,
limit: 16,
artist: '',
format: '',
sortOrder: 'artists_sort-asc',