add policy exclusions

src/components/automation/AutomationManager.vue

@@ -120,6 +120,13 @@
                         <q-item-section>Show Relations</q-item-section>
                       </q-item>
 
+                      <q-item clickable v-close-popup @click="showPolicyExclusions(props.row)">
+                        <q-item-section side>
+                          <q-icon name="rule" />
+                        </q-item-section>
+                        <q-item-section>Policy Exclusions</q-item-section>
+                      </q-item>
+
                       <q-item clickable v-close-popup @click="showPatchPolicyForm(props.row)">
                         <q-item-section side>
                           <q-icon name="system_update" />
@@ -167,6 +174,20 @@
                       >{{ `Show Relations (${props.row.agents_count})` }}</span
                     >
                   </q-td>
+                  <q-td>
+                    <span
+                      style="cursor: pointer; text-decoration: underline"
+                      class="text-primary"
+                      @click="showPolicyExclusions(props.row)"
+                      >{{
+                        `Show Policy Exclusions (${
+                          props.row.excluded_agents.length +
+                          props.row.excluded_clients.length +
+                          props.row.excluded_sites.length
+                        })`
+                      }}</span
+                    >
+                  </q-td>
                   <q-td>
                     <span
                       style="cursor: pointer; text-decoration: underline"
@@ -236,6 +257,7 @@ import PolicyOverview from "@/components/automation/PolicyOverview";
 import RelationsView from "@/components/automation/modals/RelationsView";
 import PatchPolicyForm from "@/components/modals/agents/PatchPolicyForm";
 import AlertTemplateAdd from "@/components/modals/alerts/AlertTemplateAdd";
+import PolicyExclusions from "@/components/automation/modals/PolicyExclusions";
 import PolicyChecksTab from "@/components/automation/PolicyChecksTab";
 import PolicyAutomatedTasksTab from "@/components/automation/PolicyAutomatedTasksTab";
 
@@ -270,6 +292,11 @@ export default {
           field: "relations",
           align: "left",
         },
+        {
+          name: "exclusions",
+          label: "Exclusions",
+          align: "left",
+        },
         {
           name: "winupdatepolicy",
           label: "Patch Policy",
@@ -412,6 +439,17 @@ export default {
           this.refresh();
         });
     },
+    showPolicyExclusions(policy) {
+      this.$q
+        .dialog({
+          component: PolicyExclusions,
+          parent: this,
+          policy: policy,
+        })
+        .onOk(() => {
+          this.refresh();
+        });
+    },
     toggleCheckbox(policy, type) {
       this.$q.loading.show();
       let text = "";

src/components/automation/modals/PolicyExclusions.vue

@@ -0,0 +1,155 @@
+<template>
+  <q-dialog ref="dialog" @hide="onHide">
+    <q-card style="width: 50vw; max-width: 50vw">
+      <q-bar>
+        Policy Exclusions for {{ policy.name }}
+        <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-form ref="form" @submit.prevent="onSubmit">
+        <q-card-section>
+          <q-select
+            label="Excluded Clients"
+            dense
+            options-dense
+            outlined
+            multiple
+            v-model="localPolicy.excluded_clients"
+            :options="clientOptions"
+            use-chips
+            map-options
+            emit-value
+          />
+        </q-card-section>
+        <q-card-section>
+          <q-select
+            label="Excluded Sites"
+            dense
+            options-dense
+            outlined
+            multiple
+            v-model="localPolicy.excluded_sites"
+            :options="siteOptions"
+            use-chips
+            map-options
+            emit-value
+          >
+            <template v-slot:option="scope">
+              <q-item v-if="!scope.opt.category" v-bind="scope.itemProps" v-on="scope.itemEvents" class="q-pl-lg">
+                <q-item-section>
+                  <q-item-label v-html="scope.opt.label"></q-item-label>
+                </q-item-section>
+              </q-item>
+              <q-item-label v-if="scope.opt.category" v-bind="scope.itemProps" header class="q-pa-sm">{{
+                scope.opt.category
+              }}</q-item-label>
+            </template>
+          </q-select>
+        </q-card-section>
+        <q-card-section>
+          <q-select
+            label="Excluded Agents"
+            dense
+            options-dense
+            outlined
+            multiple
+            v-model="localPolicy.excluded_agents"
+            :options="agentOptions"
+            use-chips
+            map-options
+            emit-value
+          />
+        </q-card-section>
+
+        <q-card-actions align="right">
+          <q-btn dense flat label="Cancel" v-close-popup />
+          <q-btn dense flat label="Save" color="primary" type="submit" />
+        </q-card-actions>
+      </q-form>
+    </q-card>
+  </q-dialog>
+</template>
+
+<script>
+import mixins from "@/mixins/mixins";
+export default {
+  name: "PolicyExclusions",
+  props: { policy: !Object },
+  mixins: [mixins],
+  data() {
+    return {
+      localPolicy: {
+        excluded_clients: [],
+        excluded_sites: [],
+        excluded_agents: [],
+      },
+      clientOptions: [],
+      siteOptions: [],
+      agentOptions: [],
+    };
+  },
+  methods: {
+    onSubmit() {
+      this.$axios
+        .put(`automation/policies/${this.policy.id}/`, this.localPolicy)
+        .then(r => {
+          this.$q.loading.hide();
+          this.onOk();
+          this.notifySuccess("Policy exclusions added");
+        })
+        .catch(e => {
+          this.$q.loading.hide();
+          this.notifyError("There was an issue adding policy exclusions");
+        });
+    },
+    getClients() {
+      this.$axios.get("/clients/clients/").then(r => {
+        this.clientOptions = r.data.map(client => ({ label: client.name, value: client.id }));
+      });
+    },
+    getSites() {
+      this.$axios.get("/clients/clients/").then(r => {
+        r.data.forEach(client => {
+          this.siteOptions.push({ category: client.name });
+          client.sites.forEach(site => this.siteOptions.push({ label: site.name, value: site.id }));
+        });
+      });
+    },
+    getAgents() {
+      this.$axios.get("/agents/listagentsnodetail/").then(r => {
+        const ret = r.data.map(agent => ({ label: agent.hostname, value: agent.pk }));
+        this.agentOptions = Object.freeze(ret.sort((a, b) => a.label.localeCompare(b.label)));
+      });
+    },
+    getOptions() {
+      this.getClients();
+      this.getSites();
+      this.getAgents();
+    },
+    show() {
+      this.$refs.dialog.show();
+    },
+    hide() {
+      this.$refs.dialog.hide();
+    },
+    onHide() {
+      this.$emit("hide");
+    },
+    onOk() {
+      this.$emit("ok");
+      this.hide();
+    },
+  },
+  mounted() {
+    this.getOptions();
+
+    // copy prop data locally
+    this.localPolicy.id = this.policy.id;
+    this.localPolicy.excluded_clients = this.policy.excluded_clients.map(client => client.id);
+    this.localPolicy.excluded_sites = this.policy.excluded_sites.map(site => site.id);
+    this.localPolicy.excluded_agents = this.policy.excluded_agents.map(agent => agent.pk);
+  },
+};
+</script>