Fixed zindex issue

pull/1088/head
Cagatay Civici 2021-04-14 16:42:38 +03:00
parent 32389aea17
commit 6bf5736060
2 changed files with 11 additions and 6 deletions

View File

@ -5,7 +5,7 @@
</template>
<script>
import {DomHandler} from 'primevue/utils';
import {DomHandler,ZIndexUtils} from 'primevue/utils';
export default {
emits: ['block', 'unblock'],
@ -63,7 +63,7 @@ export default {
}
if (this.autoZIndex) {
this.mask.style.zIndex = String(this.baseZIndex + DomHandler.generateZIndex());
ZIndexUtils.set('modal', this.mask, this.baseZIndex + this.$primevue.config.zIndex.modal);
}
this.$emit('block');
@ -75,6 +75,7 @@ export default {
});
},
removeMask() {
ZIndexUtils.clear(this.mask);
if (this.fullScreen) {
document.body.removeChild(this.mask);
DomHandler.removeClass(document.body, 'p-overflow-hidden');

View File

@ -8,7 +8,7 @@
@click="toggleMenu()" @keydown="onToggleButtonKeyDown($event)"><span class="pi pi-filter-icon pi-filter"></span></button>
<button v-if="showMenuButton && display === 'row'" :class="{'p-hidden-space': !hasRowFilter()}" type="button" class="p-column-filter-clear-button p-link" @click="clearFilter()"><span class="pi pi-filter-slash"></span></button>
<Teleport to="body">
<transition name="p-connected-overlay" @enter="onOverlayEnter" @leave="onOverlayLeave">
<transition name="p-connected-overlay" @enter="onOverlayEnter" @leave="onOverlayLeave" @after-leave="onOverlayAfterLeave">
<div :ref="overlayRef" :class="overlayClass" v-if="overlayVisible" @keydown.escape="onEscape" @click="onContentClick">
<component :is="filterHeaderTemplate" :field="field" :filterModel="filters[field]" :filterCallback="filterCallback" />
<template v-if="display === 'row'">
@ -54,7 +54,7 @@
</template>
<script>
import {DomHandler,ConnectedOverlayScrollHandler} from 'primevue/utils';
import {DomHandler,ConnectedOverlayScrollHandler,ZIndexUtils} from 'primevue/utils';
import OverlayEventBus from 'primevue/overlayeventbus';
import {FilterOperator} from 'primevue/api';
import Dropdown from 'primevue/dropdown';
@ -144,6 +144,7 @@ export default {
selfClick: false,
beforeUnmount() {
if (this.overlay) {
ZIndexUtils.clear(el);
this.onOverlayHide();
}
},
@ -341,12 +342,12 @@ export default {
onContentClick() {
this.selfClick = true;
},
onOverlayEnter() {
onOverlayEnter(el) {
if (this.filterMenuStyle) {
DomHandler.applyStyle(this.overlay, this.filterMenuStyle);
}
document.body.appendChild(this.overlay);
this.overlay.style.zIndex = String(DomHandler.generateZIndex());
ZIndexUtils.set('overlay', el, this.$primevue.config.zIndex.overlay);
DomHandler.absolutePosition(this.overlay, this.$refs.icon);
this.bindOutsideClickListener();
this.bindScrollListener();
@ -361,6 +362,9 @@ export default {
onOverlayLeave() {
this.onOverlayHide();
},
onOverlayAfterLeave(el) {
ZIndexUtils.clear(el);
},
onOverlayHide() {
this.unbindOutsideClickListener();
this.unbindResizeListener();