Deregisters event listener from ItemsPage to avoid access to undefined refs.

This commit is contained in:
Mateus Machado Luna 2018-08-07 09:35:31 -03:00
parent a1f8c2764a
commit 79781c8c3e
5 changed files with 58 additions and 27 deletions

View File

@ -6,6 +6,7 @@
:active-route="activeRoute"
:is-menu-compressed="isMenuCompressed"/>
<button
class="is-hidden-mobile"
id="menu-compress-button"
@click="isMenuCompressed = !isMenuCompressed">
<b-icon :icon="isMenuCompressed ? 'menu-right' : 'menu-left'" />

View File

@ -3,7 +3,7 @@
id="tainacan-subheader"
class="secondary-page">
<div class="back-button">
<div class="back-button is-hidden-mobile">
<button
@click="$router.go(-1)"
class="button is-turquoise4">
@ -14,6 +14,15 @@
</div>
<div class="level">
<div class="level-left">
<div class="back-button is-hidden-tablet level-item">
<button
@click="$router.go(-1)"
class="button is-turquoise4">
<span class="icon">
<i class="mdi mdi-chevron-left"/>
</span>
</button>
</div>
<div class="level-item">
<nav class="breadcrumbs">
<router-link
@ -371,30 +380,39 @@ export default {
@media screen and (max-width: 769px) {
width: 100% !important;
max-width: 100% !important;
height: 143px;
max-height: 143px;
height: 85px;
max-height: 85px;
padding: 0;
top: 206px;
margin-bottom: 0px !important;
ul {
margin-top: 12px;
.level-left {
margin-left: 0px !important;
display: flex;
padding: 0 1rem;
.level-item {
display: inline-flex;
}
}
.level-right {
margin-top: 0px;
flex-flow: wrap;
display: flex;
align-items: baseline;
justify-content: space-between;
.level-item {
margin-bottom: 0;
a {
padding: 0.5em 0.7em !important;
text-align: center;
}
.menu-text {
padding-left: 0.3em !important;
display: none;
}
}
.level-left {
margin-left: 0px !important;
}
top: 206px;
margin-bottom: 0px !important;
}
}

View File

@ -15,7 +15,16 @@
</div>
</div>
<div class="level-right">
<div class="search-area">
<div class="is-hidden-tablet">
<button
@click="$router.push($routerHelper.getItemsPath())"
class="button is-small is-white level-item">
<span class="icon is-right">
<i class="mdi mdi-24px mdi-magnify"/>
</span>
</button>
</div>
<div class="search-area is-hidden-mobile">
<div class="control has-icons-right is-small is-clearfix">
<input
autocomplete="on"

View File

@ -1022,6 +1022,12 @@
.catch(() => {
this.isLoadingMetadata = false;
});
},
adjustSearchControlHeight() {
this.$nextTick(() => {
this.searchControlHeight = this.$refs['search-control'] ? this.$refs['search-control'].clientHeight : 0;
this.isFiltersMenuCompressed = jQuery(window).width() <= 768;
});
}
},
created() {
@ -1087,14 +1093,11 @@
}
// 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;
});
})
window.addEventListener('resize', this.adjustSearchControlHeight());
},
beforeDestroy() {
this.$off();
window.removeEventListener('resize', this.adjustSearchControlHeight());
}
}
</script>

View File

@ -71,7 +71,7 @@ a:hover {
height: $page-height !important;
@media screen and (max-width: 769px) {
margin-top: 0;
margin-top: 42px;
}
.is-primary:not(.upload-draggable), .is-primary:hover, .is-primary:focus {