forked from openbmc/webui-vue
-
Notifications
You must be signed in to change notification settings - Fork 13
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Add SNMP alerts page and test hooks (#8)
* Add SNMP alerts page and test hooks This page will be included in the Settings section of the primary navigation. The user will be able to delete and add alert destination. Signed-off-by: Sandeepa Singh <[email protected]>
- Loading branch information
Showing
11 changed files
with
609 additions
and
2 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,116 @@ | ||
| import api, { getResponseCount } from '@/store/api'; | ||
| import i18n from '@/i18n'; | ||
| const SnmpAlertsStore = { | ||
| namespaced: true, | ||
| state: { | ||
| allSnmpDetails: [], | ||
| }, | ||
| getters: { | ||
| allSnmpDetails(state) { | ||
| return state.allSnmpDetails; | ||
| }, | ||
| }, | ||
| mutations: { | ||
| setSnmpDetails(state, allSnmpDetails) { | ||
| state.allSnmpDetails = allSnmpDetails; | ||
| }, | ||
| }, | ||
| actions: { | ||
| async getSnmpAlertUrl() { | ||
| return await api | ||
| .get('/redfish/v1/') | ||
| .then((response) => api.get(response.data.EventService['@odata.id'])) | ||
| .then((response) => api.get(response.data.Subscriptions['@odata.id'])) | ||
| .then((response) => response.data['@odata.id']) | ||
| .catch((error) => console.log('Error', error)); | ||
| }, | ||
| async getSnmpDetails({ commit, dispatch }) { | ||
| const snmpAlertUrl = await dispatch('getSnmpAlertUrl'); | ||
| return await api | ||
| .get(snmpAlertUrl) | ||
| .then((response) => | ||
| response.data.Members.map((user) => user['@odata.id']) | ||
| ) | ||
| .then((userIds) => api.all(userIds.map((user) => api.get(user)))) | ||
| .then((users) => { | ||
| const snmpDetailsData = users.map((user) => user.data); | ||
| commit('setSnmpDetails', snmpDetailsData); | ||
| }) | ||
| .catch((error) => { | ||
| console.log(error); | ||
| const message = i18n.t('pageSnmpAlerts.toast.errorLoadSnmpDetails'); | ||
| throw new Error(message); | ||
| }); | ||
| }, | ||
| async deleteDestination({ dispatch }, id) { | ||
| const snmpAlertUrl = await dispatch('getSnmpAlertUrl'); | ||
| return await api | ||
| .delete(`${snmpAlertUrl}/${id}`) | ||
| .then(() => dispatch('getSnmpDetails')) | ||
| .then(() => | ||
| i18n.t('pageSnmpAlerts.toast.successDeleteDestination', { | ||
| id, | ||
| }) | ||
| ) | ||
| .catch((error) => { | ||
| console.log(error); | ||
| const message = i18n.t( | ||
| 'pageSnmpAlerts.toast.errorDeleteDestination', | ||
| { | ||
| id, | ||
| } | ||
| ); | ||
| throw new Error(message); | ||
| }); | ||
| }, | ||
| async deleteMultipleDestinations({ dispatch }, destination) { | ||
| const snmpAlertUrl = await dispatch('getSnmpAlertUrl'); | ||
| const promises = destination.map(({ id }) => { | ||
| return api.delete(`${snmpAlertUrl}/${id}`).catch((error) => { | ||
| console.log(error); | ||
| return error; | ||
| }); | ||
| }); | ||
| return await api | ||
| .all(promises) | ||
| .then((response) => { | ||
| dispatch('getSnmpDetails'); | ||
| return response; | ||
| }) | ||
| .then( | ||
| api.spread((...responses) => { | ||
| const { successCount, errorCount } = getResponseCount(responses); | ||
| let toastMessages = []; | ||
| if (successCount) { | ||
| const message = i18n.tc( | ||
| 'pageSnmpAlerts.toast.successBatchDelete', | ||
| successCount | ||
| ); | ||
| toastMessages.push({ type: 'success', message }); | ||
| } | ||
| if (errorCount) { | ||
| const message = i18n.tc( | ||
| 'pageSnmpAlerts.toast.errorBatchDelete', | ||
| errorCount | ||
| ); | ||
| toastMessages.push({ type: 'error', message }); | ||
| } | ||
| return toastMessages; | ||
| }) | ||
| ); | ||
| }, | ||
| async addDestination({ dispatch }, { data }) { | ||
| const snmpAlertUrl = await dispatch('getSnmpAlertUrl'); | ||
| return await api | ||
| .post(snmpAlertUrl, data) | ||
| .then(() => dispatch('getSnmpDetails')) | ||
| .then(() => i18n.t('pageSnmpAlerts.toast.successAddDestination')) | ||
| .catch((error) => { | ||
| console.log(error); | ||
| const message = i18n.t('pageSnmpAlerts.toast.errorAddDestination'); | ||
| throw new Error(message); | ||
| }); | ||
| }, | ||
| }, | ||
| }; | ||
| export default SnmpAlertsStore; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,142 @@ | ||
| <template> | ||
| <b-modal id="add-destination" ref="modal" @ok="onOk" @hidden="resetForm"> | ||
| <template #modal-title> | ||
| {{ $t('pageSnmpAlerts.modal.addSnmpDestinationTitle') }} | ||
| </template> | ||
| <b-form id="form-destination"> | ||
| <b-container> | ||
| <b-row> | ||
| <b-col sm="6"> | ||
| <!-- Add new SNMP alert destination type --> | ||
| <b-form-group | ||
| :label="$t('pageSnmpAlerts.modal.ipaddress')" | ||
| label-for="ip-address" | ||
| > | ||
| <b-form-input | ||
| id="ip-Address" | ||
| v-model="form.ipAddress" | ||
| :state="getValidationState($v.form.ipAddress)" | ||
| data-test-id="snmpAlerts-input-ipAddress" | ||
| type="text" | ||
| @blur="$v.form.ipAddress.$touch()" | ||
| /> | ||
| <b-form-invalid-feedback role="alert"> | ||
| <template v-if="!$v.form.ipAddress.required"> | ||
| {{ $t('global.form.fieldRequired') }} | ||
| </template> | ||
| <template v-if="!$v.form.ipAddress.ipAddress"> | ||
| {{ $t('global.form.invalidFormat') }} | ||
| </template> | ||
| </b-form-invalid-feedback> | ||
| </b-form-group> | ||
| </b-col> | ||
| <b-col> | ||
| <b-form-group label-for="port"> | ||
| <template #label> | ||
| {{ $t('pageSnmpAlerts.modal.port') }} - | ||
| <span class="form-text d-inline"> | ||
| {{ $t('global.form.optional') }} | ||
| </span> | ||
| </template> | ||
| <b-form-input | ||
| id="port" | ||
| v-model="form.port" | ||
| type="text" | ||
| :state="getValidationState($v.form.port)" | ||
| data-test-id="snmpAlerts-input-port" | ||
| @blur="$v.form.port.$touch()" | ||
| /> | ||
| <b-form-invalid-feedback role="alert"> | ||
| <template | ||
| v-if="!$v.form.port.minLength || !$v.form.port.maxLength" | ||
| > | ||
| {{ | ||
| $t('global.form.valueMustBeBetween', { | ||
| min: 0, | ||
| max: 65535, | ||
| }) | ||
| }} | ||
| </template> | ||
| </b-form-invalid-feedback> | ||
| </b-form-group> | ||
| </b-col> | ||
| </b-row> | ||
| </b-container> | ||
| </b-form> | ||
| <template #modal-footer="{ cancel }"> | ||
| <b-button variant="secondary" @click="cancel()"> | ||
| {{ $t('global.action.cancel') }} | ||
| </b-button> | ||
| <b-button | ||
| form="form-user" | ||
| type="submit" | ||
| variant="primary" | ||
| data-test-id="snmpAlerts-button-ok" | ||
| @click="onOk" | ||
| > | ||
| {{ $t('pageSnmpAlerts.addDestination') }} | ||
| </b-button> | ||
| </template> | ||
| </b-modal> | ||
| </template> | ||
| <script> | ||
| import { | ||
| required, | ||
| ipAddress, | ||
| minValue, | ||
| maxValue, | ||
| } from 'vuelidate/lib/validators'; | ||
| import VuelidateMixin from '@/components/Mixins/VuelidateMixin.js'; | ||
| export default { | ||
| mixins: [VuelidateMixin], | ||
| data() { | ||
| return { | ||
| form: { | ||
| ipaddress: null, | ||
| port: null, | ||
| }, | ||
| }; | ||
| }, | ||
| validations() { | ||
| return { | ||
| form: { | ||
| ipAddress: { | ||
| required, | ||
| ipAddress, | ||
| }, | ||
| port: { | ||
| minValue: minValue(0), | ||
| maxValue: maxValue(65535), | ||
| }, | ||
| }, | ||
| }; | ||
| }, | ||
| methods: { | ||
| handleSubmit() { | ||
| this.$v.$touch(); | ||
| if (this.$v.$invalid) return; | ||
| this.$emit('ok', { | ||
| ipAddress: this.form.ipAddress, | ||
| port: this.form.port, | ||
| }); | ||
| this.closeModal(); | ||
| }, | ||
| closeModal() { | ||
| this.$nextTick(() => { | ||
| this.$refs.modal.hide(); | ||
| }); | ||
| }, | ||
| resetForm() { | ||
| this.form.ipAddress = ''; | ||
| this.form.port = ''; | ||
| this.$v.$reset(); | ||
| this.$emit('hidden'); | ||
| }, | ||
| onOk(bvModalEvt) { | ||
| // prevent modal close | ||
| bvModalEvt.preventDefault(); | ||
| this.handleSubmit(); | ||
| }, | ||
| }, | ||
| }; | ||
| </script> |
Oops, something went wrong.