diff --git a/Interfaz/scripts/BoletosArtista.js b/Interfaz/scripts/BoletosArtista.js
new file mode 100644
index 0000000..fea9194
--- /dev/null
+++ b/Interfaz/scripts/BoletosArtista.js
@@ -0,0 +1,277 @@
+// 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