Alertas AJAX

This commit is contained in:
2025-05-15 11:33:04 -06:00
parent 1020e39da9
commit c44cfda3d8
5 changed files with 315 additions and 75 deletions

View File

@@ -82,6 +82,8 @@ function recuperar()
function enviarCodigo()
{
header('Content-Type: application/json');
$conn = getConnection();
// Obtener el correo proporcionado en el formulario
@@ -89,7 +91,8 @@ function enviarCodigo()
// Verificar si el correo es válido
if (!filter_var($email, FILTER_VALIDATE_EMAIL)) {
die("❌ Correo inválido.");
echo json_encode(['success' => false, 'message' => '❌ Correo inválido.']);
exit;
}
// Encriptar el correo ingresado para comparar con el de la base de datos
@@ -100,26 +103,41 @@ function enviarCodigo()
$stmt = sqlsrv_query($conn, $sql, [$emailEncrypted]);
if (!$stmt || !($row = sqlsrv_fetch_array($stmt, SQLSRV_FETCH_ASSOC))) {
die("❌ Correo no encontrado.");
echo json_encode(['success' => false, 'message' => '❌ Correo no encontrado.']);
exit;
}
// 🧠 Verificar si ya hay un código activo y no expirado
$now = date('Y-m-d H:i:s');
$sqlCheck = "SELECT COUNT(*) AS total FROM recuperacion_password
WHERE email = ? AND estatus = 0 AND expiracion > ?";
$checkStmt = sqlsrv_query($conn, $sqlCheck, [$emailEncrypted, $now]);
$checkRow = sqlsrv_fetch_array($checkStmt, SQLSRV_FETCH_ASSOC);
if ($checkRow['total'] > 0) {
echo json_encode(['success' => false, 'message' => '⚠️ Ya tienes un código activo. Revisa tu correo o espera 10 minutos.']);
exit;
}
// Generar el código de recuperación y la expiración
$codigo = rand(100000, 999999);
$codigo = strval(rand(100000, 999999)); // Convertir a string
$expira = date('Y-m-d H:i:s', strtotime('+10 minutes'));
$estatus = 0; // Estatus inicial
// Guardar el código y la expiración en la tabla de recuperación de contraseñas
$insert = "INSERT INTO recuperacion_password (email, codigo, expiracion) VALUES (?, ?, ?)";
$result = sqlsrv_query($conn, $insert, [$emailEncrypted, $codigo, $expira]);
$insert = "INSERT INTO recuperacion_password (email, codigo, expiracion, estatus) VALUES (?, ?, ?, ?)";
$params = [$emailEncrypted, $codigo, $expira, $estatus];
$result = sqlsrv_query($conn, $insert, $params);
if (!$result) {
die("❌ Error al guardar el código de recuperación.");
echo json_encode(['success' => false, 'message' => '❌ Error al guardar el código de recuperación.']);
exit;
}
// Enviar correo con el código utilizando PHPMailer
// Enviar correo con el código utilizando PHPMailer
try {
$mail = new PHPMailer(true);
// Configuración de servidor SMTP
// ConfigEuración de servidor SMTP
$mail->isSMTP();
$mail->Host = 'secure.emailsrvr.com';
$mail->SMTPAuth = true;
@@ -136,18 +154,17 @@ function enviarCodigo()
$mail->Subject = 'Código de recuperación de contraseña';
// Cuerpo del correo
$mail->Body = "
<div style='font-family: Segoe UI, sans-serif; background-color: #f4f6f9; padding: 40px;'>
$mail->Body = "<div style='font-family: Segoe UI, sans-serif; background-color: #f4f6f9; padding: 40px;'>
<div style='max-width: 600px; margin: auto; background: #fff; border: 1px solid #ddd; border-radius: 10px; overflow: hidden;'>
<div style='background: linear-gradient(to right, #003366, #0055A5); padding: 20px; text-align: center;'>
<h2 style='color: white;'>Recupera tu contraseña</h2>
</div>
<div style='padding: 30px; color: #333; font-size: 16px;'>
<p>Hola,</p>
<p>Has solicitado recuperar tu contraseña. Aquí está tu código de recuperación:</p>
<p>Has solicitado recuperar tu contraseña. Aquí está tu código:</p>
<h3 style='font-size: 24px; color: #0055A5;'>$codigo</h3>
<p>Este código expira en 10 minutos.</p>
<p>Si no solicitaste este código, por favor ignora este correo.</p>
<p>Si no lo solicitaste, ignora este mensaje.</p>
</div>
<div style='background: #e9ecef; text-align: center; padding: 15px; font-size: 13px; color: #666;'>
&copy; " . date('Y') . " SIIH · Desarrollado por AduanaSoft
@@ -159,11 +176,14 @@ function enviarCodigo()
$mail->send();
} catch (Exception $e) {
error_log("Error al enviar correo: {$mail->ErrorInfo}");
die("❌ Hubo un error al enviar el correo. Intenta más tarde.");
echo json_encode(['success' => false, 'message' => '❌ Hubo un error al enviar el correo. Intenta más tarde.']);
exit;
}
$_SESSION['email_recuperacion'] = $email;
header('Location: /IMPORTADORES/login/verificarCodigoVista');
$_SESSION['email_recuperacion'] = $email; // email sin cifrar
$_SESSION['intentos_codigo'] = 0; // Inicializa intentos
echo json_encode(['success' => true, 'message' => '✅ Código enviado correctamente. Revisa tu correo.']);
exit;
}
@@ -174,33 +194,65 @@ function verificarCodigoVista()
function verificarCodigo()
{
header('Content-Type: application/json');
$conn = getConnection();
$codigo = $_POST['codigo'] ?? '';
$codigo = trim($_POST['codigo'] ?? '');
$email = $_SESSION['email_recuperacion'] ?? '';
if (!$codigo || !$email) {
die("❌ Código o correo faltante.");
echo json_encode(['success' => false, 'message' => '❌ Código o correo faltante.']);
exit;
}
// Encriptar el correo ingresado
$emailEncrypted = encrypt($email);
// Consultar el código de recuperación y su expiración desde la base de datos
$sql = "SELECT codigo, expiracion FROM recuperacion_password WHERE email = ? ORDER BY id DESC";
$sql = "SELECT id, codigo, expiracion FROM recuperacion_password
WHERE email = ? AND estatus = 0 ORDER BY id DESC";
$stmt = sqlsrv_query($conn, $sql, [$emailEncrypted]);
$row = sqlsrv_fetch_array($stmt, SQLSRV_FETCH_ASSOC);
if (!$row || $codigo != $row['codigo']) {
die("❌ Código incorrecto.");
if (!$row) {
echo json_encode(['success' => false, 'message' => '❌ Código no encontrado o ya usado.']);
exit;
}
if (strtotime($row['expiracion']->format('Y-m-d H:i:s')) < time()) {
die("⏰ El código ha expirado.");
// Manejo de intentos fallidos
$_SESSION['intentos_codigo'] = ($_SESSION['intentos_codigo'] ?? 0) + 1;
if ($_SESSION['intentos_codigo'] > 5) {
$update = "UPDATE recuperacion_password SET estatus = 1 WHERE id = ?";
sqlsrv_query($conn, $update, [$row['id']]);
unset($_SESSION['intentos_codigo']);
echo json_encode(['success' => false, 'message' => '🚫 Has excedido el número de intentos. Solicita un nuevo código.']);
exit;
}
$_SESSION['recuperacion_autorizada'] = true;
header('Location: /IMPORTADORES/login/cambiarPasswordVista');
if ($codigo != $row['codigo']) {
echo json_encode(['success' => false, 'message' => '❌ Código incorrecto. Intento {$_SESSION["intentos_codigo"]} de 5.']);
exit;
}
// Validar expiración
$expiracionTimestamp = strtotime($row['expiracion']->format('Y-m-d H:i:s'));
if ($expiracionTimestamp < time()) {
$update = "UPDATE recuperacion_password SET estatus = 1 WHERE id = ?";
sqlsrv_query($conn, $update, [$row['id']]);
echo json_encode(['success' => false, 'message' => '⏰ El código ha expirado.']);
exit;
}
// ✅ Código correcto
$update = "UPDATE recuperacion_password SET estatus = 1 WHERE id = ?";
sqlsrv_query($conn, $update, [$row['id']]);
// Habilitar cambio de contraseña
$_SESSION['recuperacion_autorizada'] = true;
unset($_SESSION['intentos_codigo']);
echo json_encode(['success' => true, 'message' => '✅ Código verificado. Redirigiendo...']);
exit;
}
@@ -219,7 +271,8 @@ function cambiarPasswordVista()
function cambiarPassword()
{
if (!isset($_SESSION['recuperacion_autorizada']) || !isset($_SESSION['email_recuperacion'])) {
die("⚠️ Acceso no autorizado.");
echo "⚠️ Acceso no autorizado.";
return;
}
$conn = getConnection();
@@ -228,11 +281,13 @@ function cambiarPassword()
// Validaciones
if (strlen($password) < 6) {
die("❌ La contraseña debe tener al menos 6 caracteres.");
echo "❌ La contraseña debe tener al menos 6 caracteres.";
return;
}
if ($password !== $confirmar) {
die("❌ Las contraseñas no coinciden.");
echo "❌ Las contraseñas no coinciden.";
return;
}
$email = $_SESSION['email_recuperacion'];
@@ -246,10 +301,21 @@ function cambiarPassword()
$stmt = sqlsrv_prepare($conn, $sql, [$hash, $emailEncrypted]);
if (!$stmt || !sqlsrv_execute($stmt)) {
die("❌ Error al actualizar la contraseña. Intenta nuevamente.");
echo "❌ Error al actualizar la contraseña. Intenta nuevamente.";
return;
}
// Enviar correo de confirmación
// Obtener ID de usuario para registrar en bitácora
$sqlUsuario = "SELECT id_usuario FROM usuarios_sistema WHERE email = ?";
$stmtUsuario = sqlsrv_query($conn, $sqlUsuario, [$emailEncrypted]);
$usuario = sqlsrv_fetch_array($stmtUsuario, SQLSRV_FETCH_ASSOC);
$idUsuario = $usuario['id_usuario'] ?? null;
// Registrar en bitácora
$ip = $_SERVER['REMOTE_ADDR'] ?? 'N/A';
registrarBitacora($conn, $idUsuario, $email, $ip, 1, 'Cambio de contraseña por recuperación');
// Enviar correo de confirmación
try {
$mail = new PHPMailer(true);
@@ -290,6 +356,8 @@ function cambiarPassword()
$mail->send();
} catch (Exception $e) {
error_log("Error al enviar correo de confirmación: {$mail->ErrorInfo}");
echo "❌ Hubo un error al enviar el correo. Intenta más tarde.";
return;
// No se detiene el proceso si falla el correo
}
@@ -297,7 +365,13 @@ function cambiarPassword()
unset($_SESSION['recuperacion_autorizada']);
unset($_SESSION['email_recuperacion']);
$_SESSION['login_success'] = 'Tu contraseña ha sido cambiada exitosamente. Inicia sesión.';
header('Location: /IMPORTADORES/login');
exit;
}
// Mostrar mensaje de éxito y redirigir
echo "<div style='font-family:Segoe UI, sans-serif; max-width:500px; margin:auto; padding:20px; text-align:center; border:1px solid #ccc; border-radius:8px; background-color:#f4f6f9;'>
<h2 style='color:green;'>✅ ¡Contraseña actualizada!</h2>
<p>Tu contraseña ha sido cambiada exitosamente.</p>
<p>Serás redirigido al login en breve...</p>
</div>
<script>
setTimeout(() => { window.location.href = '/IMPORTADORES/login'; }, 4000);
</script>";
}

View File

@@ -3,4 +3,7 @@ CREATE TABLE recuperacion_password (
email NVARCHAR(255) NOT NULL,
codigo NVARCHAR(10) NOT NULL,
expiracion DATETIME NOT NULL
);
);
ALTER TABLE recuperacion_password
ADD estatus INT NOT NULL DEFAULT 0;

View File

@@ -6,6 +6,11 @@ $color1 = explode(',', $config['colores_primarios'] ?? '#003366,#0055A5')
$color2 = explode(',', $config['colores_primarios'] ?? '#003366,#0055A5')[1];
$mantenimiento = $config['modo_mantenimiento'] ?? 0;
$mensajeMantenimiento = $config['mensaje_mantenimiento'] ?? 'El sistema se encuentra en mantenimiento temporal. Por favor, vuelve más tarde.';
if (!isset($_SESSION['recuperacion_autorizada'])) {
header('Location: /IMPORTADORES/login');
exit;
}
?>
<!DOCTYPE html>
@@ -119,31 +124,46 @@ $mensajeMantenimiento = $config['mensaje_mantenimiento'] ?? 'El sistema se encue
<!-- Formulario de cambio de contraseña -->
<div class="login-container">
<h4 class="mb-4 text-center" style="color:<?= $color1 ?>">Cambiar contraseña</h4>
<h4 class="mb-4 text-center" style="color:<?= $color1 ?>">Cambiar contraseña</h4>
<form id="formNueva" action="/IMPORTADORES/login/cambiarPassword" method="POST">
<div class="mb-3">
<label class="form-label">Nueva contraseña:</label>
<input type="password" name="password" required class="form-control" minlength="6" autocomplete="new-password">
</div>
<div class="mb-3">
<label class="form-label">Confirmar contraseña:</label>
<input type="password" name="confirmar" required class="form-control">
</div>
<button type="submit" class="btn btn-warning w-100">Actualizar contraseña</button>
</form>
<form action="/IMPORTADORES/login/cambiarPassword" method="POST">
<div class="mb-3">
<label class="form-label">Nueva contraseña:</label>
<input type="password" name="password" required class="form-control">
</div>
<?php if (isset($_SESSION['cambio_error'])): ?>
<div class="text-danger mt-3"><?= $_SESSION['cambio_error'] ?></div>
<?php unset($_SESSION['cambio_error']); ?>
<?php endif; ?>
<div class="mb-3">
<label class="form-label">Confirmar contraseña:</label>
<input type="password" name="confirmar" required class="form-control">
</div>
<button type="submit" class="btn btn-warning w-100">Cambiar contraseña</button>
<?php if (isset($_SESSION['cambiar_error'])): ?>
<div class="text-danger mt-2"><?= $_SESSION['cambiar_error'] ?></div>
<?php unset($_SESSION['cambiar_error']); endif; ?>
</form>
</div>
<?php if (isset($_SESSION['cambio_exito'])): ?>
<div class="text-success mt-3"><?= $_SESSION['cambio_exito'] ?></div>
<?php unset($_SESSION['cambio_exito']); ?>
<?php endif; ?>
</div>
<!-- FOOTER -->
<footer class="fixed-bottom">
&copy; <?= date('Y') ?> <?= htmlspecialchars($siglas) ?> · <?= htmlspecialchars($nombre) ?>
</footer>
<script>
document.getElementById('formNueva').addEventListener('submit', function(e) {
const pass = this.password.value;
const confirm = this.confirmar.value;
if (pass !== confirm) {
e.preventDefault();
alert('❌ Las contraseñas no coinciden.');
}
});
</script>
</body>
</html>

View File

@@ -120,16 +120,25 @@ $mensajeMantenimiento = $config['mensaje_mantenimiento'] ?? 'El sistema se encue
<!-- Formulario de recuperación de contraseña -->
<div class="login-container">
<h4 class="mb-4 text-center text-dark">Recuperar Contraseña</h4>
<form action="/IMPORTADORES/login/enviarCodigo" method="POST">
<form id="formRecuperar" novalidate>
<div class="mb-3">
<label class="form-label">Ingresa tu correo</label>
<input type="email" name="email" class="form-control" required>
<label class="form-label" for="emailInput">Ingresa tu correo</label>
<input type="email" id="emailInput" name="email" class="form-control" required>
</div>
<button type="submit" class="btn btn-primary">Enviar código</button>
<?php if (isset($_SESSION['recuperar_error'])): ?>
<div class="text-danger"><?= $_SESSION['recuperar_error'] ?></div>
<?php unset($_SESSION['recuperar_error']); endif; ?>
<button type="submit" class="btn btn-primary w-100">Enviar código</button>
</form>
<?php if (isset($_SESSION['recuperar_error'])): ?>
<div class="text-danger mt-3 text-center"><?= htmlspecialchars($_SESSION['recuperar_error']) ?></div>
<?php unset($_SESSION['recuperar_error']); ?>
<?php endif; ?>
<?php if (isset($_SESSION['recuperar_exito'])): ?>
<div class="text-success mt-3 text-center"><?= htmlspecialchars($_SESSION['recuperar_exito']) ?></div>
<?php unset($_SESSION['recuperar_exito']); ?>
<?php endif; ?>
<div id="mensaje" class="mt-3 text-center fw-bold"></div>
</div>
<!-- FOOTER -->
@@ -137,5 +146,61 @@ $mensajeMantenimiento = $config['mensaje_mantenimiento'] ?? 'El sistema se encue
&copy; <?= date('Y') ?> <?= htmlspecialchars($siglas) ?> · <?= htmlspecialchars($nombre) ?>
</footer>
<script>
document.addEventListener('DOMContentLoaded', function () {
const form = document.getElementById('formRecuperar');
const mensaje = document.getElementById('mensaje');
const inputCorreo = form.querySelector('input[name="email"]');
inputCorreo.addEventListener('input', () => {
mensaje.innerHTML = '';
mensaje.classList.remove("text-danger", "text-success");
});
form.addEventListener('submit', function(e) {
e.preventDefault();
const emailValue = inputCorreo.value.trim();
if (!emailValue) {
mensaje.textContent = "❌ Por favor, ingresa un correo válido.";
mensaje.classList.add("text-danger");
return;
}
const formData = new FormData();
formData.append('email', emailValue);
fetch('/IMPORTADORES/login/enviarCodigo', {
method: 'POST',
body: formData
})
.then(response => response.json())
.then(data => {
// Esperamos que el backend devuelva JSON con { success: true/false, message: "..." }
if (data.success) {
mensaje.textContent = data.message;
mensaje.classList.remove("text-danger");
mensaje.classList.add("text-success");
// Opcional: redirigir a la vista de verificación de código
setTimeout(() => {
window.location.href = '/IMPORTADORES/login/verificarCodigoVista';
}, 2000);
} else {
mensaje.textContent = "❌ " + data.message;
mensaje.classList.remove("text-success");
mensaje.classList.add("text-danger");
}
})
.catch(() => {
mensaje.textContent = "❌ Error de red.";
mensaje.classList.remove("text-success");
mensaje.classList.add("text-danger");
});
});
});
</script>
</body>
</html>

View File

@@ -24,7 +24,7 @@ $mensajeMantenimiento = $config['mensaje_mantenimiento'] ?? 'El sistema se encue
background-color: #f4f6f9;
font-family: 'Segoe UI', sans-serif;
position: relative;
height: 100vh;
min-height: 100vh;
}
.navbar {
@@ -67,13 +67,22 @@ $mensajeMantenimiento = $config['mensaje_mantenimiento'] ?? 'El sistema se encue
/* Contenedor de fondo semitransparente para las vistas */
.overlay {
position: absolute;
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.5);
z-index: 5;
pointer-events: none; /* Para que no interfiera con los clics */
}
#mensaje {
transition: opacity 0.3s ease;
}
@media (max-height: 600px) {
footer {
position: static !important;
}
}
</style>
</head>
@@ -119,26 +128,95 @@ $mensajeMantenimiento = $config['mensaje_mantenimiento'] ?? 'El sistema se encue
<!-- Formulario de validación de código -->
<div class="login-container">
<h4 class="mb-4 text-center" style="color:<?= $color1 ?>">Verificar código</h4>
<h4 class="mb-4 text-center text-dark">Verifica tu código</h4>
<form action="/IMPORTADORES/login/verificarCodigo" method="POST">
<div class="mb-3">
<label class="form-label">Ingresa el código recibido:</label>
<input type="text" name="codigo" required class="form-control">
</div>
<?php
if (!isset($_SESSION['email_recuperacion'])) {
// Si no hay correo en sesión, redirige a solicitar código
header('Location: /IMPORTADORES/login/recuperar');
exit;
}
?>
<!-- Formulario para verificar el código -->
<form id="formCodigo" action="/IMPORTADORES/login/verificarCodigo" method="POST">
<div class="mb-3">
<label class="form-label" for="codigo">Código recibido por correo</label>
<input type="text" id="codigo" name="codigo" class="form-control" required pattern="\d{6}" maxlength="6" placeholder="Ej. 123456">
</div>
<button type="submit" class="btn btn-primary w-100">Verificar código</button>
</form>
<button type="submit" class="btn btn-success w-100">Verificar</button>
<?php if (isset($_SESSION['codigo_error'])): ?>
<div class="text-danger mt-2"><?= $_SESSION['codigo_error'] ?></div>
<?php unset($_SESSION['codigo_error']); endif; ?>
</form>
<!-- Mostrar mensajes -->
<div id="mensaje" class="mt-3 text-center fw-bold">
<?php if (isset($_SESSION['codigo_error'])): ?>
<div class="text-danger"><?= $_SESSION['codigo_error'] ?></div>
<?php unset($_SESSION['codigo_error']); ?>
<?php elseif (isset($_SESSION['codigo_exito'])): ?>
<div class="text-success"><?= $_SESSION['codigo_exito'] ?></div>
<?php unset($_SESSION['codigo_exito']); ?>
<?php endif; ?>
</div>
</div>
<!-- FOOTER -->
<footer class="fixed-bottom">
&copy; <?= date('Y') ?> <?= htmlspecialchars($siglas) ?> · <?= htmlspecialchars($nombre) ?>
</footer>
<script>
document.addEventListener('DOMContentLoaded', function () {
const form = document.getElementById('formCodigo');
const mensaje = document.getElementById('mensaje');
const inputCodigo = form.querySelector('input[name="codigo"]');
inputCodigo.addEventListener('input', () => {
mensaje.innerHTML = '';
mensaje.classList.remove("text-danger", "text-success");
});
form.addEventListener('submit', function(e) {
e.preventDefault();
const codigo = inputCodigo.value.trim();
if (!codigo || codigo.length !== 6) {
mensaje.textContent = "❌ Ingresa un código de 6 dígitos.";
mensaje.classList.add("text-danger");
return;
}
const formData = new FormData();
formData.append('codigo', codigo);
fetch('/IMPORTADORES/login/verificarCodigo', {
method: 'POST',
body: formData,
credentials: 'same-origin' // ✅ Importante para mantener sesión
})
.then(response => response.json())
.then(data => {
if (data.success) {
mensaje.textContent = data.message;
mensaje.classList.remove("text-danger");
mensaje.classList.add("text-success");
// Redirigir al formulario de cambio de contraseña
setTimeout(() => {
window.location.href = '/IMPORTADORES/login/cambiarPasswordVista';
}, 1500);
} else {
mensaje.textContent = "❌ " + data.message;
mensaje.classList.remove("text-success");
mensaje.classList.add("text-danger");
}
})
.catch(() => {
mensaje.textContent = "❌ Error al verificar el código.";
mensaje.classList.remove("text-success");
mensaje.classList.add("text-danger");
});
});
});
</script>
</body>
</html>