136 lines
4.4 KiB
PHP
136 lines
4.4 KiB
PHP
@extends('layouts.auth')
|
|
|
|
@section('title', 'Login Admin — E-Learning RPL')
|
|
|
|
@section('content')
|
|
<link rel="stylesheet" href="{{ asset('css/login.css') }}">
|
|
|
|
<div class="shape shape-1"></div>
|
|
<div class="shape shape-2"></div>
|
|
<div class="shape shape-3"></div>
|
|
<div class="shape shape-4"></div>
|
|
<div class="shape shape-5"></div>
|
|
<div class="blob blob-1"></div>
|
|
<div class="blob blob-2"></div>
|
|
|
|
<div class="page-wrap">
|
|
|
|
{{-- LEFT --}}
|
|
<div class="left-panel">
|
|
<div class="left-logo">
|
|
<img src="{{ asset('images/logo/logosmk.png') }}" alt="Logo SMK">
|
|
</div>
|
|
<div class="school-tag">SMK Negeri 1 Tapen</div>
|
|
<div class="left-welcome">
|
|
Selamat<br>Datang!
|
|
<span>Rekayasa Perangkat Lunak</span>
|
|
</div>
|
|
<div class="left-divider"></div>
|
|
<p class="left-desc">
|
|
Kelola data jurusan RPL, publish challenge, dan pantau seluruh aktivitas di platform.
|
|
</p>
|
|
<a href="{{ route('landing-page') }}" class="btn-learn">Pelajari Platform</a>
|
|
</div>
|
|
|
|
{{-- RIGHT: Form Card --}}
|
|
<div>
|
|
<div class="form-card">
|
|
|
|
<div class="card-title-wrap">
|
|
<div class="role-badge"><span class="badge-dot"></span>Portal Admin</div>
|
|
<div class="card-title">Sign In</div>
|
|
<div class="title-underline"></div>
|
|
</div>
|
|
|
|
@if ($errors->any())
|
|
<div id="toast-error" class="toast-error">{{ $errors->first() }}</div>
|
|
@endif
|
|
|
|
<form method="POST" action="{{ route('admin.login.submit') }}" id="login-form">
|
|
@csrf
|
|
|
|
<div class="field-group">
|
|
<label class="field-label">Username</label>
|
|
<input type="text" name="username" id="field-identity" class="field-input"
|
|
placeholder="Masukkan username" required
|
|
value="{{ old('username') }}" autocomplete="username">
|
|
</div>
|
|
|
|
<div class="field-group">
|
|
<label class="field-label">Password</label>
|
|
<div class="field-wrap">
|
|
<input type="password" name="password" class="field-input password-input"
|
|
placeholder="Masukkan password" required autocomplete="current-password">
|
|
<button type="button" class="toggle-password" aria-label="Lihat password">
|
|
<img src="{{ asset('icons/show.svg') }}" class="eye-icon" alt="show">
|
|
</button>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="remember-row">
|
|
<input type="checkbox" class="remember-check" name="remember" id="remember"
|
|
{{ old('remember') ? 'checked' : '' }}>
|
|
<label class="remember-text" for="remember">Ingat saya</label>
|
|
</div>
|
|
|
|
<button type="submit" class="submit-btn">Masuk</button>
|
|
</form>
|
|
|
|
<hr class="card-divider">
|
|
|
|
<div class="other-portals">
|
|
<span>Login sebagai</span>
|
|
<a href="{{ route('siswa.login') }}">Siswa</a>
|
|
<span>·</span>
|
|
<a href="{{ route('guru.login') }}">Guru</a>
|
|
</div>
|
|
|
|
</div>
|
|
<a href="{{ route('landing-page') }}" class="back-link">← Kembali ke Landing Page</a>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<script>
|
|
document.addEventListener('DOMContentLoaded', function () {
|
|
const identityInput = document.getElementById('field-identity');
|
|
const rememberCheck = document.getElementById('remember');
|
|
const form = document.getElementById('login-form');
|
|
const toggleBtn = document.querySelector('.toggle-password');
|
|
const passwordInput = document.querySelector('.password-input');
|
|
const eyeIcon = toggleBtn?.querySelector('img');
|
|
const STORAGE_KEY = 'remember_username';
|
|
|
|
// Auto-fill dari localStorage jika tidak ada old() value
|
|
if (!identityInput.value) {
|
|
const saved = localStorage.getItem(STORAGE_KEY);
|
|
if (saved) {
|
|
identityInput.value = saved;
|
|
rememberCheck.checked = true;
|
|
}
|
|
}
|
|
|
|
// Simpan / hapus saat submit
|
|
form.addEventListener('submit', function () {
|
|
if (rememberCheck.checked) {
|
|
localStorage.setItem(STORAGE_KEY, identityInput.value);
|
|
} else {
|
|
localStorage.removeItem(STORAGE_KEY);
|
|
}
|
|
});
|
|
|
|
// Toggle password
|
|
toggleBtn?.addEventListener('click', () => {
|
|
const isVisible = passwordInput.type === 'text';
|
|
passwordInput.type = isVisible ? 'password' : 'text';
|
|
eyeIcon.src = isVisible
|
|
? "{{ asset('icons/show.svg') }}"
|
|
: "{{ asset('icons/hide.svg') }}";
|
|
});
|
|
|
|
// Auto remove toast
|
|
const toast = document.getElementById('toast-error');
|
|
if (toast) setTimeout(() => toast.remove(), 4000);
|
|
});
|
|
</script>
|
|
@endsection |