1<template> 2 <div class="form-background p-3"> 3 <b-form id="form-new-dump" novalidate @submit.prevent="handleSubmit"> 4 <b-form-group 5 :label="$t('pageDumps.form.selectDumpType')" 6 label-for="selectDumpType" 7 > 8 <b-form-select 9 id="selectDumpType" 10 v-model="selectedDumpType" 11 :options="dumpTypeOptions" 12 :state="getValidationState($v.selectedDumpType)" 13 > 14 <template #first> 15 <b-form-select-option :value="null" disabled> 16 {{ $t('global.form.selectAnOption') }} 17 </b-form-select-option> 18 </template> 19 </b-form-select> 20 <b-form-invalid-feedback role="alert"> 21 {{ $t('global.form.required') }} 22 </b-form-invalid-feedback> 23 </b-form-group> 24 <alert variant="info" class="mb-3" :show="selectedDumpType === 'system'"> 25 {{ $t('pageDumps.form.systemDumpInfo') }} 26 </alert> 27 <b-button variant="primary" type="submit" form="form-new-dump"> 28 {{ $t('pageDumps.form.initiateDump') }} 29 </b-button> 30 </b-form> 31 <modal-confirmation @ok="createSystemDump" /> 32 </div> 33</template> 34 35<script> 36import { useVuelidate } from '@vuelidate/core'; 37import { required } from '@vuelidate/validators'; 38import ModalConfirmation from './DumpsModalConfirmation'; 39import Alert from '@/components/Global/Alert'; 40import BVToastMixin from '@/components/Mixins/BVToastMixin'; 41import VuelidateMixin from '@/components/Mixins/VuelidateMixin.js'; 42 43export default { 44 components: { Alert, ModalConfirmation }, 45 mixins: [BVToastMixin, VuelidateMixin], 46 setup() { 47 return { 48 v$: useVuelidate(), 49 }; 50 }, 51 data() { 52 return { 53 selectedDumpType: null, 54 dumpTypeOptions: [ 55 { value: 'bmc', text: this.$t('pageDumps.form.bmcDump') }, 56 { value: 'system', text: this.$t('pageDumps.form.systemDump') }, 57 ], 58 }; 59 }, 60 validations() { 61 return { 62 selectedDumpType: { required }, 63 }; 64 }, 65 methods: { 66 handleSubmit() { 67 this.$v.$touch(); 68 if (this.$v.$invalid) return; 69 70 // System dump initiation 71 if (this.selectedDumpType === 'system') { 72 this.showConfirmationModal(); 73 } 74 // BMC dump initiation 75 else if (this.selectedDumpType === 'bmc') { 76 this.$store 77 .dispatch('dumps/createBmcDump') 78 .then(() => 79 this.infoToast(this.$t('pageDumps.toast.successStartBmcDump'), { 80 title: this.$t('pageDumps.toast.successStartBmcDumpTitle'), 81 timestamp: true, 82 }), 83 ) 84 .catch(({ message }) => this.errorToast(message)); 85 } 86 }, 87 showConfirmationModal() { 88 this.$bvModal.show('modal-confirmation'); 89 }, 90 createSystemDump() { 91 this.$store 92 .dispatch('dumps/createSystemDump') 93 .then(() => 94 this.infoToast(this.$t('pageDumps.toast.successStartSystemDump'), { 95 title: this.$t('pageDumps.toast.successStartSystemDumpTitle'), 96 timestamp: true, 97 }), 98 ) 99 .catch(({ message }) => this.errorToast(message)); 100 }, 101 }, 102}; 103</script> 104