<?php
require_once 'db_config.php';
session_start();

if (!isset($_SESSION['usuario_id'])) {
    header("Location: index.php");
    exit;
}
?>
<!DOCTYPE html>
<html lang="pt-BR">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Importar Backup - Carteira PRO</title>
    <script src="https://cdn.tailwindcss.com"></script>
    <link rel="stylesheet" href="../css/global.css">
    <link rel="stylesheet" href="../css/layout.css">
    <style>
        @keyframes slideUp {
            from { opacity: 0; transform: translateY(20px); }
            to { opacity: 1; transform: translateY(0); }
        }
        .animate-slide-up { animation: slideUp 0.6s ease-out forwards; }
    </style>
</head>
<body>
    <div class="app-container">
        <!-- Sidebar -->
        <?php require_once 'menu.php'; ?>

        <!-- Main Content -->
        <main class="main-content">
            <div class="topbar animate-slide-up">
                <div class="flex items-center gap-4">
                    <button id="menu-toggle" class="lg:hidden text-gray-500 hover:text-blue-500">☰</button>
                    <h2 class="text-xl font-bold text-gray-800 m-0">📥 Importar Backup</h2>
                </div>
            </div>
            <div class="content-wrapper">
        <div class="bg-white rounded-2xl shadow-md border border-gray-100 p-6 max-w-2xl animate-slide-up">
            <p class="text-gray-600 mb-6">Selecione seu arquivo de backup JSON para restaurar todos os dados da carteira.</p>

            <div id="alert-container"></div>

            <div class="form-group">
                <label class="form-label">Selecione o arquivo JSON do backup</label>
                <input 
                    type="file" 
                    id="backup-file" 
                    accept=".json" 
                    class="form-control cursor-pointer"
                    required
                >
                <p class="text-xs text-gray-500 mt-2">📄 Arquivo: backup_carteira_YYYY-MM-DD.json</p>
            </div>

            <div id="preview-container" class="hidden mb-6 p-4 bg-blue-50 rounded-xl border border-blue-200">
                <h3 class="font-bold text-gray-800 mb-3">📊 Prévia do que será importado:</h3>
                <div class="space-y-2 text-sm">
                    <p><span class="font-semibold">Ativos:</span> <span id="preview-ativos" class="text-blue-600">0</span></p>
                    <p><span class="font-semibold">Opções Abertas:</span> <span id="preview-abertas" class="text-green-600">0</span></p>
                    <p><span class="font-semibold">Histórico:</span> <span id="preview-historico" class="text-purple-600">0</span></p>
                </div>
            </div>

            <button 
                onclick="importarBackup()" 
                id="btn-importar"
                class="btn btn-primary w-full justify-center mt-6"
                disabled
            >
                ✓ Importar Dados
            </button>

            <a href="dashboard.php" class="block text-center mt-4 text-blue-500 hover:text-blue-700 font-medium text-sm">
                ← Voltar ao Dashboard
            </a>
        </div>
    </div>

    <script src="../javascript/api_client.js"></script>
    <script>
        let arquivoSelecionado = null;

        document.getElementById('backup-file').addEventListener('change', function(e) {
            const file = e.target.files[0];
            if (!file) return;

            const reader = new FileReader();
            reader.onload = function(event) {
                try {
                    arquivoSelecionado = JSON.parse(event.target.result);
                    
                    // Mostrar prévia
                    document.getElementById('preview-ativos').textContent = (arquivoSelecionado.stocks?.length || 0);
                    document.getElementById('preview-abertas').textContent = (arquivoSelecionado.open?.length || 0);
                    document.getElementById('preview-historico').textContent = (arquivoSelecionado.history?.length || 0);
                    document.getElementById('preview-container').classList.remove('hidden');
                    
                    // Habilitar botão
                    document.getElementById('btn-importar').disabled = false;
                    
                    Alertas.sucesso('Arquivo carregado com sucesso!');
                } catch (error) {
                    Alertas.erro('Erro ao ler o arquivo JSON: ' + error.message);
                    arquivoSelecionado = null;
                    document.getElementById('btn-importar').disabled = true;
                }
            };
            reader.readAsText(file);
        });

        async function importarBackup() {
            if (!arquivoSelecionado) {
                Alertas.aviso('Selecione um arquivo JSON primeiro');
                return;
            }

            // Desabilitar botão durante importação
            const btn = document.getElementById('btn-importar');
            const textOriginal = btn.textContent;
            btn.disabled = true;
            btn.textContent = '⏳ Importando...';

            try {
                const response = await ApiClient.post('api_importar_backup.php', arquivoSelecionado);
                
                if (response.status === 'success') {
                    Alertas.sucesso(response.message);
                    
                    // Mostrar resumo
                    const resumo = response.resumo;
                    setTimeout(() => {
                        alert(`✅ Importação Concluída!\n\n📊 Resumo:\n- Ativos: ${resumo.ativos_importados}\n- Opções Abertas: ${resumo.operacoes_abertas}\n- Histórico: ${resumo.operacoes_historico}\n\nRedirecionando para o Dashboard...`);
                        window.location.href = 'dashboard.php';
                    }, 1000);
                } else {
                    Alertas.erro(response.message);
                    btn.disabled = false;
                    btn.textContent = textOriginal;
                }
            } catch (error) {
                Alertas.erro('Erro ao importar: ' + error.message);
                btn.disabled = false;
                btn.textContent = textOriginal;
            }
        }
    </script>
</body>
</html>
