<template>
  <page-section class="bmc-control-section">
    <div class="bmc-control__table">
      <div class="bmc-control__table__cell">
        <div>
          <span class="semi-bold-12px"> {{ $t('BMC.ControlBmc') }} </span>
        </div>
        <popover
          id="popover-reactive-1"
          description="BMC.ReloadBmc"
          popup="BMC.ReloadBmc_popup"
          button="BMC.ReloadBmc"
        />
        <settings-import-popup
          id="popover-reactive-2"
          description="BMC.ExportImport"
          popup="BMC.ExportImport"
          button="BMC.ExportImport_button"
        />
        <div>
          <span
            class="regular-12px underline"
            @click="redirectNetworkParametrs"
            >{{ $t('BMC.Parametrs') }}</span
          >
        </div>
      </div>

      <div class="bmc-control__table__cell">
        <div>
          <span class="semi-bold-12px">{{ $t('BMC.microcode') }}</span>
        </div>
        <popover
          id="popover-reactive-3"
          description="BMC.ReloadMicrocodeBios"
          popup="BMC.ReloadMicrocodeBios"
          button="global.action.refresh"
          :is-microcode="true"
        />
        <popover
          id="popover-reactive-4"
          description="BMC.ReloadicrocodeBmc"
          popup="BMC.ReloadicrocodeBmc"
          button="global.action.refresh"
          :is-microcode="true"
        />
      </div>
    </div>
  </page-section>
</template>

<script>
import SettingsImportPopup from './SettingsImportPopup';
import PageSection from '@/components/Global/PageSection';
import Popover from '@/components/Global/Popover';

export default {
  components: {
    PageSection,
    Popover,
    SettingsImportPopup,
  },
  data() {
    return {
      timeOption: 'resetBios',
      picked: '',
      options: [
        { text: 'Toggle this custom radio', value: 'first' },
        { text: 'Or toggle this other custom radio', value: 'second' },
      ],
      progress1: {
        value: 90,
      },
      progress2: {
        value: null,
      },
    };
  },
  methods: {
    redirectNetworkParametrs() {
      this.$router.push('/network-parametrs');
    },
  },
};
</script>
<style lang="scss" scoped>
a {
  list-style-type: none;
}

.bmc-control-section {
  position: relative;
  margin: 16px 2rem 2rem;
  width: 70%;
}

.bmc-control__table {
  display: flex;
  flex-flow: row nowrap;
  justify-content: space-between;
  width: 85%;
}

.bmc-control__table__cell {
  display: flex;
  flex-flow: column nowrap;
  align-items: flex-start;
  row-gap: 6px;
}

.semi-bold-12px {
  display: inline-block;
}

label {
  padding-top: 5px;
}
</style>
