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

Fixes the problem in tag input with autocomplete (see issue #70)

This commit is contained in:
weryques 2018-06-26 14:14:21 -03:00
parent 140cf86603
commit 5d61031a7a
10 changed files with 3733 additions and 3669 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
.DS_Store vendored
View File

Binary file not shown.

7242
package-lock.json generated
View File

File diff suppressed because it is too large Load Diff

BIN
src/.DS_Store vendored
View File

Binary file not shown.

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

@ -48,6 +48,7 @@
v-else-if="advancedSearchQuery.taxquery[searchCriteria]"
:data="terms"
autocomplete
:loading="isFetching"
attached
ellipsis
:before-adding="hasTagIn($event, searchCriteria)"
@ -233,7 +234,8 @@
},
search: {
searchterm: value
}
},
all: false
}).then((res) => {
this.termList = res;

2
src/admin/components/lists/terms-list.vue
View File

@ -314,7 +314,7 @@ export default {
},
loadTerms() {
this.isLoadingTerms = true;
this.fetchTerms({ taxonomyId: this.taxonomyId, fetchOnly: '', search: ''})
this.fetchTerms({ taxonomyId: this.taxonomyId, fetchOnly: '', search: '', all: ''})
.then(() => {
// Fill this.form data with current data.
this.isLoadingTerms = false;

6
src/classes/metadata-types/tainacan-form-item.vue
View File

@ -129,11 +129,13 @@
changeValue(){
eventBus.$emit('input', { item_id: this.metadatum.item.id, metadatum_id: this.metadatum.metadatum.id, values: this.inputs } );
},
getValue(){
getValue(){
if (this.metadatum.value instanceof Array) {
this.inputs = this.metadatum.value;
if (this.inputs.length === 0)
if (this.inputs.length === 0){
this.inputs.push('');
}
} else {
this.metadatum.value == null || this.metadatum.value == undefined ? this.inputs.push('') : this.inputs.push(this.metadatum.value);
}

21
src/classes/metadata-types/taxonomy/Taxonomy.vue
View File

@ -5,6 +5,7 @@
v-model="valueComponent"
:allow-new="allowNew"
:terms="terms"
:taxonomy-id="taxonomy"
:options="getOptions(0)"/>
<add-new-term
class="add-new-term"
@ -37,7 +38,12 @@
if( metadata_type_options && metadata_type_options.allow_new_terms ){
this.allowNew = metadata_type_options.allow_new_terms === 'yes'
}
this.getTermsFromTaxonomy();
// This condition is temporary
if(this.component != 'tainacan-taxonomy-tag-input'){
this.getTermsFromTaxonomy();
}
this.getTermsId();
},
components: {
@ -108,6 +114,7 @@
},
getTermsId(){
let values = [];
if( this.value && this.value.length > 0){
for( let term of this.value ){
if( term && term.id)
@ -115,8 +122,16 @@
}
}
if( values.length > 0 && this.metadatum.metadatum){
this.valueComponent = ( this.metadatum.metadatum && this.metadatum.metadatum.multiple === 'no' ) ? values[0] : values
if( values.length > 0 && this.metadatum.metadatum && this.component != 'tainacan-taxonomy-tag-input'){
this.valueComponent = ( this.metadatum.metadatum && this.metadatum.metadatum.multiple === 'no' ) ? values[0] : values;
} else if(values.length > 0 && this.metadatum.metadatum && this.component == 'tainacan-taxonomy-tag-input') {
let values = [];
for(let term of this.value){
values.push({label: term.name, value: term.id});
}
this.valueComponent = values;
}
},

112
src/classes/metadata-types/taxonomy/TaxonomyTaginput.vue
View File

@ -4,75 +4,109 @@
size="is-small"
icon="magnify"
:allow-new="allowNew"
@input="emitChange"
@add="emitAdd"
@remove="emitRemove"
v-model="selected"
:data="labels"
field="label"
attached
ellipsis
:loading="isFetching"
:class="{'has-selected': selected != undefined && selected != []}"
autocomplete
@typing="search"/>
@typing="autoCompleteTerm"/>
</div>
</template>
<script>
import { mapActions, mapGetters } from 'vuex';
export default {
data(){
return {
selected: [],
labels: []
}
},
watch: {
terms(){
this.selectedValues();
labels: [],
termList: [],
isFetching: false,
}
},
props: {
terms: [ Number, String, Array ],
options: {
type: Array
},
value: [ Number, String, Array ],
allowNew: [ Boolean ]
allowNew: [ Boolean ],
taxonomyId: Number,
},
created(){
if(this.value && this.value.length > 0){
this.selected = this.value;
}
},
methods: {
search( query ){
if( this.terms && this.terms.length > 0 ){
let result = this.terms.filter( ( item ) => {
let name = item.name.toLowerCase();
let q = query.toLowerCase();
return ( name.indexOf(q) >= 0 )
});
this.labels = [];
for( let term of result){
this.labels.push({label: term.name, value: term.id})
}
}
},
selectedValues(){
if( this.value && this.value.length > 0 && this.selected.length === 0){
let result = this.terms.filter( ( item ) => {
let id = item.id;
return ( this.value.indexOf( id ) >= 0 )
});
...mapActions('taxonomy', [
'fetchTerms'
]),
...mapGetters('taxonomy', [
'getTerms'
]),
autoCompleteTerm: _.debounce( function(value){
this.termList = [];
this.labels = [];
this.isFetching = true;
let selected = [];
for( let term of result){
selected.push({label: term.name, value: term.id})
this.fetchTerms({
taxonomyId: this.taxonomyId,
fetchOnly: {
fetch_only: {
0: 'name',
1: 'id'
}
},
search: {
searchterm: value
},
all: true
}).then((res) => {
this.termList = res;
for(let term of this.termList){
this.labels.push({label: term.name, value: term.id});
}
this.selected = selected;
this.isFetching = false;
}).catch((error) => {
this.isFetching = false;
throw error;
});
}, 300),
selectedValues(){
let selected = [];
for( let term of this.value){
selected.push({label: term.label, value: term.value})
}
this.selected = selected;
},
emitAdd(){
let val = this.selected;
let results = [];
if(val.length > 0){
for( let term of val ){
results.push( term.value );
}
this.$emit('input', results);
this.$emit('blur');
}
},
emitChange(){
emitRemove(){
let val = this.selected;
let results = [];
for( let term of val ){
if( term.value ){
results.push( term.value );
} else {
results.push( term );
}
results.push( term.value );
}
this.$emit('input', results);

9
src/js/event-bus-web-components.js
View File

@ -41,6 +41,15 @@ export const eventBus = new Vue({
this.$emit('isUpdatingValue', true);
if ( data.item_id ){
if(data.values.length > 0 && data.values[0].value){
let val = [];
for(let i of data.values){
val.push(i.value);
}
data.values = val;
}
let values = ( Array.isArray( data.values[0] ) ) ? data.values[0] : data.values ;
const promisse = this.$store.dispatch('item/updateMetadata',
{ item_id: data.item_id, metadatum_id: data.metadatum_id, values: values });

6
src/js/store/modules/taxonomy/actions.js
View File

@ -170,12 +170,14 @@ export const updateTerm = ({ commit }, { taxonomyId, termId, name, description,
});
};
export const fetchTerms = ({ commit }, {taxonomyId, fetchOnly, search}) => {
export const fetchTerms = ({ commit }, {taxonomyId, fetchOnly, search, all}) => {
let query = '';
if(fetchOnly && search){
if(fetchOnly && search && !all ){
query = `?order=asc&${qs.stringify(fetchOnly)}&${qs.stringify(search)}`;
} else if(fetchOnly && search && all ){
query = `?hideempty=0&order=asc&${qs.stringify(fetchOnly)}&${qs.stringify(search)}`;
} else {
query = '?hideempty=0&order=asc';
}