feat(login): membuat fitur login
This commit is contained in:
Yoga Pangestu
parent
e38d48f07b
commit
ebcc377718
55
app/Livewire/Auth/Login.php
Normal file
55
app/Livewire/Auth/Login.php
Normal file
@ -0,0 +1,55 @@
|
||||
<?php
|
||||
|
||||
namespace App\Livewire\Auth;
|
||||
|
||||
use App\Enums\UserStatus;
|
||||
use Livewire\Attributes\Layout;
|
||||
use Livewire\Attributes\Validate;
|
||||
use Livewire\Component;
|
||||
|
||||
#[Layout('components.layouts.auth', [
|
||||
'title' => 'Masuk Akun',
|
||||
])]
|
||||
class Login extends Component
|
||||
{
|
||||
#[Validate(['required', 'string'], attribute: 'nama pengguna atau alamat surel')]
|
||||
public string $login = '';
|
||||
|
||||
#[Validate('required', attribute: 'kata sandi')]
|
||||
public string $password = '';
|
||||
|
||||
public function auth()
|
||||
{
|
||||
$this->validate();
|
||||
|
||||
$identifier = filter_var($this->login, FILTER_VALIDATE_EMAIL) ? 'email' : 'username';
|
||||
|
||||
if (! auth()->attempt(
|
||||
[$identifier => $this->login, 'password' => $this->password],
|
||||
)) {
|
||||
$this->redirectRoute('login', navigate: true);
|
||||
|
||||
return;
|
||||
}
|
||||
|
||||
if (auth()->user()->status !== UserStatus::ACTIVE) {
|
||||
auth()->logout();
|
||||
|
||||
$this->redirectRoute('login', navigate: true);
|
||||
}
|
||||
|
||||
session()->regenerate();
|
||||
|
||||
$this->redirectIntended('/studio/dashboard/overview', navigate: true);
|
||||
}
|
||||
|
||||
public function updated(string $prop, string $value)
|
||||
{
|
||||
$this->validateOnly($prop);
|
||||
}
|
||||
|
||||
public function render()
|
||||
{
|
||||
return view('livewire.auth.login');
|
||||
}
|
||||
}
|
||||
19
resources/views/components/layouts/auth.blade.php
Normal file
19
resources/views/components/layouts/auth.blade.php
Normal file
@ -0,0 +1,19 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="{{ str_replace('_', '-', app()->getLocale()) }}">
|
||||
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>{{ $title }} | {{ config('app.name') }}</title>
|
||||
@vite(['resources/css/app.css', 'resources/js/app.js'])
|
||||
@fluxAppearance
|
||||
<link rel="preconnect" href="https://fonts.bunny.net">
|
||||
<link href="https://fonts.bunny.net/css?family=inter:400,500,600&display=swap" rel="stylesheet" />
|
||||
</head>
|
||||
|
||||
<body>
|
||||
{{ $slot }}
|
||||
@fluxScripts
|
||||
</body>
|
||||
|
||||
</html>
|
||||
58
resources/views/livewire/auth/login.blade.php
Normal file
58
resources/views/livewire/auth/login.blade.php
Normal file
@ -0,0 +1,58 @@
|
||||
<div class="flex min-h-screen">
|
||||
<div class="flex-1 flex justify-center items-center">
|
||||
<div class="w-80 md:w-100 space-y-6">
|
||||
<div class="flex justify-center opacity-50">
|
||||
<flux:brand href="{{ route('homepage') }}" name="Yadi Parfum" wire:navigate.hover>
|
||||
<x-slot name="logo">
|
||||
<div
|
||||
class="size-8 rounded shrink-0 bg-accent text-accent-foreground flex items-center justify-center">
|
||||
<i class="font-serif font-bold">YD</i>
|
||||
</div>
|
||||
</x-slot>
|
||||
</flux:brand>
|
||||
</div>
|
||||
|
||||
<flux:heading size="lg" class="mb-1">Selamat datang!</flux:heading>
|
||||
<flux:text>
|
||||
Silakan akses panel dengan memasukkan nama pengguna, alamat surel, dan kata sandi Anda.
|
||||
</flux:text>
|
||||
|
||||
<div class="flex flex-col gap-6">
|
||||
<flux:input wire:model.live.debounce.500ms="login" label="Nama pengguna atau alamat surel"
|
||||
type="text" placeholder="Masukkan nama pengguna atau alamat surel" autocomplete="off" />
|
||||
|
||||
<flux:field>
|
||||
<div class="mb-3 flex justify-between">
|
||||
<flux:label>Kata Sandi</flux:label>
|
||||
|
||||
<flux:link href="#" variant="subtle" class="text-sm">Lupa kata sandi?</flux:link>
|
||||
</div>
|
||||
|
||||
<flux:input wire:model.live.debounce.500ms="password" type="password"
|
||||
placeholder="Masukkan kata sandi" />
|
||||
|
||||
<flux:error name="password" />
|
||||
</flux:field>
|
||||
|
||||
<flux:button variant="primary" class="w-full cursor-pointer" wire:click="auth">Masuk</flux:button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="flex-1 p-4 max-lg:hidden">
|
||||
<div class="text-white relative rounded-lg h-full w-full bg-zinc-900 flex flex-col items-start justify-end p-16"
|
||||
style="background-image: url('/assets/images/cover.jpg'); background-size: cover">
|
||||
<div class="flex gap-2 mb-4">
|
||||
<flux:icon.star variant="solid" />
|
||||
<flux:icon.star variant="solid" />
|
||||
<flux:icon.star variant="solid" />
|
||||
<flux:icon.star variant="solid" />
|
||||
<flux:icon.star variant="solid" />
|
||||
</div>
|
||||
|
||||
<div class="mb-6 italic font-base text-3xl xl:text-4xl text-dark">
|
||||
Solusi terbaik untuk kebutuhan parfum Anda.
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -1,7 +1,12 @@
|
||||
<?php
|
||||
|
||||
use App\Livewire\Auth\Login;
|
||||
use Illuminate\Support\Facades\Route;
|
||||
|
||||
Route::get('/', function () {
|
||||
return view('welcome');
|
||||
})->name('homepage');
|
||||
|
||||
Route::middleware('guest')->prefix('auth')->group(function () {
|
||||
Route::get('login', Login::class)->name('login');
|
||||
});
|
||||
|
||||
Loading…
Reference in New Issue
Block a user