xref: /openbmc/webui-vue/src/views/Operations/ServerPowerOperations/ServerPowerOperations.vue (revision a5dbf55f125c1b3841bdc1fc7743c9e9f347f3cc)
1<template>
2  <b-container fluid="xl">
3    <page-title />
4    <b-row class="mb-4">
5      <b-col md="8" xl="6">
6        <page-section
7          :section-title="$t('pageServerPowerOperations.currentStatus')"
8        >
9          <b-row>
10            <b-col>
11              <dl>
12                <dt>{{ $t('pageServerPowerOperations.serverStatus') }}</dt>
13                <dd
14                  v-if="serverStatus === 'on'"
15                  data-test-id="powerServerOps-text-hostStatus"
16                >
17                  {{ $t('global.status.on') }}
18                </dd>
19                <dd
20                  v-else-if="serverStatus === 'off'"
21                  data-test-id="powerServerOps-text-hostStatus"
22                >
23                  {{ $t('global.status.off') }}
24                </dd>
25                <dd
26                  v-else-if="serverStatus === 'diagnosticMode'"
27                  data-test-id="powerServerOps-text-hostStatus"
28                >
29                  {{ $t('global.status.diagnosticMode') }}
30                </dd>
31                <dd v-else>
32                  {{ $t('global.status.notAvailable') }}
33                </dd>
34              </dl>
35            </b-col>
36          </b-row>
37          <b-row>
38            <b-col>
39              <dl>
40                <dt>
41                  {{ $t('pageServerPowerOperations.lastPowerOperation') }}
42                </dt>
43                <dd
44                  v-if="lastPowerOperationTime"
45                  data-test-id="powerServerOps-text-lastPowerOp"
46                >
47                  {{ $filters.formatDate(lastPowerOperationTime) }}
48                  {{ $filters.formatTime(lastPowerOperationTime) }}
49                </dd>
50                <dd v-else>--</dd>
51              </dl>
52            </b-col>
53          </b-row>
54        </page-section>
55      </b-col>
56    </b-row>
57    <b-row>
58      <b-col v-if="hasBootSourceOptions" sm="8" md="6" xl="4">
59        <page-section
60          :section-title="$t('pageServerPowerOperations.serverBootSettings')"
61        >
62          <boot-settings />
63        </page-section>
64      </b-col>
65      <b-col sm="8" md="6" xl="7">
66        <page-section
67          :section-title="$t('pageServerPowerOperations.operations')"
68        >
69          <alert :show="oneTimeBootEnabled" variant="warning">
70            {{ $t('pageServerPowerOperations.oneTimeBootWarning') }}
71          </alert>
72          <template v-if="isOperationInProgress">
73            <alert variant="info">
74              {{ $t('pageServerPowerOperations.operationInProgress') }}
75            </alert>
76          </template>
77          <template v-else-if="serverStatus === 'off'">
78            <b-button
79              variant="primary"
80              data-test-id="serverPowerOperations-button-powerOn"
81              @click="powerOn"
82            >
83              {{ $t('pageServerPowerOperations.powerOn') }}
84            </b-button>
85          </template>
86          <template v-else>
87            <!-- Reboot server options -->
88            <b-form novalidate class="mb-5" @submit.prevent="rebootServer">
89              <b-form-group
90                :label="$t('pageServerPowerOperations.rebootServer')"
91              >
92                <b-form-radio
93                  v-model="form.rebootOption"
94                  name="reboot-option"
95                  data-test-id="serverPowerOperations-radio-rebootOrderly"
96                  value="orderly"
97                >
98                  {{ $t('pageServerPowerOperations.gracefulRestart') }}
99                  <info-tooltip
100                    :title="$t('pageServerPowerOperations.gracefulRestartInfo')"
101                  />
102                </b-form-radio>
103                <b-form-radio
104                  v-model="form.rebootOption"
105                  name="reboot-option"
106                  data-test-id="serverPowerOperations-radio-rebootImmediate"
107                  value="immediate"
108                >
109                  {{ $t('pageServerPowerOperations.forceRestart') }}
110                  <info-tooltip
111                    :title="$t('pageServerPowerOperations.forceRestartInfo')"
112                  />
113                </b-form-radio>
114              </b-form-group>
115              <b-button
116                variant="primary"
117                type="submit"
118                data-test-id="serverPowerOperations-button-reboot"
119              >
120                {{ $t('pageServerPowerOperations.reboot') }}
121              </b-button>
122            </b-form>
123            <!-- Shutdown server options -->
124            <b-form novalidate @submit.prevent="shutdownServer">
125              <b-form-group
126                :label="$t('pageServerPowerOperations.shutdownServer')"
127              >
128                <b-form-radio
129                  v-model="form.shutdownOption"
130                  name="shutdown-option"
131                  data-test-id="serverPowerOperations-radio-shutdownOrderly"
132                  value="orderly"
133                >
134                  {{ $t('pageServerPowerOperations.gracefulShutdown') }}
135                  <info-tooltip
136                    :title="
137                      $t('pageServerPowerOperations.gracefulShutdownInfo')
138                    "
139                  />
140                </b-form-radio>
141                <b-form-radio
142                  v-model="form.shutdownOption"
143                  name="shutdown-option"
144                  data-test-id="serverPowerOperations-radio-shutdownImmediate"
145                  value="immediate"
146                >
147                  {{ $t('pageServerPowerOperations.forceOff') }}
148                  <info-tooltip
149                    :title="$t('pageServerPowerOperations.forceOffInfo')"
150                  />
151                </b-form-radio>
152              </b-form-group>
153              <b-button
154                variant="primary"
155                type="submit"
156                data-test-id="serverPowerOperations-button-shutDown"
157              >
158                {{ $t('pageServerPowerOperations.shutDown') }}
159              </b-button>
160            </b-form>
161          </template>
162        </page-section>
163      </b-col>
164    </b-row>
165  </b-container>
166</template>
167
168<script>
169import PageTitle from '@/components/Global/PageTitle';
170import PageSection from '@/components/Global/PageSection';
171import BVToastMixin from '@/components/Mixins/BVToastMixin';
172import BootSettings from './BootSettings';
173import LoadingBarMixin from '@/components/Mixins/LoadingBarMixin';
174import Alert from '@/components/Global/Alert';
175import InfoTooltip from '@/components/Global/InfoTooltip';
176import { useI18n } from 'vue-i18n';
177import i18n from '@/i18n';
178
179export default {
180  name: 'ServerPowerOperations',
181  components: { PageTitle, PageSection, BootSettings, Alert, InfoTooltip },
182  mixins: [BVToastMixin, LoadingBarMixin],
183  beforeRouteLeave(to, from, next) {
184    this.hideLoader();
185    next();
186  },
187  data() {
188    return {
189      $t: useI18n().t,
190      form: {
191        rebootOption: 'orderly',
192        shutdownOption: 'orderly',
193      },
194    };
195  },
196  computed: {
197    serverStatus() {
198      return this.$store.getters['global/serverStatus'];
199    },
200    isOperationInProgress() {
201      return this.$store.getters['controls/isOperationInProgress'];
202    },
203    lastPowerOperationTime() {
204      return this.$store.getters['controls/lastPowerOperationTime'];
205    },
206    oneTimeBootEnabled() {
207      return this.$store.getters['serverBootSettings/overrideEnabled'];
208    },
209    hasBootSourceOptions() {
210      let bootOptions =
211        this.$store.getters['serverBootSettings/bootSourceOptions'];
212      return bootOptions.length !== 0;
213    },
214  },
215  created() {
216    this.startLoader();
217    const bootSettingsPromise = new Promise((resolve) => {
218      this.$root.$on('server-power-operations-boot-settings-complete', () =>
219        resolve(),
220      );
221    });
222    Promise.all([
223      this.$store.dispatch('serverBootSettings/getBootSettings'),
224      this.$store.dispatch('controls/getLastPowerOperationTime'),
225      bootSettingsPromise,
226    ]).finally(() => this.endLoader());
227  },
228  methods: {
229    powerOn() {
230      this.$store.dispatch('controls/serverPowerOn');
231    },
232    rebootServer() {
233      const modalMessage = i18n.global.t(
234        'pageServerPowerOperations.modal.confirmRebootMessage',
235      );
236      const modalOptions = {
237        title: i18n.global.t(
238          'pageServerPowerOperations.modal.confirmRebootTitle',
239        ),
240        okTitle: i18n.global.t('global.action.confirm'),
241        cancelTitle: i18n.global.t('global.action.cancel'),
242        autoFocusButton: 'ok',
243      };
244
245      if (this.form.rebootOption === 'orderly') {
246        this.$bvModal
247          .msgBoxConfirm(modalMessage, modalOptions)
248          .then((confirmed) => {
249            if (confirmed) this.$store.dispatch('controls/serverSoftReboot');
250          });
251      } else if (this.form.rebootOption === 'immediate') {
252        this.$bvModal
253          .msgBoxConfirm(modalMessage, modalOptions)
254          .then((confirmed) => {
255            if (confirmed) this.$store.dispatch('controls/serverHardReboot');
256          });
257      }
258    },
259    shutdownServer() {
260      const modalMessage = i18n.global.t(
261        'pageServerPowerOperations.modal.confirmShutdownMessage',
262      );
263      const modalOptions = {
264        title: i18n.global.t(
265          'pageServerPowerOperations.modal.confirmShutdownTitle',
266        ),
267        okTitle: i18n.global.t('global.action.confirm'),
268        cancelTitle: i18n.global.t('global.action.cancel'),
269        autoFocusButton: 'ok',
270      };
271
272      if (this.form.shutdownOption === 'orderly') {
273        this.$bvModal
274          .msgBoxConfirm(modalMessage, modalOptions)
275          .then((confirmed) => {
276            if (confirmed) this.$store.dispatch('controls/serverSoftPowerOff');
277          });
278      }
279      if (this.form.shutdownOption === 'immediate') {
280        this.$bvModal
281          .msgBoxConfirm(modalMessage, modalOptions)
282          .then((confirmed) => {
283            if (confirmed) this.$store.dispatch('controls/serverHardPowerOff');
284          });
285      }
286    },
287  },
288};
289</script>
290