miguel.velazquez
/
proyecto_LANIA
1
1
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

funcionalidades agregadas

This commit is contained in:
Bruno Martínez Luna 2025-05-11 09:30:13 -06:00
parent ed91a80270
commit 7bd24ab410
2 changed files with 200 additions and 177 deletions

361
FormularioInicial.php
View File

@ -1,5 +1,5 @@
<?php
require_once 'database/database.php'; // tu archivo de conexión
require_once 'database/database.php'; // Archivo de conexión
// Traer todos los usuarios que estén en la tabla "entrada"
$query = "SELECT id_usuario, nombre FROM entrada";
@ -13,130 +13,97 @@ $resultado = $conexion->query($query);
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Centro de Certificación LANIA</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
</head>
<!-- Bootstrap CSS -->
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css" rel="stylesheet">
<!-- Font Awesome para íconos -->
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css" rel="stylesheet">
<!-- Custom CSS opcional (puedes agregar tu estilo o el de SB Admin 2) -->
<style>
body {
display: flex;
}
.sidebar {
min-width: 250px;
height: 100vh;
background: rgb(229, 114, 31);
color: white;
}
.sidebar a {
color: white;
text-decoration: none;
}
</style>
<style>
body {
display: flex;
}
.sidebar {
min-width: 250px;
height: 100vh;
background: rgb(229, 114, 31);
color: white;
}
.sidebar a {
color: white;
text-decoration: none;
}
</style>
</head>
<body>
<!-- Sidebar -->
<nav class="sidebar p-3">
<h4 class="text-center mb-4">LANIA</h4>
<ul class="nav flex-column">
<li class="nav-item"><a class="nav-link" href="Estadisticas.php"><i class="fas fa-tachometer-alt"></i> Estadísticas</a></li>
<li class="nav-item"><a class="nav-link" href="FormularioInicial.php"><i class="fas fa-user"></i> Formulario de Ingreso</a></li>
<li class="nav-item"><a class="nav-link" href="FormularioSalida.php"><i class="fas fa-user"></i> Formulario de Salida</a></li>
</ul>
<h4 class="text-center mb-4">LANIA</h4>
<ul class="nav flex-column">
<li class="nav-item"><a class="nav-link" href="Estadisticas.php"><i class="fas fa-tachometer-alt"></i> Estadísticas</a></li>
<li class="nav-item"><a class="nav-link" href="FormularioInicial.php"><i class="fas fa-user"></i> Formulario de Ingreso</a></li>
<li class="nav-item"><a class="nav-link" href="FormularioSalida.php"><i class="fas fa-user"></i> Formulario de Salida</a></li>
</ul>
</nav>
<body class="bg-light">
<div class="container py-5">
<div class="text-center mb-4">
<h1 class="display-5">Centro de Certificación LANIA</h1>
<p class="lead">Formulario de registro para candidatos de exámenes PEARSON VUE</p>
</div>
<div class="container py-5">
<div class="text-center mb-4">
<h1 class="display-5">Centro de Certificación LANIA</h1>
<p class="lead">Formulario de registro para candidatos de exámenes PEARSON VUE</p>
</div>
<div class="card shadow p-4">
<div class="card shadow p-4">
<form id="registroForm" action="model/login.php" method="POST">
<div class="row g-3">
<div class="col-md-6">
<label for="nombre" class="form-label">Nombre completo</label>
<input type="text" class="form-control" id="nombre" name="nombre" required>
</div>
<div class="row g-3">
<div class="col-md-6">
<label for="nombre" class="form-label">Nombre completo</label>
<input type="text" class="form-control" id="nombre" name="nombre" required>
</div>
<div class="col-md-6 position-relative">
<label for="correo" class="form-label">Correo electrónico</label>
<input type="email" class="form-control" id="correo" name="correo" required autocomplete="off">
<div id="sugerencias-correo" class="list-group position-absolute w-100" style="z-index: 1000;"></div>
<div class="col-md-6 position-relative">
<label for="correo" class="form-label">Correo electrónico</label>
<input type="email" class="form-control" id="correo" name="correo" required autocomplete="off">
<div id="sugerencias-correo" class="list-group position-absolute w-100" style="z-index: 1000;"></div>
</div>
<div class="col-md-6">
<label for="telefono" class="form-label">Teléfono</label>
<input type="text" class="form-control" id="telefono" name="telefono" required>
</div>
<div class="col-md-6">
<label for="genero" class="form-label">Género</label>
<select class="form-select" id="genero" name="genero" required>
<option value="">Selecciona una opción</option>
<option value="Masculino">Masculino</option>
<option value="Femenino">Femenino</option>
<option value="Otro">Prefiero no especificar</option>
</select>
</div>
<div class="col-md-6">
<label for="edad" class="form-label">Edad</label>
<select class="form-select" id="edad" name="edad" required>
<option value="">Selecciona un rango de edad</option>
<option value="menor">Menos de 17</option>
<option value="18-21">18-21</option>
<option value="22-25">22-25</option>
<option value="26-30">26-30</option>
<option value="31-35">31-35</option>
<option value="36-40">36-40</option>
<option value="41-45">41-45</option>
<option value="46-50">46-50</option>
<option value="51-55">51-55</option>
<option value="56-60">56-60</option>
<option value="mayor">Más de 60</option>
</select>
</div>
<div class="col-md-6">
<label for="estado_procedencia" class="form-label">Estado de procedencia</label>
<input type="text" class="form-control" id="estado_procedencia" name="estado_procedencia" placeholder="Ingresa tu estado de procedencia" required>
</div>
<script>
const correoInput = document.getElementById('correo');
const sugerenciasDiv = document.getElementById('sugerencias-correo');
const dominios = ['@gmail.com', '@outlook.com', '@hotmail.com', '@lania.mx'];
correoInput.addEventListener('input', () => {
const valor = correoInput.value.trim();
sugerenciasDiv.innerHTML = '';
if (valor && !valor.includes('@')) {
dominios.forEach(dominio => {
const sugerencia = document.createElement('div');
sugerencia.classList.add('list-group-item', 'list-group-item-action');
sugerencia.textContent = valor + dominio;
sugerencia.onclick = () => {
correoInput.value = sugerencia.textContent;
sugerenciasDiv.innerHTML = '';
};
sugerenciasDiv.appendChild(sugerencia);
});
}
});
// Ocultar sugerencias al hacer clic fuera del campo
document.addEventListener('click', (e) => {
if (!sugerenciasDiv.contains(e.target) && e.target !== correoInput) {
sugerenciasDiv.innerHTML = '';
}
});
</script>
<div class="col-md-6">
<label for="telefono" class="form-label">Teléfono</label>
<input type="text" class="form-control" id="telefono" name="telefono" required>
</div>
<div class="col-md-6">
<label for="genero" class="form-label">Género</label>
<select class="form-select" id="genero" name="genero" required>
<option value="">Selecciona una opción</option>
<option value="Masculino">Masculino</option>
<option value="Femenino">Femenino</option>
<option value="Otro">Prefiero no especificar</option>
</select>
</div>
<div class="col-md-6">
<label for="edad" class="form-label">Edad</label>
<select class="form-select" id="edad" name="edad" required>
<option value="">Selecciona un rango de edad</option>
<option value="menor">Menos de 17</option>
<option value="18-21">18-21</option>
<option value="22-25">22-25</option>
<option value="26-30">26-30</option>
<option value="31-35">31-35</option>
<option value="36-40">36-40</option>
<option value="41-45">41-45</option>
<option value="46-50">46-50</option>
<option value="51-55">51-55</option>
<option value="56-60">56-60</option>
<option value="mayor">Más de 60</option>
</select>
</div>
<div class="col-md-4">
<label for="identificacion" class="form-label">Identificacion</label>
<select id="identificacion" name="identificacion" class="form-select" required onchange="actualizarExamenes()">
<option value="">Seleccione una identificacion</option>
<div class="col-md-4">
<label for="identificacion" class="form-label">Identificación</label>
<select id="identificacion" name="identificacion" class="form-select" required>
<option value="">Seleccione una identificación</option>
<option value="CE">Credencial de Estudiante</option>
<option value="INE">INE</option>
<option value="C.M">Cartilla Militar</option>
@ -144,37 +111,101 @@ document.addEventListener('click', (e) => {
</select>
</div>
<div class="row g-3">
<div class="col-md-4">
<label for="empresa" class="form-label">Proveedor</label>
<select id="empresa" name="empresa" class="form-select" required onchange="actualizarExamenes()">
<option value="">Seleccione un proveedor</option>
<option value="Microsoft">Microsoft</option>
<option value="Oracle">Oracle</option>
<option value="Cisco">Cisco</option>
<option value="otro">Otro</option>
</select>
</div>
<!-- Empresa -->
<div class="col-md-4">
<label for="empresa" class="form-label">Proveedor</label>
<select id="empresa" name="empresa" class="form-select" required onchange="actualizarExamenes()">
<option value="">Seleccione un proveedor</option>
<option value="Microsoft">Microsoft</option>
<option value="Oracle">Oracle</option>
<option value="Cisco">Cisco</option>
<option value="otro">Otro</option>
</select>
</div>
<!-- Examen -->
<div class="col-md-4">
<label for="examen" class="form-label">Examen</label>
<select id="examen" name="examen" class="form-select" required onchange="actualizarCertificaciones()">
<option value="">Selecciona un examen</option>
</select>
</div>
<div class="col-md-4">
<label for="examen" class="form-label">Examen</label>
<select id="examen" name="examen" class="form-select" required onchange="actualizarCertificaciones()">
<option value="">Selecciona un examen</option>
</select>
</div>
<!-- Certificación -->
<div class="col-md-4">
<label for="certificacion" class="form-label">Certificación</label>
<select id="certificacion" name="certificacion" class="form-select" required>
<option value="">Selecciona una certificación</option>
</select>
<div class="col-md-4">
<label for="certificacion" class="form-label">Certificación</label>
<select id="certificacion" name="certificacion" class="form-select" required>
<option value="">Selecciona una certificación</option>
</select>
</div>
<div class="col-md-6">
<label for="hora" class="form-label">Hora de entrada</label>
<select class="form-select" id="hora" name="h_entrada">
<option value="">Selecciona una hora</option>
<option value="09:00">09:00 AM</option>
<option value="10:00">10:00 AM</option>
<option value="11:00">11:00 AM</option>
</select>
</div>
<div class="col-md-3">
<label for="fecha" class="form-label">Fecha</label>
<input type="date" class="form-control" id="fecha" name="fecha" required>
</div>
</div>
<div class="mt-4 text-end">
<button type="submit" class="btn btn-primary">Enviar registro</button>
</div>
</form>
</div>
</div>
<!-- Modal de confirmación -->
<div class="modal fade" id="modalConfirmacion" tabindex="-1" aria-labelledby="modalConfirmacionLabel" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered">
<div class="modal-content">
<div class="modal-header bg-success text-white">
<h5 class="modal-title" id="modalConfirmacionLabel">¡Registro exitoso!</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Cerrar"></button>
</div>
<div class="modal-body text-center">
<!-- Aquí se mostrará el mensaje dinámico -->
<p id="mensajeConfirmacion" class="fs-5 fw-bold">Registro exitoso. Bienvenido a LANIA 😊</p>
</div>
<div class="modal-footer justify-content-center">
<button type="button" class="btn btn-success" data-bs-dismiss="modal">Aceptar</button>
</div>
</div>
</div>
</div>
<script>
const correoInput = document.getElementById('correo');
const sugerenciasDiv = document.getElementById('sugerencias-correo');
const dominios = ['@gmail.com', '@outlook.com', '@hotmail.com', '@lania.mx'];
correoInput.addEventListener('input', () => {
const valor = correoInput.value.trim();
sugerenciasDiv.innerHTML = '';
if (valor && !valor.includes('@')) {
dominios.forEach(dominio => {
const sugerencia = document.createElement('div');
sugerencia.classList.add('list-group-item', 'list-group-item-action');
sugerencia.textContent = valor + dominio;
sugerencia.onclick = () => {
correoInput.value = sugerencia.textContent;
sugerenciasDiv.innerHTML = '';
};
sugerenciasDiv.appendChild(sugerencia);
});
}
});
document.addEventListener('click', (e) => {
if (!sugerenciasDiv.contains(e.target) && e.target !== correoInput) {
sugerenciasDiv.innerHTML = '';
}
});
const datos = {
Microsoft: {
"AZ-900": ["Fundamentals", "Associate"],
@ -226,38 +257,32 @@ document.addEventListener('click', (e) => {
});
}
}
const form = document.getElementById('registroForm'); // Asegúrate que el formulario tenga este ID
if (form) {
form.addEventListener('submit', function(e) {
const fecha = document.getElementById('fecha').value;
const hora = document.getElementById('hora').value;
alert(`El examen está programado para el día ${fecha} a las ${hora} y recuerda llegar 15min antes.`);
// No usamos preventDefault, así que el formulario se envía normalmente
document.getElementById("registroForm").addEventListener("submit", function(e) {
e.preventDefault(); // Evitar el envío predeterminado del formulario
const form = e.target;
const formData = new FormData(form);
fetch("model/login.php", {
method: "POST",
body: formData
})
.then(response => response.text())
.then(data => {
// Mostrar el modal de confirmación
const modalConfirmacion = new bootstrap.Modal(document.getElementById('modalConfirmacion'));
modalConfirmacion.show();
form.reset(); // Reiniciar el formulario
})
.catch(error => {
console.error("Error al enviar:", error);
alert("Ocurrió un error al registrar la entrada.");
});
}
});
</script>
<div class="col-md-6">
<label for="hora" class="form-label">Hora de entrada</label>
<select class="form-select" id="hora" name="h_entrada" required>
<option value="">Selecciona una hora</option>
<option value="09:00">09:00 AM</option>
<option value="10:00">10:00 AM</option>
<option value="11:00">11:00 AM</option>
</select>
</div>
<div class="col-md-3">
<label for="fecha" class="form-label">Fecha</label>
<input type="date" class="form-control" id="fecha" name="fecha" required>
</div>
</div>
<div class="mt-4 text-end">
<button type="submit" class="btn btn-primary">Enviar registro</button>
</div>
</form>
</div>
</div>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
</body>
</html>
</html>

16
model/login.php
View File

@ -6,26 +6,24 @@ if ($_SERVER["REQUEST_METHOD"] === "POST") {
$correo = $_POST['correo'] ?? '';
$telefono = $_POST['telefono'] ?? '';
$genero = $_POST['genero'] ?? '';
$edad = $_POST['edad'] ?? '';
$estado_procedencia = $_POST['estado_procedencia'] ?? '';
$identificacion = $_POST['identificacion'] ?? '';
$empresa = $_POST['empresa'] ?? '';
$examen = $_POST['examen'] ?? '';
$certificacion = $_POST['certificacion'] ?? '';
$hora_entrada = $_POST['h_entrada'] ?: date("H:i:s"); // si no se proporciona, toma hora actual
$fecha = $_POST['fecha'] ?: date("Y-m-d"); // si no se proporciona, toma fecha actual
$sql = "INSERT INTO entrada (nombre, correo, telefono, genero, empresa, examen, certificacion, h_entrada, fecha)
VALUES (?, ?, ?, ?, ?, ?, ?, ?, ?)";
$sql = "INSERT INTO entrada (nombre, correo, telefono, genero, edad, estado_procedencia, identificacion, empresa, examen, certificacion, h_entrada, fecha)
VALUES (?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?)";
$stmt = $conexion->prepare($sql);
if ($stmt === false) {
die("Error en la preparación: " . $conexion->error);
}
$stmt->bind_param("sssssssss", $nombre, $correo, $telefono, $genero, $empresa, $examen, $certificacion, $hora_entrada, $fecha);
$stmt->bind_param("ssssssssssss", $nombre, $correo, $telefono, $genero, $edad, $estado_procedencia, $identificacion, $empresa, $examen, $certificacion, $hora_entrada, $fecha);
if ($stmt->execute()) {
header("Location: ../FormularioInicial.php?exito=1");
exit;
echo "Entrada guardada correctamente.";
} else {
echo "Error al guardar: " . $stmt->error;
}