diff options
author | Vitalii Lysak <v.lysak@dunice.net> | 2022-09-13 17:24:20 +0300 |
---|---|---|
committer | Vitalii Lysak <v.lysak@dunice.net> | 2022-09-13 17:24:20 +0300 |
commit | a38f344867bba7e9770865d68990442acb632459 (patch) | |
tree | 207892aee8132666e82c9e2d7a0358d454b37202 /src/views/_sila/Settings | |
parent | 6172828846941e04c644be7f54b052dfcf36e29c (diff) | |
download | webui-vue-a38f344867bba7e9770865d68990442acb632459.tar.xz |
add table for snmp
Diffstat (limited to 'src/views/_sila/Settings')
-rw-r--r-- | src/views/_sila/Settings/TransferInfo/Snmp.vue | 142 | ||||
-rw-r--r-- | src/views/_sila/Settings/TransferInfo/Transfer.vue | 13 |
2 files changed, 66 insertions, 89 deletions
diff --git a/src/views/_sila/Settings/TransferInfo/Snmp.vue b/src/views/_sila/Settings/TransferInfo/Snmp.vue index 2b4ae3c7..8a7ca730 100644 --- a/src/views/_sila/Settings/TransferInfo/Snmp.vue +++ b/src/views/_sila/Settings/TransferInfo/Snmp.vue @@ -1,46 +1,40 @@ <template> <page-section :section-title="$t('pageTransfer.snmp.snmpTitle')"> - <b-row class="snmp-warning mb-5"> - <b-col xs="12" sm="12"> - <b-form-group - :label="$t('pageTransfer.snmp.host')" - label-for="snmp-host" - > - <b-form-input - id="snmp-host" - v-model="form.host" - :disabled="isNotAdmin" - /> - </b-form-group> - </b-col> - <b-col xs="12" sm="12"> - <b-form-group - :label="$t('pageTransfer.snmp.port')" - label-for="snmp-port" - > - <b-form-input - id="snmp-port" - v-model="form.port" - type="number" - :disabled="isNotAdmin" - /> - </b-form-group> - </b-col> - <b-col xs="4" class="d-flex justify-content-end align-items-start"> - <b-button variant="primary" :disabled="isNotAdmin" @click="saveSnmp"> - {{ $t('global.action.add') }} - </b-button> - </b-col> - </b-row> <b-row> <b-col> + <div class="text-right"> + <b-button + variant="primary" + :disabled="isNotAdmin" + @click="initSnmpModal()" + > + <icon-add /> + {{ $t('global.action.add') }} + </b-button> + </div> <b-table - hover responsive="md" - show-empty - :fields="fields" + hover + :fields="snmpTableFields" + :items="form.snmpTableItems" :empty-text="$t('global.table.emptyMessage')" + show-empty > + <template #cell(actions)="{ item, index }"> + <table-row-action + v-for="(action, actionIndex) in item.actions" + :key="actionIndex" + :value="action.value" + :title="action.title" + :enabled="action.enabled" + @click-table-action="onSnmpTableAction(action, $event, index)" + > + <template #icon> + <icon-edit v-if="action.value === 'edit'" /> + <icon-trashcan v-if="action.value === 'delete'" /> + </template> + </table-row-action> + </template> </b-table> </b-col> </b-row> @@ -50,37 +44,48 @@ <script> import PageSection from '@/components/_sila/Global/PageSection'; import BVToastMixin from '@/components/_sila/Mixins/BVToastMixin'; -import DataFormatterMixin from '@/components/_sila/Mixins/DataFormatterMixin'; + +import IconAdd from '@carbon/icons-vue/es/add--alt/20'; +import IconEdit from '@carbon/icons-vue/es/edit/20'; +import IconTrashcan from '@carbon/icons-vue/es/trash-can/20'; +import TableRowAction from '@/components/_sila/Global/TableRowAction'; export default { name: 'Snmp', components: { + IconAdd, + IconEdit, + IconTrashcan, PageSection, + TableRowAction, }, - mixins: [BVToastMixin, DataFormatterMixin], + mixins: [BVToastMixin], data() { return { form: { - user: '', - password: '', - host: '', - port: '', - auth: false, - ssl: false, + snmpTableItems: [], }, - fields: [ + actions: [ + { + value: 'edit', + title: this.$t('global.action.edit'), + }, + { + value: 'delete', + title: this.$t('global.action.delete'), + }, + ], + snmpTableFields: [ { - key: 'name', - label: this.$t('pageTransfer.table.userName'), - formatter: this.dataFormatter, + key: 'host', + label: this.$t('pageTransfer.snmp.host'), }, { - key: 'value', - label: this.$t('pageTransfer.table.value'), - formatter: this.dataFormatter, - tdClass: 'text-nowrap', + key: 'port', + label: this.$t('pageTransfer.snmp.port'), }, + { key: 'actions', label: '', tdClass: 'text-right' }, ], }; }, @@ -92,34 +97,15 @@ export default { ); }, }, - methods: { - saveSnmp() { - if (!this.form.auth) { - // eslint-disable-next-line no-unused-vars - const { user, password, ...formWithoutCredits } = this.form; - this.form = formWithoutCredits; - } - this.$store - .dispatch('snmpStore/setSnmpSettings', this.form) - .then((message) => this.successToast(message)) - .catch(({ message }) => this.errorToast(message)); - }, + created() { + this.getSnmpItems(); + }, + + methods: { + getSnmpItems() {}, + initSnmpModal() {}, + onSnmpTableAction() {}, }, }; </script> - -<style lang="scss" scoped> -.switch-group { - margin-bottom: 1.5rem; -} -.snmp-warning { - width: 50%; - @media (max-width: 1200px) { - width: 75%; - } - @media (max-width: 576px) { - width: 100%; - } -} -</style> diff --git a/src/views/_sila/Settings/TransferInfo/Transfer.vue b/src/views/_sila/Settings/TransferInfo/Transfer.vue index 19d72282..76f7f104 100644 --- a/src/views/_sila/Settings/TransferInfo/Transfer.vue +++ b/src/views/_sila/Settings/TransferInfo/Transfer.vue @@ -1,10 +1,10 @@ <template> <b-container fluid="xl"> - <page-title :description="$t('pageTransfer.title')" /> + <page-title :description="$t('pageTransfer.description')" /> <snmp /> <hr /> - <!-- <warning-smnp />--> <smtp /> + <hr /> <!-- <syslog />--> </b-container> </template> @@ -12,7 +12,6 @@ <script> import PageTitle from '@/components/_sila/Global/PageTitle'; import Snmp from './Snmp'; -// import WarningSmnp from './WarningSmnp'; import Smtp from './Smtp'; // import Syslog from './Syslog'; @@ -21,16 +20,8 @@ export default { components: { PageTitle, Snmp, - // WarningSmnp, Smtp, // Syslog }, - - data() { - return { - policyValue: null, - options: [], - }; - }, }; </script> |