summaryrefslogtreecommitdiff
path: root/src/views/PowerSupplies/Specification/PowerStaticPage.vue
diff options
context:
space:
mode:
authorMaksim Zakharov <m.zakharov@IBS.RU>2022-05-24 09:43:34 +0300
committerMaksim Zakharov <m.zakharov@IBS.RU>2022-05-24 09:43:34 +0300
commit6facd12596ec8b55bab4be04b473de65e1f22018 (patch)
tree9e82b684a4945431b9d798e2e52293477212ec51 /src/views/PowerSupplies/Specification/PowerStaticPage.vue
parent5c7a1dd3d6a22e02b983a01be39b654b8eaa6ad1 (diff)
downloadwebui-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/PowerSupplies/Specification/PowerStaticPage.vue')
-rw-r--r--src/views/PowerSupplies/Specification/PowerStaticPage.vue154
1 files changed, 154 insertions, 0 deletions
diff --git a/src/views/PowerSupplies/Specification/PowerStaticPage.vue b/src/views/PowerSupplies/Specification/PowerStaticPage.vue
new file mode 100644
index 00000000..463e9ea2
--- /dev/null
+++ b/src/views/PowerSupplies/Specification/PowerStaticPage.vue
@@ -0,0 +1,154 @@
+<template>
+ <b-container
+ :style="{ display: 'flex', 'flex-direction': 'column' }"
+ fluid="xxl pt-0 m-0"
+ >
+ <page-title />
+ <div class="main-container">
+ <page-section class="bootstrap-table__section info_section">
+ <span class="bold-16px">{{ $t('pageInventory.powerSources') }}</span>
+ </page-section>
+ <power-switch
+ :slots="memorySlots"
+ :switch-memory="switchMemorySlot"
+ :current-memory="currentMemorySlot"
+ />
+ <page-section class="bootstrap-table__section">
+ <b-table
+ responsive="md"
+ show-empty
+ class="bootstrap-rounded-table"
+ :items="items_slots"
+ :fields="fields"
+ :empty-text="$t('global.table.emptyMessage')"
+ >
+ <template #cell(value)="{ index, value }">
+ <b-row v-if="index === 0">
+ <b-col cols="11">
+ <span>
+ {{ 'Работоспособность' }}
+ </span>
+ </b-col>
+ <b-col cols="1">
+ <img
+ src="@/assets/images/fans-page/working.svg"
+ class="icon-chevron"
+ />
+ </b-col>
+ </b-row>
+ <b-row v-else>
+ <b-col>
+ <span>{{ value }}</span>
+ </b-col>
+ </b-row>
+ </template>
+ </b-table>
+ </page-section>
+ </div>
+ </b-container>
+</template>
+
+<script>
+import PageTitle from '@/components/Global/PageTitle';
+import PageSection from '@/components/Global/PageSection';
+import PowerSwitch from './PowerSwitch';
+
+export default {
+ components: { PageTitle, PageSection, PowerSwitch },
+ data() {
+ return {
+ currentMemorySlot: 1,
+ memorySlots: [
+ { id: 1, name: 'Источник 1' },
+ { id: 2, name: 'Источник 2' },
+ { id: 3, name: 'Источник 3' },
+ { id: 4, name: 'Источник 4' },
+ { id: 5, name: 'Источник 5' },
+ { id: 6, name: 'Источник 6' },
+ { id: 7, name: 'Источник 7' },
+ { id: 8, name: 'Источник 8' },
+ { id: 9, name: 'Источник 9' },
+ { id: 10, name: 'Источник 10' },
+ { id: 11, name: 'Источник 11' },
+ { id: 12, name: 'Источник 12' },
+ { id: 13, name: 'Источник 13' },
+ { id: 14, name: 'Источник 14' },
+ { id: 15, name: 'Источник 15' },
+ ],
+ fields: [
+ {
+ key: 'parametr',
+ label: 'Параметр',
+ formatter: this.dataFormatter,
+ thClass: 'semi-bold-12px__caps bootstrap-rounded-table__head_bg',
+ class: `bootstrap-rounded-table__column-first
+ memory-table-col-first`,
+ tdClass: 'regular-12px bootstrap-rounded-table__td',
+ },
+ {
+ key: 'value',
+ label: 'Значение',
+ formatter: this.dataFormatter,
+ thClass: 'semi-bold-12px__caps bootstrap-rounded-table__head_bg',
+ class: 'bootstrap-rounded-table__column-last',
+ tdClass: 'regular-12px bootstrap-rounded-table__td',
+ },
+ ],
+ items_slots: [
+ {
+ parametr: 'Статус',
+ value: true,
+ },
+ {
+ parametr: 'Название',
+ value: 'Источник 1',
+ },
+ {
+ parametr: 'Версия прошивки',
+ value: '1.1.2257',
+ },
+ {
+ parametr: 'Серийный номер',
+ value: '4789564478551',
+ },
+ {
+ parametr: 'Номинальное напряжение',
+ value: '220 В',
+ },
+ {
+ parametr: 'Номинальная мощность',
+ value: '400 Вт',
+ },
+ {
+ parametr: 'Поддержка горячей замены',
+ value: 'Есть',
+ },
+ ],
+ };
+ },
+ methods: {
+ switchMemorySlot(period) {
+ this.currentMemorySlot = period;
+ },
+ },
+};
+</script>
+<style lang="scss">
+.memory-table-col-first {
+ width: 50%;
+}
+</style>
+
+<style lang="scss" scoped>
+.bootstrap-table__section {
+ margin-bottom: 24px;
+}
+.info_section {
+ margin-bottom: 0px;
+}
+
+.bold-16px {
+ display: block;
+ margin: 25px 0 16px 0;
+}
+</style>