From 19e557d3ef2e2dcbcbbf662e6a95668f69e3f921 Mon Sep 17 00:00:00 2001
From: pestov <pestov@sub.uni-goettingen.de>
Date: Tue, 27 Jul 2021 11:34:44 +0000
Subject: [PATCH] fix: pages amount display
---
src/.vuepress/components/SearchPage.vue | 35 ++++++++++++-------
src/.vuepress/components/SearchResultList.vue | 11 ++----
2 files changed, 26 insertions(+), 20 deletions(-)
diff --git a/src/.vuepress/components/SearchPage.vue b/src/.vuepress/components/SearchPage.vue
index fb171d2..cd12905 100644
--- a/src/.vuepress/components/SearchPage.vue
+++ b/src/.vuepress/components/SearchPage.vue
@@ -1,13 +1,15 @@
<template>
<div>
<SearchInput @search="onSearchInput" />
-
- <SearchResultList
- v-if="items.length > 0"
- :items="items"
- @page-change="onPageChange"
- />
- <SearchResultEmpty v-else />
+ <SearchResultList :items="items" />
+ <div class="text-center">
+ <v-pagination
+ v-if="items.length > 0"
+ v-model="page"
+ :length="pagesAmount"
+ :total-visible="7"
+ ></v-pagination>
+ </div>
</div>
</template>
@@ -25,7 +27,9 @@ export default {
return {
query: '',
items: [],
- size: 10
+ size: 20,
+ total: 0,
+ page: 1,
}
},
watch:{
@@ -37,22 +41,29 @@ export default {
},
immediate: true,
},
+ page: function() {
+ const from = this.size * (this.page - 1);
+ this.search(this.query, from, this.size);
+ }
+ },
+ computed: {
+ pagesAmount() {
+ return this.total > 0 ? Math.ceil(this.total / this.size) : 1;
+ }
},
methods: {
onSearchInput(query) {
this.query = query;
+ this.page = 1;
this.search(this.query, 0, this.size)
},
- onPageChange(page) {
- const from = this.size * (page - 1);
- this.search(this.query, from, this.size);
- },
async search(value, from, size) {
const searchResponse = await apiService.search(value, from, size);
if (searchResponse) {
const items = searchResponse.hits?.hits;
if (items) {
+ this.total = searchResponse.hits?.total.value || 0;
this.items = items.map(x=>({...x, searchTerm: value}));
}
}
diff --git a/src/.vuepress/components/SearchResultList.vue b/src/.vuepress/components/SearchResultList.vue
index d87e4ae..7ff9fa2 100644
--- a/src/.vuepress/components/SearchResultList.vue
+++ b/src/.vuepress/components/SearchResultList.vue
@@ -3,6 +3,7 @@
<v-list
two-line
subheader
+ v-if="items.length > 0"
>
<v-list-item v-for="item in items" :key="item.item">
<v-list-item-content>
@@ -21,12 +22,7 @@
</v-list-item-content>
</v-list-item>
</v-list>
- <div class="text-center">
- <v-pagination
- v-model="page"
- :length="6"
- ></v-pagination>
- </div>
+ <SearchResultEmpty v-else />
</div>
</template>
@@ -34,7 +30,6 @@
export default {
data() {
return {
- page: 1,
languagesMap: {
ara: 'Arabic',
syc: 'Syriac',
@@ -50,7 +45,7 @@ export default {
items: {
type: Array,
default: []
- }
+ },
},
methods: {
getLanguage(code) {
--
GitLab