@extends('layouts.app')
@section('content')<section class="hero-gradient text-white"><div class="mx-auto max-w-7xl px-5 py-14"><p class="font-bold uppercase tracking-widest text-emerald-200">Akun warga</p><h1 class="mt-3 text-4xl font-black">Profil Saya</h1></div></section><section class="pattern"><div class="mx-auto max-w-3xl px-5 py-12"><form action="{{ route('profile.update') }}" method="POST" class="grid gap-5 rounded-3xl bg-white p-8 shadow-sm">@csrf @method('PUT')@if(session('success'))<div class="rounded-xl bg-emerald-50 p-4 font-bold text-emerald-700">{{ session('success') }}</div>@endif<label class="grid gap-2 font-bold">Nama lengkap<input name="name" value="{{ old('name', auth()->user()->name) }}" class="rounded-xl border border-slate-300 px-4 py-3" required></label><label class="grid gap-2 font-bold">Email<input name="email" type="email" value="{{ old('email', auth()->user()->email) }}" class="rounded-xl border border-slate-300 px-4 py-3" required></label><label class="grid gap-2 font-bold">NIK<input name="nik" value="{{ old('nik', $profile?->nik) }}" class="rounded-xl border border-slate-300 px-4 py-3" inputmode="numeric" maxlength="16" required></label><label class="grid gap-2 font-bold">Nomor telepon<input name="phone" value="{{ old('phone', $profile?->phone) }}" class="rounded-xl border border-slate-300 px-4 py-3"></label><label class="grid gap-2 font-bold">Kecamatan<select id="kecamatan-select" class="rounded-xl border border-slate-300 px-4 py-3"><option value="">Pilih kecamatan</option>@foreach($kecamatans as $kecamatan)<option value="{{ $kecamatan->id }}" @selected($profile?->kelurahan?->kecamatan_id == $kecamatan->id)>{{ $kecamatan->name }}</option>@endforeach</select></label><label class="grid gap-2 font-bold">Kelurahan<select name="kelurahan_id" id="kelurahan-select" class="rounded-xl border border-slate-300 px-4 py-3"><option value="">Pilih kelurahan</option>@foreach($kecamatans as $kecamatan)@foreach($kecamatan->kelurahans as $kelurahan)<option data-kecamatan="{{ $kecamatan->id }}" value="{{ $kelurahan->id }}" @selected(old('kelurahan_id', $profile?->kelurahan_id) == $kelurahan->id)>{{ $kelurahan->name }}</option>@endforeach @endforeach</select></label><label class="grid gap-2 font-bold">Alamat<textarea name="address" rows="3" class="rounded-xl border border-slate-300 px-4 py-3">{{ old('address', $profile?->address) }}</textarea></label><div class="border-t pt-5"><h2 class="text-xl font-black text-solo-blue">Ganti password</h2><div class="mt-4 grid gap-4"><input name="current_password" type="password" placeholder="Password saat ini" class="rounded-xl border border-slate-300 px-4 py-3"><input name="password" type="password" placeholder="Password baru" class="rounded-xl border border-slate-300 px-4 py-3"><input name="password_confirmation" type="password" placeholder="Konfirmasi password baru" class="rounded-xl border border-slate-300 px-4 py-3"></div></div><button class="rounded-full bg-solo-blue px-6 py-3 font-extrabold text-white">Simpan profil</button></form></div></section>@endsection
@push('scripts')<script>const kec=document.querySelector('#kecamatan-select'),kel=document.querySelector('#kelurahan-select');const filter=()=>{if(!kec||!kel)return;[...kel.options].forEach(o=>{if(o.value)o.hidden=kec.value!==''&&o.dataset.kecamatan!==kec.value;});};kec?.addEventListener('change',filter);filter();</script>@endpush