testing list filter via url hash

src/components/archiveList.vue

@@ -8,7 +8,7 @@ This file is part of ArciveList.
 
 <template>
 <div>
-  <Search></Search>
+  <Search v-bind:url_search_text="url_search_text"></Search>
 
   <section class="collections-list">
 
@@ -118,7 +118,7 @@ This file is part of ArciveList.
 
 <script>
 import axios from 'axios';
-import { mapMutations, mapGetters } from 'vuex'
+import { mapMutations, mapGetters, mapActions } from 'vuex'
 import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome'
 import { faLongArrowAltUp } from '@fortawesome/free-solid-svg-icons'
 import { faLongArrowAltDown } from '@fortawesome/free-solid-svg-icons'
@@ -135,13 +135,11 @@ export default {
       active_column: 'date',
       faLongArrowAltUp: faLongArrowAltUp,
       faLongArrowAltDown: faLongArrowAltDown,
+      url_search_text: location.hash.substr(1),
     };
   },
   created() {
 
-  },
-  ready: function () {
-
   },
   mounted() {
     var payload = {
@@ -149,6 +147,11 @@ export default {
               'column_name': this.active_column,
               'order': this.columns_order[this.active_column]}
     this.setSites(payload)
+    if (this.url_search_text) {
+      console.log('searchig for hash text: '+this.url_search_text)
+      this.setSearchText(this.url_search_text)
+      this.siteSearch()
+    }
   },
   methods: {
     setActiveColumn: function(name) {
@@ -170,11 +173,14 @@ export default {
       this.incrementPageCount()
     },
     ...mapGetters([
-      'getSitesForDisplay', 'getPageCount'
+      'getSitesForDisplay', 'getPageCount',
     ]),
     ...mapMutations([
-      'setSites', 'setColumnOrder', 'incrementPageCount'
+      'setSites', 'setColumnOrder', 'incrementPageCount', 'setSearchText'
     ]),
+    ...mapActions([
+      'siteSearch'
+    ])
   },
   watched: {
 

src/components/search.vue

@@ -27,31 +27,26 @@ This file is part of ArciveList.
 
 <script>
 import axios from 'axios';
-import { mapMutations, mapGetters } from 'vuex'
+import { mapMutations, mapGetters, mapActions } from 'vuex'
 
 export default {
   name: "Search",
+  props: [
+    'url_search_text'
+  ],
   data() {
     return {
       search_text: "",
     };
   },
+  mounted() {
+  },
   methods: {
     search: function() {
+      console.log('searching for: '+this.search_text)
+      var self = this
       this.setSearchText(this.search_text)
-      var local_search_result = this.searchLocalSiteData()
-      var api_endpoint = '/api/collections/search?fulltext_search='
-      var search_url = api_endpoint + this.search_text;
-      var self = this;
-      axios.get(search_url, {
-      })
-      .then(function (response) {
-        //console.log(response.data)
-        self.setFilteredSites(Object.assign({}, local_search_result, response.data))
-      })
-      .catch(function (error) {
-        console.log(error);
-      });
+      this.siteSearch()
     },
     ...mapMutations([
       'setFilteredSites', 'setSearchText'
@@ -59,7 +54,9 @@ export default {
     ...mapGetters([
       'searchLocalSiteData'
     ]),
-
+    ...mapActions([
+      'siteSearch'
+    ])
   },
 };
 </script>

src/store.js

@@ -8,6 +8,7 @@ This file is part of ArciveList.
 import Vue from 'vue'
 import Vuex from 'vuex'
 import _ from 'underscore';
+import axios from 'axios';
 
 
 Vue.use(Vuex)
@@ -30,7 +31,7 @@ const store = new Vuex.Store({
       state.page_count = state.page_count +1
     },
     setFilteredSites(state, filtered_site_ids) {
-      console.log(filtered_site_ids)
+      //console.log(filtered_site_ids)
       var sites = []
       for (const [site_id, weight] of Object.entries(filtered_site_ids)) {
         var site = state.sites.find(x => x.id == site_id)
@@ -42,19 +43,40 @@ const store = new Vuex.Store({
       state.page_count = 1
     },
     setColumnOrder(state, payload) {
-      //state.sites = _.sortBy(state.sites, payload.column_name)
-      //state.filtered_sites = _.sortBy(state.filtered_sites, payload.column_name)
       state.sites = order_items(state.sites, payload.column_name, payload.order)
       state.filtered_sites = order_items(state.filtered_sites, payload.column_name, payload.order)
-      /*
-      if (payload.order == 'desc') {
-        state.sites.reverse()
-        state.filtered_sites.reverse()
-      }
-      */
+    },
+  },
+  actions: {
+    siteSearch (context) {
+      console.log('new site search')
+      var api_endpoint = '/api/collections/search?fulltext_search='
+      var search_url = api_endpoint + context.getters.getSearchText;
+      axios.post(api_endpoint + '/change-index', {})
+      .then(function (response) {
+        console.log("remote")
+        console.log(response.data)
+
+        var local_search_result = context.getters.searchLocalSiteData
+        console.log("local")
+        console.log(local_search_result)
+        
+        var merged_results = Object.assign({},
+                                           local_search_result,
+                                           response.data)
+        console.log("merged")
+        console.log(merged_results)
+        context.commit("setFilteredSites", merged_results)
+      })
+      .catch(function (error) {
+        console.log(error);
+      });
     },
   },
   getters: {
+    getSearchText: state => {
+      return state.search_text
+    },
     getSitesForDisplay: state => {
       if (state.search_text === "") {
         return state.sites
@@ -92,8 +114,6 @@ const store = new Vuex.Store({
           result[id] = weight
         }
       }
-      console.log('load search')
-      console.log(result)
       return result
     },
   }
@@ -106,8 +126,6 @@ function order_items(items, field_name, ascending) {
       if (field_name == 'date') {
         field_name = 'project_date'
       }
-      console.log("sss: "+ field_name)
-      console.log(first_el)
       if (first_el[field_name] === undefined || first_el[field_name] === ""){
         return -1
       }