feat: maintenace mode

src/components/AgentTable.vue

@@ -128,6 +128,14 @@
                 <q-item-section>Remote Background</q-item-section>
               </q-item>
 
+              <!-- maintenance mode -->
+              <q-item clickable @click="toggleMaintenance(props.row)">
+                <q-item-section side>
+                  <q-icon size="xs" name="construction" />
+                </q-item-section>
+                <q-item-section>{{ menuMaintenanceText(props.row.maintenance_mode) }}</q-item-section>
+              </q-item>
+
               <!-- patch management -->
               <q-item clickable>
                 <q-item-section side>
@@ -232,7 +240,15 @@
             />
           </q-td>
           <q-td key="checks-status" :props="props">
-            <q-icon v-if="props.row.checks.has_failing_checks" name="fas fa-check-double" size="1.2em" color="negative">
+            <q-icon v-if="props.row.maintenance_mode" name="fas fa-check-double" size="1.2em" color="warning">
+              <q-tooltip>Maintenance Mode Enabled</q-tooltip>
+            </q-icon>
+            <q-icon
+              v-else-if="props.row.checks.has_failing_checks"
+              name="fas fa-check-double"
+              size="1.2em"
+              color="negative"
+            >
               <q-tooltip>Checks failing</q-tooltip>
             </q-icon>
             <q-icon v-else name="fas fa-check-double" size="1.2em" color="positive">
@@ -312,6 +328,7 @@
 
 <script>
 import axios from "axios";
+import { notifySuccessConfig, notifyErrorConfig } from "@/mixins/mixins";
 import mixins from "@/mixins/mixins";
 import { mapGetters } from "vuex";
 import { openURL } from "quasar";
@@ -532,6 +549,29 @@ export default {
           this.notifyError(e.response.data);
         });
     },
+    toggleMaintenance(agent) {
+      let data = {
+        id: agent.id,
+        type: "Agent",
+        action: !agent.maintenance_mode,
+      };
+
+      const text = agent.maintenance_mode ? "Maintenance mode was disabled" : "Maintenance mode was enabled";
+      this.$store
+        .dispatch("toggleMaintenaceMode", data)
+        .then(response => {
+          this.$q.notify(notifySuccessConfig(text));
+          this.$store.commit("destroySubTable");
+          this.$store.dispatch("loadTree");
+          this.$emit("refreshEdit");
+        })
+        .catch(error => {
+          this.$q.notify(notifyErrorConfig("An Error occured. Please try again"));
+        });
+    },
+    menuMaintenanceText(mode) {
+      return mode ? "Disable Maintenace Mode" : "Enable Maintenace Mode";
+    },
   },
   computed: {
     ...mapGetters(["selectedAgentPk", "agentTableHeight"]),

src/components/SummaryTab.vue

@@ -3,6 +3,7 @@
   <div v-else>
     <span>
       <b>{{ summary.hostname }}</b>
+      <span v-if="summary.maintenance_mode"> &bull; <q-badge color="warning"> Maintenance Mode </q-badge> </span>
       &bull; {{ summary.operating_system }} &bull; Agent v{{ summary.version }}
     </span>
     <hr />
@@ -27,7 +28,7 @@
             <q-item-section avatar>
               <q-icon name="fas fa-memory" />
             </q-item-section>
-            <q-item-section>{{ summary.total_ram}} GB RAM</q-item-section>
+            <q-item-section>{{ summary.total_ram }} GB RAM</q-item-section>
           </q-item>
 
           <!-- physical disks -->
@@ -41,7 +42,7 @@
             <q-item-section avatar>
               <q-icon name="fas fa-globe-americas" />
             </q-item-section>
-            <q-item-section>Public IP: {{ summary.public_ip}}</q-item-section>
+            <q-item-section>Public IP: {{ summary.public_ip }}</q-item-section>
           </q-item>
           <q-item>
             <q-item-section avatar>
@@ -63,9 +64,9 @@
             <q-avatar size="lg" square icon="cancel" color="red" text-color="white" />
             <small>{{ summary.checks.failing }} checks failing</small>
           </q-chip>
-          <span
-            v-if="awaitingSync(summary.checks.total, summary.checks.passing, summary.checks.failing)"
-          >{{ summary.checks.total }} checks awaiting first synchronization</span>
+          <span v-if="awaitingSync(summary.checks.total, summary.checks.passing, summary.checks.failing)"
+            >{{ summary.checks.total }} checks awaiting first synchronization</span
+          >
         </template>
         <template v-else>No checks</template>
       </div>
@@ -75,13 +76,7 @@
         <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="green" class="q-mt-sm" />
           <span>{{ disk.free }} free of {{ disk.total }}</span>
           <hr />
         </div>

src/store/index.js

@@ -147,6 +147,9 @@ export default function () {
       }
     },
     actions: {
+      toggleMaintenaceMode(context, data) {
+        return axios.post("/agents/maintenance/", data)
+      },
       getAgentCounts(context, data = {}) {
         return axios.post("/agents/agent_counts/", data)
       },

src/views/Dashboard.vue

@@ -118,6 +118,13 @@
 
                         <q-separator></q-separator>
 
+                        <q-item clickable v-close-popup @click="showToggleMaintenance(props.node)">
+                          <q-item-section side>
+                            <q-icon name="construction" />
+                          </q-item-section>
+                          <q-item-section>{{ menuMaintenanceText(props.node) }}</q-item-section>
+                        </q-item>
+
                         <q-item clickable v-close-popup @click="showPolicyAdd(props.node)">
                           <q-item-section side>
                             <q-icon name="policy" />
@@ -212,6 +219,7 @@
 
 <script>
 import axios from "axios";
+import { notifySuccessConfig, notifyErrorConfig } from "@/mixins/mixins";
 import { mapState, mapGetters } from "vuex";
 import FileBar from "@/components/FileBar";
 import AgentTable from "@/components/AgentTable";
@@ -473,6 +481,27 @@ export default {
         this.workstationOfflineCount = r.data.total_workstation_offline_count;
       });
     },
+    showToggleMaintenance(node) {
+      let data = {
+        id: node.id,
+        type: node.raw.split("|")[0],
+        action: node.color === "warning" ? false : true,
+      };
+
+      const text = node.color === "warning" ? "Maintenance mode was disabled" : "Maintenance mode was enabled";
+      this.$store
+        .dispatch("toggleMaintenaceMode", data)
+        .then(response => {
+          this.$q.notify(notifySuccessConfig(text));
+          this.getTree();
+        })
+        .catch(error => {
+          this.$q.notify(notifyErrorConfig("An Error occured. Please try again"));
+        });
+    },
+    menuMaintenanceText(node) {
+      return node.color === "warning" ? "Disable Maintenace Mode" : "Enable Maintenace Mode";
+    },
   },
   computed: {
     ...mapState({