wechat-robot/public/js/robot-dashboard.js

/**
 * 机器人管理仪表盘交互脚本
 */
document.addEventListener('DOMContentLoaded', function() {
    // 初始化机器人卡片动效
    initRobotCards();
    
    // 初始化搜索和过滤功能
    initSearchAndFilter();
    
    // 初始化刷新动效
    initRefreshAnimation();
    
    // 初始化状态统计
    updateStatusCounts();
});

/**
 * 初始化机器人卡片交互效果
 */
function initRobotCards() {
    const robotCards = document.querySelectorAll('.robot-card');
    
    robotCards.forEach(card => {
        // 添加悬停效果
        card.addEventListener('mouseenter', function() {
            this.classList.add('transform', 'scale-102');
        });
        
        card.addEventListener('mouseleave', function() {
            this.classList.remove('transform', 'scale-102');
        });
        
        // 为删除按钮添加确认对话框
        const deleteBtn = card.querySelector('.delete-robot');
        if (deleteBtn) {
            deleteBtn.addEventListener('click', async function(e) {
                e.preventDefault();
                const robotName = this.dataset.robotName || '此机器人';
                
                const confirmed = await confirmDialog(
                    `确定要删除 ${robotName} 吗？此操作不可恢复！`,
                    { type: 'danger', title: '确认删除' }
                );
                
                if (confirmed) {
                    window.location.href = this.getAttribute('href');
                }
            });
        }
    });
}

/**
 * 初始化搜索和过滤功能
 */
function initSearchAndFilter() {
    const searchInput = document.getElementById('robot-search');
    const filterButtons = document.querySelectorAll('.filter-btn');
    const robotCards = document.querySelectorAll('.robot-card');
    
    if (!searchInput) return;
    
    let currentFilter = 'all';
    
    // 搜索功能
    searchInput.addEventListener('input', function() {
        filterRobots();
    });
    
    // 过滤功能
    filterButtons.forEach(button => {
        button.addEventListener('click', function() {
            filterButtons.forEach(btn => {
                btn.classList.remove('bg-indigo-600', 'text-white');
                btn.classList.add('bg-white', 'text-gray-700', 'border', 'border-gray-300');
            });
            
            this.classList.remove('bg-white', 'text-gray-700', 'border', 'border-gray-300');
            this.classList.add('bg-indigo-600', 'text-white');
            
            currentFilter = this.dataset.filter;
            filterRobots();
        });
    });
    
    function filterRobots() {
        const searchTerm = searchInput.value.toLowerCase();
        
        robotCards.forEach(card => {
            const robotName = card.querySelector('.robot-name').textContent.toLowerCase();
            const robotStatus = card.dataset.status;
            
            const matchesSearch = robotName.includes(searchTerm);
            const matchesFilter = currentFilter === 'all' || robotStatus === currentFilter;
            
            if (matchesSearch && matchesFilter) {
                card.classList.remove('hidden');
            } else {
                card.classList.add('hidden');
            }
        });
        
        // 更新过滤后的计数
        updateFilteredCounts();
    }
    
    function updateFilteredCounts() {
        const visibleCards = document.querySelectorAll('.robot-card:not(.hidden)');
        document.getElementById('filtered-count').textContent = visibleCards.length;
    }
}

/**
 * 更新状态计数
 */
function updateStatusCounts() {
    const robotCards = document.querySelectorAll('.robot-card');
    let onlineCount = 0;
    let offlineCount = 0;
    let errorCount = 0;
    
    robotCards.forEach(card => {
        const status = card.dataset.status;
        if (status === 'online') {
            onlineCount++;
        } else if (status === 'error') {
            errorCount++;
        } else {
            offlineCount++;
        }
    });
    
    // 更新计数显示
    const onlineCounter = document.getElementById('online-count');
    const offlineCounter = document.getElementById('offline-count');
    const errorCounter = document.getElementById('error-count');
    
    if (onlineCounter) onlineCounter.textContent = onlineCount;
    if (offlineCounter) offlineCounter.textContent = offlineCount;
    if (errorCounter) errorCounter.textContent = errorCount;
}

/**
 * 初始化刷新动画
 */
function initRefreshAnimation() {
    const refreshButton = document.getElementById('refresh-dashboard');
    if (!refreshButton) return;
    
    refreshButton.addEventListener('click', function() {
        // 添加旋转动画
        const icon = this.querySelector('i');
        icon.classList.add('animate-spin');
        
        // 模拟加载延迟
        setTimeout(() => {
            window.location.reload();
        }, 500);
    });
}