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

Adds request cancelation to facet load options search

This commit is contained in:
Mateus Machado Luna 2018-10-16 17:11:01 -03:00
parent 44775512cd
commit c0526ca4a9
8 changed files with 222 additions and 155 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
src/admin/components/navigation/tainacan-collection-subheader.vue
View File

@ -168,6 +168,7 @@ export default {
this.arrayRealPath = this.arrayRealPath.filter((item) => item.length != 0);
this.generateViewPath();
}
},
methods: {

11
src/admin/components/other/checkbox-radio-modal.vue
View File

@ -359,13 +359,17 @@
getOptions(offset){
let promise = '';
// Cancels previous Request
if (this.getOptionsValuesCancel != undefined)
this.getOptionsValuesCancel.cancel('Facet search Canceled.');
if ( this.metadatum_type === 'Tainacan\\Metadata_Types\\Relationship' ) {
let collectionTarget = ( this.metadatum_object && this.metadatum_object.metadata_type_options.collection_id ) ?
this.metadatum_object.metadata_type_options.collection_id : this.collection_id;
promise = this.getValuesRelationship( collectionTarget, this.optionName, [], offset, this.maxNumOptionsCheckboxList, true);
promise
promise.request
.then(() => {
this.isCheckboxListLoading = false;
this.isSearchingLoading = false;
@ -376,7 +380,7 @@
} else {
promise = this.getValuesPlainText( this.metadatum_id, this.optionName, this.isRepositoryLevel, [], offset, this.maxNumOptionsCheckboxList, true);
promise
promise.request
.then(() => {
this.isCheckboxListLoading = false;
this.isSearchingLoading = false;
@ -385,6 +389,9 @@
this.$console.log(error);
})
}
// Search Request Token for cancelling
this.getOptionsValuesCancel = promise.source;
},
autoComplete: _.debounce( function () {
this.isSearching = !!this.optionName.length;

12
src/classes/filter-types/autocomplete/Autocomplete.vue
View File

@ -98,6 +98,12 @@
if (query != '') {
let promise = null;
this.options = [];
// Cancels previous Request
if (this.getOptionsValuesCancel != undefined)
this.getOptionsValuesCancel.cancel('Facet search Canceled.');
if ( this.type === 'Tainacan\\Metadata_Types\\Relationship' ) {
let collectionTarget = ( this.metadatum_object && this.metadatum_object.metadata_type_options.collection_id ) ?
this.metadatum_object.metadata_type_options.collection_id : this.collection_id;
@ -107,9 +113,13 @@
promise = this.getValuesPlainText( this.metadatum, query, this.isRepositoryLevel );
}
promise.catch( error => {
promise.request.catch( error => {
this.$console.log('error select', error );
});
// Search Request Token for cancelling
this.getOptionsValuesCancel = promise.source;
} else {
this.cleanSearch();
}

45
src/classes/filter-types/checkbox/Checkbox.vue
View File

@ -32,6 +32,7 @@
export default {
created(){
this.collection = ( this.collection_id ) ? this.collection_id : this.filter.collection_id;
this.metadatum = ( this.metadatum_id ) ? this.metadatum_id : this.filter.metadatum.metadatum_id;
const vm = this;
@ -81,46 +82,56 @@
methods: {
loadOptions(){
let promise = null;
this.isLoading = true;
// Cancels previous Request
if (this.getOptionsValuesCancel != undefined)
this.getOptionsValuesCancel.cancel('Facet search Canceled.');
if ( this.type === 'Tainacan\\Metadata_Types\\Relationship' ) {
this.isLoading = true;
let collectionTarget = ( this.metadatum_object && this.metadatum_object.metadata_type_options.collection_id ) ?
this.metadatum_object.metadata_type_options.collection_id : this.collection_id;
promise = this.getValuesRelationship( collectionTarget, null, [], 0, this.filter.max_options, false, '1');
promise
promise.request
.then(() => {
this.isLoading = false;
this.isLoading = false;
if(this.options.length > this.filter.max_options){
this.options.splice(this.filter.max_options);
}
this.selectedValues();
}).catch((error) => {
this.$console.error(error);
})
})
} else {
this.isLoading = true;
promise = this.getValuesPlainText( this.metadatum, null, this.isRepositoryLevel, [], 0, this.filter.max_options, false, '1' );
promise
promise.request
.then(() => {
this.isLoading = false;
this.isLoading = false;
if(this.options.length > this.filter.max_options){
this.options.splice(this.filter.max_options);
}
this.selectedValues();
}).catch((error) => {
this.$console.error(error);
})
});
}
promise
.then(() => {
this.isLoading = false;
this.selectedValues()
})
.catch( error => {
this.$console.log('error select', error );
this.isLoading = false;
});
// promise.request
// .then(() => {
// this.isLoading = false;
// })
// .catch( error => {
// this.$console.log('error select', error );
// this.isLoading = false;
// });
// Search Request Token for cancelling
this.getOptionsValuesCancel = promise.source;
},
onSelect(){
this.$emit('input', {

265
src/classes/filter-types/filter-types-mixin.js
View File

@ -1,10 +1,11 @@
import qs from 'qs';
import { tainacan as axios } from '../../js/axios/axios';
import axios from '../../js/axios/axios';
export const filter_type_mixin = {
data () {
return {
thumbPlaceholderPath: tainacan_plugin.base_url + '/admin/images/placeholder_square.png'
thumbPlaceholderPath: tainacan_plugin.base_url + '/admin/images/placeholder_square.png',
getOptionsValuesCancel: undefined
}
},
props: {
@ -19,10 +20,15 @@ export const filter_type_mixin = {
},
methods: {
getValuesPlainText(metadatumId, search, isRepositoryLevel, valuesToIgnore, offset, number, isInCheckboxModal, getSelected = '0') {
const source = axios.CancelToken.source();
let currentQuery = JSON.parse(JSON.stringify(this.query));
for (let key of Object.keys(currentQuery.fetch_only)) {
if (currentQuery.fetch_only[key] == null)
delete currentQuery.fetch_only[key];
if (currentQuery.fetch_only != undefined) {
for (let key of Object.keys(currentQuery.fetch_only)) {
if (currentQuery.fetch_only[key] == null)
delete currentQuery.fetch_only[key];
}
}
let query_items = { 'current_query': currentQuery };
@ -44,74 +50,87 @@ export const filter_type_mixin = {
url += qs.stringify(query_items);
}
return axios.get(url)
.then(res => {
let sResults = [];
let opts = [];
return new Object ({
request:
axios.tainacan.get(url, { cancelToken: source.token })
.then(res => {
let sResults = [];
let opts = [];
for (let metadata of res.data) {
if (valuesToIgnore != undefined && valuesToIgnore.length > 0) {
let indexToIgnore = valuesToIgnore.findIndex(value => value == metadata.value);
for (let metadata of res.data) {
if (valuesToIgnore != undefined && valuesToIgnore.length > 0) {
let indexToIgnore = valuesToIgnore.findIndex(value => value == metadata.value);
if (search && isInCheckboxModal) {
sResults.push({
label: metadata.label,
value: metadata.value
});
} else if (indexToIgnore < 0) {
opts.push({
label: metadata.label,
value: metadata.value
});
if (search && isInCheckboxModal) {
sResults.push({
label: metadata.label,
value: metadata.value
});
} else if (indexToIgnore < 0) {
opts.push({
label: metadata.label,
value: metadata.value
});
}
} else {
if (search && isInCheckboxModal) {
sResults.push({
label: metadata.label,
value: metadata.value
});
} else {
opts.push({
label: metadata.label,
value: metadata.value
});
}
}
}
} else {
if (search && isInCheckboxModal) {
sResults.push({
label: metadata.label,
value: metadata.value
});
this.searchResults = sResults;
if (opts.length) {
this.options = opts;
} else if(!search) {
this.noMorePage = 1;
}
if(this.options.length < this.maxNumOptionsCheckboxList && !search){
this.noMorePage = 1;
}
if (this.filter.max_options && this.options.length >= this.filter.max_options) {
let seeMoreLink = `<a style="font-size: 0.75rem;"> ${ this.$i18n.get('label_view_all') } </a>`;
if(this.options.length === this.filter.max_options){
this.options[this.filter.max_options-1].seeMoreLink = seeMoreLink;
} else {
this.options[this.options.length-1].seeMoreLink = seeMoreLink;
}
}
})
.catch((thrown) => {
if (axios.isCancel(thrown)) {
console.log('Request canceled: ', thrown.message);
} else {
opts.push({
label: metadata.label,
value: metadata.value
});
reject(thrown);
}
}
}
this.searchResults = sResults;
if (opts.length) {
this.options = opts;
} else if(!search) {
this.noMorePage = 1;
}
if(this.options.length < this.maxNumOptionsCheckboxList && !search){
this.noMorePage = 1;
}
if (this.filter.max_options && this.options.length >= this.filter.max_options) {
let seeMoreLink = `<a style="font-size: 0.75rem;"> ${ this.$i18n.get('label_view_all') } </a>`;
if(this.options.length === this.filter.max_options){
this.options[this.filter.max_options-1].seeMoreLink = seeMoreLink;
} else {
this.options[this.options.length-1].seeMoreLink = seeMoreLink;
}
}
})
.catch(error => {
this.$console.error(error);
});
}),
source: source
});
},
getValuesRelationship(collectionTarget, search, valuesToIgnore, offset, number, isInCheckboxModal, getSelected = '0') {
const source = axios.CancelToken.source();
let currentQuery = JSON.parse(JSON.stringify(this.query));
for (let key of Object.keys(currentQuery.fetch_only)) {
if (currentQuery.fetch_only[key] == null)
delete currentQuery.fetch_only[key];
if (currentQuery.fetch_only != undefined) {
for (let key of Object.keys(currentQuery.fetch_only)) {
if (currentQuery.fetch_only[key] == null)
delete currentQuery.fetch_only[key];
}
}
let query_items = { 'current_query': currentQuery };
let url = '/collection/' + this.filter.collection_id + '/facets/' + this.filter.metadatum.metadatum_id + `?getSelected=${getSelected}&`;
@ -126,72 +145,76 @@ export const filter_type_mixin = {
url += `&search=${search}`;
}
return axios.get(url + '&fetch_only[0]=thumbnail&fetch_only[1]=title&fetch_only[2]=id&' + qs.stringify(query_items))
.then(res => {
let sResults = [];
let opts = [];
return new Object ({
request:
axios.tainacan.get(url + '&fetch_only[0]=thumbnail&fetch_only[1]=title&fetch_only[2]=id&' + qs.stringify(query_items))
.then(res => {
let sResults = [];
let opts = [];
if (res.data.length > 0) {
for (let item of res.data) {
if (valuesToIgnore != undefined && valuesToIgnore.length > 0) {
let indexToIgnore = valuesToIgnore.findIndex(value => value == item.value);
if (res.data.length > 0) {
for (let item of res.data) {
if (valuesToIgnore != undefined && valuesToIgnore.length > 0) {
let indexToIgnore = valuesToIgnore.findIndex(value => value == item.value);
if (search && isInCheckboxModal) {
sResults.push({
label: item.label,
value: item.value
});
} else if (indexToIgnore < 0) {
opts.push({
label: item.label,
value: item.value,
img: (item.img ? item.img : this.thumbPlaceholderPath)
});
}
} else {
if (search && isInCheckboxModal) {
sResults.push({
label: item.label,
value: item.value,
img: (item.img ? item.img : this.thumbPlaceholderPath)
});
} else {
opts.push({
label: item.label,
value: item.value,
img: (item.img ? item.img : this.thumbPlaceholderPath)
});
if (search && isInCheckboxModal) {
sResults.push({
label: item.label,
value: item.value
});
} else if (indexToIgnore < 0) {
opts.push({
label: item.label,
value: item.value,
img: (item.img ? item.img : this.thumbPlaceholderPath)
});
}
} else {
if (search && isInCheckboxModal) {
sResults.push({
label: item.label,
value: item.value,
img: (item.img ? item.img : this.thumbPlaceholderPath)
});
} else {
opts.push({
label: item.label,
value: item.value,
img: (item.img ? item.img : this.thumbPlaceholderPath)
});
}
}
}
}
}
}
this.searchResults = sResults;
this.searchResults = sResults;
if (opts.length) {
this.options = opts;
} else {
this.noMorePage = 1;
}
if (opts.length) {
this.options = opts;
} else {
this.noMorePage = 1;
}
if(this.options.length < this.maxNumOptionsCheckboxList){
this.noMorePage = 1;
}
if(this.options.length < this.maxNumOptionsCheckboxList){
this.noMorePage = 1;
}
if (this.filter.max_options && this.options.length >= this.filter.max_options) {
let seeMoreLink = `<a style="font-size: 0.75rem;"> ${ this.$i18n.get('label_view_all') } </a>`;
if (this.filter.max_options && this.options.length >= this.filter.max_options) {
let seeMoreLink = `<a style="font-size: 0.75rem;"> ${ this.$i18n.get('label_view_all') } </a>`;
if(this.options.length === this.filter.max_options){
this.options[this.filter.max_options-1].seeMoreLink = seeMoreLink;
} else {
this.options[this.options.length-1].seeMoreLink = seeMoreLink;
}
}
if(this.options.length === this.filter.max_options){
this.options[this.filter.max_options-1].seeMoreLink = seeMoreLink;
} else {
this.options[this.options.length-1].seeMoreLink = seeMoreLink;
}
}
})
.catch(error => {
this.$console.error(error);
});
})
.catch(error => {
this.$console.error(error);
}),
source: source
});
}
}
};

24
src/classes/filter-types/selectbox/Selectbox.vue
View File

@ -73,21 +73,29 @@
}
return undefined;
}
},
},
methods: {
loadOptions(){
this.isLoading = true;
// Cancels previous Request
if (this.getOptionsValuesCancel != undefined)
this.getOptionsValuesCancel.cancel('Facet search Canceled.');
let promise = null;
promise = this.getValuesPlainText( this.metadatum, null, this.isRepositoryLevel );
promise.then(() => {
this.isLoading = false;
})
.catch( error => {
this.$console.error('error select', error );
this.isLoading = false;
});
promise.request
.then(() => {
this.isLoading = false;
})
.catch( error => {
this.$console.error('error select', error );
this.isLoading = false;
});
// Search Request Token for cancelling
this.getOptionsValuesCancel = promise.source;
},
onSelect(value){
this.selected = value;

18
src/classes/filter-types/taginput/Taginput.vue
View File

@ -112,19 +112,27 @@
for(let val of this.selected)
valuesToIgnore.push( val.value );
// Cancels previous Request
if (this.getOptionsValuesCancel != undefined)
this.getOptionsValuesCancel.cancel('Facet search Canceled.');
if ( this.type === 'Tainacan\\Metadata_Types\\Relationship' ) {
let collectionTarget = ( this.metadatum_object && this.metadatum_object.metadata_type_options.collection_id ) ?
this.metadatum_object.metadata_type_options.collection_id : this.collection_id;
promise = this.getValuesRelationship( collectionTarget, query, valuesToIgnore );
} else {
promise = this.getValuesPlainText( this.metadatum, query, this.isRepositoryLevel, valuesToIgnore );
}
promise
.catch( error => {
this.$console.log('error select', error );
});
promise.request
.catch( error => {
this.$console.log('error select', error );
});
// Search Request Token for cancelling
this.getOptionsValuesCancel = promise.source;
}, 500),
selectedValues(){
const instance = this;

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

@ -104,7 +104,6 @@ export const fetchItems = ({ rootGetters, dispatch, commit }, { collectionId, is
}),
source: source
})
};
export const deleteItem = ({ commit }, { itemId, isPermanently }) => {