PDF PEDIDOS

This commit is contained in:
2026-06-09 10:05:00 -05:00
parent b19deda02c
commit d0581d36d1
9 changed files with 896 additions and 6 deletions
+78 -2
View File
@@ -9,7 +9,7 @@
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=DM+Serif+Display:ital@0;1&family=Plus+Jakarta+Sans:wght@300;400;500;600;700;800&display=swap" rel="stylesheet">
<link rel="stylesheet" href="estilos.css?v=5">
<link rel="stylesheet" href="estilos.css?v=6">
</head>
<body>
@@ -102,6 +102,82 @@
</div>
</footer>
<script src="app.js?v=5"></script>
<!-- CARRITO FLOTANTE -->
<button class="cart-fab" id="cartFab" aria-label="Abrir carrito">
<span class="cart-fab-icon">
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="white" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<circle cx="9" cy="21" r="1"/><circle cx="20" cy="21" r="1"/>
<path d="M1 1h4l2.68 13.39a2 2 0 0 0 2 1.61h9.72a2 2 0 0 0 2-1.61L23 6H6"/>
</svg>
</span>
<span class="cart-fab-badge" id="cartBadge">0</span>
</button>
<!-- MODAL DEL CARRITO -->
<div class="modal" id="cartModal">
<div class="modal-backdrop" data-cart-close></div>
<div class="modal-content cart-modal-content">
<div class="modal-header">
<h2>🛒 Carrito</h2>
<button class="modal-close" data-cart-close></button>
</div>
<div class="modal-body" id="cartBody">
<p class="cart-empty">El carrito está vacío.</p>
</div>
<div class="modal-footer">
<div class="cart-total" id="cartTotal">
<span>Total:</span>
<strong>$0</strong>
</div>
<div class="cart-actions">
<button class="btn btn-ghost" id="cartClearBtn">Vaciar carrito</button>
<button class="btn btn-primary" id="cartPdfBtn" disabled>📄 Generar PDF</button>
</div>
</div>
</div>
</div>
<!-- MODAL FORMULARIO DE PEDIDO -->
<div class="modal" id="orderModal">
<div class="modal-backdrop" data-order-close></div>
<div class="modal-content order-modal-content">
<div class="modal-header">
<h2>📄 Datos del pedido</h2>
<button class="modal-close" data-order-close></button>
</div>
<div class="modal-body">
<form id="orderForm" autocomplete="off">
<div class="form-group">
<label for="orderNombre">Nombre completo</label>
<input type="text" id="orderNombre" required placeholder="Tu nombre">
</div>
<div class="form-group">
<label for="orderCiudad">Ciudad</label>
<input type="text" id="orderCiudad" required placeholder="Tu ciudad">
</div>
<div class="form-group">
<label for="orderTelefono">Teléfono</label>
<input type="tel" id="orderTelefono" required placeholder="Tu teléfono">
</div>
<div class="form-group">
<label for="orderDireccion">Dirección</label>
<input type="text" id="orderDireccion" required placeholder="Tu dirección">
</div>
<div class="form-error" id="orderError" role="alert"></div>
</form>
</div>
<div class="modal-footer">
<div class="cart-actions">
<button class="btn btn-ghost" data-order-close>Cancelar</button>
<button class="btn btn-primary" id="orderSubmitBtn">
<span class="btn-text">✅ Generar pedido</span>
<span class="btn-spinner" style="display:none"></span>
</button>
</div>
</div>
</div>
</div>
<script src="app.js?v=7"></script>
</body>
</html>