Major Advanced Search refactor #321.

This commit is contained in:
mateuswetah 2022-02-16 16:21:50 -03:00
parent 61f138fd33
commit d95871e254
9 changed files with 442 additions and 747 deletions

View File

@ -750,13 +750,12 @@ class REST_Items_Controller extends REST_Controller {
private function get_items_permissions_check_for_taxonomy($taxonomies) { private function get_items_permissions_check_for_taxonomy($taxonomies) {
foreach ($taxonomies as $tax) { foreach ($taxonomies as $tax) {
if( !isset($tax['taxonomy']) ) if ( isset($tax['taxonomy']) ) {
return false; $taxonomy = \tainacan_taxonomies()->fetch_by_db_identifier( $tax['taxonomy'] );
$taxonomy = \tainacan_taxonomies()->fetch_by_db_identifier( $tax['taxonomy'] );
if( $taxonomy instanceof Entities\Taxonomy ) { if ( $taxonomy instanceof Entities\Taxonomy ) {
if(!$taxonomy->can_read()) { if (!$taxonomy->can_read())
return false; return false;
} }
} }
} }

View File

@ -429,7 +429,6 @@
this.isUpdating = false; this.isUpdating = false;
this.closedByForm = true; this.closedByForm = true;
this.$root.$emit('metadatumUpdated', this.isRepositoryLevel);
this.$emit('onEditionFinished'); this.$emit('onEditionFinished');
}) })
.catch((errors) => { .catch((errors) => {
@ -468,7 +467,6 @@
this.isUpdating = false; this.isUpdating = false;
this.closedByForm = true; this.closedByForm = true;
this.$root.$emit('metadatumUpdated', this.isRepositoryLevel);
this.$emit('onEditionFinished'); this.$emit('onEditionFinished');
}) })
.catch((errors) => { .catch((errors) => {

View File

@ -59,38 +59,12 @@
icon-right="magnify" icon-right="magnify"
icon-right-clickable icon-right-clickable
@icon-right-click="updateSearch()" /> @icon-right-click="updateSearch()" />
<b-dropdown <router-link
v-if="!$adminOptions.hideTainacanHeaderAdvancedSearch" v-if="!$adminOptions.hideTainacanHeaderAdvancedSearch"
ref="advancedSearchShortcut" class="advanced-search-text"
class="advanced-search-header-dropdown" :to="$routerHelper.getItemsPath({ advancedSearch: true })">
position="is-bottom-left" {{ $i18n.get('advanced_search') }}
aria-role="list" </router-link>
trap-focus>
<a
class="advanced-search-text"
slot="trigger">
{{ $i18n.get('advanced_search') }}
</a>
<b-dropdown-item aria-role="listitem">
<div :style="{'height': '25px'}">
<p class="is-pulled-left advanced-search-text-di">{{ $i18n.get('advanced_search') }}</p>
<span
style="margin-top: 5px; margin-right: -2px;"
class="icon is-pulled-right">
<i class="tainacan-icon tainacan-icon-1-25em tainacan-icon-arrowup has-text-secondary"/>
</span>
</div>
<hr class="advanced-search-hr">
</b-dropdown-item>
<b-dropdown-item
style="padding-left: 0 !important; padding-right: 0 !important;"
:custom="true"
aria-role="listitem">
<advanced-search
:is-repository-level="true"
:is-header="true"/>
</b-dropdown-item>
</b-dropdown>
</div> </div>
<button <button
@ -130,13 +104,11 @@
</template> </template>
<script> <script>
import AdvancedSearch from '../search/advanced-search.vue';
import ProcessesPopup from '../other/processes-popup.vue'; import ProcessesPopup from '../other/processes-popup.vue';
export default { export default {
name: 'TainacanHeader', name: 'TainacanHeader',
components: { components: {
AdvancedSearch,
ProcessesPopup ProcessesPopup
}, },
data() { data() {
@ -150,41 +122,22 @@
} }
}, },
created(){ created(){
this.$root.$on('closeAdvancedSearchShortcut', () => {
if (this.$refs.advancedSearchShortcut)
this.$refs.advancedSearchShortcut.toggle();
});
this.$root.$on('openProcessesPopup', () => { this.$root.$on('openProcessesPopup', () => {
this.showProcesses = true; this.showProcesses = true;
}); });
}, },
beforeDestroy() { beforeDestroy() {
this.$root.$off('closeAdvancedSearchShortcut'); this.$root.$off('openProcessesPopup');
}, },
methods: { methods: {
// toItemsPage() {
// if(this.$route.path == '/items') {
// this.$root.$emit('openAdvancedSearch', true);
// }
//
// if(this.$route.path != '/items') {
// this.$router.push({
// path: '/items',
// query: {
// advancedSearch: true
// }
// });
// }
// },
updateSearch() { updateSearch() {
if (this.$route.path != '/items') { if (this.$route.path !== '/items') {
this.$router.push({ this.$router.push({
path: '/items', path: '/items',
}); });
} }
this.$eventBusSearch.setSearchQuery(this.futureSearchQuery); this.$eventBusSearch.setSearchQuery(this.futureSearchQuery);
}, }
} }
} }
</script> </script>
@ -273,6 +226,10 @@
display: flex; display: flex;
align-items: center; align-items: center;
margin-right: 28px; margin-right: 28px;
.advanced-search-text {
font-size: 0.75em;
margin-left: 12px;
}
.control { .control {
.search-header { .search-header {
border: 1px solid var(--tainacan-gray2); border: 1px solid var(--tainacan-gray2);

View File

@ -1,232 +1,179 @@
<template> <template>
<div> <div class="tnc-advanced-search-container">
<transition-group name="filter-item">
<b-field
v-for="searchCriterion in searchCriteria"
:key="searchCriterion"
grouped
class="tainacan-form">
<!-- Metadata (Search criteria) -->
<b-field class="column">
<b-select
:loading="isLoadingMetadata"
:placeholder="$i18n.get('instruction_select_a_metadatum')"
:disabled="(advancedSearchQuery.taxquery[searchCriterion] || advancedSearchQuery.metaquery[searchCriterion]) ? true : false"
:value="(
advancedSearchQuery.metaquery[searchCriterion] ? advancedSearchQuery.metaquery[searchCriterion].key : null
) || (
advancedSearchQuery.taxquery[searchCriterion] ? advancedSearchQuery.taxquery[searchCriterion].key : null
)"
@input="addMetadatumToAdvancedSearchQuery(
{
metadatumId: $event,
type: (metadataAsObject[$event] && metadataAsObject[$event].metadata_type_object) ? metadataAsObject[$event].metadata_type_object.primitive_type : '',
taxonomy: (metadataAsObject[$event] && metadataAsObject[$event].metadata_type_options) ? metadataAsObject[$event].metadata_type_options.taxonomy : ''
},
searchCriterion
)">
<template v-for="(metadatum, metadatumIndex) in metadataAsArray">
<option
v-if="metadatum.metadata_type_object.component !== 'tainacan-user' &&
metadatum.metadata_type_object.component !== 'tainacan-relationship' &&
metadatum.metadata_type_object.component !== 'tainacan-compound' &&
metadatum.parent <= 0"
:value="metadatum.id"
:key="metadatumIndex">
{{ metadatum.name }}
</option>
<optgroup
v-if="metadatum.metadata_type_object.component === 'tainacan-compound'"
:key="metadatumIndex"
:label="metadatum.name">
<option
v-for="(childMetadatum, childIndex) of metadatum.metadata_type_options.children_objects"
:key="childIndex"
:value="childMetadatum.id">
{{ childMetadatum.name }}
</option>
</optgroup>
</template>
<option value="document_content_index-undefined-string">
{{ $i18n.get('label_document') }}
</option>
</b-select>
</b-field>
<!-- Comparators -->
<b-field class="column">
<b-select
:loading="isLoadingMetadata"
v-if="advancedSearchQuery.taxquery[searchCriterion] ||
advancedSearchQuery.metaquery[searchCriterion] ? true : false"
@input="addComparatorToAdvancedSearchQuery($event, searchCriterion)"
:value="advancedSearchQuery.taxquery[searchCriterion] ?
advancedSearchQuery.taxquery[searchCriterion].operator :
(advancedSearchQuery.metaquery[searchCriterion] ? advancedSearchQuery.metaquery[searchCriterion].compare : '')">
<option
v-for="(comparator, key) in getComparators(searchCriterion)"
:key="key"
:value="key"
>{{ comparator }}</option>
</b-select>
<b-input
v-else
type="text"
disabled />
</b-field>
<!-- Inputs -->
<b-field class="column is-half">
<b-input
v-if="advancedSearchQuery.metaquery[searchCriterion] && getAdvancedSearchQueryCriterionMetadataType(searchCriterion) != 'date'"
:type="(getAdvancedSearchQueryCriterionMetadataType(searchCriterion) == 'int' || getAdvancedSearchQueryCriterionMetadataType(searchCriterion) == 'float') ? 'number' : 'text'"
step="any"
@input="addValueToAdvancedSearchQuery($event, searchCriterion)"
:value="advancedSearchQuery.metaquery[searchCriterion].value"
/>
<input
v-else-if="getAdvancedSearchQueryCriterionMetadataType(searchCriterion) == 'date'"
class="input"
:value="parseValidDateToNavigatorLanguage(advancedSearchQuery.metaquery[searchCriterion].value)"
v-mask="dateMask"
@input="addValueToAdvancedSearchQuery($event.target.value, searchCriterion)"
:placeholder="dateFormat"
type="text" >
<b-input
v-else-if="advancedSearchQuery.taxquery[searchCriterion]"
:value="advancedSearchQuery.taxquery[searchCriterion].terms"
@input="addValueToAdvancedSearchQuery($event, searchCriterion)"
type="text" />
<b-input
v-else
type="text"
disabled />
</b-field>
<div class="field">
<button
@click="removeCriterion(searchCriterion)"
class="button is-white is-pulled-right has-text-secondary">
<span
v-tooltip="{
content: $i18n.get('remove_search_criterion'),
autoHide: true,
placement: 'auto-end'
}"
class="icon">
<i class="tainacan-icon tainacan-icon-1-25em tainacan-icon-cancel"/>
</span>
</button>
</div>
</b-field>
</transition-group>
<!-- Add button -->
<div class="add-link-advanced-search">
<a
@click="addSearchCriteria"
style="font-size: 0.75em;">
<span class="icon is-small">
<i class="has-text-secondary tainacan-icon tainacan-icon-add"/>
</span>
{{ searchCriteria.length &lt;= 0 ?
$i18n.get('add_one_search_criterion') :
$i18n.get('add_another_search_criterion')
}}
</a>
</div>
<!-- Clear and search button -->
<div class="field is-grouped is-justify-content-flex-end">
<p
v-if="Object.keys(advancedSearchQuery.taxquery).length > 0 || Object.keys(advancedSearchQuery.metaquery).length > 0"
class="control">
<button
@click="clearSearch(); performAdvancedSearch();"
class="button is-outlined">{{ $i18n.get('clear_search') }}</button>
</p>
<p class="control">
<button
@click="performAdvancedSearch()"
class="button is-success">{{ $i18n.get('apply') }}</button>
</p>
</div>
<section <section
:style="{ position: relative }" v-if="!isLoadingMetadata && metadataAsArray && metadataAsArray.length <= 0"
v-if="!metadata || metadata.length <= 0"
class="field is-grouped-centered section"> class="field is-grouped-centered section">
<b-loading <div class="content has-text-gray has-text-centered">
:is-full-page="false"
:active.sync="metadataIsLoading"/>
<div
v-if="!metadataIsLoading"
class="content has-text-gray has-text-centered">
<p> <p>
<span class="icon is-large"> <span class="icon is-large">
<i class="tainacan-icon tainacan-icon-36px tainacan-icon-metadata"/> <i class="tainacan-icon tainacan-icon-36px tainacan-icon-metadata"/>
</span> </span>
</p> </p>
<p>{{ isRepositoryLevel ? <p>
$i18n.get('info_there_are_no_metadata_in_repository_level' ) : {{ isRepositoryLevel ? $i18n.get('info_there_are_no_metadata_in_repository_level' ) : $i18n.get('info_there_are_no_metadata_to_search' ) }}
$i18n.get('info_there_are_no_metadata_to_search' ) }}</p> </p>
</div> </div>
</section> </section>
<div
v-else
:style="advancedSearchResults ? { 'padding-top': '0' } : { 'padding-top': '1.25em' }"
:class="{ 'padding-in-header': isHeader, 'padding-regular': !isHeader }"
class="tnc-advanced-search-container">
<div </div>
v-show="!advancedSearchResults"
v-for="searchCriterion in searchCriteria"
:key="searchCriterion"
class="field is-12 tainacan-form">
<b-field
class="columns"
grouped>
<!-- Metadata (Search criteria) -->
<b-field
:class="{'is-3': isHeader}"
class="column">
<b-select
:placeholder="$i18n.get('instruction_select_a_metadatum')"
:disabled="advancedSearchQuery.taxquery[searchCriterion] ||
advancedSearchQuery.metaquery[searchCriterion] ? true : false"
:value="advancedSearchQuery.metaquery[searchCriterion] ?
advancedSearchQuery.metaquery[searchCriterion].originalMeta :
(advancedSearchQuery.taxquery[searchCriterion] ? advancedSearchQuery.taxquery[searchCriterion].originalMeta : undefined)"
@input="addToAdvancedSearchQuery($event, 'metadatum', searchCriterion)">
<template v-for="(metadatum, metadatumIndex) in metadata">
<option
v-if="metadatum.metadata_type_object.component !== 'tainacan-user' && metadatum.metadata_type_object.component !== 'tainacan-relationship' && metadatum.metadata_type_object.component !== 'tainacan-compound' && metadatum.parent <= 0"
:value="`${metadatum.id}-${metadatum.metadata_type_options.taxonomy}-${metadatum.metadata_type_object.primitive_type}`"
:key="metadatumIndex">
{{ metadatum.name }}
</option>
<optgroup
v-if="metadatum.metadata_type_object.component === 'tainacan-compound'"
:key="metadatumIndex"
:label="metadatum.name">
<option
v-for="(childMetadatum, childIndex) of metadatum.metadata_type_options.children_objects"
:key="childIndex"
:value="`${childMetadatum.id}-${childMetadatum.metadata_type_options.taxonomy}-${childMetadatum.metadata_type_object.primitive_type}`">
{{ childMetadatum.name }}
</option>
</optgroup>
</template>
<option value="document_content_index-undefined-string">
{{ $i18n.get('label_document') }}
</option>
</b-select>
</b-field>
<!-- Inputs -->
<b-field
:class="{'is-half': !isHeader}"
class="column">
<b-input
v-if="advancedSearchQuery.metaquery[searchCriterion] &&
advancedSearchQuery.metaquery[searchCriterion].ptype != 'date'"
:type="advancedSearchQuery.metaquery[searchCriterion].ptype == 'int' ||
advancedSearchQuery.metaquery[searchCriterion].ptype == 'float' ? 'number' : 'text'"
step="any"
@input="addValueToAdvancedSearchQuery($event, 'value', searchCriterion)"
:value="advancedSearchQuery.metaquery[searchCriterion].value"
/>
<input
v-else-if="advancedSearchQuery.metaquery[searchCriterion] &&
advancedSearchQuery.metaquery[searchCriterion].ptype == 'date'"
class="input"
:value="parseValidDateToNavigatorLanguage(advancedSearchQuery.metaquery[searchCriterion].value)"
v-mask="dateMask"
@focus="addValueToAdvancedSearchQueryWithoutDelay($event, '', searchCriterion)"
@input="addValueToAdvancedSearchQueryWithoutDelay($event, 'value', searchCriterion)"
:placeholder="dateFormat"
type="text" >
<b-input
v-else-if="advancedSearchQuery.taxquery[searchCriterion]"
:value="advancedSearchQuery.taxquery[searchCriterion].terms"
@input="addValueToAdvancedSearchQuery($event, 'term_value', searchCriterion)"
type="text" />
<b-input
v-else
type="text"
disabled />
</b-field>
<!-- Comparators -->
<b-field
:class="{'is-3': isHeader}"
class="column">
<b-select
v-if="advancedSearchQuery.taxquery[searchCriterion] ||
advancedSearchQuery.metaquery[searchCriterion] ? true : false"
@input="addToAdvancedSearchQuery($event, 'comparator', searchCriterion)"
:value="advancedSearchQuery.taxquery[searchCriterion] ?
advancedSearchQuery.taxquery[searchCriterion].operator :
(advancedSearchQuery.metaquery[searchCriterion] ? advancedSearchQuery.metaquery[searchCriterion].compare : '')">
<option
v-for="(comparator, key) in getComparators(searchCriterion)"
:key="key"
:value="key"
>{{ comparator }}</option>
</b-select>
<b-input
v-else
type="text"
disabled />
</b-field>
<div class="field">
<button
@click="removeThis(searchCriterion)"
:class="{'has-text-blue4': isHeader, 'has-text-secondary': !isHeader,}"
class="button is-white is-pulled-right">
<span
v-tooltip="{
content: $i18n.get('remove_search_criterion'),
autoHide: true,
placement: 'auto-end'
}"
class="icon">
<i class="tainacan-icon tainacan-icon-1-25em tainacan-icon-close"/>
</span>
</button>
</div>
</b-field>
</div>
<!-- Add button -->
<div
v-show="!advancedSearchResults"
:class="{'add-link-advanced-search-header': isHeader, 'add-link-advanced-search': !isHeader }"
class="field column is-12">
<a
@click="addSearchCriteria"
style="font-size: 0.75em;">
<span class="icon is-small">
<i class="has-text-secondary tainacan-icon tainacan-icon-add"/>
</span>
{{ searchCriteria.length &lt;= 0 ?
$i18n.get('add_one_search_criterion') :
$i18n.get('add_another_search_criterion')
}}
</a>
</div>
<!-- Tags -->
<div
v-show="advancedSearchResults"
class="column is-12">
<b-field
grouped
group-multiline>
<div
v-for="searchCriterion in searchCriteria"
:key="searchCriterion"
class="control taginput-container">
<b-tag
v-if="advancedSearchQuery.taxquery[searchCriterion] && advancedSearchQuery.taxquery[searchCriterion].terms"
type="is-white"
class="is-rounded"
@close="removeThis(searchCriterion); searchAdvanced();"
attached
closable>
{{ advancedSearchQuery.taxquery[searchCriterion].terms }}
</b-tag>
<b-tag
v-else-if="advancedSearchQuery.metaquery[searchCriterion] && advancedSearchQuery.metaquery[searchCriterion].value"
type="is-white"
class="is-rounded"
@close="removeThis(searchCriterion); searchAdvanced();"
attached
:loading="isFetching"
closable>
{{ advancedSearchQuery.metaquery[searchCriterion].value }}
</b-tag>
</div>
</b-field>
</div>
<!-- Clear and search button -->
<div v-show="!advancedSearchResults">
<div class="field is-grouped is-pulled-right">
<p
v-if="Object.keys(advancedSearchQuery.taxquery).length > 0 ||
Object.keys(advancedSearchQuery.metaquery).length > 0"
class="control">
<button
@click="clearSearch"
class="button is-outlined">{{ $i18n.get('clear_search') }}</button>
</p>
<p class="control">
<button
@click="searchAdvanced"
class="button is-success">{{ $i18n.get('search') }}</button>
</p>
</div>
</div>
</div>
</div>
</template> </template>
<script> <script>
import { mapActions } from 'vuex'; import { mapActions } from 'vuex';
import { dateInter } from '../../js/mixins.js'; import { dateInter } from '../../js/mixins.js';
import moment from 'moment'; import moment from 'moment';
@ -236,10 +183,7 @@
mixins: [ dateInter ], mixins: [ dateInter ],
props: { props: {
isRepositoryLevel: false, isRepositoryLevel: false,
isHeader: false, hasAdvancedSearchResults: false,
advancedSearchResults: false,
openFormAdvancedSearch: false,
isDoingSearch: false,
collectionId: '' collectionId: ''
}, },
data() { data() {
@ -268,54 +212,14 @@
metaquery: {}, metaquery: {},
taxquery: {} taxquery: {}
}, },
metadataIsLoading: false, isLoadingMetadata: false,
metadata: [], metadataAsObject: {},
metadataAsArray: [],
metadataSearchCancel: undefined metadataSearchCancel: undefined
} }
}, },
watch: {
isDoingSearch() {
if (this.isDoingSearch)
this.searchAdvanced();
}
},
mounted() {
this.$root.$on('metadatumUpdated', (isRepositoryLevel) => {
if (isRepositoryLevel) {
this.metadataIsLoading = true;
// Cancels previous Request
if (this.metadataSearchCancel != undefined)
this.metadataSearchCancel.cancel('Metadata search Canceled.');
this.fetchMetadata({
collectionId: this.isRepositoryLevel ? false : this.collectionId,
isRepositoryLevel: this.isRepositoryLevel,
isContextEdit: false,
includeDisabled: false,
isAdvancedSearch: true,
parent: 'any'
}).then((resp) => {
resp.request
.then((metadata) => {
this.metadata = metadata;
this.metadataIsLoading = false;
}).catch(() => {
this.metadataIsLoading = false;
});
// Search Request Token for cancelling
this.metadataSearchCancel = resp.source;
})
.catch(() => this.metadataIsLoading = false);
}
});
},
created() { created() {
this.isLoadingMetadata = true;
this.metadataIsLoading = true;
this.fetchMetadata({ this.fetchMetadata({
collectionId: this.isRepositoryLevel ? false : this.collectionId, collectionId: this.isRepositoryLevel ? false : this.collectionId,
@ -327,67 +231,26 @@
}).then((resp) => { }).then((resp) => {
resp.request resp.request
.then((metadata) => { .then((metadata) => {
this.metadata = metadata; // We create and object keyed by IDs to easily match the query params,
this.metadataIsLoading = false; // but keep an array version to use the order in the select
this.metadataAsArray = metadata;
metadata.forEach(metadatum => {
this.metadataAsObject[metadatum.id] = metadatum;
});
// Search Request Token for cancelling
this.metadataSearchCancel = resp.source;
this.buildAdvancedSearchQueryFromRoute();
this.isLoadingMetadata = false;
}).catch(() => { }).catch(() => {
this.metadataIsLoading = false; this.isLoadingMetadata = false;
}); });
// Search Request Token for cancelling
this.metadataSearchCancel = resp.source;
}) })
.catch(() => this.metadataIsLoading = false); .catch(() => this.isLoadingMetadata = false);
if ((this.$route.query.metaquery && Object.keys(this.$route.query.metaquery).length > 0) ||
(this.$route.query.taxquery && Object.keys(this.$route.query.taxquery).length > 0) ) {
this.searchCriteria = [];
}
if (this.$route.query.metaquery && Object.keys(this.$route.query.metaquery).length > 0) {
let metaquery = this.$route.query.metaquery;
for(let meta in metaquery)
this.$set(this.advancedSearchQuery.metaquery, `${meta}`, metaquery[meta]);
let keys = Object.keys(this.advancedSearchQuery.metaquery);
let relationIndex = keys.findIndex((element) => element == 'relation');
if (relationIndex != -1)
keys.splice(relationIndex, 1);
for(let k of keys)
this.searchCriteria.push(k);
}
if (this.$route.query.taxquery && Object.keys(this.$route.query.taxquery).length > 0) {
let taxquery = this.$route.query.taxquery;
for(let tax in taxquery)
this.$set(this.advancedSearchQuery.taxquery, `${tax}`, taxquery[tax]);
let keys = Object.keys(this.advancedSearchQuery.taxquery);
let relationIndex = keys.findIndex((element) => element == 'relation');
if (relationIndex != -1)
keys.splice(relationIndex, 1);
for (let k of keys)
this.searchCriteria.push(k);
}
// If we're coming from a preset advanced search, execute it!
if (this.searchCriteria.length && !this.isHeader) {
this.$eventBusSearch.updateStoreFromURL();
this.searchAdvanced();
}
}, },
beforeDestroy() { beforeDestroy() {
this.$root.$off('metadatumUpdated');
// Cancels previous Request // Cancels previous Request
if (this.metadataSearchCancel != undefined) if (this.metadataSearchCancel != undefined)
this.metadataSearchCancel.cancel('Metadata search Canceled.'); this.metadataSearchCancel.cancel('Metadata search Canceled.');
@ -401,25 +264,77 @@
if (this.advancedSearchQuery.taxquery[searchCriterion]) { if (this.advancedSearchQuery.taxquery[searchCriterion]) {
return this.taxqueryOperators; return this.taxqueryOperators;
} else if (this.advancedSearchQuery.metaquery[searchCriterion]) { } else if (this.advancedSearchQuery.metaquery[searchCriterion]) {
if (this.advancedSearchQuery.metaquery[searchCriterion].ptype == 'int' || const metadataType = this.getAdvancedSearchQueryCriterionMetadataType(searchCriterion);
this.advancedSearchQuery.metaquery[searchCriterion].ptype == 'float' || if (metadataType == 'date' || metadataType == 'int' || metadataType == 'float')
this.advancedSearchQuery.metaquery[searchCriterion].ptype == 'date') {
return this.metaqueryOperatorsForInterval; return this.metaqueryOperatorsForInterval;
} else{ else
return this.metaqueryOperatorsRegular; return this.metaqueryOperatorsRegular;
}
} }
}, },
removeThis(searchCriterion) { buildAdvancedSearchQueryFromRoute() {
if (
(this.$route.query.metaquery && Object.keys(this.$route.query.metaquery).length > 0) ||
(this.$route.query.taxquery && Object.keys(this.$route.query.taxquery).length > 0)
) {
this.searchCriteria = [];
}
if (this.$route.query.metaquery && Object.keys(this.$route.query.metaquery).length > 0) {
let metaquery = this.$route.query.metaquery;
for (let meta in metaquery) {
if ( this.metaqueryOperatorsRegular.hasOwnProperty(metaquery[meta]['operator']) || this.metaqueryOperatorsForInterval.hasOwnProperty(metaquery[meta]['operator']) )
this.$set(this.advancedSearchQuery.metaquery, `${meta}`, metaquery[meta]);
}
let metakeys = Object.keys(this.advancedSearchQuery.metaquery);
let relationIndex = metakeys.findIndex((element) => element == 'relation');
if (relationIndex != -1)
metakeys.splice(relationIndex, 1);
for (let metakey of metakeys)
this.searchCriteria.push(metakey);
}
if (this.$route.query.taxquery && Object.keys(this.$route.query.taxquery).length > 0) {
let taxquery = this.$route.query.taxquery;
for (let tax in taxquery) {
if ( this.taxqueryOperators.hasOwnProperty(taxquery[tax]['operator']) )
this.$set(this.advancedSearchQuery.taxquery, `${tax}`, taxquery[tax]);
}
let taxkeys = Object.keys(this.advancedSearchQuery.taxquery);
let relationIndex = taxkeys.findIndex((element) => element == 'relation');
if (relationIndex != -1)
taxkeys.splice(relationIndex, 1);
for (let taxkey of taxkeys)
this.searchCriteria.push(taxkey);
}
// If we're coming from a preset advanced search, execute it!
if (this.searchCriteria.length) {
this.$eventBusSearch.updateStoreFromURL();
this.performAdvancedSearch();
}
},
removeCriterion(searchCriterion) {
let criteriaIndex = this.searchCriteria.findIndex((element) => element == searchCriterion); let criteriaIndex = this.searchCriteria.findIndex((element) => element == searchCriterion);
this.searchCriteria.splice(criteriaIndex, 1); if (criteriaIndex >= 0)
this.searchCriteria.splice(criteriaIndex, 1);
if (this.advancedSearchQuery.taxquery[searchCriterion]) if (this.advancedSearchQuery.taxquery[searchCriterion])
delete this.advancedSearchQuery.taxquery[searchCriterion]; delete this.advancedSearchQuery.taxquery[searchCriterion];
else if (this.advancedSearchQuery.metaquery[searchCriterion]) else if (this.advancedSearchQuery.metaquery[searchCriterion])
delete this.advancedSearchQuery.metaquery[searchCriterion]; delete this.advancedSearchQuery.metaquery[searchCriterion];
}, },
addSearchCriteria() { addSearchCriteria() {
let aleatoryKey = Math.floor(Math.random() * (1000 - 2 + 1)) + 2; let aleatoryKey = Math.floor(Math.random() * (1000 - 2 + 1)) + 2;
@ -442,34 +357,72 @@
convertDateToMatchInDB(dateValue) { convertDateToMatchInDB(dateValue) {
return moment(dateValue, this.dateFormat).toISOString().split('T')[0]; return moment(dateValue, this.dateFormat).toISOString().split('T')[0];
}, },
addValueToAdvancedSearchQueryWithoutDelay($event, type, searchCriterion) { parseValidDateToNavigatorLanguage(date) {
if (type == '') { if (date && date.length === this.dateMask.length)
this.$set($event.target, 'value', ''); return (
this.addToAdvancedSearchQuery('', 'value', searchCriterion); moment(date, this.dateFormat).toISOString(true) &&
} else { moment(date, this.dateFormat).toISOString(true).split('T') &&
this.addToAdvancedSearchQuery($event.target.value, type, searchCriterion); moment(date, this.dateFormat).toISOString(true).split('T')[0]
} ) ? this.parseDateToNavigatorLanguage(moment(date, this.dateFormat).toISOString(true).split('T')[0]) : this.parseDateToNavigatorLanguage(date);
else
return date;
}, },
addValueToAdvancedSearchQuery: _.debounce(function(value, type, searchCriterion) { addMetadatumToAdvancedSearchQuery({ metadatumId, type, taxonomy }, index) {
this.addToAdvancedSearchQuery(value, type, searchCriterion); if (!metadatumId)
}, 900), return;
searchAdvanced() {
if (this.isHeader) { if (type === 'term') {
this.$root.$emit('closeAdvancedSearchShortcut', true); // Was selected a taxonomy criteria
this.advancedSearchQuery.taxquery = Object.assign({}, this.advancedSearchQuery.taxquery, {
if (this.$route.path == '/items') [`${index}`]: {
this.$root.$emit('openAdvancedSearch', true); key: metadatumId,
taxonomy: taxonomy,
if (this.$route.path != '/items') { operator: 'LIKE'
this.$router.push({ }
path: '/items', });
} else {
// Was selected a metadatum criteria
if (type != 'date' && type != 'int' && type != 'float') {
this.advancedSearchQuery.metaquery = Object.assign({}, this.advancedSearchQuery.metaquery, {
[`${index}`]: {
key: metadatumId,
compare: 'LIKE'
}
});
} else {
this.advancedSearchQuery.metaquery = Object.assign({}, this.advancedSearchQuery.metaquery, {
[`${index}`]: {
key: metadatumId,
compare: '='
}
}); });
} }
} }
},
addValueToAdvancedSearchQuery(value, index) {
if (!value)
return;
if (Object.keys(this.advancedSearchQuery.taxquery).length > 0 && if (this.advancedSearchQuery.metaquery[index])
Object.keys(this.advancedSearchQuery.metaquery).length > 0) { this.$set(this.advancedSearchQuery.metaquery[index], 'value', value);
else if (this.advancedSearchQuery.taxquery[index])
this.$set(this.advancedSearchQuery.taxquery[index], 'terms', value);
},
addComparatorToAdvancedSearchQuery(comparator, index) {
if (!comparator)
return;
if (this.advancedSearchQuery.metaquery[index])
this.$set(this.advancedSearchQuery.metaquery[index], 'compare', comparator);
else if (this.advancedSearchQuery.taxquery[index])
this.$set(this.advancedSearchQuery.taxquery[index], 'operator', comparator);
},
performAdvancedSearch() {
if (
Object.keys(this.advancedSearchQuery.taxquery).length > 0 &&
Object.keys(this.advancedSearchQuery.metaquery).length > 0
) {
this.advancedSearchQuery.relation = 'AND'; this.advancedSearchQuery.relation = 'AND';
} }
@ -482,7 +435,7 @@
if (Object.keys(this.advancedSearchQuery.metaquery).length > 0) { if (Object.keys(this.advancedSearchQuery.metaquery).length > 0) {
for (let metaquery in this.advancedSearchQuery.metaquery) { for (let metaquery in this.advancedSearchQuery.metaquery) {
if (this.advancedSearchQuery.metaquery[metaquery].ptype == 'date') { if (this.getAdvancedSearchQueryCriterionMetadataType(metaquery) == 'date') {
let value = this.advancedSearchQuery.metaquery[metaquery].value; let value = this.advancedSearchQuery.metaquery[metaquery].value;
if (value.includes('/')) if (value.includes('/'))
@ -499,81 +452,31 @@
if (this.advancedSearchQuery.hasOwnProperty('relation') && Object.keys(this.advancedSearchQuery).length <= 3) if (this.advancedSearchQuery.hasOwnProperty('relation') && Object.keys(this.advancedSearchQuery).length <= 3)
delete this.advancedSearchQuery.relation; delete this.advancedSearchQuery.relation;
if (Object.keys(this.advancedSearchQuery.metaquery).length > 0) { if (Object.keys(this.advancedSearchQuery.metaquery).length > 0) {
for (let metaquery in this.advancedSearchQuery.metaquery) { for (let metaquery in this.advancedSearchQuery.metaquery) {
if (this.advancedSearchQuery.metaquery[metaquery].ptype == 'date') { if (this.getAdvancedSearchQueryCriterionMetadataType(metaquery) == 'date') {
let value = this.advancedSearchQuery.metaquery[metaquery].value; let value = this.advancedSearchQuery.metaquery[metaquery].value;
setTimeout(() => { if (value.includes('-'))
if (value.includes('-')) this.$set(this.advancedSearchQuery.metaquery[metaquery], 'value', this.parseValidDateToNavigatorLanguage(value));
this.$set(this.advancedSearchQuery.metaquery[metaquery], 'value', this.parseValidDateToNavigatorLanguage(value));
}, 200);
} }
} }
} }
this.$eventBusSearch.$emit('searchAdvanced', this.advancedSearchQuery); this.$eventBusSearch.$emit('performAdvancedSearch', this.advancedSearchQuery);
}, },
parseValidDateToNavigatorLanguage(date) { getAdvancedSearchQueryCriterionMetadataType(searchCriterion) {
if (date && date.length === this.dateMask.length) { if (this.advancedSearchQuery.metaquery[searchCriterion] &&
return (moment(date, this.dateFormat).toISOString() && moment(date, this.dateFormat).toISOString().split('T') && moment(date, this.dateFormat).toISOString().split('T')[0]) ? this.parseDateToNavigatorLanguage(moment(date, this.dateFormat).toISOString().split('T')[0]) : this.parseDateToNavigatorLanguage(date); this.advancedSearchQuery.metaquery[searchCriterion].key &&
} else this.metadataAsObject[this.advancedSearchQuery.metaquery[searchCriterion].key] &&
return date; this.metadataAsObject[this.advancedSearchQuery.metaquery[searchCriterion].key].metadata_type_object
}, ) {
addToAdvancedSearchQuery(value, type, searchCriterion) { return this.metadataAsObject[this.advancedSearchQuery.metaquery[searchCriterion].key].metadata_type_object.primitive_type
if (!value)
return;
if (type == 'metadatum') {
const criteriaKey = value.split('-');
if (criteriaKey[1] != 'undefined') {
// Was selected a taxonomy criteria
this.advancedSearchQuery.taxquery = Object.assign({}, this.advancedSearchQuery.taxquery, {
[`${searchCriterion}`]: {
taxonomy: criteriaKey[1],
operator: 'LIKE',
originalMeta: value,
taxonomy_id: Number(criteriaKey[1].match(/[\d]+/)),
isFetching: 0,
}
});
} else {
// Was selected a metadatum criteria
if (criteriaKey[2] != 'date' && criteriaKey[2] != 'int' && criteriaKey[2] != 'float') {
this.advancedSearchQuery.metaquery = Object.assign({}, this.advancedSearchQuery.metaquery, {
[`${searchCriterion}`]: {
key: criteriaKey[0],
compare: 'LIKE',
originalMeta: value,
}
});
} else {
this.advancedSearchQuery.metaquery = Object.assign({}, this.advancedSearchQuery.metaquery, {
[`${searchCriterion}`]: {
key: Number(criteriaKey[0]),
compare: '=',
originalMeta: value,
}
});
}
this.$set(this.advancedSearchQuery.metaquery[searchCriterion], 'ptype', criteriaKey[2]);
}
} else if (type == "term_value") {
this.$set(this.advancedSearchQuery.taxquery[searchCriterion], 'terms', value);
} else if (type == 'value') {
this.$set(this.advancedSearchQuery.metaquery[searchCriterion], 'value', value);
} else if (type == 'comparator') {
if (this.advancedSearchQuery.taxquery[searchCriterion])
this.$set(this.advancedSearchQuery.taxquery[searchCriterion], 'operator', value);
else if (this.advancedSearchQuery.metaquery[searchCriterion])
this.$set(this.advancedSearchQuery.metaquery[searchCriterion], 'compare', value);
} }
},
return '';
}
} }
} }
</script> </script>
@ -581,23 +484,16 @@
<style lang="scss"> <style lang="scss">
#advanced-search-container { #advanced-search-container {
width: 100%; width: calc(100% - (2 * var(--tainacan-one-column)));
} margin: 0.5em var(--tainacan-one-column) 0.875em;
background: var(--tainacan-input-background-color);
.loading-overlay { border: 1px solid var(--tainacan-input-border-color);
min-height: 200px; border-radius: 1px;
}
.padding-in-header {
padding: 1.5em;
}
.padding-regular {
padding-right: var(--tainacan-one-column);
padding-left: var(--tainacan-one-column);
} }
.tnc-advanced-search-container { .tnc-advanced-search-container {
padding: 1em;
padding-top: 3.5em;
.column { .column {
padding: 0 0.5em 0.75em !important; padding: 0 0.5em 0.75em !important;
@ -613,32 +509,10 @@
} }
} }
.taginput-container {
min-height: 32px !important;
.tags {
margin-bottom: calc(0.275em - 1px) !important;
.tag {
height: 2em !important;
padding-left: 0.75em !important;
padding-right: 0.75em !important;
margin-right: 0 !important;
}
}
}
.add-link-advanced-search { .add-link-advanced-search {
margin-top: -15px !important;
padding-left: 8px !important; padding-left: 8px !important;
} }
.add-link-advanced-search-header {
margin-top: -20px !important;
padding: 0 !important;
margin-left: -5px !important;
}
@media screen and (max-width: 768px) { @media screen and (max-width: 768px) {
.is-12>.columns { .is-12>.columns {
flex-wrap: wrap; flex-wrap: wrap;
@ -651,82 +525,4 @@
} }
.advanced-search-header-dropdown {
height: 27px !important;
a, .has-text-secondary {
color: var(--tainacan-blue4) !important;
}
.select:not(.is-multiple)::after {
color: var(--tainacan-blue3) !important;
option:checked, option:hover {
background-color: var(--tainacan-gray2) !important;
}
}
.dropdown-content {
font-size: 1.15em;
width: 800px !important;
padding-bottom: 1.25em !important;
}
.field.is-grouped .field.column {
margin-bottom: 0;
}
.field.is-grouped .field + .field {
margin-left: 0.25em;
}
.autocomplete {
.dropdown-menu {
top: auto !important;
min-width: 100% !important;
.dropdown-content {
width: auto !important;
}
}
}
.dropdown-item {
padding: 0.375em 1.5em !important;
}
.dropdown-item:hover {
background-color: unset !important;
}
@media screen and (min-width: 1087px) {
.dropdown-menu {
top: -2px !important;
}
}
.dropdown-item {
span.icon:not(.is-right) {
position: relative !important;
}
}
.advanced-search-text {
margin: 0 12px;
font-size: 0.75em;
color: var(--tainacan-gray5);
}
.advanced-search-text-di {
font-size: 1em;
font-weight: 500;
color: var(--tainacan-gray5);
margin-top: 5px;
}
.advanced-search-hr {
height: 1px;
margin: 4px 0;
background-color: var(--tainacan-blue3);
width: 100%;
}
}
</style> </style>

View File

@ -26,12 +26,12 @@ export default {
this.$root.$on('closeAdvancedSearch', () => { this.$root.$on('closeAdvancedSearch', () => {
this.$store.dispatch('search/setPage', 1); this.$store.dispatch('search/setPage', 1);
this.searchAdvanced({}); this.performAdvancedSearch({});
}); });
this.$root.$on('searchAdvanced', advancedSearchQuery => { this.$root.$on('performAdvancedSearch', advancedSearchQuery => {
this.$store.dispatch('search/setPage', 1); this.$store.dispatch('search/setPage', 1);
this.searchAdvanced(advancedSearchQuery); this.performAdvancedSearch(advancedSearchQuery);
this.updateURLQueries(); this.updateURLQueries();
}); });
@ -177,7 +177,7 @@ export default {
} }
}, },
methods: { methods: {
searchAdvanced(data) { performAdvancedSearch(data) {
this.$store.dispatch('search/set_advanced_query', data); this.$store.dispatch('search/set_advanced_query', data);
this.updateURLQueries(); this.updateURLQueries();
}, },
@ -385,9 +385,8 @@ export default {
this.$emit( 'isLoadingItems', false); this.$emit( 'isLoadingItems', false);
this.$emit( 'hasFiltered', res.hasFiltered); this.$emit( 'hasFiltered', res.hasFiltered);
if (res.advancedSearchResults){ if (res.hasAdvancedSearchResults)
this.$emit('advancedSearchResults', res.advancedSearchResults); this.$emit('hasAdvancedSearchResults', res.hasAdvancedSearchResults);
}
}) })
.catch(() => { .catch(() => {
this.$emit( 'isLoadingItems', false); this.$emit( 'isLoadingItems', false);

View File

@ -25,7 +25,7 @@ export const fetchItems = ({ rootGetters, dispatch, commit }, { collectionId, is
// Sets a flag to inform components that an empty sate is or not due to filtering // Sets a flag to inform components that an empty sate is or not due to filtering
let hasFiltered = false; let hasFiltered = false;
let advancedSearchResults = false; let hasAdvancedSearchResults = false;
// We mark as filtered if there is a metaquery, taxquery or a postin // We mark as filtered if there is a metaquery, taxquery or a postin
if ( if (
@ -43,7 +43,7 @@ export const fetchItems = ({ rootGetters, dispatch, commit }, { collectionId, is
hasFiltered = true; hasFiltered = true;
if (postQueries.advancedSearch) if (postQueries.advancedSearch)
advancedSearchResults = postQueries.advancedSearch; hasAdvancedSearchResults = postQueries.advancedSearch;
} }
// Admin default tab should load publish, private and draft statuses // Admin default tab should load publish, private and draft statuses
@ -93,7 +93,7 @@ export const fetchItems = ({ rootGetters, dispatch, commit }, { collectionId, is
'itemsListTemplate': res.data.template, 'itemsListTemplate': res.data.template,
'total': res.headers['x-wp-total'], 'total': res.headers['x-wp-total'],
hasFiltered: hasFiltered, hasFiltered: hasFiltered,
advancedSearchResults: advancedSearchResults, hasAdvancedSearchResults: hasAdvancedSearchResults,
itemsPerPage: res.headers['x-wp-itemperpage']}); itemsPerPage: res.headers['x-wp-itemperpage']});
} else { } else {
commit('setItems', items); commit('setItems', items);
@ -102,7 +102,7 @@ export const fetchItems = ({ rootGetters, dispatch, commit }, { collectionId, is
'total': res.headers['x-wp-total'], 'total': res.headers['x-wp-total'],
totalPages: res.headers['x-wp-totalpages'], totalPages: res.headers['x-wp-totalpages'],
hasFiltered: hasFiltered, hasFiltered: hasFiltered,
advancedSearchResults: advancedSearchResults , hasAdvancedSearchResults: hasAdvancedSearchResults ,
itemsPerPage: res.headers['x-wp-itemperpage'] }); itemsPerPage: res.headers['x-wp-itemperpage'] });
} }
dispatch('search/setTotalItems', res.headers['x-wp-total'], { root: true } ); dispatch('search/setTotalItems', res.headers['x-wp-total'], { root: true } );

View File

@ -9,27 +9,8 @@
<!-- PAGE TITLE --------------------- --> <!-- PAGE TITLE --------------------- -->
<tainacan-title <tainacan-title
v-if="!$adminOptions.hideItemsListPageTitle && !openAdvancedSearch" v-if="!$adminOptions.hideItemsListPageTitle"
:bread-crumb-items="[{ path: '', label: this.$i18n.get('items') }]"/> :bread-crumb-items="[{ path: '', label: this.$i18n.get('items') }]"/>
<div
v-else-if="openAdvancedSearch"
class="tnc-advanced-search-close">
<div class="advanced-search-criteria-title">
<div class="is-flex">
<h1>{{ $i18n.get('info_search_criteria') }}</h1>
<div
:style="{'margin-bottom': 'auto'}"
class="field is-grouped">
<a
class="back-link"
@click="openAdvancedSearch = false">
{{ $i18n.get('back') }}
</a>
</div>
</div>
<hr>
</div>
</div>
<!-- SEARCH CONTROL ------------------------- --> <!-- SEARCH CONTROL ------------------------- -->
<h3 <h3
@ -41,7 +22,6 @@
aria-labelledby="search-control-landmark" aria-labelledby="search-control-landmark"
role="region" role="region"
ref="search-control" ref="search-control"
v-if="((openAdvancedSearch && advancedSearchResults) || !openAdvancedSearch)"
class="search-control" class="search-control"
:style="( $adminOptions.itemsSingleSelectionMode || $adminOptions.itemsMultipleSelectionMode || $adminOptions.itemsSearchSelectionMode ) ? '--tainacan-container-padding: 6px;' : ''"> :style="( $adminOptions.itemsSingleSelectionMode || $adminOptions.itemsMultipleSelectionMode || $adminOptions.itemsSearchSelectionMode ) ? '--tainacan-container-padding: 6px;' : ''">
@ -75,9 +55,7 @@
</button> </button>
<!-- Text simple search --> <!-- Text simple search -->
<div <div class="search-control-item">
v-if="!openAdvancedSearch"
class="search-control-item">
<div <div
role="search" role="search"
class="search-area"> class="search-area">
@ -95,15 +73,19 @@
<a <a
v-if="!$adminOptions.hideItemsListAdvancedSearch" v-if="!$adminOptions.hideItemsListAdvancedSearch"
@click="openAdvancedSearch = !openAdvancedSearch; $eventBusSearch.clearAllFilters();" @click="openAdvancedSearch = !openAdvancedSearch; $eventBusSearch.clearAllFilters();"
style="font-size: 0.75em;" class="advanced-search-toggle has-text-secondary"
class="has-text-secondary is-pulled-right">{{ $i18n.get('advanced_search') }}</a> :class="openAdvancedSearch ? 'is-open' : 'is-closed'">
{{ $i18n.get('advanced_search') }}
<span class="icon">
<i class="tainacan-icon tainacan-icon-search" />
</span>
</a>
</div> </div>
</div> </div>
<!-- Item Creation Dropdown (or button, if few options are available) --> <!-- Item Creation Dropdown (or button, if few options are available) -->
<div <div
v-if="!$adminOptions.hideItemsListCreationDropdown && v-if="!$adminOptions.hideItemsListCreationDropdown &&
!openAdvancedSearch &&
collection && collection &&
collection.current_user_can_edit_items" collection.current_user_can_edit_items"
class="search-control-item"> class="search-control-item">
@ -478,41 +460,22 @@
@mousemove="handleMouseMoveOverList"> @mousemove="handleMouseMoveOverList">
<!-- ADVANCED SEARCH --> <!-- ADVANCED SEARCH -->
<div <transition name="item-appear">
id="advanced-search-container" <div
role="search" id="advanced-search-container"
v-if="openAdvancedSearch"> role="search"
v-if="openAdvancedSearch">
<advanced-search <advanced-search
:collection-id="collectionId" :collection-id="collectionId"
:is-repository-level="isRepositoryLevel" :is-repository-level="isRepositoryLevel"
:advanced-search-results="advancedSearchResults" :has-advanced-search-results="hasAdvancedSearchResults" />
:open-form-advanced-search="openFormAdvancedSearch"
:is-doing-search="isDoingSearch"/>
<div class="advanced-search-form-submit">
<p
v-if="advancedSearchResults"
class="control">
<button
aria-controls="items-list-results"
@click="advancedSearchResults = !advancedSearchResults"
class="button is-outlined">{{ $i18n.get('edit_search') }}</button>
</p>
<p
v-if="advancedSearchResults"
class="control">
<button
aria-controls="items-list-results"
@click="isDoingSearch = !isDoingSearch"
class="button is-success">{{ $i18n.get('search') }}</button>
</p>
</div> </div>
</div> </transition>
<!-- STATUS TABS, only on Admin -------- --> <!-- STATUS TABS, only on Admin -------- -->
<items-status-tabs <items-status-tabs
v-if="!openAdvancedSearch && !$adminOptions.hideItemsListStatusTabs" v-if="!$adminOptions.hideItemsListStatusTabs"
:is-repository-level="isRepositoryLevel"/> :is-repository-level="isRepositoryLevel"/>
<!-- FILTERS TAG LIST--> <!-- FILTERS TAG LIST-->
@ -557,7 +520,7 @@
v-if="hasAnOpenAlert && v-if="hasAnOpenAlert &&
isSortingByCustomMetadata && isSortingByCustomMetadata &&
!showLoading && !showLoading &&
((openAdvancedSearch && advancedSearchResults) || !openAdvancedSearch)" ((openAdvancedSearch && hasAdvancedSearchResults) || !openAdvancedSearch)"
class="metadata-alert"> class="metadata-alert">
<p class="text"> <p class="text">
{{ {{
@ -584,7 +547,7 @@
<items-list <items-list
v-if="!showLoading && v-if="!showLoading &&
totalItems > 0 && totalItems > 0 &&
((openAdvancedSearch && advancedSearchResults) || !openAdvancedSearch)" ((openAdvancedSearch && hasAdvancedSearchResults) || !openAdvancedSearch)"
:collection-id="collectionId" :collection-id="collectionId"
:displayed-metadata="displayedMetadata" :displayed-metadata="displayedMetadata"
:items="items" :items="items"
@ -634,7 +597,7 @@
<div ref="items-pagination"> <div ref="items-pagination">
<pagination <pagination
:is-sorting-by-custom-metadata="isSortingByCustomMetadata" :is-sorting-by-custom-metadata="isSortingByCustomMetadata"
v-if="totalItems > 0 && (advancedSearchResults || !openAdvancedSearch)"/> v-if="totalItems > 0 && (hasAdvancedSearchResults || !openAdvancedSearch)"/>
</div> </div>
</div> </div>
</div> </div>
@ -679,9 +642,7 @@
localDisplayedMetadata: [], localDisplayedMetadata: [],
registeredViewModes: tainacan_plugin.registered_view_modes, registeredViewModes: tainacan_plugin.registered_view_modes,
openAdvancedSearch: false, openAdvancedSearch: false,
openFormAdvancedSearch: false, hasAdvancedSearchResults: false,
advancedSearchResults: false,
isDoingSearch: false,
sortingMetadata: [], sortingMetadata: [],
isFiltersModalActive: false, isFiltersModalActive: false,
hasAnOpenModal: false, hasAnOpenModal: false,
@ -746,7 +707,7 @@
openAdvancedSearch(newValue) { openAdvancedSearch(newValue) {
if (newValue == false){ if (newValue == false){
this.$eventBusSearch.$emit('closeAdvancedSearch'); this.$eventBusSearch.$emit('closeAdvancedSearch');
this.advancedSearchResults = false; this.hasAdvancedSearchResults = false;
this.isFiltersModalActive = true; this.isFiltersModalActive = true;
} else { } else {
this.isFiltersModalActive = false; this.isFiltersModalActive = false;
@ -790,8 +751,8 @@
this.hasFiltered = hasFiltered; this.hasFiltered = hasFiltered;
}); });
this.$eventBusSearch.$on('advancedSearchResults', advancedSearchResults => { this.$eventBusSearch.$on('hasAdvancedSearchResults', hasAdvancedSearchResults => {
this.advancedSearchResults = advancedSearchResults; this.hasAdvancedSearchResults = hasAdvancedSearchResults;
}); });
this.$eventBusSearch.$on('hasToPrepareMetadataAndFilters', () => { this.$eventBusSearch.$on('hasToPrepareMetadataAndFilters', () => {
@ -1327,7 +1288,7 @@
// $eventBusSearch // $eventBusSearch
this.$eventBusSearch.$off('isLoadingItems'); this.$eventBusSearch.$off('isLoadingItems');
this.$eventBusSearch.$off('hasFiltered'); this.$eventBusSearch.$off('hasFiltered');
this.$eventBusSearch.$off('advancedSearchResults'); this.$eventBusSearch.$off('hasAdvancedSearchResults');
this.$eventBusSearch.$off('hasToPrepareMetadataAndFilters'); this.$eventBusSearch.$off('hasToPrepareMetadataAndFilters');
} }
} }
@ -1373,7 +1334,7 @@
} }
} }
.advanced-search-results-title { .has-advanced-search-results-title {
margin-bottom: 40px; margin-bottom: 40px;
margin: 0 var(--tainacan-one-column) 42px var(--tainacan-one-column); margin: 0 var(--tainacan-one-column) 42px var(--tainacan-one-column);
@ -1516,7 +1477,7 @@
opacity: 1; opacity: 1;
} }
.search-area .is-pulled-right { .search-area .advanced-search-toggle {
display: none; display: none;
} }
} }
@ -1538,7 +1499,7 @@
padding-right: 0; padding-right: 0;
max-width: 100% !important; max-width: 100% !important;
} }
.is-pulled-right { .advanced-search-toggle.is-closed {
position: relative; position: relative;
right: 0px !important; right: 0px !important;
} }
@ -1627,15 +1588,43 @@
width: 100%; width: 100%;
margin-bottom: 5px; margin-bottom: 5px;
} }
.is-pulled-right { a.advanced-search-toggle {
position: absolute;
right: 15px;
top: 100%;
}
a {
margin-left: 12px; margin-left: 12px;
white-space: nowrap; white-space: nowrap;
position: absolute;
transition: font-size 0.2s ease, right 0.3s ease, left 0.3s ease, top 0.4s ease;
.icon {
transition: opacity 0.2s ease, max-width 0.2s ease;
}
&.is-closed {
font-size: 0.75em;
right: 15px;
left: unset;
top: 100%;
.icon {
display: 0;
opacity: 0.0;
max-width: 0;
}
}
&.is-open {
font-size: 1em;
right: unset;
left: 15px;
top: 6.125em;
z-index: 9;
.icon {
display: inline;
opacity: 1.0;
max-width: 1.5em;
}
}
} }
} }
} }

View File

@ -560,8 +560,6 @@ export default {
.then(() => { .then(() => {
if (!this.isRepositoryLevel) if (!this.isRepositoryLevel)
this.updateMetadataOrder(); this.updateMetadataOrder();
else
this.$root.$emit('metadatumUpdated', this.isRepositoryLevel);
}) })
.catch(() => { .catch(() => {
this.$console.log("Error deleting metadatum.") this.$console.log("Error deleting metadatum.")

View File

@ -9,57 +9,6 @@
}" }"
aria-live="polite"> aria-live="polite">
<!-- ADVANCED SEARCH -->
<div
id="advanced-search-container"
role="search"
v-if="openAdvancedSearch && !hideAdvancedSearch">
<div class="tnc-advanced-search-close">
<div class="advanced-search-criteria-title">
<div class="is-flex">
<h1>{{ $i18n.get('info_search_criteria') }}</h1>
<div
:style="{'margin-bottom': 'auto'}"
class="field is-grouped">
<a
class="back-link"
@click="openAdvancedSearch = false">
{{ $i18n.get('back') }}
</a>
</div>
</div>
<hr>
</div>
</div>
<advanced-search
:is-repository-level="isRepositoryLevel"
:collection-id="collectionId"
:advanced-search-results="advancedSearchResults"
:open-form-advanced-search="openFormAdvancedSearch"
:is-doing-search="isDoingSearch"/>
<div class="advanced-search-form-submit">
<p
v-if="advancedSearchResults"
class="control">
<button
aria-controls="items-list-results"
@click="advancedSearchResults = !advancedSearchResults"
class="button is-outlined">{{ $i18n.get('edit_search') }}</button>
</p>
<p
v-if="advancedSearchResults"
class="control">
<button
aria-controls="items-list-results"
@click="isDoingSearch = !isDoingSearch"
class="button is-success">{{ $i18n.get('search') }}</button>
</p>
</div>
</div>
<!-- SEARCH CONTROL ------------------------- --> <!-- SEARCH CONTROL ------------------------- -->
<h3 <h3
id="search-control-landmark" id="search-control-landmark"
@ -70,7 +19,7 @@
:aria-label="$i18n.get('label_sort_visualization')" :aria-label="$i18n.get('label_sort_visualization')"
role="region" role="region"
ref="search-control" ref="search-control"
v-if="!(registeredViewModes[viewMode] != undefined && registeredViewModes[viewMode].full_screen) && ((openAdvancedSearch && advancedSearchResults) || !openAdvancedSearch)" v-if="!(registeredViewModes[viewMode] != undefined && registeredViewModes[viewMode].full_screen)"
class="search-control"> class="search-control">
<!-- <b-loading <!-- <b-loading
@ -433,6 +382,18 @@
ref="items-list-area" ref="items-list-area"
class="items-list-area"> class="items-list-area">
<!-- ADVANCED SEARCH -->
<div
id="advanced-search-container"
role="search"
v-if="openAdvancedSearch && !hideAdvancedSearch">
<advanced-search
:is-repository-level="isRepositoryLevel"
:collection-id="collectionId"
:has-advanced-search-results="hasAdvancedSearchResults" />
</div>
<!-- FILTERS TAG LIST--> <!-- FILTERS TAG LIST-->
<filters-tags-list <filters-tags-list
class="filter-tags-list" class="filter-tags-list"
@ -484,7 +445,7 @@
v-if="hasAnOpenAlert && v-if="hasAnOpenAlert &&
isSortingByCustomMetadata && isSortingByCustomMetadata &&
!showLoading && !showLoading &&
((openAdvancedSearch && advancedSearchResults) || !openAdvancedSearch)" ((openAdvancedSearch && hasAdvancedSearchResults) || !openAdvancedSearch)"
class="metadata-alert"> class="metadata-alert">
<p class="text"> <p class="text">
{{ {{
@ -509,7 +470,7 @@
<!-- Theme View Modes --> <!-- Theme View Modes -->
<div <div
v-if="((openAdvancedSearch && advancedSearchResults) || !openAdvancedSearch) && v-if="((openAdvancedSearch && hasAdvancedSearchResults) || !openAdvancedSearch) &&
!showLoading && !showLoading &&
registeredViewModes[viewMode] != undefined && registeredViewModes[viewMode] != undefined &&
registeredViewModes[viewMode].type == 'template'" registeredViewModes[viewMode].type == 'template'"
@ -518,7 +479,7 @@
<component <component
v-if="registeredViewModes[viewMode] != undefined && v-if="registeredViewModes[viewMode] != undefined &&
registeredViewModes[viewMode].type == 'component' && registeredViewModes[viewMode].type == 'component' &&
((openAdvancedSearch && advancedSearchResults) || !openAdvancedSearch)" ((openAdvancedSearch && hasAdvancedSearchResults) || !openAdvancedSearch)"
:collection-id="collectionId" :collection-id="collectionId"
:displayed-metadata="displayedMetadata" :displayed-metadata="displayedMetadata"
:items="items" :items="items"
@ -535,7 +496,7 @@
:is-sorting-by-custom-metadata="isSortingByCustomMetadata" :is-sorting-by-custom-metadata="isSortingByCustomMetadata"
v-if="totalItems > 0 && v-if="totalItems > 0 &&
((registeredViewModes[viewMode] != undefined && registeredViewModes[viewMode].show_pagination)) && ((registeredViewModes[viewMode] != undefined && registeredViewModes[viewMode].show_pagination)) &&
(advancedSearchResults || !openAdvancedSearch)" (hasAdvancedSearchResults || !openAdvancedSearch)"
:hide-items-per-page-button="hideItemsPerPageButton" :hide-items-per-page-button="hideItemsPerPageButton"
:hide-go-to-page-button="hideGoToPageButton"/> :hide-go-to-page-button="hideGoToPageButton"/>
@ -613,9 +574,7 @@
localDisplayedMetadata: [], localDisplayedMetadata: [],
registeredViewModes: tainacan_plugin.registered_view_modes, registeredViewModes: tainacan_plugin.registered_view_modes,
openAdvancedSearch: false, openAdvancedSearch: false,
openFormAdvancedSearch: false, hasAdvancedSearchResults: false,
advancedSearchResults: false,
isDoingSearch: false,
sortingMetadata: [], sortingMetadata: [],
isFiltersModalActive: false, isFiltersModalActive: false,
hasAnOpenModal: false, hasAnOpenModal: false,
@ -681,7 +640,7 @@
openAdvancedSearch(newValue){ openAdvancedSearch(newValue){
if (newValue == false){ if (newValue == false){
this.$eventBusSearch.$emit('closeAdvancedSearch'); this.$eventBusSearch.$emit('closeAdvancedSearch');
this.advancedSearchResults = false; this.hasAdvancedSearchResults = false;
this.isFiltersModalActive = !this.startWithFiltersHidden; this.isFiltersModalActive = !this.startWithFiltersHidden;
} else { } else {
this.isFiltersModalActive = false; this.isFiltersModalActive = false;
@ -739,8 +698,8 @@
}); });
if (!this.hideAdvancedSearch) { if (!this.hideAdvancedSearch) {
this.$eventBusSearch.$on('advancedSearchResults', advancedSearchResults => { this.$eventBusSearch.$on('hasAdvancedSearchResults', hasAdvancedSearchResults => {
this.advancedSearchResults = advancedSearchResults; this.hasAdvancedSearchResults = hasAdvancedSearchResults;
}); });
if (this.$route.query && this.$route.query.advancedSearch) { if (this.$route.query && this.$route.query.advancedSearch) {
@ -1209,7 +1168,7 @@
this.$eventBusSearch.$off('isLoadingItems'); this.$eventBusSearch.$off('isLoadingItems');
this.$eventBusSearch.$off('hasFiltered'); this.$eventBusSearch.$off('hasFiltered');
if (!this.hideAdvancedSearch) if (!this.hideAdvancedSearch)
this.$eventBusSearch.$off('advancedSearchResults'); this.$eventBusSearch.$off('hasAdvancedSearchResults');
this.$eventBusSearch.$off('hasToPrepareMetadataAndFilters'); this.$eventBusSearch.$off('hasToPrepareMetadataAndFilters');
}, },
@ -1279,7 +1238,7 @@
} }
} }
.advanced-search-results-title { .has-advanced-search-results-title {
margin-bottom: 40px; margin-bottom: 40px;
margin: 0 var(--tainacan-one-column) 42px var(--tainacan-one-column); margin: 0 var(--tainacan-one-column) 42px var(--tainacan-one-column);