diff --git a/src/components/DictionaryView.vue b/src/components/DictionaryView.vue
index 688fbabfd50af2beea20226448557e34b20af6b7..20624d01d1a7b5c8406284894d706c2155e28685 100644
--- a/src/components/DictionaryView.vue
+++ b/src/components/DictionaryView.vue
@@ -4,32 +4,7 @@
<Autocomplete v-on:submit="select_result" :api="get_search_endpoint">
</Autocomplete>
<SearchToolbar v-if="$store.state.showSearchToolbar" @updatePos="update_pos" @updateScope="update_scope"/>
- <v-card rounded="xl">
- <v-container v-if="!article && article_info && total_results > 20"><v-row>
- <v-col cols = 1>Vis</v-col>
- <v-col cols=2>
- <v-select :items="[10,20,30,40,50]"
-/> </v-col><v-col v-if="article.info.meta.nn" cols=6>av {{article_info.meta.bm.total}} treff i
- Bokmålsordboka</v-col>
-
- <v-col cols = 1>Vis</v-col>
- <v-col cols=1>
- <v-text-field
- _items="[10]"
- value="10"
- hide-details
- dense
- rounded
- outlined
- label="test"
- single-line
- type="number"
-/> </v-col><v-col v-if="article.info.meta.nn" cols = "">av {{article_info.meta.nn.total}} treff i
- Nynorskordboka</v-col>
-
- </v-row>
- <v-row><v-col cols="6"><v-pagination :value="2" circle :length="100"></v-pagination></v-col>
- <v-col cols="6"><v-pagination circle :length="100"></v-pagination></v-col></v-row></v-container></v-card>
+
</div>
<SearchResults :results_bm="search_results.bm || []"
@@ -130,10 +105,8 @@ function navigate_to_article(self, source) {
pos_selected: self.pos_selected,
scope: self.scope,
article_info: self.article_info,
- bm_page: self.bm_page,
- nn_page: self.nn_page,
- nn_pp: self.nn_pp,
- bm_pp: self.bm_pp}, '')
+ page: self.page,
+ perPage: self.perPage}, '')
if (source) {
self.$plausible.trackEvent('internal link incoming', {props: {origin: source}})
}
@@ -154,6 +127,7 @@ function load_articles(self, query, offset, n, dict) {
if (n > 0 && (self.lang == dict || self.lang == "bm,nn")) {
article_IDs = article_IDs.slice(offset, offset + n)
+
return Promise.all(article_IDs.map((article_id) => {
return axios.get(`${ARTICLE_ENDPOINT}${dict}/article/${article_id}.json`)
@@ -228,10 +202,8 @@ function navigate_to_query(self, word) {
scope: self.scope,
article_info: self.article_info,
search_results: self.search_results,
- nn_page: self.nn_page,
- bm_page: self.bm_page,
- nn_pp: self.nn_pp,
- bm_pp: self.bm_pp
+ page: self.page,
+ perPage: self.perPage
}, '')
})
@@ -259,10 +231,8 @@ export default {
scope: "w",
pos_selected: "ALL",
article_info: null,
- nn_page: null,
- bm_page: null,
- bm_pp: null,
- nn_pp: null
+ page: null,
+ perPage: null,
}
},
computed: {
@@ -281,18 +251,19 @@ export default {
},
methods: {
total_results: function() {
-
- if (this.search_results) {
- let total = 0
- if (this.search_results.bm) {
- return total += this.search_results.bm.length
- }
- if (this.search_results.nn) {
- return this.search_results.nn.length
- }
- return total
+ if (this.article_info) {
+ let total = 0
+ if (this.article_info.meta.bm) {
+ total += this.article_info.meta.bm.total
+ }
+ if (this.article_info.meta.nn) {
+ total += this.article_info.meta.nn.total
+ }
+ return total
}
+
+
},
connection_error: function(error) {
@@ -382,10 +353,8 @@ export default {
pos_selected: this.pos_selected,
scope: this.scope,
article_info: this.article_info,
- bm_page: this.bm_page,
- nn_page: this.nn_page,
- nn_pp: this.nn_pp,
- bm_pp: this.bm_pp}, '')
+ page: this.page,
+ perPage: this.perPage}, '')
}else{
navigate_to_article(this, item.source)
@@ -401,10 +370,8 @@ export default {
pos_selected: this.pos_selected,
scope: this.scope,
article_info: this.article_info,
- bm_page: this.bm_page,
- nn_page: this.nn_page,
- nn_pp: this.nn_pp,
- bm_pp: this.bm_pp}, '')
+ page: this.page,
+ perPage: this.perPage}, '')
},
return_to_results: function() {
this.article = null
@@ -424,10 +391,8 @@ export default {
if (self.$route.query.scope) {
self.scope = self.$route.query.scope
}
- if (self.$route.query.bm_page) self.bm_page = self.$route.query.bm_page
- if (self.$route.query.nn_page) self.nn_page = self.$route.query.nn_page
- if (self.$route.query.bm_pp) self.bm_pp = self.$route.query.bm_pp
- if (self.$route.query.nn_pp) self.nn_pp = self.$route.query.nn_pp
+ if (self.$route.query.page) self.page = parseInt(self.$route.query.page)
+ if (self.$route.query.perPage) self.perPage = self.$route.query.perPage
Promise.all([
axios.get(ARTICLE_ENDPOINT + 'bm/concepts.json').then(function(response){
@@ -461,10 +426,8 @@ export default {
pos_selected: self.pos_selected,
scope: self.scope,
article_info: self.article_info,
- nn_page: self.nn_page,
- bm_page: self.bm_page,
- nn_pp: self.nn_pp,
- bm_pp: self.bm_pp}, '')
+ page: self.page,
+ perPage: self.perPage}, '')
// words of the month
@@ -496,10 +459,8 @@ export default {
self.pos_selected = event.pos_selected || self.pos_selected
self.scope = event.scope || self.scope
self.error = event.state.error
- self.bm_page = event.state.bm_page,
- self.nn_page = event.state.nn_page,
- self.bm_pp = event.state.bm_pp,
- self.nn_pp = event.state.nn_pp
+ self.page = event.state.page,
+ self.perPage = event.state.perPage
}
}
diff --git a/src/components/SearchResults.vue b/src/components/SearchResults.vue
index 462d944b652aa9479451b1bcd2da22f19312d792..d0d0ec16cd3731d7ff3f911cd895feb67d353ad6 100644
--- a/src/components/SearchResults.vue
+++ b/src/components/SearchResults.vue
@@ -1,9 +1,18 @@
<template>
<section id="search_results">
+ <span flat color="tertiary" class = "pagination" v-if="!$parent.article && $parent.article_info && $parent.total_results() > 20">
+ <v-pagination :v-model="$parent.page" :value="$parent.page" :class="$vuetify.breakpoint.name" :total-visible="$vuetify.breakpoint.smAndDown ? 5 : 8" circle :length="Math.ceil($parent.total_results()/20)"></v-pagination>
+ <span class="result-counts">
+ <span class="total-results">{{$parent.total_results()}} treff </span>
+ <span v-if="$parent.lang=='bm,nn'" class="dict-counts"> | {{$vuetify.breakpoint.mdAndDown? 'bokmål': 'Bokmålsordboka'}}: {{count_bm}} | {{$vuetify.breakpoint.mdAndDown? 'nynorsk': 'Nynorskordboka'}}: {{count_nn}}</span>
+ <span v-if="$parent.lang!='bm,nn'" class="dict-counts"> | {{$t('dicts_inline.'+$parent.lang)}}</span>
+ </span>
+
+
+ </span>
<div class="flex-container" :class="$vuetify.breakpoint.name">
- <ul class="hits" v-if="$vuetify.breakpoint.mobile">
- <li class="results-count"><span>Bokmål: {{count_bm}} treff</span><span> Nynorsk: {{count_nn}} treff</span></li>
+ <ul class="hits" v-if="$vuetify.breakpoint.smAndDown">
<li class="article_container" v-for="(result, index) in both_dicts" :key="index + both_hash" tabindex="-1">
<Article
:article="result"
@@ -12,8 +21,7 @@
</Article>
</li>
</ul>
- <ul class="hits" v-if="!$vuetify.breakpoint.mobile && count_bm">
- <li class="results-count">Bokmålsordboka: {{count_bm}} treff</li>
+ <ul class="hits" v-if="!$vuetify.breakpoint.smAndDown && count_bm">
<li class="article_container" v-for="(result, index) in results_bm" :key="index + bm_hash" tabindex="-1">
<Article
:article="result"
@@ -22,8 +30,7 @@
</Article>
</li>
</ul>
- <ul class="hits" v-if="!$vuetify.breakpoint.mobile && count_nn">
- <li class="results-count">Nynorskorboka: {{count_nn}} treff</li>
+ <ul class="hits" v-if="!$vuetify.breakpoint.smAndDown && count_nn">
<li class="article_container" v-for="(result, index) in results_nn" :key="index + nn_hash" tabindex="-1">
<Article
:article="result"
@@ -169,4 +176,32 @@ export default {
article.righ_hand_column div.inflection-wrapper {
right: -35px;
}
+
+.pagination {
+ margin-left: 10px;
+ display: flex;
+ flex-wrap: wrap;
+
+}
+
+ .total-results {
+ font-weight: bold;
+ color: var(--v-primary-base);
+ }
+
+ .result-counts {
+ padding: 10px;
+ justify-content: right !important;
+ }
+
+ .total-results, .dict-counts {
+ white-space: nowrap;
+ }
+
+ .pagination ul {
+ padding-inline-start: 0px !important;
+ justify-content: right;
+ }
+
+
</style>