e41220949
/
TIF_NGANJUK_E41220949
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

pin sig

This commit is contained in:
rahmagustin 2026-01-20 11:11:09 +07:00
parent 2be275b1fb
commit 32d581d5a4
4 changed files with 101 additions and 41 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
app/Http/Controllers/Admin/TpsController.php
View File

@ -127,7 +127,7 @@ public function update(Request $request, $id)
// VALIDASI
$request->validate([
'kategori_tps_id' => 'required|exists:kategori_tps,id',
'kategori_tps_id' => 'required|exists:kategori_tps,id_kategori_tps',
'nama_tps' => 'required|string|max:255',
'alamat_tps' => 'required|string|max:255',
'status_tps' => 'required',

4
app/Http/Controllers/IndexController.php
View File

@ -4,6 +4,7 @@
use App\Models\Sampah;
use App\Models\KategoriTps;
use App\Models\LokasiTps;
use Illuminate\Http\Request;
class IndexController extends Controller
@ -12,7 +13,8 @@ public function index()
{
$sampah = Sampah::orderBy('tahun', 'desc')->first();
$kategoriTps = KategoriTps::orderBy('id_kategori_tps')->get();
$lokasiTps = LokasiTps::all();
return view('user.index', compact('sampah', 'kategoriTps'));
return view('user.index', compact('sampah', 'kategoriTps', 'lokasiTps'));
}
}

4
resources/views/admin/tps/edit.blade.php
View File

@ -58,8 +58,8 @@ class="forms-sample">
<select name="kategori_tps_id" class="form-control" required>
<option value="">-- Pilih Kategori --</option>
@foreach ($kategori as $item)
<option value="{{ $item->id }}"
{{ old('kategori_tps_id', $tps->kategori_tps_id) == $item->id ? 'selected' : '' }}>
<option value="{{ $item->id_kategori_tps }}"
{{ old('kategori_tps_id', $tps->kategori_tps_id) == $item->id_kategori_tps ? 'selected' : '' }}>
{{ $item->nama_kategori }}
</option>
@endforeach

132
resources/views/user/index.blade.php
View File

@ -203,64 +203,70 @@
<!-- /Services Section -->
<!-- Call To Action Section -->
{{-- Leaflet CSS & JS --}}
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.9.4/dist/leaflet.css" />
<script src="https://unpkg.com/leaflet@1.9.4/dist/leaflet.js"></script>
<style>
/* Hilangkan padding section */
#call-to-action.call-to-action {
padding: 0 !important;
margin: 0 !important;
}
/* Container dibuat flex agar map bisa center */
#call-to-action .container {
display: flex;
justify-content: center;
padding: 20px 0;
}
/* Wrapper card map modern */
.map-wrapper {
width: 100%;
max-width: 1100px;
/* agar map di tengah */
border-radius: 10px;
border-radius: 12px;
overflow: hidden;
box-shadow: 0 6px 20px rgba(0, 0, 0, 0.12);
}
/* Map full card */
#mapTPS {
width: 100%;
height: 450px;
}
/* Zoom Button Modern */
.leaflet-control-zoom {
border-radius: 10px !important;
box-shadow: 0 4px 14px rgba(0, 0, 0, 0.2) !important;
overflow: hidden !important;
}
/* Popup Modern */
.leaflet-popup-content-wrapper {
border-radius: 14px !important;
box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
}
/* Legend */
.legend {
background: white;
padding: 10px;
border-radius: 8px;
line-height: 18px;
color: #333;
box-shadow: 0 2px 12px rgba(0, 0, 0, 0.15);
}
.legend i {
width: 18px;
height: 18px;
float: left;
margin-right: 8px;
opacity: 0.9;
}
</style>
<section id="call-to-action" class="call-to-action section">
<div class="container" data-aos="fade-up">
<div class="map-wrapper">
<div id="mapTPS"></div>
</div>
</div>
</section>
<script>
// =============================
// INIT MAP
// =============================
var map = L.map('mapTPS').setView([-7.6078, 111.903], 12);
L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
@ -268,30 +274,82 @@
maxZoom: 19
}).addTo(map);
var tpsData = [{
name: "TPS 1 Berbek",
lat: -7.5978,
lng: 111.917
},
{
name: "TPS 2 Loceret",
lat: -7.6280,
lng: 111.910
},
{
name: "TPS 3 Nganjuk Kota",
lat: -7.6140,
lng: 111.900
}
];
// =============================
// ICON MARKER PER KATEGORI
// =============================
function markerIcon(color) {
return new L.Icon({
iconUrl: `https://raw.githubusercontent.com/pointhi/leaflet-color-markers/master/img/marker-icon-${color}.png`,
shadowUrl: 'https://unpkg.com/leaflet@1.9.4/dist/images/marker-shadow.png',
iconSize: [25, 41],
iconAnchor: [12, 41],
popupAnchor: [1, -34],
shadowSize: [41, 41]
});
}
tpsData.forEach(tps => {
L.marker([tps.lat, tps.lng])
.addTo(map)
.bindPopup(`<b style='font-size:16px;'>${tps.name}</b>`);
var iconTPS = markerIcon('green'); // TPS
var iconTPS3R = markerIcon('blue'); // TPS 3R
var iconTPA = markerIcon('red'); // TPA
var iconDefault = markerIcon('grey');
// =============================
// DATA TPS DARI DATABASE
// =============================
var tpsData = @json($lokasiTps);
tpsData.forEach(function(tps) {
if (tps.latitude && tps.longitude) {
let iconKategori = iconDefault;
// SESUAIKAN ID KATEGORI
if (tps.kategori_tps_id == 1) {
iconKategori = iconTPS;
} else if (tps.kategori_tps_id == 2) {
iconKategori = iconTPS3R;
} else if (tps.kategori_tps_id == 3) {
iconKategori = iconTPA;
}
L.marker([tps.latitude, tps.longitude], {
icon: iconKategori
})
.addTo(map)
.bindPopup(`
<div style="min-width:200px">
<strong>${tps.nama_tps}</strong><br>
${tps.alamat_tps ?? ''}<br>
<small>Status: ${tps.status_tps ?? '-'}</small>
</div>
`);
}
});
// =============================
// LEGEND PETA
// =============================
var legend = L.control({
position: "bottomright"
});
legend.onAdd = function() {
var div = L.DomUtil.create("div", "legend");
div.innerHTML = `
<strong>Kategori TPS</strong><br>
<i style="background:green"></i> TPS<br>
<i style="background:blue"></i> TPS 3R<br>
<i style="background:red"></i> TPA
`;
return div;
};
legend.addTo(map);
</script>
<!-- Contact Section -->
<section id="contact" class="contact section">