mirror of
https://github.com/jpros/tacticalrmm-web.git
synced 2026-02-21 20:00:44 +00:00
334 lines
11 KiB
Vue
334 lines
11 KiB
Vue
<template>
|
|
<div class="row">
|
|
<div class="col-12">
|
|
<q-btn
|
|
v-if="selectedPolicy !== null"
|
|
size="sm"
|
|
color="grey-5"
|
|
icon="fas fa-plus"
|
|
label="Add Check"
|
|
text-color="black"
|
|
ref="add"
|
|
>
|
|
<q-menu>
|
|
<q-list dense style="min-width: 200px">
|
|
<q-item clickable v-close-popup @click="showAddDialog('DiskSpaceCheck')">
|
|
<q-item-section side>
|
|
<q-icon size="xs" name="far fa-hdd" />
|
|
</q-item-section>
|
|
<q-item-section>Disk Space Check</q-item-section>
|
|
</q-item>
|
|
<q-item clickable v-close-popup @click="showAddDialog('PingCheck')">
|
|
<q-item-section side>
|
|
<q-icon size="xs" name="fas fa-network-wired" />
|
|
</q-item-section>
|
|
<q-item-section>Ping Check</q-item-section>
|
|
</q-item>
|
|
<q-item clickable v-close-popup @click="showAddDialog('CpuLoadCheck')">
|
|
<q-item-section side>
|
|
<q-icon size="xs" name="fas fa-microchip" />
|
|
</q-item-section>
|
|
<q-item-section>CPU Load Check</q-item-section>
|
|
</q-item>
|
|
<q-item clickable v-close-popup @click="showAddDialog('MemCheck')">
|
|
<q-item-section side>
|
|
<q-icon size="xs" name="fas fa-memory" />
|
|
</q-item-section>
|
|
<q-item-section>Memory Check</q-item-section>
|
|
</q-item>
|
|
<q-item clickable v-close-popup @click="showAddDialog('WinSvcCheck')">
|
|
<q-item-section side>
|
|
<q-icon size="xs" name="fas fa-cogs" />
|
|
</q-item-section>
|
|
<q-item-section>Windows Service Check</q-item-section>
|
|
</q-item>
|
|
<q-item clickable v-close-popup @click="showAddDialog('ScriptCheck')">
|
|
<q-item-section side>
|
|
<q-icon size="xs" name="fas fa-terminal" />
|
|
</q-item-section>
|
|
<q-item-section>Script Check</q-item-section>
|
|
</q-item>
|
|
<q-item clickable v-close-popup @click="showAddDialog('EventLogCheck')">
|
|
<q-item-section side>
|
|
<q-icon size="xs" name="fas fa-clipboard-list" />
|
|
</q-item-section>
|
|
<q-item-section>Event Log Check</q-item-section>
|
|
</q-item>
|
|
</q-list>
|
|
</q-menu>
|
|
</q-btn>
|
|
<q-btn
|
|
v-if="selectedPolicy !== null"
|
|
dense
|
|
flat
|
|
push
|
|
@click="onRefresh(selectedPolicy)"
|
|
icon="refresh"
|
|
ref="refresh"
|
|
/>
|
|
<template>
|
|
<q-table
|
|
dense
|
|
:table-class="{ 'table-bgcolor': !$q.dark.isActive, 'table-bgcolor-dark': $q.dark.isActive }"
|
|
class="tabs-tbl-sticky"
|
|
style="max-height: 35vh"
|
|
:data="checks"
|
|
:columns="columns"
|
|
row-key="id"
|
|
binary-state-sort
|
|
:pagination.sync="pagination"
|
|
hide-pagination
|
|
>
|
|
<!-- header slots -->
|
|
<template v-slot:header-cell-smsalert="props">
|
|
<q-th auto-width :props="props">
|
|
<q-icon name="phone_android" size="1.5em">
|
|
<q-tooltip>SMS Alert</q-tooltip>
|
|
</q-icon>
|
|
</q-th>
|
|
</template>
|
|
<template v-slot:header-cell-emailalert="props">
|
|
<q-th auto-width :props="props">
|
|
<q-icon name="email" size="1.5em">
|
|
<q-tooltip>Email Alert</q-tooltip>
|
|
</q-icon>
|
|
</q-th>
|
|
</template>
|
|
<template v-slot:header-cell-statusicon="props">
|
|
<q-th auto-width :props="props"></q-th>
|
|
</template>
|
|
<!-- No data Slot -->
|
|
<template v-slot:no-data>
|
|
<div class="full-width row flex-center q-gutter-sm">
|
|
<span v-if="selectedPolicy === null">Click on a policy to see the checks</span>
|
|
<span v-else>There are no checks added to this policy</span>
|
|
</div>
|
|
</template>
|
|
<!-- body slots -->
|
|
<template v-slot:body="props">
|
|
<q-tr :props="props">
|
|
<!-- context menu -->
|
|
<q-menu context-menu>
|
|
<q-list dense style="min-width: 200px">
|
|
<q-item clickable v-close-popup @click="showEditDialog(props.row)" id="context-edit">
|
|
<q-item-section side>
|
|
<q-icon name="edit" />
|
|
</q-item-section>
|
|
<q-item-section>Edit</q-item-section>
|
|
</q-item>
|
|
<q-item clickable v-close-popup @click="deleteCheck(props.row)" id="context-delete">
|
|
<q-item-section side>
|
|
<q-icon name="delete" />
|
|
</q-item-section>
|
|
<q-item-section>Delete</q-item-section>
|
|
</q-item>
|
|
|
|
<q-separator></q-separator>
|
|
|
|
<q-item clickable v-close-popup @click="showPolicyCheckStatusModal(props.row)" id="context-status">
|
|
<q-item-section side>
|
|
<q-icon name="sync" />
|
|
</q-item-section>
|
|
<q-item-section>Policy Status</q-item-section>
|
|
</q-item>
|
|
|
|
<q-separator></q-separator>
|
|
|
|
<q-item clickable v-close-popup>
|
|
<q-item-section>Close</q-item-section>
|
|
</q-item>
|
|
</q-list>
|
|
</q-menu>
|
|
<!-- tds -->
|
|
<q-td>
|
|
<q-checkbox
|
|
dense
|
|
@input="checkAlert(props.row.id, 'Text', props.row.text_alert)"
|
|
v-model="props.row.text_alert"
|
|
/>
|
|
</q-td>
|
|
<q-td>
|
|
<q-checkbox
|
|
dense
|
|
@input="checkAlert(props.row.id, 'Email', props.row.email_alert)"
|
|
v-model="props.row.email_alert"
|
|
/>
|
|
</q-td>
|
|
<q-td>{{ props.row.readable_desc }}</q-td>
|
|
<q-td>
|
|
<span
|
|
style="cursor: pointer; text-decoration: underline"
|
|
@click="showPolicyCheckStatusModal(props.row)"
|
|
class="status-cell text-primary"
|
|
>See Status</span
|
|
>
|
|
</q-td>
|
|
<q-td v-if="props.row.assignedtask !== null && props.row.assignedtask.length === 1">{{
|
|
props.row.assignedtask[0].name
|
|
}}</q-td>
|
|
<q-td v-else-if="props.row.assignedtask">{{ props.row.assignedtask.length }} Tasks</q-td>
|
|
<q-td v-else></q-td>
|
|
</q-tr>
|
|
</template>
|
|
</q-table>
|
|
</template>
|
|
</div>
|
|
|
|
<!-- policy status -->
|
|
<q-dialog v-model="showPolicyCheckStatus">
|
|
<PolicyStatus type="check" :item="statusCheck" />
|
|
</q-dialog>
|
|
|
|
<!-- add/edit modals -->
|
|
<q-dialog v-model="showDialog" @hide="hideDialog">
|
|
<component
|
|
v-if="dialogComponent !== null"
|
|
:is="dialogComponent"
|
|
@close="hideDialog"
|
|
:policypk="selectedPolicy"
|
|
:checkpk="editCheckPK"
|
|
:mode="!!editCheckPK ? 'edit' : 'add'"
|
|
/>
|
|
</q-dialog>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import mixins from "@/mixins/mixins";
|
|
import PolicyStatus from "@/components/automation/modals/PolicyStatus";
|
|
import DiskSpaceCheck from "@/components/modals/checks/DiskSpaceCheck";
|
|
import PingCheck from "@/components/modals/checks/PingCheck";
|
|
import CpuLoadCheck from "@/components/modals/checks/CpuLoadCheck";
|
|
import MemCheck from "@/components/modals/checks/MemCheck";
|
|
import WinSvcCheck from "@/components/modals/checks/WinSvcCheck";
|
|
import ScriptCheck from "@/components/modals/checks/ScriptCheck";
|
|
import EventLogCheck from "@/components/modals/checks/EventLogCheck";
|
|
|
|
export default {
|
|
name: "PolicyChecksTab",
|
|
components: {
|
|
PolicyStatus,
|
|
DiskSpaceCheck,
|
|
PingCheck,
|
|
CpuLoadCheck,
|
|
MemCheck,
|
|
WinSvcCheck,
|
|
ScriptCheck,
|
|
EventLogCheck,
|
|
},
|
|
mixins: [mixins],
|
|
props: {
|
|
selectedPolicy: !Number,
|
|
},
|
|
data() {
|
|
return {
|
|
checks: [],
|
|
dialogComponent: null,
|
|
showDialog: false,
|
|
showPolicyCheckStatus: false,
|
|
editCheckPK: null,
|
|
statusCheck: {},
|
|
columns: [
|
|
{ name: "smsalert", field: "text_alert", align: "left" },
|
|
{ name: "emailalert", field: "email_alert", align: "left" },
|
|
{ name: "desc", field: "readable_desc", label: "Description", align: "left", sortable: true },
|
|
{ name: "status", label: "Status", field: "status", align: "left" },
|
|
{ name: "assigned_task", label: "Assigned Tasks", field: "assigned_task", align: "left", sortable: true },
|
|
],
|
|
pagination: {
|
|
rowsPerPage: 0,
|
|
sortBy: "status",
|
|
descending: true,
|
|
},
|
|
};
|
|
},
|
|
methods: {
|
|
checkAlert(id, alert_type, action) {
|
|
const data = {};
|
|
|
|
if (alert_type === "Email") {
|
|
data.email_alert = action;
|
|
} else {
|
|
data.text_alert = action;
|
|
}
|
|
data.check_alert = true;
|
|
const act = action ? "enabled" : "disabled";
|
|
const color = action ? "positive" : "warning";
|
|
this.$store.dispatch("editCheckAlert", { pk: id, data }).then(r => {
|
|
this.$q.notify({
|
|
color: color,
|
|
icon: "fas fa-check-circle",
|
|
message: `${alert_type} alerts ${act}`,
|
|
});
|
|
});
|
|
},
|
|
onRefresh(id) {
|
|
this.$store.dispatch("automation/loadPolicyChecks", id);
|
|
},
|
|
showAddDialog(component) {
|
|
this.dialogComponent = component;
|
|
this.showDialog = true;
|
|
},
|
|
showEditDialog(check) {
|
|
switch (check.check_type) {
|
|
case "diskspace":
|
|
this.dialogComponent = "DiskSpaceCheck";
|
|
break;
|
|
case "ping":
|
|
this.dialogComponent = "PingCheck";
|
|
break;
|
|
case "cpuload":
|
|
this.dialogComponent = "CpuLoadCheck";
|
|
break;
|
|
case "memory":
|
|
this.dialogComponent = "MemCheck";
|
|
break;
|
|
case "winsvc":
|
|
this.dialogComponent = "WinSvcCheck";
|
|
break;
|
|
case "script":
|
|
this.dialogComponent = "ScriptCheck";
|
|
break;
|
|
case "eventlog":
|
|
this.dialogComponent = "EventLogCheck";
|
|
break;
|
|
default:
|
|
return null;
|
|
}
|
|
this.editCheckPK = check.id;
|
|
this.showDialog = true;
|
|
},
|
|
hideDialog(component) {
|
|
this.showDialog = false;
|
|
this.dialogComponent = null;
|
|
this.editCheckPK = null;
|
|
},
|
|
deleteCheck(check) {
|
|
this.$q
|
|
.dialog({
|
|
title: `Delete ${check.check_type} check?`,
|
|
ok: { label: "Delete", color: "negative" },
|
|
cancel: true,
|
|
})
|
|
.onOk(() => {
|
|
this.$store
|
|
.dispatch("deleteCheck", check.id)
|
|
.then(r => {
|
|
this.$store.dispatch("automation/loadPolicyChecks", check.id);
|
|
this.notifySuccess("Check Deleted!");
|
|
})
|
|
.catch(e => this.notifyError("An Error Occurred while deleting"));
|
|
});
|
|
},
|
|
showPolicyStatus(check) {
|
|
this.$q.dialog({
|
|
component: PolicyStatus,
|
|
parent: this,
|
|
check: check,
|
|
});
|
|
},
|
|
},
|
|
};
|
|
</script>
|
|
|