Mop/bookshelf
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix front pagination and search

Browse Source
This commit is contained in:
Julien Aldon
2026-01-13 15:26:11 +01:00
parent 959d4e7281
commit d5fc8142b2
5 changed files with 29 additions and 29 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
front/src/components/PaginationFooter.vue
View File

@@ -4,18 +4,18 @@
<button class="page" v-for="index in $store.getters.getBookCurrentPage + 1" :key="index">{{ index }}</button>
</footer>
<footer v-else>
<button @click="$store.dispatch('fetchPageBooks', {page: 0, nooption: false})" class="page"> {{ '<<' }} </button>
<button @click="$store.dispatch('fetchPageBooks', {page: 0, nooption: false, ...$route.query})" class="page"> {{ '<<' }} </button>
<button
class="page"
:class="{ 'red': $store.getters.getBookCurrentPage - Math.max(0, Math.min($store.getters.getBookCurrentPage - 2, $store.getters.getBookPageNb - 5)) === index}"
v-for="(n, index) in (Math.max(5, Math.min($store.getters.getBookCurrentPage + 2, $store.getters.getBookPageNb)) - Math.max(0, Math.min($store.getters.getBookCurrentPage - 2, $store.getters.getBookPageNb - 5)))"
:key="index"
@click="$store.dispatch('fetchPageBooks', {page: Math.max(0, Math.min($store.getters.getBookCurrentPage - 2, $store.getters.getBookPageNb - 5)) + index, nooption: false})">
@click="$store.dispatch('fetchPageBooks', {page: Math.max(0, Math.min($store.getters.getBookCurrentPage - 2, $store.getters.getBookPageNb - 5)) + index, nooption: false, ...$route.query})">
{{ Math.max(0, Math.min($store.getters.getBookCurrentPage - 2, $store.getters.getBookPageNb - 5)) + index }}
</button>
<p v-if="$store.getters.getBookCurrentPage !== $store.getters.getBookPageNb" class="elipsis">...</p>
<button v-if="$store.getters.getBookCurrentPage !== $store.getters.getBookPageNb" class="page" @click="$store.dispatch('fetchPageBooks', {page: $store.getters.getBookPageNb, nooption: false})">{{ $store.getters.getBookPageNb }}</button>
<button @click="$store.dispatch('fetchPageBooks', {page: $store.getters.getBookPageNb, nooption: false})" class="page"> >> </button>
<button v-if="$store.getters.getBookCurrentPage !== $store.getters.getBookPageNb" class="page" @click="$store.dispatch('fetchPageBooks', {page: $store.getters.getBookPageNb, nooption: false, ...$route.query})">{{ $store.getters.getBookPageNb }}</button>
<button @click="$store.dispatch('fetchPageBooks', {page: $store.getters.getBookPageNb, nooption: false, ...$route.query})" class="page"> >> </button>
</footer>
</div>
</template>

2
front/src/components/SearchHeader.vue
View File

@@ -5,6 +5,7 @@
</div>
</template>
<script>
import router from '@/router';
export default {
props: {
page: String,
@@ -12,6 +13,7 @@ export default {
watch: {
search: function() {
this.$emit('changeSearch', this.search);
router.push({ path: 'books', query: { search: this.search }})
this.$store.dispatch('fetchPage'+this.page, {page: 0, nooption: false, search: this.search, order: this.order})
}
},

4
front/src/config.js
View File

@@ -1,5 +1,5 @@
const ROOT_FQDN = 'https://bookshelf.aldon.fr/api';
// const ROOT_FQDN = 'http://localhost:8000/api';
// const ROOT_FQDN = 'https://bookshelf.aldon.fr/api';
const ROOT_FQDN = 'http://localhost:8000/api';
export {
ROOT_FQDN