add feature to remotely update windows agents

package.json

@@ -1,6 +1,6 @@
 {
   "name": "web",
-  "version": "0.1.6",
+  "version": "0.1.7",
   "private": true,
   "scripts": {
     "serve": "vue-cli-service serve",

src/components/FileBar.vue

@@ -14,6 +14,9 @@
             <q-item clickable v-close-popup @click="getLog">
               <q-item-section>Debug Log</q-item-section>
             </q-item>
+            <q-item clickable v-close-popup @click="showUpdateAgentsModal = true">
+              <q-item-section>Update Agents</q-item-section>
+            </q-item>
           </q-list>
         </q-menu>
       </div>
@@ -28,6 +31,18 @@
       </q-dialog>
       <!-- debug log modal -->
       <LogModal />
+      <!-- Update Agents Modal -->
+      <div class="q-pa-md q-gutter-sm">
+        <q-dialog 
+        v-model="showUpdateAgentsModal"
+        maximized
+        transition-show="slide-up"
+        transition-hide="slide-down" 
+      >
+        <UpdateAgents @close="showUpdateAgentsModal = false" />
+      </q-dialog>
+      </div>
+      
     </q-bar>
   </div>
 </template>
@@ -36,14 +51,16 @@
 import LogModal from "@/components/modals/logs/LogModal";
 import AddClient from "@/components/modals/clients/AddClient";
 import AddSite from "@/components/modals/clients/AddSite";
+import UpdateAgents from "@/components/modals/agents/UpdateAgents";
 export default {
   name: "FileBar",
-  components: { LogModal, AddClient, AddSite },
+  components: { LogModal, AddClient, AddSite, UpdateAgents },
   props: ["clients"],
   data() {
     return {
       showAddClientModal: false,
-      showAddSiteModal: false
+      showAddSiteModal: false,
+      showUpdateAgentsModal: false
     };
   },
   methods: {

src/components/modals/agents/UpdateAgents.vue

@@ -0,0 +1,111 @@
+<template>
+  <q-card>
+    <q-bar>
+      Update Agents
+      <q-space />
+      <q-btn dense flat icon="close" v-close-popup>
+        <q-tooltip content-class="bg-white text-primary">Close</q-tooltip>
+      </q-btn>
+    </q-bar>
+    <q-separator />
+    <q-card-section>
+      Select Version
+      <q-select
+        square
+        outlined
+        v-model="version"
+        :options="Object.values(versions)"
+      />
+    </q-card-section>
+    <q-card-section v-show="version !== null">
+      Select Agent
+      <br />
+      <hr />
+      <q-checkbox
+        v-model="selectAll"
+        label="Select All"
+        @input="selectAllAction"
+      />
+      <hr />
+      <q-option-group
+        v-model="group"
+        :options="agentOptions"
+        color="green"
+        type="checkbox"
+      />
+    </q-card-section>
+    <q-card-section>
+      <q-btn
+        v-show="group.length !== 0"
+        label="Update"
+        color="primary"
+        @click="update"
+      />
+    </q-card-section>
+  </q-card>
+</template>
+
+<script>
+import axios from "axios";
+import mixins from "@/mixins/mixins";
+export default {
+  name: "UpdateAgents",
+  mixins: [mixins],
+  data() {
+    return {
+      versions: {},
+      version: null,
+      agents: [],
+      group: [],
+      selectAll: false
+    };
+  },
+  methods: {
+    selectAllAction() {
+      this.selectAll ? (this.group = this.agentPKs) : (this.group = []);
+    },
+    getVersions() {
+      this.$q.loading.show();
+      axios
+        .get("/agents/getagentversions/")
+        .then(r => {
+          this.versions = r.data.versions;
+          this.agents = r.data.agents;
+          this.$q.loading.hide();
+        })
+        .catch(() => {
+          this.$q.loading.hide();
+          this.notifyError("Something went wrong");
+        });
+    },
+    update() {
+      const data = { version: this.version, pks: this.group };
+      axios
+        .post("/agents/updateagents/", data)
+        .then(r => {
+          this.$emit("close");
+          this.notifySuccess("Agents will now be updated");
+        })
+        .catch(() => this.notifyError("Something went wrong"));
+    }
+  },
+  computed: {
+    agentPKs() {
+      return this.agents.map(k => k.pk);
+    },
+    agentOptions() {
+      const options = [];
+      for (let i of Object.values(this.agents)) {
+        let opt = {};
+        opt["label"] = `${i.hostname} (${i.client} > ${i.site})`;
+        opt["value"] = i.pk;
+        options.push(opt);
+      }
+      return options;
+    }
+  },
+  created() {
+    this.getVersions();
+  }
+};
+</script>