diff options
Diffstat (limited to 'src/views/_sila/Settings/TransferInfo/Snmp.vue')
-rw-r--r-- | src/views/_sila/Settings/TransferInfo/Snmp.vue | 139 |
1 files changed, 139 insertions, 0 deletions
diff --git a/src/views/_sila/Settings/TransferInfo/Snmp.vue b/src/views/_sila/Settings/TransferInfo/Snmp.vue new file mode 100644 index 00000000..ef9e18ac --- /dev/null +++ b/src/views/_sila/Settings/TransferInfo/Snmp.vue @@ -0,0 +1,139 @@ +<template> + <page-section :section-title="$t('pageTransfer.snmp.snmpTitle')"> + <b-row> + <b-col> + <div class="text-right"> + <b-button + variant="primary" + :disabled="loading || isNotAdmin" + @click="initAddModal()" + > + <icon-add /> + {{ $t('global.action.add') }} + </b-button> + </div> + <b-table + responsive="md" + hover + :busy="loading" + :fields="fields" + :items="subscribers" + :empty-text="$t('global.table.emptyMessage')" + show-empty + > + <!-- table actions column --> + <template #cell(actions)="{ item }"> + <table-row-action + v-for="(action, index) in item.actions" + :key="index" + :value="action.value" + :enabled="action.enabled" + :title="action.title" + @click-table-action="onTableAction($event, item)" + > + <template #icon> + <icon-trashcan + v-if="action.value === 'delete'" + :data-test-id="`snmp-tableRowAction-delete-${index}`" + /> + </template> + </table-row-action> + </template> + </b-table> + </b-col> + </b-row> + </page-section> +</template> + +<script> +import PageSection from '@/components/_sila/Global/PageSection'; +import BVToastMixin from '@/components/_sila/Mixins/BVToastMixin'; +import TableRowAction from '@/components/_sila/Global/TableRowAction'; +import LoadingBarMixin, { + loading, +} from '@/components/_sila/Mixins/LoadingBarMixin'; + +import IconAdd from '@carbon/icons-vue/es/add--alt/20'; +import IconTrashcan from '@carbon/icons-vue/es/trash-can/20'; + +export default { + name: 'Snmp', + components: { + IconAdd, + IconTrashcan, + PageSection, + TableRowAction, + }, + mixins: [BVToastMixin, LoadingBarMixin], + + data() { + return { + loading, + actions: [ + { + value: 'delete', + title: this.$t('global.action.delete'), + }, + ], + fields: [ + { + key: 'host', + label: this.$t('pageTransfer.snmp.host'), + }, + { + key: 'port', + label: this.$t('pageTransfer.snmp.port'), + }, + { key: 'actions', label: '', tdClass: 'text-right' }, + ], + }; + }, + computed: { + subscribers() { + return this.$store.getters['snmpStore/subscribers'].map((subscriber) => { + return { + ...subscriber, + actions: [ + { + value: 'delete', + title: this.$t('pageTransfer.snmp.delSubscriber'), + }, + ], + }; + }); + }, + isNotAdmin() { + return ( + this.$store.getters['authentication/role'] === 'ReadOnly' || + this.$store.getters['authentication/role'] === 'Operator' + ); + }, + }, + + created() { + this.startLoader(); + this.$store.dispatch('snmpStore/getSubscribers').finally(() => { + this.endLoader(); + }); + }, + + methods: { + onTableAction($event, { Id }) { + if ($event === 'delete') { + this.deleteSubscriber(Id); + } + }, + deleteSubscriber(index) { + this.startLoader(); + this.$store + .dispatch('snmpStore/deleteSubscriber', index) + .then((success) => this.successToast(success)) + .catch(({ message }) => this.errorToast(message)) + .finally(() => this.endLoader()); + }, + initAddModal() { + this.$bvModal.show('modal-snmp'); + }, + }, +}; +</script> |