diff options
Diffstat (limited to 'src/views/Configuration/Firmware/Firmware.vue')
| -rw-r--r-- | src/views/Configuration/Firmware/Firmware.vue | 391 |
1 files changed, 53 insertions, 338 deletions
diff --git a/src/views/Configuration/Firmware/Firmware.vue b/src/views/Configuration/Firmware/Firmware.vue index 5001702a..e27c8a26 100644 --- a/src/views/Configuration/Firmware/Firmware.vue +++ b/src/views/Configuration/Firmware/Firmware.vue @@ -1,378 +1,93 @@ <template> <b-container fluid="xl"> - <page-title :description="$t('pageFirmware.pageDescription')" /> - <b-row class="mb-4"> - <b-col md="10" lg="12" xl="8" class="pr-xl-4"> - <!-- Firmware on BMC --> - <page-section :section-title="$t('pageFirmware.firmwareOnBmc')"> - <b-card-group deck> - <!-- Current FW --> - <b-card header-bg-variant="success"> - <template #header> - <dl class="mb-0"> - <dt>{{ $t('pageFirmware.current') }}</dt> - <dd class="mb-0">{{ bmcFirmwareCurrentVersion }}</dd> - </dl> - </template> - <dl class="my-0"> - <dt>{{ $t('pageFirmware.state') }}:</dt> - <dd>{{ bmcFirmwareCurrentState }}</dd> - </dl> - <template #footer></template> - </b-card> - - <!-- Backup FW --> - <b-card footer-class="p-0"> - <template #header> - <dl class="mb-0"> - <dt>{{ $t('pageFirmware.backup') }}</dt> - <dd class="mb-0">{{ bmcFirmwareBackupVersion }}</dd> - </dl> - </template> - <dl class="my-0"> - <dt>{{ $t('pageFirmware.state') }}:</dt> - <dd>{{ bmcFirmwareBackupState }}</dd> - </dl> - <template #footer> - <b-btn - v-b-modal.modal-reboot-backup-bmc - :disabled="!bmcFirmwareBackupVersion" - variant="link" - size="sm" - > - <icon-switch class="d-none d-sm-inline-block" /> - {{ $t('pageFirmware.makeCurrentVersion') }}</b-btn - > - </template> - </b-card> - </b-card-group> - </page-section> - - <!-- Firmware on Host --> - <page-section :section-title="$t('pageFirmware.firmwareOnHost')"> - <b-card-group deck> - <!-- Current FW --> - <b-card header-bg-variant="success"> - <template #header> - <dl class="mb-0"> - <dt>{{ $t('pageFirmware.current') }}</dt> - <dd class="mb-0">{{ hostFirmwareCurrentVersion }}</dd> - </dl> - </template> - <!-- State --> - <dl class="my-0"> - <dt>{{ $t('pageFirmware.state') }}:</dt> - <dd>{{ hostFirmwareCurrentState }}</dd> - </dl> - </b-card> - - <!-- Backup FW --> - <b-card> - <template #header> - <dl class="mb-0"> - <dt>{{ $t('pageFirmware.backup') }}</dt> - <dd class="mb-0">{{ hostFirmwareBackupVersion }}</dd> - </dl> - </template> - <!-- State --> - <dl class="my-0"> - <dt>{{ $t('pageFirmware.state') }}:</dt> - <dd>{{ hostFirmwareBackupState }}</dd> - </dl> - </b-card> - </b-card-group> - </page-section> - </b-col> - - <!-- Update code --> - <b-col sm="8" xl="4" class="update-code pl-xl-4"> - <page-section :section-title="$t('pageFirmware.updateCode')"> - <b-form @submit.prevent="onSubmitUpload"> - <b-form-group :label="$t('pageFirmware.form.uploadLocation')"> - <b-form-radio v-model="isWorkstationSelected" :value="true"> - {{ $t('pageFirmware.form.workstation') }} - </b-form-radio> - <b-form-radio v-model="isWorkstationSelected" :value="false"> - {{ $t('pageFirmware.form.tftpServer') }} - </b-form-radio> - </b-form-group> - - <!-- Workstation Upload --> - <template v-if="isWorkstationSelected"> - <b-form-group :label="$t('pageFirmware.form.imageFile')"> - <b-form-text id="image-file-help-block"> - {{ $t('pageFirmware.form.onlyTarFilesAccepted') }} - </b-form-text> - <form-file - id="image-file" - accept=".tar" - :state="getValidationState($v.file)" - aria-describedby="image-file-help-block" - @input="onFileUpload($event)" - > - <template #invalid> - <b-form-invalid-feedback role="alert"> - {{ $t('global.form.required') }} - </b-form-invalid-feedback> - </template> - </form-file> - </b-form-group> - </template> - - <!-- TFTP Server Upload --> - <template v-else> - <b-form-group - :label="$t('pageFirmware.form.tftpServerAddress')" - label-for="tftp-ip" - > - <b-form-text id="server-address-help-block"> - {{ $t('pageFirmware.form.tftpServerAddressHelper') }} - </b-form-text> - <b-form-input - id="tftp-id" - v-model="tftpIpAddress" - type="text" - :state="getValidationState($v.tftpIpAddress)" - aria-describedby="server-address-help-block" - @input="$v.tftpIpAddress.$touch()" - /> - <b-form-invalid-feedback role="alert"> - {{ $t('global.form.fieldRequired') }} - </b-form-invalid-feedback> - </b-form-group> - <b-form-group - :label="$t('pageFirmware.form.imageFileName')" - label-for="tftp-file-name" - > - <b-form-input - id="tftp-file-name" - v-model="tftpFileName" - type="text" - :state="getValidationState($v.tftpFileName)" - @input="$v.tftpFileName.$touch()" - /> - <b-form-invalid-feedback role="alert"> - {{ $t('global.form.fieldRequired') }} - </b-form-invalid-feedback> - </b-form-group> - </template> + <page-title /> + <alerts-server-power + v-if="isServerPowerOffRequired" + :is-host-off="isHostOff" + /> - <!-- Info alert --> - <alert variant="info" class="mt-4 mb-5"> - <p class="font-weight-bold mb-1"> - {{ $t('pageFirmware.alert.updateProcess') }} - </p> - <p>{{ $t('pageFirmware.alert.updateProcessInfo') }}</p> - </alert> + <!-- Firmware cards --> + <b-row> + <b-col xl="10"> + <!-- BMC Firmware --> + <bmc-cards :is-page-disabled="isPageDisabled" /> - <b-btn type="submit" variant="primary"> - {{ $t('pageFirmware.form.uploadAndRebootBmcOrHost') }} - </b-btn> - </b-form> - </page-section> + <!-- Host Firmware --> + <host-cards v-if="!isSingleFileUploadEnabled" /> </b-col> </b-row> - <!-- Modals --> - <modal-upload @ok="uploadFirmware" /> - <modal-reboot-backup-bmc - :current="bmcFirmwareCurrentVersion || '--'" - :backup="bmcFirmwareBackupVersion || '--'" - @ok="switchBmcFirmware" - /> + <!-- Update firmware--> + <page-section + :section-title="$t('pageFirmware.sectionTitleUpdateFirmware')" + > + <b-row> + <b-col sm="8" md="6" xl="4"> + <!-- Update form --> + <form-update + :is-host-off="isHostOff" + :is-page-disabled="isPageDisabled" + /> + </b-col> + </b-row> + </page-section> </b-container> </template> <script> -import { requiredIf } from 'vuelidate/lib/validators'; -import { mapGetters } from 'vuex'; -import IconSwitch from '@carbon/icons-vue/es/arrows--horizontal/20'; - +import AlertsServerPower from './FirmwareAlertServerPower'; +import BmcCards from './FirmwareCardsBmc'; +import FormUpdate from './FirmwareFormUpdate'; +import HostCards from './FirmwareCardsHost'; import PageSection from '@/components/Global/PageSection'; import PageTitle from '@/components/Global/PageTitle'; -import Alert from '@/components/Global/Alert'; -import ModalUpload from './FirmwareModalUpload'; -import ModalRebootBackupBmc from './FirmwareModalRebootBackupBmc'; -import FormFile from '@/components/Global/FormFile'; -import VuelidateMixin from '@/components/Mixins/VuelidateMixin.js'; import LoadingBarMixin, { loading } from '@/components/Mixins/LoadingBarMixin'; -import BVToastMixin from '@/components/Mixins/BVToastMixin'; export default { - name: 'Firmware', + name: 'FirmwareSingleImage', components: { - Alert, - IconSwitch, - ModalRebootBackupBmc, - ModalUpload, + AlertsServerPower, + BmcCards, + FormUpdate, + HostCards, PageSection, PageTitle, - FormFile, }, - mixins: [BVToastMixin, LoadingBarMixin, VuelidateMixin], + mixins: [LoadingBarMixin], beforeRouteLeave(to, from, next) { this.hideLoader(); - this.clearRebootTimeout(); next(); }, data() { return { - isWorkstationSelected: true, - file: null, - tftpIpAddress: null, - tftpFileName: null, - timeoutId: null, - loading: loading, + loading, + isServerPowerOffRequired: + process.env.VUE_APP_SERVER_OFF_REQUIRED === 'true', }; }, computed: { - ...mapGetters('firmware', [ - 'bmcFirmwareCurrentVersion', - 'bmcFirmwareCurrentState', - 'bmcFirmwareBackupVersion', - 'bmcFirmwareBackupState', - 'hostFirmwareCurrentVersion', - 'hostFirmwareCurrentState', - 'hostFirmwareBackupVersion', - 'hostFirmwareBackupState', - ]), - }, - watch: { - isWorkstationSelected: function () { - this.$v.$reset(); - this.file = null; - this.tftpIpAddress = null; - this.tftpFileName = null; + hostStatus() { + return this.$store.getters['global/hostStatus']; + }, + isHostOff() { + return this.hostStatus === 'off' ? true : false; + }, + isSingleFileUploadEnabled() { + return this.$store.getters['firmware/isSingleFileUploadEnabled']; + }, + isPageDisabled() { + if (this.isServerPowerOffRequired) { + return !this.isHostOff || this.loading || this.isOperationInProgress; + } + return this.loading || this.isOperationInProgress; }, }, created() { this.startLoader(); - this.$store.dispatch('firmware/getUpdateServiceApplyTime'); this.$store .dispatch('firmware/getFirmwareInformation') .finally(() => this.endLoader()); }, - validations() { - return { - file: { - required: requiredIf(function () { - return this.isWorkstationSelected; - }), - }, - tftpIpAddress: { - required: requiredIf(function () { - return !this.isWorkstationSelected; - }), - }, - tftpFileName: { - required: requiredIf(function () { - return !this.isWorkstationSelected; - }), - }, - }; - }, - methods: { - onFileUpload(file) { - this.file = file; - this.$v.file.$touch(); - }, - uploadFirmware() { - const startTime = this.$options.filters.formatTime(new Date()); - this.setRebootTimeout(360000); //6 minute timeout - this.infoToast( - this.$t('pageFirmware.toast.infoUploadStartTimeMessage', { startTime }), - { title: this.$t('pageFirmware.toast.infoUploadStartTimeTitle') } - ); - if (this.isWorkstationSelected) { - this.dispatchWorkstationUpload(); - } else { - this.dispatchTftpUpload(); - } - }, - dispatchWorkstationUpload() { - this.$store - .dispatch('firmware/uploadFirmware', this.file) - .then((success) => - this.infoToast(success, { - title: this.$t('pageFirmware.toast.successUploadTitle'), - }) - ) - .catch(({ message }) => { - this.errorToast(message); - this.clearRebootTimeout(); - }); - }, - dispatchTftpUpload() { - const data = { - address: this.tftpIpAddress, - filename: this.tftpFileName, - }; - this.$store - .dispatch('firmware/uploadFirmwareTFTP', data) - .then((success) => - this.infoToast(success, { - title: this.$t('pageFirmware.toast.successUploadTitle'), - }) - ) - .catch(({ message }) => { - this.errorToast(message); - this.clearRebootTimeout(); - }); - }, - switchBmcFirmware() { - this.setRebootTimeout(); - this.$store - .dispatch('firmware/switchBmcFirmware') - .then((success) => - this.infoToast(success, { title: this.$t('global.status.success') }) - ) - .catch(({ message }) => { - this.errorToast(message); - this.clearRebootTimeout(); - }); - }, - setRebootTimeout(timeoutMs = 60000) { - // Set a timeout to disable page interactions while - // an upload or BMC reboot is in progress - this.startLoader(); - this.timeoutId = setTimeout(() => { - this.endLoader(); - this.infoToast( - this.$t('pageFirmware.toast.infoRefreshApplicationMessage'), - { - title: this.$t('pageFirmware.toast.infoRefreshApplicationTitle'), - refreshAction: true, - } - ); - }, timeoutMs); - }, - clearRebootTimeout() { - if (this.timeoutId) { - clearTimeout(this.timeoutId); - this.endLoader(); - } - }, - onSubmitUpload() { - this.$v.$touch(); - if (this.$v.$invalid) return; - this.$bvModal.show('modal-upload'); - }, - }, }; </script> - -<style lang="scss" scoped> -.update-code { - border-left: none; - @include media-breakpoint-up(xl) { - border-left: 1px solid gray('300'); - } -} -.card-footer { - height: 40px; -} -.card-body { - padding: 0.75rem 1.25rem; -} -</style> |