| | <!DOCTYPE html> |
| | <html lang="en"> |
| | <head> |
| | <meta charset="UTF-8" /> |
| | <meta name="viewport" content="width=device-width, initial-scale=1.0" /> |
| | <title>Provider Telemetry Console</title> |
| | <link rel="stylesheet" href="static/css/pro-dashboard.css" /> |
| | <script src="https://cdn.jsdelivr.net/npm/chart.js@4.4.0/dist/chart.umd.min.js"></script> |
| | </head> |
| | <body data-theme="dark"> |
| | <main class="main-area" style="margin-left:auto;margin-right:auto;max-width:1400px;"> |
| | <header class="topbar"> |
| | <div> |
| | <h1>Provider Monitoring</h1> |
| | <p class="text-muted">Glass dashboard for ingestion partners</p> |
| | </div> |
| | <div class="status-group"> |
| | <div class="status-pill" data-admin-health data-state="warn"> |
| | <span class="status-dot"></span> |
| | <span>checking</span> |
| | </div> |
| | <button class="ghost" data-admin-refresh>Refresh</button> |
| | </div> |
| | </header> |
| | <section class="page active"> |
| | <div class="stats-grid" data-admin-providers></div> |
| | <div class="grid-two"> |
| | <div class="glass-card"> |
| | <h3>Latency Distribution</h3> |
| | <canvas id="provider-latency-chart" height="220"></canvas> |
| | </div> |
| | <div class="glass-card"> |
| | <h3>Health Split</h3> |
| | <canvas id="provider-status-chart" height="220"></canvas> |
| | </div> |
| | </div> |
| | <div class="glass-card"> |
| | <div class="section-header"> |
| | <h3>Provider Directory</h3> |
| | <span class="text-muted">Fetched from /api/providers</span> |
| | </div> |
| | <div class="table-wrapper"> |
| | <table> |
| | <thead> |
| | <tr> |
| | <th>Name</th> |
| | <th>Category</th> |
| | <th>Latency</th> |
| | <th>Status</th> |
| | <th>Endpoint</th> |
| | </tr> |
| | </thead> |
| | <tbody data-admin-table></tbody> |
| | </table> |
| | </div> |
| | </div> |
| | </section> |
| | </main> |
| | <script type="module" src="static/js/adminDashboard.js"></script> |
| | </body> |
| | </html> |
| |
|
