108 lines
3.8 KiB
PHP
108 lines
3.8 KiB
PHP
<?php
|
|
session_start();
|
|
|
|
// If already logged in, redirect to dashboard
|
|
if (isset($_SESSION['role'])) {
|
|
header('Location: index.php');
|
|
exit();
|
|
}
|
|
|
|
include 'partials/header.php';
|
|
?>
|
|
|
|
<div class="container-fluid login-container">
|
|
<div class="card shadow-lg login-card p-4">
|
|
<div class="card-body">
|
|
<div class="text-center mb-4">
|
|
<i class="bi-building fs-1" style="color: var(--primary-color);"></i>
|
|
<h1 class="h3 mb-3 fw-bold">Providencia ERP</h1>
|
|
<p class="text-muted">Please sign in to continue</p>
|
|
</div>
|
|
|
|
<div id="error-message" class="alert alert-danger" style="display: none;"></div>
|
|
|
|
<form id="login-form">
|
|
<div class="form-floating mb-3">
|
|
<input type="email" class="form-control" id="email" name="email" placeholder="name@example.com" required>
|
|
<label for="email">Email address</label>
|
|
</div>
|
|
<div class="form-floating mb-3">
|
|
<input type="password" class="form-control" id="password" name="password" placeholder="Password" required>
|
|
<label for="password">Password</label>
|
|
</div>
|
|
|
|
<div class="d-grid">
|
|
<button class="btn btn-primary btn-lg" type="submit" id="submit-btn">
|
|
<span id="btn-text">Sign in</span>
|
|
<span id="btn-spinner" class="spinner-border spinner-border-sm" style="display: none;" role="status" aria-hidden="true"></span>
|
|
</button>
|
|
</div>
|
|
</form>
|
|
<div class="mt-3 text-center">
|
|
<small class="text-muted">Hint: Try one of these emails with the password 'password':<br>
|
|
accountant@example.com<br>
|
|
secretary@example.com<br>
|
|
headteacher@example.com
|
|
</small>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<script>
|
|
document.getElementById('login-form').addEventListener('submit', async function(e) {
|
|
e.preventDefault();
|
|
|
|
const email = document.getElementById('email').value;
|
|
const password = document.getElementById('password').value;
|
|
const errorDiv = document.getElementById('error-message');
|
|
const submitBtn = document.getElementById('submit-btn');
|
|
const btnText = document.getElementById('btn-text');
|
|
const btnSpinner = document.getElementById('btn-spinner');
|
|
|
|
// Hide error message
|
|
errorDiv.style.display = 'none';
|
|
|
|
// Disable button and show spinner
|
|
submitBtn.disabled = true;
|
|
btnText.style.display = 'none';
|
|
btnSpinner.style.display = 'inline-block';
|
|
|
|
try {
|
|
const response = await fetch('api/login.php', {
|
|
method: 'POST',
|
|
headers: {
|
|
'Content-Type': 'application/json'
|
|
},
|
|
body: JSON.stringify({ email, password })
|
|
});
|
|
|
|
const result = await response.json();
|
|
|
|
if (response.ok && result.success) {
|
|
// Successful login
|
|
window.location.href = 'index.php';
|
|
} else {
|
|
// Login failed
|
|
errorDiv.textContent = result.message || 'Invalid email or password.';
|
|
errorDiv.style.display = 'block';
|
|
|
|
// Re-enable button
|
|
submitBtn.disabled = false;
|
|
btnText.style.display = 'inline';
|
|
btnSpinner.style.display = 'none';
|
|
}
|
|
} catch (error) {
|
|
console.error('Login error:', error);
|
|
errorDiv.textContent = 'Failed to connect to the server. Please try again.';
|
|
errorDiv.style.display = 'block';
|
|
|
|
// Re-enable button
|
|
submitBtn.disabled = false;
|
|
btnText.style.display = 'inline';
|
|
btnSpinner.style.display = 'none';
|
|
}
|
|
});
|
|
</script>
|
|
|
|
<?php include 'partials/footer.php'; ?>
|