📅 Calculadora de Plan de Pago para Deudas con Interés Simple Mensual [es].

A veces, las ideas más simples pueden convertirse en proyectos interesantes. Mi esposa me pidió ayuda para calcular los pagos mensuales de una deuda con interés, y eso me llevó a crear una herramienta web que facilita el proceso.

Inicialmente, comenzamos con un Excel básico para llevar el control de los pagos y el interés mensual. Sin embargo, el proceso de actualización manual se volvió tedioso y decidí llevarlo al siguiente nivel: una calculadora web interactiva y dinámica.

💻 Tecnologías Utilizadas

• HTML y Tailwind CSS: Para la estructura y el diseño visual.
• JavaScript (sin frameworks): Todo el comportamiento se manejó con JavaScript puro.
• Nginx + Docker: Para servir la aplicación de forma eficiente y mantener una estructura organizada.
• html2pdf.js: Para exportar los resultados en PDF.
• Excel Export: Implementación manual del exportador a CSV manteniendo los formatos numéricos.

🛠️ Funcionalidades Clave

1. Entrada de Datos:
   • Capital Inicial
   • Tasa de Interés Mensual (%)
   • Pago Mensual o Número de Meses (se elige uno de los dos).
2. Cálculo Automático:
   • Mientras se ingresan los valores, el plan de pago se genera automáticamente, eliminando el botón de "Generar".
3. Restricción de Cuotas:
   • Se muestra un máximo de 100 cuotas.
   • Si el pago mensual es insuficiente para reducir el capital, el sistema muestra ∞.
4. Formato Numérico Dinámico:
   • Los inputs de capital y pago mensual mantienen el formato monetario en todo momento (1,234.56).
5. Exportación a PDF y Excel:
   • La tabla generada puede descargarse en ambos formatos, manteniendo el formato numérico adecuado.

📝 Fragmentos de Código Interesantes

1. Formato Numérico Dinámico:

function formatToCurrency(input) {
  let value = input.value.replace(/[^0-9]/g, "");
  if (!value) {
    input.value = "0.00";
    return;
  }
  value = (parseInt(value, 10) / 100).toFixed(2);
  input.value = new Intl.NumberFormat("en-US", { minimumFractionDigits: 2, maximumFractionDigits: 2 }).format(value);
}

2. Cálculo Automático del Plan de Pagos:

function generatePlan() {
  const capital = parseFloat(document.getElementById("capital").value.replace(/,/g, ""));
  const interestRate = parseFloat(document.getElementById("interest").value) / 100;
  const payment = parseFloat(document.getElementById("payment").value.replace(/,/g, ""));
  let balance = capital;
  let month = 1;
  let planData = [];

  while (balance > 0 && month <= 100) {
    const interest = balance * interestRate;
    const paymentToCapital = Math.min(payment - interest, balance);
    balance -= paymentToCapital;

    planData.push({
      month,
      payment: payment.toFixed(2),
      interest: interest.toFixed(2),
      capital: paymentToCapital.toFixed(2),
      balance: balance.toFixed(2),
    });

    month++;
  }

  renderPlanTable(planData);
}

3. Exportación a PDF:

function downloadPDF() {
  const planContainer = document.getElementById("plan-container");
  if (!planContainer.innerHTML.trim()) return;

  const options = {
    margin: 10,
    filename: 'plan_de_pago.pdf',
    html2canvas: { scale: 2 },
    jsPDF: { unit: 'mm', format: 'a4', orientation: 'portrait' }
  };

  html2pdf().set(options).from(planContainer).save();
}

✅ Resultado Final

Ahora, mi esposa tiene una herramienta sencilla para calcular sus pagos mensuales, y yo tengo un proyecto interesante que eventualmente podría expandirse para más funcionalidades. Un buen ejercicio de JavaScript puro, manejo de eventos y optimización en el frontend.

Si quieres probarlo, lo encuentras aquí: payplan.yanez.life