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

show placeholder on clean search ( Custom interval and select ) filter type

This commit is contained in:
eduardohumberto 2018-05-10 22:46:26 -03:00
parent b5e9c8fcbc
commit 36815880c0
2 changed files with 73 additions and 33 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

101
src/classes/filter-types/custom-interval/CustomInterval.vue
View File

@ -7,6 +7,7 @@
:class="{'has-content': date_init !== undefined && date_init !== ''}"
v-model="date_init"
size="is-small"
@focus="isTouched = true"
@input="validate_values()"
icon="calendar-today"/>
<b-datepicker
@ -20,8 +21,8 @@
</div>
<!-- Numeric -->
<div
class="columns"
<div
class="columns"
v-else>
<b-input
:class="{'has-content': value_init !== undefined && value_init !== ''}"
@ -39,11 +40,11 @@
class="column"
v-model="value_end"/>
</div>
<ul
<ul
class="selected-list-box"
v-if="isValid && !clear">
<li>
<b-tag
<b-tag
attached
closable
@close="clearSearch()">
@ -100,27 +101,38 @@
id: '',
query: Object
},
watch: {
isTouched( val ){
if ( val && this.date_init === null)
this.date_init = new Date();
if ( val && this.date_end === null)
this.date_end = new Date();
this.isTouched = val;
}
},
methods: {
// only validate if the first value is higher than first
validate_values(){
if( this.type === 'date' ){
if (this.date_init == undefined)
if (this.date_init === undefined)
this.date_init = new Date();
if (this.date_end == undefined)
if (this.date_end === undefined)
this.date_end = new Date();
if ( this.date_init > this.date_end ) {
let result = this.date_init;
result.setDate(result.getDate() + 1);
this.date_end = result;
result.setDate(result.getDate() - 1);
this.date_init = result;
//this.error_message();
}
} else {
this.value_end = (this.value_end === null) ? 0 : this.value_end;
this.value_init = (this.value_init === null) ? 0 : this.value_init;
} else {
if ( parseFloat( this.value_init ) > parseFloat( this.value_end )) {
this.value_end = parseFloat( this.value_init ) + 1;
//this.error_message();
@ -163,11 +175,13 @@
},
showSearch(){
if( this.type === 'date' ){
let date_init = ('00' + this.date_init.getUTCDate()).slice(-2) + '/' + ('00' + (this.date_init.getUTCMonth() + 1)).slice(-2)
+ '/' + this.date_init.getUTCFullYear();
let date_end = ('00' + this.date_end.getUTCDate()).slice(-2) + '/' + ('00' + (this.date_end.getUTCMonth() + 1)).slice(-2)
+ '/' + this.date_end.getUTCFullYear();
return date_init + ' - ' + date_end;
if( this.date_init === null || this.date_end === null ){
this.clear = true;
return '';
}
return this.date_init.toLocaleString().split(' ')[0] + ' - ' + this.date_end.toLocaleString().split(' ')[0];
} else {
return this.value_init + ' - ' +this.value_end;
}
@ -183,10 +197,15 @@
value: ''
});
// if( this.type === 'date' ){
// this.date_init = undefined;
// this.date_end = undefined;
// }
if( this.type === 'date' ){
this.date_init = null;
this.date_end = null;
this.isTouched = false;
} else {
this.value_end = null;
this.value_init = null;
this.isTouched = false;
}
},
// emit the operation for listeners
@ -195,21 +214,41 @@
let type = '';
if( vm.type === 'date' ){
let date_init = vm.date_init.getUTCFullYear() + '-' +
('00' + (vm.date_init.getUTCMonth() + 1)).slice(-2) + '-' +
('00' + vm.date_init.getUTCDate()).slice(-2);
let date_end = vm.date_end.getUTCFullYear() + '-' +
('00' + (vm.date_end.getUTCMonth() + 1)).slice(-2) + '-' +
('00' + vm.date_end.getUTCDate()).slice(-2);
values = [ date_init, date_end ];
type = 'DATE';
if( vm.date_init === null && vm.date_end === null ){
values = [];
type = 'DATE';
vm.isValid = false;
vm.clear = true;
} else {
let date_init = vm.date_init.getUTCFullYear() + '-' +
('00' + (vm.date_init.getUTCMonth() + 1)).slice(-2) + '-' +
('00' + vm.date_init.getUTCDate()).slice(-2);
let date_end = vm.date_end.getUTCFullYear() + '-' +
('00' + (vm.date_end.getUTCMonth() + 1)).slice(-2) + '-' +
('00' + vm.date_end.getUTCDate()).slice(-2);
values = [ date_init, date_end ];
type = 'DATE';
vm.isValid = true;
vm.clear = false;
}
} else {
values = [ vm.value_init, vm.value_end ];
type = 'DECIMAL';
if( vm.value_init === null || vm.value_end === null
|| vm.value_init === '' || vm.value_end === ''){
values = [];
type = 'DECIMAL';
vm.isValid = false;
vm.clear = true;
return;
} else {
values = [ vm.value_init, vm.value_end ];
type = 'DECIMAL';
vm.isValid = true;
vm.clear = false;
}
}
vm.isValid = true;
vm.clear = false;
vm.$emit('input', {
filter: 'range',
type: type,

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

@ -5,6 +5,7 @@
:loading = "isLoading"
v-model = "selected"
@input = "onSelect($event)"
:placeholder="$i18n.get('label_selectbox_init')"
expanded
:class="{'is-empty': selected == undefined || selected == ''}">
<option value="">{{ $i18n.get('label_selectbox_init') }}...</option>
@ -59,7 +60,7 @@
return metadata.value;
}
}
return '';
return undefined;
}
},
methods: {
@ -82,7 +83,7 @@
filter: 'selectbox',
field_id: this.field,
collection_id: ( this.collection_id ) ? this.collection_id : this.filter.collection_id,
value: value
value: ( value ) ? value : ''
});
},
selectedValues(){