TIMOR-TELECOM/gps-frontend
5
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

update dashboard

Browse Source
This commit is contained in:
Pringgosutono
2025-09-03 19:06:32 +07:00
parent c492711d83
commit ccd7b19ff5
1 changed files with 150 additions and 118 deletions
Download Patch File Download Diff File Expand all files Collapse all files

96
resources/views/menu_v1/dashboard.blade.php
View File

@ -272,6 +272,7 @@
<p class="text-bold mb-0">Engine Status</p>
<p id="infoVehicles-engineStatus" class="text-muted mb-0">Idling</p>
</li>
{{-- <li class="list-group-item p-1 px-2">
<p class="text-bold mb-0">Durasi Berhenti (<span id="infoVehicles-idlingUnit">min</span>)</p>
<p id="infoVehicles-idlingDuration" class="text-muted mb-0">2946</p>
@ -408,10 +409,11 @@
<label class="text-muted">From</label>
<input class="form-control" id="historyStartDate">
</div>
<div class="mb-3">
<div class="mb-2">
<label class="text-muted">To</label>
<input class="form-control" id="historyEndDate">
</div>
<button class="btn btn-primary btn-sm w-100 mb-3" id="historySearch">Search</button>
</div>
<div id="infoMove-plots" class="infoMove-plots">
{{-- <a href="#" class="plotMove-item">
@ -514,6 +516,13 @@
<span class="badge p-1 ps-3 pe-3 bg-warning me-2">Idling</span>
<span class="badge p-1 ps-3 pe-3 bg-success">Moving</span>
</div>
<div class="col text-end" id="tripInfo">
<span class="badge p-1 ps-3 pe-3 bg-info me-2" style="background-color:#C0392B !important;">Trip 1</span>
<span class="badge p-1 ps-3 pe-3 bg-info me-2" style="background-color:#2980B9 !important;">Trip 2</span>
<span class="badge p-1 ps-3 pe-3 bg-info me-2" style="background-color:#27AE60 !important;">Trip 3</span>
<span class="badge p-1 ps-3 pe-3 bg-info me-2" style="background-color:#D35400 !important;">Trip 4</span>
<span class="badge p-1 ps-3 pe-3 bg-info me-2" style="background-color:#F39C12 !important;">Trip 5</span>
</div>
</div>
</div>
</div>
@ -941,7 +950,7 @@
waypoints: latLngs.reverse(), // reverse to make first point as start
// router: L.Routing.osrmv1(),
router: L.Routing.osrmv1({
serviceUrl: "https://brilianapps.britimorleste.tl/osrm-backend/route/v1",
serviceUrl: "https://brilianapps.britimorleste.tl:5001/route/v1",
}),
show: false,
itinerary: null, // 👈 completely removes the panel
@ -950,7 +959,7 @@
routeWhileDragging: false, // optional: don’t reroute while dragging
createMarker: () => null,
lineOptions:{
styles: [{ color: locs[0]?.options?.color, weight: 5, opacity: 0.7 }],
styles: [{ color: locs[0]?.options?.color, weight: 3, opacity: 0.7 }],
},
}).addTo(Leaflet.map)
@ -1505,7 +1514,14 @@
});
},
eventFilterHistoryDate: function() {
$('#historyStartDate, #historyEndDate').on('change', function(e) {
$('#historySearch').on('click', function(e) {
e.preventDefault();
// console.log("change history date", this.id, this.value);
const value = this.value;
const id = this.id;
if(State[id] == moment(value, "DD-MM-YYYY HH:mm").unix())
return false;
const date0 = moment($('#historyStartDate').val(), "DD-MM-YYYY HH:mm")
const date1 = moment($('#historyEndDate').val(), "DD-MM-YYYY HH:mm")
const {
@ -2780,30 +2796,62 @@
})
// console.log("truckRoutes update", polyTruckRoutes);
polyTruckRoutes.forEach((poly, idx) => {
polyTruckRoutes.forEach(async (poly, idx) => {
// console.log("poly", poly);
let polyline = Leaflet.addRoutes(poly)
// let polyline = Leaflet.addPolylines(poly)
// if(idx == 0)
// Leaflet.map.fitBounds(polyline.getBounds());
// let circlesStartStop = []
// Leaflet.addCircles(poly, function(circle, i) {
// if(i == 0 || i == (polyTruckRoutes.length - 1))
// circlesStartStop.push(circle)
// let circlesStartStop = [...poly.filter((p, i) => i == 0 || i == (poly.length - 1))]
let circlesStartStop = []
// console.log("circlesStartStop", circlesStartStop);
// window.addEventListener('eventRemoveRouteStartEnd', function handler(e) {
// circle.remove();
// });
// circle.on('click', function() {
// PgBar.syncToPlotTravelHistory(i);
// })
// });
function addCirclesAsync(poly) {
return new Promise(resolve => {
let circles = [];
Leaflet.addCircles(poly, function(circle, i) {
if(i == 0 || i == (polyTruckRoutes.length - 1))
circlesStartStop.push(circle)
if (i === 0 || i === (poly.length - 1)) {
circles.push(circle);
}
window.addEventListener('eventRemoveRouteStartEnd', function handler(e) {
circle.remove();
});
circle.on('click', function() {
PgBar.syncToPlotTravelHistory(i);
})
});
// ✅ When last point processed, resolve
if (i === poly.length - 1) {
resolve(circles);
}
});
});
}
let circlesStartStop = [];
for (let [idx, poly] of polyTruckRoutes.entries()) {
let polyline = Leaflet.addRoutes(poly);
// wait for all circles
circlesStartStop = await addCirclesAsync(poly);
// keep event + removal logic here
State.eventRemoveRouteStartEnd = new CustomEvent('eventRemoveRouteStartEnd', {
detail: { polyline, circlesStartStop }
});
window.addEventListener('eventRemoveRouteStartEnd', function(e) {
polyline.remove();
circlesStartStop.forEach(c => c.remove());
});
}
// // remove marker, circle, event listener and all about this marker
State.eventRemoveRouteStartEnd = new CustomEvent('eventRemoveRouteStartEnd', {
detail: {
@ -2813,28 +2861,12 @@
});
window.addEventListener('eventRemoveRouteStartEnd', function (e) {
// console.log("circlesStartStop", circlesStartStop);
polyline.remove();
circlesStartStop.forEach(c => c.remove())
});
// State.eventRemoveRouteStartEnd = new CustomEvent('eventRemoveRouteStartEnd', {
// polyline,
// circlesStartStop,
// });
// console.log("polyline", polyline);
// console.log("circlesStartStop", circlesStartStop);
// console.log("State.eventRemoveRouteStartEnd", State.eventRemoveRouteStartEnd);
})
window.addEventListener('eventRemoveRouteStartEnd', function handler(e) {
// startMarker.removeEventListener('click');
// startMarker.removeEventListener('moveend');
// startMarker.remove();
// finishMarker.removeEventListener('click');
// finishMarker.removeEventListener('moveend');
// finishMarker.remove();
// polyline.remove();
e.currentTarget.removeEventListener(e.type,
handler); // window.removeEventListener('remove', this.handler, true);
State.eventRemoveRouteStartEnd = null;