{% extends "base.html" %}
{% block title %}Главная - Aigenis Trading Tool Pro - Торговая платформа{% endblock %}
{% block content %}
    <div class="card">
        <h2 class="card-title"><i class="fas fa-handshake"></i> Добро пожаловать!</h2>
    </div>
    
    <div class="card text-center">
        <h2 class="card-title card-title-centered">
            <i class="fas fa-chart-line" style="color: var(--success-color);"></i> 
            Aigenis Trading Tool Pro - Торговая платформа
        </h2>
        <p style="font-size: 1.2rem; margin-bottom: 25px; color: var(--text-secondary);">
            Готовы к автоматизированной торговле?
        </p>
        <a href="{{ url_for('aig_trading_robot') }}" class="btn btn-primary btn-block">
            <i class="fas fa-rocket"></i> Перейти к торговой платформе
        </a>
    </div>
    
    <div class="card">
        <h3 class="card-title"><i class="fas fa-link"></i> Быстрые ссылки</h3>
        <div class="feature-grid">
            <div class="feature-card">
                <i class="fas fa-calculator" style="font-size: 1.5rem; color: var(--primary-color); margin-bottom: 10px;"></i>
                <h4 style="margin-bottom: 10px; color: var(--text-primary);">Recalc Qlimit</h4>
                <p style="color: var(--text-secondary); font-size: 0.9rem; margin-bottom: 15px;">Перерасчет лимитов</p>
                <button class="feature-btn" onclick="executeAction('recalc')">
                    <i class="fas fa-cogs"></i> Выполнить
                </button>
            </div>
            
            <div class="feature-card">
                <i class="fas fa-history" style="font-size: 1.5rem; color: var(--success-color); margin-bottom: 10px;"></i>
                <h4 style="margin-bottom: 10px; color: var(--text-primary);">Deals history</h4>
                <p style="color: var(--text-secondary); font-size: 0.9rem; margin-bottom: 15px;">История сделок</p>
                <button class="feature-btn" onclick="executeAction('history')">
                    <i class="fas fa-search"></i> Просмотр
                </button>
            </div>
            
            <div class="feature-card">
                <i class="fas fa-sync" style="font-size: 1.5rem; color: var(--danger-color); margin-bottom: 10px;"></i>
                <h4 style="margin-bottom: 10px; color: var(--text-primary);">Reload QdealLIB</h4>
                <p style="color: var(--text-secondary); font-size: 0.9rem; margin-bottom: 15px;">Перезагрузка библиотеки</p>
                <button class="feature-btn" onclick="executeAction('reload')">
                    <i class="fas fa-redo"></i> Обновить
                </button>
            </div>
            
            <div class="feature-card">
                <i class="fas fa-cog" style="font-size: 1.5rem; color: var(--warning-color); margin-bottom: 10px;"></i>
                <h4 style="margin-bottom: 10px; color: var(--text-primary);">Setup Kval\Test</h4>
                <p style="color: var(--text-secondary); font-size: 0.9rem; margin-bottom: 15px;">Настройка тестирования</p>
                <button class="feature-btn" onclick="executeAction('setup')">
                    <i class="fas fa-wrench"></i> Настроить
                </button>
            </div>
            
            <!-- Новый ярлык "Клиентский портфель" -->
            <div class="feature-card">
                <i class="fas fa-chart-pie" style="font-size: 1.5rem; color: var(--info-color); margin-bottom: 10px;"></i>
                <h4 style="margin-bottom: 10px; color: var(--text-primary);">Клиентский портфель</h4>
                <p style="color: var(--text-secondary); font-size: 0.9rem; margin-bottom: 15px;">Анализ позиций клиентов</p>
                <a href="{{ url_for('client_portfolio') }}" class="btn btn-primary" style="padding: 8px 15px; font-size: 0.9rem;">
                    <i class="fas fa-chart-bar"></i> Открыть
                </a>
            </div>
        </div>
    </div>
    
    <script>
        function executeAction(action) {
            // Показываем индикатор загрузки
            const buttons = document.querySelectorAll('.feature-btn');
            buttons.forEach(btn => {
                btn.disabled = true;
                const originalText = btn.innerHTML;
                btn.innerHTML = '<i class="fas fa-spinner fa-spin"></i> Выполняется...';
                btn.setAttribute('data-original', originalText);
            });
            
            // Имитация выполнения действия
            setTimeout(() => {
                // Восстанавливаем кнопки
                buttons.forEach(btn => {
                    btn.disabled = false;
                    btn.innerHTML = btn.getAttribute('data-original');
                });
                
                // Показываем сообщение об успехе
                showMessage(`Операция "${getActionName(action)}" выполнена успешно!`, 'success');
            }, 2000);
        }
        
        function getActionName(action) {
            const actions = {
                'recalc': 'Перерасчет лимитов',
                'history': 'Просмотр истории',
                'reload': 'Перезагрузка библиотеки',
                'setup': 'Настройка тестирования'
            };
            return actions[action] || action;
        }
        
        function showMessage(message, type = 'info') {
            // Создаем элемент уведомления
            const notification = document.createElement('div');
            notification.style.cssText = `
                position: fixed;
                top: 20px;
                right: 20px;
                padding: 15px 20px;
                border-radius: 8px;
                color: white;
                font-weight: 500;
                z-index: 1000;
                box-shadow: 0 4px 12px rgba(0,0,0,0.15);
                transform: translateX(100%);
                transition: transform 0.3s ease;
                background: ${type === 'success' ? '#27ae60' : type === 'error' ? '#e74c3c' : '#3498db'};
            `;
            notification.textContent = message;
            
            document.body.appendChild(notification);
            
            // Анимация появления
            setTimeout(() => {
                notification.style.transform = 'translateX(0)';
            }, 100);
            
            // Автоматическое удаление через 3 секунды
            setTimeout(() => {
                notification.style.transform = 'translateX(100%)';
                setTimeout(() => {
                    document.body.removeChild(notification);
                }, 300);
            }, 3000);
        }
    </script>
{% endblock %}