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