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

add a option show interval on tag and validation #306

This commit is contained in:
vnmedeiros 2019-10-03 16:58:34 -03:00
parent eddd56c403
commit f007c34b80
4 changed files with 73 additions and 54 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -662,6 +662,7 @@ return apply_filters( 'tainacan-admin-i18n', [
'info_expose_only_displayed_metadata' => __( 'By checking this option, only metatada that are displayed on the current list will be exposed', 'tainacan' ), 'info_expose_only_displayed_metadata' => __( 'By checking this option, only metatada that are displayed on the current list will be exposed', 'tainacan' ),
'info_initial_value' => __( 'Initial value', 'tainacan' ), 'info_initial_value' => __( 'Initial value', 'tainacan' ),
'info_final_value' => __( 'Final value', 'tainacan' ), 'info_final_value' => __( 'Final value', 'tainacan' ),
'info_show_interval_on_tag' => __( 'Show interval on tag', 'tainacan' ),
// Tainacan Metadatum Types // Tainacan Metadatum Types
'tainacan-text' => __( 'Text', 'tainacan' ), 'tainacan-text' => __( 'Text', 'tainacan' ),
@ -684,7 +685,8 @@ return apply_filters( 'tainacan-admin-i18n', [
'tainacan-filter-taxonomy-taginput' => __( 'Taxonomy Tag Input', 'tainacan' ), 'tainacan-filter-taxonomy-taginput' => __( 'Taxonomy Tag Input', 'tainacan' ),
'tainacan-filter-taxonomy-checkbox' => __( 'Taxonomy Check Box', 'tainacan' ), 'tainacan-filter-taxonomy-checkbox' => __( 'Taxonomy Check Box', 'tainacan' ),
'tainacan-filter-taxonomy-selectbox' => __( 'Taxonomy Select Box', 'tainacan' ), 'tainacan-filter-taxonomy-selectbox' => __( 'Taxonomy Select Box', 'tainacan' ),
'tainacan-filter-numeric-interval' => __( 'Numeric Interval', 'tainacan' ), 'tainacan-filter-numeric-interval' => __( 'Numeric Interval', 'tainacan' ),
'tainacan-filter-numeric-list-interval' => __( 'Numeric Interval List', 'tainacan' ),
// Datepicker months // Datepicker months
'datepicker_month_january' => __( 'January', 'tainacan' ), 'datepicker_month_january' => __( 'January', 'tainacan' ),

53
src/classes/filter-types/numeric-list-interval/FormNumericListInterval.vue
View File

@ -1,11 +1,20 @@
<template> <template>
<b-field :addons="false"> <b-field :addons="false">
<label class="label is-inline"> <label class="label is-inline">
{{ $i18n.getHelperTitle('tainacan-filter-numeric-list-interval', 'predefined_intervals') }}<span>&nbsp;</span> {{ $i18n.getHelperTitle('tainacan-filter-numeric-list-interval', 'intervals') }}<span>&nbsp;</span>
<help-button <help-button
:title="$i18n.getHelperTitle('tainacan-filter-numeric-list-interval', 'predefined_intervals')" :title="$i18n.getHelperTitle('tainacan-filter-numeric-list-interval', 'intervals')"
:message="$i18n.getHelperMessage('tainacan-filter-numeric-list-interval', 'predefined_intervals')"/> :message="$i18n.getHelperMessage('tainacan-filter-numeric-list-interval', 'intervals')"/>
</label> </label>
<div>
<b-field>
<b-checkbox v-model="showIntervalOnTag">
{{ $i18n.get('info_show_interval_on_tag') }}
</b-checkbox>
</b-field>
</div>
<div v-if="intervals.length == 0" > <div v-if="intervals.length == 0" >
<br> <br>
<a <a
@ -27,19 +36,21 @@
<b-input <b-input
expanded="true" expanded="true"
:placeholder="$i18n.get('label')" :placeholder="$i18n.get('label')"
@input="onUpdate" @input="onUpdate(interval)"
v-model="interval.label" /> v-model="interval.label" />
</b-field> </b-field>
<b-field> <b-field>
<b-input <b-input
type="number" type="number"
step="0.01"
:placeholder="$i18n.get('info_initial_value')" :placeholder="$i18n.get('info_initial_value')"
@input="onUpdate" @input="onUpdate(interval)"
v-model="interval.from" /> v-model="interval.from" />
<b-input <b-input
type="number" type="number"
step="0.01"
:placeholder="$i18n.get('info_final_value')" :placeholder="$i18n.get('info_final_value')"
@input="onUpdate" @input="onUpdate(interval)"
v-model="interval.to" /> v-model="interval.to" />
</b-field> </b-field>
<p class="control"> <p class="control">
@ -84,14 +95,35 @@
}, },
data() { data() {
return { return {
showIntervalOnTag: true,
intervals: [], intervals: [],
isValid: true,
} }
}, },
methods: { methods: {
onUpdate() { onUpdate(interval) {
this.$emit('input', { if (interval.to == null || interval.from == null ||
intervals: this.intervals, interval.to == "" || interval.from == "" ||
}); Number(interval.to) < Number(interval.from)) {
if(this.isValid) {
this.isValid = false;
this.error_message()
}
} else {
this.isValid = true;
this.$emit('input', {
intervals: this.intervals,
showIntervalOnTag: this.showIntervalOnTag
});
}
},
error_message() {
this.$buefy.toast.open({
duration: 3000,
message: this.$i18n.get('info_error_first_value_greater'),
position: 'is-bottom',
type: 'is-danger'
})
}, },
removeInterval(index) { removeInterval(index) {
this.intervals.splice(index, 1); this.intervals.splice(index, 1);
@ -114,6 +146,7 @@
}, },
created() { created() {
this.intervals = this.value && this.value.intervals ? this.value.intervals : []; this.intervals = this.value && this.value.intervals ? this.value.intervals : [];
this.showIntervalOnTag = this.value && this.value.showIntervalOnTag != undefined ? this.value.showIntervalOnTag : true;
} }
} }
</script> </script>

12
src/classes/filter-types/numeric-list-interval/NumericListInterval.vue
View File

@ -4,6 +4,9 @@
:placeholder="$i18n.get('instruction_select_a_interval')" :placeholder="$i18n.get('instruction_select_a_interval')"
@input="changeInterval" @input="changeInterval"
v-model="selectedInterval"> v-model="selectedInterval">
<option value="">
{{ $i18n.get('label_clean') }}
</option>
<option <option
v-for="(interval, index) in options.intervals" v-for="(interval, index) in options.intervals"
:value="index" :value="index"
@ -29,7 +32,7 @@
valueEnd: 10, valueEnd: 10,
isValid: false, isValid: false,
collectionId: '', collectionId: '',
metadatum: '', metadatumId: '',
options: [], options: [],
selectedInterval: '' selectedInterval: ''
} }
@ -81,10 +84,10 @@
}); });
if (values[0] != undefined && values[1] != undefined) { if (values[0] != undefined && values[1] != undefined) {
let labelValue = this.options.intervals[this.selectedInterval].label + (this.options.showIntervalOnTag ? `(${values[0]}-${values[1]})` : '');
this.$eventBusSearch.$emit( 'sendValuesToTags', { this.$eventBusSearch.$emit( 'sendValuesToTags', {
filterId: this.filter.id, filterId: this.filter.id,
value: this.options.intervals[this.selectedInterval].label + `(${values[0]}-${values[1]})` value: labelValue
//value: values[0] + ' - ' + values[1]
}); });
} }
}, },
@ -109,9 +112,10 @@
anInterval => anInterval.from == this.valueInit && anInterval.to == this.valueEnd anInterval => anInterval.from == this.valueInit && anInterval.to == this.valueEnd
); );
let labelValue = this.options.intervals[this.selectedInterval].label + (this.options.showIntervalOnTag ? `(${this.valueInit}-${this.valueEnd})` : '');
this.$eventBusSearch.$emit( 'sendValuesToTags', { this.$eventBusSearch.$emit( 'sendValuesToTags', {
filterId: this.filter.id, filterId: this.filter.id,
value: this.options.intervals[this.selectedInterval].label + `(${this.valueInit}-${this.valueEnd})` value: labelValue
}); });
} else { } else {
return false; return false;

58
src/classes/filter-types/numeric-list-interval/class-tainacan-numeric-list-interval.php
View File

@ -15,48 +15,28 @@ class Numeric_List_Interval extends Filter_Type {
$this->set_form_component('tainacan-filter-form-numeric-list-interval'); $this->set_form_component('tainacan-filter-form-numeric-list-interval');
$this->set_use_max_options(false); $this->set_use_max_options(false);
$this->set_default_options([ $this->set_default_options([
'intervals' => [] 'intervals' => [],
'showIntervalOnTag' => false
]); ]);
$this->set_preview_template(' $this->set_preview_template('
<div> <div class="collapse show">
<div class="b-numberinput field is-grouped"> <div class="dropdown is-active">
<p class="control"> <div role="button" class="dropdown-trigger">
<button type="button" class="button is-primary is-small"> <button class="button is-white">
<span class="icon is-small"> List
<i class="mdi mdi-minus"></i> <span class="icon">
<i class="tainacan-icon tainacan-icon-20px tainacan-icon-arrowdown"></i>
</span> </span>
</button> </button>
</p>
<div class="control is-small is-clearfix">
<input type="number" step="0.01" class="input is-small" value="6">
</div> </div>
<p class="control"> <div class="background"></div>
<button type="button" class="button is-primary is-small"> <div class="dropdown-menu">
<span class="icon is-small"> <div role="list" class="dropdown-content">
<i class="mdi mdi-plus"></i> <a class="dropdown-item is-active">Top 10</a>
</span> <a class="dropdown-item">Top 20</a>
</button> <a class="dropdown-item">Top 30</a>
</p> </div>
</div>
<p class="is-size-7 has-text-centered is-marginless">until</p>
<div class="b-numberinput field is-grouped">
<p class="control">
<button type="button" class="button is-primary is-small">
<span class="icon is-small">
<i class="mdi mdi-minus"></i>
</span>
</button>
</p>
<div class="control is-small is-clearfix">
<input type="number" step="0.01" class="input is-small" value="10">
</div> </div>
<p class="control">
<button type="button" class="button is-primary is-small">
<span class="icon is-small">
<i class="mdi mdi-plus"></i>
</span>
</button>
</p>
</div> </div>
</div> </div>
'); ');
@ -64,10 +44,10 @@ class Numeric_List_Interval extends Filter_Type {
public function get_form_labels() { public function get_form_labels() {
return [ return [
'predefined_intervals' => [ 'intervals' => [
'title' => __('Predefined intervals','tainacan'), 'title' => __('Predefined intervals','tainacan'),
'description' => __('Predefined intervals','tainacan') 'description' => __('Predefined intervals','tainacan')
], ]
]; ];
} }
@ -80,6 +60,6 @@ class Numeric_List_Interval extends Filter_Type {
return '<tainacan-filter-numeric-list-interval return '<tainacan-filter-numeric-list-interval
name="'.$filter->get_name().'" name="'.$filter->get_name().'"
collection_id="'.$filter->get_collection_id().'" collection_id="'.$filter->get_collection_id().'"
metadatum_id="'.$filter->get_metadatum()->get_id().'"></tainacan-filter-numeric-interval>'; metadatum_id="'.$filter->get_metadatum()->get_id().'"></tainacan-filter-form-numeric-list-interval>';
} }
} }