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

Advanced search (see #22)

This commit is contained in:
weryques 2018-06-10 10:15:32 -03:00
parent d54f21f9c3
commit feeef1aaeb
10 changed files with 183 additions and 43 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

53
src/admin/components/advanced-search/advanced-search.vue
View File

@ -12,7 +12,7 @@
grouped>
<b-field class="column">
<b-select
@input.native="addToAdvancedSearchQuery($event)">
@input="addToAdvancedSearchQuery($event, 'field_id', searchField)">
<option
v-for="metadata in metadataList"
v-if="metadata.enabled"
@ -24,12 +24,12 @@
<b-field class="column is-two-thirds">
<b-input
@input.native="addValueToAdvancedSearchQuery($event)"/>
@input="addValueToAdvancedSearchQuery($event, 'value', searchField)"/>
</b-field>
<b-field class="column">
<b-select
@input.native="addToAdvancedSearchQuery($event)">
@input="addToAdvancedSearchQuery($event, 'compare', searchField)">
<option
v-for="(opt, key) in compare"
:value="key"
@ -71,6 +71,7 @@
</div>
</div>
</div>
<pre>{{ advancedSearchQuery }}</pre>
</div>
</template>
@ -81,11 +82,21 @@
metadataList: Array,
isRepositoryLevel: false,
},
data(){
data() {
return {
compare: {'=':'Igual', '!=':'Diferente', 'IN':'Contém', 'NOT IN':'Não Contém'},
compare: {
'=': this.$i18n.get('is_equal_to'),
'!=': this.$i18n.get('is_not_equal_to'),
'IN': this.$i18n.get('contains'),
'NOT IN': this.$i18n.get('not_contains')
},
totalSearchMetadata: 1,
advancedSearchQuery: {},
advancedSearchQuery: {
advancedSearch: true,
metaquery: {
relation: 'AND',
}
},
}
},
methods: {
@ -94,15 +105,35 @@
},
clearSearch(){
this.totalSearchMetadata = 1;
this.advancedSearchQuery = {
advancedSearch: true,
relation: 'AND',
};
},
addValueToAdvancedSearchQuery: _.debounce(($event) => {
console.log($event);
addValueToAdvancedSearchQuery: _.debounce(function(value, type, relation) {
let vm = this;
vm.addToAdvancedSearchQuery(value, type, relation);
}, 900),
searchAdvanced(){
this.$eventBusSearch.$emit('searchAdvanced', this.advancedSearchQuery);
},
addToAdvancedSearchQuery($event){
console.log($event);
addToAdvancedSearchQuery(value, type, relation){
if(this.advancedSearchQuery.metaquery.hasOwnProperty(relation)){
//if(this.advancedSearchQuery[relation].compare === 'IN'){
//this.advancedSearchQuery[relation][type] = value.split(' ');
//} else {
this.advancedSearchQuery.metaquery[relation][type] = value;
//}
} else {
this.advancedSearchQuery.metaquery = Object.assign({}, this.advancedSearchQuery.metaquery, {
[`${relation}`]: {
[`${type}`]: value,
}
});
}
console.log(this.advancedSearchQuery);
},
}
}

2
src/admin/js/main.js
View File

@ -46,7 +46,7 @@ import VueMask from 'v-mask';
// Configure and Register Plugins
Vue.use(Buefy);
Vue.use(VTooltip)
Vue.use(VTooltip);
Vue.use(I18NPlugin);
Vue.use(UserPrefsPlugin);
Vue.use(RouterHelperPlugin);

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

@ -315,11 +315,38 @@
<!-- ITEMS LISTING RESULTS ------------------------- -->
<div class="above-search-control">
<div
v-if="openAdvancedSearch && advancedSearchResults">
<div class="advanced-search-results-title">
<h1>{{ $i18n.get('info_search_results') }}</h1>
<hr>
</div>
</div>
<!-- Admin Table -->
<!-- When advanced search -->
<items-list
v-if="!isOnTheme &&
v-if="!isOnTheme &&
!isLoadingItems &&
totalItems > 0 &&
openAdvancedSearch &&
advancedSearchResults"
:collection-id="collectionId"
:table-fields="tableFields"
:items="items"
:is-loading="isLoadingItems"
:is-on-trash="status == 'trash'"
:view-mode="adminViewMode"/>
<!-- Regular -->
<items-list
v-else-if="!isOnTheme &&
!isLoadingItems &&
totalItems > 0"
totalItems > 0 &&
!openAdvancedSearch"
:collection-id="collectionId"
:table-fields="tableFields"
:items="items"
@ -371,7 +398,18 @@
</section>
<!-- Pagination -->
<pagination v-if="totalItems > 0 && (!isOnTheme || registeredViewModes[viewMode].show_pagination)"/>
<!-- When advanced search -->
<pagination
v-if="totalItems > 0 &&
(!isOnTheme || registeredViewModes[viewMode].show_pagination) &&
advancedSearchResults"/>
<!-- Regular -->
<pagination
v-else-if="totalItems > 0 &&
(!isOnTheme || registeredViewModes[viewMode].show_pagination) &&
!openAdvancedSearch"/>
</div>
</div>
@ -405,6 +443,7 @@
registeredViewModes: tainacan_plugin.registered_view_modes,
adminViewMode: 'table',
openAdvancedSearch: false,
advancedSearchResults: false,
}
},
props: {
@ -669,6 +708,23 @@
@import '../../scss/_variables.scss';
.advanced-search-results-title {
padding: 0 $table-side-padding;
h1 {
font-size: 20px;
font-weight: 500;
color: $tertiary;
display: inline-block;
}
hr{
margin: 3px 0px 4px 0px;
height: 1px;
background-color: $secondary;
}
}
.tnc-advanced-search-close {
padding-top: 47px;
padding-right: $page-side-padding;

8
src/admin/tainacan-admin-i18n.php
View File

@ -1,6 +1,13 @@
<?php
return [
// Advanced search comparators
'is_equal_to' => __( 'Equal', 'tainacan' ),
'is_not_equal_to' => __( 'Not Equal', 'tainacan'),
'contains' => __( 'Contains', 'tainacan'),
'not_contains' => __( 'Not Contains', 'tainacan' ),
// Tainacan common terms
'repository' => __( 'Repository', 'tainacan' ),
'collections' => __( 'Collections', 'tainacan' ),
@ -228,6 +235,7 @@ return [
'instruction_search_on_repository' => __( 'Search on repository', 'tainacan' ),
// Info. Other feedback to user.
'info_search_results' => __( 'Search Results', 'tainacan' ),
'info_name_is_required' => __( 'Name is required.', 'tainacan' ),
'info_no_collection_created' => __( 'No collection was created in this repository.', 'tainacan' ),
'info_no_collection_draft' => __( 'No draft collection found.', 'tainacan' ),

47
src/js/event-bus-search.js
View File

@ -17,13 +17,23 @@ export default {
this.$store.dispatch('search/setPage', 1);
if( data.taxonomy ){
this.add_taxquery(data);
this.add_taxquery(data);
} else {
this.add_metaquery(data);
}
this.updateURLQueries();
});
this.$root.$on('searchAdvanced', advancedSearchQuery => {
this.$store.dispatch('search/setPage', 1);
console.log('Emit caught', advancedSearchQuery);
this.searchAdvanced(advancedSearchQuery);
this.updateURLQueries();
});
},
watch: {
'$route' (to, from) {
@ -39,15 +49,27 @@ export default {
this.$route.query.order = 'DESC';
if (this.$route.query.orderby == undefined)
this.$route.query.orderby = 'date';
this.$store.dispatch('search/set_postquery', this.$route.query);
if(this.$route.query.advancedSearch){
delete this.$route.query.advancedSearch;
console.log('Route watch: '+ this.$route.query);
this.$store.dispatch('search/set_advanced_query', this.$route.query);
} else {
this.$store.dispatch('search/set_postquery', this.$route.query);
}
this.loadItems(to);
}
}
},
methods: {
searchAdvanced(data) {
this.$store.dispatch('search/set_advanced_query', data);
this.updateURLQueries(true);
},
add_metaquery( data ){
if ( data && data.collection_id ){
this.$store.dispatch('search/add_metaquery', data );
@ -112,9 +134,15 @@ export default {
this.$store.dispatch('search/setViewMode', viewMode);
this.updateURLQueries();
},
updateURLQueries() {
updateURLQueries(isAdvancedSearch = false) {
this.$router.push({ query: {}});
this.$router.push({ query: this.$store.getters['search/getPostQuery'] });
if(isAdvancedSearch) {
this.$router.push({query: this.$store.getters['search/getAdvancedSearchQuery']});
console.log(this.$route);
} else {
this.$router.push({query: this.$store.getters['search/getPostQuery']});
}
},
updateStoreFromURL() {
this.$store.dispatch('search/set_postquery', this.$route.query);
@ -126,9 +154,10 @@ export default {
this.$emit( 'hasToPrepareFieldsAndFilters', to);
} else {
this.$emit( 'isLoadingItems', true);
this.$store.dispatch('collection/fetchItems',
{ 'collectionId': this.collectionId,
'isOnTheme': (this.$route.name == null)
this.$store.dispatch('collection/fetchItems', {
'collectionId': this.collectionId,
'isOnTheme': (this.$route.name == null)
})
.then((res) => {
this.$emit( 'isLoadingItems', false);

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

@ -3,6 +3,7 @@ import qs from 'qs';
export const fetchItems = ({ rootGetters, dispatch, commit }, { collectionId, isOnTheme }) => {
commit('cleanItems');
return new Promise ((resolve, reject) => {
// Adds queries for filtering
@ -48,7 +49,7 @@ export const fetchItems = ({ rootGetters, dispatch, commit }, { collectionId, is
});
}
};
export const deleteItem = ({ commit }, { itemId, isPermanently }) => {
return new Promise((resolve, reject) => {
@ -86,7 +87,7 @@ export const fetchCollections = ({commit} , { page, collectionsPerPage, status }
reject(error);
});
});
}
};
export const fetchCollection = ({ commit }, id) => {
commit('cleanCollection');
@ -101,7 +102,7 @@ export const fetchCollection = ({ commit }, id) => {
reject(error);
})
});
}
};
export const fetchCollectionName = ({ commit }, id) => {
//commit('cleanCollectionName');
@ -116,7 +117,7 @@ export const fetchCollectionName = ({ commit }, id) => {
reject(error);
})
});
}
};
export const deleteCollection = ({ commit }, { collectionId, isPermanently }) => {
return new Promise((resolve, reject) => {
@ -134,7 +135,7 @@ export const deleteCollection = ({ commit }, { collectionId, isPermanently }) =>
reject(error);
})
});
}
};
export const updateCollection = ({ commit }, {
collection_id,
@ -181,7 +182,7 @@ export const updateCollection = ({ commit }, {
});
});
}
};
export const sendCollection = ( { commit }, { name, description, status }) => {
return new Promise(( resolve, reject ) => {
@ -329,4 +330,4 @@ export const fetchCollectionsForParent = ({ commit }) => {
reject(error);
})
});
}
};

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

@ -7,6 +7,10 @@ export const set_postquery = ({ commit }, postquery ) => {
commit('setPostQuery', postquery );
};
export const set_advanced_query = ({commit}, advancedSearchQuery) => {
commit('setAdvancedSearchQuery', advancedSearchQuery);
};
// Meta Queries from filters
export const add_metaquery = ( { commit }, filter ) => {
if( filter && filter.value.length === 0 ){

26
src/js/store/modules/search/getters.js
View File

@ -1,25 +1,29 @@
export const getPostQuery = state => {
return state.postquery;
}
};
export const getAdvancedSearchQuery = state => {
return state.advancedSearchQuery;
};
export const getMetaQuery = state => {
return state.metaquery;
}
};
export const getTaxQuery = state => {
return state.taxquery;
}
};
export const getTotalItems = state => {
return state.totalItems;
}
};
export const getPage = state => {
if (state.postquery.paged == undefined)
return 1;
else
return Number(state.postquery.paged);
}
};
export const getItemsPerPage = state => {
if (state.postquery.paged == undefined)
@ -30,7 +34,7 @@ export const getItemsPerPage = state => {
export const getOrder = state => {
return state.postquery.order;
}
};
export const getOrderBy = state => {
return state.postquery.orderby;
@ -38,20 +42,20 @@ export const getOrderBy = state => {
export const getSearchQuery = state => {
return state.postquery.search;
}
};
export const getStatus = state => {
return state.postquery.status;
}
};
export const getViewMode = state => {
return state.postquery.view_mode;
}
};
export const getFetchOnly = state => {
return state.postquery.fetch_only;
}
};
export const getFetchOnlyMeta = state => {
return ( ! state.postquery.fetch_only['meta'] ) ? [] : state.postquery.fetch_only['meta'];
}
};

1
src/js/store/modules/search/index.js
View File

@ -21,6 +21,7 @@ const state = {
},
view_mode: 'table'
},
advancedSearchQuery: {},
totalItems: 0
};

8
src/js/store/modules/search/mutations.js
View File

@ -8,9 +8,15 @@ export const setPostQuery = ( state, postquery ) => {
state.postquery = postquery;
};
export const setAdvancedSearchQuery = (state, advancedSearchQuery) => {
state.advancedSearchQuery = advancedSearchQuery;
};
export const addMetaQuery = ( state, filter ) => {
state.postquery.metaquery = ( ! state.postquery.metaquery ) ? [] : state.postquery.metaquery;
let index = state.postquery.metaquery.findIndex( item => item.key === filter.field_id);
if ( index >= 0 ){
Vue.set( state.postquery.metaquery, index, {
key: filter.field_id,
@ -18,7 +24,7 @@ export const addMetaQuery = ( state, filter ) => {
compare: filter.compare,
type: filter.type
} );
}else{
} else{
state.postquery.metaquery.push({
key: filter.field_id,
value: filter.value,