Merge branch 'develop' of https://github.com/tainacan/tainacan into develop
This commit is contained in:
weryques
commit
993dc9624f
|
|
@ -19,6 +19,7 @@ module.exports = {
|
|||
},
|
||||
globals: {
|
||||
'tainacan_plugin': true,
|
||||
'_': true
|
||||
'_': true,
|
||||
'jQuery': true
|
||||
}
|
||||
}
|
||||
|
|
@ -87,7 +87,7 @@
|
|||
class="icon has-text-tertiary"><i class="mdi mdi-18px mdi-autorenew"/></span>
|
||||
<p class="footer-title">
|
||||
{{ hasAnyProcessExecuting ?
|
||||
(bgProcesses[0].progress_label ? bgProcesses[0].progress_label + ((bgProcesses[0].progress_value && bgProcesses[0].value >= 0) ? ' - ' + bgProcesses[0].progress_value : '') : $i18n.get('label_no_details_of_process')):
|
||||
(bgProcesses[0].progress_label ? bgProcesses[0].progress_label + ((bgProcesses[0].progress_value && bgProcesses[0].progress_value >= 0) ? ' - ' + bgProcesses[0].progress_value : '') : $i18n.get('label_no_details_of_process')):
|
||||
$i18n.get('info_no_process')
|
||||
}}
|
||||
</p>
|
||||
|
|
|
|||
|
|
@ -14,13 +14,14 @@
|
|||
</button>
|
||||
<!-- Side bar with search and filters -->
|
||||
<aside
|
||||
:style="{ top: searchControlHeight + 'px' }"
|
||||
v-show="!isFiltersMenuCompressed && !openAdvancedSearch"
|
||||
class="filters-menu tainacan-form">
|
||||
<b-loading
|
||||
:is-full-page="false"
|
||||
:active.sync="isLoadingFilters"/>
|
||||
|
||||
<div class="search-area">
|
||||
<div class="search-area is-hidden-mobile">
|
||||
<div class="control has-icons-right is-small is-clearfix">
|
||||
<input
|
||||
class="input is-small"
|
||||
|
|
@ -39,7 +40,7 @@
|
|||
</div>
|
||||
<a
|
||||
@click="openAdvancedSearch = !openAdvancedSearch"
|
||||
class="is-size-7 is-secondary is-pulled-right">{{ $i18n.get('advanced_search') }}</a>
|
||||
class="is-size-7 is-secondary is-pulled-right is-hidden-mobile">{{ $i18n.get('advanced_search') }}</a>
|
||||
|
||||
<h3 class="has-text-weight-semibold">{{ $i18n.get('filters') }}</h3>
|
||||
<a
|
||||
|
|
@ -105,6 +106,7 @@
|
|||
|
||||
<!-- SEARCH CONTROL ------------------------- -->
|
||||
<div
|
||||
ref="search-control"
|
||||
v-if="!openAdvancedSearch"
|
||||
class="search-control">
|
||||
<b-loading
|
||||
|
|
@ -251,7 +253,7 @@
|
|||
class="gray-icon view-mode-icon"
|
||||
v-if="registeredViewModes[viewMode] != undefined"
|
||||
v-html="registeredViewModes[viewMode].icon"/>
|
||||
{{ $i18n.get('label_visualization') }}
|
||||
<span class="is-hidden-mobile"> {{ $i18n.get('label_visualization') }}</span>
|
||||
<b-icon icon="menu-down" />
|
||||
</button>
|
||||
<b-dropdown-item
|
||||
|
|
@ -328,6 +330,28 @@
|
|||
</b-dropdown>
|
||||
</b-field>
|
||||
</div>
|
||||
|
||||
<!-- Text simple search (used on mobile, instead of the one from filter list)-->
|
||||
<div class="is-hidden-tablet search-control-item">
|
||||
<div class="control has-icons-right is-small is-clearfix">
|
||||
<input
|
||||
class="input is-small"
|
||||
:placeholder="$i18n.get('instruction_search')"
|
||||
type="search"
|
||||
autocomplete="on"
|
||||
:value="searchQuery"
|
||||
@input="futureSearchQuery = $event.target.value"
|
||||
@keyup.enter="updateSearch()">
|
||||
<span
|
||||
@click="updateSearch()"
|
||||
class="icon is-right">
|
||||
<i class="mdi mdi-magnify" />
|
||||
</span>
|
||||
</div>
|
||||
<a
|
||||
@click="openAdvancedSearch = !openAdvancedSearch"
|
||||
class="is-size-7 is-secondary is-pulled-right">{{ $i18n.get('advanced_search') }}</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- ADVANCED SEARCH -->
|
||||
|
|
@ -553,6 +577,7 @@
|
|||
openFormAdvancedSearch: false,
|
||||
advancedSearchResults: false,
|
||||
isDoSearch: false,
|
||||
searchControlHeight: 0
|
||||
}
|
||||
},
|
||||
props: {
|
||||
|
|
@ -653,9 +678,19 @@
|
|||
},
|
||||
onChangeViewMode(viewMode) {
|
||||
this.$eventBusSearch.setViewMode(viewMode);
|
||||
|
||||
// Updates searchControlHeight before in case we need to adjust filters position on mobile
|
||||
setTimeout(() => {
|
||||
this.searchControlHeight = this.$refs['search-control'].clientHeight;
|
||||
}, 500);
|
||||
},
|
||||
onChangeAdminViewMode(adminViewMode) {
|
||||
this.$eventBusSearch.setAdminViewMode(adminViewMode);
|
||||
|
||||
// Updates searchControlHeight before in case we need to adjust filters position on mobile
|
||||
setTimeout(() => {
|
||||
this.searchControlHeight = this.$refs['search-control'].clientHeight;
|
||||
}, 500);
|
||||
},
|
||||
onChangeDisplayedMetadata() {
|
||||
let fetchOnlyMetadatumIds = [];
|
||||
|
|
@ -838,6 +873,7 @@
|
|||
|
||||
},
|
||||
mounted() {
|
||||
|
||||
this.prepareMetadataAndFilters();
|
||||
this.localTableMetadata = JSON.parse(JSON.stringify(this.tableMetadata));
|
||||
|
||||
|
|
@ -863,6 +899,16 @@
|
|||
this.$emit('onShrinkHeader', this.isHeaderShrinked);
|
||||
});
|
||||
}
|
||||
|
||||
// Watches window resize to adjust filter's top position and compression on mobile
|
||||
this.$nextTick(() => {
|
||||
this.searchControlHeight = this.$refs['search-control'].clientHeight;
|
||||
this.isFiltersMenuCompressed = jQuery(window).width() <= 768;
|
||||
window.addEventListener('resize', () => {
|
||||
this.isFiltersMenuCompressed = jQuery(window).width() <= 768;
|
||||
this.searchControlHeight = this.$refs['search-control'].clientHeight;
|
||||
});
|
||||
})
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
|
@ -921,7 +967,7 @@
|
|||
|
||||
.filters-menu {
|
||||
position: relative;
|
||||
z-index: 9;
|
||||
z-index: 10;
|
||||
background-color: white;
|
||||
width: $filter-menu-width;
|
||||
min-width: 180px;
|
||||
|
|
@ -936,6 +982,18 @@
|
|||
display: block;
|
||||
transition: visibility ease 0.5s, display ease 0.5s;
|
||||
|
||||
@media screen and (max-width: 768px) {
|
||||
width: 100%;
|
||||
padding: $page-small-side-padding !important;
|
||||
|
||||
h3 {
|
||||
margin-top: 0 !important;
|
||||
}
|
||||
}
|
||||
@media screen and (min-width: 769px) {
|
||||
top: 0px !important;
|
||||
}
|
||||
|
||||
h3 {
|
||||
font-size: 100%;
|
||||
margin-top: 48px;
|
||||
|
|
@ -998,6 +1056,10 @@
|
|||
|
||||
.spaced-to-right {
|
||||
margin-left: $filter-menu-width;
|
||||
|
||||
@media screen and (max-width: 768px) {
|
||||
margin-left: 0px !important;
|
||||
}
|
||||
}
|
||||
|
||||
.search-control {
|
||||
|
|
|
|||
|
|
@ -291,7 +291,11 @@ export default {
|
|||
position: absolute !important;
|
||||
min-width: $filter-menu-width-theme;
|
||||
border-right: 0;
|
||||
padding: 25px 12px 25px 4.1666667%;
|
||||
padding: 25px 2.0833333% 25px 4.1666667%;
|
||||
|
||||
@media screen and (min-width: 769px) and (max-width: 1023px) {
|
||||
min-width: 25% !important;
|
||||
}
|
||||
|
||||
.columns {
|
||||
display: flex;
|
||||
|
|
@ -318,6 +322,7 @@ export default {
|
|||
.view-mode-icon {
|
||||
margin-right: 0px !important;
|
||||
margin-top: 1px;
|
||||
margin-left: 4px;
|
||||
|
||||
&.icon i::before, .gray-icon i::before {
|
||||
font-size: 19px !important;
|
||||
|
|
@ -331,6 +336,10 @@ export default {
|
|||
margin-left: 0;
|
||||
&.spaced-to-right {
|
||||
margin-left: $filter-menu-width-theme;
|
||||
|
||||
@media screen and (min-width: 769px) and (max-width: 1023px) {
|
||||
margin-left: 25% !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
Loading…
Reference in New Issue