Remediate the 2026-09-03 feature-test findings

plugins/printers/frontend/views/TonerReport.vue

@@ -17,8 +17,18 @@
     </div>
 
     <template v-else>
+      <!-- Cannot see the supplies: say so instead of reporting zeros. -->
+      <div v-if="unavailable" class="card blind-notice">
+        <strong>Supply levels are not being read.</strong>
+        <p>{{ unavailable }}</p>
+        <p class="muted">
+          The counts below are not a result - nothing was measured. Check the
+          supply monitoring configuration in Settings.
+        </p>
+      </div>
+
       <!-- Summary Bar -->
-      <div class="summary-bar">
+      <div v-if="!unavailable" class="summary-bar">
         <div class="summary-stat card">
           <div class="stat-value">{{ summary.total_checked }}</div>
           <div class="stat-label">Printers Checked</div>
@@ -122,6 +132,9 @@
               </tr>
             </tbody>
           </table>
+          <p v-else-if="unavailable" class="empty-state">
+            No supply data was read, so there is nothing to list.
+          </p>
           <p v-else class="empty-state">No printers match the selected filter.</p>
         </div>
       </div>
@@ -156,6 +169,7 @@ const loading = ref(true)
 const error = ref(null)
 const printers = ref([])
 const summary = ref({ total_checked: 0, low: 0, critical: 0 })
+const unavailable = ref('')
 const filter = ref('all')
 
 const filterOptions = [
@@ -239,6 +253,11 @@ onMounted(async () => {
     const data = response.data.data
     printers.value = data.printers || []
     summary.value = data.summary || { total_checked: 0, low: 0, critical: 0 }
+    // The API says so explicitly when it cannot see supplies at all. Without
+    // this the page rendered the zeros it was given - "0 Printers Checked,
+    // 0 Low, 0 Critical" and "No printers match the selected filter" - which
+    // reads as a clean bill of health for a fleet nobody has looked at.
+    unavailable.value = data.unavailable || ''
   } catch (err) {
     console.error('Error loading toner report:', err)
     error.value = 'Failed to load supply data. Zabbix may not be configured or reachable.'
@@ -249,6 +268,13 @@ onMounted(async () => {
 </script>
 
 <style scoped>
+.blind-notice {
+  border-left: 3px solid var(--warning);
+  margin-bottom: 1rem;
+}
+.blind-notice p {
+  margin: 0.4rem 0 0 0;
+}
 .summary-bar {
   display: flex;
   gap: 1.5rem;