PROYECTO_NOMINAS/frontend/js/app.js

//// PASAR DE UN BOTON A OTRO BOTON
document.addEventListener('DOMContentLoaded', function () {
  const menuButtons = document.querySelectorAll('.menu-btn');
  const sections = document.querySelectorAll('.section');
  const sectionTitle = document.getElementById('section-title');

  const titles = {
    seguimiento: 'Seguimiento',
    trabajadores: 'Trabajadores',
    nominas: 'Nóminas',
    liquidaciones: 'Liquidaciones',
    configuraciones: 'Configuraciones',
    licencia: 'Licencia',
    historial: 'Historial'
  };

  menuButtons.forEach(button => {
    button.addEventListener('click', function () {
      const target = this.dataset.section;

      menuButtons.forEach(btn => btn.classList.remove('active'));
      this.classList.add('active');

      sections.forEach(section => section.classList.remove('active'));
      document.getElementById(target).classList.add('active');

      sectionTitle.textContent = titles[target] || '';
    });
  });

//// MODULO DE TRABAJADORES
  const trabajadores = [];
  let editandoId = null;

  const modalTrabajador = document.getElementById('modal-trabajador');
  const formTrabajador = document.getElementById('form-trabajador');
  const btnNuevoTrabajador = document.getElementById('btn-nuevo-trabajador');
  const btnCerrarModal = document.getElementById('btn-cerrar-modal-trabajador');
  const btnCancelar = document.getElementById('btn-cancelar-trabajador');
  const modalTitulo = document.getElementById('modal-titulo-trabajador');
  const tablaBody = document.querySelector('#tabla-trabajadores tbody');
  const chkSmv = document.getElementById('chk-smv');
  const inputSalario = document.getElementById('trabajador-salario');

  let configuracionGlobal = {
    id: null,
    nombre_empresa: '',
    salario_minimo: '',
    auxilio_transporte: '',
    horas_semanales: '',
    horas_mensuales: '',
    dia_inicio_mes: '',
    dia_fin_mes: '',
    valor_hora_ordinaria: '',
    valor_hora_extra: '',
    valor_hora_extra_nocturna: ''
  };

  function formatearPesos(valor) {
    const partes = Number(valor).toFixed(2).split('.');
    const entera = partes[0].replace(/\B(?=(\d{3})+(?!\d))/g, '.');
    const decimal = ',' + partes[1];
    return entera + decimal;
  }

  function formatearPesosSinDecimales(valor) {
    const numero = Number(valor);
    if (isNaN(numero)) return '';
    return numero.toFixed(0).replace(/\B(?=(\d{3})+(?!\d))/g, '.');
  }

  function limpiarFormatoPesos(valor) {
    return String(valor || '').replace(/\./g, '').replace(',', '.');
  }

  function abrirModal(modo = 'nuevo') {
    modalTrabajador.classList.remove('hidden');
    modalTitulo.textContent = modo === 'editar' ? 'Editar trabajador' : 'Nuevo trabajador';
  }

  function cerrarModal() {
    modalTrabajador.classList.add('hidden');
    formTrabajador.reset();
    document.getElementById('trabajador-id-original').value = '';
    editandoId = null;
  }

  function renderTabla() {
    tablaBody.innerHTML = '';

    if (trabajadores.length === 0) {
      tablaBody.innerHTML = '<tr><td colspan="6" class="empty">No hay trabajadores registrados.</td></tr>';
      return;
    }

    trabajadores.forEach(t => {
      const tr = document.createElement('tr');
      tr.innerHTML = `
        <td>${t.id}</td>
        <td>${t.nombre} ${t.apellidos}</td>
        <td>${t.puesto || '-'}</td>
        <td>${t.salario_mensual ? formatearPesos(Number(t.salario_mensual)) : '-'}</td>
        <td>
          <span class="badge ${t.activo == 1 ? 'badge-active' : 'badge-inactive'}">
            ${t.activo == 1 ? 'Activo' : 'Inactivo'}
          </span>
        </td>
        <td>
          <button class="btn-icon btn-editar" title="Editar">✏️</button>
          <button class="btn-icon btn-eliminar" title="Eliminar">🗑️</button>
        </td>
      `;

      tr.querySelector('.btn-editar').addEventListener('click', () => cargarEdicion(t.id));
      tr.querySelector('.btn-eliminar').addEventListener('click', () => eliminarTrabajador(t.id));

      tablaBody.appendChild(tr);
    });
  }

  function guardarTrabajador(e) {
    e.preventDefault();

    const datos = {
      id: document.getElementById('trabajador-id').value.trim(),
      nombre: document.getElementById('trabajador-nombre').value.trim(),
      apellidos: document.getElementById('trabajador-apellidos').value.trim(),
      puesto: document.getElementById('trabajador-puesto').value.trim(),
      salario_mensual: document.getElementById('trabajador-salario').value,
      fecha_ingreso: document.getElementById('trabajador-fecha').value,
      seguridad_social: document.getElementById('trabajador-seguridad').value.trim(),
      activo: document.getElementById('trabajador-activo').value
    };

    if (editandoId !== null) {
      const index = trabajadores.findIndex(t => t.id === editandoId);
      if (index !== -1) {
        trabajadores[index] = { ...datos, idOriginal: editandoId };
      }
    } else {
      const existe = trabajadores.some(t => t.id === datos.id);
      if (existe) {
        alert('Ya existe un trabajador con ese documento de identidad.');
        return;
      }
      trabajadores.push(datos);
    }

    cerrarModal();
    renderTabla();
  }

  function cargarEdicion(id) {
    const t = trabajadores.find(item => item.id === id);
    if (!t) return;

    editandoId = id;
    document.getElementById('trabajador-id-original').value = id;
    document.getElementById('trabajador-id').value = t.id;
    document.getElementById('trabajador-nombre').value = t.nombre;
    document.getElementById('trabajador-apellidos').value = t.apellidos;
    document.getElementById('trabajador-puesto').value = t.puesto;
    document.getElementById('trabajador-salario').value = t.salario_mensual;
    document.getElementById('trabajador-fecha').value = t.fecha_ingreso;
    document.getElementById('trabajador-seguridad').value = t.seguridad_social;
    document.getElementById('trabajador-activo').value = t.activo;

    abrirModal('editar');
  }

  function eliminarTrabajador(id) {
    if (!confirm('¿Estás seguro de eliminar este trabajador?')) return;
    const index = trabajadores.findIndex(t => t.id === id);
    if (index !== -1) {
      trabajadores.splice(index, 1);
      renderTabla();
    }
  }

  btnNuevoTrabajador.addEventListener('click', () => abrirModal('nuevo'));
  btnCerrarModal.addEventListener('click', cerrarModal);
  btnCancelar.addEventListener('click', cerrarModal);
  formTrabajador.addEventListener('submit', guardarTrabajador);

  if (chkSmv && inputSalario) {
    chkSmv.addEventListener('change', function () {
      if (this.checked) {
        const smv = configuracionGlobal.salario_minimo;
        if (!smv) {
          alert('No hay un salario mínimo configurado. Ve a Configuraciones y guárdalo primero.');
          this.checked = false;
          return;
        }
        inputSalario.value = smv;
        inputSalario.disabled = true;
      } else {
        inputSalario.disabled = false;
      }
    });
  }

  renderTabla();

  // --- Módulo de Configuraciones ---
  const formConfiguraciones = document.getElementById('form-configuraciones');
  const btnGuardarConfiguraciones = document.getElementById('btn-guardar-configuraciones');
  const cfgMensaje = document.getElementById('cfg-mensaje');

  const camposPesosSinDecimales = [
    'cfg-salario-minimo',
    'cfg-auxilio-transporte',
    'cfg-hora-ordinaria'
  ];

  const inputHorasSemanales = document.getElementById('cfg-horas-semanales');
  const inputHorasMensuales = document.getElementById('cfg-horas-mensuales');
  const inputHoraOrdinaria = document.getElementById('cfg-hora-ordinaria');
  const inputHoraExtra = document.getElementById('cfg-hora-extra');
  const inputHoraExtraNocturna = document.getElementById('cfg-hora-extra-nocturna');

  function aplicarFormatoPesosSinDecimales(input) {
    const limpio = limpiarFormatoPesos(input.value);
    const numero = Number(limpio);
    input.value = isNaN(numero) ? '' : formatearPesosSinDecimales(numero);
  }

  function calcularCamposDependientes() {
    const horasSemanales = Number(inputHorasSemanales.value);
    if (!isNaN(horasSemanales) && inputHorasMensuales) {
      inputHorasMensuales.value = (horasSemanales * 5).toFixed(0).replace(/\B(?=(\d{3})+(?!\d))/g, '.');
    }

    const horaOrdinaria = Number(limpiarFormatoPesos(inputHoraOrdinaria.value));
    if (!isNaN(horaOrdinaria)) {
      if (inputHoraExtra) {
        inputHoraExtra.value = formatearPesosSinDecimales(horaOrdinaria * 1.25);
      }
      if (inputHoraExtraNocturna) {
        inputHoraExtraNocturna.value = formatearPesosSinDecimales(horaOrdinaria * 1.75);
      }
    }
  }

  function cargarConfiguracionEnFormulario() {
    document.getElementById('cfg-nombre-empresa').value = configuracionGlobal.nombre_empresa;
    document.getElementById('cfg-salario-minimo').value = configuracionGlobal.salario_minimo ? formatearPesosSinDecimales(configuracionGlobal.salario_minimo) : '';
    document.getElementById('cfg-auxilio-transporte').value = configuracionGlobal.auxilio_transporte ? formatearPesosSinDecimales(configuracionGlobal.auxilio_transporte) : '';
    document.getElementById('cfg-horas-semanales').value = configuracionGlobal.horas_semanales;
    document.getElementById('cfg-horas-mensuales').value = configuracionGlobal.horas_mensuales;
    document.getElementById('cfg-dia-inicio').value = configuracionGlobal.dia_inicio_mes;
    document.getElementById('cfg-dia-fin').value = configuracionGlobal.dia_fin_mes;
    document.getElementById('cfg-hora-ordinaria').value = configuracionGlobal.valor_hora_ordinaria ? formatearPesosSinDecimales(configuracionGlobal.valor_hora_ordinaria) : '';
    calcularCamposDependientes();
  }

  function guardarConfiguracion(e) {
    e.preventDefault();

    configuracionGlobal = {
      id: configuracionGlobal.id || 1,
      nombre_empresa: document.getElementById('cfg-nombre-empresa').value.trim(),
      salario_minimo: limpiarFormatoPesos(document.getElementById('cfg-salario-minimo').value),
      auxilio_transporte: limpiarFormatoPesos(document.getElementById('cfg-auxilio-transporte').value),
      horas_semanales: document.getElementById('cfg-horas-semanales').value,
      horas_mensuales: document.getElementById('cfg-horas-mensuales').value,
      dia_inicio_mes: document.getElementById('cfg-dia-inicio').value,
      dia_fin_mes: document.getElementById('cfg-dia-fin').value,
      valor_hora_ordinaria: limpiarFormatoPesos(document.getElementById('cfg-hora-ordinaria').value),
      valor_hora_extra: limpiarFormatoPesos(document.getElementById('cfg-hora-extra').value),
      valor_hora_extra_nocturna: limpiarFormatoPesos(document.getElementById('cfg-hora-extra-nocturna').value)
    };

    cargarConfiguracionEnFormulario();

    if (cfgMensaje) {
      cfgMensaje.textContent = 'Configuración guardada correctamente.';
      setTimeout(() => { cfgMensaje.textContent = ''; }, 3000);
    }
  }

  if (formConfiguraciones) {
    camposPesosSinDecimales.forEach(id => {
      const input = document.getElementById(id);
      if (input) {
        input.addEventListener('blur', () => aplicarFormatoPesosSinDecimales(input));
      }
    });

    inputHorasSemanales.addEventListener('input', calcularCamposDependientes);
    inputHoraOrdinaria.addEventListener('blur', function () {
      aplicarFormatoPesosSinDecimales(this);
      calcularCamposDependientes();
    });

    formConfiguraciones.addEventListener('submit', guardarConfiguracion);
    cargarConfiguracionEnFormulario();
  }
});