element-plus
Version:
> TODO: description
55 lines (54 loc) • 2.22 kB
JavaScript
;
var __importDefault = (this && this.__importDefault) || function (mod) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
const vue_1 = require("vue");
const scrollbar_width_1 = __importDefault(require("../../utils/scrollbar-width"));
const error_1 = __importDefault(require("../../utils/error"));
const dom_1 = require("../../utils/dom");
/**
* Hook that monitoring the ref value to lock or unlock the screen.
* When the trigger became true, it assumes modal is now opened and vice versa.
* @param trigger {Ref<boolean>}
*/
exports.default = (trigger) => {
if (!vue_1.isRef(trigger)) {
error_1.default('[useLockScreen]', 'You need to pass a ref param to this function');
}
let scrollBarWidth = 0;
let withoutHiddenClass = false;
let bodyPaddingRight = '0';
let computedBodyPaddingRight = 0;
vue_1.onUnmounted(() => {
cleanup();
});
const cleanup = () => {
dom_1.removeClass(document.body, 'el-popup-parent--hidden');
if (withoutHiddenClass) {
document.body.style.paddingRight = bodyPaddingRight;
}
};
vue_1.watch(trigger, val => {
if (val) {
withoutHiddenClass = !dom_1.hasClass(document.body, 'el-popup-parent--hidden');
if (withoutHiddenClass) {
bodyPaddingRight = document.body.style.paddingRight;
computedBodyPaddingRight = parseInt(dom_1.getStyle(document.body, 'paddingRight'), 10);
}
scrollBarWidth = scrollbar_width_1.default();
const bodyHasOverflow = document.documentElement.clientHeight < document.body.scrollHeight;
const bodyOverflowY = dom_1.getStyle(document.body, 'overflowY');
if (scrollBarWidth > 0 &&
(bodyHasOverflow || bodyOverflowY === 'scroll') &&
withoutHiddenClass) {
document.body.style.paddingRight =
computedBodyPaddingRight + scrollBarWidth + 'px';
}
dom_1.addClass(document.body, 'el-popup-parent--hidden');
}
else {
cleanup();
}
});
};