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

Adds option to display the filter as a range instead of one date. #887.

This commit is contained in:
mateuswetah 2024-06-03 15:53:13 -03:00
parent a9df08c15f
commit ebf478d5ff
4 changed files with 100 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

30
src/views/admin/components/filter-types/date-interval/TainacanFilterDateInterval.vue
View File

@ -3,7 +3,7 @@
<b-datepicker <b-datepicker
v-model="dateInit" v-model="dateInit"
:aria-labelledby="'filter-label-id-' + filter.id" :aria-labelledby="'filter-label-id-' + filter.id"
:placeholder="$i18n.get('label_selectbox_init')" :placeholder="$i18n.get('instruction_select_a_date')"
editable editable
:trap-focus="false" :trap-focus="false"
:date-formatter="(date) => dateFormatter(date)" :date-formatter="(date) => dateFormatter(date)"
@ -19,6 +19,20 @@
$i18n.get('datepicker_short_friday'), $i18n.get('datepicker_short_friday'),
$i18n.get('datepicker_short_saturday'), $i18n.get('datepicker_short_saturday'),
]" ]"
:month-names="[
$i18n.get('datepicker_month_january'),
$i18n.get('datepicker_month_february'),
$i18n.get('datepicker_month_march'),
$i18n.get('datepicker_month_april'),
$i18n.get('datepicker_month_may'),
$i18n.get('datepicker_month_june'),
$i18n.get('datepicker_month_july'),
$i18n.get('datepicker_month_august'),
$i18n.get('datepicker_month_september'),
$i18n.get('datepicker_month_october'),
$i18n.get('datepicker_month_november'),
$i18n.get('datepicker_month_december')
]"
@focus="isTouched = true" @focus="isTouched = true"
@update:model-value="($event) => { resetPage(); validadeValues($event) }" /> @update:model-value="($event) => { resetPage(); validadeValues($event) }" />
<p <p
@ -45,6 +59,20 @@
$i18n.get('datepicker_short_friday'), $i18n.get('datepicker_short_friday'),
$i18n.get('datepicker_short_saturday'), $i18n.get('datepicker_short_saturday'),
]" ]"
:month-names="[
$i18n.get('datepicker_month_january'),
$i18n.get('datepicker_month_february'),
$i18n.get('datepicker_month_march'),
$i18n.get('datepicker_month_april'),
$i18n.get('datepicker_month_may'),
$i18n.get('datepicker_month_june'),
$i18n.get('datepicker_month_july'),
$i18n.get('datepicker_month_august'),
$i18n.get('datepicker_month_september'),
$i18n.get('datepicker_month_october'),
$i18n.get('datepicker_month_november'),
$i18n.get('datepicker_month_december')
]"
@update:model-value="validadeValues()" @update:model-value="validadeValues()"
@focus="isTouched = true" /> @focus="isTouched = true" />
</div> </div>

25
src/views/admin/components/filter-types/dates-intersection/FormDatesIntersection.vue
View File

@ -69,6 +69,24 @@
</b-select> </b-select>
</b-field> </b-field>
</div> </div>
<b-field
:addons="false"
:label="$i18n.getHelperTitle('tainacan-filter-dates-intersection', 'accept_date_interval')"
style="margin-top: 1.125rem;">
&nbsp;
<b-switch
v-model="acceptDateInterval"
size="is-small"
:true-value="'yes'"
:false-value="'no'"
:native-value="acceptDateInterval == 'yes' ? 'yes' : 'no'"
name="accept_date_interval"
@update:model-value="emitValues()">
<help-button
:title="$i18n.getHelperTitle('tainacan-filter-dates-intersection', 'accept_date_interval')"
:message="$i18n.getHelperMessage('tainacan-filter-dates-intersection', 'accept_date_interval')" />
</b-switch>
</b-field>
</div> </div>
</template> </template>
@ -94,7 +112,8 @@
secondDateMetadatumName: String, secondDateMetadatumName: String,
firstComparator: String, firstComparator: String,
secondComparator: String, secondComparator: String,
comparatorsObject: {} comparatorsObject: {},
acceptDateInterval: String
} }
}, },
watch: { watch: {
@ -110,6 +129,7 @@
this.secondDateMetadatumName = this.modelValue && this.modelValue.secondary_filter_metadatum_name ? this.modelValue.secondary_filter_metadatum_name : ''; this.secondDateMetadatumName = this.modelValue && this.modelValue.secondary_filter_metadatum_name ? this.modelValue.secondary_filter_metadatum_name : '';
this.firstComparator = this.modelValue && this.modelValue.first_comparator ? this.modelValue.first_comparator : '>='; this.firstComparator = this.modelValue && this.modelValue.first_comparator ? this.modelValue.first_comparator : '>=';
this.secondComparator = this.modelValue && this.modelValue.second_comparator ? this.modelValue.second_comparator : '<='; this.secondComparator = this.modelValue && this.modelValue.second_comparator ? this.modelValue.second_comparator : '<=';
this.acceptDateInterval = this.modelValue && this.modelValue.accept_date_interval ? this.modelValue.accept_date_interval : 'no';
this.loading = true; this.loading = true;
this.fetchMetadata(); this.fetchMetadata();
@ -168,7 +188,8 @@
first_comparator: this.firstComparator, first_comparator: this.firstComparator,
second_comparator: this.secondComparator, second_comparator: this.secondComparator,
secondary_filter_metadatum_id: this.secondDateMetadatumId, secondary_filter_metadatum_id: this.secondDateMetadatumId,
secondary_filter_metadatum_name: this.secondDateMetadatumName secondary_filter_metadatum_name: this.secondDateMetadatumName,
accept_date_interval: this.acceptDateInterval
}); });
}, },
setErrorsAttributes( type, message ) { setErrorsAttributes( type, message ) {

40
src/views/admin/components/filter-types/dates-intersection/TainacanFilterDatesIntersection.vue
View File

@ -3,7 +3,7 @@
<b-datepicker <b-datepicker
v-model="dateInit" v-model="dateInit"
:aria-labelledby="'filter-label-id-' + filter.id" :aria-labelledby="'filter-label-id-' + filter.id"
:placeholder="$i18n.get('label_selectbox_init')" :placeholder="$i18n.get('instruction_select_a_date')"
editable editable
:trap-focus="false" :trap-focus="false"
:date-formatter="(date) => dateFormatter(date)" :date-formatter="(date) => dateFormatter(date)"
@ -19,17 +19,33 @@
$i18n.get('datepicker_short_friday'), $i18n.get('datepicker_short_friday'),
$i18n.get('datepicker_short_saturday'), $i18n.get('datepicker_short_saturday'),
]" ]"
:month-names="[
$i18n.get('datepicker_month_january'),
$i18n.get('datepicker_month_february'),
$i18n.get('datepicker_month_march'),
$i18n.get('datepicker_month_april'),
$i18n.get('datepicker_month_may'),
$i18n.get('datepicker_month_june'),
$i18n.get('datepicker_month_july'),
$i18n.get('datepicker_month_august'),
$i18n.get('datepicker_month_september'),
$i18n.get('datepicker_month_october'),
$i18n.get('datepicker_month_november'),
$i18n.get('datepicker_month_december')
]"
@focus="isTouched = true" @focus="isTouched = true"
@update:model-value="($event) => { resetPage(); validadeValues($event) }" /> @update:model-value="($event) => { resetPage(); validadeValues($event) }" />
<p <p
v-if="filterTypeOptions.accept_date_interval === 'yes'"
style="font-size: 0.75em; margin-bottom: 0.125em;" style="font-size: 0.75em; margin-bottom: 0.125em;"
class="has-text-centered is-marginless"> class="has-text-centered is-marginless">
{{ $i18n.get('label_until') }} {{ $i18n.get('label_until') }}
</p> </p>
<b-datepicker <b-datepicker
v-if="filterTypeOptions.accept_date_interval === 'yes'"
v-model="dateEnd" v-model="dateEnd"
:aria-labelledby="'filter-label-id-' + filter.id" :aria-labelledby="'filter-label-id-' + filter.id"
:placeholder="$i18n.get('label_selectbox_init')" :placeholder="$i18n.get('instruction_select_a_date')"
editable editable
:trap-focus="false" :trap-focus="false"
:date-formatter="(date) => dateFormatter(date)" :date-formatter="(date) => dateFormatter(date)"
@ -45,6 +61,20 @@
$i18n.get('datepicker_short_friday'), $i18n.get('datepicker_short_friday'),
$i18n.get('datepicker_short_saturday'), $i18n.get('datepicker_short_saturday'),
]" ]"
:month-names="[
$i18n.get('datepicker_month_january'),
$i18n.get('datepicker_month_february'),
$i18n.get('datepicker_month_march'),
$i18n.get('datepicker_month_april'),
$i18n.get('datepicker_month_may'),
$i18n.get('datepicker_month_june'),
$i18n.get('datepicker_month_july'),
$i18n.get('datepicker_month_august'),
$i18n.get('datepicker_month_september'),
$i18n.get('datepicker_month_october'),
$i18n.get('datepicker_month_november'),
$i18n.get('datepicker_month_december')
]"
@update:model-value="validadeValues()" @update:model-value="validadeValues()"
@focus="isTouched = true" /> @focus="isTouched = true" />
</div> </div>
@ -98,7 +128,7 @@
if ( this.dateEnd === undefined ) if ( this.dateEnd === undefined )
this.dateEnd = new Date(); this.dateEnd = new Date();
if (this.dateInit > this.dateEnd) { if ( this.filterTypeOptions.accept_date_interval === 'yes' && this.dateInit > this.dateEnd ) {
this.showErrorMessage(); this.showErrorMessage();
return return
} }
@ -162,7 +192,7 @@
compare: this.filterTypeOptions.first_comparator, compare: this.filterTypeOptions.first_comparator,
metadatum_id: this.metadatumId, metadatum_id: this.metadatumId,
collection_id: this.collectionId, collection_id: this.collectionId,
value: values value: this.filterTypeOptions.accept_date_interval === 'yes' ? values : values[0]
}); });
this.$emit('input', { this.$emit('input', {
filter: 'intersection', filter: 'intersection',
@ -170,7 +200,7 @@
compare: this.filterTypeOptions.second_comparator, compare: this.filterTypeOptions.second_comparator,
metadatum_id: this.filterTypeOptions.secondary_filter_metadatum_id, metadatum_id: this.filterTypeOptions.secondary_filter_metadatum_id,
collection_id: this.collectionId, collection_id: this.collectionId,
value: values value: this.filterTypeOptions.accept_date_interval === 'yes' ? values : values[0]
}); });
} }
} }

12
src/views/admin/components/filter-types/dates-intersection/class-tainacan-dates-intersection.php
View File

@ -18,7 +18,8 @@ class Dates_Intersection extends Filter_Type {
'secondary_filter_metadatum_id' => '', 'secondary_filter_metadatum_id' => '',
'secondary_filter_metadatum_name' => '', 'secondary_filter_metadatum_name' => '',
'first_comparator' => '>=', 'first_comparator' => '>=',
'second_comparator' => '<=' 'second_comparator' => '<=',
'accept_date_interval' => 'no'
]); ]);
$this->set_use_max_options(false); $this->set_use_max_options(false);
$this->set_preview_template(' $this->set_preview_template('
@ -69,6 +70,10 @@ class Dates_Intersection extends Filter_Type {
'second_comparator' => [ 'second_comparator' => [
'title' => __( 'Second comparator', 'tainacan' ), 'title' => __( 'Second comparator', 'tainacan' ),
'description' => __( 'Comparator to be used for checking the second metadata value.', 'tainacan' ), 'description' => __( 'Comparator to be used for checking the second metadata value.', 'tainacan' ),
],
'accept_date_interval' => [
'title' => __( 'Accept date interval', 'tainacan' ),
'description' => __( 'If checked, the filter will accept date intervals as values.', 'tainacan' ),
] ]
]; ];
} }
@ -99,6 +104,11 @@ class Dates_Intersection extends Filter_Type {
'second_comparator' => __('The second comparator is required.','tainacan') 'second_comparator' => __('The second comparator is required.','tainacan')
]; ];
if ( empty($this->get_option('accept_date_interval')) )
$errors[] = [
'accept_date_interval' => __('The filter should define if it accepts date interval.','tainacan')
];
return count($errors) > 0 ? $errors : true; return count($errors) > 0 ? $errors : true;
} }