// Función para evaluar el resumen
async function evaluarResumen(idResumen) {
  try {
    // Eliminar cualquier modal existente antes de cargar una nueva
    const existingModal = document.getElementById("evaluarResumenModal");
    if (existingModal) {
      const modal = bootstrap.Modal.getInstance(existingModal);
      if (modal) {
        modal.hide();
      }
      existingModal.remove();
    }

    // Cargar el HTML de la modal desde el servidor
    const response = await fetch("modales/modalEvaluar.php");
    if (!response.ok) {
      throw new Error("Error al cargar la modal de evaluar el resumen");
    }
    const modalHTML = await response.text();

    // Crear un contenedor temporal para la modal
    const modalContainer = document.createElement("div");
    modalContainer.innerHTML = modalHTML;

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

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

    // Cargar los datos del resumen para editar
    await cargarDatosResumenEvaluar(idResumen);

  } catch (error) {
    console.error("Error al evaluar el resumen:", error);
  }
}

// Función para cargar los datos del resumen
async function cargarDatosResumenEvaluar(idResumen) {
  try {
    // Solicitar datos del resumen
    const response = await axios.get(`acciones/detallesResumen.php?id=${idResumen}`);

    if (response.status === 200) {
      const {
        id,
        codigo,
        titulo,
        introduccion,
        materiales,
        resultados,
        conclusiones,
        tipo_presentacion,
        tipo_competicion,
        nombre_evaluador1, nombre_evaluador2, nombre_evaluador3,
        calificacion1_fecha, calificacion2_fecha, calificacion3_fecha,
        calificacion1_1 = 0, calificacion1_2 = 0, calificacion1_3 = 0, calificacion1_4 = 0, calificacion1_5 = 0, calificacion1_6 = 0,
        calificacion2_1 = 0, calificacion2_2 = 0, calificacion2_3 = 0, calificacion2_4 = 0, calificacion2_5 = 0, calificacion2_6 = 0,
        calificacion3_1 = 0, calificacion3_2 = 0, calificacion3_3 = 0, calificacion3_4 = 0, calificacion3_5 = 0, calificacion3_6 = 0,
      } = response.data;

      // Asignar valores generales al formulario solo si los elementos existen
      const setElementValue = (selector, value) => {
        const element = document.querySelector(selector);
        if (element) {
          element.value = value;
        } else {
          console.warn(`No se encontró el elemento con el selector ${selector}`);
        }
      };

      // Asignar los valores generales al formulario
      setElementValue("#idresumen", id);
      setElementValue("#codigo", codigo);
      setElementValue("#titulo", titulo);
      setElementValue("#introduccion", introduccion);
      setElementValue("#materiales", materiales);
      setElementValue("#resultados", resultados);
      setElementValue("#conclusiones", conclusiones);
      setElementValue("#tipo_presentacion", tipo_presentacion);
      setElementValue("#tipo_competicion", tipo_competicion);

      // Asignar nombres de los evaluadores
      document.querySelector("#nombre_evaluador1").textContent = nombre_evaluador1 || "No disponible";
      document.querySelector("#nombre_evaluador2").textContent = nombre_evaluador2 || "No disponible";
      document.querySelector("#nombre_evaluador3").textContent = nombre_evaluador3 || "No disponible";

      // Mostrar las fechas de calificación
      document.querySelector("#fecha-evaluador1").textContent = calificacion1_fecha || "No disponible";
      document.querySelector("#fecha-evaluador2").textContent = calificacion2_fecha || "No disponible";
      document.querySelector("#fecha-evaluador3").textContent = calificacion3_fecha || "No disponible";

      // Función para formatear los valores de calificación a dos dígitos
      const formatearValor = (valor) => valor < 10 ? `0${valor}` : valor.toString();

      // Asignar las calificaciones a los rangos de cada evaluador
      const asignarCalificaciones = (prefix, calificaciones) => {
        for (let i = 1; i <= 6; i++) {
          const calificacionElemento = document.querySelector(`#calificacion${prefix}_${i}`);
          const valor = calificaciones[`calificacion${prefix}_${i}`] || 0;  // Asignar 0 si no hay valor
          if (calificacionElemento) {
            calificacionElemento.value = valor;
            // Agregar el estilo a los valores
            const valorElemento = document.querySelector(`#valor${prefix}-${i}`);
            valorElemento.textContent = formatearValor(valor);
            valorElemento.classList.add('valor-calificacion');
          }
        }
      };

      // Asignar las calificaciones de los evaluadores
      asignarCalificaciones(1, {
        calificacion1_1,
        calificacion1_2,
        calificacion1_3,
        calificacion1_4,
        calificacion1_5,
        calificacion1_6
      });

      asignarCalificaciones(2, {
        calificacion2_1,
        calificacion2_2,
        calificacion2_3,
        calificacion2_4,
        calificacion2_5,
        calificacion2_6
      });

      asignarCalificaciones(3, {
        calificacion3_1,
        calificacion3_2,
        calificacion3_3,
        calificacion3_4,
        calificacion3_5,
        calificacion3_6
      });

      // Calcular el total de cada evaluador y actualizar en el DOM
      const calcularTotal = (prefix) => {
        let total = 0;
        for (let i = 1; i <= 6; i++) {
          const valor = parseInt(document.querySelector(`#calificacion${prefix}_${i}`).value);
          total += valor;
        }
        // Actualizar el total y darle el estilo
        const totalElemento = document.querySelector(`#total-evaluador${prefix}`);
        totalElemento.textContent = formatearValor(total);
        totalElemento.classList.add('total-calificacion');
      };

      // Calcular y mostrar los totales
      calcularTotal(1);
      calcularTotal(2);
      calcularTotal(3);

      // Deshabilitar el card y sus elementos de cada evaluador si las fechas son no nulas
      [1, 2, 3].forEach((evaluador) => {
        const fecha = eval(`calificacion${evaluador}_fecha`);
        if (fecha) deshabilitarCard(evaluador);
      });

      // Registrar eventos de 'input' para recalcular los totales
      for (let evaluador = 1; evaluador <= 3; evaluador++) {
        for (let i = 1; i <= 6; i++) {
          const slider = document.getElementById(`calificacion${evaluador}_${i}`);
          const valorSpan = document.getElementById(`valor${evaluador}-${i}`);

          // Actualizar el valor al mover el slider
          slider.addEventListener('input', function() {
            valorSpan.textContent = slider.value;
            actualizarTotalEvaluador(evaluador); // Actualizar total cuando se cambia el slider
          });
        }
      }

    } else {
      console.error("Error al obtener datos del resumen.");
    }
  } catch (error) {
    console.error("Error al cargar los datos del resumen:", error);
  }
}

// Función para deshabilitar un card de un evaluador
function deshabilitarCard(evaluador) {
  const card = document.querySelector(`#seccion-evaluador${evaluador}`);
  if (card) {
    card.classList.add("disabled-card");

    // Deshabilitar todos los inputs dentro del card
    const inputs = card.querySelectorAll("input, select, textarea, button");
    inputs.forEach(input => input.disabled = true);
  }
}

// Función para actualizar el total de calificación de un evaluador
function actualizarTotalEvaluador(evaluador) {
  const calificaciones = [1, 2, 3, 4, 5, 6].map(i => parseInt(document.getElementById(`calificacion${evaluador}_${i}`).value, 10));
  const total = calificaciones.reduce((acc, val) => acc + val, 0);

  document.getElementById(`total-evaluador${evaluador}`).textContent = total;
}

// Función para actualizar los valores de los sliders en tiempo real
const sliders = document.querySelectorAll('.form-range');
sliders.forEach(slider => {
    slider.addEventListener('input', function() {
        const valorSpan = document.getElementById(`valor${slider.id}`);
        valorSpan.textContent = slider.value; // Actualiza el valor mostrado junto al slider
    });
});


// Función para obtener y guardar las calificaciones
async function guardarCalificaciones(event) {
    event.preventDefault(); // Evitar el envío tradicional del formulario

    try {
        const idResumen = document.getElementById("idresumen").value;

        // Obtener las calificaciones directamente de los inputs
        const calificaciones = {
            evaluador1: {
                calificacion1_1: parseInt(document.getElementById("calificacion1_1").value, 10),
                calificacion1_2: parseInt(document.getElementById("calificacion1_2").value, 10),
                calificacion1_3: parseInt(document.getElementById("calificacion1_3").value, 10),
                calificacion1_4: parseInt(document.getElementById("calificacion1_4").value, 10),
                calificacion1_5: parseInt(document.getElementById("calificacion1_5").value, 10),
                calificacion1_6: parseInt(document.getElementById("calificacion1_6").value, 10)
            },
            evaluador2: {
                calificacion2_1: parseInt(document.getElementById("calificacion2_1").value, 10),
                calificacion2_2: parseInt(document.getElementById("calificacion2_2").value, 10),
                calificacion2_3: parseInt(document.getElementById("calificacion2_3").value, 10),
                calificacion2_4: parseInt(document.getElementById("calificacion2_4").value, 10),
                calificacion2_5: parseInt(document.getElementById("calificacion2_5").value, 10),
                calificacion2_6: parseInt(document.getElementById("calificacion2_6").value, 10)
            },
            evaluador3: {
                calificacion3_1: parseInt(document.getElementById("calificacion3_1").value, 10),
                calificacion3_2: parseInt(document.getElementById("calificacion3_2").value, 10),
                calificacion3_3: parseInt(document.getElementById("calificacion3_3").value, 10),
                calificacion3_4: parseInt(document.getElementById("calificacion3_4").value, 10),
                calificacion3_5: parseInt(document.getElementById("calificacion3_5").value, 10),
                calificacion3_6: parseInt(document.getElementById("calificacion3_6").value, 10)
            }
        };

        // Verificar estructura
        console.log("Datos a enviar:", calificaciones, "Resumen ID:", idResumen);

        // Enviar los datos al servidor
        const response = await axios.post("acciones/guardarCalificaciones.php", {
            idResumen,
            calificaciones
        }, {
            headers: {
                'Content-Type': 'application/json'
            }
        });

        if (response.status === 200) {
            console.log("Respuesta del servidor:", response.data);
            alert("Calificaciones guardadas exitosamente");
            location.reload();
        } else {
            console.error("Error al guardar las calificaciones:", response);
        }
    } catch (error) {
        console.error("Error al guardar las calificaciones:", error);
    }
}
