Source: vistas/vistaconvenios.js

import { Vista } from './vista.js'

/**
 Vista correspondiente al listado de convenios de la aplicación dualex.
 Sirve para dar de listar todos los convenios.
 **/
export class VistaConvenios extends Vista {
  /**
   Constructor de la clase.
   @param {Object} controlador Controlador de la vista principal.
   @param {Node} base Nodo al que se añadirá la vista principal.
   **/
  constructor (controlador, base) {
    super(controlador)
    this.base = base
    // Cogemos la referencia de la tabla de la interfaz
    this.tablaConvenios = this.base.getElementsByTagName('table')[0]
  }

  /**
   * Carga los convenios en la tabla del listado.
   */
  cargarDatosConvenios () {
    this.controlador.recibirDatosConvenios()
      .then(convenios => {
        // Limpiar contenido actual de la tabla
        this.tablaConvenios.innerHTML = ''

        if (!convenios || convenios.length === 0)
          throw new Error('No hay convenios registrados')

        // Crear encabezados
        const encabezados = document.createElement('tr')

        // Crear th
        const thTitulo = document.createElement('th')
        thTitulo.textContent = 'Título'

        const thFechaFirma = document.createElement('th')
        thFechaFirma.textContent = 'Fecha Firma'

        const thEmpresa = document.createElement('th')
        thEmpresa.textContent = 'Empresa'

        const thCiclo = document.createElement('th')
        thCiclo.textContent = 'Ciclo'

        const thVerConvenio = document.createElement('th')
        thVerConvenio.textContent = 'Ver Convenio'

        const thModificar = document.createElement('th')
        thModificar.textContent = 'Editar'

        const thBorrar = document.createElement('th')
        thBorrar.textContent = 'Borrar'

        // Añadir celdas de th a la fila de encabezados
        encabezados.appendChild(thTitulo)
        encabezados.appendChild(thFechaFirma)
        encabezados.appendChild(thEmpresa)
        encabezados.appendChild(thCiclo)
        encabezados.appendChild(thVerConvenio)
        encabezados.appendChild(thModificar)
        encabezados.appendChild(thBorrar)

        // Añadir fila de encabezados al thead de la tabla
        const cabeceraTabla = this.tablaConvenios.createTHead()
        cabeceraTabla.appendChild(encabezados)

        // Sobre cada convenio crear fila de la tabla
        convenios.forEach(convenio => {
          const fila = document.createElement('tr')

          // Creacion de celdas
          const tituloCelda = document.createElement('td')
          tituloCelda.textContent = convenio.titulo

          const fechaFirmaCelda = document.createElement('td')
          fechaFirmaCelda.textContent = convenio.fecha_firma

          const empresaCelda = document.createElement('td')
          empresaCelda.textContent = convenio.nombreEmpresa

          const cicloCelda = document.createElement('td')
          cicloCelda.textContent = convenio.nombreCiclo

          // Crear el botón para ver el convenio
          const verConvenioCelda = document.createElement('td')
          const botonVerConvenio = document.createElement('button')
          botonVerConvenio.textContent = 'Ver Convenio'
          botonVerConvenio.className = 'boton-ver-convenios'
          // Asociar evento para visualizar el documento
          botonVerConvenio.onclick = () => this.mostrarConvenio(convenio.documento, convenio.titulo)
          verConvenioCelda.appendChild(botonVerConvenio)

          // Crear el icono para modificar el convenio
          const modificarCelda = document.createElement('td')
          const editarImg = document.createElement('img')
          editarImg.src = './iconos/edit.svg'
          editarImg.classList.add('icono', 'editar')
          editarImg.alt = 'Editar'
          editarImg.onclick = () => this.clickEditarConvenio(convenio.id) // Asociar evento para editar
          modificarCelda.appendChild(editarImg)

          // Crear el icono para borrar el convenio
          const borrarCelda = document.createElement('td')
          const borrarImg = document.createElement('img')
          borrarImg.src = './iconos/delete.svg'
          borrarImg.classList.add('icono', 'borrar')
          borrarImg.alt = 'Borrar'
          borrarImg.onclick = () => this.clickBorrarConvenio(convenio.id) // Asociar evento para borrar
          borrarCelda.appendChild(borrarImg)

          // Añadir las celdas a la fila
          fila.appendChild(tituloCelda)
          fila.appendChild(fechaFirmaCelda)
          fila.appendChild(empresaCelda)
          fila.appendChild(cicloCelda)
          fila.appendChild(verConvenioCelda)
          fila.appendChild(modificarCelda)
          fila.appendChild(borrarCelda)

          // Añadir la fila a la tabla
          this.tablaConvenios.appendChild(fila)
        })
      })
      .catch(error => {
        this.controlador.gestionarError(error)
      })
  }

  /**
   * Muestra el convenio en una nueva ventana.
   * @param documento codigo del documento almacenado en la base de datos.
   * @param titulo titulo del convenio.
   */
  mostrarConvenio (documento, titulo) {
    // El encabezado en B64 empieza con eso y hay que reemplzarlo
    const base64Data = documento.replace(/^data:application\/pdf;base64,/, '')

    // Crear un Blob a partir de los datos de documento
    const byteCharacters = atob(base64Data) // Decodificar los datos Base64
    const byteNumbers = new Array(byteCharacters.length)
    for (let i = 0; i < byteCharacters.length; i++) {
      byteNumbers[i] = byteCharacters.charCodeAt(i)
    }
    const byteArray = new Uint8Array(byteNumbers)
    const blob = new Blob([byteArray], { type: 'application/pdf' })

    // URL para el Blob
    const url = URL.createObjectURL(blob)

    // Abrir una nueva ventana y cargar el PDF en un iframe
    const newWindow = window.open()
    newWindow.document.write('<iframe src="' + url + '" width="100%" height="100%"></iframe>')
    newWindow.document.title = titulo // Titulo de la pestaña
  }

  /**
   * Maneja el evento de clic en el botón de editar un convenio.
   * @param id - {Nuber} ID del convenio a editar.
   */
  clickEditarConvenio (id) {
    this.controlador.ocultarVistas()
    this.controlador.obtenerDatosConvenioById(id)
      .catch(error => {
        console.error('Error al obtener datos de empresa:', error)
      })
  }

  /**
   * Maneja el evento de clic en el botón de borrar un convenio.
   * @param id - {Number} ID del convenio a borrar.
   */
  clickBorrarConvenio (id) {
    // Cuadro de confirmación
    const titulo = 'Confirmar borrado'
    const mensaje = '¿Realmente desea borrar este convenio?'

    this.controlador.vistaDialogo.abrir(titulo, mensaje, (confirmacion) => {
      if (confirmacion) {
        // Si el usuario confirma, proceder con las acciones de borrado
        this.controlador.borrarConvenio(id)
      }
    })
  }
}