(validation): Tambahkan pattern validasi koordinat latitude dan longitude

Menambahkan pattern regex untuk validasi input koordinat geografis pada form surveyor untuk memastikan data yang dimasukkan memiliki format yang valid dan sesuai dengan rentang koordinat yang benar.

Perubahan yang dilakukan:

**File yang dimodifikasi:**
1. `Modules/Lpj/resources/views/surveyor/components/pembanding-tanah-bangunan-unit.blade.php`
   - Menambahkan pattern pada input latitude utama: `^-?([1-8]?\d(\.\d+)?|90(\.0+)?)$`
   - Menambahkan pattern pada input longitude utama: `^-?(1[0-7]?\d(\.\d+)?|180(\.0+)?|[1-9]?\d(\.\d+)?)$`
   - Menambahkan pattern pada input latitude pembanding: `^-?([1-8]?\d(\.\d+)?|90(\.0+)?)$`
   - Menambahkan pattern pada input longitude pembanding: `^-?(1[0-7]?\d(\.\d+)?|180(\.0+)?|[1-9]?\d(\.\d+)?)$`

2. `Modules/Lpj/resources/views/surveyor/components/pembanding-kendaraan.blade.php`
   - Menambahkan pattern pada input latitude utama: `^-?([1-8]?\d(\.\d+)?|90(\.0+)?)$`
   - Menambahkan pattern pada input longitude utama: `^-?(1[0-7]?\d(\.\d+)?|180(\.0+)?|[1-9]?\d(\.\d+)?)$`
   - Menambahkan pattern pada input latitude pembanding: `^-?([1-8]?\d(\.\d+)?|90(\.0+)?)$`
   - Menambahkan pattern pada input longitude pembanding: `^-?(1[0-7]?\d(\.\d+)?|180(\.0+)?|[1-9]?\d(\.\d+)?)$`

3. `Modules/Lpj/resources/views/surveyor/components/header.blade.php`
   - Menambahkan pattern pada input latitude: `^-?([1-8]?\d(\.\d+)?|90(\.0+)?)$`
   - Menambahkan pattern pada input longitude: `^-?(1[0-7]?\d(\.\d+)?|180(\.0+)?|[1-9]?\d(\.\d+)?)$`
   - Memperbaiki duplikasi atribut `type="text"` pada input latitude

**Detail Pattern Validasi:**
- **Latitude**: Menerima nilai dari -90 sampai 90 derajat
  - Format: `-?([1-8]?\d(\.\d+)?|90(\.0+)?)`
  - Contoh valid: `-6.1234`, `0.123`, `90.0`, `-90.0`

- **Longitude**: Menerima nilai dari -180 sampai 180 derajat
  - Format: `-?(1[0-7]?\d(\.\d+)?|180(\.0+)?|[1-9]?\d(\.\d+)?)`
  - Contoh valid: `106.1234`, `0.123`, `180.0`, `-180.0`, `-106.1234`

**Manfaat:**
- Mencegah input koordinat yang tidak valid
- Standarisasi format data koordinat di seluruh form surveyor
- Memastikan data yang tersimpan memiliki presisi yang sesuai
- Meningkatkan akurasi data untuk keperluan pemetaan dan analisis lokasi

**Impact:**
- Validasi client-side akan menolak input koordinat yang tidak sesuai format
- Pesan error bawaan browser akan muncul jika format tidak valid
- Tidak ada perubahan pada logic backend (validasi tetap ada di server-side)
- Kompatibel dengan semua browser modern yang support HTML5 pattern
This commit is contained in:
Daeng Deni Mardaeni
2025-11-20 14:36:05 +07:00
parent 8c60320532
commit fc6f18fea9
3 changed files with 33 additions and 33 deletions

View File

@@ -257,11 +257,11 @@
<label class="form-label max-w-56">Koordinat</label>
<div id="perwakilan" class="flex gap-5 items-baseline w-full">
<div class="grid grid-cols-2 gap-4 items-center w-full">
<input class="input" type="text" placeholder="Masukan Koordinat Latitude" type="text"
name="kordinat_lat" id="lat"
<input class="input" type="text" placeholder="Masukan Koordinat Latitude"
name="kordinat_lat" id="lat" pattern="^-?([1-8]?\d(\.\d+)?|90(\.0+)?)$"
value="{{ old('kordinat_lat', isset($forminspeksi['asset']['kordinat_lat']) ? $forminspeksi['asset']['kordinat_lat'] : '') }}">
<input class="input" type="text" placeholder="Masukan Koordinat Longitude"
name="kordinat_lng" id="lng"
name="kordinat_lng" id="lng" pattern="^-?(1[0-7]?\d(\.\d+)?|180(\.0+)?|[1-9]?\d(\.\d+)?)$"
value="{{ old('kordinat_lng', isset($forminspeksi['asset']['kordinat_lng']) ? $forminspeksi['asset']['kordinat_lng'] : '') }}">
</div>
<a onclick="getCoordinates()" type="button" class="btn btn-md btn-outline btn-primary">

View File

@@ -228,17 +228,17 @@
<td class="px-4 py-2">
<div class="grid grid-cols-2 gap-2">
<input type="text" name="kordinat_lat" class="input" placeholder="Latitude"
value="{{ $inspectionData['kordinat_lat'] ?? '' }}">
value="{{ $inspectionData['kordinat_lat'] ?? '' }}" pattern="^-?([1-8]?\d(\.\d+)?|90(\.0+)?)$">
<input type="text" name="kordinat_lng" class="input" placeholder="Longitude"
value="{{ $inspectionData['kordinat_lng'] ?? '' }}">
value="{{ $inspectionData['kordinat_lng'] ?? '' }}" pattern="^-?(1[0-7]?\d(\.\d+)?|180(\.0+)?|[1-9]?\d(\.\d+)?)$">
</div>
</td>
<td class="px-4 py-2">
<div class="grid grid-cols-2 gap-2">
<input type="text" name="kordinat_lat_pembanding[]" class="input"
placeholder="Latitude">
placeholder="Latitude" pattern="^-?([1-8]?\d(\.\d+)?|90(\.0+)?)$">
<input type="text" name="kordinat_lng_pembanding[]" class="input"
placeholder="Longitude">
placeholder="Longitude" pattern="^-?(1[0-7]?\d(\.\d+)?|180(\.0+)?|[1-9]?\d(\.\d+)?)$">
</div>
</td>
</tr>

View File

@@ -1,6 +1,6 @@
<div class="card-header bg-agi-50">
<h3 class="card-title">Data Pembanding</h3>
<div class="flex items-center gap-2">
<div class="flex gap-2 items-center">
@if (Request::is('penilai/show-data-pembanding/*/edit') && request()->has('documentId') && request()->has('jenis_jaminan'))
<a href="{{ url()->previous() }}" class="btn btn-xs btn-info">
<i class="ki-filled ki-exit-left"></i> Back
@@ -14,11 +14,11 @@
</div>
</div>
<div class="card-header bg-agi-50 py-5 flex-wrap flex justify-end">
<div class="flex flex-wrap justify-end py-5 card-header bg-agi-50">
<button type="button" id="addColumnBtn" class="btn btn-primary btn-sm">
<i class="ki-filled ki-plus"></i> Tambah Pembanding
</button>
<button type="button" id="removeColumnBtn" class="btn btn-danger btn-sm ml-2" style="display: none;">
<button type="button" id="removeColumnBtn" class="ml-2 btn btn-danger btn-sm" style="display: none;">
<i class="ki-filled ki-minus"></i> Hapus Pembanding
</button>
</div>
@@ -29,8 +29,8 @@
<div class="card-body">
<div class="scrollable-x-auto">
<table id="dataTable" class="table table-auto table-border align-middle text-gray-700 font-medium text-sm">
<thead class="bg-gray-50 sticky top-0">
<table id="dataTable" class="table text-sm font-medium text-gray-700 align-middle table-auto table-border">
<thead class="sticky top-0 bg-gray-50">
<tr>
<th class="px-4 py-3 min-w-[200px]">Parameter</th>
<th class="px-4 py-3 min-w-[250px]">Objek Penilaian</th>
@@ -128,12 +128,12 @@
@endphp
<td class="px-4 py-2">
<input type="text" name="luas_tanah" class="input "
<input type="text" name="luas_tanah" class="input"
value="{{ $inspectionData['tanah']['luas_tanah']['sesuai'] ?? ($inspectionData['tanah']['luas_tanah']['tidak sesuai'] ?? '') }}">
</td>
<td class="px-4 py-2">
<input type="text" name="luas_tanah_pembanding[]" class="input ">
<input type="text" name="luas_tanah_pembanding[]" class="input">
</td>
</tr>
@@ -160,7 +160,7 @@
value="{{ $inspectionData['bangunan']['luas_tanah_bagunan']['sesuai'] ?? ($inspectionData['bangunan']['luas_tanah_bagunan']['tidak sesuai'] ?? '') }}">
</td>
<td class="px-4 py-2">
<input type="text" name="luas_bangunan_pembanding[]" class="input ">
<input type="text" name="luas_bangunan_pembanding[]" class="input">
</td>
</tr>
@@ -186,7 +186,7 @@
<td class="px-4 py-2">
<input type="text" name="penawaran" class="input"
value="{{ $inspectionData['asset']['penawaran'] ?? '' }}"> --}}
{{-- <select class="input w-full" name="penawaran">
{{-- <select class="w-full input" name="penawaran">
<option value="">Pilih</option>
<option value="Penawaran" {{ (isset($inspectionData['asset']['penawaran']) && $inspectionData['asset']['penawaran'] == 'Penawaran') ? 'selected' : '' }}>Penawaran</option>
<option value="Transaksi" {{ (isset($inspectionData['asset']['penawaran']) && $inspectionData['asset']['penawaran'] == 'Transaksi') ? 'selected' : '' }}>Transaksi</option>
@@ -194,7 +194,7 @@
{{-- </td>
<td class="px-4 py-2">
<input type="text" name="penawaran_pembanding[]" class="input"> --}}
{{-- <select class="input w-full" name="penawaran_pembanding[]">
{{-- <select class="w-full input" name="penawaran_pembanding[]">
<option value="">Pilih</option>
<option value="Penawaran" {{ (isset($inspectionData['penawaran']) && $inspectionData['penawaran'] == 'Penawaran') ? 'selected' : '' }}>Penawaran</option>
<option value="Transaksi" {{ (isset($inspectionData['penawaran']) && $inspectionData['penawaran'] == 'Transaksi') ? 'selected' : '' }}>Transaksi</option>
@@ -267,17 +267,17 @@
<td class="px-4 py-2">
<div class="grid grid-cols-2 gap-2">
<input type="text" name="kordinat_lat" class="input" placeholder="Latitude"
value="{{ $inspectionData['asset']['kordinat_lat'] ?? '' }}" pattern="^-?((1[0-7]\d|\d{1,2})(\.\d+)?|180(\.0+)?)$">
value="{{ $inspectionData['asset']['kordinat_lat'] ?? '' }}" pattern="^-?([1-8]?\d(\.\d+)?|90(\.0+)?)$">
<input type="text" name="kordinat_lng" class="input" placeholder="Longitude"
value="{{ $inspectionData['asset']['kordinat_lng'] ?? '' }}" pattern="^-?((1[0-7]\d|\d{1,2})(\.\d+)?|180(\.0+)?)$">
value="{{ $inspectionData['asset']['kordinat_lng'] ?? '' }}" pattern="^-?(1[0-7]?\d(\.\d+)?|180(\.0+)?|[1-9]?\d(\.\d+)?)$">
</div>
</td>
<td class="px-4 py-2">
<div class="grid grid-cols-2 gap-2">
<input type="text" name="kordinat_lat_pembanding[]" class="input"
placeholder="Latitude" pattern="^-?((1[0-7]\d|\d{1,2})(\.\d+)?|180(\.0+)?)$">
placeholder="Latitude" pattern="^-?([1-8]?\d(\.\d+)?|90(\.0+)?)$">
<input type="text" name="kordinat_lng_pembanding[]" class="input"
placeholder="Longitude" pattern="^-?((1[0-7]\d|\d{1,2})(\.\d+)?|180(\.0+)?)$">
placeholder="Longitude" pattern="^-?(1[0-7]?\d(\.\d+)?|180(\.0+)?|[1-9]?\d(\.\d+)?)$">
</div>
</td>
</tr>
@@ -290,17 +290,17 @@
: 'tidak sesuai';
$address = $inspectionData['asset']['alamat'][$statusAlamat]['address'] ?? null;
@endphp
<textarea name="address" class="input py-2" rows="2">{{ $address }}</textarea>
<textarea name="address" class="py-2 input" rows="2">{{ $address }}</textarea>
</td>
<td class="px-4 py-2">
<textarea name="address_pembanding[]" class="input py-2" rows="2"></textarea>
<textarea name="address_pembanding[]" class="py-2 input" rows="2"></textarea>
</td>
</tr>
<tr>
<td class="px-4 py-2">Provinsi</td>
<td class="px-4 py-2">
<select id="province_code" name="province_code" class="input w-full">
<select id="province_code" name="province_code" class="w-full input">
@php
$statusKey = isset($inspectionData['asset']['alamat']['sesuai'])
? 'sesuai'
@@ -326,7 +326,7 @@
</td>
<td class="px-4 py-2">
<select id="province_code_pembanding" name="province_code_pembanding[]"
onchange="handleProvinceChange(this)" class="input w-full">
onchange="handleProvinceChange(this)" class="w-full input">
<option value="">Pilih Provinsi</option>
@foreach ($provinces as $province)
<option value="{{ $province->code }}">{{ $province->name }}
@@ -339,7 +339,7 @@
<tr>
<td class="px-4 py-2">Kabupaten/Kota</td>
<td class="px-4 py-2">
<select id="city_code" name="city_code" class="select w-full">
<select id="city_code" name="city_code" class="w-full select">
@php
$statusKey = isset($inspectionData['asset']['alamat']['sesuai'])
@@ -360,7 +360,7 @@
</td>
<td class="px-4 py-2">
<select id="city_code_pembanding" name="city_code_pembanding[]"
onchange="handleCityChange(this)" class="input w-full">
onchange="handleCityChange(this)" class="w-full input">
<option value="">Pilih Kota/Kabupaten</option>
</select>
</td>
@@ -369,7 +369,7 @@
<tr>
<td class="px-4 py-2">Kecamatan</td>
<td class="px-4 py-2">
<select id="district_code" name="district_code" class="select w-full">
<select id="district_code" name="district_code" class="w-full select">
@php
$statusKey = isset($inspectionData['asset']['alamat']['sesuai'])
@@ -392,7 +392,7 @@
<td class="px-4 py-2">
<select id="district_code_pembanding" name="district_code_pembanding[]"
onchange="handleDistrictChange(this)" class="input w-full">
onchange="handleDistrictChange(this)" class="w-full input">
<option value="">Pilih Kecamatan</option>
</select>
</td>
@@ -401,7 +401,7 @@
<tr>
<td class="px-4 py-2">Desa/Kelurahan</td>
<td class="px-4 py-2">
<select id="village_code" name="village_code" class="select w-full">
<select id="village_code" name="village_code" class="w-full select">
@php
$statusKey = isset($inspectionData['asset']['alamat']['sesuai'])
? 'sesuai'
@@ -420,7 +420,7 @@
</select>
</td>
<td class="px-4 py-2">
<select id="village_code_pembanding" name="village_code_pembanding[]" class="input w-full">
<select id="village_code_pembanding" name="village_code_pembanding[]" class="w-full input">
<option value="">Pilih Desa/Kelurahan</option>
</select>
</td>
@@ -444,7 +444,7 @@
<td class="px-4 py-2">Diskon</td>
<td class="px-4 py-2">
<div class="input">
<input type="text" name="diskon" class=" currency"
<input type="text" name="diskon" class="currency"
value="{{ $inspectionData['asset']['diskon'] ?? '' }}">
<span class="btn btn-icon">
<i class="ki-outline ki-percentage"></i>
@@ -452,7 +452,7 @@
</div>
</td>
<td class=" px-4 py-2">
<td class="px-4 py-2">
<div class="input">
<input type="text" name="diskon_pembanding[]" class="currency">
<span class="btn btn-icon">