1<template>
2  <div>
3    <page-section :section-title="sectionTitle">
4      <b-card-group deck>
5        <!-- Running image -->
6        <b-card>
7          <template #header>
8            <p class="font-weight-bold m-0">
9              {{ $t('pageFirmware.cardTitleRunning') }}
10            </p>
11          </template>
12          <dl class="mb-0">
13            <dt>{{ $t('pageFirmware.cardBodyVersion') }}</dt>
14            <dd class="mb-0">{{ runningVersion }}</dd>
15          </dl>
16        </b-card>
17
18        <!-- Backup image -->
19        <b-card>
20          <template #header>
21            <p class="font-weight-bold m-0">
22              {{ $t('pageFirmware.cardTitleBackup') }}
23            </p>
24          </template>
25          <dl>
26            <dt>{{ $t('pageFirmware.cardBodyVersion') }}</dt>
27            <dd>
28              <status-icon v-if="showBackupImageStatus" status="danger" />
29              <span v-if="showBackupImageStatus" class="sr-only">
30                {{ backupStatus }}
31              </span>
32              {{ backupVersion }}
33            </dd>
34          </dl>
35          <b-btn
36            v-if="!switchToBackupImageDisabled"
37            v-b-modal.modal-switch-to-running
38            data-test-id="firmware-button-switchToRunning"
39            variant="link"
40            size="sm"
41            class="py-0 px-1 mt-2"
42            :disabled="isPageDisabled || !backup || !isServerOff"
43          >
44            <icon-switch class="d-none d-sm-inline-block" />
45            {{ $t('pageFirmware.cardActionSwitchToRunning') }}
46          </b-btn>
47        </b-card>
48      </b-card-group>
49    </page-section>
50    <modal-switch-to-running :backup="backupVersion" @ok="switchToRunning" />
51  </div>
52</template>
53
54<script>
55import IconSwitch from '@carbon/icons-vue/es/arrows--horizontal/20';
56import PageSection from '@/components/Global/PageSection';
57import LoadingBarMixin, { loading } from '@/components/Mixins/LoadingBarMixin';
58import BVToastMixin from '@/components/Mixins/BVToastMixin';
59
60import ModalSwitchToRunning from './FirmwareModalSwitchToRunning';
61
62export default {
63  components: { IconSwitch, ModalSwitchToRunning, PageSection },
64  mixins: [BVToastMixin, LoadingBarMixin],
65  props: {
66    isPageDisabled: {
67      required: true,
68      type: Boolean,
69      default: false,
70    },
71    isServerOff: {
72      required: true,
73      type: Boolean,
74      default: false,
75    },
76  },
77  data() {
78    return {
79      loading,
80      switchToBackupImageDisabled:
81        process.env.VUE_APP_SWITCH_TO_BACKUP_IMAGE_DISABLED === 'true',
82    };
83  },
84  computed: {
85    isSingleFileUploadEnabled() {
86      return this.$store.getters['firmware/isSingleFileUploadEnabled'];
87    },
88    sectionTitle() {
89      if (this.isSingleFileUploadEnabled) {
90        return this.$t('pageFirmware.sectionTitleBmcCardsCombined');
91      }
92      return this.$t('pageFirmware.sectionTitleBmcCards');
93    },
94    running() {
95      return this.$store.getters['firmware/activeBmcFirmware'];
96    },
97    backup() {
98      return this.$store.getters['firmware/backupBmcFirmware'];
99    },
100    runningVersion() {
101      return this.running?.version || '--';
102    },
103    backupVersion() {
104      return this.backup?.version || '--';
105    },
106    backupStatus() {
107      return this.backup?.status || null;
108    },
109    showBackupImageStatus() {
110      return (
111        this.backupStatus === 'Critical' || this.backupStatus === 'Warning'
112      );
113    },
114  },
115  methods: {
116    switchToRunning() {
117      this.startLoader();
118      const timerId = setTimeout(() => {
119        this.endLoader();
120        this.infoToast(this.$t('pageFirmware.toast.verifySwitchMessage'), {
121          title: this.$t('pageFirmware.toast.verifySwitch'),
122          refreshAction: true,
123        });
124      }, 60000);
125
126      this.$store
127        .dispatch('firmware/switchBmcFirmwareAndReboot')
128        .then(() =>
129          this.infoToast(this.$t('pageFirmware.toast.rebootStartedMessage'), {
130            title: this.$t('pageFirmware.toast.rebootStarted'),
131          }),
132        )
133        .catch(({ message }) => {
134          this.errorToast(message);
135          clearTimeout(timerId);
136          this.endLoader();
137        });
138    },
139  },
140};
141</script>
142