document.addEventListener('DOMContentLoaded', function () {
  const menuButtons = document.querySelectorAll('.menu-btn');
  const sections = document.querySelectorAll('.section');
  const sectionTitle = document.getElementById('section-title');

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

  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] || '';
    });
  });

  let 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 = {};

  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 ? formatearPesosSinDecimales(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);
    });
  }

  async function cargarTrabajadores() {
    try {
      const resp = await fetch(`${API_URL}/trabajadores`);
      trabajadores = await resp.json();
      renderTabla();
    } catch (err) {
      console.error('Error cargando trabajadores:', err);
    }
  }

  async 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
    };

    try {
      if (editandoId !== null) {
        await fetch(`${API_URL}/trabajadores/${editandoId}`, {
          method: 'PUT',
          headers: { 'Content-Type': 'application/json' },
          body: JSON.stringify(datos)
        });
      } else {
        await fetch(`${API_URL}/trabajadores`, {
          method: 'POST',
          headers: { 'Content-Type': 'application/json' },
          body: JSON.stringify(datos)
        });
      }
      cerrarModal();
      await cargarTrabajadores();
    } catch (err) {
      alert('Error al guardar trabajador');
      console.error(err);
    }
  }

  async function eliminarTrabajador(id) {
    if (!confirm('¿Estás seguro de eliminar este trabajador?')) return;
    try {
      await fetch(`${API_URL}/trabajadores/${id}`, { method: 'DELETE' });
      await cargarTrabajadores();
    } catch (err) {
      alert('Error al eliminar trabajador');
      console.error(err);
    }
  }

  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;

    if (chkSmv) chkSmv.checked = false;
    if (inputSalario) inputSalario.disabled = false;

    abrirModal('editar');
  }

  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;
      }
    });
  }

  cargarTrabajadores();

  // --- Módulo de Configuraciones ---
  const formConfiguraciones = document.getElementById('form-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);
      }
    }
  }

  async function cargarConfiguracion() {
    try {
      const resp = await fetch(`${API_URL}/configuracion`);
      const data = await resp.json();
      if (data && Object.keys(data).length > 0) {
        configuracionGlobal = data;
        cargarConfiguracionEnFormulario();
      }
    } catch (err) {
      console.error('Error cargando configuración:', err);
    }
  }

  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-tiempo-almuerzo').value = configuracionGlobal.tiempo_almuerzo || '';
    document.getElementById('cfg-hora-ordinaria').value = configuracionGlobal.valor_hora_ordinaria ? formatearPesosSinDecimales(configuracionGlobal.valor_hora_ordinaria) : '';
    calcularCamposDependientes();
  }

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

    const datos = {
      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: limpiarFormatoPesos(document.getElementById('cfg-horas-mensuales').value),
      dia_inicio_mes: document.getElementById('cfg-dia-inicio').value,
      dia_fin_mes: document.getElementById('cfg-dia-fin').value,
      tiempo_almuerzo: document.getElementById('cfg-tiempo-almuerzo').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)
    };

    try {
      await fetch(`${API_URL}/configuracion`, {
        method: 'POST',
        headers: { 'Content-Type': 'application/json' },
        body: JSON.stringify(datos)
      });
      await cargarConfiguracion();
      if (cfgMensaje) {
        cfgMensaje.textContent = 'Configuración guardada correctamente.';
        setTimeout(() => { cfgMensaje.textContent = ''; }, 3000);
      }
    } catch (err) {
      alert('Error al guardar configuración');
      console.error(err);
    }
  }

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

    inputHorasSemanales.addEventListener('input', calcularCamposDependientes);
    inputHoraOrdinaria.addEventListener('blur', () => {
      aplicarFormatoPesosSinDecimales(inputHoraOrdinaria);
      calcularCamposDependientes();
    });

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