daengdeni/lpj
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

📏 feat(ui): Tambah auto-suffix m/km pada input jarak lingkungan

Browse Source 
- Menambahkan class measure-input dan atribut data-unit pada:
  - jarak_jalan_utama (km)
  - jarak_cbd_point (km)
- Menambahkan script untuk:
  - Membatasi input hanya angka dan koma
  - Menghapus suffix saat fokus dan input
  - Menambahkan suffix otomatis saat blur
  - Menghapus suffix saat submit agar backend menerima angka bersih
- Menyediakan cara mengubah unit ke 'm' dengan mengganti data-unit pada input
This commit is contained in:
Daeng Deni Mardaeni
2025-12-04 11:20:37 +07:00
parent a72cbe4bd9
commit aee8fab832
2 changed files with 113 additions and 76 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
resources/views/penilai/components/analisa/lingkungan.blade.php
View File

@@ -10,14 +10,14 @@
<table style="width: 100%"> <table style="width: 100%">
@php @php
$lingkungan = $forminspeksi['lingkungan']; $lingkungan = $forminspeksi['lingkungan'];
$fasilitas = $lingkungan['fasilitas_dekat_object'] ?? []; $fasilitas = $lingkungan['fasilitas_dekat_object'] ?? [];
$fasilitasInput = $lingkungan['fasilitas_dekat_object_input'] ?? []; $fasilitasInput = $lingkungan['fasilitas_dekat_object_input'] ?? [];
@endphp @endphp
<tr> <tr>
<td style=" width:25%; padding: 2px; vertical-align: top;">Jarak Jalan Utama</td> <td style=" width:25%; padding: 2px; vertical-align: top;">Jarak Jalan Utama</td>
<td style=" width:1%; padding: 2px; vertical-align: top;">:</td> <td style=" width:1%; padding: 2px; vertical-align: top;">:</td>
<td style="padding: 2px; vertical-align: top;">{{ $lingkungan['jarak_jalan_utama'] ?? '-' }} m</td> <td style="padding: 2px; vertical-align: top;">{{ $lingkungan['jarak_jalan_utama'] ?? '-' }}</td>
</tr> </tr>
<tr> <tr>
<td style="padding: 2px; vertical-align: top;">Jalan Lingkungan</td> <td style="padding: 2px; vertical-align: top;">Jalan Lingkungan</td>
@@ -33,7 +33,7 @@
<tr> <tr>
<td style="padding: 2px; vertical-align: top;">Lebar Perkerasan Jalan</td> <td style="padding: 2px; vertical-align: top;">Lebar Perkerasan Jalan</td>
<td style="padding: 2px; vertical-align: top;">:</td> <td style="padding: 2px; vertical-align: top;">:</td>
<td style="padding: 2px; vertical-align: top;">{{ $lingkungan['lebar_perkerasan_jalan'] ?? '-' }} m</td> <td style="padding: 2px; vertical-align: top;">{{ $lingkungan['lebar_perkerasan_jalan'] ?? '-' }}</td>
</tr> </tr>
{{-- mulai --}} {{-- mulai --}}
<tr> <tr>

181
resources/views/surveyor/components/lingkungan.blade.php
View File

@@ -1,38 +1,38 @@
<div class="card border border-agi-100 w-full rounded-lg shadow-md overflow-hidden"> <div class="overflow-hidden w-full rounded-lg border shadow-md card border-agi-100">
<div class="card-header light:bg-agi-50"> <div class="card-header light:bg-agi-50">
<h3 class="card-title uppercase"> <h3 class="uppercase card-title">
Analisa Lingkungan Analisa Lingkungan
</h3> </h3>
</div> </div>
<div class="card-body"> <div class="card-body">
<div class="grid gap-5"> <div class="grid gap-5">
<!-- Jarak dari Objek Utama --> <!-- Jarak dari Objek Utama -->
<div class=" rounded-lg"> <div class="rounded-lg">
<div class="grid grid-cols-2 gap-5"> <div class="grid grid-cols-2 gap-5">
<div> <div>
<label class="block text-sm font-medium text-gray-700">Jarak Dari Jalan <label class="block text-sm font-medium text-gray-700">Jarak Dari Jalan
Utama</label> Utama</label>
<input type="text" class="input mt-2" name="jarak_jalan_utama" placeholder="Km" <input type="text" class="mt-2 input measure-input" data-unit="km" name="jarak_jalan_utama" placeholder="Km"
value="{{ old('jarak_jalan_utama', isset($forminspeksi['lingkungan']['jarak_jalan_utama']) ? $forminspeksi['lingkungan']['jarak_jalan_utama'] : '') }}"> value="{{ old('jarak_jalan_utama', isset($forminspeksi['lingkungan']['jarak_jalan_utama']) ? $forminspeksi['lingkungan']['jarak_jalan_utama'] : '') }}">
</div> </div>
<div> <div>
<label class="block text-sm font-medium text-gray-700">Jalan</label> <label class="block text-sm font-medium text-gray-700">Jalan</label>
<input type="text" name="jalan_linkungan" class="input mt-2" <input type="text" name="jalan_linkungan" class="mt-2 input"
placeholder="Masukkan Nama Jalan" placeholder="Masukkan Nama Jalan"
value="{{ old('jalan_linkungan', isset($forminspeksi['lingkungan']['jalan_linkungan']) ? $forminspeksi['lingkungan']['jalan_linkungan'] : '') }}"> value="{{ old('jalan_linkungan', isset($forminspeksi['lingkungan']['jalan_linkungan']) ? $forminspeksi['lingkungan']['jalan_linkungan'] : '') }}">
</div> </div>
<div> <div>
<label class="block text-sm font-medium text-gray-700">Jarak ke CBD Point</label> <label class="block text-sm font-medium text-gray-700">Jarak ke CBD Point</label>
<input type="text" class="input mt-2" name="jarak_cbd_point" placeholder="Masukkan Jarak ke CBD Point" <input type="text" class="mt-2 input measure-input" data-unit="km" name="jarak_cbd_point" placeholder="Masukkan Jarak ke CBD Point"
value="{{ old('jarak_cbd_point', isset($forminspeksi['lingkungan']['jarak_cbd_point']) ? $forminspeksi['lingkungan']['jarak_cbd_point'] : '') }}"> value="{{ old('jarak_cbd_point', isset($forminspeksi['lingkungan']['jarak_cbd_point']) ? $forminspeksi['lingkungan']['jarak_cbd_point'] : '') }}">
</div> </div>
<div> <div>
<label class="block text-sm font-medium text-gray-700">Nama CBD Point</label> <label class="block text-sm font-medium text-gray-700">Nama CBD Point</label>
<input type="text" class="input mt-2" name="nama_cbd_point" placeholder="Masukkan Nama CBD Point" <input type="text" class="mt-2 input" name="nama_cbd_point" placeholder="Masukkan Nama CBD Point"
value="{{ old('nama_cbd_point', isset($forminspeksi['lingkungan']['nama_cbd_point']) ? $forminspeksi['lingkungan']['nama_cbd_point'] : '') }}"> value="{{ old('nama_cbd_point', isset($forminspeksi['lingkungan']['nama_cbd_point']) ? $forminspeksi['lingkungan']['nama_cbd_point'] : '') }}">
</div> </div>
</div> </div>
<div class="w-full mt-4"> <div class="mt-4 w-full">
<label class="block text-sm font-medium text-gray-700">Lebar Perkerasan Jalan Depan objek</label> <label class="block text-sm font-medium text-gray-700">Lebar Perkerasan Jalan Depan objek</label>
@php @php
$lebarPerkerasanJalan = old( $lebarPerkerasanJalan = old(
@@ -40,16 +40,16 @@
$forminspeksi['lingkungan']['lebar_perkerasan_jalan'] ?? '', $forminspeksi['lingkungan']['lebar_perkerasan_jalan'] ?? '',
); );
@endphp @endphp
<input type="text" name="lebar_perkerasan_jalan" class="input mt-2" placeholder="Masukkan Lebar Perkerasan Jalan" <input type="text" name="lebar_perkerasan_jalan" class="mt-2 input measure-input" data-unit="m" placeholder="Masukkan Lebar Perkerasan Jalan"
value="{{ $lebarPerkerasanJalan }}"> value="{{ $lebarPerkerasanJalan }}">
</div> </div>
</div> </div>
<div class="flex items-baseline flex-wrap lg:flex-nowrap gap-2.5"> <div class="flex flex-wrap gap-2.5 items-baseline lg:flex-nowrap">
<label class="form-label max-w-56">Perkerasan Jalan</label> <label class="form-label max-w-56">Perkerasan Jalan</label>
<div class="flex flex-wrap items-baseline w-full"> <div class="flex flex-wrap items-baseline w-full">
<div class="flex flex-col items-start gap-4"> <div class="flex flex-col gap-4 items-start">
@if (isset($basicData['perkerasanJalan'])) @if (isset($basicData['perkerasanJalan']))
@foreach ($basicData['perkerasanJalan'] as $item) @foreach ($basicData['perkerasanJalan'] as $item)
@php @php
@@ -60,7 +60,7 @@
: [], : [],
); );
@endphp @endphp
<label class="form-label flex items-center gap-2.5 text-nowrap"> <label class="flex gap-2.5 items-center form-label text-nowrap">
<input class="checkbox" name="perkerasan_jalan[]" type="checkbox" <input class="checkbox" name="perkerasan_jalan[]" type="checkbox"
value="{{ $item->name }}" {{ $isChecked ? 'checked' : '' }} value="{{ $item->name }}" {{ $isChecked ? 'checked' : '' }}
onclick="toggleCheckboxVisibility('perkerasan_jalan', 'perkerasan_jalan_lainnya', ['lainnya'])" /> onclick="toggleCheckboxVisibility('perkerasan_jalan', 'perkerasan_jalan_lainnya', ['lainnya'])" />
@@ -79,25 +79,25 @@
@endphp @endphp
<input id="perkerasan_jalan_lainnya" type="text" <input id="perkerasan_jalan_lainnya" type="text"
style="{{ isset($forminspeksi['lingkungan']['perkerasan_jalan']['lainnya']) && $forminspeksi['lingkungan']['perkerasan_jalan']['lainnya'] ? '' : 'display: none' }}" style="{{ isset($forminspeksi['lingkungan']['perkerasan_jalan']['lainnya']) && $forminspeksi['lingkungan']['perkerasan_jalan']['lainnya'] ? '' : 'display: none' }}"
name="perkerasan_jalan_lainnya" class="input w-full mt-2" name="perkerasan_jalan_lainnya" class="mt-2 w-full input"
value="{{ $lainnyaValue }}" placeholder="Masukkan lainnya..." /> value="{{ $lainnyaValue }}" placeholder="Masukkan lainnya..." />
@endif @endif
@endforeach @endforeach
@endif @endif
</div> </div>
<em id="error-perkerasan-jalan" class="alert text-danger text-sm"></em> <em id="error-perkerasan-jalan" class="text-sm alert text-danger"></em>
</div> </div>
</div> </div>
<!-- Lalulintas --> <!-- Lalulintas -->
<div class="flex items-baseline flex-wrap lg:flex-nowrap gap-2.5"> <div class="flex flex-wrap gap-2.5 items-baseline lg:flex-nowrap">
<label class="form-label max-w-56">Lalu Lintas Depan Lokasi</label> <label class="form-label max-w-56">Lalu Lintas Depan Lokasi</label>
<div class="flex flex-wrap items-baseline w-full"> <div class="flex flex-wrap items-baseline w-full">
<div class="flex flex-col items-start gap-4"> <div class="flex flex-col gap-4 items-start">
@if (isset($basicData['laluLintasLokasi'])) @if (isset($basicData['laluLintasLokasi']))
@foreach ($basicData['laluLintasLokasi'] as $item) @foreach ($basicData['laluLintasLokasi'] as $item)
<label class="form-label flex items-center gap-2.5 text-nowrap"> <label class="flex gap-2.5 items-center form-label text-nowrap">
<input class="checkbox" name="lalu_lintas[]" type="checkbox" <input class="checkbox" name="lalu_lintas[]" type="checkbox"
value="{{ $item->name }}" value="{{ $item->name }}"
{{ isset($forminspeksi['lingkungan']['lalu_lintas']) && in_array($item->name, explode(',', is_array(old('lalu_lintas', $forminspeksi['lingkungan']['lalu_lintas'] ?? '')) ? implode(',', old('lalu_lintas', $forminspeksi['lingkungan']['lalu_lintas'] ?? '')) : old('lalu_lintas', $forminspeksi['lingkungan']['lalu_lintas'] ?? ''))) ? 'checked' : '' }} /> {{ isset($forminspeksi['lingkungan']['lalu_lintas']) && in_array($item->name, explode(',', is_array(old('lalu_lintas', $forminspeksi['lingkungan']['lalu_lintas'] ?? '')) ? implode(',', old('lalu_lintas', $forminspeksi['lingkungan']['lalu_lintas'] ?? '')) : old('lalu_lintas', $forminspeksi['lingkungan']['lalu_lintas'] ?? ''))) ? 'checked' : '' }} />
@@ -108,17 +108,17 @@
@endforeach @endforeach
@endif @endif
</div> </div>
<em id="error-lalu-lintas" class="alert text-danger text-sm"></em> <em id="error-lalu-lintas" class="text-sm alert text-danger"></em>
</div> </div>
</div> </div>
<!-- Golongan Hidup Sekitar --> <!-- Golongan Hidup Sekitar -->
<div class="flex items-baseline flex-wrap lg:flex-nowrap gap-2.5"> <div class="flex flex-wrap gap-2.5 items-baseline lg:flex-nowrap">
<label class="form-label max-w-56">Golongan Masyarakat Sekitar</label> <label class="form-label max-w-56">Golongan Masyarakat Sekitar</label>
<div class="flex flex-wrap items-baseline w-full"> <div class="flex flex-wrap items-baseline w-full">
<div class="flex flex-col items-start gap-4"> <div class="flex flex-col gap-4 items-start">
@if (isset($basicData['golMasySekitar'])) @if (isset($basicData['golMasySekitar']))
@foreach ($basicData['golMasySekitar'] as $item) @foreach ($basicData['golMasySekitar'] as $item)
<label class="form-label flex items-center gap-2.5 text-nowrap"> <label class="flex gap-2.5 items-center form-label text-nowrap">
<input class="checkbox" name="gol_mas_sekitar[]" type="checkbox" <input class="checkbox" name="gol_mas_sekitar[]" type="checkbox"
value="{{ $item->name }}" value="{{ $item->name }}"
{{ isset($forminspeksi['lingkungan']['gol_mas_sekitar']) && in_array($item->name, explode(',', is_array(old('gol_mas_sekitar', $forminspeksi['lingkungan']['gol_mas_sekitar'] ?? '')) ? implode(',', old('gol_mas_sekitar', $forminspeksi['lingkungan']['gol_mas_sekitar'] ?? '')) : old('gol_mas_sekitar', $forminspeksi['lingkungan']['gol_mas_sekitar'] ?? ''))) ? 'checked' : '' }} /> {{ isset($forminspeksi['lingkungan']['gol_mas_sekitar']) && in_array($item->name, explode(',', is_array(old('gol_mas_sekitar', $forminspeksi['lingkungan']['gol_mas_sekitar'] ?? '')) ? implode(',', old('gol_mas_sekitar', $forminspeksi['lingkungan']['gol_mas_sekitar'] ?? '')) : old('gol_mas_sekitar', $forminspeksi['lingkungan']['gol_mas_sekitar'] ?? ''))) ? 'checked' : '' }} />
@@ -128,18 +128,18 @@
@endforeach @endforeach
@endif @endif
</div> </div>
<em id="error-gol_mas_sekitar" class="alert text-danger text-sm"></em> <em id="error-gol_mas_sekitar" class="text-sm alert text-danger"></em>
</div> </div>
</div> </div>
<!-- Tingkat Keramaian --> <!-- Tingkat Keramaian -->
<div class="flex items-baseline flex-wrap lg:flex-nowrap gap-2.5"> <div class="flex flex-wrap gap-2.5 items-baseline lg:flex-nowrap">
<label class="form-label max-w-56">Tingkat Keramaian</label> <label class="form-label max-w-56">Tingkat Keramaian</label>
<div class="flex flex-wrap items-baseline w-full"> <div class="flex flex-wrap items-baseline w-full">
<div class="flex flex-col items-start gap-4"> <div class="flex flex-col gap-4 items-start">
@if (isset($basicData['tingkatKeramaian'])) @if (isset($basicData['tingkatKeramaian']))
@foreach ($basicData['tingkatKeramaian'] as $item) @foreach ($basicData['tingkatKeramaian'] as $item)
<label class="form-label flex items-center gap-2.5 text-nowrap"> <label class="flex gap-2.5 items-center form-label text-nowrap">
<input class="checkbox" name="tingkat_keramaian[]" type="checkbox" <input class="checkbox" name="tingkat_keramaian[]" type="checkbox"
value="{{ $item->name }}" value="{{ $item->name }}"
{{ isset($forminspeksi['lingkungan']['tingkat_keramaian']) && in_array($item->name, explode(',', is_array(old('tingkat_keramaian', $forminspeksi['lingkungan']['tingkat_keramaian'] ?? '')) ? implode(',', old('tingkat_keramaian', $forminspeksi['lingkungan']['tingkat_keramaian'] ?? '')) : old('tingkat_keramaian', $forminspeksi['lingkungan']['tingkat_keramaian'] ?? ''))) ? 'checked' : '' }} /> {{ isset($forminspeksi['lingkungan']['tingkat_keramaian']) && in_array($item->name, explode(',', is_array(old('tingkat_keramaian', $forminspeksi['lingkungan']['tingkat_keramaian'] ?? '')) ? implode(',', old('tingkat_keramaian', $forminspeksi['lingkungan']['tingkat_keramaian'] ?? '')) : old('tingkat_keramaian', $forminspeksi['lingkungan']['tingkat_keramaian'] ?? ''))) ? 'checked' : '' }} />
@@ -149,18 +149,18 @@
@endforeach @endforeach
@endif @endif
</div> </div>
<em id="error-tingkat_keramaian" class="alert text-danger text-sm"></em> <em id="error-tingkat_keramaian" class="text-sm alert text-danger"></em>
</div> </div>
</div> </div>
<!-- Terletak Di Area --> <!-- Terletak Di Area -->
<div class="flex items-baseline flex-wrap lg:flex-nowrap gap-2.5"> <div class="flex flex-wrap gap-2.5 items-baseline lg:flex-nowrap">
<label class="form-label max-w-56">Terletak Di Area</label> <label class="form-label max-w-56">Terletak Di Area</label>
<div class="flex flex-wrap items-baseline w-full"> <div class="flex flex-wrap items-baseline w-full">
<div class="flex flex-col items-start gap-4"> <div class="flex flex-col gap-4 items-start">
@if (isset($basicData['terletakDiArea'])) @if (isset($basicData['terletakDiArea']))
@foreach ($basicData['terletakDiArea'] as $item) @foreach ($basicData['terletakDiArea'] as $item)
<label class="form-label flex items-center gap-2.5 text-nowrap"> <label class="flex gap-2.5 items-center form-label text-nowrap">
<input class="checkbox" name="terletak_diarea[]" type="checkbox" <input class="checkbox" name="terletak_diarea[]" type="checkbox"
value="{{ $item->name }}" value="{{ $item->name }}"
{{ isset($forminspeksi['lingkungan']['terletak_diarea']['terletak_diarea']) && in_array($item->name, explode(',', is_array(old('terletak_diarea', $forminspeksi['lingkungan']['terletak_diarea']['terletak_diarea'] ?? '')) ? implode(',', old('terletak_diarea', $forminspeksi['lingkungan']['terletak_diarea']['terletak_diarea'] ?? '')) : old('terletak_diarea', $forminspeksi['lingkungan']['terletak_diarea'] ?? ''))) ? 'checked' : '' }} {{ isset($forminspeksi['lingkungan']['terletak_diarea']['terletak_diarea']) && in_array($item->name, explode(',', is_array(old('terletak_diarea', $forminspeksi['lingkungan']['terletak_diarea']['terletak_diarea'] ?? '')) ? implode(',', old('terletak_diarea', $forminspeksi['lingkungan']['terletak_diarea']['terletak_diarea'] ?? '')) : old('terletak_diarea', $forminspeksi['lingkungan']['terletak_diarea'] ?? ''))) ? 'checked' : '' }}
@@ -179,32 +179,32 @@
@endphp @endphp
<input id="terletak_diarea_lainnya" type="text" <input id="terletak_diarea_lainnya" type="text"
style="{{ isset($forminspeksi['lingkungan']['terletak_diarea']['lainnya']) && $forminspeksi['lingkungan']['terletak_diarea']['lainnya'] ? '' : 'display: none' }}" style="{{ isset($forminspeksi['lingkungan']['terletak_diarea']['lainnya']) && $forminspeksi['lingkungan']['terletak_diarea']['lainnya'] ? '' : 'display: none' }}"
name="terletak_diarea_lainnya" class="input w-full mt-2" name="terletak_diarea_lainnya" class="mt-2 w-full input"
value="{{ $lainnyaValue }}" placeholder="Masukkan lainnya..." /> value="{{ $lainnyaValue }}" placeholder="Masukkan lainnya..." />
@endif @endif
@endforeach @endforeach
@endif @endif
</div> </div>
<em id="error-terletak_diarea" class="alert text-danger text-sm"></em> <em id="error-terletak_diarea" class="text-sm alert text-danger"></em>
</div> </div>
</div> </div>
<!-- Disekitar Lokasi --> <!-- Disekitar Lokasi -->
<div class="flex items-baseline flex-wrap lg:flex-nowrap gap-2.5"> <div class="flex flex-wrap gap-2.5 items-baseline lg:flex-nowrap">
<label class="form-label max-w-56">Disekitar Lokasi</label> <label class="form-label max-w-56">Disekitar Lokasi</label>
<div class="flex flex-wrap items-baseline w-full"> <div class="flex flex-wrap items-baseline w-full">
<div class="flex flex-col gap-2 mt-2"> <div class="flex flex-col gap-2 mt-2">
<label class="text-sm flex items-center gap-2.5 text-nowrap"> <label class="flex gap-2.5 items-center text-sm text-nowrap">
<input <input
onclick="toggleFieldVisibility('disekitar_lokasi', 'disekitar_lokasi_sesuai', ['ya'])" onclick="toggleFieldVisibility('disekitar_lokasi', 'disekitar_lokasi_sesuai', ['ya'])"
type="radio" class="radio" name="disekitar_lokasi" value="ya" type="radio" class="radio" name="disekitar_lokasi" value="ya"
{{ old('disekitar_lokasi', $forminspeksi['lingkungan']['disekitar_lokasi'] ?? '') == 'ya' ? 'checked' : '' }} /> {{ old('disekitar_lokasi', $forminspeksi['lingkungan']['disekitar_lokasi'] ?? '') == 'ya' ? 'checked' : '' }} />
<span class="ml-2">Telah ada bangunan</span> <span class="ml-2">Telah ada bangunan</span>
</label> </label>
<div class="flex w-full items-center gap-4"> <div class="flex gap-4 items-center w-full">
<div id="disekitar_lokasi_sesuai" class="grid grid-cols-2 gap-4 mt-5 mb-5" <div id="disekitar_lokasi_sesuai" class="grid grid-cols-2 gap-4 mt-5 mb-5"
style="{{ old('disekitar_lokasi', $forminspeksi['lingkungan']['disekitar_lokasi'] ?? '') == 'ya' ? '' : 'display: none;' }}"> style="{{ old('disekitar_lokasi', $forminspeksi['lingkungan']['disekitar_lokasi'] ?? '') == 'ya' ? '' : 'display: none;' }}">
<div class="flex items-center gap-2"> <div class="flex gap-2 items-center">
<label for="" class="text-sm text-gray-700">Kondisi bangunan</label> <label for="" class="text-sm text-gray-700">Kondisi bangunan</label>
@php @php
@@ -221,7 +221,7 @@
@endforeach @endforeach
</select> </select>
</div> </div>
<div class="flex items-center gap-2"> <div class="flex gap-2 items-center">
<label for="" class="text-sm text-gray-700">Sifat bangunan</label> <label for="" class="text-sm text-gray-700">Sifat bangunan</label>
@php @php
$sifat = ['Permanen', 'Semi Permanen', 'Tidak Permanen']; $sifat = ['Permanen', 'Semi Permanen', 'Tidak Permanen'];
@@ -240,7 +240,7 @@
</div> </div>
</div> </div>
<label class="form-label flex items-center gap-2.5 text-nowrap"> <label class="flex gap-2.5 items-center form-label text-nowrap">
<input <input
onclick="toggleFieldVisibility('disekitar_lokasi', 'disekitar_lokasi_sesuai', ['ya'])" onclick="toggleFieldVisibility('disekitar_lokasi', 'disekitar_lokasi_sesuai', ['ya'])"
type="radio" class="radio" name="disekitar_lokasi" value="tidak sesuai" type="radio" class="radio" name="disekitar_lokasi" value="tidak sesuai"
@@ -248,62 +248,99 @@
<span class="ml-2">Belum ada bangunan</span> <span class="ml-2">Belum ada bangunan</span>
</label> </label>
</div> </div>
<em id="error-terletak_diarea" class="alert text-danger text-sm"></em> <em id="error-terletak_diarea" class="text-sm alert text-danger"></em>
</div> </div>
</div> </div>
<!-- Dekat Makam --> <!-- Dekat Makam -->
<div class="flex items-baseline flex-wrap lg:flex-nowrap gap-2.5"> <div class="flex flex-wrap gap-2.5 items-baseline lg:flex-nowrap">
<label class="form-label max-w-56">Dekat Makam</label> <label class="form-label max-w-56">Dekat Makam</label>
<div class="flex flex-wrap items-baseline w-full"> <div class="flex flex-wrap items-baseline w-full">
<div class="flex flex-col gap-2 mt-2"> <div class="flex flex-col gap-2 mt-2">
<!-- Opsi Ya --> <!-- Opsi Ya -->
<div class="flex w-full items-center gap-4"> <div class="flex gap-4 items-center w-full">
<label class="text-sm flex items-center gap-2.5 text-nowrap"> <label class="flex gap-2.5 items-center text-sm text-nowrap">
<input onclick="toggleFieldVisibility('dekat_makam', 'dekat-makam', ['ya'])" <input onclick="toggleFieldVisibility('dekat_makam', 'dekat-makam', ['ya'])"
type="radio" class="radio" name="dekat_makam" value="ya" type="radio" class="radio" name="dekat_makam" value="ya"
{{ old('dekat_makam', $forminspeksi['lingkungan']['dekat_makam'] ?? '') == 'ya' ? 'checked' : '' }} /> {{ old('dekat_makam', $forminspeksi['lingkungan']['dekat_makam'] ?? '') == 'ya' ? 'checked' : '' }} />
<span class="ml-2">Ya</span> <span class="ml-2">Ya</span>
</label> </label>
<div id="dekat-makam" class="flex items-baseline gap-4 w-full" <div id="dekat-makam" class="flex gap-4 items-baseline w-full"
style="{{ old('dekat_makam', $forminspeksi['lingkungan']['dekat_makam'] ?? '') == 'ya' ? 'display:flex;' : 'display:none;' }}"> style="{{ old('dekat_makam', $forminspeksi['lingkungan']['dekat_makam'] ?? '') == 'ya' ? 'display:flex;' : 'display:none;' }}">
<div class="flex items-center gap-2"> <div class="flex gap-2 items-center">
<label for="jarak_makam" class="form-label max-w-56">Jarak</label> <label for="jarak_makam" class="form-label max-w-56">Jarak</label>
<input type="text" class="input mt-2" name="jarak_makam" <input type="text" class="mt-2 input" name="jarak_makam"
value="{{ old('jarak_makam', $forminspeksi['lingkungan']['jarak_makam'] ?? '') }}" value="{{ old('jarak_makam', $forminspeksi['lingkungan']['jarak_makam'] ?? '') }}"
placeholder="Km" /> placeholder="Km" />
</div> </div>
<div class="flex items-center gap-2"> <div class="flex gap-2 items-center">
<label for="nama_makam" class="form-label max-w-56">Nama TPU</label> <label for="nama_makam" class="form-label max-w-56">Nama TPU</label>
<input type="text" class="input mt-2 w-full" name="nama_makam" <input type="text" class="mt-2 w-full input" name="nama_makam"
value="{{ old('nama_makam', $forminspeksi['lingkungan']['nama_makam'] ?? '') }}" value="{{ old('nama_makam', $forminspeksi['lingkungan']['nama_makam'] ?? '') }}"
placeholder="Nama TPU" /> placeholder="Nama TPU" />
</div>
</div> </div>
</div> </div>
</div> @push('scripts')
<script type="module">
const sanitizeNumberComma = (v) => {
if (!v) return '';
let s = String(v).replace(/[^\d,]/g, '');
const parts = s.split(',');
if (parts.length > 1) {
s = parts[0] + ',' + parts.slice(1).join('').replace(/,/g, '');
}
return s;
};
document.querySelectorAll('.measure-input').forEach((input) => {
const unit = input.getAttribute('data-unit') || 'km';
const stripSuffix = () => {
input.value = sanitizeNumberComma(input.value);
};
const appendSuffix = () => {
const raw = sanitizeNumberComma(input.value);
input.value = raw ? `${raw} ${unit}` : '';
};
input.addEventListener('focus', stripSuffix);
input.addEventListener('blur', appendSuffix);
input.addEventListener('input', stripSuffix);
const form = input.closest('form');
if (form) {
form.addEventListener('submit', stripSuffix);
}
appendSuffix();
});
</script>
@endpush
<!-- Opsi Tidak --> <!-- Opsi Tidak -->
<label class="form-label flex items-center gap-2.5 text-nowrap"> <label class="flex gap-2.5 items-center form-label text-nowrap">
<input onclick="toggleFieldVisibility('dekat_makam', 'dekat-makam', ['ya'])" <input onclick="toggleFieldVisibility('dekat_makam', 'dekat-makam', ['ya'])"
type="radio" class="radio" name="dekat_makam" value="tidak" type="radio" class="radio" name="dekat_makam" value="tidak"
{{ old('dekat_makam', $forminspeksi['lingkungan']['dekat_makam'] ?? '') == 'tidak' ? 'checked' : '' }} /> {{ old('dekat_makam', $forminspeksi['lingkungan']['dekat_makam'] ?? '') == 'tidak' ? 'checked' : '' }} />
<span class="ml-2">Tidak</span> <span class="ml-2">Tidak</span>
</label> </label>
</div> </div>
<em id="error-dekat_makam" class="alert text-danger text-sm"></em> <em id="error-dekat_makam" class="text-sm alert text-danger"></em>
</div> </div>
</div> </div>
<!-- Dekat Tps --> <!-- Dekat Tps -->
<div class="flex items-baseline flex-wrap lg:flex-nowrap gap-2.5"> <div class="flex flex-wrap gap-2.5 items-baseline lg:flex-nowrap">
<label class="form-label max-w-56">Dekat TPS</label> <label class="form-label max-w-56">Dekat TPS</label>
<div class="flex flex-wrap items-baseline w-full"> <div class="flex flex-wrap items-baseline w-full">
<div class="flex flex-col gap-2 mt-2 w-full"> <div class="flex flex-col gap-2 mt-2 w-full">
<!-- Opsi Ya --> <!-- Opsi Ya -->
<div class="flex w-full items-center gap-4"> <div class="flex gap-4 items-center w-full">
<label class="text-sm flex items-center gap-2.5 text-nowrap"> <label class="flex gap-2.5 items-center text-sm text-nowrap">
<input onclick="toggleFieldVisibility('dekat_tps', 'dekat-tps', ['ya'])" <input onclick="toggleFieldVisibility('dekat_tps', 'dekat-tps', ['ya'])"
type="radio" class="radio" name="dekat_tps" value="ya" type="radio" class="radio" name="dekat_tps" value="ya"
{{ old('dekat_tps', $forminspeksi['lingkungan']['dekat_tps'] ?? '') == 'ya' ? 'checked' : '' }} /> {{ old('dekat_tps', $forminspeksi['lingkungan']['dekat_tps'] ?? '') == 'ya' ? 'checked' : '' }} />
@@ -311,16 +348,16 @@
</label> </label>
<div id="dekat-tps" class="flex flex-wrap gap-4 w-full" <div id="dekat-tps" class="flex flex-wrap gap-4 w-full"
style="{{ old('dekat_tps', $forminspeksi['lingkungan']['dekat_tps'] ?? '') == 'ya' ? 'display:flex;' : 'display:none;' }}"> style="{{ old('dekat_tps', $forminspeksi['lingkungan']['dekat_tps'] ?? '') == 'ya' ? 'display:flex;' : 'display:none;' }}">
<div class="flex items-center gap-2"> <div class="flex gap-2 items-center">
<label for="jarak_tps" class="form-label max-w-56">Jarak</label> <label for="jarak_tps" class="form-label max-w-56">Jarak</label>
<input type="text" id="jarak_tps" class="input mt-2" name="jarak_tps" <input type="text" id="jarak_tps" class="mt-2 input" name="jarak_tps"
value="{{ old('jarak_tps', $forminspeksi['lingkungan']['jarak_tps'] ?? '') }}" value="{{ old('jarak_tps', $forminspeksi['lingkungan']['jarak_tps'] ?? '') }}"
placeholder="Km" /> placeholder="Km" />
</div> </div>
<div class="flex items-center gap-2"> <div class="flex gap-2 items-center">
<label for="nama_tps" class="form-label max-w-56">Nama TPS</label> <label for="nama_tps" class="form-label max-w-56">Nama TPS</label>
<input type="text" id="nama_tps" class="input mt-2" name="nama_tps" <input type="text" id="nama_tps" class="mt-2 input" name="nama_tps"
value="{{ old('nama_tps', $forminspeksi['lingkungan']['nama_tps'] ?? '') }}" value="{{ old('nama_tps', $forminspeksi['lingkungan']['nama_tps'] ?? '') }}"
placeholder="Nama TPS" /> placeholder="Nama TPS" />
</div> </div>
@@ -328,36 +365,36 @@
</div> </div>
<!-- Opsi Tidak --> <!-- Opsi Tidak -->
<label class="form-label flex items-center gap-2.5 text-nowrap"> <label class="flex gap-2.5 items-center form-label text-nowrap">
<input onclick="toggleFieldVisibility('dekat_tps', 'dekat-tps', ['ya'])" type="radio" <input onclick="toggleFieldVisibility('dekat_tps', 'dekat-tps', ['ya'])" type="radio"
class="radio" name="dekat_tps" value="tidak" class="radio" name="dekat_tps" value="tidak"
{{ old('dekat_tps', $forminspeksi['lingkungan']['dekat_tps'] ?? '') == 'tidak' ? 'checked' : '' }} /> {{ old('dekat_tps', $forminspeksi['lingkungan']['dekat_tps'] ?? '') == 'tidak' ? 'checked' : '' }} />
<span class="ml-2">Tidak</span> <span class="ml-2">Tidak</span>
</label> </label>
</div> </div>
<em id="error-dekat_tps" class="alert text-danger text-sm"></em> <em id="error-dekat_tps" class="text-sm alert text-danger"></em>
</div> </div>
</div> </div>
<div class="flex items-baseline flex-wrap lg:flex-nowrap gap-2.5"> <div class="flex flex-wrap gap-2.5 items-baseline lg:flex-nowrap">
<label class="form-label max-w-56">Dekat Lainnya</label> <label class="form-label max-w-56">Dekat Lainnya</label>
<div class="flex flex-wrap items-baseline w-full"> <div class="flex flex-wrap items-baseline w-full">
<input type="text" class="input mt-2" name="dekat_lainnya" <input type="text" class="mt-2 input" name="dekat_lainnya"
value="{{ old('dekat_lainnya', $forminspeksi['lingkungan']['dekat_lainnya'] ?? '') }}" value="{{ old('dekat_lainnya', $forminspeksi['lingkungan']['dekat_lainnya'] ?? '') }}"
placeholder="Masukkan Lainnya" /> placeholder="Masukkan Lainnya" />
<em id="error-dekat_makam" class="alert text-danger text-sm"></em> <em id="error-dekat_makam" class="text-sm alert text-danger"></em>
</div> </div>
</div> </div>
<!-- Merupakan daerah --> <!-- Merupakan daerah -->
<div class="flex items-baseline flex-wrap lg:flex-nowrap gap-2.5"> <div class="flex flex-wrap gap-2.5 items-baseline lg:flex-nowrap">
<label class="form-label max-w-56">Merupakan Daerah</label> <label class="form-label max-w-56">Merupakan Daerah</label>
<div class="flex flex-wrap items-baseline w-full"> <div class="flex flex-wrap items-baseline w-full">
<div class="flex flex-col items-start gap-4"> <div class="flex flex-col gap-4 items-start">
@if (isset($basicData['merupakanDaerah'])) @if (isset($basicData['merupakanDaerah']))
@foreach ($basicData['merupakanDaerah'] as $item) @foreach ($basicData['merupakanDaerah'] as $item)
<label class="form-label flex items-center gap-2.5 text-nowrap"> <label class="flex gap-2.5 items-center form-label text-nowrap">
<input class="checkbox" name="merupakan_daerah[]" type="checkbox" <input class="checkbox" name="merupakan_daerah[]" type="checkbox"
value="{{ $item->name }}" value="{{ $item->name }}"
{{ in_array($item->name, isset($forminspeksi['lingkungan']['merupakan_daerah']) ? $forminspeksi['lingkungan']['merupakan_daerah'] : []) ? 'checked' : '' }} /> {{ in_array($item->name, isset($forminspeksi['lingkungan']['merupakan_daerah']) ? $forminspeksi['lingkungan']['merupakan_daerah'] : []) ? 'checked' : '' }} />
@@ -366,16 +403,16 @@
@endforeach @endforeach
@endif @endif
</div> </div>
<em id="error-merupakan_daerah" class="alert text-danger text-sm"></em> <em id="error-merupakan_daerah" class="text-sm alert text-danger"></em>
</div> </div>
</div> </div>
<!-- Fasilitas Umum Sekitar --> <!-- Fasilitas Umum Sekitar -->
<div class="flex items-baseline flex-wrap lg:flex-nowrap gap-2.5"> <div class="flex flex-wrap gap-2.5 items-baseline lg:flex-nowrap">
<label class="form-label max-w-56">Fasilitas Umum Dekat Objek</label> <label class="form-label max-w-56">Fasilitas Umum Dekat Objek</label>
<div class="flex flex-wrap items-baseline w-full"> <div class="flex flex-wrap items-baseline w-full">
<div class="flex flex-col items-start gap-4"> <div class="flex flex-col gap-4 items-start">
@if (isset($basicData['fasilitasObjek'])) @if (isset($basicData['fasilitasObjek']))
@foreach ($basicData['fasilitasObjek'] as $item) @foreach ($basicData['fasilitasObjek'] as $item)
@php @php
@@ -392,20 +429,20 @@
); );
@endphp @endphp
<div class="flex items-baseline flex-wrap lg:flex-nowrap gap-2.5"> <div class="flex flex-wrap gap-2.5 items-baseline lg:flex-nowrap">
<label class="form-label max-w-56 gap-2.5" style="width: 500px"> <label class="gap-2.5 form-label max-w-56" style="width: 500px">
<input class="checkbox" name="fasilitas_dekat_object[]" type="checkbox" <input class="checkbox" name="fasilitas_dekat_object[]" type="checkbox"
value="{{ $item->name }}" {{ $isChecked ? 'checked' : '' }} /> value="{{ $item->name }}" {{ $isChecked ? 'checked' : '' }} />
{{ $item->name }} {{ $item->name }}
</label> </label>
<input type="text" name="fasilitas_dekat_object_input[{{ $item->name }}]" <input type="text" name="fasilitas_dekat_object_input[{{ $item->name }}]"
class="input w-full" placeholder="Masukkan fasilitas {{ $item->name }}..." class="w-full input" placeholder="Masukkan fasilitas {{ $item->name }}..."
value="{{ $inputValue }}"> value="{{ $inputValue }}">
</div> </div>
@endforeach @endforeach
@endif @endif
</div> </div>
<em id="error-fasilitas_dekat_object" class="alert text-danger text-sm"></em> <em id="error-fasilitas_dekat_object" class="text-sm alert text-danger"></em>
</div> </div>
</div> </div>