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

Begins implementation of enabled comparators for date filter. #886.

This commit is contained in:
mateuswetah 2024-05-31 09:40:38 -03:00
parent 2f127030ed
commit 161fc5cc9f
4 changed files with 163 additions and 65 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/views/admin/components/edition/filter-edition-form.vue
View File

@ -249,6 +249,7 @@ import { nextTick } from 'vue';
import { mapActions } from 'vuex';
import { formHooks } from "../../js/mixins";
import FormFilterDate from '../filter-types/date/FormDate.vue';
import FormFilterNumeric from '../filter-types/numeric/FormNumeric.vue';
import FormFilterNumericInterval from '../filter-types/numeric-interval/FormNumericInterval.vue';
import FormFilterNumericListInterval from '../filter-types/numeric-list-interval/FormNumericListInterval.vue';
@ -256,6 +257,7 @@ import FormFilterNumericListInterval from '../filter-types/numeric-list-interval
export default {
name: 'FilterEditionForm',
components: {
'tainacan-filter-form-date': FormFilterDate,
'tainacan-filter-form-numeric': FormFilterNumeric,
'tainacan-filter-form-numeric-interval': FormFilterNumericInterval,
'tainacan-filter-form-numeric-list-interval': FormFilterNumericListInterval

80
src/views/admin/components/filter-types/date/FormDate.vue Normal file
View File

@ -0,0 +1,80 @@
<template>
<div>
<b-field :addons="false">
<label class="label is-inline">
{{ $i18n.getHelperTitle('tainacan-filter-date', 'comparators') }}<span>&nbsp;*&nbsp;</span>
<help-button
:title="$i18n.getHelperTitle('tainacan-filter-date', 'comparators')"
:message="$i18n.getHelperMessage('tainacan-filter-date', 'comparators')" />
</label>
<div>
<b-checkbox
v-for="(comparatorObject, comparatorKey) in comparatorsObject"
:key="comparatorKey"
v-model="comparators"
:native-value="comparatorObject.key"
name="metadata_type_relationship[display_related_item_metadata]"
@update:model-value="emitValues()">
<span v-html="comparatorObject.symbol + '&nbsp;' + comparatorObject.label" />
</b-checkbox>
</div>
</b-field>
</div>
</template>
<script>
export default {
props: {
modelValue: Object
},
emits: [
'update:model-value',
],
data() {
return {
comparatorsObject: Object
}
},
created() {
this.comparators = ( this.modelValue && this.modelValue.comparators ) ? this.modelValue.comparators : [ '=', '!=', '>', '>=', '<', '<=' ];
this.comparatorsObject = {
'=': {
symbol: '&#61;',
label: this.$i18n.get('is_equal_to'),
enabled: this.comparators.indexOf('=') < 0 ? 'no' : 'yes'
},
'!=': {
symbol: '&#8800;',
label: this.$i18n.get('is_not_equal_to'),
enabled: this.comparators.indexOf('!=') < 0 ? 'no' : 'yes'
},
'>': {
symbol: '&#62;',
label: this.$i18n.get('after'),
enabled: this.comparators.indexOf('>') < 0 ? 'no' : 'yes'
},
'>=': {
symbol: '&#8805;',
label: this.$i18n.get('after_or_on_day'),
enabled: this.comparators.indexOf('>=') < 0 ? 'no' : 'yes'
},
'<': {
symbol: '&#60;',
label: this.$i18n.get('before'),
enabled: this.comparators.indexOf('<') < 0 ? 'no' : 'yes'
},
'<=': {
symbol: '&#8804;',
label: this.$i18n.get('before_or_on_day'),
enabled: this.comparators.indexOf('<=') < 0 ? 'no' : 'yes'
}
};
},
methods: {
onUpdateComparators(value) {
this.$emit('update:model-value', { comparators: value });
}
}
}
</script>

113
src/views/admin/components/filter-types/date/TainacanFilterDate.vue
View File

@ -10,66 +10,25 @@
:aria-label="$i18n.get('label_comparator')"
class="button is-white">
<span class="icon is-small">
<i v-html="comparatorSymbol" />
<i v-html="comparatorsObject[comparator].symbol" />
</span>
<span class="icon">
<i class="tainacan-icon tainacan-icon-1-25em tainacan-icon-arrowdown" />
</span>
</button>
</template>
<b-dropdown-item
role="button"
:class="{ 'is-active': comparator == '=' }"
:value="'='"
aria-role="listitem">
&#61;&nbsp; {{ $i18n.get('is_equal_to') }}
</b-dropdown-item>
<b-dropdown-item
role="button"
:class="{ 'is-active': comparator == '!=' }"
:value="'!='"
aria-role="listitem">
&#8800;&nbsp; {{ $i18n.get('is_not_equal_to') }}
</b-dropdown-item>
<b-dropdown-item
role="button"
:class="{ 'is-active': comparator == '>' }"
:value="'>'"
aria-role="listitem">
&#62;&nbsp; {{ $i18n.get('after') }}
</b-dropdown-item>
<b-dropdown-item
role="button"
:class="{ 'is-active': comparator == '>=' }"
:value="'>='"
aria-role="listitem">
&#8805;&nbsp; {{ $i18n.get('after_or_on_day') }}
</b-dropdown-item>
<b-dropdown-item
role="button"
:class="{ 'is-active': comparator == '<' }"
:value="'<'"
aria-role="listitem">
&#60;&nbsp; {{ $i18n.get('before') }}
</b-dropdown-item>
<b-dropdown-item
role="button"
:class="{ 'is-active': comparator == '<=' }"
:value="'<='"
aria-role="listitem">
&#8804;&nbsp; {{ $i18n.get('before_or_on_day') }}
</b-dropdown-item>
<template
v-for="(comparatorObject, comparatorKey) in comparatorsObject"
:key="comparatorKey">
<b-dropdown-item
v-if="comparatorObject.enabled == 'yes'"
role="button"
:class="{ 'is-active': comparator == comparatorKey }"
:value="comparatorKey"
aria-role="listitem"
v-html="comparatorObject.symbol + '&nbsp;' + comparatorObject.label" />
</template>
</b-dropdown>
<!-- <b-numberinput
v-if="filterTypeOptions.type == 'year'"
:placeholder="$i18n.get('instruction_type_value_year')"
:aria-labelledby="'filter-label-id-' + filter.id"
:aria-minus-label="$i18n.get('label_decrease')"
:aria-plus-label="$i18n.get('label_increase')"
size="is-small"
step="1"
@update:model-value="emitOnlyYear($event)"
v-model="yearsOnlyValue"/> -->
<b-datepicker
v-model="value"
position="is-bottom-right"
@ -126,26 +85,16 @@
emits: [
'input',
],
data(){
data() {
return {
value: null,
comparatorsObject: [],
comparator: '=', // =, !=, >, >=, <, <=
}
},
computed: {
yearsOnlyValue() {
return this.value && typeof this.value.getUTCFullYear === 'function' ? this.value.getUTCFullYear() : null
},
comparatorSymbol() {
switch(this.comparator) {
case '=': return '&#61;';
case '!=': return '&#8800;';
case '>': return '&#62;';
case '>=': return '&#8805;';
case '<': return '&#60;';
case '<=': return '&#8804;';
default: return '';
}
}
},
watch: {
@ -156,6 +105,40 @@
deep: true,
},
},
created() {
this.comparatorsObject = {
'=': {
symbol: '&#61;',
label: this.$i18n.get('is_equal_to'),
enabled: this.filterTypeOptions.comparators.indexOf('=') < 0 ? 'no' : 'yes'
},
'!=': {
symbol: '&#8800;',
label: this.$i18n.get('is_not_equal_to'),
enabled: this.filterTypeOptions.comparators.indexOf('!=') < 0 ? 'no' : 'yes'
},
'>': {
symbol: '&#62;',
label: this.$i18n.get('after'),
enabled: this.filterTypeOptions.comparators.indexOf('>') < 0 ? 'no' : 'yes'
},
'>=': {
symbol: '&#8805;',
label: this.$i18n.get('after_or_on_day'),
enabled: this.filterTypeOptions.comparators.indexOf('>=') < 0 ? 'no' : 'yes'
},
'<': {
symbol: '&#60;',
label: this.$i18n.get('before'),
enabled: this.filterTypeOptions.comparators.indexOf('<') < 0 ? 'no' : 'yes'
},
'<=': {
symbol: '&#8804;',
label: this.$i18n.get('before_or_on_day'),
enabled: this.filterTypeOptions.comparators.indexOf('<=') < 0 ? 'no' : 'yes'
},
};
},
mounted() {
this.updateSelectedValues();
},

33
src/views/admin/components/filter-types/date/class-tainacan-date.php
View File

@ -13,7 +13,11 @@ class Date extends Filter_Type {
$this->set_name( __('Date', 'tainacan') );
$this->set_supported_types(['date']);
$this->set_component('tainacan-filter-date');
$this->set_form_component('tainacan-filter-form-date');
$this->set_use_max_options(false);
$this->set_default_options([
'comparators' => [ '=', '!=', '>', '>=', '<', '<=' ]
]);
$this->set_preview_template('
<div>
<div>
@ -57,6 +61,35 @@ class Date extends Filter_Type {
');
}
/**
* @inheritdoc
*/
public function get_form_labels(){
return [
'comparators' => [
'title' => __( 'Enabled comparators', 'tainacan' ),
'description' => __( 'A list of comparators to be available in the filter, such as equal, greater than, smaller than, etc.', 'tainacan' ),
]
];
}
/**
* @param \Tainacan\Entities\Filter $filter
* @return array|bool true if is validate or array if has error
*/
public function validate_options(\Tainacan\Entities\Filter $filter) {
if ( !in_array($filter->get_status(), apply_filters('tainacan-status-require-validation', ['publish','future','private'])) )
return true;
if ( empty( $this->get_option('comparators') ) )
return [
'comparators' => __('"Comparators" array is required', 'tainacan')
];
return true;
}
}
class Date_Helper {