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