MoeNovaClient/common/teenagePopup.js

import Vue from 'vue'
import teenagePopUpWindow from '@/components/teenagePopUpWindow/teenagePopUpWindow.vue'
const app = getApp();

// 存储当前弹窗实例
let currentPopupInstance = null;

// 创建全局弹窗容器
function createPopupContainer() {
    const container = document.createElement('div');
    container.id = 'teenage-popup-container';
    document.body.appendChild(container);
    return container;
}

export function createTeenagePopUpWindow(options = {}) {
    const { title, content, confirmText, imageSrc } = options;

    // 如果存在当前弹窗实例，先关闭它
    if (currentPopupInstance) {
        currentPopupInstance.hide();
        currentPopupInstance = null;
    }

    // 确保弹窗容器存在
    let container = document.getElementById('teenage-popup-container');
    if (!container) {
        container = createPopupContainer();
    }

    // 创建 Vue 实例
    const PopupConstructor = Vue.extend({
        render(h) {
            return h(teenagePopUpWindow, {
                props: {
                    text: content || '截图至相册，QQ扫一扫',
                    confirmText: confirmText || '知道了',
                    imageSrc: imageSrc || '../../static/me/qingshaonianmoshi.png'
                },
                on: {
                    close: this.closePopup
                }
            });
        },
        methods: {
            closePopup() {
                this.$destroy();
                this.$el.remove();
                currentPopupInstance = null;
            }
        }
    });

    // 创建并挂载实例
    const instance = new PopupConstructor().$mount(container);

    // 创建弹窗控制对象
    const popupControl = {
        show: () => {
            if (instance.$children && instance.$children[0] && instance.$children[0].open) {
                instance.$children[0].open();
            }
        },
        hide: () => {
            if (instance.$children && instance.$children[0] && instance.$children[0].close) {
                instance.$children[0].close();
            }
        }
    };

    // 保存当前实例
    currentPopupInstance = popupControl;

    return popupControl;
}

// 全局定时弹窗方法  
export async function setupTeenagePopupTimer() {

    function showTeenagePopUpWindow() { 
        const teenagePopup = createTeenagePopUpWindow({
            title: '青少年模式提醒',
            content: '为保护未成年人健康成长，建议合理控制使用时间',
            confirmText: '我知道了'
        });

        // 显示弹窗 
        teenagePopup.show(); 
    }
 
    showTeenagePopUpWindow();  
}