AnimationManager/client/js/confirm-view.js

/**
 * 全局确认对话�?
 * 加载�?index.html 中，覆盖整个页面
 */
class GlobalConfirm {
    constructor() {
        this.overlay = null;
        this.message = null;
        this.okBtn = null;
        this.cancelBtn = null;
        this.resolveCallback = null;
        this.ready = false;
        
        // 立即初始�?
        this.initPromise = this.init();
    }

    async init() {
// ('[GlobalConfirm] �?init 开�?);
        
        await this.ensureElements();
// ('[GlobalConfirm] �?查找DOM元素...');
        
        this.overlay = document.getElementById('globalConfirmOverlay');
        this.message = document.getElementById('confirmMessage');
        this.okBtn = document.getElementById('confirmOkBtn');
        this.cancelBtn = document.getElementById('confirmCancelBtn');
        
// ('[GlobalConfirm]   overlay:', !!this.overlay);
// ('[GlobalConfirm]   message:', !!this.message);
// ('[GlobalConfirm]   okBtn:', !!this.okBtn);
// ('[GlobalConfirm]   cancelBtn:', !!this.cancelBtn);
        
        if (this.overlay && this.okBtn && this.cancelBtn) {
            this.bindEvents();
            this.ready = true;
// ('[GlobalConfirm] �?初始化完成，ready=true');
        } else {
// ('[GlobalConfirm] �?初始化失败，部分元素未找�?);
        }
    }

    async ensureElements() {
// ('[GlobalConfirm] �?ensureElements 开�?);
        
        if (document.getElementById('globalConfirmOverlay')) {
// ('[GlobalConfirm] �?元素已存在，跳过加载');
            return;
        }

        try {
// ('[GlobalConfirm] �?开始加�?/page/confirm-view.html');
            const response = await fetch('/page/confirm-view.html', { cache: 'no-cache' });
// ('[GlobalConfirm]   响应状�?', response.status, response.statusText);
            
            if (!response.ok) {
                throw new Error('加载确认对话框组件失败');
            }
            const html = await response.text();
// ('[GlobalConfirm] �?HTML已获取，长度:', html.length);
            
            document.body.insertAdjacentHTML('beforeend', html);
// ('[GlobalConfirm] �?HTML已插入到body');
        } catch (error) {
// ('[GlobalConfirm] �?加载确认对话框组件失�?', error);
        }
    }

    bindEvents() {
// ('[GlobalConfirm] �?绑定事件监听�?);
        
        this.okBtn.addEventListener('click', () => {
// ('[GlobalConfirm] �?用户点击确认按钮');
            this.hide();
            if (this.resolveCallback) {
// ('[GlobalConfirm] �?调用 resolveCallback(true)');
                this.resolveCallback(true);
            }
        });

        this.cancelBtn.addEventListener('click', () => {
// ('[GlobalConfirm] �?用户点击取消按钮');
            this.hide();
            if (this.resolveCallback) {
// ('[GlobalConfirm] �?调用 resolveCallback(false)');
                this.resolveCallback(false);
            }
        });

        // 点击遮罩层取�?
        this.overlay.addEventListener('click', (e) => {
            if (e.target === this.overlay) {
                this.hide();
                if (this.resolveCallback) {
                    this.resolveCallback(false);
                }
            }
        });

        // ESC键取�?
        document.addEventListener('keydown', (e) => {
            if (e.key === 'Escape' && this.overlay && this.overlay.classList.contains('show')) {
                this.hide();
                if (this.resolveCallback) {
                    this.resolveCallback(false);
                }
            }
        });
    }

    async show(message) {
// ('[GlobalConfirm] �?show() 被调�?);
// ('[GlobalConfirm]   消息:', message);
// ('[GlobalConfirm]   ready状�?', this.ready);
        
        // 确保初始化完�?
// ('[GlobalConfirm] �?等待初始化完�?..');
        await this.initPromise;
// ('[GlobalConfirm] �?初始化完�?);
// ('[GlobalConfirm]   overlay:', !!this.overlay);
// ('[GlobalConfirm]   message:', !!this.message);
// ('[GlobalConfirm]   okBtn:', !!this.okBtn);
// ('[GlobalConfirm]   cancelBtn:', !!this.cancelBtn);
        
        return new Promise((resolve) => {
// ('[GlobalConfirm] �?创建Promise，等待用户操�?);
            this.resolveCallback = resolve;
            if (this.message) {
                this.message.textContent = message;
// ('[GlobalConfirm] �?消息已设�?);
            }
            if (this.overlay) {
                this.overlay.classList.add('show');
// ('[GlobalConfirm] �?对话框已显示');
            }
        });
    }

    hide() {
// ('[GlobalConfirm] �?隐藏对话�?);
        if (this.overlay) {
            this.overlay.classList.remove('show');
// ('[GlobalConfirm] �?对话框已隐藏');
        }
    }
}

// 全局单例
// console.log('[GlobalConfirm] 创建全局实例...');
window.GlobalConfirm = new GlobalConfirm();
// console.log('[GlobalConfirm] ✓ 全局实例已创建');