| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778 |
- import Overlay from '../../overlay';
- import { context } from './context';
- import { mount } from '../../utils/functional';
- export type OverlayConfig = {
- zIndex?: number;
- className?: string;
- customStyle?: string | object[] | object;
- };
- const defaultConfig: OverlayConfig = {
- className: '',
- customStyle: {}
- };
- let overlay: any;
- // close popup when click overlay && closeOnClickOverlay is true
- function onClickOverlay(): void {
- if (context.top) {
- const { vm } = context.top;
- vm.$emit('click-overlay');
- if (vm.closeOnClickOverlay) {
- if (vm.onClickOverlay) {
- vm.onClickOverlay();
- } else {
- vm.close();
- }
- }
- }
- }
- export function updateOverlay(): void {
- if (!overlay) {
- overlay = mount(Overlay, {
- on: {
- click: onClickOverlay
- }
- });
- }
- if (context.top) {
- const { vm, config } = context.top;
- const el = vm.$el;
- const target = el && el.parentNode ? el.parentNode : document.body;
- if (target) {
- target.appendChild(overlay.$el);
- }
- Object.assign(overlay, defaultConfig, config, {
- visible: true
- });
- } else {
- overlay.visible = false;
- }
- }
- export function openOverlay(vm: any, config: OverlayConfig): void {
- if (!context.stack.some(item => item.vm === vm)) {
- context.stack.push({ vm, config });
- updateOverlay();
- }
- }
- export function closeOverlay(vm: any): void {
- const { stack } = context;
- if (stack.length) {
- if (context.top.vm === vm) {
- stack.pop();
- updateOverlay();
- } else {
- context.stack = stack.filter(item => item.vm !== vm);
- }
- }
- }
|