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