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

fix(master-land): update function getLocation()

This commit is contained in:
arieeefajar 2025-06-12 02:32:13 +07:00
parent 91d2396bdb
commit 786d771653
3 changed files with 222 additions and 197 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -26,6 +26,7 @@ public function create()
public function store(Request $request)
{
dd($request->all());
$customMessage = [
'owner.required' => 'Nama pemilik wajib diisi',
'owner.max' => 'Nama pemilik maksimal 25 karakter',

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

@ -1,5 +1,15 @@
var map, drawnItems, drawControl, googleHybrid, iconMarker;
var currentMarker = null;
var btnLocation = document.getElementById("location-btn");
var form = document.getElementById("add-form");
var addressContainer = form.querySelector("#address-container");
var addressField = form.querySelector("#address-field");
var mapContainer = form.querySelector("#map-container");
var latField = form.querySelector("#lat");
var lngField = form.querySelector("#lng");
var polygonField = form.querySelector("#polygon");
var loading = form.querySelector("#loading");
var btnContainer = form.querySelector("#add-footer");
function initMap() {
map = L.map("map", {
@ -63,244 +73,257 @@ function getLocation() {
return;
}
btnLocation.innerHTML = ``;
btnLocation.innerHTML = `<span class="d-flex align-items-center">
<span class="flex-grow-1 me-2">
Loading...
</span>
<span class="spinner-border flex-shrink-0" role="status">
<span class="visually-hidden">Loading...</span>
</span>
</span>`;
btnLocation.disabled = true;
navigator.geolocation.getCurrentPosition(
function (position) {
loading.style.display = "none";
mapContainer.style.display = "block";
map.invalidateSize();
var lat = position.coords.latitude;
var lng = position.coords.longitude;
map.setView([lat, lng], 16);
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();
if (currentMarker) {
map.removeLayer(currentMarker);
}
var address = `Desa ${data.address.village}, Kecamatan ${
data.address.township ? data.address.township : `-`
}, Kabupaten ${data.address.city}, Provinsi ${
data.address.state
}`;
addressField.value = address;
currentMarker = L.marker([lat, lng], {
icon: iconMarker,
draggable: true,
}).addTo(map);
map.setView([lat, lng], 16);
currentMarker.on("dragend", onPointerDragend);
if (currentMarker) {
map.removeLayer(currentMarker);
}
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();
currentMarker = L.marker([lat, lng], {
icon: iconMarker,
draggable: true,
}).addTo(map);
latField.value = lat;
lngField.value = lng;
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) {
alert("Error: " + error.message);
}
);
}
// var provinceField = form.querySelector("#province-field");
// var provinceVal = new Choices(provinceField);
var form = document.getElementById("add-form");
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 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,
});
var addressContainer = form.querySelector("#address-container");
var addressField = form.querySelector("#address-field");
var mapContainer = form.querySelector("#map-container");
var latField = form.querySelector("#lat");
var lngField = form.querySelector("#lng");
var polygonField = form.querySelector("#polygon");
var loading = form.querySelector("#loading");
var btnContainer = form.querySelector("#add-footer");
// var districtContainer = form.querySelector("#district-container");
// var districtField = form.querySelector("#district-field");
// var districtVal = new Choices(districtField, {
// shouldSort: false,
// });
document.addEventListener("DOMContentLoaded", function () {
initMap();
if (provinceField.value !== "") {
getRegencies(provinceField.value);
}
// if (provinceField.value !== "") {
// getRegencies(provinceField.value);
// }
});
function getRegencies(provinceId) {
regencyContainer.style.display = "none";
districtContainer.style.display = "none";
addressContainer.style.display = "none";
loading.style.display = "block";
mapContainer.style.display = "none";
// function getRegencies(provinceId) {
// 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;
// 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.clearStore();
// regencyVal.clearChoices();
regencyVal.value = "";
regencyVal.setChoices([
{
value: "",
label: "Pilih Kabupaten",
selected: true,
disabled: true,
},
]);
// 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,
}))
);
// 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>";
},
});
}
// 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";
// 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;
// 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.clearStore();
// districtVal.clearChoices();
districtVal.value = "";
districtVal.setChoices([
{
value: "",
label: "Pilih Kecamatan",
selected: true,
disabled: true,
},
]);
// 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,
}))
);
// 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>";
},
});
}
// 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;
}
// 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";
// navigator.geolocation.getCurrentPosition(
// function (position) {
// loading.style.display = "none";
mapContainer.style.display = "block";
map.invalidateSize();
// mapContainer.style.display = "block";
// map.invalidateSize();
addressContainer.style.display = "block";
// addressContainer.style.display = "block";
var lat = position.coords.latitude;
var lng = position.coords.longitude;
// var lat = position.coords.latitude;
// var lng = position.coords.longitude;
map.setView([lat, lng], 16);
// map.setView([lat, lng], 16);
if (currentMarker) {
map.removeLayer(currentMarker);
}
if (currentMarker || currentMarkerEdit) {
map.removeLayer(currentMarker);
}
// 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],
});
// 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 = L.marker([lat, lng], {
// icon: iconMarker,
// draggable: true,
// }).addTo(map);
currentMarker.on("dragend", onPointerDragend);
// 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();
// 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);
}
);
}
// latField.value = lat;
// lngField.value = lng;
// },
// function (error) {
// alert("Error: " + error.message);
// }
// );
// }
function onPointerDragend() {
if (!currentMarker) return;

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

@ -55,11 +55,12 @@
</div>
</div>
<div class="mb-3">
<button class="btn btn-success" type="button" onclick="getLocation()">Dapatkan Lokasi Lahan!</button>
<div class="mb-3 text-end">
<button id="location-btn" class="btn btn-success btn-load" type="button"
onclick="getLocation()">Dapatkan Lokasi Lahan!</button>
</div>
<div class="mb-3">
{{-- <div class="mb-3">
<label for="province-field" class="form-label">Provinsi</label>
<select name="province_id" id="province-field" class="form-control" required
onchange="getRegencies(this.value)">
@ -101,11 +102,11 @@
<div class="spinner-border text-primary" role="status">
<span class="visually-hidden">Loading...</span>
</div>
</div>
</div> --}}
<div class="mb-3" id="address-container" style="display: none">
<label for="address-field" class="form-label">Alamat</label>
<textarea name="address" id="address-field" rows="3" class="form-control"
<textarea name="address" id="address-field" rows="3" class="form-control" readonly
placeholder="Masukan Alamat, cnth: Jl. Jend. Sudirman No. 12" required></textarea>
<div class="invalid-feedback">
Masukan Alamat