define(['jquery', 'bootstrap', 'backend', 'addtabs', 'table', 'echarts', 'echarts-theme', 'template'], function ($, undefined, Backend, Datatable, Table, Echarts, undefined, Template) {

    var Controller = {
        index: function () {
            function showTab(tabName) {
                // Hide all tab contents
                const tabContents = document.querySelectorAll('.tab-content');
                tabContents.forEach(content => {
                    content.classList.remove('active');
                });

                // Remove active class from all tabs
                const navTabs = document.querySelectorAll('.nav-tab');
                navTabs.forEach(tab => {
                    tab.classList.remove('active');
                });

                // Show selected tab content
                document.getElementById(tabName).classList.add('active');

                // Add active class to corresponding nav tab
                const activeTab = document.querySelector(`.nav-tab[onclick="showTab('${tabName}')"]`);
                if (activeTab) {
                    activeTab.classList.add('active');
                }
            }

            // Add click animations to cards
            document.querySelectorAll('.car-card').forEach(card => {
                card.addEventListener('click', function() {
                    this.style.transform = 'scale(0.95)';
                    setTimeout(() => {
                        this.style.transform = '';
                    }, 150);
                });
            });

            // Add hover effect to action buttons
            document.querySelectorAll('.action-btn').forEach(btn => {
                btn.addEventListener('click', function() {
                    const originalText = this.textContent;
                    this.textContent = '✓ 已点击';
                    this.style.background = 'linear-gradient(135deg, #48bb78 0%, #38a169 100%)';

                    setTimeout(() => {
                        this.textContent = originalText;
                        this.style.background = 'linear-gradient(135deg, #667eea 0%, #764ba2 100%)';
                    }, 1000);
                });
            });

            // Simulate real-time updates
            setInterval(() => {
                const statNumbers = document.querySelectorAll('.stat-number');
                statNumbers.forEach(num => {
                    if (num.textContent.includes('¥')) return;
                    const currentValue = parseInt(num.textContent);
                    if (Math.random() > 0.7) {
                        num.textContent = currentValue + Math.floor(Math.random() * 3);
                        num.style.color = '#48bb78';
                        setTimeout(() => {
                            num.style.color = '#2d3748';
                        }, 1000);
                    }
                });
            }, 5000);
        }
    };

    return Controller;
});