xref: /openbmc/webui-vue/src/views/Operations/ServerPowerOperations/ServerPowerOperations.vue (revision 99fe228eef84d018125712187e04b24a328d292b)
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 :is-button-disable="isButtonDisable" />
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              :disabled="isButtonDisable"
82              @click="powerOn"
83            >
84              {{ $t('pageServerPowerOperations.powerOn') }}
85            </b-button>
86          </template>
87          <template v-else>
88            <!-- Reboot server options -->
89            <b-form novalidate class="mb-5" @submit.prevent="rebootServer">
90              <b-form-group
91                :label="$t('pageServerPowerOperations.rebootServer')"
92              >
93                <b-form-radio
94                  v-model="form.rebootOption"
95                  name="reboot-option"
96                  data-test-id="serverPowerOperations-radio-rebootOrderly"
97                  value="orderly"
98                >
99                  {{ $t('pageServerPowerOperations.gracefulRestart') }}
100                  <info-tooltip
101                    :title="$t('pageServerPowerOperations.gracefulRestartInfo')"
102                  />
103                </b-form-radio>
104                <b-form-radio
105                  v-model="form.rebootOption"
106                  name="reboot-option"
107                  data-test-id="serverPowerOperations-radio-rebootImmediate"
108                  value="immediate"
109                >
110                  {{ $t('pageServerPowerOperations.forceRestart') }}
111                  <info-tooltip
112                    :title="$t('pageServerPowerOperations.forceRestartInfo')"
113                  />
114                </b-form-radio>
115              </b-form-group>
116              <b-button
117                variant="primary"
118                type="submit"
119                data-test-id="serverPowerOperations-button-reboot"
120                :disabled="isButtonDisable"
121              >
122                {{ $t('pageServerPowerOperations.reboot') }}
123              </b-button>
124            </b-form>
125            <!-- Shutdown server options -->
126            <b-form novalidate @submit.prevent="shutdownServer">
127              <b-form-group
128                :label="$t('pageServerPowerOperations.shutdownServer')"
129              >
130                <b-form-radio
131                  v-model="form.shutdownOption"
132                  name="shutdown-option"
133                  data-test-id="serverPowerOperations-radio-shutdownOrderly"
134                  value="orderly"
135                >
136                  {{ $t('pageServerPowerOperations.gracefulShutdown') }}
137                  <info-tooltip
138                    :title="
139                      $t('pageServerPowerOperations.gracefulShutdownInfo')
140                    "
141                  />
142                </b-form-radio>
143                <b-form-radio
144                  v-model="form.shutdownOption"
145                  name="shutdown-option"
146                  data-test-id="serverPowerOperations-radio-shutdownImmediate"
147                  value="immediate"
148                >
149                  {{ $t('pageServerPowerOperations.forceOff') }}
150                  <info-tooltip
151                    :title="$t('pageServerPowerOperations.forceOffInfo')"
152                  />
153                </b-form-radio>
154              </b-form-group>
155              <b-button
156                variant="primary"
157                type="submit"
158                data-test-id="serverPowerOperations-button-shutDown"
159                :disabled="isButtonDisable"
160              >
161                {{ $t('pageServerPowerOperations.shutDown') }}
162              </b-button>
163            </b-form>
164          </template>
165        </page-section>
166      </b-col>
167    </b-row>
168  </b-container>
169</template>
170
171<script>
172import PageTitle from '@/components/Global/PageTitle';
173import PageSection from '@/components/Global/PageSection';
174import BVToastMixin from '@/components/Mixins/BVToastMixin';
175import BootSettings from './BootSettings';
176import LoadingBarMixin from '@/components/Mixins/LoadingBarMixin';
177import Alert from '@/components/Global/Alert';
178import InfoTooltip from '@/components/Global/InfoTooltip';
179import { useI18n } from 'vue-i18n';
180import i18n from '@/i18n';
181import { privilegesId } from '@/store/modules/GlobalStore';
182import { mapGetters } from 'vuex';
183
184export default {
185  name: 'ServerPowerOperations',
186  components: { PageTitle, PageSection, BootSettings, Alert, InfoTooltip },
187  mixins: [BVToastMixin, LoadingBarMixin],
188  beforeRouteLeave(to, from, next) {
189    this.hideLoader();
190    next();
191  },
192  data() {
193    return {
194      $t: useI18n().t,
195      form: {
196        rebootOption: 'orderly',
197        shutdownOption: 'orderly',
198      },
199    };
200  },
201  computed: {
202    ...mapGetters('global', ['userPrivilege']),
203    isButtonDisable() {
204      return this.userPrivilege === privilegesId.readOnly;
205    },
206    serverStatus() {
207      return this.$store.getters['global/serverStatus'];
208    },
209    isOperationInProgress() {
210      return this.$store.getters['controls/isOperationInProgress'];
211    },
212    lastPowerOperationTime() {
213      return this.$store.getters['controls/lastPowerOperationTime'];
214    },
215    oneTimeBootEnabled() {
216      return this.$store.getters['serverBootSettings/overrideEnabled'];
217    },
218    hasBootSourceOptions() {
219      let bootOptions =
220        this.$store.getters['serverBootSettings/bootSourceOptions'];
221      return bootOptions.length !== 0;
222    },
223  },
224  created() {
225    this.startLoader();
226    const bootSettingsPromise = new Promise((resolve) => {
227      this.$root.$on('server-power-operations-boot-settings-complete', () =>
228        resolve(),
229      );
230    });
231    Promise.all([
232      this.$store.dispatch('serverBootSettings/getBootSettings'),
233      this.$store.dispatch('controls/getLastPowerOperationTime'),
234      bootSettingsPromise,
235    ]).finally(() => this.endLoader());
236  },
237  methods: {
238    powerOn() {
239      this.$store.dispatch('controls/serverPowerOn');
240    },
241    rebootServer() {
242      const modalMessage = i18n.global.t(
243        'pageServerPowerOperations.modal.confirmRebootMessage',
244      );
245      const modalOptions = {
246        title: i18n.global.t(
247          'pageServerPowerOperations.modal.confirmRebootTitle',
248        ),
249        okTitle: i18n.global.t('global.action.confirm'),
250        cancelTitle: i18n.global.t('global.action.cancel'),
251        autoFocusButton: 'ok',
252      };
253
254      if (this.form.rebootOption === 'orderly') {
255        this.$bvModal
256          .msgBoxConfirm(modalMessage, modalOptions)
257          .then((confirmed) => {
258            if (confirmed) this.$store.dispatch('controls/serverSoftReboot');
259          });
260      } else if (this.form.rebootOption === 'immediate') {
261        this.$bvModal
262          .msgBoxConfirm(modalMessage, modalOptions)
263          .then((confirmed) => {
264            if (confirmed) this.$store.dispatch('controls/serverHardReboot');
265          });
266      }
267    },
268    shutdownServer() {
269      const modalMessage = i18n.global.t(
270        'pageServerPowerOperations.modal.confirmShutdownMessage',
271      );
272      const modalOptions = {
273        title: i18n.global.t(
274          'pageServerPowerOperations.modal.confirmShutdownTitle',
275        ),
276        okTitle: i18n.global.t('global.action.confirm'),
277        cancelTitle: i18n.global.t('global.action.cancel'),
278        autoFocusButton: 'ok',
279      };
280
281      if (this.form.shutdownOption === 'orderly') {
282        this.$bvModal
283          .msgBoxConfirm(modalMessage, modalOptions)
284          .then((confirmed) => {
285            if (confirmed) this.$store.dispatch('controls/serverSoftPowerOff');
286          });
287      }
288      if (this.form.shutdownOption === 'immediate') {
289        this.$bvModal
290          .msgBoxConfirm(modalMessage, modalOptions)
291          .then((confirmed) => {
292            if (confirmed) this.$store.dispatch('controls/serverHardPowerOff');
293          });
294      }
295    },
296  },
297};
298</script>
299