WebSVN – SmartDukaan – Diff – //trunk/profitmandi-fofo/src/main/webapp/WEB-INF/views/ftl/beat-report-user-detail.vm

             <div class="modal-body" style="padding:0;">
                 <div id="liveTrackingInfo" style="padding:8px 15px; background:#f8f9fa; border-bottom:1px solid #ddd; font-size:13px;"></div>
                 <div id="liveTrackingMap" style="height:500px; width:100%;"></div>
             </div>
             <div class="modal-footer">
+                <label style="float:left; margin-top:7px; font-weight:normal; font-size:13px;">
+                    <input type="checkbox" id="autoRefreshToggle" checked style="margin-right:5px;"> Auto-refresh (30s)
+                </label>
                 <button type="button" class="btn btn-primary" id="refreshTrackingBtn"><i class="fa fa-refresh"></i> Refresh</button>
                 <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
             </div>
         </div>
     </div>
             liveTrackingMap._markers.forEach(function (m) { m.setMap(null); });
+        }
         if (liveTrackingMap._polyline) {
             liveTrackingMap._polyline.setMap(null);
+        }
+        if (liveTrackingMap._visitRoute) {
+            liveTrackingMap._visitRoute.setMap(null);
+        }
         if (liveTrackingMap._currentMarker) {
             liveTrackingMap._currentMarker.setMap(null);
+        }
         liveTrackingMap._markers = [];
             })(marker, infoContent);
             liveTrackingMap._markers.push(marker);
+        }
+        // Draw visit-to-visit route (dashed line with arrows)
+        var visitCoords = [];
+        for (var vi = 0; vi < visits.length; vi++) {
+            var vv = visits[vi];
+            if (!vv.lat || !vv.lng) continue;
+            var vLat = parseFloat(vv.lat);
+            var vLng = parseFloat(vv.lng);
+            if (isNaN(vLat) || isNaN(vLng) || (vLat === 0 && vLng === 0)) continue;
+            visitCoords.push({ lat: vLat, lng: vLng });
+        }
+        if (visitCoords.length > 1) {
+            liveTrackingMap._visitRoute = new google.maps.Polyline({
+                path: visitCoords,
+                geodesic: true,
+                strokeColor: '#8e44ad',
+                strokeOpacity: 0,
+                strokeWeight: 3,
+                icons: [{
+                    icon: { path: 'M 0,-1 0,1', strokeOpacity: 0.6, strokeWeight: 3, scale: 3 },
+                    offset: '0',
+                    repeat: '16px'
+                }, {
+                    icon: { path: google.maps.SymbolPath.FORWARD_CLOSED_ARROW, strokeOpacity: 0.8, scale: 3 },
+                    offset: '50%',
+                    repeat: '200px'
+                }],
+                map: liveTrackingMap
+            });
+        }
         if (pathPoints.length > 0) {
             var pathCoords = [];
             for (var j = 0; j < pathPoints.length; j++) {
                 var pt = pathPoints[j];
                 var pLat = parseFloat(pt.lat);
             liveTrackingMap.fitBounds(bounds);
+        }
         var totalVisits = visits.filter(function (v) { return v.markType !== 'PUNCHIN' && v.markType !== 'PUNCHOUT'; }).length;
         var completedVisits = visits.filter(function (v) { return v.markType === 'CHECKIN-CHECKOUT' || v.markType === 'CHECKOUT'; }).length;
+        var now = new Date();
+        var timeStr = now.getHours().toString().padStart(2, '0') + ':' + now.getMinutes().toString().padStart(2, '0') + ':' + now.getSeconds().toString().padStart(2, '0');
         $('#liveTrackingInfo').html(
             '<strong>' + username + '</strong> | ' +
             'Visits: <strong>' + totalVisits + '</strong> | ' +
             'Completed: <strong>' + completedVisits + '</strong> | ' +
             'Path Points: <strong>' + pathPoints.length + '</strong>' +
-            (pathPoints.length > 0 ? ' | <span style="color:#e74c3c;"><i class="fa fa-circle"></i></span> Last Known Location' : '')
+            (pathPoints.length > 0 ? ' | <span style="color:#e74c3c;"><i class="fa fa-circle"></i></span> Last Known' : '') +
+            ' | <span style="color:#3498db;">━</span> GPS Path' +
+            (visitCoords.length > 1 ? ' | <span style="color:#8e44ad;">┅</span> Visit Route' : '') +
+            ' | <span style="color:#999;">Updated: ' + timeStr + '</span>'
         );
+    }
     function ensureGoogleMaps(callback) {
         if (window.google && window.google.maps) {
         s.src = 'https://maps.googleapis.com/maps/api/js?key=AIzaSyAckO0y4Z6WhBOuMjNjioWLSYZDhGEvGBc&v=weekly';
         s.onload = callback;
         document.head.appendChild(s);
+    }
+    var liveTrackingUsername = '';
+    function startAutoRefresh() {
+        stopAutoRefresh();
+        if ($('#autoRefreshToggle').is(':checked') && liveTrackingUserId) {
+            liveTrackingInterval = setInterval(function () {
+                loadLiveTracking(liveTrackingUserId, liveTrackingUsername);
+            }, 30000);
+        }
+    }
+    function stopAutoRefresh() {
+        if (liveTrackingInterval) {
+            clearInterval(liveTrackingInterval);
+            liveTrackingInterval = null;
+        }
+    }
     $(document).on('click.livetrack', '.live-tracking-btn', function () {
         liveTrackingUserId = $(this).data('userid');
-        var username = $(this).data('username');
+        liveTrackingUsername = $(this).data('username');
-        $('#liveTrackingModalTitle').html('<i class="fa fa-map-marker"></i> Live Tracking - ' + username);
+        $('#liveTrackingModalTitle').html('<i class="fa fa-map-marker"></i> Live Tracking - ' + liveTrackingUsername);
         $('#liveTrackingInfo').html('<div class="text-center"><i class="fa fa-spinner fa-spin"></i> Loading...</div>');
         $('#liveTrackingModal').modal('show');
         setTimeout(function () {
             liveTrackingMap = null;
             ensureGoogleMaps(function () {
-                loadLiveTracking(liveTrackingUserId, username);
+                loadLiveTracking(liveTrackingUserId, liveTrackingUsername);
+                startAutoRefresh();
             });
         }, 300);
     });
     $(document).on('click.livetrack', '#refreshTrackingBtn', function () {
         if (liveTrackingUserId) {
-            var username = $('#liveTrackingModalTitle').text().replace('Live Tracking - ', '').trim();
             $('#liveTrackingInfo').html('<div class="text-center"><i class="fa fa-spinner fa-spin"></i> Refreshing...</div>');
-            loadLiveTracking(liveTrackingUserId, username);
+            loadLiveTracking(liveTrackingUserId, liveTrackingUsername);
+        }
     });
-    $('#liveTrackingModal').on('hidden.bs.modal', function () {
+    $(document).on('change', '#autoRefreshToggle', function () {
-        if (liveTrackingInterval) {
+        if ($(this).is(':checked')) {
-            clearInterval(liveTrackingInterval);
+            startAutoRefresh();
+        } else {
-            liveTrackingInterval = null;
+            stopAutoRefresh();
+        }
     });
+    $('#liveTrackingModal').on('hidden.bs.modal', function () {
+        stopAutoRefresh();
+        liveTrackingUserId = null;
+    });
 </script>

Subversion Repositories SmartDukaan

(root)//trunk/profitmandi-fofo/src/main/webapp/WEB-INF/views/ftl/beat-report-user-detail.vm – Rev 36666 → 36682