root
116 lines
4.2 KiB
PHP
116 lines
4.2 KiB
PHP
<?= $this->extend('layout/register_layout') ?>
|
|
<?= $this->section('content') ?>
|
|
<div class="registration-form container mt-5 mb-5">
|
|
|
|
<form id="loginForm" method="post" action="<?= base_url('/user/login') ?>">
|
|
<?= csrf_field() ?>
|
|
<input type="hidden" name="redirect_to" value="<?= esc(old('redirect_to', $redirect_to ?? '')) ?>">
|
|
<div class="text-center mb-4">
|
|
<a href="<?= base_url('/') ?>">
|
|
<img src="<?= base_url('assets/images/alrahma_logo.png') ?>" alt=""
|
|
style="width: 180px; height: 120px;">
|
|
</a>
|
|
</div>
|
|
|
|
<h3 class="text-center text-success" style="font-family: Arial, sans-serif;">Login to Your Account</h3>
|
|
<br>
|
|
<!-- Email Field -->
|
|
<div class="form-group mb-3">
|
|
<label for="email" class="form-label"></label>
|
|
<input type="email" class="form-control item" id="email" name="email"
|
|
placeholder="Enter your email" maxlength="254" autocomplete="username"
|
|
inputmode="email" value="<?= old('email') ?>" required>
|
|
<div id="email-error" class="text-danger small mt-1"></div>
|
|
</div>
|
|
|
|
<!-- Password Field -->
|
|
<div class="form-group position-relative mb-4">
|
|
<label for="password" class="form-label"></label>
|
|
<input type="password"
|
|
class="form-control item pe-5"
|
|
id="password"
|
|
name="password"
|
|
placeholder="Enter your password"
|
|
maxlength="255"
|
|
autocomplete="current-password"
|
|
required>
|
|
<span class="position-absolute top-50 end-0 translate-middle-y me-3"
|
|
onclick="togglePasswordVisibility('password', this)"
|
|
style="cursor: pointer;">
|
|
<i class="fa-solid fa-eye"></i>
|
|
</span>
|
|
<div id="password-error" class="text-danger small mt-1"></div>
|
|
</div>
|
|
|
|
<!-- Submit Button -->
|
|
<div class="mb-3 d-grid">
|
|
<button type="submit" class="btn btn-success item">Login</button>
|
|
</div>
|
|
<!-- Flash Error Message -->
|
|
<?php if (session()->getFlashdata('error')): ?>
|
|
<div class="alert alert-danger mt-3 text-center" role="alert">
|
|
<?= esc(session()->getFlashdata('error')) ?>
|
|
</div>
|
|
<?php endif; ?>
|
|
<!-- Forgot Password -->
|
|
<div class="forgot-password text-center mt-3">
|
|
<a href="<?= base_url('user/forgot_password') ?>">Forgot Password?</a>
|
|
</div>
|
|
</form>
|
|
|
|
|
|
</div>
|
|
<?= $this->endSection() ?>
|
|
|
|
<?= $this->section('scripts') ?>
|
|
<script>
|
|
function togglePasswordVisibility(inputId, iconElement) {
|
|
const input = document.getElementById(inputId);
|
|
const icon = iconElement.querySelector('i');
|
|
|
|
if (input.type === 'password') {
|
|
input.type = 'text';
|
|
icon.classList.remove('fa-eye');
|
|
icon.classList.add('fa-eye-slash');
|
|
} else {
|
|
input.type = 'password';
|
|
icon.classList.remove('fa-eye-slash');
|
|
icon.classList.add('fa-eye');
|
|
}
|
|
}
|
|
|
|
document.getElementById('loginForm').addEventListener('submit', function(event) {
|
|
let isValid = true;
|
|
|
|
const email = document.getElementById('email').value.trim();
|
|
const password = document.getElementById('password').value.trim();
|
|
|
|
const emailError = document.getElementById('email-error');
|
|
const passwordError = document.getElementById('password-error');
|
|
|
|
const emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
|
|
|
|
if (!email) {
|
|
emailError.textContent = 'Email is required.';
|
|
isValid = false;
|
|
} else if (!emailRegex.test(email)) {
|
|
emailError.textContent = 'Please enter a valid email address.';
|
|
isValid = false;
|
|
} else {
|
|
emailError.textContent = '';
|
|
}
|
|
|
|
if (!password) {
|
|
passwordError.textContent = 'Password is required.';
|
|
isValid = false;
|
|
} else {
|
|
passwordError.textContent = '';
|
|
}
|
|
|
|
if (!isValid) {
|
|
event.preventDefault();
|
|
}
|
|
});
|
|
</script>
|
|
<?= $this->endSection() ?>
|