display number of results

src/components/DictionaryView.vue

@@ -38,6 +38,7 @@
     <SearchResults :hits="search_results"
                     :lang="lang"
                     :key="lang"
+                    :meta="this.meta"
                     @article-click="article_link_click"
                     @details-click="details_click"
                     v-if="search_results.length && ! waiting && ! article" />
@@ -125,7 +126,7 @@ function navigate_to_article(self, source) {
   })
   .then(function(response){
     self.waiting_for_articles = false
-    history.replaceState({article: self.article, search_results: [], lang: self.lang, error: self.error}, '')
+    history.replaceState({article: self.article, search_results: [], lang: self.lang, error: self.error, meta: self.meta}, '')
     if (source) {
       self.$plausible.trackEvent('internal link incoming', {props: {origin: source}})
     }
@@ -166,7 +167,8 @@ function navigate_to_query(self, word) {
   
   // Get article IDs
   api.get('articles?', {params: {w: query.match || query.q, dict: self.lang, scope: "w"}}).then((response) => {
-            let article_ids = response.data
+            self.meta = response.data.meta
+            let article_ids = response.data["articles"]
             let unwrapped = []
             for (const d in article_ids) {
                 article_ids[d].forEach(i => unwrapped.push({
@@ -218,7 +220,8 @@ function navigate_to_query(self, word) {
                 article: self.article,
                 search_results: self.search_results,
                 lang: self.lang,
-                error: self.error
+                error: self.error,
+                meta: self.meta
               }, '')
             })
         }).catch(error =>{
@@ -242,6 +245,7 @@ export default {
       monthly_nn: null,
       event: null,
       previous: this.$route.fullPath,
+      meta: null
     }
   },
   computed: {
@@ -304,7 +308,7 @@ export default {
     article_link_click: function(item) {
       if (this.article && this.article.article_id == item.article_id){
         this.article_key++
-        history.replaceState({article: this.article, search_results: this.search_results, lang: this.lang, error: this.error}, '')
+        history.replaceState({article: this.article, search_results: this.search_results, lang: this.lang, error: this.error, meta: this.meta}, '')
       }else{
         navigate_to_article(this, item.source)
       }
@@ -312,7 +316,7 @@ export default {
     details_click: function(item) {
       item.article.source = this.previous
       this.article = item.article
-      history.replaceState({article: this.article, search_results: [], lang: this.lang, error: null}, '')
+      history.replaceState({article: this.article, search_results: [], lang: this.lang, error: null, meta: this.meta}, '')
     },
     return_to_results: function() {
       this.article = null
@@ -351,7 +355,7 @@ export default {
       else {
         self.lang = self.$route.params.lang || self.lang
         self.waiting_for_articles = false
-        history.replaceState({article: self.article, search_results: self.search_results, lang: self.lang, error: self.error}, '')
+        history.replaceState({article: self.article, search_results: self.search_results, lang: self.lang, error: self.error, meta: self.meta}, '')
       }
 
       // words of the month

src/components/SearchResults.vue

@@ -2,6 +2,7 @@
   <section id="search_results">
     <div class="flex-container" :class="$vuetify.breakpoint.name">
       <ul class="hits" v-if="results_bm.length">
+      <li class="results-count">Treff i Bokmålsordboka: {{count_bm}}</li>
         <li  class="article_container" v-for="(result, index) in results_bm" :key="index + results_hash" tabindex="-1">
           <Article
               :article="result"
@@ -11,6 +12,7 @@
         </li>
       </ul>
       <ul class="hits" v-if="results_nn.length">
+        <li class="results-count">Treff i Nynorskorboka: {{count_nn}}</li>
         <li class="article_container" v-for="(result, index) in results_nn" :key="index + results_hash" tabindex="-1">
           <Article
               :article="result"
@@ -31,7 +33,8 @@ export default {
   name: 'SearchResults',
   props: {
     hits: Array,
-    lang: String
+    lang: String,
+    meta: Object
   },
   computed: {
     right_col_class_name: function() {
@@ -50,6 +53,13 @@ export default {
     },
     results_hash: function(){
       return this.hits.reduce((hash, hit) => (hash + hit.article_id) % 10000, 0)
+    },
+    count_bm: function(){
+      console.log(this.meta)
+      return this.meta["bm"]["total"]
+    },
+    count_nn: function(){
+      return this.meta["nn"]["total"]
     }
   },
   methods: {
@@ -90,6 +100,12 @@ export default {
     min-width: 50%;
   }
 
+  .results-count {
+    color: var(--v-primary-base);
+    margin-left: 24px;
+
+  }
+
   #search_results details.xs, #search_results details.sm {
     display: none;
   }