import Vue from 'vue';
import { VxeUI, renderEmptyElement } from '@vxe-ui/core';
let dynamicContainerElem;
export const DynamicApp = Vue.extend({
    data() {
        const modals = [];
        const drawers = [];
        return {
            modals,
            drawers,
            globalLoading: null,
            globalWatermark: null,
            globalContextMenu: null
        };
    },
    methods: {
        renderVN(h) {
            const $xeDynamicApp = this;
            const VxeUIModalComponent = VxeUI.getComponent('vxe-modal');
            const VxeUIDrawerComponent = VxeUI.getComponent('vxe-drawer');
            const VxeUILoadingComponent = VxeUI.getComponent('vxe-loading');
            const VxeUIWatermarkComponent = VxeUI.getComponent('vxe-watermark');
            const VxeUIContextMenuComponent = VxeUI.getComponent('vxe-context-menu');
            const { modals, drawers, globalLoading, globalWatermark, globalContextMenu } = $xeDynamicApp;
            let cmOns;
            if (globalContextMenu) {
                const events = globalContextMenu.events || {};
                const { optionClick, show, hide } = events;
                cmOns = {
                    show(params) {
                        const { $contextMenu } = params;
                        if (show) {
                            show.call($contextMenu, params);
                        }
                    },
                    hide(params) {
                        const { $contextMenu } = params;
                        if (hide) {
                            hide.call($contextMenu, params);
                        }
                        dynamicStore.globalContextMenu = null;
                    },
                    'option-click'(params) {
                        const { $contextMenu } = params;
                        if (optionClick) {
                            optionClick.call($contextMenu, params);
                        }
                    }
                };
            }
            return h('div', {}, [
                modals.length
                    ? h('div', {
                        key: 1,
                        class: 'vxe-dynamics--modal'
                    }, modals.map((item) => h(VxeUIModalComponent, {
                        key: item.key,
                        props: item.props,
                        on: item.on
                    })))
                    : renderEmptyElement($xeDynamicApp),
                drawers.length
                    ? h('div', {
                        key: 2,
                        class: 'vxe-dynamics--drawer'
                    }, drawers.map((item) => h(VxeUIDrawerComponent, {
                        key: item.key,
                        props: item.props,
                        on: item.on
                    })))
                    : renderEmptyElement($xeDynamicApp),
                globalWatermark
                    ? h(VxeUIWatermarkComponent, {
                        key: 'gw',
                        props: globalWatermark
                    })
                    : renderEmptyElement($xeDynamicApp),
                globalLoading
                    ? h(VxeUILoadingComponent, {
                        key: 'gl',
                        props: globalLoading
                    })
                    : renderEmptyElement($xeDynamicApp),
                globalContextMenu
                    ? h(VxeUIContextMenuComponent, {
                        key: 'cm',
                        props: globalContextMenu,
                        on: cmOns
                    })
                    : renderEmptyElement($xeDynamicApp)
            ]);
        }
    },
    render(h) {
        return this.renderVN(h);
    }
});
export const dynamicApp = DynamicApp;
export const dynamicStore = new DynamicApp();
export function checkDynamic() {
    if (!dynamicContainerElem) {
        dynamicContainerElem = document.createElement('div');
        dynamicContainerElem.className = 'vxe-dynamics';
        document.body.appendChild(dynamicContainerElem);
        dynamicStore.$mount(dynamicContainerElem);
    }
}
