@extends('install.app')

@section('content')
<div class="text-center" id="migrate-container">
    <h4 class="mb-4">Estructurando la Base de Datos</h4>
    
    <div class="my-5">
        <div class="spinner-border text-primary" role="status" style="width: 3rem; height: 3rem;" id="loader">
            <span class="visually-hidden">Cargando...</span>
        </div>
        <p class="mt-3 text-muted" id="status-text">Creando tablas y cargando configuraciones iniciales. Esto puede tardar unos segundos...</p>
    </div>
</div>

@endsection

@push('scripts')
<script>
document.addEventListener('DOMContentLoaded', function() {
    fetch("{{ route('install.migrate.run') }}", {
        method: 'POST',
        headers: {
            'X-CSRF-TOKEN': '{{ csrf_token() }}',
            'Accept': 'application/json'
        }
    })
    .then(response => response.json())
    .then(data => {
        if(data.success) {
            document.getElementById('loader').classList.remove('spinner-border', 'text-primary');
            document.getElementById('loader').innerHTML = '<i class="fa-solid fa-circle-check text-success" style="font-size: 3rem;"></i>';
            document.getElementById('status-text').innerText = 'Base de datos estructurada con éxito.';
            
            setTimeout(() => {
                window.location.href = "{{ route('install.admin') }}";
            }, 1500);
        } else {
            Swal.fire('Error', 'No se pudo migrar: ' + data.message, 'error');
            document.getElementById('loader').classList.remove('spinner-border', 'text-primary');
            document.getElementById('loader').innerHTML = '<i class="fa-solid fa-circle-xmark text-danger" style="font-size: 3rem;"></i>';
        }
    })
    .catch(err => {
        Swal.fire('Error', 'Hubo un error de red al intentar migrar.', 'error');
    });
});
</script>
@endpush