tmdinosaurcenter
/
tainacan
mirror of https://github.com/tainacan/tainacan
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Moves loading items responsability to eventFilterBus.

This commit is contained in:
Mateus Machado Luna 2018-04-05 11:27:02 -03:00
parent 3f0b5908d1
commit 6be9a7681f
6 changed files with 55 additions and 69 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
src/admin/components/search/pagination.vue
View File

@ -58,7 +58,8 @@ export default {
},
watch: {
page( value ){
this.page = ( value > 0 ) ? value : 1;
if (value < 1)
eventFilterBus.setPage(1);
}
},
methods: {
@ -74,14 +75,13 @@ export default {
}
let prevValue = this.itemsPerPage;
this.itemsPerPage = value;
eventFilterBus.setItemsPerPage(value);
this.$userPrefs.set('items_per_page', value, prevValue);
},
onPageChange(page) {
if(page == 0)
return;
eventFilterBus.setPage(this.page);
eventFilterBus.setPage(page);
},
getLastItemNumber() {
let last = (Number(this.itemsPerPage*(this.page - 1)) + Number(this.itemsPerPage));
@ -95,20 +95,6 @@ export default {
return ( this.itemsPerPage * ( this.page - 1 ) + 1)
},
},
created () {
this.$userPrefs.get('items_per_page')
.then((value) => {
this.itemsPerPage = value;
eventFilterBus.setPage(this.page);
eventFilterBus.setItemsPerPage(this.itemsPerPage);
})
.catch(() => {
this.$userPrefs.set('items_per_page', 12, null);
this.itemsPerPage = 12;
eventFilterBus.setPage(this.page);
eventFilterBus.setItemsPerPage(this.itemsPerPage);
});
}
}
</script>

27
src/admin/pages/lists/items-page.vue
View File

@ -58,6 +58,7 @@
import ItemsList from '../../components/lists/items-list.vue';
import FiltersItemsList from '../../components/search/filters-items-list.vue';
import Pagination from '../../components/search/pagination.vue'
import { eventFilterBus } from '../../../js/event-bus-filters'
import { mapActions, mapGetters } from 'vuex';
export default {
@ -86,9 +87,6 @@ export default {
...mapActions('fields', [
'fetchFields'
]),
...mapActions('search', [
'search_by_collection'
]),
onChangeTableFields(field) {
// let prevValue = this.prefTableFields;
// let index = this.prefTableFields.findIndex(alteredField => alteredField.slug === field.slug);
@ -103,23 +101,6 @@ export default {
// this.$console.log(oldField.slug, oldField.visible);
// this.$userPrefs.set('table_columns_' + this.collectionId, this.prefTableFields, prevValue);
},
loadItems() {
this.isLoading = true;
if (this.$route.params && this.$route.params.collectionId) {
this.search_by_collection(this.$route.params.collectionId).then(() => {
this.isLoading = false;
})
.catch(() => {
this.isLoading = false;
});
}
}
},
watch: {
'$route.query'() {
this.loadItems();
}
},
computed: {
@ -129,11 +110,11 @@ export default {
},
created() {
this.collectionId = this.$route.params.collectionId;
this.isRepositoryLevel = (this.collectionId == undefined);
this.isRepositoryLevel = (this.collectionId == undefined);
},
mounted(){
this.loadItems();
eventFilterBus.updateStoreFromURL();
eventFilterBus.loadItems();
this.fetchFields({ collectionId: this.collectionId, isRepositoryLevel: false, isContextEdit: false }).then((res) => {
let rawFields = res;

1
src/classes/filter-types/tainacan-filters-list.vue
View File

@ -57,7 +57,6 @@
'getPostQuery'
]),
listen( event ){
this.setPage(1);
eventFilterBus.$emit( 'input', ( event.field_id ) ? event : event.detail[0] );
},
setFilterTypeMessage( message ){

66
src/js/event-bus-filters.js
View File

@ -12,9 +12,9 @@ export const eventFilterBus = new Vue({
},
created(){
this.$on('input', data => {
store.dispatch('search/setPage', 1);
this.add_metaquery(data)
router.push({ query: {} });
router.push({ query: store.getters['search/getPostQuery'] });
this.updateURLQueries();
});
},
watch: {
@ -22,10 +22,11 @@ export const eventFilterBus = new Vue({
if (this.$route.query.perpage == undefined)
this.$route.query.perpage = 12;
if (this.$route.query.paged == undefined)
this.$route.query.paged = 1;
this.$route.query.paged = 1;
store.dispatch('search/set_postquery', this.$route.query);
//console.log(this.$route.query);
this.loadItems();
}
},
methods: {
@ -38,8 +39,45 @@ export const eventFilterBus = new Vue({
let error = this.errors.find( errorItem => errorItem.field_id === filter_id );
return ( error ) ? error.errors : false
},
listener(){
const components = this.getAllComponents();
for (let eventElement of components){
eventElement.addEventListener('input', (event) => {
if( event.detail ) {
this.add_metaquery( event.detail[0] );
}
});
}
},
setPage(page) {
store.dispatch('search/setPage', page);
this.updateURLQueries();
},
setItemsPerPage(itemsPerPage) {
store.dispatch('search/setItemsPerPage', itemsPerPage);
this.updateURLQueries();
},
updateURLQueries() {
router.push({ query: {} });
router.push({ query: store.getters['search/getPostQuery'] });
},
updateStoreFromURL() {
store.dispatch('search/set_postquery', this.$route.query);
},
loadItems() {
//this.isLoading = true;
/* Dev interfaces methods */
if (this.$route.params && this.$route.params.collectionId) {
store.dispatch('collection/fetchItems', this.$route.params.collectionId).then(() => {
//this.isLoading = false;
})
.catch(() => {
//this.isLoading = false;
});
}
},
/* Dev interfaces methods */
registerComponent( name ){
if (this.componentsTag.indexOf(name) < 0) {
@ -58,25 +96,5 @@ export const eventFilterBus = new Vue({
}
return components;
},
listener(){
const components = this.getAllComponents();
for (let eventElement of components){
eventElement.addEventListener('input', (event) => {
if( event.detail ) {
this.add_metaquery( event.detail[0] );
}
});
}
},
setPage(page) {
store.dispatch('search/setPage', page);
router.push({ query: {} });
router.push({ query: store.getters['search/getPostQuery'] });
},
setItemsPerPage(itemsPerPage) {
store.dispatch('search/setItemsPerPage', itemsPerPage);
router.push({ query: {} });
router.push({ query: store.getters['search/getPostQuery'] });
}
}
});

8
src/js/store/modules/collection/actions.js
View File

@ -1,11 +1,13 @@
import axios from '../../../axios/axios';
import qs from 'qs';
export const fetchItems = ({ commit, dispatch }, { collectionId, page, itemsPerPage }) => {
export const fetchItems = ({ rootGetters, dispatch, commit }, collectionId) => {
return new Promise ((resolve, reject) => {
axios.tainacan.get('/collection/'+collectionId+'/items?paged='+page+'&perpage='+itemsPerPage)
let postQueries = rootGetters['search/getPostQuery'];
axios.tainacan.get('/collection/'+collectionId+'/items?' + qs.stringify(postQueries) )
.then(res => {
let items = res.data;
commit('setItems', items);
commit('setItems', items );
dispatch('search/setTotalItems', res.headers['x-wp-total'], { root: true } );
resolve({'items': items, 'total': res.headers['x-wp-total'] });
})

2
src/js/store/modules/search/actions.js
View File

@ -43,7 +43,7 @@ export const setTotalItems = ({ commit }, total ) => {
commit('setTotalItems', total);
};
export const setPage = ({ commit }, page ) => {
export const setPage = ({ commit }, page ) => {
commit('setPostQueryAttribute', { attr: 'paged', value: page } );
};