fix pagination buttons for admin/user and notifications

This commit is contained in:
Moriz Wahl 2020-09-21 19:07:04 +02:00
parent 08aaf9c7a6
commit e7c76c1622
2 changed files with 17 additions and 11 deletions

View File

@ -21,8 +21,9 @@
<template> <template>
<pagination-buttons <pagination-buttons
v-if="activeResourceCount > pageSize" v-if="activeResourceCount > pageSize"
:hasMoreResults="hasMoreResults" :hasNext="hasNext"
:hasPreviousResult="hasPreviousResult" :showPageCounter="true"
:hasPrevious="hasPrevious"
:activePage="activePage" :activePage="activePage"
:activeResourceCount="activeResourceCount" :activeResourceCount="activeResourceCount"
@back="previousResults" @back="previousResults"
@ -53,9 +54,10 @@
<pagination-buttons <pagination-buttons
v-if="activeResourceCount > pageSize" v-if="activeResourceCount > pageSize"
:hasMoreResults="hasMoreResults" :hasNext="hasNext"
:hasPreviousResult="hasPreviousResult" :hasPrevious="hasPrevious"
:activePage="activePage" :activePage="activePage"
:showPageCounter="true"
:activeResourceCount="activeResourceCount" :activeResourceCount="activeResourceCount"
@back="previousResults" @back="previousResults"
@next="nextResults" @next="nextResults"
@ -161,13 +163,13 @@ export default {
}, },
] ]
}, },
hasPreviousResult() { hasPrevious() {
if (this.activeTab === 'Post') return this.postsOffset > 0 if (this.activeTab === 'Post') return this.postsOffset > 0
if (this.activeTab === 'User') return this.usersOffset > 0 if (this.activeTab === 'User') return this.usersOffset > 0
if (this.activeTab === 'Hashtag') return this.hashtagsOffset > 0 if (this.activeTab === 'Hashtag') return this.hashtagsOffset > 0
return false return false
}, },
hasMoreResults() { hasNext() {
if (this.activeTab === 'Post') return (this.postPage + 1) * this.pageSize < this.postCount if (this.activeTab === 'Post') return (this.postPage + 1) * this.pageSize < this.postCount
if (this.activeTab === 'User') return (this.userPage + 1) * this.pageSize < this.userCount if (this.activeTab === 'User') return (this.userPage + 1) * this.pageSize < this.userCount
if (this.activeTab === 'Hashtag') if (this.activeTab === 'Hashtag')

View File

@ -1,20 +1,20 @@
<template> <template>
<div class="pagination-buttons"> <div class="pagination-buttons">
<base-button <base-button
v-if="hasPreviousResult" v-if="hasPrevious"
@click="$emit('back')" @click="$emit('back')"
icon="arrow-left" icon="arrow-left"
circle circle
class="previous-button" class="previous-button"
/> />
<span class="pagination-pageCount"> <span v-if="showPageCounter" class="pagination-pageCount">
{{ $t('search.page') }} {{ activePage + 1 }} / {{ $t('search.page') }} {{ activePage + 1 }} /
{{ Math.floor((activeResourceCount - 1) / pageSize) + 1 }} {{ Math.floor((activeResourceCount - 1) / pageSize) + 1 }}
</span> </span>
<base-button <base-button
v-if="hasMoreResults" v-if="hasNext"
@click="$emit('next')" @click="$emit('next')"
icon="arrow-right" icon="arrow-right"
circle circle
@ -31,11 +31,11 @@ export default {
type: Number, type: Number,
default: 24, default: 24,
}, },
hasMoreResults: { hasNext: {
type: Boolean, type: Boolean,
default: false, default: false,
}, },
hasPreviousResult: { hasPrevious: {
type: Boolean, type: Boolean,
}, },
activePage: { activePage: {
@ -50,6 +50,10 @@ export default {
type: Number, type: Number,
default: 0, default: 0,
}, },
showPageCounter: {
type: Boolean,
default: false,
},
}, },
} }
</script> </script>