Files
2026-02-08 15:16:35 +07:00

80 lines
5.4 KiB
PHP

<x-app-layout>
<div class="max-w-3xl mx-auto space-y-6 pb-12">
{{-- Header Section --}}
<div class="flex items-center gap-4">
<a href="{{ route('admin.users.index') }}" class="p-3 bg-white border border-slate-200 rounded-2xl text-slate-400 hover:text-indigo-600 transition-all shadow-sm">
<i class="fas fa-arrow-left"></i>
</a>
<div>
<h2 class="text-2xl font-black text-slate-800 tracking-tight">Daftarkan Staf Baru</h2>
<p class="text-sm text-slate-500 font-medium italic">Tambahkan pengguna baru ke sistem earrin cats.</p>
</div>
</div>
{{-- Form Section --}}
<form action="{{ route('admin.users.store') }}" method="POST" class="bg-white border border-slate-200 rounded-[2.5rem] p-8 shadow-sm space-y-6">
@csrf
<div class="grid grid-cols-1 md:grid-cols-2 gap-6">
{{-- Nama Lengkap --}}
<div class="space-y-2">
<label class="text-[10px] font-black text-slate-400 uppercase tracking-widest ml-1">Nama Lengkap</label>
<input type="text" name="name" value="{{ old('name') }}" required placeholder="Contoh: Budi Santoso"
class="w-full px-4 py-3 bg-slate-50 border @error('name') border-red-500 @else border-slate-200 @enderror rounded-2xl text-sm font-bold text-slate-800 focus:ring-2 focus:ring-indigo-500 transition-all">
<x-input-error :messages="$errors->get('name')" class="mt-1" />
</div>
{{-- Alamat Email --}}
<div class="space-y-2">
<label class="text-[10px] font-black text-slate-400 uppercase tracking-widest ml-1">Alamat Email</label>
<input type="email" name="email" value="{{ old('email') }}" required placeholder="email@earrincats.com"
class="w-full px-4 py-3 bg-slate-50 border @error('email') border-red-500 @else border-slate-200 @enderror rounded-2xl text-sm font-bold text-slate-800 focus:ring-2 focus:ring-indigo-500 transition-all">
<x-input-error :messages="$errors->get('email')" class="mt-1" />
</div>
{{-- Nomor WhatsApp --}}
<div class="space-y-2">
<label class="text-[10px] font-black text-slate-400 uppercase tracking-widest ml-1">Nomor WhatsApp</label>
<input type="text" name="phone" value="{{ old('phone') }}" placeholder="0812..."
class="w-full px-4 py-3 bg-slate-50 border @error('phone') border-red-500 @else border-slate-200 @enderror rounded-2xl text-sm font-bold text-slate-800 focus:ring-2 focus:ring-indigo-500 transition-all">
<x-input-error :messages="$errors->get('phone')" class="mt-1" />
</div>
{{-- Otoritas (Role) - SEKARANG DINAMIS --}}
<div class="space-y-2">
<label class="text-[10px] font-black text-slate-400 uppercase tracking-widest ml-1">Otoritas (Role)</label>
<select name="role_id" required class="w-full px-4 py-3 bg-slate-50 border @error('role_id') border-red-500 @else border-slate-200 @enderror rounded-2xl text-sm font-black text-indigo-600 uppercase focus:ring-2 focus:ring-indigo-500 transition-all cursor-pointer">
<option value="" disabled selected>Pilih Otoritas</option>
@foreach($roles as $role)
<option value="{{ $role->id }}" {{ old('role_id') == $role->id ? 'selected' : '' }}>
{{ strtoupper($role->name) }}
</option>
@endforeach
</select>
<x-input-error :messages="$errors->get('role_id')" class="mt-1" />
</div>
{{-- Password --}}
<div class="space-y-2">
<label class="text-[10px] font-black text-slate-400 uppercase tracking-widest ml-1">Password</label>
<input type="password" name="password" required
class="w-full px-4 py-3 bg-slate-50 border @error('password') border-red-500 @else border-slate-200 @enderror rounded-2xl text-sm font-bold focus:ring-2 focus:ring-indigo-500 transition-all">
<x-input-error :messages="$errors->get('password')" class="mt-1" />
</div>
{{-- Konfirmasi Password --}}
<div class="space-y-2">
<label class="text-[10px] font-black text-slate-400 uppercase tracking-widest ml-1">Konfirmasi Password</label>
<input type="password" name="password_confirmation" required
class="w-full px-4 py-3 bg-slate-50 border border-slate-200 rounded-2xl text-sm font-bold focus:ring-2 focus:ring-indigo-500 transition-all">
</div>
</div>
<div class="pt-4">
<button type="submit" class="w-full py-5 bg-slate-900 text-white text-xs font-black rounded-3xl shadow-xl hover:bg-black transition-all active:scale-[0.98] flex items-center justify-center gap-2 uppercase tracking-widest">
<i class="fas fa-user-plus"></i> Daftarkan Pengguna
</button>
</div>
</form>
</div>
</x-app-layout>