Complejo_Cap1tan/js/Gestion_Usuarios.js

// Gestion de Usuarios
let usuarioEditando = null;

document.addEventListener('DOMContentLoaded', function() {
    console.log('DOM cargado - Inicializando Gestion_Usuarios.js');
    cargarUsuarios();
    
    // Escuchar el envío del formulario
    const formulario = document.getElementById('form-registrar-usuario');
    if (formulario) {
        formulario.addEventListener('submit', function(e) {
            e.preventDefault();
            console.log('Formulario enviado');
            if (usuarioEditando) {
                actualizarUsuario();
            } else {
                registrarUsuario();
            }
        });
    } else {
        console.error('No se encontró el formulario con ID form-registrar-usuario');
    }

    const btnCancelar = document.getElementById('btn-cancelar-edicion');
    btnCancelar.addEventListener('click', cancelarEdicion);
});

function cargarUsuarios() {
    console.log('Cargando usuarios...');
    
    fetch('../php/Obtener_Usuarios.php')
        .then(response => {
            console.log('Respuesta status:', response.status);
            if (!response.ok) {
                throw new Error('Error HTTP: ' + response.status);
            }
            return response.json();
        })
        .then(data => {
            console.log('Datos recibidos:', data);
            
            if (data.success) {
                const tbody = document.querySelector('#tabla-usuarios tbody');
                tbody.innerHTML = '';
                
                if (data.usuarios.length === 0) {
                    tbody.innerHTML = '<tr><td colspan="7" style="text-align: center;">No hay usuarios registrados</td></tr>';
                    return;
                }
                
                data.usuarios.forEach(usuario => {
                    const row = document.createElement('tr');
                    row.dataset.user = JSON.stringify(usuario);
                    row.dataset.userId = usuario.ID_Usuario;
                    const esSupremo = usuario.ID_Usuario === 1;
                    const botonEliminar = esSupremo
                        ? `<button class="btn-eliminar-usuario" title="El administrador supremo no puede eliminarse" disabled>🔒</button>`
                        : `<button onclick="eliminarUsuario(${usuario.ID_Usuario})" class="btn-eliminar-usuario" title="Eliminar">🗑️</button>`;
                    row.innerHTML = `
                        <td>${usuario.Usuario}</td>
                        <td>${usuario.Nombre} ${usuario.Apellido}</td>
                        <td>${usuario.DNI}</td>
                        <td>${usuario.Rol === 'admin' ? 'Administrador' : usuario.Rol === 'cantina' ? 'Trabajador Cantina' : 'Trabajador Cancha'}</td>
                        <td>${usuario.Telefono || '-'}</td>
                        <td>${usuario.Correo || '-'}</td>
                        <td>
                            <button onclick="editarUsuario(${usuario.ID_Usuario})" class="btn-editar" title="Editar">Editar</button>
                            <button onclick="eliminarUsuario(${usuario.ID_Usuario})" class="btn-eliminar-usuario" title="Eliminar">Eliminar</button>
                        </td>
                    `;
                    tbody.appendChild(row);
                });
            } else {
                console.error('Error al cargar usuarios:', data.message);
                const tbody = document.querySelector('#tabla-usuarios tbody');
                tbody.innerHTML = '<tr><td colspan="7" style="text-align: center; color: red;">Error al cargar usuarios</td></tr>';
            }
        })
        .catch(error => {
            console.error('Error en fetch:', error);
            const tbody = document.querySelector('#tabla-usuarios tbody');
            tbody.innerHTML = '<tr><td colspan="7" style="text-align: center; color: red;">Error de conexión</td></tr>';
        });
}

function registrarUsuario() {
    const formulario = document.getElementById('form-registrar-usuario');
    const formData = new FormData(formulario);
    const contraseña = formData.get('contraseña')?.toString().trim() || '';
    const confirmarContraseña = formData.get('confirmar_contraseña')?.toString().trim() || '';
    
    // Validar que el rol esté seleccionado
    if (!formData.get('rol')) {
        alert('Por favor selecciona un rol');
        return;
    }

    if (contraseña.length < 6) {
        alert('La contraseña debe tener al menos 6 carácteres');
        return;
    }

    if (contraseña !== confirmarContraseña) {
        alert('Las contraseñas no coinciden');
        return;
    }
    
    console.log('Registrando usuario:', {
        usuario: formData.get('usuario'),
        rol: formData.get('rol'),
        nombre: formData.get('nombre')
    });
    
    fetch('../php/Guardar_Usuario.php', {
        method: 'POST',
        body: formData
    })
    .then(response => {
        console.log('Respuesta status:', response.status);
        if (!response.ok) {
            throw new Error('Error HTTP: ' + response.status);
        }
        return response.json();
    })
    .then(data => {
        console.log('Respuesta del servidor:', data);
        
        if (data.success) {
            alert('✅ Usuario registrado exitosamente');
            formulario.reset();
            cargarUsuarios();
        } else {
            alert('❌ Error: ' + (data.message || 'No se pudo registrar el usuario'));
        }
    })
    .catch(error => {
        console.error('Error en fetch:', error);
        alert('❌ Error al registrar el usuario: ' + error.message);
    });
}

function editarUsuario(id) {
    console.log('Editando usuario con ID:', id);
    
    // Buscar la fila por el ID del usuario de forma más robusta
    let row = null;
    const filas = document.querySelectorAll('#tabla-usuarios tbody tr');
    
    for (let fila of filas) {
        if (fila.dataset.userId == id) {  // Comparación flexible de tipos
            row = fila;
            break;
        }
    }
    
    if (!row || !row.dataset.user) {
        console.error('No se encontró el usuario con ID:', id);
        alert('❌ Error: No se pudo encontrar el usuario. Por favor recarga la página e intenta de nuevo.');
        return;
    }

    try {
        const usuario = JSON.parse(row.dataset.user);
        
        document.getElementById('usuario-id').value = usuario.ID_Usuario;
        document.getElementById('usuario-username').value = usuario.Usuario;
        document.getElementById('usuario-password').value = usuario.Contraseña;
        document.getElementById('usuario-password-confirm').value = usuario.Contraseña;
        document.querySelector('input[name="nombre"]').value = usuario.Nombre || '';
        document.querySelector('input[name="apellido"]').value = usuario.Apellido || '';
        document.querySelector('input[name="dni"]').value = usuario.DNI || '';
        document.querySelector('input[name="telefono"]').value = usuario.Telefono || '';
        document.querySelector('input[name="correo"]').value = usuario.Correo || '';
        document.querySelector('select[name="rol"]').value = usuario.Rol;

        usuarioEditando = id;
        document.getElementById('btn-registrar-usuario').textContent = 'Guardar Cambios';
        document.getElementById('btn-cancelar-edicion').style.display = 'inline-block';
        
        console.log('Usuario cargado para edición:', usuario.Usuario);
    } catch (error) {
        console.error('Error al parsear datos del usuario:', error);
        alert('❌ Error: Los datos del usuario están corruptos. Por favor recarga la página.');
    }
}

function cancelarEdicion() {
    usuarioEditando = null;
    document.getElementById('form-registrar-usuario').reset();
    document.getElementById('usuario-id').value = '';
    document.getElementById('btn-registrar-usuario').textContent = 'Registrar Usuario';
    document.getElementById('btn-cancelar-edicion').style.display = 'none';
}

function actualizarUsuario() {
    const formulario = document.getElementById('form-registrar-usuario');
    const formData = new FormData(formulario);
    const contraseña = formData.get('contraseña')?.toString().trim() || '';
    const confirmarContraseña = formData.get('confirmar_contraseña')?.toString().trim() || '';

    if (!usuarioEditando) {
        alert('No hay usuario seleccionado para editar');
        return;
    }

    if (contraseña.length < 6) {
        alert('La contraseña debe tener al menos 6 carácteres');
        return;
    }

    if (contraseña !== confirmarContraseña) {
        alert('Las contraseñas no coinciden');
        return;
    }

    fetch('../php/Actualizar_Usuario.php', {
        method: 'POST',
        body: formData
    })
    .then(response => {
        if (!response.ok) {
            throw new Error('Error HTTP: ' + response.status);
        }
        return response.json();
    })
    .then(data => {
        if (data.success) {
            alert('✅ Usuario actualizado exitosamente');
            cancelarEdicion();
            cargarUsuarios();
        } else {
            alert('❌ Error: ' + (data.message || 'No se pudo actualizar el usuario'));
        }
    })
    .catch(error => {
        console.error('Error en fetch:', error);
        alert('❌ Error al actualizar el usuario: ' + error.message);
    });
}

function eliminarUsuario(id) {
    if (confirm('¿Estás seguro de que deseas eliminar este usuario? Esta acción no se puede deshacer.')) {
        console.log('Eliminando usuario con ID:', id);
        
        fetch('../php/Eliminar_Usuario.php', {
            method: 'POST',
            headers: {
                'Content-Type': 'application/x-www-form-urlencoded',
            },
            body: 'id=' + id
        })
        .then(response => {
            console.log('Respuesta status:', response.status);
            if (!response.ok) {
                throw new Error('Error HTTP: ' + response.status);
            }
            return response.json();
        })
        .then(data => {
            console.log('Respuesta del servidor:', data);
            
            if (data.success) {
                alert('✅ Usuario eliminado exitosamente');
                cargarUsuarios();
            } else {
                alert('❌ Error: ' + (data.message || 'No se pudo eliminar el usuario'));
            }
        })
        .catch(error => {
            console.error('Error en fetch:', error);
            alert('❌ Error al eliminar el usuario: ' + error.message);
        });
    }
}