corrección de errores

- Cálculos de descuentos
- Grabado de localStorage para cada cotización realizada
- Botones y Modales de Sweet Alert funcionales
- Correción de color de confirmButtonColor de las instancias if

Author: cilphi

js/index.js

@@ -6,6 +6,10 @@
 // 2) Operaciones de cálculo: Volumen, Volumen Total, Peso Total, Tarifa, Descuentos, Monto final.
 // 3) Comunicación: Recolección, Validación, Tarifa, Descuentos, Monto final, Nueva cotización.
 
+/* Variables globales */
+let cotizacionesGuardadas = [];
+let contadorCotizaciones = 0;
+
 /* Datos del cotizador */
 
 /* Recolección */
@@ -117,7 +121,7 @@ function calcularCotizacion(categoriaDimensionDescuento, categoriaPesoDescuento,
         totalDescuentos = descuentoDimensionAplicado;
         montoTotal = tarifa - totalDescuentos; // Si se cumple solo con descuento por Dimensión
     } else if (descuentoPeso) {
-        totalDescuentos = categoriaDimensionDescuento;
+        totalDescuentos = descuentoPesoAplicado; // CORRECCIÓN: Aquí estaba categoriaDimensionDescuento
         montoTotal = tarifa - totalDescuentos; // Si se cumple solo con descuento por Peso
     }
     // Mostrar los resultados
@@ -128,37 +132,39 @@ function calcularCotizacion(categoriaDimensionDescuento, categoriaPesoDescuento,
 
 /* Comunicación Cotización exitosa */
 
-function comunicarResultados(largo, ancho, alto, peso,  tarifa, totalDescuentos, montoTotal, descPeso, descDimension, descuentos) {
+function comunicarResultados(largo, ancho, alto, peso, volumen, volumenTotal, pesoTotal, pesoFacturable, tarifa, descuentoDimensionAplicado, descuentoPesoAplicado, totalDescuentos, montoTotal, descDimension, descPeso) {
     const resultadosDiv = document.getElementById('cotizacionDiv');
-    // Dimension
-    const claseDimension = {
-        'grande': 'Grande (≥30cm)',
-        'medio': 'Medio (≥20cm)',
-        'pequeño': 'Pequeño (≥10cm)',
-        'muy pequeño': 'Muy Pequeño (<10cm)'
-    };
-    // Peso
-    const clasePeso = {
-        'pesado': 'Pesado (≥10kg)',
-        'liviano': 'Liviano (≥1kg)',
-        'muy liviano': 'Muy Liviano (<1kg)'
-    };
-    //Aplicar Descuentos
-    let descuentosCotizacion = '';
-    if (descDimension || descPeso) {
-        descuentosCotizacion =`
-        <div class="exito">
-            <h6><b>¡Felicidades, aplicamos tus descuentos!</b></h6>
-            <p>${descDimension ? '• Descuento por tener un tamaño muy pequeño: 5%' : ''}</p>
-            <p>${descPeso ? '• Descuento por tener un peso muy liviano: 5%' : ''}</p>
-            <p>• Total descuentos: USD$ ${descuentos.toFixed(2)}</p>
-        </div>`;
+    
+    // Evitar más de 5 cotizaciones
+    if (contadorCotizaciones >= 5) {
+        comunicarError("Has alcanzado el límite de 5 cotizaciones. Puedes enviar los datos por correo, borrar y seguir cotizando.");
+        return;
     }
-    /* Comunicar Resultados en el HTML */
-    resultadosDiv.innerHTML = `
-        <h5>Resumen de la Cotización:</h5>                
-        ${descuentosCotizacion}
-        <table class="resultado">
+    
+    contadorCotizaciones++;
+    
+    /* Guardar cotización en array */
+    const cotizacion = {
+        id: contadorCotizaciones,
+        largo,
+        ancho,
+        alto,
+        peso,
+        tarifa,
+        totalDescuentos,
+        montoTotal,
+        descDimension,
+        descPeso
+    };
+    cotizacionesGuardadas.push(cotizacion);
+    
+    // Guardar en localStorage
+    transformarDatos(cotizacion);
+    
+    // Crear o actualizar tabla
+    let tableHTML = `
+        <h5>Resumen de Cotizaciones:</h5>
+        <table id="tabla" class="resultado">
             <thead>
                 <tr>
                     <th>Medidas</th>
@@ -168,93 +174,141 @@ function comunicarResultados(largo, ancho, alto, peso,  tarifa, totalDescuentos,
                     <th>Total a pagar</th>
                 </tr>
             </thead>
-            <tbody>
+            <tbody>`;
+    
+    cotizacionesGuardadas.forEach(cot => {
+        tableHTML += `
                 <tr>
-                    <td>${largo}x${ancho}x${alto} cms</td>
-                    <td>${peso}kg</td>
-                    <td>USD$ ${tarifa.toFixed(2)}</td>
-                    <td>USD$ ${descuentos.toFixed(2)}</td>
-                    <td>USD$ ${montoTotal.toFixed(2)}</td>
-                </tr>
+                    <td>${cot.largo}x${cot.ancho}x${cot.alto} cms</td>
+                    <td>${cot.peso}kg</td>
+                    <td>USD$ ${cot.tarifa.toFixed(2)}</td>
+                    <td>USD$ ${cot.totalDescuentos.toFixed(2)}</td>
+                    <td>USD$ ${cot.montoTotal.toFixed(2)}</td>
+                </tr>`;
+    });
+    
+    tableHTML += `
             </tbody>                
-        </table>
-        <button id="guardar"> Guardar </button>
-        <button id="borrar"> Borrar </button>
-        <button id="enviar"> Enviar </button>`;            
+        </table>`;
+    
+    /* Comunicar Descuentos, si aplican */
+    let descuentosCotizacion = '';
+    if (descDimension || descPeso) {
+        descuentosCotizacion = `
+        <div class="exito">
+            <h6><b>¡Felicidades, aplicamos tus descuentos!</b></h6>
+            <p>${descDimension ? '• Descuento por tener un tamaño muy pequeño: 5%' : ''}</p>
+            <p>${descPeso ? '• Descuento por tener un peso muy liviano: 5%' : ''}</p>
+            <p>• Total descuentos: USD$ ${totalDescuentos.toFixed(2)}</p>
+        </div>`;
+    }
+    
+    resultadosDiv.innerHTML = descuentosCotizacion + tableHTML + `
+        <div>
+            <button id="enviar">Enviar</button>
+            <button id="borrar">Borrar</button>
+        </div>`;
+    
     resultadosDiv.classList.add('show');
     resultadosDiv.scrollIntoView({ behavior: 'smooth' });
-    /* Crear Array */
 
-    /* Trabajando con Librería Sweet Alert */
-    /* Guardar Array */
-    document.getElementById("guardar")
-        .addEventListener("click",()=>{
-        Swal.fire({
-        title: "¿Te gustaría guardar la cotización realizada?",
-        html: `Puedes <b>Guardar</b> hasta 5 cotizaciones`,
-        icon: "question",
-        iconColor:"#4537AD",
-        showCancelButton: true,
-        confirmButtonColor: "#41AD37",
-        cancelButtonColor: "#9B97B5",
-        confirmButtonText: "Guardar y cotizar",
-        denyButtonText: "Borrar"
-        }).then((result) => {
-            if (result.isConfirmed) {
-            Swal.fire({
-            title: "¡Datos Guardados!",
-            text: "Tus cotizaciones realizadas han sido guardadas.",
-            icon: "success",
-            iconColor:"#41AD37"
-            })
-            ;
-            }
-        });
-    });
-    /* Borrar Array */
+    // Agregar eventos a los botones
+    agregarEventosBotones();
+}
+
+/* Transformar Datos y guardar en localStorage */
+
+function transformarDatos(cotizacion) {
+    // Recuperar cotizaciones previas del localStorage
+    let cotizacionesAlmacenadas = [];
+    const datosExistentes = localStorage.getItem('Cotizaciones');
+    
+    if (datosExistentes) {
+        cotizacionesAlmacenadas = JSON.parse(datosExistentes);
+    }
+    
+    // Agregar la nueva cotización
+    cotizacionesAlmacenadas.push(cotizacion);
+    
+    // Guardar en localStorage
+    localStorage.setItem('Cotizaciones', JSON.stringify(cotizacionesAlmacenadas));
+    
+    console.info(`Cotización guardada en localStorage:`, cotizacion);
+    console.info(`Total de cotizaciones almacenadas:`, cotizacionesAlmacenadas.length);
+}
+
+/* Agregar eventos a los botones */
+
+function agregarEventosBotones() {
+    // Borrar Datos Cotizados
     document.getElementById("borrar")
-        .addEventListener("click",()=>{
+        .addEventListener("click", () => {
         Swal.fire({
-        title: "¿Te gustaría borrar toda la información?",
-        html: `Vas a <b>Borrar</b> todo lo cotizado.`,
-        icon: "warning",
-        iconColor:"#AD4537",
-        showCancelButton: true,
-        confirmButtonColor: "#AD4537",
-        cancelButtonColor: "#9B97B5",
-        confirmButtonText: "Borrar",
+            title: "¿Te gustaría borrar toda la información?",
+            html: `Vas a <b>Borrar</b> todo lo cotizado.`,
+            icon: "warning",
+            iconColor: "#AD4537",
+            showCancelButton: true,
+            confirmButtonColor: "#AD4537",
+            cancelButtonColor: "#9B97B5",
+            confirmButtonText: "Borrar",
         }).then((result) => {
             if (result.isConfirmed) {
-            Swal.fire({
-            title: "¡Datos Borrados!",
-            text: "Tus cotizaciones realizadas han sido borradas.",
-            icon: "warning",
-            iconColor:"#AD4537"
-            });
+                Swal.fire({
+                    title: "¡Datos Borrados!",
+                    text: "Tus cotizaciones realizadas han sido borradas.",
+                    icon: "warning",
+                    iconColor: "#AD4537",
+                    confirmButtonColor: "#4537AD"
+                });
+                // Lógica borrar
+                procesoBorrado();
             }
-        }); 
+        });
     });
-    /* Enviar Array */
+    
+    // Enviar Array
     document.getElementById("enviar")
         .addEventListener("click", async () => {
         const { value: email } = await Swal.fire({
-        title: "¿Te gustaría enviar la cotización realizada?",
-        html: `Puedes <b>Enviar</b> lo cotizado hasta ahora`,
-        icon: "info",
-        iconColor:"#4537AD",
-        input: "email",
-        inputLabel: "Escribe tu dirección de correo",
-        inputValue: "[email protected]",
-        showCancelButton: true,
-        confirmButtonColor: "#4537AD",
-        cancelButtonColor: "#9B97B5",
-        confirmButtonText: "Enviar"
-        });if (email) {
-        Swal.fire(`Entered email: ${email}`);
+            title: "¿Te gustaría enviar la cotización realizada?",
+            html: `Puedes <b>Enviar</b> lo cotizado hasta ahora`,
+            icon: "info",
+            iconColor: "#4537AD",
+            input: "email",
+            inputLabel: "Escribe tu dirección de correo",
+            inputValue: "[email protected]",
+            showCancelButton: true,
+            confirmButtonColor: "#4537AD",
+            cancelButtonColor: "#9B97B5",
+            confirmButtonText: "Enviar"
+        });
+        
+        if (email) {
+            // Aquí iría la lógica para enviar el email
+            // Por ahora solo confirmamos
+            Swal.fire({
+                title:`Email enviado a: ${email}`,
+                confirmButtonColor:"#4537AD"
+            });
+            console.log('Cotizaciones a enviar:', cotizacionesGuardadas);
         }
     });
 }
 
+/* Función para borrar */
+
+function procesoBorrado() {
+    const resultadosDiv = document.getElementById('cotizacionDiv');
+    resultadosDiv.innerHTML = '';
+    resultadosDiv.classList.remove('show');
+    cotizacionesGuardadas = [];
+    contadorCotizaciones = 0;
+    localStorage.removeItem('Cotizaciones');
+    // Limpiar también el formulario
+    document.getElementById('cotizacionForm').reset();
+}
+
 /* Comunicación Cotización Rechazada */
 
 function comunicarRechazo(dimensionMaxima, peso) {
@@ -275,53 +329,16 @@ function comunicarRechazo(dimensionMaxima, peso) {
 /* Comunicar Error en el HTML */
 
 function comunicarError(mensaje) {
-    const resultadosDiv = document.getElementById('cotizacionDiv');
-    resultadosDiv.innerHTML = `
-        <div class="error">
-            ${mensaje}
-        </div>`;
-    resultadosDiv.classList.add('show');
-    resultadosDiv.scrollIntoView({ behavior: 'smooth' });
-}
-
-
-
-// Limpiar los resultados cuando el usuario modifica un input
-            document.querySelectorAll('input[type="number"]').forEach(input => {
-            input.addEventListener('input', function borrarDatos() {
-            document.getElementById('cotizacionDiv').classList.remove('show');
-            });
-            });        
-
-
-
-/* Transformar Datos */
-
-function transformarDatos (largo, ancho, alto, peso, montoTotal){
-    const procesandoDatos = {
-                medidas: [{
-                    largo: `${largo}`,
-                    ancho: `${ancho}`,
-                    alto: `${alto}`,
-                    peso: `${peso}`,
-                    peso: `${montoTotal.toFixed(2)}`
-                }]
-            };
-            // Convertimos el objeto carrito en una cadena JSON y lo almacenamos
-            localStorage.setItem('Cotizacion', JSON.stringify(procesandoDatos));
-
-            // Recuperamos la cadena JSON del almacenamiento y la convertimos de nuevo a un objeto JavaScript
-            const cotizacionAlmacenada = JSON.parse(localStorage.getItem('Cotizacion'));
-
-            // Ahora podemos acceder y manipular los datos del carrito como un objeto JavaScript
-            console.log(`Esta es la información almacenada:`, cotizacionAlmacenada);
-            
-            console.info(`Estamos procesando la cotización:`);
-            console.info(`Medidas: ${largo} x ${ancho} x ${alto} cms`);
-            console.info(`Peso: ${peso} kg`);
+    Swal.fire({
+        icon: "error",
+        iconColor: "#AD4537",
+        title: "¡Llegaste al límite!",
+        text: mensaje,
+        footer: '<p>Sigue usando nuestro cotizador</p>',
+        confirmButtonColor: "#4537AD"
+    });
 }
 
-
 /* Remoción de Nodos */
 //elementos que aún no se incorporan al cotizador