paulmataruso/tacticalrmm-web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

cleanup script manager and snippet modals and move agent select dropdown for test script to script form

Browse Source
This commit is contained in:
sadnub
2021-11-15 17:50:26 -05:00
parent f01c7f731e
commit ad76cc1811
7 changed files with 568 additions and 600 deletions
Download Patch File Download Diff File Expand all files Collapse all files

149
src/components/scripts/ScriptSnippets.vue
View File

@@ -1,6 +1,14 @@
<template>
<q-dialog ref="dialogRef" @hide="onDialogHide">
<q-card class="q-dialog-plugin" style="width: 70vw; max-width: 70vw">
<q-card
class="q-dialog-plugin"
:style="{
width: `${$q.screen.width - 300}px`,
'max-width': `${$q.screen.width - 300}px`,
height: `${$q.screen.height - 300}px`,
'max-height': `${$q.screen.height - 300}px`,
}"
>
<q-bar>
<q-btn @click="getSnippets" class="q-mr-sm" dense flat push icon="refresh" />Script Snippets
<q-space />
@@ -8,70 +16,69 @@
<q-tooltip class="bg-white text-primary">Close</q-tooltip>
</q-btn>
</q-bar>
<q-table
dense
:table-class="{ 'table-bgcolor': !$q.dark.isActive, 'table-bgcolor-dark': $q.dark.isActive }"
:style="{ 'max-height': `${$q.screen.height - 300 - 32}px` }"
class="tbl-sticky"
:rows="snippets"
:columns="columns"
:loading="loading"
:pagination="{ rowsPerPage: 0, sortBy: 'name', descending: true }"
row-key="id"
binary-state-sort
virtual-scroll
:rows-per-page-options="[0]"
>
<template v-slot:top>
<q-btn dense flat no-caps icon="add" label="New" @click="newSnippetModal" />
</template>
<template v-slot:header-cell-shell="props">
<q-th :props="props" auto-width> Shell </q-th>
</template>
<div class="q-pa-md">
<q-btn dense flat no-caps icon="add" label="New" @click="newSnippetModal" />
<q-table
dense
:table-class="{ 'table-bgcolor': !$q.dark.isActive, 'table-bgcolor-dark': $q.dark.isActive }"
class="settings-tbl-sticky"
:rows="snippets"
:columns="columns"
:loading="loading"
v-model:pagination="pagination"
row-key="id"
binary-state-sort
hide-pagination
virtual-scroll
:rows-per-page-options="[0]"
>
<template v-slot:header-cell-shell="props">
<q-th :props="props" auto-width> Shell </q-th>
</template>
<template v-slot:body="props">
<!-- Table View -->
<q-tr :props="props" @dblclick="editSnippetModal(props.row)" class="cursor-pointer">
<!-- Context Menu -->
<q-menu context-menu>
<q-list dense style="min-width: 200px">
<q-item clickable v-close-popup @click="editSnippetModal(props.row)">
<q-item-section side>
<q-icon name="edit" />
</q-item-section>
<q-item-section>Edit</q-item-section>
</q-item>
<template v-slot:body="props">
<!-- Table View -->
<q-tr :props="props" @dblclick="editSnippetModal(props.row)" class="cursor-pointer">
<!-- Context Menu -->
<q-menu context-menu>
<q-list dense style="min-width: 200px">
<q-item clickable v-close-popup @click="editSnippetModal(props.row)">
<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="deleteSnippet(props.row)">
<q-item-section side>
<q-icon name="delete" />
</q-item-section>
<q-item-section>Delete</q-item-section>
</q-item>
<q-item clickable v-close-popup @click="deleteSnippet(props.row)">
<q-item-section side>
<q-icon name="delete" />
</q-item-section>
<q-item-section>Delete</q-item-section>
</q-item>
<q-item clickable v-close-popup>
<q-item-section>Close</q-item-section>
</q-item>
</q-list>
</q-menu>
<q-td>
<q-icon v-if="props.row.shell === 'powershell'" name="mdi-powershell" color="primary" size="sm">
<q-tooltip> Powershell </q-tooltip>
</q-icon>
<q-icon v-else-if="props.row.shell === 'python'" name="mdi-language-python" color="primary" size="sm">
<q-tooltip> Python </q-tooltip>
</q-icon>
<q-icon v-else-if="props.row.shell === 'cmd'" name="mdi-microsoft-windows" color="primary" size="sm">
<q-tooltip> Batch </q-tooltip>
</q-icon>
</q-td>
<!-- name -->
<q-td>{{ props.row.name }}</q-td>
<q-td>{{ props.row.desc }}</q-td>
</q-tr>
</template>
</q-table>
</div>
<q-item clickable v-close-popup>
<q-item-section>Close</q-item-section>
</q-item>
</q-list>
</q-menu>
<q-td>
<q-icon v-if="props.row.shell === 'powershell'" name="mdi-powershell" color="primary" size="sm">
<q-tooltip> Powershell </q-tooltip>
</q-icon>
<q-icon v-else-if="props.row.shell === 'python'" name="mdi-language-python" color="primary" size="sm">
<q-tooltip> Python </q-tooltip>
</q-icon>
<q-icon v-else-if="props.row.shell === 'cmd'" name="mdi-microsoft-windows" color="primary" size="sm">
<q-tooltip> Batch </q-tooltip>
</q-icon>
</q-td>
<!-- name -->
<q-td>{{ props.row.name }}</q-td>
<q-td>{{ props.row.desc }}</q-td>
</q-tr>
</template>
</q-table>
</q-card>
</q-dialog>
</template>
@@ -124,7 +131,11 @@ export default {
async function getSnippets() {
loading.value = true;
snippets.value = await fetchScriptSnippets();
try {
snippets.value = await fetchScriptSnippets();
} catch (e) {
console.error(e);
}
loading.value = false;
}
@@ -147,11 +158,6 @@ export default {
// table setup
const loading = ref(false);
const pagination = ref({
rowsPerPage: 0,
sortBy: "name",
descending: true,
});
function newSnippetModal() {
$q.dialog({
@@ -167,18 +173,15 @@ export default {
componentProps: {
snippet,
},
}).onOk(() => {
getSnippets();
});
}).onOk(getSnippets);
}
// component life cycle hooks
onMounted(getSnippets());
onMounted(getSnippets);
return {
// reactive data
snippets,
pagination,
loading,
// non-reactive data