/**
 * Función para mostrar la modal de editar el empleado
 */
async function editarEmpleado(idEmpleado) {
  try {
    // Ocultar la modal si está abierta
    const existingModal = document.getElementById("editarEmpleadoModal");
    if (existingModal) {
      const modal = bootstrap.Modal.getInstance(existingModal);
      if (modal) {
        modal.hide();
      }
      existingModal.remove(); // Eliminar la modal existente
    }

    const response = await fetch("modales/modalEditar.php");
    if (!response.ok) {
      throw new Error("Error al cargar la modal de editar el empleado");
    }
    const modalHTML = await response.text();

    // Crear un elemento div para almacenar el contenido de la modal
    const modalContainer = document.createElement("div");
    modalContainer.innerHTML = modalHTML;

    // Agregar la modal al documento actual
    document.body.appendChild(modalContainer);

    // Mostrar la modal
    const myModal = new bootstrap.Modal(
      modalContainer.querySelector("#editarEmpleadoModal")
    );
    myModal.show();

    await cargarDatosEmpleadoEditar(idEmpleado);
  } catch (error) {
    console.error(error);
  }
}

/**
 * Función para cargar la información del empleado seleccionado en la modal de edición.
 */
async function cargarDatosEmpleadoEditar(idEmpleado) {
  try {
    const response = await axios.get(`acciones/detallesEmpleado.php?id=${idEmpleado}`);
    
    if (response.status === 200) {
      const { id, nombre, edad, cedula, sexo, telefono, tipousuario, usuario, correo, cant_trabajos, contrasena, Idioma, areas, activo, avatar } = response.data;
      console.log(id, nombre, edad, cedula, sexo, telefono,  tipousuario, usuario, correo, cant_trabajos, contrasena, Idioma, areas, activo, avatar);

      try { document.querySelector("#idempleado").value = id; } 
      catch (error) { console.error("Error en campo 'id':", error); }

      try { document.querySelector("#nombre").value = nombre; } 
      catch (error) { console.error("Error en campo 'nombre':", error); }

      try { document.querySelector("#edad").value = edad; } 
      catch (error) { console.error("Error en campo 'edad':", error); }

      try { document.querySelector("#cedula").value = cedula; } 
      catch (error) { console.error("Error en campo 'cedula':", error); }

      try { document.querySelector("#telefono").value = telefono; } 
      catch (error) { console.error("Error en campo 'telefono':", error); }

      try { document.querySelector("#correo").value = correo; } 
      catch (error) { console.error("Error en campo 'correo':", error); }

      try { document.querySelector("#cant_trabajos").value = cant_trabajos; } 
      catch (error) { console.error("Error en campo 'cant_trabajos':", error); }
      
      try { document.querySelector("#usuario").value = usuario; } 
      catch (error) { console.error("Error en campo 'usuario':", error); }

      try { document.querySelector("#contrasena").value = contrasena; } 
      catch (error) { console.error("Error en campo 'contrasena':", error); }

      // Seleccionar el estado (activo/inactivo)
      try {
        const activoField = document.querySelector(`input[name="activo"][value="${activo}"]`);
        if (activoField) {
          activoField.checked = true; // Marca el radio correspondiente
        } else {
          console.error("El campo 'activo' no se encontró en el DOM.");
        }
      } catch (error) { 
        console.error("Error en campo 'activo':", error); 
      }

      // Seleccionar el sexo
      try { seleccionarSexo(sexo); } 
      catch (error) { console.error("Error en función 'seleccionarSexo':", error); }

      // Seleccionar el tipo de usuario
      try { seleccionarTipoUsuario(tipousuario); } 
      catch (error) { console.error("Error en función 'seleccionarTipoUsuario':", error); }
      
      // Seleccionar el idioma
      try { seleccionarIdioma(Idioma); } 
      catch (error) { console.error("Error en función 'seleccionarIdioma':", error); }
      
      // Seleccionar el Area
      try { seleccionarAreas(areas); } 
      catch (error) { console.error("Error en función 'seleccionarAreas':", error); }

      // Asignar la imagen del avatar
      try {
        const elementAvatar = document.querySelector("#avatar");
        elementAvatar.src = avatar ? `acciones/fotos_empleados/${avatar}` : "assets/imgs/sin-foto.jpg";
      } catch (error) {
        console.error("Error en campo 'avatar':", error);
      }
      
    } else {
      console.log("Error al cargar el empleado a editar");
    }
  } catch (error) {
    console.error("Error al cargar los detalles del empleado", error);
  }
}



/**
 * Función para seleccionar el sexo del empleado de acuedo al sexo actual
 */
function seleccionarSexo(sexoEmpleado) {
  // Obtener los elementos de radio para "Masculino" y "Femenino"
  const radioMasculino = document.querySelector("#sexo_m");
  const radioFemenino = document.querySelector("#sexo_f");

  // Verificar el valor del sexo del empleado y establecer el atributo checked en el radio correspondiente
  if (sexoEmpleado === "Masculino") {
    radioMasculino.checked = true;
  } else if (sexoEmpleado === "Femenino") {
    radioFemenino.checked = true;
  }
}

/**
 * Función para seleccionar el tipo de usuario del empleado de acuedo al tipo de usuario actual
 */
function seleccionarTipoUsuario(tipousuarioEmpleado) {
    const selectTipoUsuario = document.querySelector("#tipousuario");
    selectTipoUsuario.value = tipousuarioEmpleado; // Asegúrate de que 'tipousuarioEmpleado' contenga el valor correcto
}

/**
 * Función para seleccionar el idioma del usuario 
 */
function seleccionarIdioma(IdiomaEmpleado) {
  const selectIdioma = document.querySelector("#Idioma");
  selectIdioma.value = IdiomaEmpleado;
}


/**
 * Función para seleccionar el area del usuario
 */
function seleccionarAreas(areasEmpleado) {
  const selectAreas = document.querySelector("#areas");
  selectAreas.value = areasEmpleado;
}

async function actualizarEmpleado(event) {
  try {
    event.preventDefault();

    const formulario = document.querySelector("#formularioEmpleadoEdit");
    // Crear un objeto FormData para enviar los datos del formulario
    const formData = new FormData(formulario);
    const idempleado = formData.get("id");

    // Enviar los datos del formulario al backend usando Axios
    const response = await axios.post("acciones/updateEmpleado.php", formData);

    // Verificar la respuesta del backend
    if (response.status === 200) {
      console.log("Empleado actualizado exitosamente");

      // Llamar a la función para actualizar la tabla de empleados
      window.actualizarEmpleadoEdit(idempleado);

      //Llamar a la función para mostrar un mensaje de éxito
      if (window.toastrOptions) {
        toastr.options = window.toastrOptions;
        toastr.success("¡El empleado se actualizo correctamente!.");
      }

      setTimeout(() => {
        $("#editarEmpleadoModal").css("opacity", "");
        $("#editarEmpleadoModal").modal("hide");
      }, 600);
    } else {
      console.error("Error al actualizar el empleado");
    }
  } catch (error) {
    console.error("Error al enviar el formulario", error);
  }
}
