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

Adds infinite scroll to add new term section of metadata edition form.

This commit is contained in:
Mateus Machado Luna 2020-02-28 16:07:20 -03:00
parent 470260ef3e
commit 29802e14a1
1 changed files with 39 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

46
src/views/admin/components/metadata-types/taxonomy/AddNewTerm.vue
View File

@ -56,9 +56,11 @@
clearable
@select="onSelectParentTerm($event)"
:loading="isFetchingParentTerms"
@input="fecthParentTerms($event)"
@input="fetchParentTerms"
@focus="clearErrors('parent');"
:disabled="!hasParent">
:disabled="!hasParent"
check-infinite-scroll
@infinite-scroll="fetchMoreParentTerms">
<template slot-scope="props">
{{ props.option.name }}
</template>
@ -117,7 +119,9 @@
isFetchingParentTerms: false,
metadatumId: this.metadatum.metadatum.id,
itemId: this.metadatum.item.id,
formErrors: {}
formErrors: {},
parentTermSearchQuery: '',
parentTermSearchOffset: 0
}
},
mounted() {
@ -139,22 +143,50 @@
this.formErrors = {};
this.showForm = !this.showForm;
},
fecthParentTerms(search) {
fetchParentTerms: _.debounce(function(search) {
// String update
if (search != this.parentTermSearchQuery) {
this.parentTermSearchQuery = search;
this.parentTerms = [];
this.parentTermSearchOffset = 0;
}
// String cleared
if (!search.length) {
this.parentTermSearchQuery = search;
this.parentTerms = [];
this.parentTermSearchOffset = 0;
}
// No need to load more
if (this.parentTermSearchOffset > 0 && this.parentTerms.length >= this.totalTerms)
return
this.isFetchingParentTerms = true;
this.fetchPossibleParentTerms({
taxonomyId: this.taxonomyId,
termId: 'new',
search: search })
search: this.parentTermSearchQuery,
offset: this.parentTermSearchOffset })
.then((res) => {
this.parentTerms = res.parentTerms;
for (let term of res.parentTerms)
this.parentTerms.push(term);
this.parentTermSearchOffset += 12;
this.totalTerms = res.totalTerms;
this.isFetchingParentTerms = false;
})
.catch((error) => {
this.$console.error(error);
this.isFetchingParentTerms = false;
});
},
}, 500),
fetchMoreParentTerms: _.debounce(function () {
this.fetchParentTerms(this.parentTermSearchQuery)
}, 250),
onToggleSwitch() {
this.clearErrors('parent');
},