diff --git a/Interfaz/scripts/BoletosArtista.js b/Interfaz/scripts/BoletosArtista.js
index fea9194..f817079 100644
--- a/Interfaz/scripts/BoletosArtista.js
+++ b/Interfaz/scripts/BoletosArtista.js
@@ -1,277 +1,300 @@
-// Precios por artista y fila
-const preciosPorArtista = {
- 'The Driver Era': {
- 1: 4500, // Filas 1-3
- 4: 2600, // Filas 4-7
- 8: 1300 // Filas 8-10
- },
- 'The 1975': {
- 1: 5000, // Filas 1-3
- 4: 3100, // Filas 4-7
- 8: 1600 // Filas 8-10
- },
- 'Taylor Swift': {
- 1: 7800, // Filas 1-3
- 4: 3800, // Filas 4-7
- 8: 2100 // Filas 8-10
- }
-};
-
-// Datos específicos del artista (se pasan como parámetros al inicializar)
-let artista, dias;
-
-// Configuración inicial
-const filas = 10;
-const columnas = 12;
-let diaSeleccionado;
-const asientosVendidos = {};
-let asientosSeleccionados = {}; // Objeto: { "1A": 4500, "4B": 2600, ... }
-
-// Función para inicializar la página
-function inicializarPagina(nombreArtista, diasArtista) {
- artista = nombreArtista;
- dias = diasArtista;
- diaSeleccionado = dias[0]; // Seleccionar el primer día por defecto
-
- // Inicializar asientos vendidos para cada día
- dias.forEach(dia => asientosVendidos[dia] = new Set());
-
- // Verificar e insertar asientos si no existen
- verificarEInsertarAsientos();
-
- // Renderizar los días disponibles
- renderizarDias();
-}
-
-// Función para obtener el precio de un asiento según la fila
-function obtenerPrecio(fila) {
- if (!artista || !preciosPorArtista[artista]) {
- console.error("Artista no definido o no tiene precios asignados.");
- return 0;
- }
-
- if (fila >= 1 && fila <= 3) {
- return preciosPorArtista[artista][1];
- } else if (fila >= 4 && fila <= 7) {
- return preciosPorArtista[artista][4];
- } else if (fila >= 8 && fila <= 10) {
- return preciosPorArtista[artista][8];
- } else {
- return 0; // En caso de fila no válida
- }
-}
-
-// Función para verificar e insertar asientos si no existen
-function verificarEInsertarAsientos() {
- const url = 'verificar_e_insertar_asientos.php';
- const data = {
- artista: artista,
- dias: dias,
- filas: filas,
- columnas: columnas
- };
-
- fetch(url, {
- method: 'POST',
- headers: {
- 'Content-Type': 'application/json'
- },
- body: JSON.stringify(data)
- })
- .then(response => response.json())
- .then(result => {
- if (result.error) {
- console.error("Error al verificar/insertar asientos:", result.error);
- } else {
- console.log(result.message);
- cargarAsientos(); // Cargar los asientos después de insertarlos
- }
- })
- .catch(error => console.error('Error al verificar/insertar asientos:', error));
-}
-
-// Función para renderizar los días disponibles
-function renderizarDias() {
- const contenedorDias = document.querySelector('.dias');
- contenedorDias.innerHTML = '';
- dias.forEach(dia => {
- const boton = document.createElement('button');
- boton.className = 'btn btn-primary';
- boton.textContent = dia;
- boton.onclick = () => seleccionarDia(dia);
- contenedorDias.appendChild(boton);
- });
-}
-
-// Función para seleccionar un día
-function seleccionarDia(dia) {
- diaSeleccionado = dia;
- asientosSeleccionados = {}; // Reiniciar los asientos seleccionados
- document.querySelectorAll('.dias button').forEach(btn => btn.classList.remove('selected'));
- event.target.classList.add('selected');
- cargarAsientos();
-}
-
-// Función para cargar los asientos desde el servidor
-function cargarAsientos() {
- const url = `consultar_asientos.php?artista=${encodeURIComponent(artista)}&dia=${diaSeleccionado}`;
-
- fetch(url)
- .then(response => response.json())
- .then(data => {
- if (data.error) {
- console.error("Error al cargar los asientos:", data.error);
- return;
- }
-
- asientosVendidos[diaSeleccionado].clear();
-
- data.asientos.forEach(asiento => {
- if (asiento.estado === 'vendido') {
- asientosVendidos[diaSeleccionado].add(asiento.asiento);
- }
- });
-
- renderizarAsientos();
- })
- .catch(error => console.error('Error al cargar los asientos:', error));
-}
-
-// Función para seleccionar/deseleccionar un asiento
-function toggleAsiento(asiento, precio) {
- if (asientosVendidos[diaSeleccionado].has(asiento)) return;
-
- if (asientosSeleccionados[asiento]) {
- // Si el asiento ya está seleccionado, eliminarlo
- delete asientosSeleccionados[asiento];
- } else {
- // Si el asiento no está seleccionado, agregarlo
- asientosSeleccionados[asiento] = precio;
- console.log(`Asiento seleccionado: ${asiento}, Precio: $${precio}`); // Verificar en la consola
- }
-
- renderizarAsientos();
-}
-
-// Función para renderizar los asientos
-function renderizarAsientos() {
- const contenedor = document.getElementById('asientos');
- contenedor.innerHTML = '';
- for (let i = 0; i < filas * columnas; i++) {
- const fila = Math.floor(i / columnas) + 1;
- const columna = String.fromCharCode(65 + (i % columnas)); // A, B, C, ..., L
- const asiento = `${fila}${columna}`;
- const precio = obtenerPrecio(fila);
-
- const boton = document.createElement('button');
- boton.className = 'asiento';
- if (asientosVendidos[diaSeleccionado].has(asiento)) {
- boton.classList.add('vendido');
- } else if (asientosSeleccionados[asiento]) {
- boton.style.backgroundColor = 'orange';
- }
- boton.textContent = `${asiento} - $${precio}`;
- boton.onclick = () => toggleAsiento(asiento, precio);
- contenedor.appendChild(boton);
- }
-}
-
-// Función para vender los asientos seleccionados
-function venderAsientos() {
- const asientos = Object.keys(asientosSeleccionados);
- if (asientos.length === 0) {
- alert("Selecciona al menos un asiento para vender.");
- return;
- }
-
- let precioTotal = 0;
- const asientosSeleccionadosArray = [];
-
- // Calcular el precio total y obtener los asientos seleccionados
- asientos.forEach(asiento => {
- const precio = asientosSeleccionados[asiento];
- if (typeof precio === 'number') { // Verificar que el precio es un número
- precioTotal += precio;
- asientosSeleccionadosArray.push(`${asiento} - $${precio}`);
- } else {
- console.error(`Precio no válido para el asiento ${asiento}:`, precio);
- }
- });
-
- console.log(`Precio total calculado: $${precioTotal}`); // Verificar en la consola
-
- const fechaHora = new Date().toLocaleString();
-
- // Llenar los datos del modal
- document.getElementById('modalArtista').textContent = artista;
- document.getElementById('modalDia').textContent = diaSeleccionado;
- document.getElementById('modalAsientos').textContent = asientosSeleccionadosArray.join(', ');
- document.getElementById('modalPrecioTotal').textContent = `$${precioTotal}`;
- document.getElementById('modalFechaHora').textContent = fechaHora;
-
- // Mostrar el modal
- document.getElementById('comprobanteModal').style.display = 'block';
-}
-
-// Función para confirmar la venta
-function confirmarVenta() {
- const url = 'vender_asientos.php';
- const data = {
- artista: artista,
- dia: diaSeleccionado,
- asientos: Object.keys(asientosSeleccionados) // Enviar solo los asientos
- };
-
- fetch(url, {
- method: 'POST',
- headers: {
- 'Content-Type': 'application/json'
- },
- body: JSON.stringify(data)
- })
- .then(response => response.json())
- .then(result => {
- if (result.error) {
- console.error("Error al vender los asientos:", result.error);
- alert("Error al vender los asientos: " + result.error);
- } else {
- console.log("Venta realizada:", result.message);
- alert(result.message);
-
- // Marcar los asientos como vendidos en la interfaz
- Object.keys(asientosSeleccionados).forEach(asiento => {
- asientosVendidos[diaSeleccionado].add(asiento);
- });
- asientosSeleccionados = {}; // Reiniciar los asientos seleccionados
- renderizarAsientos();
- }
- })
- .catch(error => console.error('Error al vender los asientos:', error));
-
- // Cerrar el modal
- document.getElementById('comprobanteModal').style.display = 'none';
-}
-
-// Función para rechazar la venta
-function rechazarVenta() {
- // Deseleccionar los asientos
- asientosSeleccionados = {};
- renderizarAsientos();
-
- // Mostrar mensaje de compra cancelada
- alert("Compra cancelada");
-
- // Cerrar el modal
- document.getElementById('comprobanteModal').style.display = 'none';
-}
-
-// Manejar el cierre del modal
-const modal = document.getElementById('comprobanteModal');
-const span = document.getElementsByClassName('close')[0];
-
-span.onclick = () => modal.style.display = 'none';
-window.onclick = (event) => {
- if (event.target === modal) {
- modal.style.display = 'none';
- }
-};
\ No newline at end of file
+const preciosPorArtista = {
+ 'The Driver Era': {
+ 1: 4500,
+ 4: 2600,
+ 8: 1300
+ },
+ 'The 1975': {
+ 1: 5000,
+ 4: 3100,
+ 8: 1600
+ },
+ 'Taylor Swift': {
+ 1: 7800,
+ 4: 3800,
+ 8: 2100
+ }
+};
+
+
+let artista, dias;
+
+const filas = 10;
+const columnas = 12;
+let diaSeleccionado;
+const asientosVendidos = {};
+let asientosSeleccionados = {};
+
+function inicializarPagina(nombreArtista, diasArtista) {
+ artista = nombreArtista;
+ dias = diasArtista;
+ diaSeleccionado = dias[0];
+
+ dias.forEach(dia => asientosVendidos[dia] = new Set());
+
+ verificarEInsertarAsientos();
+
+ renderizarDias();
+}
+
+function obtenerPrecio(fila) {
+ if (!artista || !preciosPorArtista[artista]) {
+ console.error("Artista no definido o no tiene precios asignados.");
+ return 0;
+ }
+
+ if (fila >= 1 && fila <= 3) {
+ return preciosPorArtista[artista][1];
+ } else if (fila >= 4 && fila <= 7) {
+ return preciosPorArtista[artista][4];
+ } else if (fila >= 8 && fila <= 10) {
+ return preciosPorArtista[artista][8];
+ } else {// En caso de fila no válida
+ }
+}
+
+function verificarEInsertarAsientos() {
+ const url = 'control/verificar_e_insertar_asientos.php';
+ const data = {
+ artista: artista,
+ dias: dias,
+ filas: filas,
+ columnas: columnas
+ };
+
+ fetch(url, {
+ method: 'POST',
+ headers: {
+ 'Content-Type': 'application/json'
+ },
+ body: JSON.stringify(data)
+ })
+ .then(response => response.json())
+ .then(result => {
+ if (result.error) {
+ console.error("Error al verificar/insertar asientos:", result.error);
+ } else {
+ console.log(result.message);
+ cargarAsientos();
+ }
+ })
+ .catch(error => console.error('Error al verificar/insertar asientos:', error));
+}
+
+function renderizarDias() {
+ const contenedorDias = document.querySelector('.dias');
+ contenedorDias.innerHTML = '';
+ dias.forEach(dia => {
+ const boton = document.createElement('button');
+ boton.className = 'btn btn-primary';
+ boton.textContent = dia;
+ boton.onclick = () => seleccionarDia(dia);
+ contenedorDias.appendChild(boton);
+ });
+}
+
+function seleccionarDia(dia) {
+ diaSeleccionado = dia;
+ asientosSeleccionados = {};
+ document.querySelectorAll('.dias button').forEach(btn => btn.classList.remove('selected'));
+ event.target.classList.add('selected');
+ document.getElementById("asientos").style.display = "grid";
+ cargarAsientos();
+}
+
+function cargarAsientos() {
+ const url = `control/consultar_asientos.php?artista=${encodeURIComponent(artista)}&dia=${diaSeleccionado}`;
+
+ fetch(url)
+ .then(response => response.json())
+ .then(data => {
+ if (data.error) {
+ console.error("Error al cargar los asientos:", data.error);
+ return;
+ }
+
+ asientosVendidos[diaSeleccionado].clear();
+
+ data.asientos.forEach(asiento => {
+ if (asiento.estado === 'vendido') {
+ asientosVendidos[diaSeleccionado].add(asiento.asiento);
+ }
+ });
+
+ renderizarAsientos();
+ })
+ .catch(error => console.error('Error al cargar los asientos:', error));
+}
+
+function actualizarPanelBoletos() {
+ const panel = document.getElementById("panel-boletos");
+ const lista = document.getElementById("lista-boletos");
+ const totalPrecio = document.getElementById("total-precio");
+
+ lista.innerHTML = "";
+ const asientos = Object.keys(asientosSeleccionados);
+ let total = 0;
+
+ if (asientos.length === 0) {
+ panel.classList.add("oculto");
+ return;
+ } else {
+ panel.classList.remove("oculto");
+ }
+
+ asientos.forEach(asiento => {
+ const precio = asientosSeleccionados[asiento];
+ total += precio;
+
+ const boletoItem = document.createElement("div");
+ boletoItem.className = "boleto-item";
+ boletoItem.innerHTML = `
+ <span>${asiento}</span>
+ <span>$${precio} MXN</span>
+ `;
+
+ lista.appendChild(boletoItem);
+ });
+
+ totalPrecio.textContent = `$${total} MXN`;
+}
+
+function toggleAsiento(asiento, precio) {
+ if (asientosVendidos[diaSeleccionado].has(asiento)) return;
+
+ if (asientosSeleccionados[asiento]) {
+ delete asientosSeleccionados[asiento];
+ } else {
+ asientosSeleccionados[asiento] = precio;
+ }
+
+ actualizarPanelBoletos();
+ renderizarAsientos();
+}
+
+
+
+
+function renderizarAsientos() {
+ const contenedor = document.getElementById('asientos');
+ contenedor.innerHTML = '';
+ for (let i = 0; i < filas * columnas; i++) {
+ const fila = Math.floor(i / columnas) + 1;
+ const columna = String.fromCharCode(65 + (i % columnas));
+ const asiento = `${fila}${columna}`;
+ const precio = obtenerPrecio(fila);
+
+ const boton = document.createElement('button');
+ boton.className = 'asiento';
+
+ if (asientosVendidos[diaSeleccionado].has(asiento)) {
+ boton.classList.add('vendido');
+ } else if (asientosSeleccionados[asiento]) {
+ boton.style.backgroundColor = 'orange';
+ }
+ boton.textContent = `${asiento}`;
+ boton.onclick = () => toggleAsiento(asiento, precio);
+ contenedor.appendChild(boton);
+ }
+}
+
+document.addEventListener("DOMContentLoaded", function () {
+ document.getElementById("asientos").style.display = "none";
+
+ const btnVender = document.getElementById("btnVender");
+ if (btnVender) {
+ btnVender.addEventListener("click", venderAsientos);
+ }
+});
+
+function venderAsientos() {
+ const asientos = Object.keys(asientosSeleccionados);
+ if (asientos.length === 0) {
+ alert("Selecciona al menos un asiento para vender.");
+ return;
+ }
+
+ let precioTotal = 0;
+ const asientosSeleccionadosArray = [];
+
+ asientos.forEach(asiento => {
+ const precio = asientosSeleccionados[asiento];
+ if (typeof precio === 'number') {
+ precioTotal += precio;
+ asientosSeleccionadosArray.push(`${asiento} - $${precio}`);
+ }
+ });
+
+ const fechaHora = new Date().toLocaleString();
+
+ document.getElementById('modalArtista').textContent = artista;
+ document.getElementById('modalDia').textContent = diaSeleccionado;
+ document.getElementById('modalAsientos').textContent = asientosSeleccionadosArray.join(', ');
+ document.getElementById('modalPrecioTotal').textContent = `$${precioTotal}`;
+ document.getElementById('modalFechaHora').textContent = fechaHora;
+
+ document.getElementById('modalOverlay').classList.add('modal-visible');
+ document.getElementById('comprobanteModal').style.display = 'block';
+}
+
+
+function confirmarVenta() {
+ const url = 'control/vender_asientos.php';
+ const data = {
+ artista: artista,
+ dia: diaSeleccionado,
+ asientos: Object.keys(asientosSeleccionados)
+ };
+
+ fetch(url, {
+ method: 'POST',
+ headers: {
+ 'Content-Type': 'application/json'
+ },
+ body: JSON.stringify(data)
+ })
+ .then(response => response.json())
+ .then(result => {
+ if (result.error) {
+ console.error("Error al vender los asientos:", result.error);
+ alert("Error al vender los asientos: " + result.error);
+ } else {
+ console.log("Venta realizada:", result.message);
+ alert(result.message);
+
+ Object.keys(asientosSeleccionados).forEach(asiento => {
+ asientosVendidos[diaSeleccionado].add(asiento);
+ });
+ asientosSeleccionados = {};
+ renderizarAsientos();
+ }
+ })
+ .catch(error => console.error('Error al vender los asientos:', error));
+
+ document.getElementById('modalOverlay').classList.remove('modal-visible');
+ document.getElementById('comprobanteModal').style.display = 'none';
+}
+
+
+function rechazarVenta() {
+ asientosSeleccionados = {};
+ renderizarAsientos();
+
+ document.getElementById('modalOverlay').classList.remove('modal-visible');
+ document.getElementById('comprobanteModal').style.display = 'none';
+}
+
+
+const modal = document.getElementById('comprobanteModal');
+const span = document.getElementsByClassName('close')[0];
+
+span.onclick = () => modal.style.display = 'none';
+window.onclick = (event) => {
+ if (event.target === modal) {
+ modal.style.display = 'none';
+ }
+};
+
+document.addEventListener("DOMContentLoaded", function () {
+ document.getElementById("asientos").style.display = "none"; // Ocultar los asientos al cargar
+});