Add tabbed dashboard at /dashboard/ with three D3.js visualizations: - Vendor treemap (devices grouped by type and vendor) - SSID social graph (force-directed, shared probed SSIDs as edges) - Fingerprint clusters (packed circles by device behavior) Intelligence API endpoints at /api/v1/intelligence/ with param validation. Dashboard built on htmx + Pico CSS dark theme + D3 v7, all vendored locally (make vendor). 13 new tests (59 total).
20 lines
722 B
HTML
20 lines
722 B
HTML
{% extends "base.html" %}
|
|
{% block title %}Device Intelligence — ESP32-Web{% endblock %}
|
|
|
|
{% block content %}
|
|
<hgroup>
|
|
<h2>Device Intelligence</h2>
|
|
<p>{{ total_devices }} devices tracked across {{ total_sensors }} sensors</p>
|
|
</hgroup>
|
|
|
|
<nav class="tab-nav">
|
|
<a href="#" hx-get="{{ url_for('dashboard.tab_vendor_treemap') }}" hx-target="#tab-content">Vendor Treemap</a>
|
|
<a href="#" hx-get="{{ url_for('dashboard.tab_ssid_graph') }}" hx-target="#tab-content">SSID Graph</a>
|
|
<a href="#" hx-get="{{ url_for('dashboard.tab_fingerprint_clusters') }}" hx-target="#tab-content">Fingerprint Clusters</a>
|
|
</nav>
|
|
|
|
<div id="tab-content">
|
|
<div class="viz-loading" aria-busy="true">Loading...</div>
|
|
</div>
|
|
{% endblock %}
|