1 files changed, 167 insertions, 0 deletions
diff --git a/src/views/_sila/Fans/DynamicInformation/IndicatorsTable.vue b/src/views/_sila/Fans/DynamicInformation/IndicatorsTable.vue
new file mode 100644
index 00000000..4da9a556
--- /dev/null
+++ b/src/views/_sila/Fans/DynamicInformation/IndicatorsTable.vue
@@ -0,0 +1,167 @@
+<template>
+  <page-section class="bootstrap-table__section">
+    <span class="bold-12px__caps">
+      {{ $t('fansPage.valueIndicators') }}
+    </span>
+    <b-table
+      responsive="md"
+      class="table-accessory"
+      no-border-collapse
+      :items="filteredSensors"
+      :busy="isBusy"
+      :fields="fields"
+    >
+      <template #cell(name)="{ value, index }">
+        <div
+          class="fans-colors"
+          :style="`background-color: ${colors[index]}`"
+        ></div>
+        <span class="regular-12px tretiatry">
+          {{ value }}
+        </span>
+      </template>
+      <template #cell(middleSpeed)="{ value }">
+        <span class="regular-12px">
+          {{ value.time }}
+        </span>
+        <span class="regular-12px tretiatry">
+          {{ value.date }}
+        </span>
+      </template>
+      <template #cell(minSpeedDate)="{ value }">
+        <span class="regular-12px">
+          {{ value.time }}
+        </span>
+        <span class="regular-12px tretiatry">
+          {{ value.date }}
+        </span>
+      </template>
+      <template #cell(maxSpeedDate)="{ value }">
+        <span class="regular-12px">
+          {{ value.time }}
+        </span>
+        <span class="regular-12px tretiatry">
+          {{ value.date }}
+        </span>
+      </template>
+    </b-table>
+  </page-section>
+</template>
+
+<script>
+import PageSection from '@/components/Global/PageSection';
+import { colors } from './helpers';
+
+import TableFilterMixin from '@/components/Mixins/TableFilterMixin';
+import DataFormatterMixin from '@/components/Mixins/DataFormatterMixin';
+import LoadingBarMixin from '@/components/Mixins/LoadingBarMixin';
+
+export default {
+  components: { PageSection },
+  mixins: [TableFilterMixin, DataFormatterMixin, LoadingBarMixin],
+  data() {
+    return {
+      isBusy: true,
+      colors,
+      fields: [
+        {
+          key: 'name',
+          label: 'Имя модуля',
+          formatter: this.dataFormatter,
+        },
+        {
+          key: 'currentValue',
+          label: 'Текущая',
+          formatter: this.dataFormatter,
+        },
+        {
+          key: 'middleSpeed',
+          label: 'Средняя',
+          formatter: this.dataFormatter,
+        },
+        {
+          key: 'lowerCaution',
+          label: 'Минимальная',
+          formatter: this.dataFormatter,
+        },
+        {
+          key: 'minSpeedDate',
+          label: 'Дата минимальной',
+          formatter: this.dataFormatter,
+        },
+        {
+          key: 'upperCaution',
+          label: 'Максимальная',
+          formatter: this.dataFormatter,
+        },
+        {
+          key: 'maxSpeedDate',
+          label: 'Дата максимальной',
+          formatter: this.dataFormatter,
+        },
+      ],
+    };
+  },
+
+  computed: {
+    allSensors() {
+      let sensors = this.$store.getters['sensors/fanSensors'];
+      if (this.isSensorsExist) {
+        sensors.forEach((sensor) => {
+          sensor.type = sensor.name.toLowerCase().includes('cpu')
+            ? this.$t('tablesDescription.cpu')
+            : this.$t('tablesDescription.system');
+        });
+      }
+      return sensors;
+    },
+
+    isSensorsExist() {
+      return (
+        this.$store.getters['sensors/fanSensors'] &&
+        this.$store.getters['sensors/fanSensors'].length > 0
+      );
+    },
+
+    filteredSensors() {
+      return this.getFilteredTableData(this.allSensors, this.activeFilters);
+    },
+  },
+
+  watch: {
+    filteredSensors(value) {
+      if (value && value.length > 0) {
+        this.colors = this.$randomColor({
+          count: value.length,
+          hue: 'random',
+          luminosity: 'random',
+        });
+      }
+    },
+  },
+
+  created() {
+    this.startLoader();
+    this.$store.dispatch('sensors/getFanSensors').finally(() => {
+      this.endLoader();
+      this.isBusy = false;
+    });
+  },
+};
+</script>
+<style lang="scss" scoped>
+.fans-colors {
+  display: inline-block;
+  width: 8px;
+  height: 8px;
+  border-radius: 2px;
+}
+.row {
+  align-items: center;
+  flex-wrap: nowrap;
+  justify-content: flex-end;
+}
+.medium-12px {
+  color: $text-primary !important;
+}
+</style>