Probindo/database-pertani-web
5
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

hover and scroll on map

Browse Source
This commit is contained in:
fir2be
2026-10-15 14:12:03 +07:00
parent 2e8271d27a
commit df2b5a1312
2 changed files with 29 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/Http/Controllers/Web/Dashboard/SummaryController.php
+8 -8
View File
@@ -233,14 +233,14 @@ class SummaryController extends Controller
$aksesPasar = $this->filteredAksesPasar($request); $aksesPasar = $this->filteredAksesPasar($request);
$kpiCards = [ $kpiCards = [
// [ [
// 'value' => number_format($totalPetani, 0, ',', '.'), 'value' => number_format($totalPetani, 0, ',', '.'),
// 'unit' => 'orang', 'unit' => 'orang',
// 'label' => 'Jumlah Petani', 'label' => 'Jumlah Petani',
// 'description' => 'Petani sesuai filter yang dipilih', 'description' => 'Petani sesuai filter yang dipilih',
// 'icon' => 'tabler-users', 'icon' => 'tabler-users',
// 'variant' => 'primary', 'variant' => 'primary',
// ], ],
[ [
'value' => number_format($totalLuasLahan, 2, ',', '.'), 'value' => number_format($totalLuasLahan, 2, ',', '.'),
'unit' => 'ha', 'unit' => 'ha',
resources/views/dashboard/produktivitas.blade.php
+21 -2
View File
@@ -248,6 +248,7 @@
box-shadow: 0 6px 24px rgba(0, 0, 0, .2); box-shadow: 0 6px 24px rgba(0, 0, 0, .2);
left: auto; left: auto;
max-height: calc(100% - 2rem); max-height: calc(100% - 2rem);
overscroll-behavior: contain;
overflow-y: auto; overflow-y: auto;
padding: .875rem; padding: .875rem;
pointer-events: auto; pointer-events: auto;
@@ -258,6 +259,11 @@
z-index: 700; z-index: 700;
} }
.produksi-map-information-overlay:focus-visible {
outline: 2px solid var(--bs-primary, #7367f0);
outline-offset: 2px;
}
.produksi-map-information { .produksi-map-information {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
@@ -782,7 +788,7 @@
Kembali ke Atas Kembali ke Atas
</button> </button>
<div id="produksi-map-empty" class="produksi-map-empty">Belum ada poligon lahan untuk filter ini.</div> <div id="produksi-map-empty" class="produksi-map-empty">Belum ada poligon lahan untuk filter ini.</div>
<div class="produksi-map-information-overlay"> <div class="produksi-map-information-overlay" tabindex="0" role="region" aria-label="Informasi peta sebaran">
<div class="produksi-map-information" id="produksi-map-information"></div> <div class="produksi-map-information" id="produksi-map-information"></div>
</div> </div>
</div> </div>
@@ -810,7 +816,7 @@
Kembali ke Atas Kembali ke Atas
</button> </button>
<div id="produksi-budidaya-map-empty" class="produksi-map-empty">Belum ada poligon lahan untuk filter ini.</div> <div id="produksi-budidaya-map-empty" class="produksi-map-empty">Belum ada poligon lahan untuk filter ini.</div>
<div class="produksi-map-information-overlay"> <div class="produksi-map-information-overlay" tabindex="0" role="region" aria-label="Informasi peta praktik budidaya">
<div class="produksi-map-information" id="produksi-budidaya-map-information"></div> <div class="produksi-map-information" id="produksi-budidaya-map-information"></div>
</div> </div>
</div> </div>
@@ -1460,6 +1466,17 @@ document.addEventListener('DOMContentLoaded', function () {
map: null, map: null,
}; };
function enableMapInformationInteraction(mapElement) {
const informationOverlay = mapElement.querySelector('.produksi-map-information-overlay');
if (!informationOverlay) return;
L.DomEvent.disableScrollPropagation(informationOverlay);
L.DomEvent.disableClickPropagation(informationOverlay);
informationOverlay.addEventListener('click', function () {
informationOverlay.focus({ preventScroll: true });
});
}
function initProductionMap() { function initProductionMap() {
const element = document.getElementById('produksi-sebaran-map'); const element = document.getElementById('produksi-sebaran-map');
@@ -1485,6 +1502,7 @@ document.addEventListener('DOMContentLoaded', function () {
productionMapState.group = L.featureGroup().addTo(productionMapState.map); productionMapState.group = L.featureGroup().addTo(productionMapState.map);
productionMapState.backButton = document.getElementById('produksi-map-back'); productionMapState.backButton = document.getElementById('produksi-map-back');
productionMapState.empty = document.getElementById('produksi-map-empty'); productionMapState.empty = document.getElementById('produksi-map-empty');
enableMapInformationInteraction(element);
L.control.zoom({ position: 'topleft' }).addTo(productionMapState.map); L.control.zoom({ position: 'topleft' }).addTo(productionMapState.map);
@@ -1712,6 +1730,7 @@ document.addEventListener('DOMContentLoaded', function () {
cultivationMapState.group = L.featureGroup().addTo(cultivationMapState.map); cultivationMapState.group = L.featureGroup().addTo(cultivationMapState.map);
cultivationMapState.backButton = document.getElementById('produksi-budidaya-map-back'); cultivationMapState.backButton = document.getElementById('produksi-budidaya-map-back');
cultivationMapState.empty = document.getElementById('produksi-budidaya-map-empty'); cultivationMapState.empty = document.getElementById('produksi-budidaya-map-empty');
enableMapInformationInteraction(element);
L.control.zoom({ position: 'topleft' }).addTo(cultivationMapState.map); L.control.zoom({ position: 'topleft' }).addTo(cultivationMapState.map);