<div class="card-header bg-agi-50">
    <h3 class="card-title uppercase">
        Lokasi Jaminan
    </h3>
</div>
<div class="card-body">
    <div class="grid gap-5">


        @php
            $inputDataLoaksi = [
                [
                    'label' => 'Nama Jalan',
                    'index' => 0,
                    'name' => 'nama_jalan',
                    'value' => old('nama_jalan', isset($forminspeksi['nama_jalan']) ? $forminspeksi['nama_jalan'] : ''),
                ],
                [
                    'label' => 'Perumahan/Gang',
                    'index' => 1,
                    'name' => 'perumahan_gang',
                    'value' => old(
                        'perumahan_gang',
                        isset($forminspeksi['perumahan_gang']) ? $forminspeksi['perumahan_gang'] : '',
                    ),
                ],
                [
                    'label' => 'Blok/Nomor',
                    'index' => 2,
                    'name' => 'blok_nomor',
                    'value' => old('blok_nomor', isset($forminspeksi['blok_nomor']) ? $forminspeksi['blok_nomor'] : ''),
                ],
            ];
        @endphp

        @if (count($inputDataLoaksi) > 0)
            @foreach ($inputDataLoaksi as $item)
                <!-- Nomor Lambung -->
                <div class="flex items-baseline flex-wrap lg:flex-nowrap gap-2.5">
                    <label class="form-label max-w-56">{{ $item['label'] }}</label>
                    <div class="flex flex-wrap items-baseline w-full">
                        <input type="text" name="{{ $item['name'] }}" class="input"
                            placeholder="Masukkan {{ $item['label'] }}" value="{{ $item['value'] }}">

                        @error($item['name'])
                            <em class="alert text-danger text-sm">{{ $message }}</em>
                        @enderror
                    </div>
                </div>
            @endforeach
        @endif

        <div class="flex items-baseline flex-wrap lg:flex-nowrap gap-2.5 w-full">
            <label for="province_code" class="form-label max-w-56">Provinsi</label>
            <div class="flex flex-wrap items-baseline w-full">
                <select id="province_code" name="province_code" class="input w-full" onchange="getCity(this.value)">

                    <option value="">Pilih Provinsi</option>
                    @foreach ($provinces as $item)
                        <option value="{{ $item->code }}" {{ ($cekAlamat['province_code'] ?? '') == $item->code ? 'selected' : '' }}>{{ $item->name }}</option>
                    @endforeach
                </select>
            </div>
        </div>
        <div class="flex items-baseline flex-wrap lg:flex-nowrap gap-2.5 w-full">
            <label for="city_code" class="form-label max-w-56">Kota/Kabupaten</label>
            <div class="flex flex-wrap items-baseline w-full">
                <select id="city_code" name="city_code" class="select w-full"  onchange="getDistrict(this.value)">
                    <option value="">Pilih Kota/Kabupaten</option>

                </select>
            </div>
        </div>

        <div class="flex items-baseline flex-wrap lg:flex-nowrap gap-2.5 w-full">
            <label for="district_code" class="form-label max-w-56">Kecamatan</label>
            <div class="flex flex-wrap items-baseline w-full">
                <select id="district_code" name="district_code" class="select w-full"  onchange="getVillage(this.value)">
                    <option value="">Pilih Kecamatan</option>

                </select>
            </div>
        </div>

        <div class="flex items-baseline flex-wrap lg:flex-nowrap gap-2.5 w-full">
            <label for="village_code" class="form-label max-w-56">Kelurahan</label>
            <div class="flex flex-wrap items-baseline w-full">
                <select id="village_code" name="village_code" class="select w-full">
                    <option value="">Pilih Kelurahan</option>

                </select>
            </div>
        </div>
    </div>
</div>
<script type="text/javascript">
  document.addEventListener('DOMContentLoaded', () => {
        loadSavedLocationData();
    });
</script>
@include('lpj::surveyor.js.utils')
