Compare commits

...

5 Commits

Author SHA1 Message Date
buttle 8e11d984a2 house keeping 2022-03-17 15:07:52 +01:00
buttle 38dc4d9842 fixes column ordering 2022-03-17 15:01:28 +01:00
buttle 83c645c2fb appends hashtag + search_text to browser's url 2022-03-15 22:45:28 +01:00
buttle 2a0fc20f5d fixes search endpoint 2022-03-15 22:22:08 +01:00
buttle 5ba594e5d1 testing list filter via url hash 2022-03-15 22:07:32 +01:00
3 changed files with 68 additions and 43 deletions

View File

@ -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,20 +135,22 @@ export default {
active_column: 'date',
faLongArrowAltUp: faLongArrowAltUp,
faLongArrowAltDown: faLongArrowAltDown,
url_search_text: location.hash.substr(1),
};
},
created() {
},
ready: function () {
},
mounted() {
var payload = {
'sites': JSON.parse(this.collections),
'column_name': this.active_column,
'order': this.columns_order[this.active_column]}
'active_column': this.active_column,
'column_order': this.columns_order[this.active_column]}
this.setSites(payload)
if (this.url_search_text) {
this.setSearchText(this.url_search_text)
this.siteSearch()
}
},
methods: {
setActiveColumn: function(name) {
@ -166,15 +168,17 @@ export default {
return this.columns_order[name] == 'asc' ? faLongArrowAltUp : faLongArrowAltDown
},
loadMoreSites() {
console.log('loading')
this.incrementPageCount()
},
...mapGetters([
'getSitesForDisplay', 'getPageCount'
'getSitesForDisplay', 'getPageCount',
]),
...mapMutations([
'setSites', 'setColumnOrder', 'incrementPageCount'
'setColumnOrder', 'incrementPageCount', 'setSearchText'
]),
...mapActions([
'siteSearch', 'setSites'
])
},
watched: {

View File

@ -27,31 +27,29 @@ 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)
const uri = window.location.toString()
const withNoHash = uri.substring(0, uri.indexOf('#'))
//console.log('setting hash')
window.history.replaceState({}, document.title, withNoHash+'#'+this.search_text)
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 +57,9 @@ export default {
...mapGetters([
'searchLocalSiteData'
]),
...mapActions([
'siteSearch'
])
},
};
</script>

View File

@ -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)
@ -18,19 +19,18 @@ const store = new Vuex.Store({
sites: [],
filtered_sites: [],
page_count: 1,
active_column: null,
column_order: null
},
mutations: {
setSearchText(state, text) {
state.search_text = text
},
setSites(state, payload) {
state.sites = _.sortBy(payload.sites, payload.column_name)
},
incrementPageCount(state) {
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 +42,44 @@ 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()
}
*/
state.active_column = payload.active_column
state.column_order = payload.column_order
state.sites = order_items(state.sites,
payload.active_column,
payload.column_order)
state.filtered_sites = order_items(state.filtered_sites,
payload.active_column,
payload.column_order)
},
},
actions: {
setSites(context, payload) {
context.state.sites = payload.sites
context.commit("setColumnOrder", {'active_column': payload.active_column,
'column_order': payload.column_order})
},
siteSearch (context) {
console.log('new site search')
var api_endpoint = '/api/collections/search?fulltext_search='
axios.post(api_endpoint + context.getters.getSearchText, {})
.then(function (response) {
var local_search_result = context.getters.searchLocalSiteData
var merged_results = Object.assign({},
local_search_result,
response.data)
context.commit("setFilteredSites", merged_results)
context.commit("setColumnOrder", {'active_column': context.state.active_column,
'column_order': context.state.column_order})
})
.catch(function (error) {
console.log(error);
});
},
},
getters: {
getSearchText: state => {
return state.search_text
},
getSitesForDisplay: state => {
if (state.search_text === "") {
return state.sites
@ -92,8 +117,6 @@ const store = new Vuex.Store({
result[id] = weight
}
}
console.log('load search')
console.log(result)
return result
},
}
@ -106,8 +129,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
}