vertumnus/primevue-mirror
1
0
Fork 0
mirror of https://github.com/primefaces/primevue.git synced 2025-05-09 08:52:34 +00:00
Code Issues Projects Releases Packages Wiki Activity

Refactor #3965 - For BlockUI

Browse source
This commit is contained in:
Bahadır Sofuoğlu 2023-05-24 17:56:02 +03:00
parent c8a856dc9e
commit fee8498a7e
3 changed files with 80 additions and 47 deletions
Download patch file Download diff file Expand all files Collapse all files

56
components/lib/blockui/BlockUI.vue
View file

@ -1,5 +1,5 @@
<template>
<div ref="container" class="p-blockui-container" :aria-busy="isBlocked" v-bind="ptm('root')">
<div ref="container" :class="cx('root')" :aria-busy="isBlocked" v-bind="ptm('root')">
<slot></slot>
</div>
</template>
@ -12,24 +12,6 @@ export default {
name: 'BlockUI',
extends: BaseComponent,
emits: ['block', 'unblock'],
props: {
blocked: {
type: Boolean,
default: false
},
fullScreen: {
type: Boolean,
default: false
},
baseZIndex: {
type: Number,
default: 0
},
autoZIndex: {
type: Boolean,
default: true
}
},
mask: null,
data() {
return {
@ -54,13 +36,13 @@ export default {
if (this.fullScreen) {
styleClass += ' p-blockui-document';
this.mask = document.createElement('div');
this.mask.setAttribute('class', styleClass);
!this.isUnstyled && this.mask.setAttribute('class', styleClass);
document.body.appendChild(this.mask);
DomHandler.addClass(document.body, 'p-overflow-hidden');
!this.isUnstyled && DomHandler.addClass(document.body, 'p-overflow-hidden');
document.activeElement.blur();
} else {
this.mask = document.createElement('div');
this.mask.setAttribute('class', styleClass);
!this.isUnstyled && this.mask.setAttribute('class', styleClass);
this.$refs.container.appendChild(this.mask);
}
@ -72,7 +54,7 @@ export default {
this.$emit('block');
},
unblock() {
DomHandler.addClass(this.mask, 'p-component-overlay-leave');
!this.isUnstyled && DomHandler.addClass(this.mask, 'p-component-overlay-leave');
this.mask.addEventListener('animationend', () => {
this.removeMask();
});
@ -81,8 +63,10 @@ export default {
ZIndexUtils.clear(this.mask);
if (this.fullScreen) {
document.body.removeChild(this.mask);
DomHandler.removeClass(document.body, 'p-overflow-hidden');
if (!this.isUnstyled) {
document.body.removeChild(this.mask);
DomHandler.removeClass(document.body, 'p-overflow-hidden');
}
} else {
this.$refs.container.removeChild(this.mask);
}
@ -93,25 +77,3 @@ export default {
}
};
</script>
<style>
.p-blockui-container {
position: relative;
}
.p-blockui {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.p-blockui.p-component-overlay {
position: absolute;
}
.p-blockui-document.p-component-overlay {
position: fixed;
}
</style>