<?php
// ===== MISMA RUTA QUE USA EL DASHBOARD =====
include('conexion.php');

// Verificar conexión
if (!$conexion) {
    die("❌ Error de conexión: " . mysqli_connect_error());
}

// Obtener parámetros de filtro
$search = isset($_GET['search']) ? mysqli_real_escape_string($conexion, $_GET['search']) : '';
$filter = isset($_GET['filter']) ? mysqli_real_escape_string($conexion, $_GET['filter']) : '';

// Obtener mensajes de éxito y error
$success = isset($_GET['success']) ? $_GET['success'] : '';
$error = isset($_GET['error']) ? $_GET['error'] : '';

// Construir consulta con filtros
$sql = "SELECT * FROM usuarios WHERE 1=1";
if(!empty($search)){
    $sql .= " AND (nombre LIKE '%$search%' OR email LIKE '%$search%')";
}
if(!empty($filter)){
    $sql .= " AND edad = '$filter'";
}
$sql .= " ORDER BY id DESC";
$resultado = mysqli_query($conexion, $sql);

if (!$resultado) {
    die("❌ Error en la consulta: " . mysqli_error($conexion));
}

$total_registros = mysqli_num_rows($resultado);

// Obtener edades para el filtro
$edades_sql = "SELECT DISTINCT edad FROM usuarios ORDER BY edad";
$edades_result = mysqli_query($conexion, $edades_sql);
?>

<!-- CONTENIDO DE listar.php -->
<div class="d-flex justify-content-between align-items-center mb-4">
    <h2><i class="fas fa-users me-2 text-primary"></i>Gestión de Usuarios</h2>
    <div>
        <a href="usuarios/nuevo.php" class="btn btn-primary me-2">
            <i class="fas fa-plus me-1"></i> Nuevo Usuario
        </a>
        <a href="menu.php" class="btn btn-secondary">
            <i class="fas fa-arrow-left me-1"></i> Volver
        </a>
    </div>
</div>

<!-- ===== MENSAJES DE ÉXITO ===== -->
<?php if($success == 'creado'): ?>
<div class="alert alert-success alert-dismissible fade show" role="alert">
    <i class="fas fa-check-circle me-2"></i>
    ✅ Usuario creado correctamente.
    <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
</div>
<?php endif; ?>

<?php if($success == 'actualizado'): ?>
<div class="alert alert-success alert-dismissible fade show" role="alert">
    <i class="fas fa-check-circle me-2"></i>
    ✅ Usuario actualizado correctamente.
    <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
</div>
<?php endif; ?>

<?php if($success == 'eliminado'): ?>
<div class="alert alert-success alert-dismissible fade show" role="alert">
    <i class="fas fa-check-circle me-2"></i>
    ✅ Usuario eliminado correctamente.
    <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
</div>
<?php endif; ?>

<!-- ===== MENSAJES DE ERROR ===== -->
<?php if($error == 'email_existente'): ?>
<div class="alert alert-danger alert-dismissible fade show" role="alert">
    <i class="fas fa-exclamation-circle me-2"></i>
    El correo electrónico ya está registrado.
    <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
</div>
<?php endif; ?>

<?php if($error == 'campos_vacios'): ?>
<div class="alert alert-danger alert-dismissible fade show" role="alert">
    <i class="fas fa-exclamation-circle me-2"></i>
    Por favor, completa todos los campos del formulario.
    <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
</div>
<?php endif; ?>

<?php if($error == 'email_invalido'): ?>
<div class="alert alert-danger alert-dismissible fade show" role="alert">
    <i class="fas fa-exclamation-circle me-2"></i>
    El correo electrónico no es válido.
    <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
</div>
<?php endif; ?>

<?php if($error == 'error_creacion'): ?>
<div class="alert alert-danger alert-dismissible fade show" role="alert">
    <i class="fas fa-exclamation-circle me-2"></i>
    Error al crear el usuario. Intenta nuevamente.
    <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
</div>
<?php endif; ?>

<?php if($error == 'no_autodelete'): ?>
<div class="alert alert-danger alert-dismissible fade show" role="alert">
    <i class="fas fa-exclamation-circle me-2"></i>
    No puedes eliminar tu propia cuenta.
    <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
</div>
<?php endif; ?>

<?php if($error == 'usuario_no_encontrado'): ?>
<div class="alert alert-danger alert-dismissible fade show" role="alert">
    <i class="fas fa-exclamation-circle me-2"></i>
    El usuario no existe.
    <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
</div>
<?php endif; ?>

<?php if($error == 'error_eliminacion'): ?>
<div class="alert alert-danger alert-dismissible fade show" role="alert">
    <i class="fas fa-exclamation-circle me-2"></i>
    Error al eliminar el usuario. Intenta nuevamente.
    <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
</div>
<?php endif; ?>

<?php if($error == 'error_actualizacion'): ?>
<div class="alert alert-danger alert-dismissible fade show" role="alert">
    <i class="fas fa-exclamation-circle me-2"></i>
    Error al actualizar el usuario. Intenta nuevamente.
    <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
</div>
<?php endif; ?>

<?php if($error == 'id_invalido'): ?>
<div class="alert alert-danger alert-dismissible fade show" role="alert">
    <i class="fas fa-exclamation-circle me-2"></i>
    ID de usuario inválido.
    <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
</div>
<?php endif; ?>

<!-- Filtros y Búsqueda -->
<div class="table-container mb-4">
    <form method="GET" action="menu.php" id="filterForm" class="row g-3">
        <!-- Campo oculto para mantener la página -->
        <input type="hidden" name="page" value="usuarios">
        
        <div class="col-md-4">
            <div class="input-group">
                <span class="input-group-text bg-white border-end-0">
                    <i class="fas fa-search text-muted"></i>
                </span>
                <input type="text" name="search" class="form-control search-box"
                    placeholder="Buscar por nombre o email..."
                    value="<?php echo htmlspecialchars($search); ?>">
            </div>
        </div>
        <div class="col-md-3">
            <select name="filter" class="form-select filter-select" onchange="this.form.submit()">
                <option value="">Todas las edades</option>
                <?php while($edad = mysqli_fetch_assoc($edades_result)): ?>
                <option value="<?php echo $edad['edad']; ?>"
                    <?php echo $filter == $edad['edad'] ? 'selected' : ''; ?>>
                    Edad: <?php echo $edad['edad']; ?> años
                </option>
                <?php endwhile; ?>
            </select>
        </div>
        <div class="col-md-2">
            <button type="submit" class="btn btn-primary w-100">
                <i class="fas fa-filter me-1"></i> Filtrar
            </button>
        </div>
        <div class="col-md-3 text-end">
            <?php if(!empty($search) || !empty($filter)): ?>
            <a href="menu.php?page=usuarios" class="btn btn-outline-secondary">
                <i class="fas fa-times me-1"></i> Limpiar filtros
            </a>
            <?php endif; ?>
            <button type="button" class="btn btn-pdf" id="exportPdf">
                <i class="fas fa-file-pdf me-1"></i> Exportar PDF
            </button>
        </div>
    </form>

    <?php if(!empty($search) || !empty($filter)): ?>
    <div class="mt-3">
        <span class="badge-filter">
            <i class="fas fa-filter"></i> Filtros activos
            <?php if(!empty($search)): ?>
            <span class="badge bg-secondary">Buscar: <?php echo htmlspecialchars($search); ?></span>
            <?php endif; ?>
            <?php if(!empty($filter)): ?>
            <span class="badge bg-secondary">Edad: <?php echo htmlspecialchars($filter); ?> años</span>
            <?php endif; ?>
            <a href="menu.php?page=usuarios" class="remove-filter">
                <i class="fas fa-times-circle"></i>
            </a>
        </span>
        <span class="text-muted ms-2">
            <i class="fas fa-info-circle"></i>
            <?php echo $total_registros; ?> registro(s) encontrado(s)
        </span>
    </div>
    <?php endif; ?>
</div>

<!-- Tabla de Usuarios -->
<div class="table-container">
    <?php if($total_registros > 0): ?>
    <div class="table-responsive">
        <table class="table table-hover align-middle" id="tablaUsuarios">
            <thead>
                <tr>
                    <th>ID</th>
                    <th>Nombre</th>
                    <th>Email</th>
                    <th>Edad</th>
                    <th>Estado</th>
                    <th class="text-center">Acciones</th>
                </tr>
            </thead>
            <tbody>
                <?php while($fila = mysqli_fetch_assoc($resultado)): ?>
                <tr>
                    <td><span class="badge bg-secondary">#<?php echo $fila['id']; ?></span></td>
                    <td>
                        <div class="d-flex align-items-center">
                            <div class="avatar-sm me-2">
                                <i class="fas fa-user text-secondary"></i>
                            </div>
                            <strong><?php echo htmlspecialchars($fila['nombre']); ?></strong>
                        </div>
                    </td>
                    <td><i class="fas fa-envelope me-1 text-muted"></i> <?php echo htmlspecialchars($fila['email']); ?></td>
                    <td>
                        <span class="badge bg-info text-dark">
                            <i class="fas fa-calendar me-1"></i> <?php echo $fila['edad']; ?> años
                        </span>
                    </td>
                    <td>
                        <span class="badge bg-success badge-status">
                            <i class="fas fa-check-circle me-1"></i> Activo
                        </span>
                    </td>
                    <td class="text-center action-buttons">
                        <a href="usuarios/editar.php?id=<?php echo $fila['id']; ?>"
                            class="btn btn-edit btn-sm" title="Editar">
                            <i class="fas fa-edit"></i>
                        </a>
                        <a href="usuarios/eliminar.php?id=<?php echo $fila['id']; ?>"
                            class="btn btn-delete btn-sm"
                            onclick="return confirm('¿Estás seguro de eliminar este usuario?')"
                            title="Eliminar">
                            <i class="fas fa-trash-alt"></i>
                        </a>
                    </td>
                </tr>
                <?php endwhile; ?>
            </tbody>
        </table>
    </div>
    <?php else: ?>
    <div class="empty-state">
        <i class="fas fa-users-slash"></i>
        <h5>No se encontraron usuarios</h5>
        <p class="text-muted">Prueba ajustando los filtros de búsqueda</p>
        <a href="usuarios/nuevo.php" class="btn btn-primary mt-2">
            <i class="fas fa-plus me-1"></i> Crear nuevo usuario
        </a>
    </div>
    <?php endif; ?>
</div>

<script>
$(document).ready(function() {
    // Inicializar DataTable
    $('#tablaUsuarios').DataTable({
        language: {
            url: '//cdn.datatables.net/plug-ins/1.13.6/i18n/es-ES.json'
        },
        pageLength: 10,
        lengthMenu: [[5, 10, 25, 50, -1], [5, 10, 25, 50, "Todos"]],
        dom: '<"d-flex justify-content-between"lf>tip'
    });

    // Exportar a PDF
    $('#exportPdf').click(function() {
        // Obtener datos directamente de la tabla HTML
        var rows = [];
        $('#tablaUsuarios tbody tr').each(function() {
            var row = $(this);
            var id = row.find('td:eq(0)').text().trim().replace('#', '');
            var nombre = row.find('td:eq(1)').text().trim();
            var email = row.find('td:eq(2)').text().trim();
            var edad = row.find('td:eq(3)').text().trim().replace('años', '').trim();
            var estado = row.find('td:eq(4)').text().trim() || 'Activo';
            rows.push([id, nombre, email, edad, estado]);
        });

        if(rows.length === 0) {
            alert('No hay datos para exportar');
            return;
        }

        // Verificar que jsPDF existe
        if (typeof window.jspdf === 'undefined') {
            alert('Error: jsPDF no está cargado. Por favor, recarga la página.');
            return;
        }

        const { jsPDF } = window.jspdf;
        const doc = new jsPDF({
            orientation: 'landscape',
            unit: 'mm',
            format: 'a4'
        });

        doc.setFontSize(16);
        doc.setTextColor(0, 40, 85);
        doc.text('Lista de Usuarios - Sistema Web', 14, 20);

        doc.setFontSize(10);
        doc.setTextColor(100);
        doc.text('Fecha de exportación: ' + new Date().toLocaleString(), 14, 27);

        let filtros = [];
        <?php if(!empty($search)): ?>
        filtros.push('Búsqueda: <?php echo addslashes($search); ?>');
        <?php endif; ?>
        <?php if(!empty($filter)): ?>
        filtros.push('Edad: <?php echo addslashes($filter); ?> años');
        <?php endif; ?>
        if(filtros.length > 0) {
            doc.setFontSize(9);
            doc.text('Filtros: ' + filtros.join(' | '), 14, 33);
        }

        var headers = ['ID', 'Nombre', 'Email', 'Edad', 'Estado'];
        
        doc.autoTable({
            head: [headers],
            body: rows,
            startY: 37,
            theme: 'grid',
            headStyles: {
                fillColor: [0, 40, 85],
                textColor: [255, 255, 255],
                fontSize: 10,
                halign: 'center'
            },
            bodyStyles: {
                fontSize: 9
            },
            columnStyles: {
                0: { cellWidth: 20, halign: 'center' },
                1: { cellWidth: 60 },
                2: { cellWidth: 70 },
                3: { cellWidth: 30, halign: 'center' },
                4: { cellWidth: 30, halign: 'center' }
            },
            margin: { left: 14, right: 14 }
        });

        var pageCount = doc.internal.getNumberOfPages();
        for (var i = 1; i <= pageCount; i++) {
            doc.setPage(i);
            doc.setFontSize(8);
            doc.setTextColor(150);
            doc.text('Sistema Web - Página ' + i + ' de ' + pageCount, 14, doc.internal.pageSize.height - 10);
        }

        doc.save('usuarios_' + new Date().toISOString().slice(0,10) + '.pdf');
    });
});
</script>