Update script.js

script.js

@@ -1,7 +1,7 @@
 const app = document.getElementById('app');
 let mesas = [];
 
-// Generar UI
+// Función de renderizado principal
 function render() {
     app.innerHTML = '';
 
@@ -59,6 +59,7 @@ function render() {
     app.appendChild(mesasContainer);
 }
 
+// Función para gestionar los pedidos de una mesa
 function gestionarMesa(index) {
     const mesa = mesas[index];
     app.innerHTML = '';
@@ -104,7 +105,6 @@ function gestionarMesa(index) {
                 `;
                 opcionesContainer.appendChild(opcionDiv);
 
-                // Añadir los controladores de cantidad
                 const cantidadControl = opcionDiv.querySelector('.cantidad-controls');
                 const cantidadSpan = cantidadControl.querySelector('.cantidad');
                 
@@ -164,35 +164,37 @@ function gestionarMesa(index) {
     finalizarButton.className = 'finalize-button';
     finalizarButton.onclick = () => {
         const total = mesa.pedidos.reduce((sum, p) => sum + p.precio * p.cantidad, 0);
-        app.innerHTML = `
-            <h2>Total de la cuenta: €${total.toFixed(2)}</h2>
-            <button onclick="generarTicket(${index}, ${total})">Generar Ticket</button>
-        `;
+        if (total > 0) {
+            app.innerHTML = `
+                <h2>Total de la cuenta: €${total.toFixed(2)}</h2>
+                <button onclick="generarTicket(${index}, ${total})">Generar Ticket</button>
+            `;
+        } else {
+            alert("No hay productos añadidos a esta mesa.");
+            render();
+        }
     };
     app.appendChild(finalizarButton);
 }
 
+// Generación del QR y ticket
 function generarTicket(index, total) {
     const mesa = mesas[index];
-    const ticketContent = `Mesa ${mesa.numero}\n${mesa.pedidos.map(p => `${p.item} (${p.opcion}) x${p.cantidad} - €${(p.precio * p.cantidad).toFixed(2)}`).join('\n')}\nTotal: €${total.toFixed(2)}`;
-
-    const qrCodeContainer = document.createElement('div');
-    qrCodeContainer.id = 'qrcode';
-    app.appendChild(qrCodeContainer);
+    const qrContent = `Mesa ${mesa.numero} Total: €${total.toFixed(2)}\n`;
+    mesa.pedidos.forEach(pedido => {
+        qrContent += `${pedido.item} (${pedido.opcion || ''}) x${pedido.cantidad} - €${(pedido.precio * pedido.cantidad).toFixed(2)}\n`;
+    });
 
-    const qrCode = new QRCode(qrCodeContainer, {
-        text: ticketContent,
+    new QRCode(document.getElementById('qrcode'), {
+        text: qrContent,
         width: 256,
         height: 256,
+        colorDark: "#000000",
+        colorLight: "#ffffff",
+        correctLevel: QRCode.CorrectLevel.H
     });
+}
 
-    const volverButton = document.createElement('button');
-    volverButton.textContent = '← Volver';
-    volverButton.className = 'back-button';
-    volverButton.onclick = () => render();
-    app.appendChild(volverButton);
+render();
 
-    // Eliminar la mesa después de generar el ticket
-    mesas.splice(index, 1);
-}