Delete script.js

script.js

@@ -1,264 +0,0 @@
-const app = document.getElementById('app');
-let mesas = [];
-
-// Generar UI
-function render() {
-  app.innerHTML = '';
-
-  const addButton = document.createElement('button');
-  addButton.className = 'btn btn-success btn-block';
-  addButton.textContent = '+ Añadir Mesa';
-  addButton.onclick = () => {
-    let mesaNumero = 1;
-    if (mesas.length > 0) {
-      mesaNumero = mesas[mesas.length - 1].numero + 1;
-    }
-    const mesaInput = document.createElement('div');
-    mesaInput.className = 'mesa-input';
-    mesaInput.innerHTML = `
-        <div class="mesa-controls">
-          <button class="btn btn-outline-secondary decrease-mesa">-</button>
-          <span class="mesa-number">${mesaNumero}</span>
-          <button class="btn btn-outline-secondary increase-mesa">+</button>
-        </div>
-        <button class="btn btn-primary confirm-mesa">Confirmar</button>
-      `;
-    app.innerHTML = '';
-    app.appendChild(mesaInput);
-
-    mesaInput.querySelector('.decrease-mesa').onclick = (event) => {
-      event.stopPropagation();
-      if (mesaNumero > 1) {
-        mesaNumero--;
-        mesaInput.querySelector('.mesa-number').textContent = mesaNumero;
-      }
-    };
-
-    mesaInput.querySelector('.increase-mesa').onclick = (event) => {
-      event.stopPropagation();
-      mesaNumero++;
-      mesaInput.querySelector('.mesa-number').textContent = mesaNumero;
-    };
-
-    mesaInput.querySelector('.confirm-mesa').onclick = (event) => {
-      event.stopPropagation();
-      mesas.push({ numero: mesaNumero, pedidos: [] });
-      render();
-    };
-  };
-  app.appendChild(addButton);
-
-  const mesasContainer = document.createElement('div');
-  mesasContainer.className = 'mesas-container';
-
-  mesas.forEach((mesa, index) => {
-    const mesaDiv = document.createElement('div');
-    mesaDiv.className = 'mesa-card';
-    mesaDiv.innerHTML = `
-        <div class="mesa-card-body">
-          <h5 class="mesa-title">Mesa ${mesa.numero}</h5>
-          <button class="btn btn-danger btn-sm delete-mesa">Eliminar</button>
-        </div>
-      `;
-    mesaDiv.style.cursor = 'pointer';
-    mesaDiv.onclick = () => gestionarMesa(index);
-
-    mesaDiv.querySelector('.delete-mesa').onclick = (event) => {
-      event.stopPropagation();
-      if (confirm(`¿Estás seguro de que quieres eliminar la Mesa ${mesa.numero}?`)) {
-        mesas.splice(index, 1);
-        render();
-      }
-    };
-
-    mesasContainer.appendChild(mesaDiv);
-  });
-
-  app.appendChild(mesasContainer);
-}
-
-function gestionarMesa(index) {
-  const mesa = mesas[index];
-  app.innerHTML = '';
-
-  const titulo = document.createElement('h1');
-  titulo.textContent = `Mesa ${mesa.numero}`;
-  titulo.className = 'mesa-heading';
-  app.appendChild(titulo);
-
-  const pedidosContainer = document.createElement('div');
-  pedidosContainer.className = 'pedidos-container';
-  pedidosContainer.innerHTML = mesa.pedidos.map(p => `${p.item} (${p.opcion || ''}) x${p.cantidad} - €${(p.precio * p.cantidad).toFixed(2)}`).join('<br>');
-  app.appendChild(pedidosContainer);
-
-  const categorias = [
-    { nombre: 'Refresco', precio: 1.5, opciones: ['Cola', 'Cola 0', 'Fanta Limón/Naranja', 'Isotónica', 'Nestea'] },
-    { nombre: 'Cerveza', precio: 2.0, opciones: ['San Miguel', '0 Alcohol', 'Magna', 'Águila', 'Amstel'] },
-    { nombre: 'Vino', precio: 2.0, opciones: ['Tinto', 'Blanco', 'Moscatel', 'Vermuth'] },
-    { nombre: 'Copa', precio: 4.5, opciones: ['Larios', 'Whisky', 'Ron'] },
-    { nombre: 'Pescado Entero', precio: 7.0, opciones: ['Boq.', 'Bacal.', 'Punt.', 'Jurl.', 'Sard.', 'JuPl.'] },
-    { nombre: 'Pescado Media', precio: 4.5, opciones: ['Boq.', 'Bacal.', 'Punt.', 'Jurl.', 'Sard.', 'JuPl.'] },
-    { nombre: 'Otros', precio: 8.0, opciones: ['Queso', 'Gambas'] },
-  ];
-
-  const buttonsContainer = document.createElement('div');
-  buttonsContainer.className = 'buttons-container';
-  app.appendChild(buttonsContainer)
-
-  categorias.forEach(categoria => {
-    const button = document.createElement('button');
-    button.className = 'btn btn-info btn-block mb-2';
-    button.textContent = `+ ${categoria.nombre} (€${categoria.precio.toFixed(2)})`;
-    button.onclick = () => {
-      const opcionesContainer = document.createElement('div');
-      opcionesContainer.className = 'opciones-container';
-
-      categoria.opciones.forEach(opcion => {
-        const opcionDiv = document.createElement('div');
-        opcionDiv.className = 'opcion-item';
-        opcionDiv.innerHTML = `
-            <span>${opcion}</span>
-            <div class="cantidad-controls" data-opcion="${opcion}" data-categoria="${categoria.nombre}" data-precio="${categoria.precio}">
-              <button class="btn btn-outline-secondary decrease">-</button>
-              <span class="cantidad">0</span>
-              <button class="btn btn-outline-secondary increase">+</button>
-            </div>
-          `;
-        opcionesContainer.appendChild(opcionDiv);
-
-        const cantidadControls = opcionDiv.querySelector('.cantidad-controls');
-        const cantidadSpan = cantidadControls.querySelector('.cantidad');
-        cantidadControls.querySelector('.decrease').onclick = (event) => {
-          event.stopPropagation();
-          let cantidad = parseInt(cantidadSpan.textContent, 10);
-          if (cantidad > 0) {
-            cantidad--;
-            cantidadSpan.textContent = cantidad;
-          }
-        };
-
-        cantidadControls.querySelector('.increase').onclick = (event) => {
-          event.stopPropagation();
-          let cantidad = parseInt(cantidadSpan.textContent, 10);
-          cantidad++;
-          cantidadSpan.textContent = cantidad;
-        };
-      });
-
-      const confirmarButton = document.createElement('button');
-      confirmarButton.textContent = '✔ Confirmar';
-      confirmarButton.className = 'btn btn-success btn-block';
-      confirmarButton.onclick = () => {
-        const cantidadControls = opcionesContainer.querySelectorAll('.cantidad-controls');
-        cantidadControls.forEach(control => {
-          const cantidad = parseInt(control.querySelector('.cantidad').textContent, 10);
-          if (cantidad > 0) {
-            const opcion = control.dataset.opcion;
-            const categoria = control.dataset.categoria;
-            const precio = parseFloat(control.dataset.precio);
-            mesa.pedidos.push({ item: categoria, opcion, cantidad, precio });
-          }
-        });
-        gestionarMesa(index);
-      };
-      opcionesContainer.appendChild(confirmarButton);
-
-      app.innerHTML = '';
-      app.appendChild(opcionesContainer);
-
-      const volverButton = document.createElement('button');
-      volverButton.textContent = '← Volver';
-      volverButton.className = 'btn btn-outline-danger btn-block';
-      volverButton.onclick = () => gestionarMesa(index);
-      app.appendChild(volverButton);
-    };
-    buttonsContainer.appendChild(button);
-  });
-
-  const atrasButton = document.createElement('button');
-  atrasButton.textContent = '← Atrás';
-  atrasButton.className = 'btn btn-outline-secondary btn-block mb-2';
-  atrasButton.onclick = () => render();
-  app.appendChild(atrasButton);
-
-  const totalButton = document.createElement('button');
-  totalButton.textContent = 'Calcular Total';
-  totalButton.className = 'btn btn-warning btn-block mb-2';
-  totalButton.onclick = () => {
-    const total = mesa.pedidos.reduce((sum, p) => sum + p.precio * p.cantidad, 0);
-    alert(`El total de la mesa es: €${total.toFixed(2)}`);
-  };
-  app.appendChild(totalButton);
-
-  const qrButton = document.createElement('button');
-  qrButton.textContent = 'Generar QR';
-  qrButton.className = 'btn btn-primary btn-block';
-  qrButton.onclick = () => {
-        const total = mesa.pedidos.reduce((sum, p) => sum + p.precio * p.cantidad, 0);
-    if (total > 0) {
-      generarTicket(index, total);
-    } else {
-      alert("La mesa no tiene productos");
-    }
-  };
-  app.appendChild(qrButton);
-}
-
-// Generación del PDF con jsPDF
-function generarTicket(index, total) {
-  const mesa = mesas[index];
-
-  // Crear un nuevo documento PDF
-  const doc = new jsPDF();
-
-  // Agregar contenido al PDF
-  doc.setFontSize(16);
-  doc.text(`Chiringuito Miguelito`, 80, 15);
-  doc.setFontSize(12);
-  doc.text(`Mesa ${mesa.numero}`, 10, 25);
-  let yOffset = 35;
-  mesa.pedidos.forEach(pedido => {
-    doc.text(`${pedido.item} (${pedido.opcion || ''}) x${pedido.cantidad} - €${(pedido.precio * pedido.cantidad).toFixed(2)}`, 10, yOffset);
-    yOffset += 10;
-  });
-  doc.text(`Total: €${total.toFixed(2)}`, 10, yOffset);
-
-  // Generar el PDF y descargarlo
-  doc.save(`ticket-mesa-${mesa.numero}.pdf`);
-
-  // Ocultar los elementos existentes en app
-  app.querySelectorAll('*').forEach(el => el.style.display = 'none');
-
-  // Mostrar el total debajo del QR
-  const totalText = document.createElement('p');
-  totalText.textContent = `Total: €${total.toFixed(2)}`;
-  totalText.className = 'text-center';
-  app.appendChild(totalText);
-
-  // Mostrar el QR
-  const qrContainer = document.createElement('div');
-  qrContainer.className = 'text-center';
-  app.appendChild(qrContainer);
-
-  const qrContent = `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 qrUrl = `https://api.qrserver.com/v1/create-qr-code/?data=${encodeURIComponent(qrContent)}&size=256x256`;
-
-  const qrImage = document.createElement('img');
-  qrImage.src = qrUrl;
-  qrImage.alt = 'QR Code';
-  qrContainer.appendChild(qrImage);
-
-  // Botón "Volver"
-  const volverButton = document.createElement('button');
-  volverButton.textContent = '← Volver';
-  volverButton.className = 'btn btn-outline-danger btn-block';
-  volverButton.onclick = () => {
-    // Mostrar los elementos ocultos
-    app.querySelectorAll('*').forEach(el => el.style.display = 'block');
-    mesa.pedidos = [];
-    render(); // Volver a renderizar la UI principal
-  };
-  app.appendChild(volverButton);
-}
-// Inicializar la aplicación
-render();