static/js/api-key-manager/ui-utils.js

/**
 * API密钥管理器 - UI工具模块
 * 包含各种UI交互辅助功能
 */

// 复制到剪贴板
function copyToClipboard(text, id) {
    // 使用临时textarea元素复制文本
    const textarea = document.createElement('textarea');
    textarea.value = text;
    textarea.style.position = 'fixed';
    document.body.appendChild(textarea);
    textarea.select();
    
    try {
        document.execCommand('copy');
        this.copiedId = id;
        
        // 使用SweetAlert2显示复制成功动画
        const Toast = Swal.mixin({
            toast: true,
            position: 'top-end',
            showConfirmButton: false,
            timer: 1500,
            timerProgressBar: true,
            didOpen: (toast) => {
                toast.onmouseenter = Swal.stopTimer;
                toast.onmouseleave = Swal.resumeTimer;
            }
        });
        
        Toast.fire({
            icon: 'success',
            title: '已复制到剪贴板',
            background: '#f0fdf4',
            iconColor: '#16a34a'
        });
        
        // 2秒后重置复制状态
        setTimeout(() => {
            this.copiedId = null;
        }, 2000);
    } catch (err) {
        console.error('复制失败:', err);
        Swal.fire({
            icon: 'error',
            title: '复制失败',
            text: '请手动复制内容',
            confirmButtonColor: '#0284c7'
        });
    } finally {
        document.body.removeChild(textarea);
    }
}

// 显示通知
function showNotification(message, type = 'info') {
    const event = new CustomEvent('show-notification', {
        detail: { message, type }
    });
    window.dispatchEvent(event);
}

// 获取总API密钥数量
function totalKeyCount() {
    // 根据当前视图过滤密钥
    if (this.currentView === 'valid') {
        return this.apiKeys.filter(key => key.success === true).length;
    } else if (this.currentView === 'invalid') {
        return this.apiKeys.filter(key => key.success === false).length;
    }
    return this.apiKeys.length;
}

// 搜索匹配
function matchesSearch(name, key, notes) {
    if (!this.searchTerm) return true;
    
    const searchLower = this.searchTerm.toLowerCase();
    return (
        (name && name.toLowerCase().includes(searchLower)) ||
        (key && key.toLowerCase().includes(searchLower))
    );
}