Update Model, dashboard, lahan

Co-authored-by: Copilot <copilot@github.com>
This commit is contained in:
2026-04-29 11:06:31 +07:00
co-authored by Copilot
parent 8bcb0e47e0
commit d18b0668e1
21 changed files with 1654 additions and 59 deletions
@@ -140,12 +140,11 @@
</div>
</div>
</div>
<script src="https://unpkg.com/leaflet@1.9.4/dist/leaflet.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/leaflet.draw/1.0.4/leaflet.draw.js"></script>
@endsection
@push('scripts')
<script src="https://unpkg.com/leaflet@1.9.4/dist/leaflet.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/leaflet.draw/1.0.4/leaflet.draw.js"></script>
<script>
document.addEventListener("DOMContentLoaded", function() {
@@ -160,7 +159,7 @@
let regionBoundaryLayer = L.featureGroup().addTo(map);
function focusToRegionBoundary(selectElement) {
regionBoundaryLayer.clearLayers(); // Bersihkan garis wilayah sebelumnya
regionBoundaryLayer.clearLayers();
let selectedOption = selectElement.options[selectElement.selectedIndex];
if (!selectedOption || !selectedOption.hasAttribute('data-path')) return;
@@ -175,7 +174,7 @@
function formatCoordinates(coords) {
if (coords.length === 2 && typeof coords[0] === 'number') {
return [coords[0], coords[1]]; // JANGAN DIBALIK
return [coords[0], coords[1]]; // JANGAN DIBALIK (Leaflet Draw butuh format asli)
}
return coords.map(formatCoordinates);
}
@@ -183,11 +182,11 @@
let latLngs = formatCoordinates(rawData);
let polygon = L.polygon(latLngs, {
color: '#3b5998',
fillColor: '#3b5998',
fillOpacity: 0.1,
weight: 2,
dashArray: '5, 5',
color: '#ffc107',
fillColor: '#ffc107',
fillOpacity: 0.15,
weight: 3,
dashArray: '8, 6',
interactive: false
});
@@ -229,10 +228,8 @@
map.on(L.Draw.Event.CREATED, function (e) {
let layer = e.layer;
drawnItems.clearLayers();
drawnItems.addLayer(layer);
updatePathTextarea(layer);
});
@@ -244,14 +241,32 @@
map.on(L.Draw.Event.DELETED, function () {
document.getElementById('path').value = '';
let luasInput = document.querySelector('input[name="luas_lahan"]');
if (luasInput) luasInput.value = '';
});
function updatePathTextarea(layer) {
let latlngs = layer.getLatLngs()[0];
let pathData = latlngs.map(function(latlng) {
return [latlng.lng, latlng.lat];
});
document.getElementById('path').value = JSON.stringify(pathData);
let areaSquareMeters = L.GeometryUtil.geodesicArea(latlngs);
let areaHectares = areaSquareMeters / 10000;
let luasInput = document.querySelector('input[name="luas_lahan"]');
if (luasInput) {
luasInput.value = areaHectares.toFixed(2);
luasInput.style.transition = "background-color 0.5s ease";
luasInput.style.backgroundColor = "#e8fdf0";
setTimeout(() => {
luasInput.style.backgroundColor = "";
}, 1500);
}
}
let statusSelect = document.getElementById('status_kepemilikan');
@@ -162,12 +162,11 @@
</div>
</div>
</div>
<script src="https://unpkg.com/leaflet@1.9.4/dist/leaflet.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/leaflet.draw/1.0.4/leaflet.draw.js"></script>
@endsection
@push('scripts')
<script src="https://unpkg.com/leaflet@1.9.4/dist/leaflet.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/leaflet.draw/1.0.4/leaflet.draw.js"></script>
<script>
document.addEventListener("DOMContentLoaded", function() {
@@ -204,11 +203,11 @@
let latLngs = formatCoordinates(rawData);
let polygon = L.polygon(latLngs, {
color: '#3b5998',
fillColor: '#3b5998',
fillOpacity: 0.1,
weight: 2,
dashArray: '5, 5',
color: '#ffc107',
fillColor: '#ffc107',
fillOpacity: 0.15,
weight: 3,
dashArray: '8, 6',
interactive: false
});
@@ -276,14 +275,32 @@
map.on(L.Draw.Event.DELETED, function () {
document.getElementById('path').value = '';
let luasInput = document.querySelector('input[name="luas_lahan"]');
if (luasInput) luasInput.value = '';
});
function updatePathTextarea(layer) {
let latlngs = layer.getLatLngs()[0];
let pathData = latlngs.map(function(latlng) {
return [latlng.lng, latlng.lat];
});
document.getElementById('path').value = JSON.stringify(pathData);
let areaSquareMeters = L.GeometryUtil.geodesicArea(latlngs);
let areaHectares = areaSquareMeters / 10000;
let luasInput = document.querySelector('input[name="luas_lahan"]');
if (luasInput) {
luasInput.value = areaHectares.toFixed(2);
luasInput.style.transition = "background-color 0.5s ease";
luasInput.style.backgroundColor = "#e8fdf0";
setTimeout(() => {
luasInput.style.backgroundColor = "";
}, 1500);
}
}
let statusSelect = document.getElementById('status_kepemilikan');