xref: /openbmc/webui-vue/src/views/Logs/Dumps/DumpsForm.vue (revision 7d6b44cb263da09e575c7cb28cab88c1eb339c7b)
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