From be3ba7d1d34fc7a682f9ff004337cf11a38bec83 Mon Sep 17 00:00:00 2001
From: wh1te909 <dcparsi@gmail.com>
Date: Thu, 18 Nov 2021 07:46:17 +0000
Subject: [PATCH] change drive color based on percent closes #802

---
 src/components/agents/SummaryTab.vue | 19 ++++++++++++++++++-
 1 file changed, 18 insertions(+), 1 deletion(-)

diff --git a/src/components/agents/SummaryTab.vue b/src/components/agents/SummaryTab.vue
index 173a6fe..b42efee 100644
--- a/src/components/agents/SummaryTab.vue
+++ b/src/components/agents/SummaryTab.vue
@@ -102,7 +102,13 @@
         <span class="text-subtitle2 text-bold">Disks</span>
         <div v-for="disk in disks" :key="disk.device">
           <span>{{ disk.device }} ({{ disk.fstype }})</span>
-          <q-linear-progress rounded size="15px" :value="disk.percent / 100" color="green" class="q-mt-sm" />
+          <q-linear-progress
+            rounded
+            size="15px"
+            :value="disk.percent / 100"
+            :color="diskBarColor(disk.percent)"
+            class="q-mt-sm"
+          />
           <span>{{ disk.free }} free of {{ disk.total }}</span>
           <q-separator />
         </div>
@@ -130,6 +136,16 @@ export default {
     const summary = ref(null);
     const loading = ref(false);
 
+    function diskBarColor(percent) {
+      if (percent < 80) {
+        return "positive";
+      } else if (percent > 80 && percent < 95) {
+        return "warning";
+      } else {
+        return "negative";
+      }
+    }
+
     const disks = computed(() => {
       if (!summary.value.disks) {
         return [];
@@ -181,6 +197,7 @@ export default {
       // methods
       getSummary,
       refreshSummary,
+      diskBarColor,
     };
   },
 };