<template>
  <b-container fluid="xl">
    <page-title />
    <b-row>
      <b-col md="8" lg="8" xl="6">
        <page-section>
          <b-row>
            <b-col>
              <dl>
                <dt>
                  {{ $t('pageRebootBmc.lastReboot') }}
                </dt>
                <dd v-if="lastBmcRebootTime">
                  {{ lastBmcRebootTime | formatDate }}
                  {{ lastBmcRebootTime | formatTime }}
                </dd>
                <dd v-else>--</dd>
              </dl>
            </b-col>
          </b-row>
          {{ $t('pageRebootBmc.rebootInformation') }}
          <popover-with-slot
            id="popover-reboot"
            :button-label="$t('global.action.reload')"
            :popup-label="$t('BMC.ReloadBmc_popup')"
            placement="left"
            :action="rebootBmc"
          >
            <b-button
              id="popover-reboot"
              variant="primary"
              class="d-block mt-5"
              data-test-id="rebootBmc-button-reboot"
            >
              {{ $t('pageRebootBmc.rebootBmc') }}
            </b-button>
          </popover-with-slot>
        </page-section>
      </b-col>
    </b-row>
  </b-container>
</template>

<script>
import PageTitle from '@/components/Global/PageTitle';
import PageSection from '@/components/Global/PageSection';
import BVToastMixin from '@/components/Mixins/BVToastMixin';
import LoadingBarMixin from '@/components/Mixins/LoadingBarMixin';
import PopoverWithSlot from '@/components/Global/SilaComponents/PopoverWithSlot';

export default {
  name: 'RebootBmc',
  components: { PageTitle, PageSection, PopoverWithSlot },
  mixins: [BVToastMixin, LoadingBarMixin],
  beforeRouteLeave(to, from, next) {
    this.hideLoader();
    next();
  },
  computed: {
    lastBmcRebootTime() {
      return this.$store.getters['controls/lastBmcRebootTime'];
    },
  },
  created() {
    this.startLoader();
    this.$store
      .dispatch('controls/getLastBmcRebootTime')
      .finally(() => this.endLoader());
  },
  methods: {
    rebootBmc() {
      this.$store
        .dispatch('controls/rebootBmc')
        .then((message) => this.successToast(message))
        .catch(({ message }) => this.errorToast(message));
    },
  },
};
</script>

<style lang="scss" scoped></style>
