96 lines
4.5 KiB
PHP
96 lines
4.5 KiB
PHP
<!DOCTYPE html>
|
|
<html lang="{{ str_replace('_', '-', app()->getLocale()) }}">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
<meta name="description" content="Sign in to {{ config('app.name', 'Systems Helpdesk') }} to manage helpdesk tickets and support requests.">
|
|
<meta name="theme-color" content="#0b1220">
|
|
<title>{{ __('Log in') }} - {{ config('app.name', 'Systems Helpdesk') }}</title>
|
|
<link rel="icon" type="image/png" sizes="32x32" href="{{ asset('favicon-32x32.png') }}">
|
|
<link rel="apple-touch-icon" sizes="180x180" href="{{ asset('apple-touch-icon.png') }}">
|
|
@vite('resources/themes/backend/assets/css/auth.css')
|
|
</head>
|
|
<body>
|
|
<main class="auth-main">
|
|
<div class="auth-wrap">
|
|
<a class="auth-brand" href="{{ route('home') }}" aria-label="{{ config('app.name', 'Systems Helpdesk') }}">
|
|
<img src="{{ asset('favicon-32x32.png') }}" width="48" height="48" alt="">
|
|
</a>
|
|
|
|
<section class="auth-card" aria-labelledby="login-heading">
|
|
<h1 id="login-heading">{{ __('Log in to your account') }}</h1>
|
|
<p class="auth-subtitle">{{ __('Enter your email and password below to log in') }}</p>
|
|
|
|
@if (session('status'))
|
|
<div class="status" role="status">{{ session('status') }}</div>
|
|
@endif
|
|
|
|
<div id="passkey-area" hidden>
|
|
<button id="passkey-button" class="btn btn-passkey" type="button">{{ __('Sign in with a passkey') }}</button>
|
|
<p id="passkey-error" class="error passkey-error" role="alert" hidden></p>
|
|
<div class="divider"><span>{{ __('Or continue with email') }}</span></div>
|
|
</div>
|
|
|
|
<form method="POST" action="{{ route('login.store') }}">
|
|
@csrf
|
|
<div class="field">
|
|
<label for="email">{{ __('Email address') }}</label>
|
|
<input id="email" name="email" value="{{ old('email') }}" type="email" required autofocus autocomplete="email" inputmode="email">
|
|
@error('email')<p class="error">{{ $message }}</p>@enderror
|
|
</div>
|
|
|
|
<div class="field">
|
|
<div class="field-row">
|
|
<label for="password">{{ __('Password') }}</label>
|
|
@if (Route::has('password.request'))
|
|
<a class="link" href="{{ route('password.request') }}">{{ __('Forgot your password?') }}</a>
|
|
@endif
|
|
</div>
|
|
<input id="password" name="password" type="password" required autocomplete="current-password">
|
|
@error('password')<p class="error">{{ $message }}</p>@enderror
|
|
</div>
|
|
|
|
<div class="field">
|
|
<label class="remember"><input name="remember" type="checkbox" value="1" @checked(old('remember'))> <span>{{ __('Remember me') }}</span></label>
|
|
</div>
|
|
|
|
<button class="btn btn-primary" type="submit" data-test="login-button">{{ __('Log in') }}</button>
|
|
</form>
|
|
|
|
@if (Route::has('register'))
|
|
<p class="signup">{{ __('Don\'t have an account?') }} <a class="link" href="{{ route('register') }}">{{ __('Sign up') }}</a></p>
|
|
@endif
|
|
</section>
|
|
</div>
|
|
</main>
|
|
|
|
@vite('resources/themes/backend/assets/js/passkeys.js')
|
|
<script>
|
|
window.addEventListener('passkeys:ready', () => {
|
|
const area = document.getElementById('passkey-area');
|
|
const button = document.getElementById('passkey-button');
|
|
const error = document.getElementById('passkey-error');
|
|
if (!window.Passkeys?.isSupported?.()) return;
|
|
area.hidden = false;
|
|
button.addEventListener('click', async () => {
|
|
button.disabled = true;
|
|
button.textContent = @json(__('Authenticating...'));
|
|
error.hidden = true;
|
|
try {
|
|
const response = await window.Passkeys.verify({routes:{options:@json(route('passkey.login-options')),submit:@json(route('passkey.login'))}});
|
|
window.location.assign(response.redirect || @json(route('dashboard')));
|
|
} catch (e) {
|
|
if (e?.constructor?.name !== 'UserCancelledError') {
|
|
error.textContent = e?.message || @json(__('Passkey authentication failed.'));
|
|
error.hidden = false;
|
|
}
|
|
} finally {
|
|
button.disabled = false;
|
|
button.textContent = @json(__('Sign in with a passkey'));
|
|
}
|
|
});
|
|
});
|
|
</script>
|
|
</body>
|
|
</html>
|