refactor & fix routing bugs

src/components/Autocomplete.vue

@@ -80,7 +80,7 @@ import Menu from './Menu.vue'
         loading: false,
         items: [],
         search: null,
-        select: null,
+        select: this.$route.query? this.$route.query.q : null,
         suggesting: null,
         menuDialog: false
       }
@@ -129,7 +129,9 @@ import Menu from './Menu.vue'
           this.items.push({q: q, label: q, time: time, search: search})
         }
         let self = this
-        self.api.get('suggest?', {params: {q: q, dict: self.get_lang(), n: 80, scope: self.$parent.scope, dform: 'int', meta: 'n', wc: self.$parent.pos_selected}})
+        let params = {q: q, dict: self.get_lang(), n: 80, scope: self.$parent.scope, dform: 'int', meta: 'n'}
+        if ( self.$parent.pos_selected != "ALL") params.wc = self.$parent.pos_selected
+        self.api.get('suggest?', {params})
             .then(async (response) => {
                         if (self.$refs.autocomplete.searchInput == q & self.suggesting) {
                           let suggestions = response.data.a.w.map(item => ({q: q, match: item[0], label: item[0], time: time, lang: [item[1]]}))

src/components/DictionaryView.vue

@@ -110,7 +110,9 @@ function navigate_to_query(self, word) {
   let  query = self.event ? self.event : {q: word} 
   
   // Get article IDs
-  api.get('articles?', {params: {w: query.match || query.q, dict: self.lang, scope: self.scope, meta: 'n', wc: self.pos_selected}}).then((response) => {
+  let params = {w: query.match || query.q, dict: self.lang, scope: self.scope, meta: 'n'}
+  if (self.pos_selected != "ALL") params.wc = self.pos_selected
+  api.get('articles?', {params}).then((response) => {
             let article_ids = response.data
             let unwrapped = []
             for (const d in article_ids) {
@@ -189,7 +191,8 @@ export default {
       monthly_nn: null,
       event: null,
       previous: this.$route.fullPath,
-      scope: "w"
+      scope: "w",
+      pos_selected: "ALL"
     }
   },
   computed: {
@@ -233,10 +236,12 @@ export default {
           props: track_props
         })
       },
+
       pos_param: function() {
         if (this.pos_selected) return this.pos_selected.toLowerCase()
         return ""
       },
+
       reload_params: function() {
         let q = (this.$route.query || this.$route.params).q
         if (q) {
@@ -246,6 +251,7 @@ export default {
           navigate_to_query(this, q)
         } 
       },
+
       update_lang_form: function (lang) {
         this.lang = lang
         this.reload_params()
@@ -258,6 +264,7 @@ export default {
         this.pos_selected = pos
         this.reload_params()
       },
+
     article_link_click: function(item) {
       if (this.article && this.article.article_id == item.article_id){
         this.article_key++
@@ -282,7 +289,13 @@ export default {
   },
   mounted: function(){
     let self = this
-    this.lang = 'bm,nn'
+    self.lang = self.$route.params.lang || "bm,nn"
+    if (self.$route.query.pos) {
+    self.pos_selected = self.$route.query.pos.toUpperCase()
+    }
+    if (self.$route.query.scope) {
+      self.scope = self.$route.query.scope
+    } 
     Promise.all([
       axios.get(ARTICLE_ENDPOINT + 'bm/concepts.json').then(function(response){
         let concepts = response.data.concepts
@@ -294,30 +307,19 @@ export default {
       })
     ]).then(function(_) {
       self.waiting_for_metadata = false
-
       if (self.$route.name == 'query') {
-        self.lang = self.$route.params.lang
-        if (self.$route.query.pos) {
-          self.pos_selected = self.$route.query.pos.toUpperCase()
-        }
-        if (self.$route.query.scope) {
-          self.scope = self.$route.query.scope
-        }
         navigate_to_query(self, self.$route.query.q)
       }
       else if(self.$route.name == 'search') {
-        self.lang = self.$route.params.lang
         navigate_to_query(self, self.$route.params.query)
       } 
       else if(self.$route.name == 'word') {
-        self.lang = self.$route.params.lang
         navigate_to_query(self, self.$route.params.query)
       }
       else if(self.$route.name == 'lookup'){
         navigate_to_article(self, self.$route.path)
       }
       else {
-        self.lang = self.$route.params.lang || self.lang
         self.waiting_for_articles = false
         history.replaceState({article: self.article, 
                               search_results: self.search_results, 
@@ -353,6 +355,8 @@ export default {
         self.article = event.state.article
         self.search_results = event.state.search_results
         self.lang = event.state.lang
+        self.pos_selected = event.pos_selected
+        self.scope = event.scope
         self.error = event.state.error
       }
     }

src/components/SearchToolbar.vue

@@ -4,7 +4,7 @@
           <v-row >
           <v-col :cols="$vuetify.breakpoint.mdAndUp ? 3 : 12">
             <v-select rounded 
-                v-model="pos_selected"
+                v-model="$parent.pos_selected"
                 hide-details
                 outlined
                 flat
@@ -15,7 +15,7 @@
           </v-col>
           <v-col :cols="$vuetify.breakpoint.mdAndUp ? 3 : 12">
             <v-select rounded 
-                v-model="scope_selected"
+                v-model="$parent.scope"
                 hide-details=""
                 outlined
                 dense
@@ -34,11 +34,9 @@ export default {
     name: "SearchToolbar",
     data() {
       return { 
-        pos_selected: {text: this.$t("pos.ALL") , value: "ALL"},
-        pos_items:    ["ALL", "NOUN", "PRON","DET","ADJ","CCONJ","SCONJ", "ADV", "VERB", "INTJ"].map(text =>{
+        pos_items: ["ALL", "NOUN", "PRON","DET","ADJ","CCONJ","SCONJ", "ADV", "VERB", "INTJ"].map(text =>{
           return {text: this.$t("pos." + text ), value: text}
         }),
-        scope_selected: {text: this.$t("scope.w"), value: "w"},
         scope_items: ["w", "x", "wx"].map(text => {
           return {text: this.$t("scope." + text), value: text}
         })
@@ -46,12 +44,12 @@ export default {
     },
     methods: {
       updatePos (pos) {
-        this.$emit('updatePos', pos == 'ALL' ? null : pos)
+        this.$emit('updatePos', pos)
       },
       updateScope (scope) {
         this.$emit('updateScope', scope)
-      }
-    }
+      },
+  }
 }
 </script>