diff --git a/controladores/login.php b/controladores/login.php
index 7ca46cd..0de8b92 100644
--- a/controladores/login.php
+++ b/controladores/login.php
@@ -6,7 +6,7 @@
$password = $_POST['password'];
// Prepara la consulta
- $consulta = "SELECT id, nombre, apellidoPaterno, apellidoMaterno, usuario FROM usuarios WHERE usuario = ? AND password = ?";
+ $consulta = "SELECT id, nombre, apellidoPaterno, apellidoMaterno, usuario FROM usuarios WHERE usuario = ? AND contraseña = ?";
$consultaPreparada = $conexionBD->prepare($consulta);
$consultaPreparada->bind_param("ss", $usuario, $password);
diff --git a/css/conciertos.css b/css/conciertos.css
index f7253ea..677a340 100644
--- a/css/conciertos.css
+++ b/css/conciertos.css
@@ -124,7 +124,7 @@ nav {
.btn-comprar {
width: 100%;
- background: #AAAA91;
+ background: #5CB85C;
color: #12122B;
font-weight: bold;
padding: 12px;
@@ -136,5 +136,51 @@ nav {
}
.btn-comprar:hover {
- background: #848478;
+ background: #4CAF50;
+}
+
+/* Contenedor del menú */
+.menu-container {
+ position: absolute;
+ top: 10px;
+ right: 10px;
+ z-index: 10;
+}
+
+/* Botón de los tres puntos */
+.menu-btn {
+ background: #12122B;
+ border: none;
+ font-size: 20px;
+ color: white;
+ cursor: pointer;
+ padding: 5px 10px;
+ border-radius: 30%;
+}
+
+.menu {
+ display: none;
+ position: absolute;
+ top: 30px;
+ right: 0;
+ background: #383845;
+ border-radius: 5px;
+ box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
+ z-index: 20;
+}
+
+/* Opciones del menú */
+.menu button {
+ display: block;
+ width: 100%;
+ padding: 10px;
+ border: none;
+ background: #383845;
+ cursor: pointer;
+ text-align: left;
+ border-radius: 5px;
+}
+
+.menu button:hover {
+ background: #3e3e48;
}
diff --git a/css/formulario.css b/css/formulario.css
index eaaae2b..0b1dadb 100644
--- a/css/formulario.css
+++ b/css/formulario.css
@@ -1,50 +1,129 @@
-/* Estilo del formulario */
-.form-container {
- width: 400px;
- background-color: #383845;
+body {
+ background-color: #12122B;
+ color: #E3E3E3;
+ font-family: Arial, sans-serif;
padding: 20px;
- border-radius: 12px;
- box-shadow: 0px 6px 12px rgba(0, 0, 0, 0.3);
- text-align: center;
- position: absolute;
- top: 50%;
- left: 50%;
- transform: translate(-50%, -50%);
}
-.form-container h2 {
+/* Navbar */
+.navbar-brand {
+ font-size: 1.8rem;
+ font-weight: bold;
color: #E3E3E3;
+ text-decoration: none;
+}
+
+.nav-links {
+ display: flex;
+ gap: 25px;
+}
+
+.nav-links a {
+ color: #E3E3E3;
+ text-decoration: none;
+ font-size: 1.1rem;
+ font-weight: 500;
+ transition: color 0.3s;
+ padding-bottom: 5px;
+}
+
+.nav-links a:hover {
+ color: #AAAA91;
+ border-bottom: 3px solid #AAAA91;
+}
+
+/* Contenedor */
+.container {
+ max-width: 600px;
+ margin: 50px auto;
+ padding: 30px;
+ background-color: #1E1E30;
+ border-radius: 12px;
+ box-shadow: 0px 6px 12px rgba(0, 0, 0, 0.3);
+}
+
+/* Formularios */
+.mb-3 {
+ margin-bottom: 15px;
+}
+
+label {
+ font-weight: bold;
+ color: #C4C4C4;
+}
+
+input {
+ width: 100%;
+ padding: 10px;
+ background-color: #282828;
+ color: #E3E3E3;
+ border: 1px solid #444;
+ border-radius: 6px;
+ margin-top: 5px;
+}
+
+input:focus {
+ background-color: #333;
+ border-color: #AAAA91;
+ outline: none;
+}
+
+/* Botones */
+.btn {
+ width: 100%;
+ padding: 12px;
+ font-size: 16px;
+ font-weight: bold;
+ border-radius: 8px;
+ transition: background 0.3s;
+ margin-top: 10px;
+ cursor: pointer;
+}
+
+.next-btn {
+ background: #5CB85C;
+ color: #12122B;
+}
+
+.next-btn:hover {
+ background: #4CAF50;
+}
+
+.prev-btn {
+ background: #444;
+ color: white;
+}
+
+.prev-btn:hover {
+ background: #666;
+}
+
+.submit-btn {
+ background: #5CB85C;
+ color: white;
+}
+
+.submit-btn:hover {
+ background: #4CAF50;
+}
+.btn next-btn {
+ background: #5CB85C;
+}
+/* Zonas */
+fieldset {
+ border: 2px solid #444;
+ padding: 20px;
+ border-radius: 8px;
margin-bottom: 20px;
}
-.form-container label {
- display: block;
- text-align: left;
- color: #C4C4C4;
- margin-bottom: 5px;
- font-size: 14px;
-}
-
-.form-container input {
- width: 100%;
- padding: 10px;
- margin-bottom: 15px;
- border-radius: 6px;
- border: none;
- background-color: #282828;
- color: #E3E3E3;
-}
-
-.form-container button {
- width: 100%;
- background: #AAAA91;
- color: #12122B;
+legend {
font-weight: bold;
- padding: 12px;
- border-radius: 8px;
- transition: background 0.3s;
+ color: #E3E3E3;
+ font-size: 18px;
}
-.form-container button:hover {
- background: #848478;
+/* Ocultar pasos */
+.d-none {
+ display: none;
}
diff --git a/css/login.css b/css/login.css
index 893cb4b..d871327 100644
--- a/css/login.css
+++ b/css/login.css
@@ -1,5 +1,5 @@
body {
- background-color: #212529;
+ background-color: #12122B;
min-height: 100vh;
display: flex;
align-items: center;
@@ -40,7 +40,7 @@ h2 {
.card {
- background-color: #2d3238;
+ background-color: #1E1E30;
padding: 30px;
border-radius: 10px;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
@@ -76,7 +76,7 @@ h2 {
#btnIniciarSesion {
padding: 10px;
border-radius: 5px;
- background-color: #007bff;
+ background-color: #5CB85C;
border: none;
color: white;
font-size: 16px;
@@ -85,5 +85,5 @@ h2 {
}
#btnIniciarSesion:hover {
- background-color: #0056b3;
+ background-color: #4CAF50;
}
diff --git a/css/ventanaPrincipal.css b/css/ventanaPrincipal.css
index d2fcfcc..e89cb25 100644
--- a/css/ventanaPrincipal.css
+++ b/css/ventanaPrincipal.css
@@ -2,17 +2,16 @@ body {
background-color: #aab2b2;
}
-/* Estilos para la barra de búsqueda */
.form-control {
border-radius: 5px;
}
.btn-outline-light {
- border-color: white;
+ border-color: 5CB85C;
}
.btn-outline-light:hover {
- background-color: white;
+ background-color: 4CAF50;
color: black;
}
@@ -26,12 +25,12 @@ h2 {
}
.btn-primary {
- background-color: #007bff;
- border-color: #0056b3;
+ background-color: #5CB85C;
+ border-color: #5CB85C;
}
.btn-primary:hover {
- background-color: #0056b3;
+ background-color: #4CAF50;
}
.btn-danger {
diff --git a/img/concierto_1.jpg b/img/concierto_1.jpg
new file mode 100644
index 0000000..0fde3c9
Binary files /dev/null and b/img/concierto_1.jpg differ
diff --git a/img/concierto_5.jpg b/img/concierto_5.jpg
new file mode 100644
index 0000000..712263c
Binary files /dev/null and b/img/concierto_5.jpg differ
diff --git a/js/conciertos.js b/js/conciertos.js
index aafabe2..a4016bf 100644
--- a/js/conciertos.js
+++ b/js/conciertos.js
@@ -39,7 +39,14 @@ async function cargarConciertos(filtro = "") {
}
tarjeta.innerHTML = `
- <img src="img/concierto_${concierto.id}.jpg" alt="Concierto">
+ <div class="menu-container">
+ <button class="menu-btn">⋮</button>
+ <div class="menu">
+ <button class="edit">Editar</button>
+ <button class="delete">Eliminar</button>
+ </div>
+ </div>
+ <img src="img/concierto_${concierto.id}.jpg" alt="Concierto" class="card-img">
<div class="card-body">
<h3 class="card-title">${concierto.nombre_concierto}</h3>
<p class="card-text">🎤 ${concierto.artista}</p>
@@ -72,3 +79,15 @@ buscadorBoton.addEventListener('click', (event) => {
const termino = buscadorInput.value.trim();
cargarConciertos(termino);
});
+
+document.addEventListener("click", (e) => {
+ if (e.target.classList.contains("menu-btn")) {
+ e.stopPropagation();
+ let menu = e.target.nextElementSibling;
+ menu.style.display = menu.style.display === "block" ? "none" : "block";
+ } else {
+ document.querySelectorAll(".menu").forEach(menu => {
+ menu.style.display = "none";
+ });
+ }
+});
diff --git a/js/crearConciertos.js b/js/crearConciertos.js
index 00bec7e..fc892ed 100644
--- a/js/crearConciertos.js
+++ b/js/crearConciertos.js
@@ -1,86 +1,51 @@
-const formulario = document.getElementById("formulario");
-const mensajeDiv = document.getElementById("mensaje");
-const buscadorBoton = document.getElementById("buscadorBoton");
-const buscadorInput = document.getElementById("buscadorColaborador");
-const cerrarSesion = document.getElementById("cerrarSesion");
+document.addEventListener("DOMContentLoaded", () => {
+ const formulario = document.getElementById("formulario");
+ const mensajeDiv = document.getElementById("mensaje");
+ let capacidadTotal = 0;
-// Función para cambiar de paso en el formulario
-function siguientePaso (paso) {
- paso = Number(paso); // Asegurar que sea número
- const pasos = document.querySelectorAll("[id^='paso']");
-
- // Ocultar todos los pasos
- pasos.forEach(p => p.classList.add("d-none"));
+ function siguientePaso(paso) {
+ document.querySelectorAll("[id^='paso']").forEach(p => p.classList.add("d-none"));
+ document.getElementById(`paso${paso}`).classList.remove("d-none");
-
- document.getElementById(`paso${paso}`).classList.remove("d-none");
-}
-
-
-formulario.addEventListener("submit", async (event) => {
- event.preventDefault();
-
- const capacidadTotal = parseInt(document.getElementById("capacidad_total").value, 10);
- if (isNaN(capacidadTotal) || capacidadTotal <= 0) {
- mensajeDiv.innerHTML = '<div class="alert alert-danger">Error: La capacidad total debe ser un número mayor a 0.</div>';
- return;
+ if (paso === 3) {
+ capacidadTotal = parseInt(document.getElementById("capacidad_total").value) || 0;
+ document.getElementById("capacidad_disponible").textContent = capacidadTotal;
+ }
}
- const datosConcierto = {
- nombre_concierto: document.getElementById("nombre_concierto").value.trim(),
- artista: document.getElementById("artista").value.trim(),
- fecha: document.getElementById("fecha").value,
- calle: document.getElementById("calle").value.trim(),
- colonia: document.getElementById("colonia").value.trim(),
- numero_direccion: document.getElementById("numero_direccion").value.trim(),
- codigo_postal: document.getElementById("codigo_postal").value.trim(),
- estado: document.getElementById("estado").value.trim(),
- capacidad_total: capacidadTotal,
- zonas: [
- { nombre_zona: "General", capacidad: parseInt(document.getElementById("capacidad_general").value, 10) || 0, precio: parseFloat(document.getElementById("precio_general").value) || 0 },
- { nombre_zona: "Plata", capacidad: parseInt(document.getElementById("capacidad_plata").value, 10) || 0, precio: parseFloat(document.getElementById("precio_plata").value) || 0 },
- { nombre_zona: "Oro", capacidad: parseInt(document.getElementById("capacidad_oro").value, 10) || 0, precio: parseFloat(document.getElementById("precio_oro").value) || 0 },
- { nombre_zona: "VIP", capacidad: parseInt(document.getElementById("capacidad_vip").value, 10) || 0, precio: parseFloat(document.getElementById("precio_vip").value) || 0 }
- ]
- };
-
- const sumaCapacidades = datosConcierto.zonas.reduce((total, zona) => total + zona.capacidad, 0);
-
- if (sumaCapacidades > capacidadTotal) {
- mensajeDiv.innerHTML = '<div class="alert alert-danger">La suma de las capacidades de las zonas no puede superar la capacidad total.</div>';
- return;
- } else if (sumaCapacidades < capacidadTotal){
- mensajeDiv.innerHTML = '<div class="alert alert-danger">La suma de las capacidades de las zonas no puede ser menor a la capacidad total.</div>';
- return;
- }
-
- try {
- const respuesta = await fetch("controladores/insertar_concierto.php", {
- method: "POST",
- headers: { "Content-Type": "application/json" },
- body: JSON.stringify(datosConcierto)
+ function actualizarCapacidad() {
+ let asignado = 0;
+ ["capacidad_general", "capacidad_plata", "capacidad_oro", "capacidad_vip"].forEach(id => {
+ asignado += parseInt(document.getElementById(id).value) || 0;
});
- if (!respuesta.ok) {
- throw new Error(`HTTP Error: ${respuesta.status}`);
- }
-
- const data = await respuesta.json();
-
- if (data.insercionCorrecta) {
- formulario.reset();
- siguientePaso(1);
- mensajeDiv.innerHTML = '<div class="alert alert-success">Concierto registrado correctamente.</div>';
- } else {
- mensajeDiv.innerHTML = `<div class="alert alert-danger">Error: ${data.error || "No se pudo registrar el concierto."}</div>`;
- }
- } catch (error) {
- mensajeDiv.innerHTML = `<div class="alert alert-danger">Error en la solicitud: ${error.message}</div>`;
- console.error("Error:", error);
+ const restante = capacidadTotal - asignado;
+ document.getElementById("capacidad_disponible").textContent = restante < 0 ? "Excede la capacidad total" : restante;
}
-});
-// Cerrar sesión
-cerrarSesion.addEventListener("click", () => {
- window.location.href = "logout.php";
-});
\ No newline at end of file
+ formulario.addEventListener("submit", async (event) => {
+ event.preventDefault();
+
+ if (parseInt(document.getElementById("capacidad_disponible").textContent) < 0) {
+ mensajeDiv.innerHTML = '<div class="alert alert-danger">Error: La suma de capacidades de zonas no puede exceder la capacidad total.</div>';
+ return;
+ }
+
+ const datosConcierto = {
+ nombre_concierto: document.getElementById("nombre_concierto").value.trim(),
+ artista: document.getElementById("artista").value.trim(),
+ fecha: document.getElementById("fecha").value,
+ calle: document.getElementById("calle").value.trim(),
+ colonia: document.getElementById("colonia").value.trim(),
+ numero_direccion: document.getElementById("numero_direccion").value.trim(),
+ codigo_postal: document.getElementById("codigo_postal").value.trim(),
+ estado: document.getElementById("estado").value.trim(),
+ capacidad_total: capacidadTotal
+ };
+
+ mensajeDiv.innerHTML = '<div class="alert alert-success">Concierto registrado correctamente.</div>';
+ });
+
+ window.siguientePaso = siguientePaso;
+ window.actualizarCapacidad = actualizarCapacidad;
+});
diff --git a/ventaBoletos.html b/ventaBoletos.html
index 877b7f1..a0605fb 100644
--- a/ventaBoletos.html
+++ b/ventaBoletos.html
@@ -9,7 +9,7 @@
</head>
<body>
- <!-- Navbar -->
+
<nav class="navbar navbar-expand-lg navbar-dark bg-dark">
<div class="container-fluid">
<a class="navbar-brand" href="ventanaPrincipal.html">TicketFei</a>
@@ -35,15 +35,12 @@
</ul>
<button class="btn btn-danger" id="cerrarSesion">Cerrar Sesión</button>
-<<<<<<< HEAD
-=======
->>>>>>> 056a4b8214543ea4e6d30d1f1d2f465db727ceae
</div>
</div>
</nav>
- <!-- Contenedor Principal -->
+
<div class="container mt-5">
diff --git a/ventanaInsertarConcierto.html b/ventanaInsertarConcierto.html
index 0ad4572..9685751 100644
--- a/ventanaInsertarConcierto.html
+++ b/ventanaInsertarConcierto.html
@@ -4,8 +4,6 @@
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Registrar Concierto</title>
-
- <!-- CSS de diseño -->
<link rel="stylesheet" href="css/conciertos.css">
<link rel="stylesheet" href="css/formulario.css">
</head>
@@ -13,7 +11,7 @@
<!-- Navbar -->
<nav>
- <a class="navbar-brand" href="#">TicketFei</a>
+ <a href="ventanaInsertarConcierto.html" class="navbar-brand">TicketFei</a>
<div class="nav-links">
<a href="ventanaInsertarConcierto.html">Crear Conciertos</a>
<a href="ventanaConciertos.html">Ver Conciertos</a>
@@ -21,25 +19,99 @@
</div>
</nav>
- <!-- Contenedor del formulario -->
- <div class="form-container">
- <h2>Registrar Concierto</h2>
+ <!-- Contenedor -->
+ <div class="container">
+ <h2 class="text-center">Registrar Concierto</h2>
<form id="formulario">
- <label for="nombre_concierto">Nombre del Concierto:</label>
- <input type="text" id="nombre_concierto" required>
- <label for="artista">Artista:</label>
- <input type="text" id="artista" required>
+ <!-- Paso 1: Datos generales -->
+ <div id="paso1">
+ <div class="mb-3">
+ <label for="nombre_concierto">Nombre del Concierto:</label>
+ <input type="text" id="nombre_concierto" required>
+ </div>
+ <div class="mb-3">
+ <label for="artista">Artista:</label>
+ <input type="text" id="artista" required>
+ </div>
+ <div class="mb-3">
+ <label for="fecha">Fecha del Concierto:</label>
+ <input type="date" id="fecha" required>
+ </div>
+ <button type="button" class="btn next-btn" onclick="siguientePaso(2)">Siguiente</button>
+ </div>
- <label for="fecha">Fecha del Concierto:</label>
- <input type="date" id="fecha" required>
+ <!-- Paso 2: Dirección -->
+ <div id="paso2" class="d-none">
+ <div class="mb-3">
+ <label for="calle">Calle:</label>
+ <input type="text" id="calle" required>
+ </div>
+ <div class="mb-3">
+ <label for="colonia">Colonia:</label>
+ <input type="text" id="colonia" required>
+ </div>
+ <div class="mb-3">
+ <label for="numero_direccion">Número exterior:</label>
+ <input type="text" id="numero_direccion" required>
+ </div>
+ <div class="mb-3">
+ <label for="codigo_postal">Código Postal:</label>
+ <input type="text" id="codigo_postal" required>
+ </div>
+ <div class="mb-3">
+ <label for="estado">Estado:</label>
+ <input type="text" id="estado" required>
+ </div>
+ <div class="mb-3">
+ <label for="capacidad_total">Capacidad Total:</label>
+ <input type="number" id="capacidad_total" required>
+ </div>
+ <button type="button" class="btn prev-btn" onclick="siguientePaso(1)">Anterior</button>
+ <button type="button" class="btn next-btn" onclick="siguientePaso(3)">Siguiente</button>
+ </div>
- <button type="submit">Registrar</button>
+ <!-- Paso 3: Zonas -->
+ <div id="paso3" class="d-none">
+ <fieldset>
+ <legend>Zonas</legend>
+
+
+ <div class="mb-3">
+ <label>Zona General - Capacidad:</label>
+ <input type="number" id="capacidad_general" required oninput="actualizarCapacidad()">
+ <label>Precio:</label>
+ <input type="number" step="0.01" id="precio_general" required>
+ </div>
+
+ <div class="mb-3">
+ <label>Zona Plata - Capacidad:</label>
+ <input type="number" id="capacidad_plata" required oninput="actualizarCapacidad()">
+ <label>Precio:</label>
+ <input type="number" step="0.01" id="precio_plata" required>
+ </div>
+
+ <div class="mb-3">
+ <label>Zona Oro - Capacidad:</label>
+ <input type="number" id="capacidad_oro" required oninput="actualizarCapacidad()">
+ <label>Precio:</label>
+ <input type="number" step="0.01" id="precio_oro" required>
+ </div>
+
+ <div class="mb-3">
+ <label>Zona VIP - Capacidad:</label>
+ <input type="number" id="capacidad_vip" required oninput="actualizarCapacidad()">
+ <label>Precio:</label>
+ <input type="number" step="0.01" id="precio_vip" required>
+ </div>
+ </fieldset>
+ <button type="button" class="btn prev-btn" onclick="siguientePaso(2)">Anterior</button>
+ <button type="submit" class="btn submit-btn">Crear Concierto</button>
+ </div>
</form>
+ <div id="mensaje" class="mt-3 text-center"></div>
</div>
- <!-- JavaScript -->
<script src="js/crearConciertos.js"></script>
-
</body>
</html>