Merge pull request #675 from tainacan/feature/321
Feature/321 - Advanced Search Component Refactor
This commit is contained in:
Mateus Machado Luna
GitHub
commit
710d900fc7
|
|
@ -750,13 +750,12 @@ class REST_Items_Controller extends REST_Controller {
|
|||
private function get_items_permissions_check_for_taxonomy($taxonomies) {
|
||||
|
||||
foreach ($taxonomies as $tax) {
|
||||
if( !isset($tax['taxonomy']) )
|
||||
return false;
|
||||
$taxonomy = \tainacan_taxonomies()->fetch_by_db_identifier( $tax['taxonomy'] );
|
||||
if ( isset($tax['taxonomy']) ) {
|
||||
$taxonomy = \tainacan_taxonomies()->fetch_by_db_identifier( $tax['taxonomy'] );
|
||||
|
||||
if( $taxonomy instanceof Entities\Taxonomy ) {
|
||||
if(!$taxonomy->can_read()) {
|
||||
return false;
|
||||
if ( $taxonomy instanceof Entities\Taxonomy ) {
|
||||
if (!$taxonomy->can_read())
|
||||
return false;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -429,7 +429,6 @@
|
|||
this.isUpdating = false;
|
||||
this.closedByForm = true;
|
||||
|
||||
this.$root.$emit('metadatumUpdated', this.isRepositoryLevel);
|
||||
this.$emit('onEditionFinished');
|
||||
})
|
||||
.catch((errors) => {
|
||||
|
|
@ -468,7 +467,6 @@
|
|||
this.isUpdating = false;
|
||||
this.closedByForm = true;
|
||||
|
||||
this.$root.$emit('metadatumUpdated', this.isRepositoryLevel);
|
||||
this.$emit('onEditionFinished');
|
||||
})
|
||||
.catch((errors) => {
|
||||
|
|
|
|||
|
|
@ -59,38 +59,12 @@
|
|||
icon-right="magnify"
|
||||
icon-right-clickable
|
||||
@icon-right-click="updateSearch()" />
|
||||
<b-dropdown
|
||||
<router-link
|
||||
v-if="!$adminOptions.hideTainacanHeaderAdvancedSearch"
|
||||
ref="advancedSearchShortcut"
|
||||
class="advanced-search-header-dropdown"
|
||||
position="is-bottom-left"
|
||||
aria-role="list"
|
||||
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>
|
||||
class="advanced-search-text"
|
||||
:to="$routerHelper.getItemsPath({ advancedSearch: true })">
|
||||
{{ $i18n.get('advanced_search') }}
|
||||
</router-link>
|
||||
|
||||
</div>
|
||||
<button
|
||||
|
|
@ -130,13 +104,11 @@
|
|||
</template>
|
||||
|
||||
<script>
|
||||
import AdvancedSearch from '../search/advanced-search.vue';
|
||||
import ProcessesPopup from '../other/processes-popup.vue';
|
||||
|
||||
export default {
|
||||
name: 'TainacanHeader',
|
||||
components: {
|
||||
AdvancedSearch,
|
||||
ProcessesPopup
|
||||
},
|
||||
data() {
|
||||
|
|
@ -150,41 +122,22 @@
|
|||
}
|
||||
},
|
||||
created(){
|
||||
this.$root.$on('closeAdvancedSearchShortcut', () => {
|
||||
if (this.$refs.advancedSearchShortcut)
|
||||
this.$refs.advancedSearchShortcut.toggle();
|
||||
});
|
||||
this.$root.$on('openProcessesPopup', () => {
|
||||
this.showProcesses = true;
|
||||
});
|
||||
},
|
||||
beforeDestroy() {
|
||||
this.$root.$off('closeAdvancedSearchShortcut');
|
||||
this.$root.$off('openProcessesPopup');
|
||||
},
|
||||
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() {
|
||||
if (this.$route.path != '/items') {
|
||||
if (this.$route.path !== '/items') {
|
||||
this.$router.push({
|
||||
path: '/items',
|
||||
});
|
||||
}
|
||||
|
||||
this.$eventBusSearch.setSearchQuery(this.futureSearchQuery);
|
||||
},
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
|
@ -273,6 +226,10 @@
|
|||
display: flex;
|
||||
align-items: center;
|
||||
margin-right: 28px;
|
||||
.advanced-search-text {
|
||||
font-size: 0.75em;
|
||||
margin-left: 12px;
|
||||
}
|
||||
.control {
|
||||
.search-header {
|
||||
border: 1px solid var(--tainacan-gray2);
|
||||
|
|
|
|||
File diff suppressed because it is too large
Load Diff
|
|
@ -26,12 +26,12 @@ export default {
|
|||
this.$root.$on('closeAdvancedSearch', () => {
|
||||
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.searchAdvanced(advancedSearchQuery);
|
||||
this.performAdvancedSearch(advancedSearchQuery);
|
||||
|
||||
this.updateURLQueries();
|
||||
});
|
||||
|
|
@ -177,7 +177,7 @@ export default {
|
|||
}
|
||||
},
|
||||
methods: {
|
||||
searchAdvanced(data) {
|
||||
performAdvancedSearch(data) {
|
||||
this.$store.dispatch('search/set_advanced_query', data);
|
||||
this.updateURLQueries();
|
||||
},
|
||||
|
|
@ -384,10 +384,6 @@ export default {
|
|||
resp.request.then((res) => {
|
||||
this.$emit( 'isLoadingItems', false);
|
||||
this.$emit( 'hasFiltered', res.hasFiltered);
|
||||
|
||||
if (res.advancedSearchResults){
|
||||
this.$emit('advancedSearchResults', res.advancedSearchResults);
|
||||
}
|
||||
})
|
||||
.catch(() => {
|
||||
this.$emit( 'isLoadingItems', false);
|
||||
|
|
|
|||
|
|
@ -25,7 +25,6 @@ export const fetchItems = ({ rootGetters, dispatch, commit }, { collectionId, is
|
|||
|
||||
// Sets a flag to inform components that an empty sate is or not due to filtering
|
||||
let hasFiltered = false;
|
||||
let advancedSearchResults = false;
|
||||
|
||||
// We mark as filtered if there is a metaquery, taxquery or a postin
|
||||
if (
|
||||
|
|
@ -38,13 +37,8 @@ export const fetchItems = ({ rootGetters, dispatch, commit }, { collectionId, is
|
|||
(postQueries.postin != undefined &&
|
||||
postQueries.postin.length
|
||||
)
|
||||
) {
|
||||
|
||||
)
|
||||
hasFiltered = true;
|
||||
|
||||
if (postQueries.advancedSearch)
|
||||
advancedSearchResults = postQueries.advancedSearch;
|
||||
}
|
||||
|
||||
// Admin default tab should load publish, private and draft statuses
|
||||
if (!isOnTheme && !postQueries.status) {
|
||||
|
|
@ -93,7 +87,6 @@ export const fetchItems = ({ rootGetters, dispatch, commit }, { collectionId, is
|
|||
'itemsListTemplate': res.data.template,
|
||||
'total': res.headers['x-wp-total'],
|
||||
hasFiltered: hasFiltered,
|
||||
advancedSearchResults: advancedSearchResults,
|
||||
itemsPerPage: res.headers['x-wp-itemperpage']});
|
||||
} else {
|
||||
commit('setItems', items);
|
||||
|
|
@ -102,7 +95,6 @@ export const fetchItems = ({ rootGetters, dispatch, commit }, { collectionId, is
|
|||
'total': res.headers['x-wp-total'],
|
||||
totalPages: res.headers['x-wp-totalpages'],
|
||||
hasFiltered: hasFiltered,
|
||||
advancedSearchResults: advancedSearchResults ,
|
||||
itemsPerPage: res.headers['x-wp-itemperpage'] });
|
||||
}
|
||||
dispatch('search/setTotalItems', res.headers['x-wp-total'], { root: true } );
|
||||
|
|
|
|||
|
|
@ -9,27 +9,8 @@
|
|||
|
||||
<!-- PAGE TITLE --------------------- -->
|
||||
<tainacan-title
|
||||
v-if="!$adminOptions.hideItemsListPageTitle && !openAdvancedSearch"
|
||||
v-if="!$adminOptions.hideItemsListPageTitle"
|
||||
: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 ------------------------- -->
|
||||
<h3
|
||||
|
|
@ -41,7 +22,6 @@
|
|||
aria-labelledby="search-control-landmark"
|
||||
role="region"
|
||||
ref="search-control"
|
||||
v-if="((openAdvancedSearch && advancedSearchResults) || !openAdvancedSearch)"
|
||||
class="search-control"
|
||||
:style="( $adminOptions.itemsSingleSelectionMode || $adminOptions.itemsMultipleSelectionMode || $adminOptions.itemsSearchSelectionMode ) ? '--tainacan-container-padding: 6px;' : ''">
|
||||
|
||||
|
|
@ -75,9 +55,7 @@
|
|||
</button>
|
||||
|
||||
<!-- Text simple search -->
|
||||
<div
|
||||
v-if="!openAdvancedSearch"
|
||||
class="search-control-item">
|
||||
<div class="search-control-item">
|
||||
<div
|
||||
role="search"
|
||||
class="search-area">
|
||||
|
|
@ -91,19 +69,24 @@
|
|||
@keyup.enter.native="updateSearch()"
|
||||
icon-right="magnify"
|
||||
icon-right-clickable
|
||||
@icon-right-click="updateSearch()" />
|
||||
@icon-right-click="updateSearch()"
|
||||
:disabled="openAdvancedSearch" />
|
||||
<a
|
||||
v-if="!$adminOptions.hideItemsListAdvancedSearch"
|
||||
@click="openAdvancedSearch = !openAdvancedSearch; $eventBusSearch.clearAllFilters();"
|
||||
style="font-size: 0.75em;"
|
||||
class="has-text-secondary is-pulled-right">{{ $i18n.get('advanced_search') }}</a>
|
||||
class="advanced-search-toggle has-text-secondary"
|
||||
:class="openAdvancedSearch ? 'is-open' : 'is-closed'">
|
||||
{{ $i18n.get('advanced_search') }}
|
||||
<span class="icon">
|
||||
<i class="tainacan-icon tainacan-icon-search" />
|
||||
</span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Item Creation Dropdown (or button, if few options are available) -->
|
||||
<div
|
||||
v-if="!$adminOptions.hideItemsListCreationDropdown &&
|
||||
!openAdvancedSearch &&
|
||||
collection &&
|
||||
collection.current_user_can_edit_items"
|
||||
class="search-control-item">
|
||||
|
|
@ -478,41 +461,22 @@
|
|||
@mousemove="handleMouseMoveOverList">
|
||||
|
||||
<!-- ADVANCED SEARCH -->
|
||||
<div
|
||||
id="advanced-search-container"
|
||||
role="search"
|
||||
v-if="openAdvancedSearch">
|
||||
|
||||
<advanced-search
|
||||
:collection-id="collectionId"
|
||||
:is-repository-level="isRepositoryLevel"
|
||||
: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>
|
||||
<transition name="filter-item">
|
||||
<div
|
||||
id="advanced-search-container"
|
||||
role="search"
|
||||
v-if="openAdvancedSearch">
|
||||
|
||||
<advanced-search
|
||||
:collection-id="collectionId"
|
||||
:is-repository-level="isRepositoryLevel"
|
||||
@close="openAdvancedSearch = false" />
|
||||
</div>
|
||||
</div>
|
||||
</transition>
|
||||
|
||||
<!-- STATUS TABS, only on Admin -------- -->
|
||||
<items-status-tabs
|
||||
v-if="!openAdvancedSearch && !$adminOptions.hideItemsListStatusTabs"
|
||||
v-if="!$adminOptions.hideItemsListStatusTabs"
|
||||
:is-repository-level="isRepositoryLevel"/>
|
||||
|
||||
<!-- FILTERS TAG LIST-->
|
||||
|
|
@ -556,8 +520,7 @@
|
|||
<div
|
||||
v-if="hasAnOpenAlert &&
|
||||
isSortingByCustomMetadata &&
|
||||
!showLoading &&
|
||||
((openAdvancedSearch && advancedSearchResults) || !openAdvancedSearch)"
|
||||
!showLoading"
|
||||
class="metadata-alert">
|
||||
<p class="text">
|
||||
{{
|
||||
|
|
@ -582,9 +545,7 @@
|
|||
|
||||
<!-- Admin View Modes-->
|
||||
<items-list
|
||||
v-if="!showLoading &&
|
||||
totalItems > 0 &&
|
||||
((openAdvancedSearch && advancedSearchResults) || !openAdvancedSearch)"
|
||||
v-if="!showLoading && totalItems > 0"
|
||||
:collection-id="collectionId"
|
||||
:displayed-metadata="displayedMetadata"
|
||||
:items="items"
|
||||
|
|
@ -634,7 +595,7 @@
|
|||
<div ref="items-pagination">
|
||||
<pagination
|
||||
:is-sorting-by-custom-metadata="isSortingByCustomMetadata"
|
||||
v-if="totalItems > 0 && (advancedSearchResults || !openAdvancedSearch)"/>
|
||||
v-if="totalItems > 0"/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -679,9 +640,6 @@
|
|||
localDisplayedMetadata: [],
|
||||
registeredViewModes: tainacan_plugin.registered_view_modes,
|
||||
openAdvancedSearch: false,
|
||||
openFormAdvancedSearch: false,
|
||||
advancedSearchResults: false,
|
||||
isDoingSearch: false,
|
||||
sortingMetadata: [],
|
||||
isFiltersModalActive: false,
|
||||
hasAnOpenModal: false,
|
||||
|
|
@ -746,7 +704,6 @@
|
|||
openAdvancedSearch(newValue) {
|
||||
if (newValue == false){
|
||||
this.$eventBusSearch.$emit('closeAdvancedSearch');
|
||||
this.advancedSearchResults = false;
|
||||
this.isFiltersModalActive = true;
|
||||
} else {
|
||||
this.isFiltersModalActive = false;
|
||||
|
|
@ -790,10 +747,6 @@
|
|||
this.hasFiltered = hasFiltered;
|
||||
});
|
||||
|
||||
this.$eventBusSearch.$on('advancedSearchResults', advancedSearchResults => {
|
||||
this.advancedSearchResults = advancedSearchResults;
|
||||
});
|
||||
|
||||
this.$eventBusSearch.$on('hasToPrepareMetadataAndFilters', () => {
|
||||
this.prepareMetadata();
|
||||
});
|
||||
|
|
@ -1327,7 +1280,6 @@
|
|||
// $eventBusSearch
|
||||
this.$eventBusSearch.$off('isLoadingItems');
|
||||
this.$eventBusSearch.$off('hasFiltered');
|
||||
this.$eventBusSearch.$off('advancedSearchResults');
|
||||
this.$eventBusSearch.$off('hasToPrepareMetadataAndFilters');
|
||||
}
|
||||
}
|
||||
|
|
@ -1347,58 +1299,6 @@
|
|||
overflow-y: auto;
|
||||
}
|
||||
|
||||
.advanced-search-criteria-title {
|
||||
margin-bottom: 40px;
|
||||
|
||||
h1, h2 {
|
||||
font-size: 1.25em;
|
||||
font-weight: 500;
|
||||
color: var(--tainacan-heading-color);
|
||||
display: inline-block;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
.field.is-grouped {
|
||||
margin-left: auto;
|
||||
}
|
||||
a.back-link{
|
||||
font-weight: 500;
|
||||
float: right;
|
||||
margin-top: 5px;
|
||||
}
|
||||
hr{
|
||||
margin: 3px 0px 4px 0px;
|
||||
height: 2px;
|
||||
background-color: var(--tainacan-secondary);
|
||||
border: none;
|
||||
}
|
||||
}
|
||||
|
||||
.advanced-search-results-title {
|
||||
margin-bottom: 40px;
|
||||
margin: 0 var(--tainacan-one-column) 42px var(--tainacan-one-column);
|
||||
|
||||
h1, h2 {
|
||||
font-size: 1.25em;
|
||||
font-weight: 500;
|
||||
color: var(--tainacan-heading-color);
|
||||
display: inline-block;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
.field.is-grouped {
|
||||
margin-left: auto;
|
||||
}
|
||||
a.back-link{
|
||||
font-weight: 500;
|
||||
float: right;
|
||||
margin-top: 5px;
|
||||
}
|
||||
hr{
|
||||
margin: 3px 0px 4px 0px;
|
||||
height: 1px;
|
||||
background-color: var(--tainacan-secondary);
|
||||
}
|
||||
}
|
||||
|
||||
.advanced-search-form-submit {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
|
|
@ -1516,7 +1416,7 @@
|
|||
opacity: 1;
|
||||
}
|
||||
|
||||
.search-area .is-pulled-right {
|
||||
.search-area .advanced-search-toggle {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
|
@ -1538,10 +1438,6 @@
|
|||
padding-right: 0;
|
||||
max-width: 100% !important;
|
||||
}
|
||||
.is-pulled-right {
|
||||
position: relative;
|
||||
right: 0px !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -1627,14 +1523,26 @@
|
|||
width: 100%;
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
.is-pulled-right {
|
||||
position: absolute;
|
||||
right: 15px;
|
||||
top: 100%;
|
||||
}
|
||||
a {
|
||||
a.advanced-search-toggle {
|
||||
margin-left: 12px;
|
||||
white-space: nowrap;
|
||||
position: absolute;
|
||||
font-size: 0.75em;
|
||||
right: 15px;
|
||||
left: unset;
|
||||
top: 100%;
|
||||
transition: font-size 0.2s ease, right 0.3s ease, left 0.3s ease, top 0.4s ease;
|
||||
|
||||
.icon {
|
||||
display: 0;
|
||||
opacity: 0.0;
|
||||
max-width: 0;
|
||||
transition: opacity 0.2s ease, max-width 0.2s ease;
|
||||
}
|
||||
|
||||
&.is-open {
|
||||
font-size: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -560,8 +560,6 @@ export default {
|
|||
.then(() => {
|
||||
if (!this.isRepositoryLevel)
|
||||
this.updateMetadataOrder();
|
||||
else
|
||||
this.$root.$emit('metadatumUpdated', this.isRepositoryLevel);
|
||||
})
|
||||
.catch(() => {
|
||||
this.$console.log("Error deleting metadatum.")
|
||||
|
|
|
|||
|
|
@ -121,6 +121,17 @@
|
|||
transform: translate(0, 0px);
|
||||
}
|
||||
}
|
||||
.item-appear-enter-active {
|
||||
animation-name: item-appear;
|
||||
animation-duration: 0.2s;
|
||||
animation-timing-function: ease-out;
|
||||
}
|
||||
.item-appear-leave-active {
|
||||
animation-name: item-appear;
|
||||
animation-duration: 0.2s;
|
||||
animation-timing-function: ease-in;
|
||||
animation-direction: reverse;
|
||||
}
|
||||
|
||||
// Filter Item Collapse
|
||||
@keyframes filter-item-in {
|
||||
|
|
|
|||
|
|
@ -8,57 +8,6 @@
|
|||
'is-fullscreen': registeredViewModes[viewMode] != undefined && registeredViewModes[viewMode].full_screen
|
||||
}"
|
||||
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 ------------------------- -->
|
||||
<h3
|
||||
|
|
@ -70,7 +19,7 @@
|
|||
:aria-label="$i18n.get('label_sort_visualization')"
|
||||
role="region"
|
||||
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">
|
||||
|
||||
<!-- <b-loading
|
||||
|
|
@ -82,7 +31,7 @@
|
|||
aria-controls="filters-modal"
|
||||
:aria-expanded="isFiltersModalActive"
|
||||
:class="hideHideFiltersButton ? 'is-hidden-tablet' : ''"
|
||||
v-if="!showFiltersButtonInsideSearchControl && !hideFilters && !openAdvancedSearch && !(registeredViewModes[viewMode] != undefined && registeredViewModes[viewMode].full_screen)"
|
||||
v-if="!showFiltersButtonInsideSearchControl && !hideFilters && !(registeredViewModes[viewMode] != undefined && registeredViewModes[viewMode].full_screen)"
|
||||
id="filter-menu-compress-button"
|
||||
:aria-label="!isFiltersModalActive ? $i18n.get('label_show_filters') : $i18n.get('label_hide_filters')"
|
||||
@click="isFiltersModalActive = !isFiltersModalActive"
|
||||
|
|
@ -106,7 +55,7 @@
|
|||
|
||||
<!-- Text simple search -->
|
||||
<div
|
||||
v-if="!hideSearch && !openAdvancedSearch"
|
||||
v-if="!hideSearch"
|
||||
class="search-control-item">
|
||||
<div
|
||||
role="search"
|
||||
|
|
@ -121,13 +70,17 @@
|
|||
@keyup.enter.native="updateSearch()"
|
||||
icon-right="magnify"
|
||||
icon-right-clickable
|
||||
@icon-right-click="updateSearch()" />
|
||||
@icon-right-click="updateSearch()"
|
||||
:disabled="openAdvancedSearch" />
|
||||
<a
|
||||
v-if="!hideAdvancedSearch"
|
||||
@click="openAdvancedSearch = !openAdvancedSearch; $eventBusSearch.clearAllFilters();"
|
||||
style="font-size: 0.75em;"
|
||||
class="has-text-secondary is-pulled-right">
|
||||
class="advanced-search-toggle has-text-secondary is-pulled-right"
|
||||
:class="openAdvancedSearch ? 'is-open' : 'is-closed'">
|
||||
{{ $i18n.get('advanced_search') }}
|
||||
<span class="icon">
|
||||
<i class="tainacan-icon tainacan-icon-search" />
|
||||
</span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -398,34 +351,34 @@
|
|||
</div>
|
||||
|
||||
<!-- SIDEBAR WITH FILTERS -->
|
||||
<b-modal
|
||||
v-if="!hideFilters"
|
||||
role="region"
|
||||
aria-labelledby="filters-label-landmark"
|
||||
id="filters-modal"
|
||||
ref="filters-modal"
|
||||
:active.sync="isFiltersModalActive"
|
||||
:width="736"
|
||||
animation="slide-menu"
|
||||
:auto-focus="filtersAsModal"
|
||||
:trap-focus="filtersAsModal"
|
||||
full-screen
|
||||
:custom-class="'tainacan-modal tainacan-form filters-menu' + (filtersAsModal ? ' filters-menu-modal' : '')"
|
||||
:can-cancel="hideHideFiltersButton || !filtersAsModal ? ['x', 'outside'] : ['x', 'escape', 'outside']"
|
||||
:close-button-aria-label="$i18n.get('close')">
|
||||
<filters-items-list
|
||||
:is-loading-items="isLoadingItems"
|
||||
:autofocus="filtersAsModal"
|
||||
:tabindex="filtersAsModal ? -1 : 0"
|
||||
:aria-modal="filtersAsModal"
|
||||
:role="filtersAsModal ? 'dialog' : ''"
|
||||
id="filters-items-list"
|
||||
:taxonomy="taxonomy"
|
||||
:collection-id="collectionId"
|
||||
:is-repository-level="isRepositoryLevel"
|
||||
:filters-as-modal="filtersAsModal"
|
||||
:has-filtered="hasFiltered" />
|
||||
</b-modal>
|
||||
<template v-if="!hideFilters">
|
||||
<b-modal
|
||||
role="region"
|
||||
aria-labelledby="filters-label-landmark"
|
||||
id="filters-modal"
|
||||
ref="filters-modal"
|
||||
:active.sync="isFiltersModalActive"
|
||||
:width="736"
|
||||
:auto-focus="filtersAsModal"
|
||||
:trap-focus="filtersAsModal"
|
||||
full-screen
|
||||
:custom-class="'tainacan-modal tainacan-form filters-menu' + (filtersAsModal ? ' filters-menu-modal' : '')"
|
||||
:can-cancel="hideHideFiltersButton || !filtersAsModal ? ['x', 'outside'] : ['x', 'escape', 'outside']"
|
||||
:close-button-aria-label="$i18n.get('close')">
|
||||
<filters-items-list
|
||||
:is-loading-items="isLoadingItems"
|
||||
:autofocus="filtersAsModal"
|
||||
:tabindex="filtersAsModal ? -1 : 0"
|
||||
:aria-modal="filtersAsModal"
|
||||
:role="filtersAsModal ? 'dialog' : ''"
|
||||
id="filters-items-list"
|
||||
:taxonomy="taxonomy"
|
||||
:collection-id="collectionId"
|
||||
:is-repository-level="isRepositoryLevel"
|
||||
:filters-as-modal="filtersAsModal"
|
||||
:has-filtered="hasFiltered" />
|
||||
</b-modal>
|
||||
</template>
|
||||
|
||||
<!-- ITEMS LIST AREA (ASIDE THE ASIDE) ------------------------- -->
|
||||
<div
|
||||
|
|
@ -433,6 +386,20 @@
|
|||
ref="items-list-area"
|
||||
class="items-list-area">
|
||||
|
||||
<!-- ADVANCED SEARCH -->
|
||||
<transition name="filter-item">
|
||||
<div
|
||||
id="advanced-search-container"
|
||||
role="search"
|
||||
v-if="openAdvancedSearch && !hideAdvancedSearch">
|
||||
|
||||
<advanced-search
|
||||
:is-repository-level="isRepositoryLevel"
|
||||
:collection-id="collectionId"
|
||||
@close="openAdvancedSearch = false" />
|
||||
</div>
|
||||
</transition>
|
||||
|
||||
<!-- FILTERS TAG LIST-->
|
||||
<filters-tags-list
|
||||
class="filter-tags-list"
|
||||
|
|
@ -483,8 +450,7 @@
|
|||
<div
|
||||
v-if="hasAnOpenAlert &&
|
||||
isSortingByCustomMetadata &&
|
||||
!showLoading &&
|
||||
((openAdvancedSearch && advancedSearchResults) || !openAdvancedSearch)"
|
||||
!showLoading"
|
||||
class="metadata-alert">
|
||||
<p class="text">
|
||||
{{
|
||||
|
|
@ -509,16 +475,14 @@
|
|||
|
||||
<!-- Theme View Modes -->
|
||||
<div
|
||||
v-if="((openAdvancedSearch && advancedSearchResults) || !openAdvancedSearch) &&
|
||||
!showLoading &&
|
||||
v-if="!showLoading &&
|
||||
registeredViewModes[viewMode] != undefined &&
|
||||
registeredViewModes[viewMode].type == 'template'"
|
||||
v-html="itemsListTemplate"/>
|
||||
|
||||
<component
|
||||
v-if="registeredViewModes[viewMode] != undefined &&
|
||||
registeredViewModes[viewMode].type == 'component' &&
|
||||
((openAdvancedSearch && advancedSearchResults) || !openAdvancedSearch)"
|
||||
registeredViewModes[viewMode].type == 'component'"
|
||||
:collection-id="collectionId"
|
||||
:displayed-metadata="displayedMetadata"
|
||||
:items="items"
|
||||
|
|
@ -534,8 +498,7 @@
|
|||
v-show="!hidePaginationArea"
|
||||
:is-sorting-by-custom-metadata="isSortingByCustomMetadata"
|
||||
v-if="totalItems > 0 &&
|
||||
((registeredViewModes[viewMode] != undefined && registeredViewModes[viewMode].show_pagination)) &&
|
||||
(advancedSearchResults || !openAdvancedSearch)"
|
||||
((registeredViewModes[viewMode] != undefined && registeredViewModes[viewMode].show_pagination))"
|
||||
:hide-items-per-page-button="hideItemsPerPageButton"
|
||||
:hide-go-to-page-button="hideGoToPageButton"/>
|
||||
|
||||
|
|
@ -613,9 +576,6 @@
|
|||
localDisplayedMetadata: [],
|
||||
registeredViewModes: tainacan_plugin.registered_view_modes,
|
||||
openAdvancedSearch: false,
|
||||
openFormAdvancedSearch: false,
|
||||
advancedSearchResults: false,
|
||||
isDoingSearch: false,
|
||||
sortingMetadata: [],
|
||||
isFiltersModalActive: false,
|
||||
hasAnOpenModal: false,
|
||||
|
|
@ -681,7 +641,6 @@
|
|||
openAdvancedSearch(newValue){
|
||||
if (newValue == false){
|
||||
this.$eventBusSearch.$emit('closeAdvancedSearch');
|
||||
this.advancedSearchResults = false;
|
||||
this.isFiltersModalActive = !this.startWithFiltersHidden;
|
||||
} else {
|
||||
this.isFiltersModalActive = false;
|
||||
|
|
@ -739,9 +698,6 @@
|
|||
});
|
||||
|
||||
if (!this.hideAdvancedSearch) {
|
||||
this.$eventBusSearch.$on('advancedSearchResults', advancedSearchResults => {
|
||||
this.advancedSearchResults = advancedSearchResults;
|
||||
});
|
||||
|
||||
if (this.$route.query && this.$route.query.advancedSearch) {
|
||||
this.openAdvancedSearch = this.$route.query.advancedSearch;
|
||||
|
|
@ -1208,8 +1164,6 @@
|
|||
// $eventBusSearch
|
||||
this.$eventBusSearch.$off('isLoadingItems');
|
||||
this.$eventBusSearch.$off('hasFiltered');
|
||||
if (!this.hideAdvancedSearch)
|
||||
this.$eventBusSearch.$off('advancedSearchResults');
|
||||
this.$eventBusSearch.$off('hasToPrepareMetadataAndFilters');
|
||||
|
||||
},
|
||||
|
|
@ -1253,58 +1207,6 @@
|
|||
}
|
||||
}
|
||||
|
||||
.advanced-search-criteria-title {
|
||||
margin-bottom: 40px;
|
||||
|
||||
h1, h2 {
|
||||
font-size: 1.25em !important;
|
||||
font-weight: 500;
|
||||
color: var(--tainacan-heading-color);
|
||||
display: inline-block;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
.field.is-grouped {
|
||||
margin-left: auto;
|
||||
}
|
||||
a.back-link{
|
||||
font-weight: 500;
|
||||
float: right;
|
||||
margin-top: 5px;
|
||||
}
|
||||
hr{
|
||||
margin: 3px 0px 4px 0px;
|
||||
height: 2px;
|
||||
background-color: var(--tainacan-secondary);
|
||||
border: none;
|
||||
}
|
||||
}
|
||||
|
||||
.advanced-search-results-title {
|
||||
margin-bottom: 40px;
|
||||
margin: 0 var(--tainacan-one-column) 42px var(--tainacan-one-column);
|
||||
|
||||
h1, h2 {
|
||||
font-size: 1.25em;
|
||||
font-weight: 500;
|
||||
color: var(--tainacan-heading-color);
|
||||
display: inline-block;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
.field.is-grouped {
|
||||
margin-left: auto;
|
||||
}
|
||||
a.back-link{
|
||||
font-weight: 500;
|
||||
float: right;
|
||||
margin-top: 5px;
|
||||
}
|
||||
hr{
|
||||
margin: 3px 0px 4px 0px;
|
||||
height: 1px;
|
||||
background-color: var(--tainacan-secondary);
|
||||
}
|
||||
}
|
||||
|
||||
.advanced-search-form-submit {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
|
|
@ -1315,16 +1217,6 @@
|
|||
p { margin-left: 0.75em; }
|
||||
}
|
||||
|
||||
.tnc-advanced-search-close {
|
||||
padding-top: 47px;
|
||||
padding-right: var(--tainacan-one-column);
|
||||
padding-left: var(--tainacan-one-column);
|
||||
|
||||
.column {
|
||||
padding: 0 0.3em 0.3em !important;
|
||||
}
|
||||
}
|
||||
|
||||
.page-container {
|
||||
padding: 0;
|
||||
}
|
||||
|
|
@ -1517,15 +1409,27 @@
|
|||
width: 100%;
|
||||
margin: -2px 0 5px 0;
|
||||
}
|
||||
.is-pulled-right {
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 100%;
|
||||
}
|
||||
a {
|
||||
a.advanced-search-toggle {
|
||||
margin-left: 12px;
|
||||
white-space: nowrap;
|
||||
}
|
||||
position: absolute;
|
||||
font-size: 0.75em;
|
||||
right: 15px;
|
||||
left: unset;
|
||||
top: 100%;
|
||||
transition: font-size 0.2s ease, right 0.3s ease, left 0.3s ease, top 0.4s ease;
|
||||
|
||||
.icon {
|
||||
display: 0;
|
||||
opacity: 0.0;
|
||||
max-width: 0;
|
||||
transition: opacity 0.2s ease, max-width 0.2s ease;
|
||||
}
|
||||
|
||||
&.is-open {
|
||||
font-size: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&#tainacanFiltersButton.is-filters-modal-active .gray-icon i::before {
|
||||
|
|
|
|||
|
|
@ -49,6 +49,7 @@ export default {
|
|||
|
||||
// Buefy imports
|
||||
@import "../../../../../node_modules/buefy/src/scss/utils/_all.scss";
|
||||
@import "../../../../../node_modules/buefy/src/scss/components/_form.scss";
|
||||
@import "../../../../../node_modules/buefy/src/scss/components/_datepicker.scss";
|
||||
@import "../../../../../node_modules/buefy/src/scss/components/_checkbox.scss";
|
||||
@import "../../../../../node_modules/buefy/src/scss/components/_radio.scss";
|
||||
|
|
|
|||
|
|
@ -611,6 +611,8 @@ return apply_filters( 'tainacan-i18n', [
|
|||
'label_limit_max_values' => __( 'Limit the amount of multiple values', 'tainacan'),
|
||||
'label_items_selection' => __( 'Items selection', 'tainacan'),
|
||||
'label_default_orderby' => __( 'Initial default sorting', 'tainacan' ),
|
||||
'label_close_search' => __( 'Close search', 'tainacan' ),
|
||||
'label_remove_all_criteria' => __( 'Remove all criteria', 'tainacan' ),
|
||||
|
||||
// Instructions. More complex sentences to guide user and placeholders
|
||||
'instruction_delete_selected_collections' => __( 'Delete selected collections', 'tainacan' ),
|
||||
|
|
|
|||
Loading…
Reference in New Issue