xref: /openbmc/webui-vue/src/views/Logs/Dumps/DumpsForm.vue (revision d36ac8a8be8636ddd0e64ce005d507b21bcdeb00) 
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
28        variant="primary"
29        type="submit"
30        form="form-new-dump"
31        class="mt-3"
32      >
33        {{ $t('pageDumps.form.initiateDump') }}
34      </b-button>
35    </b-form>
36    <modal-confirmation v-model="showConfirmation" @ok="createSystemDump" />
37  </div>
38</template>
39
40<script>
41import { useVuelidate } from '@vuelidate/core';
42import { required } from '@vuelidate/validators';
43import ModalConfirmation from './DumpsModalConfirmation';
44import Alert from '@/components/Global/Alert';
45import BVToastMixin from '@/components/Mixins/BVToastMixin';
46import VuelidateMixin from '@/components/Mixins/VuelidateMixin.js';
47import i18n from '@/i18n';
48import { useI18n } from 'vue-i18n';
49import { useModal } from 'bootstrap-vue-next';
50
51export default {
52  components: { Alert, ModalConfirmation },
53  mixins: [BVToastMixin, VuelidateMixin],
54  setup() {
55    const bvModal = useModal();
56    return {
57      v$: useVuelidate(),
58      bvModal,
59    };
60  },
61  data() {
62    return {
63      $t: useI18n().t,
64      selectedDumpType: null,
65      showConfirmation: false,
66      dumpTypeOptions: [
67        { value: 'bmc', text: i18n.global.t('pageDumps.dumpTypes.bmcDump') },
68        {
69          value: 'system',
70          text: i18n.global.t('pageDumps.dumpTypes.systemDump'),
71        },
72      ],
73    };
74  },
75  validations() {
76    return {
77      selectedDumpType: { required },
78    };
79  },
80  methods: {
81    handleSubmit() {
82      this.v$.$touch();
83      if (this.v$.$invalid) return;
84
85      // System dump initiation
86      if (this.selectedDumpType === 'system') {
87        this.showConfirmationModal();
88      }
89      // BMC dump initiation
90      else if (this.selectedDumpType === 'bmc') {
91        this.$store
92          .dispatch('dumps/createBmcDump')
93          .then(() =>
94            this.infoToast(
95              i18n.global.t('pageDumps.toast.successStartBmcDump'),
96              {
97                title: i18n.global.t(
98                  'pageDumps.toast.successStartBmcDumpTitle',
99                ),
100                timestamp: true,
101              },
102            ),
103          )
104          .catch(({ message }) => this.errorToast(message));
105      }
106    },
107    showConfirmationModal() {
108      this.showConfirmation = true;
109    },
110    createSystemDump() {
111      this.$store
112        .dispatch('dumps/createSystemDump')
113        .then(() =>
114          this.infoToast(
115            i18n.global.t('pageDumps.toast.successStartSystemDump'),
116            {
117              title: i18n.global.t(
118                'pageDumps.toast.successStartSystemDumpTitle',
119              ),
120              timestamp: true,
121            },
122          ),
123        )
124        .catch(({ message }) => this.errorToast(message));
125    },
126  },
127};
128</script>
129