diff options
author | Maksim Zakharov <m.zakharov@IBS.RU> | 2022-05-24 09:43:34 +0300 |
---|---|---|
committer | Maksim Zakharov <m.zakharov@IBS.RU> | 2022-05-24 09:43:34 +0300 |
commit | 6facd12596ec8b55bab4be04b473de65e1f22018 (patch) | |
tree | 9e82b684a4945431b9d798e2e52293477212ec51 /src/views/SILA/AnalyticalPanel/AnalyticalPanelPage.vue | |
parent | 5c7a1dd3d6a22e02b983a01be39b654b8eaa6ad1 (diff) | |
download | webui-vue-6facd12596ec8b55bab4be04b473de65e1f22018.tar.xz |
Add depend: highcarts. Pages: power, analytical motherboard, memory, fans, event logs, Fix styles, add global components.
Diffstat (limited to 'src/views/SILA/AnalyticalPanel/AnalyticalPanelPage.vue')
-rw-r--r-- | src/views/SILA/AnalyticalPanel/AnalyticalPanelPage.vue | 167 |
1 files changed, 167 insertions, 0 deletions
diff --git a/src/views/SILA/AnalyticalPanel/AnalyticalPanelPage.vue b/src/views/SILA/AnalyticalPanel/AnalyticalPanelPage.vue new file mode 100644 index 00000000..b736f026 --- /dev/null +++ b/src/views/SILA/AnalyticalPanel/AnalyticalPanelPage.vue @@ -0,0 +1,167 @@ +<template> + <b-container fluid="xxl pt-0 m-0"> + <page-title /> + <div class="main-container"> + <div class="tables-container"> + <div class="server-table"> + <span class="semi-bold-16px">Состояние сервера</span> + <b-table + show-empty + responsive="md" + class="bootstrap-analytical-table" + :items="server_items" + :fields="server_fields" + > + <template #cell(value)="{ value }"> + <b-col v-if="value" col="1"> + <img + src="@/assets/images/icon-ok.svg" + class="system-network-table__icon" + /> + </b-col> + <b-col v-else> + <img + src="@/assets/images/icon-no.svg" + class="system-network-table__icon" + /> + </b-col> + </template> + </b-table> + </div> + <div class="events-table"> + <span class="semi-bold-16px">События</span> + <b-table + show-empty + responsive="md" + class="bootstrap-analytical-table" + :items="events_items" + :fields="events_fields" + > + </b-table> + </div> + </div> + </div> + </b-container> +</template> + +<script> +import PageTitle from '@/components/Global/PageTitle'; + +export default { + components: { + PageTitle, + }, + + data() { + return { + server_fields: [ + { + key: 'param', + label: 'Раздел', + formatter: this.dataFormatter, + thClass: 'semi-bold-12px__caps bootstrap-analytical-table__head_bg', + class: 'bootstrap-analytical-table__column-first', + tdClass: 'regular-12px bootstrap-analytical-table__td', + }, + { + key: 'value', + label: 'Статус', + formatter: this.dataFormatter, + thClass: 'semi-bold-12px__caps bootstrap-analytical-table__head_bg', + class: + 'bootstrap-rounded-table__column-last analytical-table__status', + tdClass: 'regular-12px bootstrap-analytical-table__td', + }, + ], + server_items: [ + { param: 'Сервер №1', value: true }, + { param: 'ВМС', value: true }, + { param: 'Аналитическая панель', value: true }, + { param: 'RAID-контроллеры', value: false }, + { param: 'Модули памяти', value: true }, + { param: 'Процессоры', value: true }, + { param: 'Источники питания', value: true }, + { param: 'Вентиляторы', value: true }, + { param: 'Физические накопители', value: true }, + { param: 'Виртуальные накопители', value: true }, + { param: 'Материнская плата', value: true }, + { param: 'Сетевые адаптеры', value: true }, + { param: 'PCI устройства', value: true }, + ], + events_fields: [ + { + key: 'time', + label: 'Время', + formatter: this.dataFormatter, + thClass: 'semi-bold-12px__caps bootstrap-analytical-table__head_bg', + class: 'bootstrap-analytical-table__column-first', + tdClass: 'regular-12px bootstrap-analytical-table__td', + }, + { + key: 'type', + label: 'Тип события', + formatter: this.dataFormatter, + thClass: 'semi-bold-12px__caps bootstrap-analytical-table__head_bg', + tdClass: 'regular-12px bootstrap-analytical-table__td', + }, + { + key: 'info', + label: 'О событии', + formatter: this.dataFormatter, + thClass: 'semi-bold-12px__caps bootstrap-analytical-table__head_bg', + class: 'bootstrap-rounded-table__column-last', + tdClass: 'regular-12px bootstrap-analytical-table__td', + }, + ], + events_items: [ + { time: 'Сервер №1', type: 'Критические', info: 'true' }, + { time: 'ВМС', type: 'Критические', info: 'true' }, + { + time: 'Аналитическая панель', + type: 'Критические', + info: 'true', + }, + { + time: 'RAID-контроллеры', + type: 'Критические', + info: 'false', + }, + { + time: 'Модули памяти', + type: 'Критические', + info: 'true', + }, + { time: 'Процессоры', type: 'Критические', info: 'true' }, + { + time: 'Источники питания', + type: 'Критические', + info: 'true', + }, + { time: 'Вентиляторы', type: 'Критические', info: 'true' }, + { time: 'Физические накопители', type: 'Критические', info: 'true' }, + ], + }; + }, +}; +</script> +<style lang="scss"> +.analytical-table__status { + width: 10%; +} +</style> +<style lang="scss" scoped> +.tables-container { + display: flex; + flex-flow: row nowrap; + margin: 16px 32px; + gap: 24px; +} + +.server-table { + width: 35%; +} + +.events-table { + width: 65%; +} +</style> |