ariefajar
/
MIF_E31221322
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix(master-land): create func js reverseGeocode

This commit is contained in:
arieeefajar 2025-06-13 18:17:29 +07:00
parent 8c356399d9
commit 6b1f43e7d7
3 changed files with 60 additions and 272 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
app/Http/Controllers/AssesmentFormController.php
View File

@ -35,6 +35,7 @@ public function calculateCFc($cf1, $cf2)
public function store(Request $request) public function store(Request $request)
{ {
dd($request->all());
$customMessages = [ $customMessages = [
'land.required' => 'Harap pilih lahan', 'land.required' => 'Harap pilih lahan',
'land.exists' => 'Lahan tidak ditemukan', 'land.exists' => 'Lahan tidak ditemukan',

281
public/assets/js/pages/customJs/master-data/lahan/create.js
View File

@ -80,6 +80,18 @@ function fetchWithTimeout(url, options = {}, timeout = 10000) {
]); ]);
} }
async function reverseGeocode(lat, lng) {
try {
const response = await fetchWithTimeout(
`https://nominatim.openstreetmap.org/reverse?lat=${lat}&lon=${lng}&format=json&accept-language=id`
);
const data = await response.json();
return data.display_name;
} catch (error) {
return alert(`Error ` + error.message);
}
}
function getLocation() { function getLocation() {
if (!navigator.geolocation) { if (!navigator.geolocation) {
alert("Geolocation tidak didukung oleh browser ini."); alert("Geolocation tidak didukung oleh browser ini.");
@ -98,32 +110,17 @@ function getLocation() {
btnLocation.disabled = true; btnLocation.disabled = true;
navigator.geolocation.getCurrentPosition( navigator.geolocation.getCurrentPosition(
function (position) { async function (position) {
var lat = position.coords.latitude; var lat = position.coords.latitude;
var lng = position.coords.longitude; var lng = position.coords.longitude;
fetchWithTimeout( try {
`https://nominatim.openstreetmap.org/reverse?lat=${lat}&lon=${lng}&format=json&accept-language=id` const address = await reverseGeocode(lat, lng);
)
.then((response) => response.json())
.then((data) => {
btnLocation.classList.add("d-none"); btnLocation.classList.add("d-none");
addressContainer.style.display = "block"; addressContainer.style.display = "block";
mapContainer.style.display = "block"; mapContainer.style.display = "block";
map.invalidateSize(); map.invalidateSize();
console.log(data);
var address = `Desa ${
data.address.village || "-"
}, Kecamatan ${
data.address.township ||
data.address.suburb ||
data.address.city_district ||
"-"
}, Kabupaten ${data.address.city || "-"}, Provinsi ${
data.address.state || "-"
}`;
addressField.value = address; addressField.value = address;
map.setView([lat, lng], 16); map.setView([lat, lng], 16);
@ -147,252 +144,36 @@ function getLocation() {
latField.value = lat; latField.value = lat;
lngField.value = lng; lngField.value = lng;
}) } catch (error) {
.catch((error) => { alert(`Error ` + error.message);
} finally {
btnLocation.disabled = false; btnLocation.disabled = false;
btnLocation.innerHTML = `<i class="fa fa-location-arrow"></i> Dapatkan Lokasi Lahan!`; }
alert("Terjadi kesalahan: " + error.message);
});
// fetch(
// `https://nominatim.openstreetmap.org/reverse?lat=${lat}&lon=${lng}&format=json&accept-language=id`
// )
// .then((response) => response.json())
// .then((data) => {
// btnLocation.classList.add("d-none");
// addressContainer.style.display = "block";
// mapContainer.style.display = "block";
// map.invalidateSize();
// var address = `Desa ${data.address.village}, Kecamatan ${
// data.address.township ? data.address.township : `-`
// }, Kabupaten ${data.address.city}, Provinsi ${
// data.address.state
// }`;
// addressField.value = address;
// map.setView([lat, lng], 16);
// if (currentMarker) {
// map.removeLayer(currentMarker);
// }
// currentMarker = L.marker([lat, lng], {
// icon: iconMarker,
// draggable: true,
// }).addTo(map);
// currentMarker.on("dragend", onPointerDragend);
// currentMarker
// .bindPopup(
// `<div class="text-center"><b>Anda berada di sini</b><br />Silahkan tentukan petak lahan.<br />Pastikan lokasi anda sudah benar.</div>`
// )
// .openPopup();
// latField.value = lat;
// lngField.value = lng;
// })
// .catch((error) => {
// alert("Error: " + error.message);
// });
}, },
function (error) { function (error) {
alert("Error: " + error.message); alert("Error: " + error.message);
} }
); );
} }
// var provinceField = form.querySelector("#province-field");
// var provinceVal = new Choices(provinceField);
// var regencyContainer = form.querySelector("#regency-container");
// var regencyField = form.querySelector("#regency-field");
// var regencyVal = new Choices(regencyField, {
// shouldSort: false,
// });
// var districtContainer = form.querySelector("#district-container");
// var districtField = form.querySelector("#district-field");
// var districtVal = new Choices(districtField, {
// shouldSort: false,
// });
document.addEventListener("DOMContentLoaded", function () { document.addEventListener("DOMContentLoaded", function () {
initMap(); initMap();
// if (provinceField.value !== "") {
// getRegencies(provinceField.value);
// }
}); });
// function getRegencies(provinceId) { async function onPointerDragend() {
// regencyContainer.style.display = "none";
// districtContainer.style.display = "none";
// addressContainer.style.display = "none";
// loading.style.display = "block";
// mapContainer.style.display = "none";
// const url = "/location/get-regency/" + provinceId;
// $.ajax({
// url: url,
// type: "GET",
// success: function (response) {
// if (response.success) {
// loading.style.display = "none";
// const data = response.data;
// regencyVal.clearStore();
// regencyVal.clearChoices();
// regencyVal.value = "";
// regencyVal.setChoices([
// {
// value: "",
// label: "Pilih Kabupaten",
// selected: true,
// disabled: true,
// },
// ]);
// if (Array.isArray(data)) {
// regencyVal.setChoices(
// data.map((regency) => ({
// value: regency.id,
// label: regency.name,
// selected: false,
// disabled: false,
// }))
// );
// regencyContainer.style.display = "block";
// } else {
// mapContainer.style.display = "block";
// mapContainer.innerHTML =
// "<p class='text-center text-muted'>Terjadi kesalaahan saat mengambil data, silahkan coba beberapa saat lagi</p>";
// }
// }
// },
// error: function (xhr, status, error) {
// mapContainer.style.display = "block";
// mapContainer.innerHTML =
// "<p class='text-center text-muted'>Terjadi kesalaahan saat mengambil data, silahkan coba beberapa saat lagi</p>";
// },
// });
// }
// function getDistricts(regencyId) {
// districtContainer.style.display = "none";
// addressContainer.style.display = "none";
// loading.style.display = "block";
// mapContainer.style.display = "none";
// const url = "/location/get-district/" + regencyId;
// $.ajax({
// url: url,
// type: "GET",
// success: function (response) {
// if (response.success) {
// loading.style.display = "none";
// const data = response.data;
// districtVal.clearStore();
// districtVal.clearChoices();
// districtVal.value = "";
// districtVal.setChoices([
// {
// value: "",
// label: "Pilih Kecamatan",
// selected: true,
// disabled: true,
// },
// ]);
// if (Array.isArray(data)) {
// districtVal.setChoices(
// data.map((district) => ({
// value: district.id,
// label: district.name,
// selected: false,
// disabled: false,
// }))
// );
// districtContainer.style.display = "block";
// } else {
// mapContainer.style.display = "block";
// mapContainer.innerHTML =
// "<p class='text-center text-muted'>Terjadi kesalaahan saat mengambil data, silahkan coba beberapa saat lagi</p>";
// }
// }
// },
// error: function (xhr, status, error) {
// mapContainer.style.display = "block";
// mapContainer.innerHTML =
// "<p class='text-center text-muted'>Terjadi kesalaahan saat mengambil data, silahkan coba beberapa saat lagi</p>";
// },
// });
// }
// function showmap(districtId) {
// loading.style.display = "block";
// if (!navigator.geolocation) {
// alert("Geolocation tidak didukung oleh browser ini.");
// return;
// }
// navigator.geolocation.getCurrentPosition(
// function (position) {
// loading.style.display = "none";
// mapContainer.style.display = "block";
// map.invalidateSize();
// addressContainer.style.display = "block";
// var lat = position.coords.latitude;
// var lng = position.coords.longitude;
// map.setView([lat, lng], 16);
// if (currentMarker) {
// map.removeLayer(currentMarker);
// }
// if (currentMarker || currentMarkerEdit) {
// map.removeLayer(currentMarker);
// }
// var iconMarker = L.icon({
// iconUrl: "/assets/images/marker.png",
// iconSize: [50, 50],
// iconAnchor: [25, 50],
// popupAnchor: [0, -50],
// });
// currentMarker = L.marker([lat, lng], {
// icon: iconMarker,
// draggable: true,
// }).addTo(map);
// currentMarker.on("dragend", onPointerDragend);
// currentMarker
// .bindPopup(
// `<div class="text-center"><b>Anda berada di sini</b><br />Silahkan tentukan petak lahan.<br />Pastikan lokasi anda sudah benar.</div>`
// )
// .openPopup();
// latField.value = lat;
// lngField.value = lng;
// },
// function (error) {
// alert("Error: " + error.message);
// }
// );
// }
function onPointerDragend() {
if (!currentMarker) return; if (!currentMarker) return;
var coordinates = currentMarker.getLatLng(); var coordinates = currentMarker.getLatLng();
loading.style.display = "block";
addressContainer.style.display = "none";
try {
const address = await reverseGeocode(coordinates.lat, coordinates.lng);
loading.style.display = "none";
addressContainer.style.display = "block";
addressField.value = address;
} catch (error) {
} finally {
}
currentMarker currentMarker
.setLatLng(coordinates) .setLatLng(coordinates)

6
resources/views/master-data/lahan/create.blade.php
View File

@ -104,6 +104,12 @@
</div> </div>
</div> --}} </div> --}}
<div id="loading" class="text-center" style="display: none">
<div class="spinner-border text-primary" role="status">
<span class="visually-hidden">Loading...</span>
</div>
</div>
<div class="mb-3" id="address-container" style="display: none"> <div class="mb-3" id="address-container" style="display: none">
<label for="address-field" class="form-label">Alamat</label> <label for="address-field" class="form-label">Alamat</label>
<textarea name="address" id="address-field" rows="3" class="form-control" readonly <textarea name="address" id="address-field" rows="3" class="form-control" readonly