Overview landing page: issue counters, progress, status, locations, deployment calendar

web/index.html

@@ -352,8 +352,10 @@
         }
     </style>
     <link rel="stylesheet" href="/layout.css">
+    <link rel="stylesheet" href="/overview.css">
     <script src="/layout.js"></script>
     <script src="/device-info.js"></script>
+    <script src="/overview.js"></script>
     <script src="/excel-filter.js" defer></script>
 </head>
 <body>
@@ -373,7 +375,8 @@
         </div>
         
         <div class="nav-links" id="nav-links-menu">
-            <button class="nav-btn active" id="btn-tracked" onclick="switchPage('tracked-devices')">Tracked Devices</button>
+            <button class="nav-btn active" id="btn-overview" onclick="switchPage('overview')">Overview</button>
+            <button class="nav-btn" id="btn-tracked" onclick="switchPage('tracked-devices')">Tracked Devices</button>
             <button class="nav-btn" id="btn-workbench" onclick="switchPage('workbench')">My Workbench</button>
             <button class="nav-btn" id="btn-all" onclick="switchPage('all-devices')">USMT Status</button>
             <button class="nav-btn" id="btn-software" onclick="switchPage('software')">All Devices</button>
@@ -389,7 +392,11 @@
     
     <div class="main">
         
-        <div id="tracked-devices" class="page">
+        <div id="overview" class="page">
+            <div id="overview-root"></div>
+        </div>
+
+        <div id="tracked-devices" class="page" style="display:none;">
             <h1 style="margin-top: 0;">Tracked Devices</h1>
             <p style="color: var(--text-muted); margin-top:-15px;">Add devices here to register them with the server for active USMT tracking.</p>