Use different pagination for featured events and searched events

Closes #894

Signed-off-by: Thomas Citharel <tcit@tcit.fr>
This commit is contained in:
Thomas Citharel 2021-11-13 19:18:20 +01:00
parent 5fa9eb68b1
commit f3b97e44e5
No known key found for this signature in database
GPG key ID: A061B9DDE0CA0773

View file

@ -101,11 +101,11 @@
<b-loading :active.sync="$apollo.loading"></b-loading> <b-loading :active.sync="$apollo.loading"></b-loading>
<h2 class="title">{{ $t("Featured events") }}</h2> <h2 class="title">{{ $t("Featured events") }}</h2>
<div v-if="events.elements.length > 0"> <div v-if="events.elements.length > 0">
<multi-card :events="events.elements" /> <multi-card class="my-4" :events="events.elements" />
<div class="pagination" v-if="events.total > EVENT_PAGE_LIMIT"> <div class="pagination" v-if="events.total > EVENT_PAGE_LIMIT">
<b-pagination <b-pagination
:total="events.total" :total="events.total"
v-model="eventPage" v-model="featuredEventPage"
:per-page="EVENT_PAGE_LIMIT" :per-page="EVENT_PAGE_LIMIT"
:aria-next-label="$t('Next page')" :aria-next-label="$t('Next page')"
:aria-previous-label="$t('Previous page')" :aria-previous-label="$t('Previous page')"
@ -251,7 +251,7 @@ const GEOHASH_DEPTH = 9; // put enough accuracy, radius will be used anyway
query: FETCH_EVENTS, query: FETCH_EVENTS,
variables() { variables() {
return { return {
page: this.eventPage, page: this.featuredEventPage,
limit: EVENT_PAGE_LIMIT, limit: EVENT_PAGE_LIMIT,
}; };
}, },
@ -391,6 +391,17 @@ export default class Search extends Vue {
this.search = searchQuery; this.search = searchQuery;
} }
get featuredEventPage(): number {
return parseInt(this.$route.query.featuredEventPage as string, 10) || 1;
}
set featuredEventPage(page: number) {
this.$router.push({
name: this.$route.name || RouteName.SEARCH,
query: { ...this.$route.query, featuredEventPage: page.toString() },
});
}
get eventPage(): number { get eventPage(): number {
return parseInt(this.$route.query.eventPage as string, 10) || 1; return parseInt(this.$route.query.eventPage as string, 10) || 1;
} }