xref: /openbmc/webui-vue/src/views/Logs/Dumps/DumpsForm.vue (revision ce7db82c9582c4dac04ac81d9af6b557ae7965e3)
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>
36 import { useVuelidate } from '@vuelidate/core';
37 import { required } from '@vuelidate/validators';
38 import ModalConfirmation from './DumpsModalConfirmation';
39 import Alert from '@/components/Global/Alert';
40 import BVToastMixin from '@/components/Mixins/BVToastMixin';
41 import VuelidateMixin from '@/components/Mixins/VuelidateMixin.js';
42 import i18n from '@/i18n';
43 
44 export default {
45   components: { Alert, ModalConfirmation },
46   mixins: [BVToastMixin, VuelidateMixin],
47   setup() {
48     return {
49       v$: useVuelidate(),
50     };
51   },
52   data() {
53     return {
54       selectedDumpType: null,
55       dumpTypeOptions: [
56         { value: 'bmc', text: i18n.global.t('pageDumps.form.bmcDump') },
57         { value: 'system', text: i18n.global.t('pageDumps.form.systemDump') },
58       ],
59     };
60   },
61   validations() {
62     return {
63       selectedDumpType: { required },
64     };
65   },
66   methods: {
67     handleSubmit() {
68       this.v$.$touch();
69       if (this.v$.$invalid) return;
70 
71       // System dump initiation
72       if (this.selectedDumpType === 'system') {
73         this.showConfirmationModal();
74       }
75       // BMC dump initiation
76       else if (this.selectedDumpType === 'bmc') {
77         this.$store
78           .dispatch('dumps/createBmcDump')
79           .then(() =>
80             this.infoToast(
81               i18n.global.t('pageDumps.toast.successStartBmcDump'),
82               {
83                 title: i18n.global.t(
84                   'pageDumps.toast.successStartBmcDumpTitle',
85                 ),
86                 timestamp: true,
87               },
88             ),
89           )
90           .catch(({ message }) => this.errorToast(message));
91       }
92     },
93     showConfirmationModal() {
94       this.$bvModal.show('modal-confirmation');
95     },
96     createSystemDump() {
97       this.$store
98         .dispatch('dumps/createSystemDump')
99         .then(() =>
100           this.infoToast(
101             i18n.global.t('pageDumps.toast.successStartSystemDump'),
102             {
103               title: i18n.global.t(
104                 'pageDumps.toast.successStartSystemDumpTitle',
105               ),
106               timestamp: true,
107             },
108           ),
109         )
110         .catch(({ message }) => this.errorToast(message));
111     },
112   },
113 };
114 </script>
115