71 lines
3.5 KiB
PHP
71 lines
3.5 KiB
PHP
<?= $this->extend('layouts/v2-login') ?>
|
|
|
|
<?= $this->section('content') ?>
|
|
<div class="card w-full max-w-md bg-base-100/95 backdrop-blur-xl shadow-2xl border border-base-200" x-data="v2LoginForm">
|
|
<div class="card-body p-8">
|
|
<div class="text-center mb-8">
|
|
<div class="w-20 h-20 rounded-2xl bg-gradient-to-br from-primary to-secondary flex items-center justify-center shadow-2xl ring-4 ring-primary/20 mx-auto mb-4">
|
|
<img src="<?= base_url('assets/images/logo.png') ?>" alt="Logo" class="w-12 h-12" onerror="this.style.display='none'; this.parentElement.innerHTML='<i data-lucide=\'flask-conical\' class=\'w-10 h-10 text-white\'></i>'; lucide.createIcons();">
|
|
</div>
|
|
<h1 class="text-2xl font-bold text-base-content mb-2">Welcome to CLQMS</h1>
|
|
<p class="text-base-content/60 text-sm">Clinical Laboratory Quality Management</p>
|
|
</div>
|
|
|
|
<template x-if="error">
|
|
<div class="alert alert-error mb-6" x-transition>
|
|
<i data-lucide="alert-circle" class="w-5 h-5"></i>
|
|
<span x-text="error"></span>
|
|
</div>
|
|
</template>
|
|
|
|
<form @submit.prevent="submitLogin" class="space-y-5">
|
|
<div class="form-control w-full">
|
|
<label class="label"><span class="label-text font-medium">Username</span></label>
|
|
<input type="text" placeholder="Enter your username" class="input input-bordered w-full focus:input-primary" x-model="username" :disabled="isLoading" autofocus>
|
|
</div>
|
|
|
|
<div class="form-control w-full">
|
|
<label class="label"><span class="label-text font-medium">Password</span></label>
|
|
<input type="password" placeholder="Enter your password" class="input input-bordered w-full focus:input-primary" x-model="password" :disabled="isLoading">
|
|
</div>
|
|
|
|
<button type="submit" class="btn btn-primary btn-block shadow-lg shadow-primary/30 font-bold mt-6" :disabled="isLoading">
|
|
<span class="loading loading-spinner loading-sm" x-show="isLoading"></span>
|
|
<span x-show="!isLoading">Sign In</span>
|
|
<span x-show="isLoading">Signing in...</span>
|
|
<i data-lucide="arrow-right" class="w-4 h-4" x-show="!isLoading"></i>
|
|
</button>
|
|
</form>
|
|
|
|
<div class="divider text-xs text-base-content/30 my-6">SECURE CONNECTION</div>
|
|
<p class="text-center text-xs text-base-content/40">© <?= date('Y') ?> CLQMS - Laboratory Management</p>
|
|
</div>
|
|
</div>
|
|
<?= $this->endSection() ?>
|
|
|
|
<?= $this->section('script') ?>
|
|
<script>
|
|
document.addEventListener('alpine:init', () => {
|
|
Alpine.data('v2LoginForm', () => ({
|
|
username: '', password: '', isLoading: false, error: null,
|
|
async submitLogin() {
|
|
this.error = null;
|
|
if (!this.username.trim()) { this.error = 'Please enter username'; return; }
|
|
if (!this.password) { this.error = 'Please enter password'; return; }
|
|
this.isLoading = true;
|
|
try {
|
|
const res = await fetch('<?= site_url('api/auth/login') ?>', {
|
|
method: 'POST', headers: {'Content-Type':'application/json','Accept':'application/json'}, credentials: 'include',
|
|
body: JSON.stringify({ username: this.username.trim(), password: this.password })
|
|
});
|
|
const data = await res.json();
|
|
if (res.ok && data.status === 'success') window.location.href = '<?= site_url('v2') ?>';
|
|
else this.error = data.message || 'Invalid credentials';
|
|
} catch(e) { this.error = 'Connection error'; }
|
|
finally { this.isLoading = false; }
|
|
}
|
|
}));
|
|
});
|
|
</script>
|
|
<?= $this->endSection() ?>
|