diff options
author | Maksim Zakharov <m.zakharov@IBS.RU> | 2022-06-06 18:39:19 +0300 |
---|---|---|
committer | Maksim Zakharov <m.zakharov@IBS.RU> | 2022-06-06 18:39:19 +0300 |
commit | a4dcc4486cba71cd751327184a6651ebcba4e935 (patch) | |
tree | 82ff20e7e7fe8d7a356c68581c4122ee2e136780 /src/views/SILA/AnalyticalPanel/AnalyticalPanelPage.vue | |
parent | 0cbf1713dc23e0039653891fab1fa2c52b4bfaf3 (diff) | |
download | webui-vue-a4dcc4486cba71cd751327184a6651ebcba4e935.tar.xz |
Delete main-container, add global scroll to pages, add global style for logs.
Diffstat (limited to 'src/views/SILA/AnalyticalPanel/AnalyticalPanelPage.vue')
-rw-r--r-- | src/views/SILA/AnalyticalPanel/AnalyticalPanelPage.vue | 225 |
1 files changed, 110 insertions, 115 deletions
diff --git a/src/views/SILA/AnalyticalPanel/AnalyticalPanelPage.vue b/src/views/SILA/AnalyticalPanel/AnalyticalPanelPage.vue index ed4ee19c..8506f143 100644 --- a/src/views/SILA/AnalyticalPanel/AnalyticalPanelPage.vue +++ b/src/views/SILA/AnalyticalPanel/AnalyticalPanelPage.vue @@ -1,136 +1,131 @@ <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">{{ - $t('global.status.serverStatus') - }}</span> + <div class="tables-container"> + <div class="server-table"> + <span class="semi-bold-16px">{{ + $t('global.status.serverStatus') + }}</span> + <b-table + show-empty + responsive="md" + class="bootstrap-analytical-table" + :items="serverItems" + :fields="server_fields" + > + <template #cell(value)="{ value }"> + <b-col v-if="value"> + <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">{{ $t('global.action.events') }}</span> + <div id="events-table-wrapper"> <b-table show-empty + :sticky-header="stickyHeader" responsive="md" class="bootstrap-analytical-table" - :items="serverItems" - :fields="server_fields" + :no-border-collapse="true" + :items="eventsItems" + :fields="events_fields" > - <template #cell(value)="{ value }"> - <b-col v-if="value"> - <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 #cell(date)="{ value }"> + <img + src="@/assets/images/event-logs/time.svg" + class="sourse__img" + /> + <span class="regular-12px quaternary"> {{ value }} </span> </template> - </b-table> - </div> - <div class="events-table"> - <span class="semi-bold-16px">{{ $t('global.action.events') }}</span> - <div id="events-table-wrapper"> - <b-table - show-empty - :sticky-header="stickyHeader" - responsive="md" - class="bootstrap-analytical-table" - :no-border-collapse="true" - :items="eventsItems" - :fields="events_fields" - > - <template #cell(date)="{ value }"> - <img - src="@/assets/images/event-logs/time.svg" - class="sourse__img" - /> - <span class="regular-12px quaternary"> {{ value }} </span> - </template> - <template #cell(type)="{ value }"> - <span - v-if="value === 'Критические'" - class="bold-12px__caps errors" - >{{ value }}</span - > - <span - v-else-if="value === 'Предупреждения'" - class="bold-12px__caps warning" - > - {{ value }} - </span> - <span v-else class="bold-12px__caps information">{{ - value - }}</span> - </template> - <template #cell(description)="data"> - <b-row class="semi-bold-16px tretiatry"> - {{ data.item.description.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"> - {{ - `Краткое описание ошибки или сообщение которое состоит из текста указывающего на предмет ошибки.Краткое описание ошибки или сообщение которое состоит из текста указывающего на предмет ошибки. + <template #cell(type)="{ value }"> + <span + v-if="value === 'Критические'" + class="bold-12px__caps errors" + >{{ value }}</span + > + <span + v-else-if="value === 'Предупреждения'" + class="bold-12px__caps warning" + > + {{ value }} + </span> + <span v-else class="bold-12px__caps information">{{ + value + }}</span> + </template> + <template #cell(description)="data"> + <b-row class="semi-bold-16px tretiatry"> + {{ data.item.description.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(eventsItems[index].description.description) }} - </span> - </b-col> - </b-container> - </template> - </b-table> - </div> + }} + {{ $t(eventsItems[index].description.description) }} + </span> + </b-col> + </b-container> + </template> + </b-table> </div> </div> - <div class="indicators-container"> - <span class="bold-16px">{{ $t('global.status.indicators') }}</span> - <span class="indicators-units regular-12px tretiatry"> - {{ $t('global.units.unit') }}</span + </div> + <div class="indicators-container"> + <span class="bold-16px">{{ $t('global.status.indicators') }}</span> + <span class="indicators-units regular-12px tretiatry"> + {{ $t('global.units.unit') }}</span + > + <b-button id="popover-choice-1" variant="unstiled"> + <span class="regular-12px units-label"> + {{ + $t(`global.units.${unit === 'Ампераж' ? 'amper' : 'volt'}`) + }}</span > - <b-button id="popover-choice-1" variant="unstiled"> - <span class="regular-12px units-label"> - {{ - $t(`global.units.${unit === 'Ампераж' ? 'amper' : 'volt'}`) - }}</span - > - <img class="units__icon" src="@/assets/images/icon-chevron-red.svg" /> - </b-button> - </div> - <two-chioce-popover - :id="1" - fitst-option="Ампераж" - second-option="Вольтаж" - :chosen-option="unit" - :first-action="selectAmper" - :second-action="selectVolt" - /> - <!-- <unit-popover + <img class="units__icon" src="@/assets/images/icon-chevron-red.svg" /> + </b-button> + </div> + <two-chioce-popover + :id="1" + fitst-option="Ампераж" + second-option="Вольтаж" + :chosen-option="unit" + :first-action="selectAmper" + :second-action="selectVolt" + /> + <!-- <unit-popover :select-amper="selectAmper" :select-volt="selectVolt" :unit="unit" /> --> - <date-switch - :switch-time-scale="switchTimeScale" - :time-scale="timeScale" - /> - <accessory-table :records="accessoryData.power" /> - <power-table :time-scale="timeScale" /> - <div class="tables-container"> - <span class="semi-bold-16px">Управление</span> - </div> - <control-system /> + <date-switch :switch-time-scale="switchTimeScale" :time-scale="timeScale" /> + <accessory-table :records="accessoryData.power" /> + <power-table :time-scale="timeScale" /> + <div class="tables-container"> + <span class="semi-bold-16px">Управление</span> </div> + <control-system /> </b-container> </template> |