christian.julian
/
Proyecto_venta_boletos
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Merge branch 'main' of https://git.gumoio.com/christian.julian/Proyecto_venta_boletos

This commit is contained in:
Hector 2025-03-09 17:33:10 -06:00
parent d38e4f1387 792c1a7d4c
commit 4850dee1ad
4 changed files with 60 additions and 2 deletions

8
vista/comprobante.html
View File

@ -52,7 +52,12 @@
Total: $<span id="total-venta"></span>
</div>
<div style="margin-top: 40px; font-size: 14px; text-align: center;">
<div class="qr-container">
<div id="qr-code"></div>
<p class="qr-info">Este QR contiene el número de venta para verificación</p>
</div>
<div class="mensaje">
<p>¡Gracias por su compra!</p>
<p>Este comprobante es su entrada oficial para el evento.</p>
<p>Por favor, preséntelo en la entrada del concierto.</p>
@ -65,6 +70,7 @@
</div>
</div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/qrcodejs/1.0.0/qrcode.min.js"></script>
<script src="js/comprobante.js"></script>
</body>
</html>

22
vista/css/comprobante.css
View File

@ -78,4 +78,26 @@ th {
}
.btn:hover {
opacity: 0.9;
}
.qr-container {
text-align: center;
margin: 30px 0;
padding: 10px;
border-top: 1px dashed #ccc;
padding-top: 20px;
}
#qr-code {
display: inline-block;
margin: 0 auto;
}
.qr-info {
font-size: 14px;
margin-top: 10px;
}
.mensaje {
margin-top: 40px;
font-size: 14px;
text-align: center;
}

2
vista/index.html
View File

@ -9,7 +9,7 @@
</head>
<body>
<div class="container">
<h1>Sistema de Venta de Boletos para Concierto</h1>
<h1>TicketFlow</h1>
<div id="mensajeAlerta" class="alert alert-warning d-none" role="alert"></div>

30
vista/js/comprobante.js
View File

@ -34,6 +34,9 @@ function cargarComprobante() {
});
tablaBoletos.innerHTML = contenidoTabla;
// Generar código QR con el ID de la venta
generarQR(comprobante.id_venta);
})
.catch(error => {
console.error('Error:', error);
@ -42,6 +45,29 @@ function cargarComprobante() {
});
}
// Función para generar el código QR
function generarQR(idVenta) {
// Verificar si existe el elemento donde se mostrará el QR
const qrContainer = document.getElementById('qr-code');
if (!qrContainer) {
console.error('No se encontró el elemento para mostrar el código QR');
return;
}
// Limpiar el contenedor por si ya tiene contenido
qrContainer.innerHTML = '';
// Crear una nueva instancia de QRCode
new QRCode(qrContainer, {
text: idVenta.toString(),
width: 128,
height: 128,
colorDark: "#000000",
colorLight: "#ffffff",
correctLevel: QRCode.CorrectLevel.H // Alta corrección de errores
});
}
// Función para imprimir el comprobante
function imprimirComprobante() {
const contenido = document.getElementById('comprobante-imprimible').innerHTML;
@ -61,6 +87,10 @@ function imprimirComprobante() {
th, td { border: 1px solid #ddd; padding: 8px; text-align: left; }
th { background-color: #f8f9fa; }
.total { font-size: 18px; font-weight: bold; text-align: right; margin-top: 20px; padding-top: 10px; border-top: 1px solid #ddd; }
.qr-container { text-align: center; margin: 20px 0; border-top: 1px dashed #ccc; padding-top: 20px;}
#qr-code { display: inline-block; margin: 0 auto; }
.qr-info { font-size: 14px; margin-top: 10px; }
.mensaje { margin-top: 40px; font-size: 14px; text-align: center;}
</style>
</head>
<body>