feat(tickets): centre filters with tiles; show only ISP vehicles

- Vertically centre the cluster/status/window filters against the metric tiles
  in the INC overview row.
- Overlay only ISP cost-centre vehicles (the teams handling INC); other cost
  centres are filtered out. Layer count + labels updated to "ISP vehicles".

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
david kiania 2026-06-16 12:37:50 +03:00
parent 930a646116
commit 737f8c3d31

View file

@ -223,7 +223,7 @@
.sla-unknown { color: var(--muted); }
/* INC overview row: metric tiles (left) + filters (right) on one balanced row */
.tk-overview-row { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px 28px; flex-wrap: wrap; }
.tk-overview-row { display: flex; align-items: center; justify-content: space-between; gap: 16px 28px; flex-wrap: wrap; }
.tk-overview-metrics { min-width: 0; }
.tk-filters { display: flex; gap: 12px; align-items: flex-end; flex-wrap: wrap; margin-left: auto; }
.tk-filters .ff select, .tk-filters .ff input { min-width: 130px; }
@ -424,7 +424,7 @@
</div>
<div class="card span12">
<h2>Live INC map <span class="count">open (SLA-coloured) · closed overlay · vehicles</span></h2>
<h2>Live INC map <span class="count">open (SLA-coloured) · closed overlay · ISP vehicles</span></h2>
<div class="map-wrap">
<div id="tk-map"></div>
<div id="tk-layers" class="map-ctl collapsed">
@ -1161,11 +1161,12 @@ async function loadLive() {
const seen = new Set();
for (const f of feats) {
const p = f.properties || {}; if (!p.imei) continue;
// INC tickets are handled by ISP teams — only overlay ISP cost-centre vehicles.
if ((p.cost_centre || '').trim().toLowerCase() !== 'isp') continue;
seen.add(p.imei); upsertVeh(p, f.geometry.coordinates);
}
for (const [imei, m] of tkMarkers) if (!seen.has(imei)) { m.remove(); tkMarkers.delete(imei); }
const s = j.summary || {};
vehCount = s.vehicle_count ?? feats.length;
vehCount = seen.size;
buildIncLayers();
} catch (e) { console.warn('live', e); }
}
@ -1237,7 +1238,7 @@ function buildIncLayers() {
const rows = [
{ id: 'open', label: 'Open INC', color: SLA_COLORS.breached, n: m.open_now ?? 0 },
{ id: 'closed', label: 'Closed INC', color: CLOSED_COLOR, n: m.closed_in_window ?? 0 },
{ id: 'vehicles', label: 'Vehicles', color: '#E8954A', n: vehCount },
{ id: 'vehicles', label: 'ISP vehicles', color: '#E8954A', n: vehCount },
];
let html = rows.map((r) =>
`<label class="layers-row"><input type="checkbox" data-lyr="${r.id}"${tkLayerState[r.id] ? ' checked' : ''}>