@extends('admin.admin_master')

@section('admin')
<div class="container-fluid">
    <div class="row">
        <div class="col-12">
            <div class="page-title-box">
                <h4 class="page-title">Importación Segura desde Stock Manager</h4>
                <ol class="breadcrumb m-0">
                    <li class="breadcrumb-item"><a href="{{ route('dashboard') }}">Tablero</a></li>
                    <li class="breadcrumb-item active">Importación Segura</li>
                </ol>
            </div>
        </div>
    </div>

    <!-- Estado del Sistema -->
    <div class="row mb-3">
        <div class="col-12">
            <div class="alert alert-warning">
                <h5><i class="ri-shield-check-line"></i> Sistema de Protección Activo</h5>
                <ul class="mb-0">
                    <li>✅ <strong>Clientes, Proveedores y Marcas</strong>: Importación completa permitida</li>
                    <li>⚠️ <strong>Productos</strong>: SOLO actualización de precios y stock</li>
                    <li>🔒 <strong>Categorías y Subcategorías</strong>: Estructura protegida (no se modificará)</li>
                </ul>
            </div>
        </div>
    </div>

    <!-- Cards de Estado -->
    <div class="row" id="statusCards">
        <div class="col-md-3">
            <div class="card">
                <div class="card-body">
                    <h5 class="card-title">Clientes</h5>
                    <div class="d-flex justify-content-between">
                        <div>
                            <p class="mb-0">Stock Manager: <span id="sm-customers">-</span></p>
                            <p class="mb-0">Sistema Local: <span id="local-customers">-</span></p>
                        </div>
                        <button class="btn btn-sm btn-success" onclick="importEntity('customers')">
                            <i class="ri-download-line"></i> Importar
                        </button>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-md-3">
            <div class="card">
                <div class="card-body">
                    <h5 class="card-title">Proveedores</h5>
                    <div class="d-flex justify-content-between">
                        <div>
                            <p class="mb-0">Stock Manager: <span id="sm-suppliers">-</span></p>
                            <p class="mb-0">Sistema Local: <span id="local-suppliers">-</span></p>
                        </div>
                        <button class="btn btn-sm btn-success" onclick="importEntity('suppliers')">
                            <i class="ri-download-line"></i> Importar
                        </button>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-md-3">
            <div class="card">
                <div class="card-body">
                    <h5 class="card-title">Marcas</h5>
                    <div class="d-flex justify-content-between">
                        <div>
                            <p class="mb-0">Stock Manager: <span id="sm-brands">-</span></p>
                            <p class="mb-0">Sistema Local: <span id="local-brands">-</span></p>
                        </div>
                        <button class="btn btn-sm btn-success" onclick="importEntity('brands')">
                            <i class="ri-download-line"></i> Importar
                        </button>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-md-3">
            <div class="card">
                <div class="card-body">
                    <h5 class="card-title">Productos (Solo Precios)</h5>
                    <div class="d-flex justify-content-between">
                        <div>
                            <p class="mb-0">Stock Manager: <span id="sm-products">-</span></p>
                            <p class="mb-0">Sistema Local: <span id="local-products">-</span></p>
                        </div>
                        <button class="btn btn-sm btn-warning" onclick="updatePrices()">
                            <i class="ri-refresh-line"></i> Actualizar
                        </button>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <!-- Estructura Protegida -->
    <div class="row mt-3">
        <div class="col-md-6">
            <div class="card bg-light">
                <div class="card-body">
                    <h5 class="card-title">🔒 Estructura Protegida</h5>
                    <table class="table table-sm">
                        <tr>
                            <td>Categorías:</td>
                            <td><strong id="local-categories">-</strong> (BELLEZ, HIGIEN, HOGAR, LIMPIE)</td>
                        </tr>
                        <tr>
                            <td>Subcategorías:</td>
                            <td><strong id="local-subcategories">-</strong> con códigos de 6 caracteres</td>
                        </tr>
                    </table>
                </div>
            </div>
        </div>

        <div class="col-md-6">
            <div class="card">
                <div class="card-body">
                    <h5 class="card-title">Acciones Rápidas</h5>
                    <button class="btn btn-primary btn-block mb-2" onclick="checkStatus()">
                        <i class="ri-information-line"></i> Verificar Estado
                    </button>
                    <button class="btn btn-success btn-block mb-2" onclick="safeImportAll()">
                        <i class="ri-download-line"></i> Importación Completa Segura
                    </button>
                    <button class="btn btn-warning btn-block" onclick="updatePrices()">
                        <i class="ri-money-dollar-circle-line"></i> Solo Actualizar Precios
                    </button>
                </div>
            </div>
        </div>
    </div>

    <!-- Log de Importación -->
    <div class="row mt-3">
        <div class="col-12">
            <div class="card">
                <div class="card-body">
                    <h5 class="card-title">Log de Importación</h5>
                    <div id="importLog" style="max-height: 300px; overflow-y: auto;">
                        <p class="text-muted">Esperando acciones...</p>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<script>
// Verificar estado al cargar
document.addEventListener('DOMContentLoaded', function() {
    checkStatus();
});

function checkStatus() {
    fetch('/admin/import/status')
        .then(response => response.json())
        .then(data => {
            if (data.success) {
                // Stock Manager
                document.getElementById('sm-customers').textContent = data.status.stock_manager.customers;
                document.getElementById('sm-suppliers').textContent = data.status.stock_manager.suppliers;
                document.getElementById('sm-brands').textContent = data.status.stock_manager.brands;
                document.getElementById('sm-products').textContent = data.status.stock_manager.products;
                
                // Sistema Local
                document.getElementById('local-customers').textContent = data.status.sistema_local.customers;
                document.getElementById('local-suppliers').textContent = data.status.sistema_local.suppliers;
                document.getElementById('local-brands').textContent = data.status.sistema_local.brands;
                document.getElementById('local-products').textContent = data.status.sistema_local.products;
                document.getElementById('local-categories').textContent = data.status.sistema_local.categories;
                document.getElementById('local-subcategories').textContent = data.status.sistema_local.subcategories;
                
                addLog('Estado verificado correctamente', 'info');
            }
        })
        .catch(error => {
            addLog('Error verificando estado: ' + error, 'danger');
        });
}

function importEntity(entity) {
    const btn = event.target;
    btn.disabled = true;
    btn.innerHTML = '<i class="ri-loader-line fa-spin"></i> Importando...';
    
    fetch(`/admin/import/${entity}`, {
        method: 'POST',
        headers: {
            'X-CSRF-TOKEN': document.querySelector('meta[name="csrf-token"]').content,
            'Content-Type': 'application/json'
        }
    })
    .then(response => response.json())
    .then(data => {
        if (data.success) {
            addLog(`${entity}: Importados ${data.imported}, Actualizados ${data.updated}`, 'success');
            checkStatus(); // Actualizar contadores
        } else {
            addLog(`Error importando ${entity}: ${data.message}`, 'danger');
        }
    })
    .finally(() => {
        btn.disabled = false;
        btn.innerHTML = '<i class="ri-download-line"></i> Importar';
    });
}

function updatePrices() {
    if (!confirm('¿Actualizar solo precios y stock de productos existentes?')) return;
    
    const btn = event.target;
    btn.disabled = true;
    btn.innerHTML = '<i class="ri-loader-line fa-spin"></i> Actualizando...';
    
    fetch('/admin/import/update-prices', {
        method: 'POST',
        headers: {
            'X-CSRF-TOKEN': document.querySelector('meta[name="csrf-token"]').content
        }
    })
    .then(response => response.json())
    .then(data => {
        if (data.success) {
            addLog(`Precios actualizados: ${data.updated} productos`, 'warning');
            if (data.not_found > 0) {
                addLog(`Productos no encontrados: ${data.not_found}`, 'info');
            }
        }
    })
    .finally(() => {
        btn.disabled = false;
        btn.innerHTML = '<i class="ri-refresh-line"></i> Actualizar';
    });
}

function safeImportAll() {
    if (!confirm('¿Realizar importación completa segura?\n\n- Clientes, Proveedores y Marcas: Importación completa\n- Productos: Solo actualización de precios')) return;
    
    const btn = event.target;
    btn.disabled = true;
    btn.innerHTML = '<i class="ri-loader-line fa-spin"></i> Importando...';
    
    fetch('/admin/import/safe-import-all', {
        method: 'POST',
        headers: {
            'X-CSRF-TOKEN': document.querySelector('meta[name="csrf-token"]').content
        }
    })
    .then(response => response.json())
    .then(data => {
        if (data.success) {
            addLog('=== IMPORTACIÓN COMPLETA EXITOSA ===', 'success');
            
            // Mostrar resultados
            for (let entity in data.results) {
                const result = data.results[entity];
                if (result.success) {
                    addLog(`${entity}: ${result.message}`, 'success');
                }
            }
            
            checkStatus();
        }
    })
    .finally(() => {
        btn.disabled = false;
        btn.innerHTML = '<i class="ri-download-line"></i> Importación Completa Segura';
    });
}

function addLog(message, type = 'info') {
    const logDiv = document.getElementById('importLog');
    const time = new Date().toLocaleTimeString();
    const alertClass = `alert-${type}`;
    
    const logEntry = `
        <div class="alert ${alertClass} py-1 mb-1">
            <small>[${time}] ${message}</small>
        </div>
    `;
    
    if (logDiv.children[0].classList.contains('text-muted')) {
        logDiv.innerHTML = '';
    }
    
    logDiv.insertAdjacentHTML('afterbegin', logEntry);
    
    // Limitar a 20 entradas
    while (logDiv.children.length > 20) {
        logDiv.removeChild(logDiv.lastChild);
    }
}
</script>
@endsection