static/js/api-key-manager/modals.js

/**
 * API密钥管理器 - 模态框控制模块
 * 负责统一管理模态框的显示和交互
 */

// 打开添加密钥模态框
function openAddKeyModal() {
    if (!window.apiKeyManagerInstance) return;
    window.apiKeyManagerInstance.showAddModal = true;
    
    // 聚焦到平台选择下拉框
    setTimeout(() => {
        document.getElementById('platform')?.focus();
    }, 100);
}

// 打开编辑密钥模态框
function openEditKeyModal(id, name, key, platform) {
    if (!window.apiKeyManagerInstance) return;
    window.apiKeyManagerInstance.editApiKey(id, name, key, platform);
}

// 打开删除确认模态框
function openDeleteConfirmModal(id, name) {
    if (!window.apiKeyManagerInstance) return;
    window.apiKeyManagerInstance.deleteApiKey(id, name);
}

// 关闭所有模态框
function closeAllModals() {
    if (!window.apiKeyManagerInstance) return;
    
    window.apiKeyManagerInstance.showAddModal = false;
    window.apiKeyManagerInstance.showEditModal = false;
    window.apiKeyManagerInstance.showDeleteConfirm = false;
}

// 处理键盘快捷键
function setupModalKeyboardShortcuts() {
    document.addEventListener('keydown', (e) => {
        // ESC键关闭所有模态框
        if (e.key === 'Escape') {
            closeAllModals();
        }
        
        // Alt+N 打开添加模态框
        if (e.altKey && e.key === 'n') {
            openAddKeyModal();
        }
    });
}

// 初始化模态框设置
function initModals() {
    // 存储对API密钥管理器实例的引用，方便全局访问
    window.addEventListener('alpine:initialized', () => {
        const apiKeyManagerEl = document.querySelector('[x-data="apiKeyManager()"]');
        if (apiKeyManagerEl) {
            window.apiKeyManagerInstance = apiKeyManagerEl.__x.getUnobservedData();
        }
    });
    
    // 设置键盘快捷键
    setupModalKeyboardShortcuts();
    
    // 监听打开添加模态框事件
    window.addEventListener('open-add-modal', openAddKeyModal);
}

// 暴露给外部使用的方法
window.apiKeyModals = {
    openAddKeyModal,
    openEditKeyModal,
    openDeleteConfirmModal,
    closeAllModals,
    initModals
};

// 注册初始化函数
document.addEventListener('DOMContentLoaded', () => {
    initModals();
});