Files
tacticalrmm/web/src/components/modals/software/InstallSoftware.vue
2020-11-12 07:02:27 +00:00

126 lines
3.3 KiB
Vue

<template>
<q-card style="width: 50vw; max-width: 80vw">
<q-card-section>
<q-table
class="remote-bg-tbl-sticky"
:table-class="{ 'table-bgcolor': !$q.dark.isActive, 'table-bgcolor-dark': $q.dark.isActive }"
title="Software"
dense
:data="chocos"
:columns="columns"
:pagination.sync="pagination"
:filter="filter"
binary-state-sort
hide-bottom
virtual-scroll
:rows-per-page-options="[0]"
row-key="name"
>
<template v-slot:top>
<q-input v-model="filter" outlined label="Search" dense clearable>
<template v-slot:prepend>
<q-icon name="search" />
</template>
</q-input>
<q-space />
<q-btn icon="close" flat round dense v-close-popup />
</template>
<template slot="body" slot-scope="props" :props="props">
<q-tr :props="props">
<q-td auto-width>
<q-btn
size="sm"
color="grey-5"
icon="fas fa-plus"
text-color="black"
@click="install(props.row.name, props.row.version)"
/>
</q-td>
<q-td @click="showDescription(props.row.name)">
<span style="cursor: pointer; text-decoration: underline" class="text-primary">{{ props.row.name }}</span>
</q-td>
<q-td>{{ props.row.version }}</q-td>
</q-tr>
</template>
</q-table>
</q-card-section>
</q-card>
</template>
<script>
import axios from "axios";
import { mapState } from "vuex";
import { mapGetters } from "vuex";
import mixins from "@/mixins/mixins";
export default {
name: "InstallSoftware",
props: ["agentpk"],
mixins: [mixins],
data() {
return {
filter: "",
chocos: [],
pagination: {
rowsPerPage: 0,
sortBy: "name",
descending: false,
},
columns: [
{ name: "install", align: "left", label: "Install", sortable: false },
{
name: "name",
align: "left",
label: "Name",
field: "name",
sortable: true,
},
{
name: "version",
align: "left",
label: "Version",
field: "version",
sortable: false,
},
],
};
},
methods: {
getChocos() {
axios.get("/software/chocos/").then(r => {
this.chocos = r.data;
});
},
showDescription(name) {
window.open(`https://chocolatey.org/packages/${name}`, "_blank");
},
install(name, version) {
const data = { name: name, version: version, pk: this.agentpk };
this.$q
.dialog({
title: "Install Software",
message: `Install ${name} on ${this.agentHostname}?`,
persistent: true,
ok: { label: "Install" },
cancel: { color: "negative" },
})
.onOk(() => {
axios
.post("/software/install/", data)
.then(r => {
this.$emit("close");
this.notifySuccess(r.data);
})
.catch(e => {
this.notifyError("Something went wrong");
});
});
},
},
computed: {
...mapGetters(["agentHostname"]),
},
created() {
this.getChocos();
},
};
</script>