diff options
Diffstat (limited to 'src')
38 files changed, 1283 insertions, 1203 deletions
diff --git a/src/assets/images/fans-page/notWorking.svg b/src/assets/images/status/off.svg index d84bedbc..d84bedbc 100644 --- a/src/assets/images/fans-page/notWorking.svg +++ b/src/assets/images/status/off.svg diff --git a/src/assets/images/fans-page/working.svg b/src/assets/images/status/on.svg index e97abf4a..e97abf4a 100644 --- a/src/assets/images/fans-page/working.svg +++ b/src/assets/images/status/on.svg diff --git a/src/assets/styles/bmc/custom/_buttons.scss b/src/assets/styles/bmc/custom/_buttons.scss index 04c612ec..d9c929db 100644 --- a/src/assets/styles/bmc/custom/_buttons.scss +++ b/src/assets/styles/bmc/custom/_buttons.scss @@ -13,6 +13,11 @@ } } +.btn-md { + width: 220px; + height: 36px; +} + .btn-primary { background-color: $red-brand-primary; border-radius: 8px; @@ -126,7 +131,6 @@ } .btn-link { - // font-weight: $headings-font-weight; color: $text-primary; text-decoration: none !important; &:hover { @@ -136,11 +140,6 @@ &:active { background-color: gray("300"); } - &:focus { - // box-shadow: inset 0 0 0 2px theme-color("primary"); - // color: theme-color("primary"); - // outline: none; - } &:disabled { box-shadow: $btn-focus-box-shadow; } @@ -180,8 +179,6 @@ .collapse-button { height: 56px; width: 100%; - padding: 0 0 0 2rem; - margin: 0; display: flex; flex-flow: row nowrap; justify-content: flex-start; @@ -193,4 +190,9 @@ &:hover { color: $text-primary; } +} + +.table-toolbar-button { + width: 220px; + height: 36px; }
\ No newline at end of file diff --git a/src/assets/styles/bmc/custom/_forms.scss b/src/assets/styles/bmc/custom/_forms.scss index 51dc0ed6..8cb8e242 100644 --- a/src/assets/styles/bmc/custom/_forms.scss +++ b/src/assets/styles/bmc/custom/_forms.scss @@ -209,6 +209,48 @@ color: $red-brand-primary; } +.cb label{ + padding-top: 4px; +} .system-control__radio label { padding-top: 4px; -}
\ No newline at end of file +} + +//radio buttons global style + .custom-radio ::before { + border: 1px solid $red-brand-primary; + background-color: #fff; + border-radius: 100%; +} + +.custom-radio +.custom-control-input:checked +~ .custom-control-label::before { + border: 2px solid $red-brand-primary; + background-color: $red-brand-primary; + box-shadow: 0px 0px 0px 2.5px $white inset; + border-radius: 100%; +} + + .custom-radio + .custom-control-input:hover + ~ .custom-control-label::before { + background-color: $red-brand-primary-hover !important; + box-shadow: 0px 0px 0px 2.5px $white inset; + border-color: $red-brand-primary-hover; +} + +.custom-radio +.custom-control-input:checked +~ .custom-control-label::after { + background-image: none !important; + border-radius: 100%; +} + +.custom-radio +.custom-control-input:active +~ .custom-control-label::before { + background-color: $red-brand-primary-active !important; + box-shadow: 0px 0px 0px 2.5px $white inset; + border-color: $red-brand-primary-active; +} diff --git a/src/assets/styles/bmc/custom/_pagination.scss b/src/assets/styles/bmc/custom/_pagination.scss index d38ce5d2..bce593ef 100644 --- a/src/assets/styles/bmc/custom/_pagination.scss +++ b/src/assets/styles/bmc/custom/_pagination.scss @@ -15,10 +15,20 @@ @include media-breakpoint-up(sm) { justify-content: flex-end; } + + .page-link { + border: transparent; + &:hover { + background-color: transparent; + } + &:focus { + box-shadow: none; + } + } .page-item.active button { color: theme-color("dark"); background-color: color("white"); - border-color: $border-color; + border-color: transparent; box-shadow: inset 0px -3px theme-color("primary"); } }
\ No newline at end of file diff --git a/src/assets/styles/bmc/custom/_tables.scss b/src/assets/styles/bmc/custom/_tables.scss index d76d4982..bb56ba83 100644 --- a/src/assets/styles/bmc/custom/_tables.scss +++ b/src/assets/styles/bmc/custom/_tables.scss @@ -86,7 +86,6 @@ } } .b-table-sort-icon-left { - background-position: left calc(1.5rem / 2) center !important; padding-left: calc(1.2rem + 0.65em) !important; &:focus { outline: none; @@ -171,12 +170,22 @@ // } } +.indicators-Critical { + color: $indicators-errors !important; +} + +.indicators-Warning { + color: $indicators-warning !important; +} + +.indicators-OK { + color: $indicators-succes !important; +} + .bootstrap-table__stripes tr:nth-of-type(even) { background-color: rgb(255 255 255); } - -////// не работает .bootstrap-table__stripes_odd tr:nth-of-type(odd) { background-color: rgb(255 255 255); } @@ -308,4 +317,36 @@ -ms-border-radius: 0; -o-border-radius: 0; -khtml-border-radius: 0; +} + +// logs tables styles +#logs-table { + margin: 0 !important; +} + +#logs-table-wrapper div { + overflow-y: overlay; + &::-webkit-scrollbar { + position: absolute; + width: 10px; + } + &::-webkit-scrollbar-thumb { + border: 4px solid transparent; + border-top: 52px solid transparent; + background: $faint-secondary-primary-20; + border-radius: 16px; + background-clip: content-box; + } +} + +.logs-table__th { + background-color: #f8f8f8 !important; + border-bottom: 1px solid $faint-secondary-primary-20 !important; + border-top: 1px solid $faint-secondary-primary-20 !important; + color: $text-primary !important; +} + +.logs-table__td { + border-bottom: 1px solid $faint-secondary-primary-10 !important; + height: 64px; }
\ No newline at end of file diff --git a/src/components/AppHeader/AppHeader.vue b/src/components/AppHeader/AppHeader.vue index 70631fbf..939ec5af 100644 --- a/src/components/AppHeader/AppHeader.vue +++ b/src/components/AppHeader/AppHeader.vue @@ -65,19 +65,6 @@ </b-nav-item> <b-nav-item - to="/profile-settings" - data-test-id="appHeader-container-health" - class="nav-top-button" - :class="{ - 'active-route-top-nav': ''.includes( - $route.path.split('profile-settings')[1] - ), - }" - > - {{ $t('appHeader.settings') }} - </b-nav-item> - - <b-nav-item to="/information-and-faq" data-test-id="appHeader-container-power" class="nav-top-button" @@ -125,7 +112,7 @@ <status-icon :status="serverStatusIcon" /> {{ $t('appHeader.power') }} </b-nav-item> - <div class="nav-item"> + <div class="nav-item header-clock__icon"> <b-button id="app-header-refresh" variant="link" @@ -193,7 +180,7 @@ import IconClose from '@carbon/icons-vue/es/close/20'; import IconMenu from '@carbon/icons-vue/es/menu/20'; import IconAvatar from '@carbon/icons-vue/es/user--avatar/20'; import IconRenew from '@carbon/icons-vue/es/renew/20'; -import StatusIcon from '@/components/Global/StatusIcon'; +// import StatusIcon from '@/components/Global/StatusIcon'; export default { name: 'AppHeader', components: { @@ -201,7 +188,7 @@ export default { IconMenu, IconAvatar, IconRenew, - StatusIcon, + // StatusIcon, }, mixins: [BVToastMixin], props: { diff --git a/src/components/AppNavigation/AppNavigationMixin.js b/src/components/AppNavigation/AppNavigationMixin.js index c58553a2..241a8f3b 100644 --- a/src/components/AppNavigation/AppNavigationMixin.js +++ b/src/components/AppNavigation/AppNavigationMixin.js @@ -32,6 +32,16 @@ export const AppNavigationMixin = { label: this.$t('appNavigation.serverParam'), route: '/server-parametrs', }, + { + id: 'date-time', + label: this.$t('appNavigation.dateTime'), + route: '/settings/date-time', + }, + { + id: 'server-power-operations', + label: this.$t('appNavigation.serverPowerOperations'), + route: '/operations/server-power-operations', + }, ], }, { @@ -269,7 +279,7 @@ export const AppNavigationMixin = { }, { id: 'key-clear', - label: this.$t('appNavigation.keyClear'), + label: this.$t('appPageTitle.keyClear'), route: '/operations/key-clear', }, { @@ -299,11 +309,6 @@ export const AppNavigationMixin = { label: this.$t('appNavigation.settings'), children: [ { - id: 'date-time', - label: this.$t('appNavigation.dateTime'), - route: '/settings/date-time', - }, - { id: 'network', label: this.$t('appNavigation.network'), route: '/settings/network', diff --git a/src/components/Global/LoadingBar.vue b/src/components/Global/LoadingBar.vue index 0e9551b5..b65f97a7 100644 --- a/src/components/Global/LoadingBar.vue +++ b/src/components/Global/LoadingBar.vue @@ -74,12 +74,13 @@ export default { <style lang="scss" scoped> .progress { position: absolute; - left: 0; right: 0; bottom: -0.4rem; opacity: 1; transition: opacity $duration--moderate-01 $standard-easing--productive; height: 0.4rem; + width: calc(100vw - 320px); + border-radius: 0px; &.fade-enter, // Remove this vue2 based only class when switching to vue3 &.fade-enter-from, // This is vue3 based only class modified from 'fade-enter' @@ -89,5 +90,6 @@ export default { } .progress-bar { background-color: $loading-color; + border-radius: 0px; } </style> diff --git a/src/components/Global/Popover.vue b/src/components/Global/Popover.vue index f0b4063f..95e9fb24 100644 --- a/src/components/Global/Popover.vue +++ b/src/components/Global/Popover.vue @@ -1,5 +1,5 @@ <template> - <div id="my-container"> + <div id="popover-container"> <div v-if="isclear" :id="id" ref="button" variant="primary" class="pointer"> <img src="@/assets/images/icon-clear-red.svg" /> <span class="regular-12px red-font">{{ $t(description) }}</span> @@ -42,7 +42,7 @@ triggers="click" :show.sync="popoverShow" placement="auto" - container="my-container" + container="popover-container" @show="onShow" @shown="onShown" @hidden="onHidden" @@ -58,28 +58,34 @@ <div class="popup-body"> <div> - <label class="light-12px" for="username">{{ 'HEX для ввода' }}</label> - <img - id="popover-target-1" - src="@/assets/images/popups/red-sign.svg" - /> + <label class="light-12px" style="margin-right: 5px">{{ + 'HEX для ввода' + }}</label> + <img id="popover-tooltip" src="@/assets/images/popups/red-sign.svg" /> <popover-info - id="popover-target-1" + id="popover-tooltip" description="Введите HEX в поле для подтверждения действия" /> - <div class="hex-form"> + <div class="hex-label"> <span class="medium-12px"> 9c1735b3f819142393146a5d03314f0a </span> </div> </div> <div class="popup-body__input-container"> - <span class="regular-12px tretiatry">Поле для ввода</span> + <span style="margin-left: 12px" class="regular-12px tretiatry" + >Поле для ввода</span + > <b-form-input id="popover-input-1" - v-model="input1" + v-model="input" class="medium-12px" ></b-form-input> </div> - <b-button class="popover-button" variant="primary" @click="onClose"> + <b-button + class="popup-button" + variant="primary" + :disabled="!input" + @click="onOk" + > {{ $t(button) }} </b-button> </div> @@ -89,27 +95,32 @@ <script> import PopoverInfo from './PopoverInfo'; - +import BVToastMixin from '@/components/Mixins/BVToastMixin'; export default { components: { PopoverInfo, }, + mixins: [BVToastMixin], props: { + id: { + type: String, + default: '', + }, description: { type: String, default: '', }, - id: { + popup: { type: String, default: '', }, - button: { + placement: { type: String, - default: 'global.action.reload', + default: 'auto', }, - popup: { + button: { type: String, - default: '', + default: 'global.action.reload', }, isMicrocode: { type: Boolean, @@ -123,43 +134,39 @@ export default { type: Boolean, default: false, }, + action: { + type: Function, + default: null, + }, }, data() { return { - input1: '', - input1state: null, - input1Return: '', + input: '', popoverShow: false, }; }, - watch: { - input1(val) { - if (val) { - this.input1state = true; - } - }, - }, methods: { onClose() { this.popoverShow = false; }, onOk() { - if (!this.input1) { - this.input1state = false; - } - if (this.input1) { + if (this.input === '9c1735b3f819142393146a5d03314f0a') { + this.action(); this.onClose(); - // Return our popover form results - this.input1Return = this.input1; + } else { + this.warningToast( + this.$t('Неправильный HEX в поле для подтверждения действия'), + { + title: this.$t('Неправильный НЕХ'), + } + ); } }, 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 = ''; + this.$root.$emit('bv::hide::popover'); + this.input = ''; }, onShown() { // Called just after the popover has been shown @@ -220,6 +227,7 @@ export default { flex-direction: column; align-content: center; justify-content: center; + align-items: center; } .form-control { @@ -229,7 +237,7 @@ export default { padding-top: 30px; } -.hex-form { +.hex-label { height: 32px; width: 341px; display: flex; @@ -241,10 +249,10 @@ export default { margin: 0 auto; } -.popover-button { +.popup-button { width: 341px; height: 40px; - margin: 0 auto 10px; + margin-bottom: 10px; } .popup-body__input-container { diff --git a/src/components/Global/SilaComponents/InventoryControlSystem.vue b/src/components/Global/SilaComponents/InventoryControlSystem.vue index de5432e1..18f1d9ff 100644 --- a/src/components/Global/SilaComponents/InventoryControlSystem.vue +++ b/src/components/Global/SilaComponents/InventoryControlSystem.vue @@ -91,10 +91,10 @@ v-model="timeOption" class="system-control__radio regular-12px" > - <b-form-radio value="NTP"> + <b-form-radio variant="radio" value="NTP"> {{ $t('SystemDescription.GetNtpFromServer') }} </b-form-radio> - <b-form-radio value="serverDate"> + <b-form-radio variant="radio" value="serverDate"> {{ $t('SystemDescription.UseServerDatettime') }} </b-form-radio> </b-form-radio-group> @@ -192,42 +192,4 @@ label { .system-control__table__cell__4 { margin-top: 26px; } - -.custom-radio ::before { - border: 1px solid $red-brand-primary; - background-color: #fff; - border-radius: 100%; -} - -.system-control-section::v-deep - .custom-control-input:checked - ~ .custom-control-label::before { - border: 2px solid $red-brand-primary; - background-color: $red-brand-primary; - box-shadow: 0px 0px 0px 2.5px $white inset; - border-radius: 100%; -} - -.system-control-section::v-deep - .custom-control-input:hover - ~ .custom-control-label::before { - background-color: $red-brand-primary-hover !important; - box-shadow: 0px 0px 0px 2.5px $white inset; - border-color: $red-brand-primary-hover; -} - -.system-control-section::v-deep - .custom-control-input:checked - ~ .custom-control-label::after { - background-image: none !important; - border-radius: 100%; -} - -.system-control-section::v-deep - .custom-control-input:active - ~ .custom-control-label::before { - background-color: $red-brand-primary-active !important; - box-shadow: 0px 0px 0px 2.5px $white inset; - border-color: $red-brand-primary-active; -} </style> diff --git a/src/components/Global/SilaComponents/NtpPopover.vue b/src/components/Global/SilaComponents/NtpPopover.vue index c94c1cc8..6f181002 100644 --- a/src/components/Global/SilaComponents/NtpPopover.vue +++ b/src/components/Global/SilaComponents/NtpPopover.vue @@ -31,7 +31,7 @@ class="medium-12px" ></b-form-input> </div> - <b-button class="popover-button" variant="primary" @click="onClose"> + <b-button class="popup-button" variant="primary" @click="onClose"> {{ $t('global.action.save') }} </b-button> </div> @@ -115,7 +115,7 @@ export default { padding-top: 30px; } -.popover-button { +.popup-button { width: 341px; height: 40px; margin: 0 auto 10px; diff --git a/src/components/Global/SilaComponents/PopoverWithSlot.vue b/src/components/Global/SilaComponents/PopoverWithSlot.vue new file mode 100644 index 00000000..a9ec649b --- /dev/null +++ b/src/components/Global/SilaComponents/PopoverWithSlot.vue @@ -0,0 +1,225 @@ +<template> + <div id="popover-container"> + <slot /> + <b-popover + ref="popover" + :target="id" + triggers="click" + :show.sync="popoverShow" + :placement="placement" + container="popover-container" + @show="onShow" + @shown="onShown" + @hidden="onHidden" + > + <template #title> + <div class="popup-title"> + <span class="bold-16px__caps">{{ popupLabel }}</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-body"> + <div> + <label class="light-12px" style="margin-right: 5px">{{ + 'HEX для ввода' + }}</label> + <img id="popover-tooltip" src="@/assets/images/popups/red-sign.svg" /> + <popover-info + id="popover-tooltip" + description="Введите HEX в поле для подтверждения действия" + /> + <div class="hex-label"> + <span class="medium-12px"> 9c1735b3f819142393146a5d03314f0a </span> + </div> + </div> + <div class="popup-body__input-container"> + <span style="margin-left: 12px" class="regular-12px tretiatry" + >Поле для ввода</span + > + <b-form-input + id="popover-input-1" + ref="input" + v-model="input" + class="medium-12px" + ></b-form-input> + </div> + <b-button + class="popup-button" + variant="primary" + :disabled="!input" + @click="onOk" + > + {{ buttonLabel }} + </b-button> + </div> + </b-popover> + </div> +</template> + +<script> +import PopoverInfo from '../PopoverInfo'; +import BVToastMixin from '@/components/Mixins/BVToastMixin'; +export default { + components: { + PopoverInfo, + }, + mixins: [BVToastMixin], + props: { + id: { + type: String, + default: '', + }, + placement: { + type: String, + default: 'auto', + }, + popupLabel: { + type: String, + default: '', + }, + buttonLabel: { + type: String, + default: 'global.action.reload', + }, + action: { + type: Function, + default: null, + }, + }, + data() { + return { + input: '', + popoverShow: false, + }; + }, + methods: { + onClose() { + this.popoverShow = false; + }, + onOk() { + if (this.input === '9c1735b3f819142393146a5d03314f0a') { + this.action(); + this.onClose(); + } else { + this.warningToast( + this.$t('Неправильный HEX в поле для подтверждения действия'), + { + title: this.$t('Неправильный НЕХ'), + } + ); + } + }, + onShow() { + // This is called just before the popover is shown + // Reset our popover form variables + this.$root.$emit('bv::hide::popover'); + this.input = ''; + }, + onShown() { + // Called just after the popover has been shown + // Transfer focus to the first input + this.focusRef(this.$refs.input); + }, + 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(() => { + console.log(ref); + (ref.$el || ref).focus(); + }); + }); + }, + }, +}; +</script> +<style lang="scss" scoped> +.form-group { + margin: 0; +} + +.popup-title { + display: flex; + flex-flow: row nowrap; + align-items: baseline; +} + +.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; + align-items: center; +} + +.form-control { + width: 341px; + height: 52px; + margin: -25px auto; + padding-top: 30px; +} + +.hex-label { + height: 32px; + width: 341px; + display: flex; + justify-content: center; + align-items: center; + background: $faint-secondary-primary-5; + border-radius: 8px; + border: none; + margin: 0 auto; +} + +.popup-button { + width: 341px; + height: 40px; + margin-bottom: 10px; +} + +.popup-body__input-container { + height: 52px; + margin: 24px auto 16px auto; +} + +.popover-info { + background-color: $on-surface-primary; + // border: 1px solid $text-primary; + // box-shadow: 0px 6px 16px -12px rgba(23, 40, 77, 0.06); + border-radius: 8px; + width: 168px; + height: 76px; + &.arrow { + display: block; + } +} +</style> diff --git a/src/components/Global/TableToolbar.vue b/src/components/Global/TableToolbar.vue index 3ac8e2ce..eabe0c98 100644 --- a/src/components/Global/TableToolbar.vue +++ b/src/components/Global/TableToolbar.vue @@ -67,12 +67,13 @@ export default { }, }; </script> - <style lang="scss" scoped> $toolbar-height: 64px; .toolbar-container { - width: 100%; + width: calc(100vw - 320px); + height: $toolbar-height; + border-radius: 0px; position: fixed; bottom: 0; right: 0; @@ -80,18 +81,14 @@ $toolbar-height: 64px; } .toolbar-content { - height: $toolbar-height; background-color: $white; color: $white; - position: absolute; - left: 0; - right: 0; - top: -$toolbar-height; display: flex; flex-direction: row; align-items: center; justify-content: space-between; box-shadow: 0px -4px 12px rgba(0, 0, 0, 0.06); + border-radius: 0px; } .toolbar-selected { diff --git a/src/components/Global/TableToolbarExport.vue b/src/components/Global/TableToolbarExport.vue index 69646ea6..152a4f68 100644 --- a/src/components/Global/TableToolbarExport.vue +++ b/src/components/Global/TableToolbarExport.vue @@ -1,16 +1,15 @@ <template> - <b-button - class="d-flex align-items-center" - variant="primary" - :download="download" - :href="href" - > - {{ $t('global.action.export') }} + <b-button size="md" variant="primary" :download="download" :href="href"> + <icon-export /> {{ $t('global.action.export') }} </b-button> </template> <script> +import IconExport from '@carbon/icons-vue/es/document--export/20'; export default { + components: { + IconExport, + }, props: { data: { type: Array, diff --git a/src/components/SubHeader/SubHeader.vue b/src/components/SubHeader/SubHeader.vue index 4ab6b094..9d8a1b88 100644 --- a/src/components/SubHeader/SubHeader.vue +++ b/src/components/SubHeader/SubHeader.vue @@ -114,20 +114,18 @@ export default { .navbar-text, .nav-link, .btn-link { - border-radius: 4px; + border-radius: 14% 14% 0px 0px; padding: 0.68rem 1rem !important; &:hover { background-color: $white; color: #1a3e5b !important; - border-radius: 4px; - border-bottom: 5px; + border-radius: 14% 14% 0px 0px; } &:active { background-color: $white; color: #1a3e5b !important; - border-bottom: 5px; - border-radius: 4px; + border-radius: 14% 14% 0px 0px; } } @@ -169,7 +167,7 @@ export default { #sub-header .nav-item.active-route-top > a { background-color: $white; color: #1a3e5b; - border-radius: 4px; + border-radius: 14% 14% 0px 0px; } .navbar-dark .navbar-nav .nav-link { diff --git a/src/locales/ru-RU.json b/src/locales/ru-RU.json index e6753ea6..407292fc 100644 --- a/src/locales/ru-RU.json +++ b/src/locales/ru-RU.json @@ -15,7 +15,7 @@ "enable": "Включить", "export": "Экспортировать", "import": "Импортировать", - "exportAll": "Экспортировать всё", + "exportAll": "Экспортировать все", "filter": "Фильтровать", "refresh": "Обновить", "replace": "Переместить", @@ -82,6 +82,8 @@ "notAvailable": "Недоступно", "off": "Выкл.", "on": "Вкл.", + "off_full": "Выключен", + "on_full": "Включен", "success": "Успешно", "warning": "Предупреждение", "informational": "Информация", @@ -149,7 +151,7 @@ "powerConsumption": "Показатели потребляемой мощности" }, "appNavigation": { - "systemInformaion": "Краткое описание системы", + "systemInformaion": "Система", "overviewInfo": "Основная информация", "networkParametrs": "Параметры сети", "eventLogs": "Журнал событий", @@ -219,7 +221,7 @@ "changePassword": "Изменить пароль", "power": "Питание", "sessions": "Сессии", - "dateTime": "Дата и время", + "dateTime": "Настройка даты и времени", "dumps": "Дампы", "eventLogs": "Журнал событий", "factoryReset": "Сброс до заводских настроек", @@ -239,7 +241,7 @@ "policies": "Политики безопасности", "sensors": "Датчики", "serialOverLan": "Консоль Serial over LAN (SOL)", - "serverPowerOperations": "Управление питанием сервера", + "serverPowerOperations": "Управление питанием и ОС сервера", "certificates": "Сертификаты", "keyClear": "Очистка ключа", "virtualMedia": "Виртуальные носители" @@ -945,6 +947,7 @@ "orderlyReboot": "По порядку – ОС выключается, затем сервер перезапускается", "orderlyShutdown": "По порядку - ОС выключается, затем сервер выключается", "powerOn": "Включить", + "powerOnServer": "Включить сервер", "reboot": "Перезапустить", "rebootServer": "Перезапустить сервер", "shutDown": "Выключить", diff --git a/src/main.js b/src/main.js index 79bab44f..3d357157 100644 --- a/src/main.js +++ b/src/main.js @@ -85,6 +85,23 @@ Vue.filter('formatTime', function (value) { } }); +Vue.filter('formatTimeShort', function (value) { + const isUtcDisplay = store.getters['global/isUtcDisplay']; + + if (value instanceof Date) { + if (isUtcDisplay) { + let timeOptions = { + timeZone: 'UTC', + hourCycle: 'h23', + }; + return `${value.toLocaleTimeString('default', timeOptions)}`; + } + const timezone = Intl.DateTimeFormat().resolvedOptions().timeZone; + // const shortTz = Vue.filter('shortTimeZone')(value); + const pattern = `HH:mm:ss`; + return format(value, pattern, { timezone }).replace('GMT', 'UTC'); + } +}); // Plugins Vue.use(AlertPlugin); Vue.use(BadgePlugin); diff --git a/src/router/routes.js b/src/router/routes.js index d6a2d694..439815ae 100644 --- a/src/router/routes.js +++ b/src/router/routes.js @@ -149,7 +149,7 @@ const routes = [ }, { path: '/network-parametrs', - name: 'network', + name: 'network-parametrs', component: SystemNetwork, meta: { title: i18n.t('appNavigation.systemInformaion'), diff --git a/src/views/BMC/Configuration/BMCConfigurationControl.vue b/src/views/BMC/Configuration/BMCConfigurationControl.vue index 0eb8bfc9..2cc259a7 100644 --- a/src/views/BMC/Configuration/BMCConfigurationControl.vue +++ b/src/views/BMC/Configuration/BMCConfigurationControl.vue @@ -10,6 +10,7 @@ description="BMC.ReloadBmc" popup="BMC.ReloadBmc_popup" button="BMC.ReloadBmc" + :action="rebootBmc" /> <settings-import-popup id="popover-reactive-2" @@ -53,13 +54,14 @@ import SettingsImportPopup from './SettingsImportPopup'; import PageSection from '@/components/Global/PageSection'; import Popover from '@/components/Global/Popover'; - +import BVToastMixin from '@/components/Mixins/BVToastMixin'; export default { components: { PageSection, Popover, SettingsImportPopup, }, + mixins: [BVToastMixin], data() { return { timeOption: 'resetBios', @@ -80,6 +82,12 @@ export default { redirectNetworkParametrs() { this.$router.push('/network-parametrs'); }, + rebootBmc() { + this.$store + .dispatch('controls/rebootBmc') + .then((message) => this.successToast(message)) + .catch(({ message }) => this.errorToast(message)); + }, }, }; </script> diff --git a/src/views/BMC/Configuration/BMCConfigurationTable.vue b/src/views/BMC/Configuration/BMCConfigurationTable.vue index a550743e..51e428e3 100644 --- a/src/views/BMC/Configuration/BMCConfigurationTable.vue +++ b/src/views/BMC/Configuration/BMCConfigurationTable.vue @@ -4,27 +4,10 @@ responsive="md" show-empty class="bootstrap-rounded-table" - :items="systems" + :items="items" :fields="fields" :empty-text="$t('global.table.emptyMessage')" > - <template #cell(value)="data"> - <b-row v-if="data.index === 2"> - <b-col> - <span v-if="isAddersСolon"> - {{ '487566942332' }} - </span> - <span v-else> - {{ data.value }} - </span> - </b-col> - <b-col class="macAddresCol"> - <b-form-checkbox v-model="isAddersСolon"> </b-form-checkbox> - <span> {{ 'XXXX формат' }} </span> - </b-col> - </b-row> - <span v-else>{{ data.value }}</span> - </template> </b-table> </page-section> </template> @@ -64,17 +47,52 @@ export default { }, ], expandRowLabel: expandRowLabel, - systems: [ + items: null, + }; + }, + computed: { + bmc() { + return this.$store.getters['bmc/bmc']; + }, + }, + watch: { + bmc() { + this.items = [ { - param: 'Время BMC', - value: '14:20', + param: 'Время сервера', + value: this.bmc.dateTime, }, - { param: 'Версия прошивки', value: '1.214.248 beta' }, - { param: 'MAC - адреса', value: '48:75:66:94:23:32' }, - { param: 'IP - адреса', value: '192.168.48.1' }, - { param: 'Имя ВМС', value: 'ВМС-007' }, - ], - }; + { + 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'); + }); + 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/Fans/StaticInformation/FansStaticPage.vue b/src/views/Fans/StaticInformation/FansStaticPage.vue index 85b5191f..7e3a9849 100644 --- a/src/views/Fans/StaticInformation/FansStaticPage.vue +++ b/src/views/Fans/StaticInformation/FansStaticPage.vue @@ -16,19 +16,13 @@ > <template #cell(status)="{ value }"> <div v-if="value" class="fans-table-col-first__cell"> - <img - class="status__img" - src="@/assets/images/fans-page/working.svg" - /> + <img class="status__img" src="@/assets/images/status/on.svg" /> <span> {{ $t('global.status.inWork') }} </span> </div> <div v-else class="fans-table-col-first__cell"> - <img - class="status__img" - src="@/assets/images/fans-page/notWorking.svg" - /> + <img class="status__img" src="@/assets/images/status/off.svg" /> <span> {{ $t('global.status.outWorking') }} </span> diff --git a/src/views/HardwareStatus/Inventory/Inventory.vue b/src/views/HardwareStatus/Inventory/Inventory.vue index fcdbf8d2..1fbbe81f 100644 --- a/src/views/HardwareStatus/Inventory/Inventory.vue +++ b/src/views/HardwareStatus/Inventory/Inventory.vue @@ -1,50 +1,51 @@ <template> - <b-container fluid="xl"> + <b-container fluid="xxl pt-0 m-2"> <page-title /> + <div class="main-container"> + <!-- Service indicators --> + <service-indicator /> - <!-- Service indicators --> - <service-indicator /> + <!-- Quicklinks section --> + <page-section :section-title="$t('pageInventory.quicklinkTitle')"> + <b-row class="w-75"> + <b-col v-for="column in quicklinkColumns" :key="column.id" xl="4"> + <div v-for="item in column" :key="item.id"> + <b-link + :href="item.href" + :data-ref="item.dataRef" + @click.prevent="scrollToOffset" + > + <jump-link /> {{ item.linkText }} + </b-link> + </div> + </b-col> + </b-row> + </page-section> - <!-- Quicklinks section --> - <page-section :section-title="$t('pageInventory.quicklinkTitle')"> - <b-row class="w-75"> - <b-col v-for="column in quicklinkColumns" :key="column.id" xl="4"> - <div v-for="item in column" :key="item.id"> - <b-link - :href="item.href" - :data-ref="item.dataRef" - @click.prevent="scrollToOffset" - > - <jump-link /> {{ item.linkText }} - </b-link> - </div> - </b-col> - </b-row> - </page-section> + <!-- System table --> + <table-system ref="system" /> - <!-- System table --> - <table-system ref="system" /> + <!-- BMC manager table --> + <table-bmc-manager ref="bmc" /> - <!-- BMC manager table --> - <table-bmc-manager ref="bmc" /> + <!-- Chassis table --> + <table-chassis ref="chassis" /> - <!-- Chassis table --> - <table-chassis ref="chassis" /> + <!-- DIMM slot table --> + <table-dimm-slot ref="dimms" /> - <!-- DIMM slot table --> - <table-dimm-slot ref="dimms" /> + <!-- Fans table --> + <table-fans ref="fans" /> - <!-- Fans table --> - <table-fans ref="fans" /> + <!-- Power supplies table --> + <table-power-supplies ref="powerSupply" /> - <!-- Power supplies table --> - <table-power-supplies ref="powerSupply" /> + <!-- Processors table --> + <table-processors ref="processors" /> - <!-- Processors table --> - <table-processors ref="processors" /> - - <!-- Assembly table --> - <table-assembly ref="assembly" /> + <!-- Assembly table --> + <table-assembly ref="assembly" /> + </div> </b-container> </template> diff --git a/src/views/Logs/EventLogs/EventLogs.vue b/src/views/Logs/EventLogs/EventLogs.vue index 5b8ca110..10aa9469 100644 --- a/src/views/Logs/EventLogs/EventLogs.vue +++ b/src/views/Logs/EventLogs/EventLogs.vue @@ -1,241 +1,248 @@ <template> - <b-container fluid="xl"> + <b-container fluid="xxl pt-0 m-2"> <page-title /> - <b-row class="align-items-start"> - <b-col sm="8" xl="6" class="d-sm-flex align-items-end mb-4"> - <search - :placeholder="$t('pageEventLogs.table.searchLogs')" - data-test-id="eventLogs-input-searchLogs" - @change-search="onChangeSearchInput" - @clear-search="onClearSearchInput" - /> - <div class="ml-sm-4"> - <table-cell-count - :filtered-items-count="filteredRows" - :total-number-of-cells="allLogs.length" - ></table-cell-count> - </div> - </b-col> - <b-col sm="8" md="7" xl="6"> - <table-date-filter @change="onChangeDateTimeFilter" /> - </b-col> - </b-row> - <b-row> - <b-col class="text-right"> - <table-filter :filters="tableFilters" @filter-change="onFilterChange" /> - <b-button - variant="link" - :disabled="allLogs.length === 0" - @click="deleteAllLogs" - > - <icon-delete /> {{ $t('global.action.deleteAll') }} - </b-button> - <b-button - variant="primary" - :class="{ disabled: allLogs.length === 0 }" - :download="exportFileNameByDate()" - :href="href" - > - <icon-export /> {{ $t('global.action.exportAll') }} - </b-button> - </b-col> - </b-row> - <b-row> - <b-col> - <table-toolbar - ref="toolbar" - :selected-items-count="selectedRows.length" - :actions="batchActions" - @clear-selected="clearSelectedRows($refs.table)" - @batch-action="onBatchAction" - > - <template #toolbar-buttons> - <b-button variant="primary" @click="resolveLogs"> - {{ $t('pageEventLogs.resolve') }} - </b-button> - <b-button variant="primary" @click="unresolveLogs"> - {{ $t('pageEventLogs.unresolve') }} - </b-button> - <table-toolbar-export - :data="batchExportData" - :file-name="exportFileNameByDate()" - /> - </template> - </table-toolbar> - <b-table - id="table-event-logs" - ref="table" - responsive="md" - selectable - no-select-on-click - sort-icon-left - hover - no-sort-reset - sort-desc - show-empty - sort-by="id" - :fields="fields" - :items="filteredLogs" - :sort-compare="onSortCompare" - :empty-text="$t('global.table.emptyMessage')" - :empty-filtered-text="$t('global.table.emptySearchMessage')" - :per-page="perPage" - :current-page="currentPage" - :filter="searchFilter" - :busy="isBusy" - @filtered="onFiltered" - @row-selected="onRowSelected($event, filteredLogs.length)" - > - <!-- Checkbox column --> - <template #head(checkbox)> - <b-form-checkbox - v-model="tableHeaderCheckboxModel" - data-test-id="eventLogs-checkbox-selectAll" - :indeterminate="tableHeaderCheckboxIndeterminate" - @change="onChangeHeaderCheckbox($refs.table)" - > - <span class="sr-only">{{ $t('global.table.selectAll') }}</span> - </b-form-checkbox> - </template> - <template #cell(checkbox)="row"> - <b-form-checkbox - v-model="row.rowSelected" - :data-test-id="`eventLogs-checkbox-selectRow-${row.index}`" - @change="toggleSelectRow($refs.table, row.index)" - > - <span class="sr-only">{{ $t('global.table.selectItem') }}</span> - </b-form-checkbox> - </template> + <div class="main-container"> + <b-row class="align-items-start"> + <b-col sm="8" xl="6" class="d-sm-flex align-items-end mb-4"> + <search + :placeholder="$t('pageEventLogs.table.searchLogs')" + data-test-id="eventLogs-input-searchLogs" + @change-search="onChangeSearchInput" + @clear-search="onClearSearchInput" + /> + <div class="ml-sm-4"> + <table-cell-count + :filtered-items-count="filteredRows" + :total-number-of-cells="allLogs.length" + ></table-cell-count> + </div> + </b-col> + <b-col sm="8" md="7" xl="6"> + <table-date-filter @change="onChangeDateTimeFilter" /> + </b-col> + </b-row> + <b-row> + <b-col class="text-right"> + <table-filter + :filters="tableFilters" + @filter-change="onFilterChange" + /> + <b-button + variant="link" + :disabled="allLogs.length === 0" + @click="deleteAllLogs" + > + <icon-delete /> {{ $t('global.action.deleteAll') }} + </b-button> + <b-button + variant="primary" + :class="{ disabled: allLogs.length === 0 }" + :download="exportFileNameByDate()" + :href="href" + > + <icon-export /> {{ $t('global.action.exportAll') }} + </b-button> + </b-col> + </b-row> + <b-row> + <b-col> + <table-toolbar + ref="toolbar" + :selected-items-count="selectedRows.length" + :actions="batchActions" + @clear-selected="clearSelectedRows($refs.table)" + @batch-action="onBatchAction" + > + <template #toolbar-buttons> + <b-button variant="primary" @click="resolveLogs"> + {{ $t('pageEventLogs.resolve') }} + </b-button> + <b-button variant="primary" @click="unresolveLogs"> + {{ $t('pageEventLogs.unresolve') }} + </b-button> + <table-toolbar-export + :data="batchExportData" + :file-name="exportFileNameByDate()" + /> + </template> + </table-toolbar> + <b-table + id="table-event-logs" + ref="table" + responsive="md" + selectable + no-select-on-click + sort-icon-left + hover + no-sort-reset + sort-desc + show-empty + sort-by="id" + :fields="fields" + :items="filteredLogs" + :sort-compare="onSortCompare" + :empty-text="$t('global.table.emptyMessage')" + :empty-filtered-text="$t('global.table.emptySearchMessage')" + :per-page="perPage" + :current-page="currentPage" + :filter="searchFilter" + :busy="isBusy" + @filtered="onFiltered" + @row-selected="onRowSelected($event, filteredLogs.length)" + > + <!-- Checkbox column --> + <template #head(checkbox)> + <b-form-checkbox + v-model="tableHeaderCheckboxModel" + data-test-id="eventLogs-checkbox-selectAll" + :indeterminate="tableHeaderCheckboxIndeterminate" + @change="onChangeHeaderCheckbox($refs.table)" + > + <span class="sr-only">{{ $t('global.table.selectAll') }}</span> + </b-form-checkbox> + </template> + <template #cell(checkbox)="row"> + <b-form-checkbox + v-model="row.rowSelected" + :data-test-id="`eventLogs-checkbox-selectRow-${row.index}`" + @change="toggleSelectRow($refs.table, row.index)" + > + <span class="sr-only">{{ $t('global.table.selectItem') }}</span> + </b-form-checkbox> + </template> - <!-- Expand chevron icon --> - <template #cell(expandRow)="row"> - <b-button - variant="link" - :aria-label="expandRowLabel" - :title="expandRowLabel" - class="btn-icon-only" - @click="toggleRowDetails(row)" - > - <icon-chevron /> - </b-button> - </template> + <!-- Expand chevron icon --> + <template #cell(expandRow)="row"> + <b-button + variant="link" + :aria-label="expandRowLabel" + :title="expandRowLabel" + class="btn-icon-only" + @click="toggleRowDetails(row)" + > + <icon-chevron /> + </b-button> + </template> - <template #row-details="{ item }"> - <b-container fluid> - <b-row> - <b-col> - <dl> - <!-- Name --> - <dt>{{ $t('pageEventLogs.table.name') }}:</dt> - <dd>{{ dataFormatter(item.name) }}</dd> - </dl> - <dl> - <!-- Type --> - <dt>{{ $t('pageEventLogs.table.type') }}:</dt> - <dd>{{ dataFormatter(item.type) }}</dd> - </dl> - </b-col> - <b-col> - <dl> - <!-- Modified date --> - <dt>{{ $t('pageEventLogs.table.modifiedDate') }}:</dt> - <dd v-if="item.modifiedDate"> - {{ item.modifiedDate | formatDate }} - {{ item.modifiedDate | formatTime }} - </dd> - <dd v-else>--</dd> - </dl> - </b-col> - <b-col class="text-nowrap"> - <b-button - class="btn btn-secondary float-right" - :href="item.additionalDataUri" - target="_blank" - > - <icon-download />{{ $t('pageEventLogs.additionalDataUri') }} - </b-button> - </b-col> - </b-row> - </b-container> - </template> + <template #row-details="{ item }"> + <b-container fluid> + <b-row> + <b-col> + <dl> + <!-- Name --> + <dt>{{ $t('pageEventLogs.table.name') }}:</dt> + <dd>{{ dataFormatter(item.name) }}</dd> + </dl> + <dl> + <!-- Type --> + <dt>{{ $t('pageEventLogs.table.type') }}:</dt> + <dd>{{ dataFormatter(item.type) }}</dd> + </dl> + </b-col> + <b-col> + <dl> + <!-- Modified date --> + <dt>{{ $t('pageEventLogs.table.modifiedDate') }}:</dt> + <dd v-if="item.modifiedDate"> + {{ item.modifiedDate | formatDate }} + {{ item.modifiedDate | formatTime }} + </dd> + <dd v-else>--</dd> + </dl> + </b-col> + <b-col class="text-nowrap"> + <b-button + class="btn btn-secondary float-right" + :href="item.additionalDataUri" + target="_blank" + > + <icon-download />{{ + $t('pageEventLogs.additionalDataUri') + }} + </b-button> + </b-col> + </b-row> + </b-container> + </template> - <!-- Severity column --> - <template #cell(severity)="{ value }"> - <status-icon v-if="value" :status="statusIcon(value)" /> - {{ value }} - </template> - <!-- Date column --> - <template #cell(date)="{ value }"> - <p class="mb-0">{{ value | formatDate }}</p> - <p class="mb-0">{{ value | formatTime }}</p> - </template> + <!-- Severity column --> + <template #cell(severity)="{ value }"> + <status-icon v-if="value" :status="statusIcon(value)" /> + {{ value }} + </template> + <!-- Date column --> + <template #cell(date)="{ value }"> + <p class="mb-0">{{ value | formatDate }}</p> + <p class="mb-0">{{ value | formatTime }}</p> + </template> - <!-- Status column --> - <template #cell(status)="row"> - <b-form-checkbox - v-model="row.item.status" - name="switch" - switch - @change="changelogStatus(row.item)" - > - <span v-if="row.item.status"> - {{ $t('pageEventLogs.resolved') }} - </span> - <span v-else> {{ $t('pageEventLogs.unresolved') }} </span> - </b-form-checkbox> - </template> - <template #cell(filterByStatus)="{ value }"> - {{ value }} - </template> + <!-- Status column --> + <template #cell(status)="row"> + <b-form-checkbox + v-model="row.item.status" + name="switch" + switch + @change="changelogStatus(row.item)" + > + <span v-if="row.item.status"> + {{ $t('pageEventLogs.resolved') }} + </span> + <span v-else> {{ $t('pageEventLogs.unresolved') }} </span> + </b-form-checkbox> + </template> + <template #cell(filterByStatus)="{ value }"> + {{ value }} + </template> - <!-- Actions column --> - <template #cell(actions)="row"> - <table-row-action - v-for="(action, index) in row.item.actions" - :key="index" - :value="action.value" - :title="action.title" - :row-data="row.item" - :export-name="exportFileNameByDate('export')" - :data-test-id="`eventLogs-button-deleteRow-${row.index}`" - @click-table-action="onTableRowAction($event, row.item)" - > - <template #icon> - <icon-export v-if="action.value === 'export'" /> - <icon-trashcan v-if="action.value === 'delete'" /> - </template> - </table-row-action> - </template> - </b-table> - </b-col> - </b-row> + <!-- Actions column --> + <template #cell(actions)="row"> + <table-row-action + v-for="(action, index) in row.item.actions" + :key="index" + :value="action.value" + :title="action.title" + :row-data="row.item" + :export-name="exportFileNameByDate('export')" + :data-test-id="`eventLogs-button-deleteRow-${row.index}`" + @click-table-action="onTableRowAction($event, row.item)" + > + <template #icon> + <icon-export v-if="action.value === 'export'" /> + <icon-trashcan v-if="action.value === 'delete'" /> + </template> + </table-row-action> + </template> + </b-table> + </b-col> + </b-row> - <!-- Table pagination --> - <b-row> - <b-col sm="6"> - <b-form-group - class="table-pagination-select" - :label="$t('global.table.itemsPerPage')" - label-for="pagination-items-per-page" - > - <b-form-select - id="pagination-items-per-page" - v-model="perPage" - :options="itemsPerPageOptions" + <!-- Table pagination --> + <b-row> + <b-col sm="6"> + <b-form-group + class="table-pagination-select" + :label="$t('global.table.itemsPerPage')" + label-for="pagination-items-per-page" + > + <b-form-select + id="pagination-items-per-page" + v-model="perPage" + :options="itemsPerPageOptions" + /> + </b-form-group> + </b-col> + <b-col sm="6"> + <b-pagination + v-model="currentPage" + first-number + last-number + :per-page="perPage" + :total-rows="getTotalRowCount(filteredRows)" + aria-controls="table-event-logs" /> - </b-form-group> - </b-col> - <b-col sm="6"> - <b-pagination - v-model="currentPage" - first-number - last-number - :per-page="perPage" - :total-rows="getTotalRowCount(filteredRows)" - aria-controls="table-event-logs" - /> - </b-col> - </b-row> + </b-col> + </b-row> + </div> </b-container> </template> diff --git a/src/views/MemoryModules/Specification/MemoryStaticPage.vue b/src/views/MemoryModules/Specification/MemoryStaticPage.vue index a40bd2ea..679f4ba1 100644 --- a/src/views/MemoryModules/Specification/MemoryStaticPage.vue +++ b/src/views/MemoryModules/Specification/MemoryStaticPage.vue @@ -42,10 +42,7 @@ </span> </b-col> <b-col cols="1"> - <img - src="@/assets/images/fans-page/working.svg" - class="icon-chevron" - /> + <img src="@/assets/images/status/on.svg" class="icon-chevron" /> </b-col> </b-row> <b-row v-else> @@ -74,10 +71,7 @@ </span> </b-col> <b-col cols="1"> - <img - src="@/assets/images/fans-page/working.svg" - class="icon-chevron" - /> + <img src="@/assets/images/status/on.svg" class="icon-chevron" /> </b-col> </b-row> <b-row v-else> diff --git a/src/views/Operations/Kvm/Kvm.vue b/src/views/Operations/Kvm/Kvm.vue index 8c51ace4..324d50d0 100644 --- a/src/views/Operations/Kvm/Kvm.vue +++ b/src/views/Operations/Kvm/Kvm.vue @@ -29,8 +29,7 @@ </div> </div> </div> - <div class="console"></div> - <!-- <kvm-console :is-full-window="false" /> --> + <kvm-console :is-full-window="false" /> <images-modal /> </b-container> </template> @@ -38,14 +37,14 @@ <script> import PageTitle from '@/components/Global/PageTitle'; import ImagesModal from './ImagesModal'; -// import KvmConsole from './KvmConsole'; +import KvmConsole from './KvmConsole'; export default { name: 'Kvm', components: { PageTitle, ImagesModal, - // KvmConsole + KvmConsole, }, }; </script> @@ -112,10 +111,4 @@ export default { .semi-bold-12px { color: $text-primary; } - -.console { - background-color: black; - width: 100%; - height: 70vh; -} </style> diff --git a/src/views/Operations/SerialOverLan/SerialOverLan.vue b/src/views/Operations/SerialOverLan/SerialOverLan.vue index 6f6852cf..33533bf9 100644 --- a/src/views/Operations/SerialOverLan/SerialOverLan.vue +++ b/src/views/Operations/SerialOverLan/SerialOverLan.vue @@ -39,8 +39,7 @@ </div> </div> </div> - <div class="console"></div> - <!-- <serial-over-lan-console :is-full-window="false" /> --> + <serial-over-lan-console :is-full-window="false" /> </page-section> <images-modal /> </b-container> @@ -49,7 +48,7 @@ <script> import PageTitle from '@/components/Global/PageTitle'; import PageSection from '@/components/Global/PageSection'; -// import SerialOverLanConsole from './SerialOverLanConsole'; +import SerialOverLanConsole from './SerialOverLanConsole'; import ImagesModal from '../Kvm/ImagesModal'; export default { @@ -58,7 +57,7 @@ export default { PageSection, PageTitle, ImagesModal, - // SerialOverLanConsole, + SerialOverLanConsole, }, }; </script> @@ -124,10 +123,4 @@ export default { .semi-bold-12px { color: $text-primary; } - -.console { - background-color: black; - width: 100%; - height: 70vh; -} </style> diff --git a/src/views/Operations/ServerPowerOperations/BootSettings.vue b/src/views/Operations/ServerPowerOperations/BootSettings.vue index 4896286b..ab3c22b9 100644 --- a/src/views/Operations/ServerPowerOperations/BootSettings.vue +++ b/src/views/Operations/ServerPowerOperations/BootSettings.vue @@ -1,16 +1,17 @@ <template> <div class="form-background p-3"> + <label class="semi-bold-16px">{{ + $t('pageServerPowerOperations.serverBootSettings') + }}</label> <b-form novalidate @submit.prevent="handleSubmit"> - <b-form-group - :label=" + <b-form-group label-for="boot-option" class="mb-3 regular-12px"> + <label class="semi-bold-12px">{{ $t('pageServerPowerOperations.bootSettings.bootSettingsOverride') - " - label-for="boot-option" - class="mb-3" - > + }}</label> <b-form-select id="boot-option" v-model="form.bootOption" + class="boot-select regular-14px" :disabled="bootSourceOptions.length === 0" :options="bootSourceOptions" @change="onChangeSelect" @@ -19,30 +20,32 @@ </b-form-group> <b-form-checkbox v-model="form.oneTimeBoot" - class="mb-4" + class="mb-4 regular-12px cb" :disabled="form.bootOption === 'None'" @change="$v.form.oneTimeBoot.$touch()" > {{ $t('pageServerPowerOperations.bootSettings.enableOneTimeBoot') }} </b-form-checkbox> - <b-form-group - :label="$t('pageServerPowerOperations.bootSettings.tpmRequiredPolicy')" - > - <b-form-text id="tpm-required-policy-help-block"> + <b-form-group> + <label class="semi-bold-12px">{{ + $t('pageServerPowerOperations.bootSettings.tpmRequiredPolicy') + }}</label> + <label id="tpm-required-policy-help-block" class="regular-12px"> {{ $t('pageServerPowerOperations.bootSettings.tpmRequiredPolicyHelper') }} - </b-form-text> + </label> <b-form-checkbox id="tpm-required-policy" v-model="form.tpmPolicyOn" + class="regular-12px cb" aria-describedby="tpm-required-policy-help-block" @change="$v.form.tpmPolicyOn.$touch()" > {{ $t('global.status.enabled') }} </b-form-checkbox> </b-form-group> - <b-button variant="primary" type="submit" class="mb-3"> + <b-button variant="primary" size="md" type="submit" class="mb-3"> {{ $t('global.action.save') }} </b-button> </b-form> @@ -130,3 +133,12 @@ export default { }, }; </script> +<style lang="scss" scoped> +.boot-select { + height: 40px; + max-width: 270px; + border: none; + border-radius: 8px; + background-image: url('../../../assets/images/icon-chevron.svg'); +} +</style> diff --git a/src/views/Operations/ServerPowerOperations/ServerPowerOperations.vue b/src/views/Operations/ServerPowerOperations/ServerPowerOperations.vue index 9e030837..f2fb62e2 100644 --- a/src/views/Operations/ServerPowerOperations/ServerPowerOperations.vue +++ b/src/views/Operations/ServerPowerOperations/ServerPowerOperations.vue @@ -1,147 +1,192 @@ <template> - <b-container fluid="xl"> + <b-container fluid="xxl pt-0 m-0"> <page-title /> - <b-row class="mb-4"> - <b-col md="8" xl="6"> - <page-section - :section-title="$t('pageServerPowerOperations.currentStatus')" - > - <b-row> - <b-col> - <dl> - <dt>{{ $t('pageServerPowerOperations.serverStatus') }}</dt> - <dd - v-if="serverStatus === 'on'" - data-test-id="powerServerOps-text-hostStatus" - > - {{ $t('global.status.on') }} - </dd> - <dd - v-else-if="serverStatus === 'off'" - data-test-id="powerServerOps-text-hostStatus" - > - {{ $t('global.status.off') }} - </dd> - <dd v-else> - {{ $t('global.status.notAvailable') }} - </dd> - </dl> - </b-col> - </b-row> - <b-row> - <b-col> - <dl> - <dt> - {{ $t('pageServerPowerOperations.lastPowerOperation') }} - </dt> - <dd - v-if="lastPowerOperationTime" - data-test-id="powerServerOps-text-lastPowerOp" - > - {{ lastPowerOperationTime | formatDate }} - {{ lastPowerOperationTime | formatTime }} - </dd> - <dd v-else>--</dd> - </dl> - </b-col> - </b-row> - </page-section> - </b-col> - </b-row> - <b-row> - <b-col v-if="hasBootSourceOptions" sm="8" md="6" xl="4"> - <page-section - :section-title="$t('pageServerPowerOperations.serverBootSettings')" - > - <boot-settings /> - </page-section> - </b-col> - <b-col sm="8" md="6" xl="7"> - <page-section - :section-title="$t('pageServerPowerOperations.operations')" - > - <alert :show="oneTimeBootEnabled" variant="warning"> - {{ $t('pageServerPowerOperations.oneTimeBootWarning') }} - </alert> - <template v-if="isOperationInProgress"> - <alert variant="info"> - {{ $t('pageServerPowerOperations.operationInProgress') }} + <div class="main-container"> + <b-row class="m-2"> + <b-col md="8" xl="6"> + <page-section class="m-2 pt-2 pb-2"> + <b-row> + <b-col> + <dl> + <dt class="semi-bold-16px"> + {{ $t('pageServerPowerOperations.serverStatus') }} + </dt> + <dd + v-if="serverStatus === 'on'" + style="margin-top: 10px" + class="regular-12px" + data-test-id="powerServerOps-text-hostStatus" + > + <img + style="margin-right: 5px" + src="@/assets/images/status/on.svg" + /> + {{ $t('global.status.on_full') }} + </dd> + <dd + v-else-if="serverStatus === 'off'" + style="margin-top: 10px" + class="regular-12px" + data-test-id="powerServerOps-text-hostStatus" + > + <img + style="margin-right: 5px" + src="@/assets/images/status/off.svg" + /> + {{ $t('global.status.off_full') }} + </dd> + <dd v-else class="regular-12px"> + {{ $t('global.status.notAvailable') }} + </dd> + </dl> + </b-col> + </b-row> + <b-row> + <b-col> + <dl> + <dt class="semi-bold-12px"> + {{ $t('pageServerPowerOperations.lastPowerOperation') }} + </dt> + <dd + v-if="lastPowerOperationTime" + class="regular-12px" + data-test-id="powerServerOps-text-lastPowerOp" + > + {{ lastPowerOperationTime | formatDate }} + {{ lastPowerOperationTime | formatTime }} + </dd> + <dd v-else>--</dd> + </dl> + </b-col> + </b-row> + </page-section> + </b-col> + </b-row> + <b-row class="m-2"> + <b-col sm="8" md="6" xl="7"> + <page-section class="m-2"> + <b-row class="ml-0 mb-3"> + <span class="semi-bold-16px">{{ 'Управление' }}</span> + </b-row> + <alert :show="oneTimeBootEnabled" variant="warning"> + {{ $t('pageServerPowerOperations.oneTimeBootWarning') }} </alert> - </template> - <template v-else-if="serverStatus === 'off'"> - <b-button - variant="primary" - data-test-id="serverPowerOperations-button-powerOn" - @click="powerOn" - > - {{ $t('pageServerPowerOperations.powerOn') }} - </b-button> - </template> - <template v-else> - <!-- Reboot server options --> - <b-form novalidate class="mb-5" @submit.prevent="rebootServer"> - <b-form-group - :label="$t('pageServerPowerOperations.rebootServer')" + <template v-if="isOperationInProgress"> + <alert variant="info"> + {{ $t('pageServerPowerOperations.operationInProgress') }} + </alert> + </template> + <template v-else-if="serverStatus === 'off'"> + <popover-with-slot + id="popover-powerOn" + :button-label="$t('pageServerPowerOperations.powerOn')" + :popup-label="$t('pageServerPowerOperations.powerOnServer')" + placement="right" + :action="powerOn" > - <b-form-radio - v-model="form.rebootOption" - name="reboot-option" - data-test-id="serverPowerOperations-radio-rebootOrderly" - value="orderly" + <b-button + id="popover-powerOn" + ref="button" + size="md" + variant="primary" > - {{ $t('pageServerPowerOperations.orderlyReboot') }} - </b-form-radio> - <b-form-radio - v-model="form.rebootOption" - name="reboot-option" - data-test-id="serverPowerOperations-radio-rebootImmediate" - value="immediate" - > - {{ $t('pageServerPowerOperations.immediateReboot') }} - </b-form-radio> - </b-form-group> - <b-button - variant="primary" - type="submit" - data-test-id="serverPowerOperations-button-reboot" - > - {{ $t('pageServerPowerOperations.reboot') }} - </b-button> - </b-form> - <!-- Shutdown server options --> - <b-form novalidate @submit.prevent="shutdownServer"> - <b-form-group - :label="$t('pageServerPowerOperations.shutdownServer')" - > - <b-form-radio - v-model="form.shutdownOption" - name="shutdown-option" - data-test-id="serverPowerOperations-radio-shutdownOrderly" - value="orderly" + {{ $t('pageServerPowerOperations.powerOn') }} + </b-button> + </popover-with-slot> + </template> + <template v-else> + <!-- Reboot server options --> + <b-form novalidate class="mb-2"> + <b-form-group class="regular-12px cb"> + <label class="semi-bold-12px">{{ + $t('pageServerPowerOperations.rebootServer') + }}</label> + <b-form-radio + v-model="form.rebootOption" + name="reboot-option" + data-test-id="serverPowerOperations-radio-rebootOrderly" + value="orderly" + > + {{ $t('pageServerPowerOperations.orderlyReboot') }} + </b-form-radio> + <b-form-radio + v-model="form.rebootOption" + name="reboot-option" + data-test-id="serverPowerOperations-radio-rebootImmediate" + value="immediate" + > + {{ $t('pageServerPowerOperations.immediateReboot') }} + </b-form-radio> + </b-form-group> + <popover-with-slot + id="popover-reboot" + :button-label="$t('pageServerPowerOperations.reboot')" + :popup-label="$t('pageServerPowerOperations.rebootServer')" + placement="right" + :action="rebootServer" > - {{ $t('pageServerPowerOperations.orderlyShutdown') }} - </b-form-radio> - <b-form-radio - v-model="form.shutdownOption" - name="shutdown-option" - data-test-id="serverPowerOperations-radio-shutdownImmediate" - value="immediate" + <b-button + id="popover-reboot" + ref="button" + size="md" + variant="primary" + > + {{ $t('pageServerPowerOperations.reboot') }} + </b-button> + </popover-with-slot> + </b-form> + <!-- Shutdown server options --> + <b-form> + <b-form-group class="regular-12px cb"> + <label class="semi-bold-12px">{{ + $t('pageServerPowerOperations.shutdownServer') + }}</label> + <b-form-radio + v-model="form.shutdownOption" + name="shutdown-option" + data-test-id="serverPowerOperations-radio-shutdownOrderly" + value="orderly" + > + {{ $t('pageServerPowerOperations.orderlyShutdown') }} + </b-form-radio> + <b-form-radio + v-model="form.shutdownOption" + name="shutdown-option" + data-test-id="serverPowerOperations-radio-shutdownImmediate" + value="immediate" + > + {{ $t('pageServerPowerOperations.immediateShutdown') }} + </b-form-radio> + </b-form-group> + <popover-with-slot + id="popover-shutDown" + :button-label="$t('pageServerPowerOperations.shutDown')" + :popup-label="$t('pageServerPowerOperations.shutdownServer')" + placement="right" + :action="shutdownServer" > - {{ $t('pageServerPowerOperations.immediateShutdown') }} - </b-form-radio> - </b-form-group> - <b-button - variant="primary" - type="submit" - data-test-id="serverPowerOperations-button-shutDown" - > - {{ $t('pageServerPowerOperations.shutDown') }} - </b-button> - </b-form> - </template> - </page-section> - </b-col> - </b-row> + <b-button + id="popover-shutDown" + ref="button" + size="md" + variant="secondary" + > + {{ $t('pageServerPowerOperations.shutDown') }} + </b-button> + </popover-with-slot> + </b-form> + </template> + </page-section> + </b-col> + </b-row> + <b-row> + <b-col v-if="hasBootSourceOptions" class="m-2" sm="8" md="6" xl="4"> + <page-section class="m-2"> + <boot-settings /> + </page-section> + </b-col> + </b-row> + </div> </b-container> </template> @@ -152,10 +197,17 @@ import BVToastMixin from '@/components/Mixins/BVToastMixin'; import BootSettings from './BootSettings'; import LoadingBarMixin from '@/components/Mixins/LoadingBarMixin'; import Alert from '@/components/Global/Alert'; +import PopoverWithSlot from '@/components/Global/SilaComponents/PopoverWithSlot'; export default { name: 'ServerPowerOperations', - components: { PageTitle, PageSection, BootSettings, Alert }, + components: { + PageTitle, + PageSection, + BootSettings, + Alert, + PopoverWithSlot, + }, mixins: [BVToastMixin, LoadingBarMixin], beforeRouteLeave(to, from, next) { this.hideLoader(); @@ -207,52 +259,18 @@ export default { this.$store.dispatch('controls/serverPowerOn'); }, rebootServer() { - const modalMessage = this.$t( - 'pageServerPowerOperations.modal.confirmRebootMessage' - ); - const modalOptions = { - title: this.$t('pageServerPowerOperations.modal.confirmRebootTitle'), - okTitle: this.$t('global.action.confirm'), - cancelTitle: this.$t('global.action.cancel'), - }; - if (this.form.rebootOption === 'orderly') { - this.$bvModal - .msgBoxConfirm(modalMessage, modalOptions) - .then((confirmed) => { - if (confirmed) this.$store.dispatch('controls/serverSoftReboot'); - }); + this.$store.dispatch('controls/serverSoftReboot'); } else if (this.form.rebootOption === 'immediate') { - this.$bvModal - .msgBoxConfirm(modalMessage, modalOptions) - .then((confirmed) => { - if (confirmed) this.$store.dispatch('controls/serverHardReboot'); - }); + this.$store.dispatch('controls/serverHardReboot'); } }, shutdownServer() { - const modalMessage = this.$t( - 'pageServerPowerOperations.modal.confirmShutdownMessage' - ); - const modalOptions = { - title: this.$t('pageServerPowerOperations.modal.confirmShutdownTitle'), - okTitle: this.$t('global.action.confirm'), - cancelTitle: this.$t('global.action.cancel'), - }; - if (this.form.shutdownOption === 'orderly') { - this.$bvModal - .msgBoxConfirm(modalMessage, modalOptions) - .then((confirmed) => { - if (confirmed) this.$store.dispatch('controls/serverSoftPowerOff'); - }); + this.$store.dispatch('controls/serverSoftPowerOff'); } if (this.form.shutdownOption === 'immediate') { - this.$bvModal - .msgBoxConfirm(modalMessage, modalOptions) - .then((confirmed) => { - if (confirmed) this.$store.dispatch('controls/serverHardPowerOff'); - }); + this.$store.dispatch('controls/serverHardPowerOff'); } }, }, diff --git a/src/views/PowerSupplies/Specification/PowerStaticPage.vue b/src/views/PowerSupplies/Specification/PowerStaticPage.vue index 8ff1aa1b..3511b1f7 100644 --- a/src/views/PowerSupplies/Specification/PowerStaticPage.vue +++ b/src/views/PowerSupplies/Specification/PowerStaticPage.vue @@ -32,10 +32,7 @@ </span> </b-col> <b-col cols="1"> - <img - src="@/assets/images/fans-page/working.svg" - class="icon-chevron" - /> + <img src="@/assets/images/status/on.svg" class="icon-chevron" /> </b-col> </b-row> <b-row v-else> diff --git a/src/views/Processors/Specification/AcceleratorSpecificationTable.vue b/src/views/Processors/Specification/AcceleratorSpecificationTable.vue index 1be41ac2..c13e13ff 100644 --- a/src/views/Processors/Specification/AcceleratorSpecificationTable.vue +++ b/src/views/Processors/Specification/AcceleratorSpecificationTable.vue @@ -18,16 +18,13 @@ </template> <template #cell(status)="{ value }"> <div v-if="value" class="fans-table-col-first__cell"> - <img class="status__img" src="@/assets/images/fans-page/working.svg" /> + <img class="status__img" src="@/assets/images/status/on.svg" /> <span> {{ $t('global.status.inWork') }} </span> </div> <div v-else class="fans-table-col-first__cell"> - <img - class="status__img" - src="@/assets/images/fans-page/notWorking.svg" - /> + <img class="status__img" src="@/assets/images/status/off.svg" /> <span> {{ $t('global.status.outWorking') }} </span> diff --git a/src/views/Processors/Specification/ProcessorsSpecificationTable.vue b/src/views/Processors/Specification/ProcessorsSpecificationTable.vue index 1d026f1b..07a4512d 100644 --- a/src/views/Processors/Specification/ProcessorsSpecificationTable.vue +++ b/src/views/Processors/Specification/ProcessorsSpecificationTable.vue @@ -25,16 +25,13 @@ </template> <template #cell(status)="{ value }"> <div v-if="value" class="fans-table-col-first__cell"> - <img class="status__img" src="@/assets/images/fans-page/working.svg" /> + <img class="status__img" src="@/assets/images/status/on.svg" /> <span> {{ $t('global.status.inWork') }} </span> </div> <div v-else class="fans-table-col-first__cell"> - <img - class="status__img" - src="@/assets/images/fans-page/notWorking.svg" - /> + <img class="status__img" src="@/assets/images/status/off.svg" /> <span> {{ $t('global.status.outWorking') }} </span> diff --git a/src/views/SILA/EventLogs/EventLogs.vue b/src/views/SILA/EventLogs/EventLogs.vue index 36ec9802..aca17ac0 100644 --- a/src/views/SILA/EventLogs/EventLogs.vue +++ b/src/views/SILA/EventLogs/EventLogs.vue @@ -73,8 +73,10 @@ description="pageEventLogs.clearLogs" popup="pageEventLogs.clearLogs_popup" button="pageEventLogs.clear" + placement="bottom" :isclear="true" class="clear-popover" + :action="deleteAllLogs" /> </div> <table-toolbar @@ -85,8 +87,9 @@ > <template #toolbar-buttons> <b-button - variant="primary" - class="table-toolbar__resolved-button" + size="md" + variant="secondary" + style="margin-right: 1rem" @click="resolveLogs" > <img @@ -96,8 +99,9 @@ {{ $t('pageEventLogs.event_resolve') }} </b-button> <b-button + size="md" variant="primary" - class="table-toolbar__unresolved-button" + style="margin-right: 1rem" @click="unresolveLogs" > <img @@ -106,15 +110,21 @@ /> {{ $t('pageEventLogs.archive') }} </b-button> + <table-toolbar-export + :data="batchExportData" + style="margin-right: 1rem" + :file-name="exportFileNameByDate()" + /> </template> </table-toolbar> - <div id="event-logs-table-wrapper"> + <div id="logs-table-wrapper"> <b-table - id="event-logs-table" + id="logs-table" ref="table" responsive="md" - class="event-logs-table" + class="logs-table" selectable + :busy="isBusy" no-select-on-click sort-icon-left :sticky-header="stickyHeader" @@ -122,6 +132,8 @@ no-sort-reset :sort-desc="sortDesc" sort-by="id" + :current-page="currentPage" + :per-page="perPage" :fields="fields" :items="filteredLogs" :sort-compare="onSortCompare" @@ -153,42 +165,26 @@ </template> <template #cell(description)="data"> <b-row class="semi-bold-16px tretiatry"> - {{ data.item.description.name }} + {{ filteredLogs[data.index].name }} </b-row> <b-row class="regular-12px tretiatry pointer" @click="toggleRowDetails(data)" > - {{ data.item.description.description }}</b-row - > - </template> - <template #row-details="{ index }"> - <b-container fluid> - <b-col class="mt-1 mb-2 regular-12px tretiatry"> - <span class="row-details"> - {{ - `Краткое описание ошибки или сообщение которое состоит из текста указывающего на предмет ошибки.Краткое описание ошибки или сообщение которое состоит из текста указывающего на предмет ошибки. - Краткое описание ошибки или сообщение которое состоит из текста указывающего на предмет ошибки.Краткое описание ошибки или сообщение которое состоит из текста указывающего на предмет ошибки.` - }} - {{ $t(filteredLogs[index].description.description) }} - </span> - </b-col> - </b-container> + {{ data.value }} + </b-row> </template> <!-- Severity column --> <template #cell(severity)="{ value }"> - <span v-if="value === 'Критические'" class="bold-12px__caps errors">{{ - value - }}</span> <span - v-else-if="value === 'Предупреждения'" - class="bold-12px__caps warning" + :class="`indicators-${value}`" + class="bold-12px__caps" + style="text-overflow: ellipsis; white-space: nowrap" + > + {{ value }}</span > - {{ value }} - </span> - <span v-else class="bold-12px__caps information">{{ value }}</span> </template> - <!-- Date column --> + <!-- Source column --> <template #cell(source)="{ value }"> <b-row v-if="value === 'Процессоры'"> <img @@ -211,18 +207,26 @@ /> <span>{{ value }}</span> </b-row> - <b-row v-else> + <b-row v-else-if="value === 'Модули памяти'"> <img src="@/assets/images/event-logs/memory-module.svg" class="sourse__img" /> <span>{{ value }}</span> </b-row> + <b-row v-else> + <span>{{ value }}</span> + </b-row> </template> - + <!-- Date column --> <template #cell(date)="{ value }"> <img src="@/assets/images/event-logs/time.svg" class="sourse__img" /> - <span class="regular-12px quaternary"> {{ value }} </span> + <span v-if="value" class="regular-12px quaternary"> + {{ value | formatDate }} + </span> + <span v-if="value" class="regular-12px quaternary"> + в {{ value | formatTimeShort }} + </span> </template> <!-- Status column --> @@ -246,25 +250,50 @@ > </b-row> </template> + <template #row-details="{ item }"> + <b-container + fluid + style="border-bottom: 1px solid rgba(26, 62, 91, 0.2)" + > + <b-col class="mt-1 mb-2 regular-12px tretiatry"> + <span class="row-details"> + {{ item.description }} + </span> + </b-col> + </b-container> + </template> </b-table> </div> <div class="pagination-container"> <div class="pagination-content"> - <span class="semi-bold-16px"> Страница </span> - <img class="sourse__img" src="@/assets/images/arrow-left.svg" /> - <span class="semi-bold-16px page-input"> 1 </span> - <span class="semi-bold-16px"> из </span> - <span class="semi-bold-16px"> 123 </span> - <img class="sourse__img" src="@/assets/images/arrow-right.svg" /> + <span class="semi-bold-16px"> Страницы </span> + <b-pagination + v-model="currentPage" + class="mt-2" + first-number + last-number + :per-page="perPage" + :total-rows="getTotalRowCount(filteredRows)" + aria-controls="table-event-logs" + /> </div> <div class="pagination-items-limit"> <span class="semi-bold-16px"> Показывать по </span> <b-form-select - v-model="itemsPerPage" + v-model="perPage" :options="itemsPerPageOptions" class="event-logs__filter items-per-page semi-bold-16px" /> <span class="semi-bold-16px"> записей на странице </span> + <b-button + size="md" + variant="primary" + :class="{ disabled: allLogs.length === 0 }" + :download="exportFileNameByDate()" + :href="href" + > + <icon-export /> {{ $t('global.action.exportAll') }} + </b-button> </div> </div> </b-container> @@ -272,19 +301,28 @@ <script> import { omit } from 'lodash'; +import IconExport from '@carbon/icons-vue/es/document--export/20'; import PageTitle from '@/components/Global/PageTitle'; import Popover from '@/components/Global/Popover'; import TableToolbar from '@/components/Global/TableToolbar'; +import TableToolbarExport from '@/components/Global/TableToolbarExport'; + import LoadingBarMixin from '@/components/Mixins/LoadingBarMixin'; import TableFilterMixin from '@/components/Mixins/TableFilterMixin'; +import BVToastMixin from '@/components/Mixins/BVToastMixin'; +import DataFormatterMixin from '@/components/Mixins/DataFormatterMixin'; +import TableSortMixin from '@/components/Mixins/TableSortMixin'; +import BVPaginationMixin, { + currentPage, + perPage, + itemsPerPageOptions, +} from '@/components/Mixins/BVPaginationMixin'; + import BVTableSelectableMixin, { selectedRows, tableHeaderCheckboxModel, tableHeaderCheckboxIndeterminate, } from '@/components/Mixins/BVTableSelectableMixin'; -import BVToastMixin from '@/components/Mixins/BVToastMixin'; -import DataFormatterMixin from '@/components/Mixins/DataFormatterMixin'; -import TableSortMixin from '@/components/Mixins/TableSortMixin'; import TableRowExpandMixin, { expandRowLabel, } from '@/components/Mixins/TableRowExpandMixin'; @@ -297,6 +335,8 @@ export default { PageTitle, Popover, TableToolbar, + TableToolbarExport, + IconExport, }, mixins: [ BVTableSelectableMixin, @@ -307,6 +347,7 @@ export default { TableSortMixin, TableRowExpandMixin, SearchFilterMixin, + BVPaginationMixin, ], beforeRouteLeave(to, from, next) { // Hide loader if the user navigates to another page @@ -316,257 +357,57 @@ export default { }, data() { return { + isBusy: true, + perPage, + itemsPerPageOptions, + currentPage, sortDesc: true, - stickyHeader: 'calc(100vh - 243px)', - itemsPerPage: 50, - itemsPerPageOptions: [ - { - value: 10, - text: '10', - }, - { - value: 50, - text: '50', - }, - { - value: 100, - text: '100', - }, - ], + stickyHeader: 'calc(100vh - 307px)', fields: [ { key: 'checkbox', sortable: false, - thClass: ' event-logs-table__th', - class: 'event-logs-table__id', - tdClass: 'event-logs-table__td', + thClass: ' logs-table__th', + tdClass: 'logs-table__td', }, { key: 'id', label: this.$t('pageEventLogs.table.id'), sortable: true, - thClass: 'bold-12px__caps event-logs-table__th', - tdClass: 'semi-bold-12px event-logs-table__td', + thClass: 'bold-12px__caps logs-table__th', + tdClass: 'semi-bold-12px logs-table__td', }, { key: 'description', label: this.$t('pageEventLogs.table.about_event'), - thClass: 'bold-12px__caps event-logs-table__th', - tdClass: 'event-logs-table__td', + thClass: 'bold-12px__caps logs-table__th', + tdClass: 'logs-table__td', }, { key: 'severity', label: this.$t('pageEventLogs.table.severity'), - thClass: 'bold-12px__caps event-logs-table__th', - tdClass: 'event-logs-table__td', + thClass: 'bold-12px__caps logs-table__th', + tdClass: 'logs-table__td', }, { key: 'source', label: this.$t('pageEventLogs.table.source'), - thClass: 'bold-12px__caps event-logs-table__th', - tdClass: 'semi-bold-12px__caps tretiatry event-logs-table__td', + thClass: 'bold-12px__caps logs-table__th', + tdClass: 'logs-table__td semi-bold-12px__caps tretiatry ', }, { key: 'date', label: this.$t('pageEventLogs.table.date'), sortable: true, - thClass: `bold-12px__caps event-logs-table__th event-logs-table__th__date`, - tdClass: 'event-logs-table__td', + thClass: `bold-12px__caps logs-table__th`, + tdClass: 'logs-table__td', }, { key: 'status', sortable: true, label: this.$t('pageEventLogs.table.status'), - thClass: 'bold-12px__caps event-logs-table__th', - tdClass: 'event-logs-table__td', - }, - ], - allLogs: [ - { - checkbox: false, - id: 1, - description: { - name: 'Имя источника событий', - description: 'Краткое описание ошибки или сообщени....', - full_description: '', - }, - severity: 'Критические', - source: 'Вентиляторы', - date: '23.11.2021 в 13.36', - status: true, - }, - { - checkbox: false, - id: 2, - description: { - name: 'Имя источника событий', - description: 'Краткое описание ошибки или сообщени....', - }, - severity: 'Информационное', - source: 'Модули памяти', - date: '23.11.2021 в 13.36', - status: false, - }, - { - checkbox: false, - id: 3, - description: { - name: 'Имя источника событий', - description: 'Краткое описание ошибки или сообщени....', - }, - severity: 'Критические', - source: 'Процессоры', - date: '23.11.2021 в 13.36', - status: true, - }, - { - checkbox: false, - id: 4, - description: { - name: 'Имя источника событий', - description: 'Краткое описание ошибки или сообщени....', - }, - severity: 'Предупреждения', - source: 'RAID-контролеры', - date: '23.11.2021 в 13.36', - status: 'expandRow', - }, - { - checkbox: false, - id: 5, - description: { - name: 'Имя источника событий', - description: 'Краткое описание ошибки или сообщени....', - }, - severity: 'Критические', - source: 'Процессоры', - date: '23.11.2021 в 13.36', - status: true, - }, - { - checkbox: false, - id: 6, - description: { - name: 'Имя источника событий', - description: 'Краткое описание ошибки или сообщени....', - }, - severity: 'Предупреждения', - source: 'RAID-контролеры', - date: '23.11.2021 в 13.36', - status: false, - }, - { - checkbox: false, - id: 7, - description: { - name: 'Имя источника событий', - description: 'Краткое описание ошибки или сообщени....', - }, - severity: 'Информационное', - source: 'Модули памяти', - date: '23.11.2021 в 13.36', - status: false, - }, - { - checkbox: false, - id: 8, - description: { - name: 'Имя источника событий', - description: 'Краткое описание ошибки или сообщени....', - }, - severity: 'Критические', - source: 'Вентиляторы', - date: '23.11.2021 в 13.36', - status: true, - }, - { - checkbox: false, - id: 9, - description: { - name: 'Имя источника событий', - description: 'Краткое описание ошибки или сообщени....', - }, - severity: 'Информационное', - source: 'Модули памяти', - date: '23.11.2021 в 13.36', - status: false, - }, - { - checkbox: false, - id: 10, - description: { - name: 'Имя источника событий', - description: 'Краткое описание ошибки или сообщени....', - }, - severity: 'Критические', - source: 'Процессоры', - date: '23.11.2021 в 13.36', - status: true, - }, - { - checkbox: false, - id: 11, - description: { - name: 'Имя источника событий', - description: 'Краткое описание ошибки или сообщени....', - }, - severity: 'Предупреждения', - source: 'RAID-контролеры', - date: '23.11.2021 в 13.36', - status: 'expandRow', - }, - { - checkbox: false, - id: 12, - description: { - name: 'Имя источника событий', - description: 'Краткое описание ошибки или сообщени....', - }, - severity: 'Критические', - source: 'Процессоры', - date: '23.11.2021 в 13.36', - status: true, - }, - { - checkbox: false, - id: 13, - description: { - name: 'Имя источника событий', - description: 'Краткое описание ошибки или сообщени....', - }, - severity: 'Предупреждения', - source: 'RAID-контролеры', - date: '23.11.2021 в 13.36', - status: false, - }, - { - checkbox: false, - id: 14, - description: { - name: 'Имя источника событий', - description: 'Краткое описание ошибки или сообщени....', - }, - severity: 'Информационное', - source: 'Модули памяти', - date: '23.11.2021 в 13.36', - status: false, - }, - ], - tableFilters: [ - { - key: 'severity', - label: this.$t('pageEventLogs.table.severity'), - values: ['Информационное', 'Предупреждения', 'Критические'], - }, - { - key: 'filterByStatus', - label: this.$t('pageEventLogs.table.status'), - values: ['Resolved', 'Unresolved'], - }, - { - key: 'status', - label: this.$t('pageEventLogs.table.status'), - values: [false, true], + thClass: 'bold-12px__caps logs-table__th', + tdClass: 'logs-table__td', }, ], eventFilter: 1, @@ -587,13 +428,17 @@ export default { text: 'Информационное', }, { - value: 'warning', + value: 'Warning', text: 'Предупреждения', }, { value: 'critical', text: 'Критические', }, + { + value: 'ok', + text: 'ok', + }, ], eventSourseFilter: 1, eventSourseFilters: [ @@ -636,23 +481,23 @@ export default { ? this.searchTotalFilteredRows : this.filteredLogs.length; }, - // allLogs() { - // return this.$store.getters['eventLog/allEvents'].map((event) => { - // return { - // ...event, - // actions: [ - // { - // value: 'export', - // title: this.$t('global.action.export'), - // }, - // { - // value: 'delete', - // title: this.$t('global.action.delete'), - // }, - // ], - // }; - // }); - // }, + allLogs() { + return this.$store.getters['eventLog/allEvents'].map((event) => { + return { + ...event, + actions: [ + { + value: 'export', + title: this.$t('global.action.export'), + }, + { + value: 'delete', + title: this.$t('global.action.delete'), + }, + ], + }; + }); + }, batchExportData() { return this.selectedRows.map((row) => omit(row, 'actions')); }, @@ -667,15 +512,15 @@ export default { return this.getFilteredTableData( this.filteredLogsByDate, this.activeFilters - ); + ).filter((el) => el.description); }, }, created() { - // this.startLoader(); - // this.$store.dispatch('eventLog/getEventLogData').finally(() => { - // this.endLoader(); - // this.isBusy = false; - // }); + this.startLoader(); + this.$store.dispatch('eventLog/getEventLogData').finally(() => { + this.endLoader(); + this.isBusy = false; + }); }, methods: { redirectFans() { @@ -693,21 +538,10 @@ export default { .catch(({ message }) => this.errorToast(message)); }, deleteAllLogs() { - this.$bvModal - .msgBoxConfirm(this.$t('pageEventLogs.modal.deleteAllMessage'), { - title: this.$t('pageEventLogs.modal.deleteAllTitle'), - okTitle: this.$t('global.action.delete'), - okVariant: 'danger', - cancelTitle: this.$t('global.action.cancel'), - }) - .then((deleteConfirmed) => { - if (deleteConfirmed) { - this.$store - .dispatch('eventLog/deleteAllEventLogs', this.allLogs) - .then((message) => this.successToast(message)) - .catch(({ message }) => this.errorToast(message)); - } - }); + this.$store + .dispatch('eventLog/deleteAllEventLogs', this.allLogs) + .then((message) => this.successToast(message)) + .catch(({ message }) => this.errorToast(message)); }, deleteLogs(uris) { this.$store @@ -738,19 +572,19 @@ export default { return this.sortStatus(a, b, key); } }, - // onTableRowAction(action, { uri }) { - // if (action === 'delete') { - // this.$bvModal - // .msgBoxConfirm(this.$tc('pageEventLogs.modal.deleteMessage'), { - // title: this.$tc('pageEventLogs.modal.deleteTitle'), - // okTitle: this.$t('global.action.delete'), - // cancelTitle: this.$t('global.action.cancel'), - // }) - // .then((deleteConfirmed) => { - // if (deleteConfirmed) this.deleteLogs([uri]); - // }); - // } - // }, + onTableRowAction(action, { uri }) { + if (action === 'delete') { + this.$bvModal + .msgBoxConfirm(this.$tc('pageEventLogs.modal.deleteMessage'), { + title: this.$tc('pageEventLogs.modal.deleteTitle'), + okTitle: this.$t('global.action.delete'), + cancelTitle: this.$t('global.action.cancel'), + }) + .then((deleteConfirmed) => { + if (deleteConfirmed) this.deleteLogs([uri]); + }); + } + }, onBatchAction(action) { if (action === 'delete') { const uris = this.selectedRows.map((row) => row.uri); @@ -838,17 +672,6 @@ export default { }; </script> <style lang="scss"> -#event-logs-table { - margin: 0 !important; -} - -.event-logs-table__th { - background-color: #f8f8f8 !important; - border-bottom: 1px solid $faint-secondary-primary-20 !important; - border-top: 1px solid $faint-secondary-primary-20 !important; - color: $text-primary !important; -} - .event-logs-section .table.b-table > thead > tr > [aria-sort='ascending'] { background-image: url('../../../assets/images/event-logs/sort-icon-rotate.svg'); } @@ -859,22 +682,11 @@ export default { } .event-logs-section .b-table-sort-icon-left { - background-position: left 57% center !important; background-size: 15px !important; - padding-left: 0.75rem !important; - padding-right: 2rem !important; - &.event-logs-table__th__date { - background-position: left 33% center !important; - } } -.event-logs-table__id { - padding-left: 38px !important; -} - -.event-logs-table__td { - border-bottom: 1px solid $faint-secondary-primary-10 !important; - height: 64px; +.b-table-details > td { + padding: 0px !important; } </style> <style lang="scss" scoped> @@ -962,69 +774,14 @@ $toolbar-height: 64px; width: 236px; } -.bold-12px__caps { - color: $text-primary !important; -} - .custom-checkbox { background-color: none; } -#event-logs-table-wrapper div { - overflow-y: overlay; - &::-webkit-scrollbar { - position: absolute; - width: 10px; - } - &::-webkit-scrollbar-thumb { - border: 4px solid transparent; - border-top: 52px solid transparent; - background: $faint-secondary-primary-20; - border-radius: 16px; - background-clip: content-box; - } -} - -.table-toolbar__resolved-button { - width: 226px; - height: 36px; - background-color: $faint-secondary-primary-5; - border-radius: 8px; - color: $red-brand-primary; - margin-right: 1rem; - justify-content: center; -} - -.table-toolbar__unresolved-button { - width: 226px; - height: 36px; - background-color: $red-brand-primary; - border-radius: 8px; - color: $white; - margin-right: 2rem; - justify-content: center; -} - .sourse__img { padding-right: 8px; } -.errors { - color: $indicators-errors !important; -} - -.warning { - color: $indicators-warning !important; -} - -.information { - color: $indicators-complementary !important; -} - -.resolved { - color: $indicators-succes; -} - .not-resolved { color: $text-quaternary; } @@ -1065,11 +822,12 @@ $toolbar-height: 64px; .pagination-items-limit { margin-left: auto; - width: 400px; display: flex; + gap: 7px; flex-direction: row; align-items: center; justify-content: space-evenly; + margin-right: 1rem; } .items-per-page { diff --git a/src/views/SILA/PciDevices/PciDevicesPage.vue b/src/views/SILA/PciDevices/PciDevicesPage.vue index 09734a4a..e25e0606 100644 --- a/src/views/SILA/PciDevices/PciDevicesPage.vue +++ b/src/views/SILA/PciDevices/PciDevicesPage.vue @@ -17,10 +17,7 @@ <template #cell(status)> <b-row> <b-col> - <img - src="@/assets/images/fans-page/working.svg" - class="icon-chevron" - /> + <img src="@/assets/images/status/on.svg" class="icon-chevron" /> <span> {{ 'Работоспособен' }} </span> diff --git a/src/views/SILA/RAID/Specification/RAIDSpecificationPage.vue b/src/views/SILA/RAID/Specification/RAIDSpecificationPage.vue index db2407d5..057c120b 100644 --- a/src/views/SILA/RAID/Specification/RAIDSpecificationPage.vue +++ b/src/views/SILA/RAID/Specification/RAIDSpecificationPage.vue @@ -25,10 +25,7 @@ <template #cell(value)="{ index, value }"> <b-row v-if="index === 0"> <b-col> - <img - src="@/assets/images/fans-page/working.svg" - class="icon-chevron" - /> + <img src="@/assets/images/status/on.svg" class="icon-chevron" /> <span> {{ 'Работоспособен' }} </span> @@ -76,7 +73,7 @@ <b-row v-if="index === 0"> <b-col> <img - src="@/assets/images/fans-page/working.svg" + src="@/assets/images/status/on.svg" class="icon-chevron" /> <span> diff --git a/src/views/Settings/DateTime/DateTime.vue b/src/views/Settings/DateTime/DateTime.vue index f5e063d1..7ab3ec0e 100644 --- a/src/views/Settings/DateTime/DateTime.vue +++ b/src/views/Settings/DateTime/DateTime.vue @@ -1,57 +1,67 @@ <template> - <b-container fluid="xl"> + <b-container fluid="xxl" class="pt-0 m-0"> <page-title /> - <b-row> - <b-col md="8" xl="6"> - <alert variant="info" class="mb-4"> - <span> + <b-row class="m-4"> + <b-col md="8" xl="12"> + <alert variant="info"> + <span class="regular-12px"> {{ $t('pageDateTime.alert.message') }} - <b-link to="/profile-settings"> + <b-link class="semi-bold-12px" to="/profile-settings"> {{ $t('pageDateTime.alert.link') }}</b-link > </span> </alert> </b-col> </b-row> - <page-section> + <page-section class="m-4"> <b-row> - <b-col lg="3"> + <b-col sm="6" lg="5" xl="4" xxl="3"> <dl> - <dt>{{ $t('pageDateTime.form.date') }}</dt> - <dd v-if="bmcTime">{{ bmcTime | formatDate }}</dd> + <dt class="semi-bold-12px">{{ $t('pageDateTime.form.date') }}</dt> + <dd v-if="bmcTime" class="regular-12px"> + {{ bmcTime | formatDate }} + </dd> <dd v-else>--</dd> </dl> </b-col> - <b-col lg="3"> + <b-col sm="6" lg="5" xl="4" xxl="3"> <dl> - <dt>{{ $t('pageDateTime.form.time.label') }}</dt> - <dd v-if="bmcTime">{{ bmcTime | formatTime }}</dd> + <dt class="semi-bold-12px"> + {{ $t('pageDateTime.form.time.label') }} + </dt> + <dd v-if="bmcTime" class="regular-12px"> + {{ bmcTime | formatTime }} + </dd> <dd v-else>--</dd> </dl> </b-col> </b-row> </page-section> - <page-section :section-title="$t('pageDateTime.configureSettings')"> + <page-section class="m-4"> + <label class="semi-bold-16px">{{ + $t('pageDateTime.configureSettings') + }}</label> <b-form novalidate @submit.prevent="submitForm"> <b-form-group label="Configure date and time" :disabled="loading" label-sr-only + class="system-control__radio regular-12px" > <b-form-radio v-model="form.configurationSelected" value="manual" data-test-id="dateTime-radio-configureManual" > - {{ $t('pageDateTime.form.manual') }} + {{ $t('SystemDescription.UseServerDatettime') }} </b-form-radio> <b-row class="mt-3 ml-3"> - <b-col sm="6" lg="4" xl="3"> + <b-col sm="7" lg="5" xl="5" xxl="3"> <b-form-group :label="$t('pageDateTime.form.date')" label-for="input-manual-date" > - <b-form-text id="date-format-help">YYYY-MM-DD</b-form-text> + <span class="regular-12px">YYYY-MM-DD</span> <b-input-group> <b-form-input id="input-manual-date" @@ -95,12 +105,12 @@ </b-input-group> </b-form-group> </b-col> - <b-col sm="6" lg="4" xl="3"> + <b-col sm="7" lg="5" xl="5" xxl="3"> <b-form-group :label="$t('pageDateTime.form.time.timezone', { timezone })" label-for="input-manual-time" > - <b-form-text id="time-format-help">HH:MM</b-form-text> + <span class="regular-12px">HH:MM</span> <b-input-group> <b-form-input id="input-manual-time" @@ -124,10 +134,11 @@ </b-row> <b-form-radio v-model="form.configurationSelected" + class="system-control__radio regular-12px" value="ntp" data-test-id="dateTime-radio-configureNTP" > - NTP + {{ $t('SystemDescription.GetNtpFromServer') }} </b-form-radio> <b-row class="mt-3 ml-3"> <b-col sm="6" lg="4" xl="3"> @@ -184,6 +195,7 @@ </b-col> </b-row> <b-button + size="md" variant="primary" type="submit" data-test-id="dateTime-button-saveSettings" @@ -415,3 +427,13 @@ export default { }, }; </script> +<style lang="scss" scoped> +.form-control { + height: 40px; + max-width: 270px; +} + +.input-group { + max-width: 270px; +} +</style> diff --git a/src/views/SystemDescription/Info/InventoryTableSystem.vue b/src/views/SystemDescription/Info/InventoryTableSystem.vue index f903a46b..eef0d871 100644 --- a/src/views/SystemDescription/Info/InventoryTableSystem.vue +++ b/src/views/SystemDescription/Info/InventoryTableSystem.vue @@ -4,7 +4,7 @@ responsive="md" show-empty class="bootstrap-rounded-table" - :items="systems" + :items="items" :fields="fields" :empty-text="$t('global.table.emptyMessage')" > @@ -15,14 +15,14 @@ <script> import BVToastMixin from '@/components/Mixins/BVToastMixin'; import PageSection from '@/components/Global/PageSection'; - +import LoadingBarMixin from '@/components/Mixins/LoadingBarMixin'; import TableRowExpandMixin, { expandRowLabel, } from '@/components/Mixins/TableRowExpandMixin'; export default { components: { PageSection }, - mixins: [BVToastMixin, TableRowExpandMixin], + mixins: [BVToastMixin, TableRowExpandMixin, LoadingBarMixin], data() { return { fields: [ @@ -45,35 +45,42 @@ export default { }, ], expandRowLabel: expandRowLabel, - systems: [ + items: null, + }; + }, + computed: { + systems() { + return this.$store.getters['system/systems']; + }, + }, + watch: { + systems() { + this.items = [ { - param: 'UUID сервера', - value: '17583', + param: 'id', + value: this.id, }, - { param: 'Модель', value: '1.214.248 beta' }, - { param: 'Производитель', value: 'Asus' }, - { param: 'Операционная система', value: 'Linux' }, - { param: 'Серийный номер', value: '741852963335' }, + { param: 'Модель', value: this.systems[0].model }, + { param: 'Производитель', value: '' }, + { param: 'Операционная система', value: '' }, + { param: 'Серийный номер', value: this.systems[0].serialNumber }, { param: 'Свободное место на Flash-накопителе', value: '1 024 000 Мб', }, - ], - }; + ]; + }, }, created() { this.$store.dispatch('system/getSystem').finally(() => { // Emit initial data fetch complete to parent component this.$root.$emit('hardware-status-system-complete'); - this.isBusy = false; }); - }, - methods: { - toggleIdentifyLedSwitch(state) { - this.$store - .dispatch('system/changeIdentifyLedState', state) - .catch(({ message }) => this.errorToast(message)); - }, + this.startLoader(); + const systemTablePromise = new Promise((resolve) => { + this.$root.$on('hardware-status-system-complete', () => resolve()); + }); + Promise.all([systemTablePromise]).finally(() => this.endLoader()); }, }; </script> diff --git a/src/views/SystemDescription/Info/SystemDescription.vue b/src/views/SystemDescription/Info/SystemDescription.vue index 558c70ef..b5cde965 100644 --- a/src/views/SystemDescription/Info/SystemDescription.vue +++ b/src/views/SystemDescription/Info/SystemDescription.vue @@ -6,87 +6,61 @@ <page-title /> <!-- System table --> <div class="main-container"> - <div class="page-collapse-decorator"> - <b-button - v-b-toggle.toggle-collapse_1 - variant="link" - class="collapse-button semi-bold-16px" - > - {{ $t('SystemDescription.title.ServerConfig') }} - <component :is="iconChevronUp" class="icon-expand" /> - </b-button> - <b-collapse id="toggle-collapse_1" class="nav-item__nav"> - <table-system ref="system" /> - <!-- Notes Administration --> - <section class="notes-section"> - <div class="semi-bold-12px textarea-description"> - <span>{{ $t('SystemDescription.title.Notes') }}</span> - </div> - <div class="textarea-container"> - <div class="buttons-container"> - <button class="notes-button"> - <img - src="@/assets/images/textarea-buttons/button-icon-bold.svg" - /> - </button> - <button class="notes-button"> - <img - src="@/assets/images/textarea-buttons/button-icon-cursive.svg" - /> - </button> - <button class="notes-button"> - <img - src="@/assets/images/textarea-buttons/button-icon-underline.svg" - /> - </button> - <button class="notes-button"> - <img - src="@/assets/images/textarea-buttons/button-icon-crossline.svg" - /> - </button> - <button class="notes-button"> - <img - src="@/assets/images/textarea-buttons/button-icon-link.svg" - /> - </button> - <div class="line"></div> - <button class="notes-button"> - <img - src="@/assets/images/textarea-buttons/button-icon-list.svg" - /> - </button> - <button class="notes-button"> - <img - src="@/assets/images/textarea-buttons/button-icon-number-list.svg" - /> - </button> - </div> - <textarea - id="" - name="area" - placeholder="Тут будет текст который ввел администратор и работать в качестве блокнота" - cols="30" - rows="10" - class="notes-textarea" - ></textarea> - </div> - </section> - </b-collapse> - </div> - <!-- Control --> - <div class="page-collapse-decorator"> - <b-button - v-b-toggle.toggle-collapse_2 - variant="link" - class="collapse-button semi-bold-16px" - > - {{ $t('SystemDescription.title.Control') }} - <component :is="iconChevronUp" class="icon-expand" /> - </b-button> - <b-collapse id="toggle-collapse_2" class="nav-item__nav"> - <control-system /> - </b-collapse> - </div> + <table-system /> + <!-- Notes Administration --> + <section class="notes-section"> + <div class="semi-bold-12px textarea-description"> + <span>{{ $t('SystemDescription.title.Notes') }}</span> + </div> + <div class="textarea-container"> + <div class="buttons-container"> + <button class="notes-button"> + <img + src="@/assets/images/textarea-buttons/button-icon-bold.svg" + /> + </button> + <button class="notes-button"> + <img + src="@/assets/images/textarea-buttons/button-icon-cursive.svg" + /> + </button> + <button class="notes-button"> + <img + src="@/assets/images/textarea-buttons/button-icon-underline.svg" + /> + </button> + <button class="notes-button"> + <img + src="@/assets/images/textarea-buttons/button-icon-crossline.svg" + /> + </button> + <button class="notes-button"> + <img + src="@/assets/images/textarea-buttons/button-icon-link.svg" + /> + </button> + <div class="line"></div> + <button class="notes-button"> + <img + src="@/assets/images/textarea-buttons/button-icon-list.svg" + /> + </button> + <button class="notes-button"> + <img + src="@/assets/images/textarea-buttons/button-icon-number-list.svg" + /> + </button> + </div> + <textarea + id="" + name="area" + placeholder="Тут будет текст который ввел администратор и работать в качестве блокнота" + cols="30" + rows="10" + class="notes-textarea" + ></textarea> + </div> + </section> </div> </b-container> </template> @@ -94,13 +68,11 @@ <script> import PageTitle from '@/components/Global/PageTitle'; import TableSystem from './InventoryTableSystem'; -import ControlSystem from '@/components/Global/SilaComponents/InventoryControlSystem'; import iconChevronUp from '@carbon/icons-vue/es/chevron--up/16'; export default { components: { PageTitle, - ControlSystem, TableSystem, }, data() { |