diff options
author | Maksim Zakharov <m.zakharov@IBS.RU> | 2022-06-01 17:40:28 +0300 |
---|---|---|
committer | Maksim Zakharov <m.zakharov@IBS.RU> | 2022-06-01 17:49:04 +0300 |
commit | 0cbf1713dc23e0039653891fab1fa2c52b4bfaf3 (patch) | |
tree | 94f31f3d6935a130d49704c51512016814df15eb /src/views | |
parent | c4d70da69a3c86f8c07ccdb0f09b755dd99b2155 (diff) | |
download | webui-vue-0cbf1713dc23e0039653891fab1fa2c52b4bfaf3.tar.xz |
Add PopoverSlot restyled DateTime and ServerPowerOrerations pages add reload BMC.
Diffstat (limited to 'src/views')
19 files changed, 841 insertions, 1059 deletions
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() { |