187 lines
9.0 KiB
Plaintext
187 lines
9.0 KiB
Plaintext
@{
|
|
ViewData["Title"] = "Bio Nasabah";
|
|
Layout = "~/Views/Shared/_LayoutAppWithoutNavbar.cshtml";
|
|
}
|
|
|
|
<div class="min-h-screen flex items-center justify-center py-8 px-4">
|
|
<div class="w-full max-w-4xl">
|
|
<div class="flex flex-col gap-2 md:flex-row md:justify-center md:gap-0 mb-6">
|
|
<div class="prose">
|
|
<span class="text-xl font-semibold text-gray-900 font-['Plus_Jakarta_Sans']">
|
|
Lengkapi Biodata Anda
|
|
</span>
|
|
</div>
|
|
</div>
|
|
<!-- Alert Box with DaisyUI -->
|
|
<div class="alert border-blue-200 bg-blue-50 rounded-lg mb-6">
|
|
<div>
|
|
<h3 class="font-semibold text-blue-800">Selamat Datang!</h3>
|
|
<div class="text-sm text-blue-600">Silakan lengkapi biodata Anda untuk dapat menggunakan layanan e-Bank Sampah. Form ini hanya akan muncul sekali.</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Form -->
|
|
<form class="space-y-6">
|
|
<!-- Informasi Biodata Section 1 -->
|
|
<div class="bg-white rounded-lg shadow-sm p-6">
|
|
<h3 class="text-lg font-medium text-gray-700 mb-4">Informasi Biodata</h3>
|
|
|
|
<div class="grid grid-cols-1 md:grid-cols-2 gap-4">
|
|
<!-- Nama Nasabah -->
|
|
<div>
|
|
<label class="block text-sm font-medium text-gray-700 mb-2">
|
|
Nama Nasabah <span class="text-red-500">*</span>
|
|
</label>
|
|
<input
|
|
type="text"
|
|
value="Ikhdan Nizar Maulana"
|
|
class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 outline-none transition"
|
|
/>
|
|
</div>
|
|
|
|
<!-- Email -->
|
|
<div>
|
|
<label class="block text-sm font-medium text-gray-700 mb-2">
|
|
Email <span class="text-red-500">*</span>
|
|
</label>
|
|
<input
|
|
type="email"
|
|
value="banksampahjaktim@gmail.com"
|
|
class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 outline-none transition"
|
|
/>
|
|
</div>
|
|
|
|
<!-- No. HP -->
|
|
<div>
|
|
<label class="block text-sm font-medium text-gray-700 mb-2">
|
|
No. HP <span class="text-red-500">*</span>
|
|
</label>
|
|
<input
|
|
type="tel"
|
|
placeholder="Masukkan nomor HP"
|
|
class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 outline-none transition"
|
|
/>
|
|
</div>
|
|
|
|
<!-- No. KTP -->
|
|
<div>
|
|
<label class="block text-sm font-medium text-gray-700 mb-2">
|
|
No. KTP <span class="text-red-500">*</span>
|
|
</label>
|
|
<input
|
|
type="text"
|
|
placeholder="Masukkan No KTP (16 digit)"
|
|
class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 outline-none transition"
|
|
/>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Informasi Biodata Section 2 -->
|
|
<div class="bg-white rounded-lg shadow-sm p-6">
|
|
<h3 class="text-lg font-medium text-gray-700 mb-4">Informasi Biodata</h3>
|
|
|
|
<!-- Alamat -->
|
|
<div class="mb-4">
|
|
<label class="block text-sm font-medium text-gray-700 mb-2">
|
|
Alamat <span class="text-red-500">*</span>
|
|
</label>
|
|
<textarea
|
|
rows="4"
|
|
placeholder="Masukkan alamat lengkap"
|
|
class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 outline-none transition resize-none"
|
|
></textarea>
|
|
</div>
|
|
|
|
<!-- RT, RW, Kode Pos -->
|
|
<div class="grid grid-cols-1 md:grid-cols-3 gap-4 mb-4">
|
|
<div>
|
|
<label class="block text-sm font-medium text-gray-700 mb-2">
|
|
RT <span class="text-red-500">*</span>
|
|
</label>
|
|
<input
|
|
type="text"
|
|
placeholder="Masukkan RT"
|
|
class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 outline-none transition"
|
|
/>
|
|
</div>
|
|
|
|
<div>
|
|
<label class="block text-sm font-medium text-gray-700 mb-2">
|
|
RW <span class="text-red-500">*</span>
|
|
</label>
|
|
<input
|
|
type="text"
|
|
placeholder="Masukkan RW"
|
|
class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 outline-none transition"
|
|
/>
|
|
</div>
|
|
|
|
<div>
|
|
<label class="block text-sm font-medium text-gray-700 mb-2">
|
|
Kode Pos <span class="text-red-500">*</span>
|
|
</label>
|
|
<input
|
|
type="text"
|
|
placeholder="Masukkan Kode Pos"
|
|
class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 outline-none transition"
|
|
/>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Provinsi, Kota -->
|
|
<div class="grid grid-cols-1 md:grid-cols-2 gap-4 mb-4">
|
|
<div>
|
|
<label class="block text-sm font-medium text-gray-700 mb-2">
|
|
Provinsi <span class="text-red-500">*</span>
|
|
</label>
|
|
<select class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 outline-none transition bg-white">
|
|
<option>Pilih Provinsi</option>
|
|
</select>
|
|
</div>
|
|
|
|
<div>
|
|
<label class="block text-sm font-medium text-gray-700 mb-2">
|
|
Kota <span class="text-red-500">*</span>
|
|
</label>
|
|
<select class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 outline-none transition bg-white">
|
|
<option>Pilih Provinsi</option>
|
|
</select>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Kecamatan, Kelurahan -->
|
|
<div class="grid grid-cols-1 md:grid-cols-2 gap-4">
|
|
<div>
|
|
<label class="block text-sm font-medium text-gray-700 mb-2">
|
|
Kecamatan <span class="text-red-500">*</span>
|
|
</label>
|
|
<select class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 outline-none transition bg-white">
|
|
<option>Pilih Provinsi</option>
|
|
</select>
|
|
</div>
|
|
|
|
<div>
|
|
<label class="block text-sm font-medium text-gray-700 mb-2">
|
|
Kelurahan <span class="text-red-500">*</span>
|
|
</label>
|
|
<select class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 outline-none transition bg-white">
|
|
<option>Pilih Provinsi</option>
|
|
</select>
|
|
</div>
|
|
</div>
|
|
<div class="divider"></div>
|
|
<!-- Submit Button -->
|
|
<div class="flex justify-end">
|
|
<button type="submit"
|
|
class="px-8 py-2.5 bg-green-800 rounded-full text-white text-base font-semibold font-['Plus_Jakarta_Sans'] leading-6 hover:bg-green-900 w-full sm:w-auto">
|
|
Simpan dan Lanjutkan
|
|
</button>
|
|
</div>
|
|
</div>
|
|
|
|
</form>
|
|
</div>
|
|
</div>
|
|
|