summaryrefslogtreecommitdiff
path: root/src/views
diff options
context:
space:
mode:
authorAnna Tsyganova <ATSyganova@IBS.RU>2022-07-13 12:12:58 +0300
committerAnna Tsyganova <ATSyganova@IBS.RU>2022-07-13 12:12:58 +0300
commitac2e648139a370f1c5b418cfb1694b348f992f8e (patch)
tree3d29fa28a97a2fbb0b1ad4cc2e0dc1d9065bab76 /src/views
parentb2bea3021aea8be3d4bc34f965bf58297c358bca (diff)
downloadwebui-vue-ac2e648139a370f1c5b418cfb1694b348f992f8e.tar.xz
Add pages bms
Issue: SILABMC-191
Diffstat (limited to 'src/views')
-rw-r--r--src/views/_sila/BMC/Configuration/Configuration.vue40
-rw-r--r--src/views/_sila/BMC/Configuration/ConfigurationControl.vue74
-rw-r--r--src/views/_sila/BMC/Configuration/ConfigurationTable.vue96
-rw-r--r--src/views/_sila/BMC/Configuration/SettingsImportPopup.vue291
-rw-r--r--src/views/_sila/BMC/Configuration/index.js2
5 files changed, 503 insertions, 0 deletions
diff --git a/src/views/_sila/BMC/Configuration/Configuration.vue b/src/views/_sila/BMC/Configuration/Configuration.vue
new file mode 100644
index 00000000..f69f0d66
--- /dev/null
+++ b/src/views/_sila/BMC/Configuration/Configuration.vue
@@ -0,0 +1,40 @@
+<template>
+ <b-container fluid="xl">
+ <page-title />
+ <configuration-table />
+ <page-section :section-title="$t('BMC.Bios')">
+ <span class="medium-12px">V 3.2.10.0</span>
+ </page-section>
+ <configuration-control />
+ </b-container>
+</template>
+
+<script>
+import PageTitle from '@/components/_sila/Global/PageTitle';
+import ConfigurationTable from './ConfigurationTable';
+import ConfigurationControl from './ConfigurationControl';
+import PageSection from '@/components/_sila/Global/PageSection';
+import LoadingBarMixin from '@/components/Mixins/LoadingBarMixin';
+
+export default {
+ components: {
+ PageTitle,
+ ConfigurationControl,
+ ConfigurationTable,
+ PageSection,
+ },
+ mixins: [LoadingBarMixin],
+ data() {
+ return {
+ text: '',
+ };
+ },
+ created() {
+ this.startLoader();
+ const bmcManagerTablePromise = new Promise((resolve) => {
+ this.$root.$on('hardware-status-bmc-manager-complete', () => resolve());
+ });
+ Promise.all([bmcManagerTablePromise]).finally(() => this.endLoader());
+ },
+};
+</script>
diff --git a/src/views/_sila/BMC/Configuration/ConfigurationControl.vue b/src/views/_sila/BMC/Configuration/ConfigurationControl.vue
new file mode 100644
index 00000000..d0b38397
--- /dev/null
+++ b/src/views/_sila/BMC/Configuration/ConfigurationControl.vue
@@ -0,0 +1,74 @@
+<template>
+ <page-section :section-title="$t('BMC.ControlTitle')">
+ <popover
+ id="popover-reactive-1"
+ description="BMC.ReloadBmc"
+ popup="BMC.ReloadBmc_popup"
+ button="BMC.ReloadBmc"
+ :action="rebootBmc"
+ />
+ <!-- <settings-import-popup
+ id="popover-reactive-2"
+ description="BMC.ExportImport"
+ popup="BMC.ExportImport"
+ button="BMC.ExportImport_button"
+ /> -->
+ <b-link @click="redirectNetworkParametrs">{{ $t('BMC.Parametrs') }}</b-link>
+
+ <div class="bmc-control__table__cell">
+ <!-- <div>
+ <span class="semi-bold-12px">{{ $t('BMC.microcode') }}</span>
+ </div> -->
+ <b-button variant="unstyled" class="p-0" @click="redirectUpdateBmc">
+ <!-- <img src="@/assets/images/icon-reload-red.svg" /> -->
+ <b-link>{{ $t('BMC.ReloadMicrocodeBios') }}</b-link>
+ </b-button>
+ </div>
+ </page-section>
+</template>
+
+<script>
+import SettingsImportPopup from './SettingsImportPopup';
+import PageSection from '@/components/_sila/Global/PageSection';
+// import Popover from '@/components/_sila/Global/Popover';
+import BVToastMixin from '@/components/Mixins/BVToastMixin';
+
+export default {
+ components: {
+ PageSection,
+ // Popover,
+ SettingsImportPopup,
+ },
+ mixins: [BVToastMixin],
+ 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');
+ },
+ redirectUpdateBmc() {
+ this.$router.push('/operations/firmware');
+ },
+ rebootBmc() {
+ this.$store
+ .dispatch('controls/rebootBmc')
+ .then((message) => this.successToast(message))
+ .catch(({ message }) => this.errorToast(message));
+ },
+ },
+};
+</script>
diff --git a/src/views/_sila/BMC/Configuration/ConfigurationTable.vue b/src/views/_sila/BMC/Configuration/ConfigurationTable.vue
new file mode 100644
index 00000000..395e3d80
--- /dev/null
+++ b/src/views/_sila/BMC/Configuration/ConfigurationTable.vue
@@ -0,0 +1,96 @@
+<template>
+ <page-section>
+ <b-table
+ responsive="md"
+ show-empty
+ class="bootstrap-rounded-table"
+ :items="items"
+ :fields="fields"
+ :busy="isBusy"
+ :empty-text="$t('global.table.emptyMessage')"
+ >
+ </b-table>
+ </page-section>
+</template>
+
+<script>
+import BVToastMixin from '@/components/Mixins/BVToastMixin';
+import PageSection from '@/components/_sila/Global/PageSection';
+
+import TableRowExpandMixin, {
+ expandRowLabel,
+} from '@/components/Mixins/TableRowExpandMixin';
+
+export default {
+ components: { PageSection },
+ mixins: [BVToastMixin, TableRowExpandMixin],
+ data() {
+ return {
+ isBusy: true,
+ isAddersСolon: false,
+ fields: [
+ {
+ key: 'param',
+ label: 'Параметр',
+ formatter: this.dataFormatter,
+ thClass: 'semi-bold-12px__caps bootstrap-rounded-table__head_bg',
+ class: `bootstrap-rounded-table__column-first
+ bootstrap-rounded-table__column-first___bmc_conf`,
+ tdClass: 'regular-12px bootstrap-rounded-table__td',
+ },
+ {
+ key: 'value',
+ label: 'Значение',
+ formatter: this.dataFormatter,
+ thClass: 'semi-bold-12px__caps bootstrap-rounded-table__head_bg',
+ class: 'bootstrap-rounded-table__column-last',
+ tdClass: 'regular-12px bootstrap-rounded-table__td',
+ },
+ ],
+ expandRowLabel: expandRowLabel,
+ items: null,
+ };
+ },
+ computed: {
+ bmc() {
+ return this.$store.getters['bmc/bmc'];
+ },
+ },
+ watch: {
+ bmc() {
+ this.items = [
+ {
+ param: 'Время сервера',
+ value: this.bmc.dateTime,
+ },
+ {
+ param: 'uuid',
+ value: this.bmc.uuid,
+ },
+ {
+ param: 'Версия прошивки',
+ value: this.bmc.firmwareVersion,
+ },
+ {
+ param: 'Модель',
+ value: this.bmc.model,
+ },
+ {
+ param: 'Описание',
+ value: this.bmc.description,
+ },
+ {
+ param: 'Максимальное количество сессий',
+ value: this.bmc.graphicalConsoleMaxSessions,
+ },
+ ];
+ },
+ },
+ created() {
+ this.$store.dispatch('bmc/getBmcInfo').finally(() => {
+ this.$root.$emit('hardware-status-bmc-manager-complete');
+ this.isBusy = false;
+ });
+ },
+};
+</script>
diff --git a/src/views/_sila/BMC/Configuration/SettingsImportPopup.vue b/src/views/_sila/BMC/Configuration/SettingsImportPopup.vue
new file mode 100644
index 00000000..d0524e27
--- /dev/null
+++ b/src/views/_sila/BMC/Configuration/SettingsImportPopup.vue
@@ -0,0 +1,291 @@
+<template>
+ <div id="my-container">
+ <span
+ :id="id"
+ ref="button"
+ class="regular-12px underline"
+ variant="primary"
+ >
+ {{ $t(description) }}
+ </span>
+ <!-- Our popover title and content render container -->
+ <b-popover
+ id="export-popup"
+ ref="popover"
+ :target="id"
+ triggers="click"
+ :show.sync="popoverShow"
+ placement="auto"
+ container="my-container"
+ @show="onShow"
+ @shown="onShown"
+ @hidden="onHidden"
+ >
+ <template #title>
+ <div class="popup-title">
+ <span class="semi-bold-20px">{{ $t(popup) }}</span>
+ <b-button class="popup-title__button_close" @click="onClose">
+ <!-- <img src="@/assets/images/popups/x-icon.svg" /> -->
+ </b-button>
+ </div>
+ </template>
+ <div class="popup-switch">
+ <span
+ class="medium-16px popup-item"
+ :class="{ 'switch-active': isExport }"
+ @click="switchExport"
+ >{{ $t('global.action.export') }}</span
+ >
+ <span
+ class="medium-16px popup-item"
+ :class="{ 'switch-active': !isExport }"
+ @click="switchImport"
+ >{{ $t('global.action.import') }}</span
+ >
+ <div class="slider" />
+ </div>
+ <div v-if="isExport" class="popup-body">
+ <div class="ip-container">
+ <span class="regular-16px"
+ >Оставить IP адрес из настроек сервера</span
+ >
+ <b-form-checkbox switch> </b-form-checkbox>
+ </div>
+ <b-button class="popover-button" variant="primary" @click="onClose">
+ {{ $t(button) }}
+ </b-button>
+ </div>
+ <div v-else class="settings-import_container">
+ <b-form-file
+ id="settings-import__file-input"
+ placeholder="Нажмите на область или перетащите в нее файл с настройками"
+ ></b-form-file>
+ </div>
+ </b-popover>
+ </div>
+</template>
+
+<script>
+export default {
+ props: {
+ description: {
+ type: String,
+ default: '',
+ },
+ id: {
+ type: String,
+ default: '',
+ },
+ button: {
+ type: String,
+ default: 'global.action.reload',
+ },
+ popup: {
+ type: String,
+ default: '',
+ },
+ },
+ data() {
+ return {
+ input1: '',
+ input1state: null,
+ input1Return: '',
+ popoverShow: false,
+ isExport: true,
+ };
+ },
+ watch: {
+ input1(val) {
+ if (val) {
+ this.input1state = true;
+ }
+ },
+ },
+ methods: {
+ onClose() {
+ this.popoverShow = false;
+ },
+ onOk() {
+ if (!this.input1) {
+ this.input1state = false;
+ }
+ if (this.input1) {
+ this.onClose();
+ // Return our popover form results
+ this.input1Return = this.input1;
+ }
+ },
+ onShow() {
+ this.$root.$emit('bv::hide::popover');
+ // This is called just before the popover is shown
+ // Reset our popover form variables
+ this.input1 = '';
+ this.input1state = null;
+ this.input1Return = '';
+ },
+ onShown() {
+ // Called just after the popover has been shown
+ // Transfer focus to the first input
+ this.focusRef(this.$refs.input1);
+ },
+ onHidden() {
+ // Called just after the popover has finished hiding
+ // Bring focus back to the button
+ this.focusRef(this.$refs.button);
+ },
+ focusRef(ref) {
+ // Some references may be a component, functional component, or plain element
+ // This handles that check before focusing, assuming a `focus()` method exists
+ // We do this in a double `$nextTick()` to ensure components have
+ // updated & popover positioned first
+ this.$nextTick(() => {
+ this.$nextTick(() => {
+ (ref.$el || ref).focus();
+ });
+ });
+ },
+ switchExport() {
+ this.isExport = true;
+ },
+ switchImport() {
+ this.isExport = false;
+ },
+ },
+};
+</script>
+<style lang="scss">
+.custom-file {
+ width: 432px;
+ height: 108px;
+}
+
+#settings-import__file-input ~ .custom-file-label {
+ background-color: transparent;
+ border: 1px dashed rgba(12, 28, 41, 0.6);
+ box-sizing: border-box;
+ border-radius: 8px;
+ width: 432px;
+ height: 108px;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ text-align: center;
+ white-space: normal;
+ padding: 0 65px;
+}
+
+#settings-import__file-input ~ .custom-file-label::after {
+ display: none;
+}
+</style>
+<style lang="scss" scoped>
+#export-popup {
+ flex-direction: column;
+ align-items: flex-start;
+ background: #ffffff;
+ box-shadow: 0px -4px 12px rgb(0 0 0 / 5%);
+ border-radius: 16px !important;
+ border-radius: 4px;
+ max-width: 480px;
+ width: 480px;
+ height: auto;
+}
+
+.form-group {
+ margin: 0;
+}
+
+.popup-title {
+ display: flex;
+ align-items: baseline;
+ width: 465px;
+}
+
+.popup-title__button_close {
+ margin: 0 28px 0 auto;
+ background: none;
+ border: none;
+ &:active {
+ // background-color: $faint-secondary-primary-5-hover !important;
+ box-shadow: none !important;
+ border-radius: 8px;
+ }
+ &:focus-visible {
+ border: none !important;
+ border-radius: 8px;
+ }
+ &:focus {
+ box-shadow: none;
+ border-radius: 8px;
+ }
+}
+
+.popup-body {
+ display: flex;
+ flex-direction: column;
+ align-content: center;
+ justify-content: center;
+}
+
+.medium-16px {
+ display: inline-block;
+ height: 45px;
+ margin: 10px;
+ cursor: pointer;
+}
+
+.popup-switch {
+ position: relative;
+ display: flex;
+ flex-flow: row nowrap;
+ border-bottom: 1px solid #f3f4f5;
+}
+
+.switch-active {
+ // color: $red-brand-primary;
+ transition: ease-in 0.15s;
+}
+
+.slider {
+ position: absolute;
+ width: 130px;
+ height: 0px;
+ // border-bottom: 4px solid $red-brand-primary;
+ transition: ease-in 0.2s;
+ bottom: 14px;
+ left: 10px;
+}
+
+.popup-item:nth-child(1).switch-active ~ .slider {
+ left: 10px;
+}
+
+.popup-item:nth-child(2).switch-active ~ .slider {
+ left: 160px;
+}
+
+.ip-container {
+ display: flex;
+ width: 461px;
+ height: 75px;
+ padding: 30px 15px 25px 15px;
+}
+
+.popover-button {
+ width: 432px;
+ height: 52px;
+ margin: 0 auto 10px;
+}
+
+.settings-import_container {
+ width: 478px;
+ height: 160px;
+ background-color: $surface-secondary;
+ margin: -15px -15px -8px -12px;
+ border-radius: 0 0 16px 16px;
+
+ display: flex;
+ align-items: center;
+ justify-content: center;
+}
+</style>
diff --git a/src/views/_sila/BMC/Configuration/index.js b/src/views/_sila/BMC/Configuration/index.js
new file mode 100644
index 00000000..a5ed7e7e
--- /dev/null
+++ b/src/views/_sila/BMC/Configuration/index.js
@@ -0,0 +1,2 @@
+import Configuration from './Configuration.vue';
+export default Configuration;