diff options
author | Vitalii Lysak <v.lysak@dunice.net> | 2022-07-25 10:36:05 +0300 |
---|---|---|
committer | Vitalii Lysak <v.lysak@dunice.net> | 2022-07-25 10:36:05 +0300 |
commit | 5367ddb90fef12f6fc1258aaf56dc978168ec07b (patch) | |
tree | db5465de71a6657f5a257d69a6016c0b9c8a429d /src/views/_sila/Fans/Dynamic/FansDynamicPage.vue | |
parent | a9a840960d97d161429ddf37a6431f42a9ecb7a5 (diff) | |
download | webui-vue-5367ddb90fef12f6fc1258aaf56dc978168ec07b.tar.xz |
add tables for dynamic
Diffstat (limited to 'src/views/_sila/Fans/Dynamic/FansDynamicPage.vue')
-rw-r--r-- | src/views/_sila/Fans/Dynamic/FansDynamicPage.vue | 82 |
1 files changed, 82 insertions, 0 deletions
diff --git a/src/views/_sila/Fans/Dynamic/FansDynamicPage.vue b/src/views/_sila/Fans/Dynamic/FansDynamicPage.vue index 22374fa7..37e759bc 100644 --- a/src/views/_sila/Fans/Dynamic/FansDynamicPage.vue +++ b/src/views/_sila/Fans/Dynamic/FansDynamicPage.vue @@ -4,10 +4,46 @@ <chart type="fans" + :colors="colors" :data="filteredSensors" :warning="fanSpeedWarninig" :shutdown="fanSpeedShutdown" ></chart> + + <b-table + v-if="items && items.length > 0" + responsive="md" + show-empty + table-variant="accessory" + hover + :items="items" + :fields="fields" + :empty-text="$t('global.table.emptyMessage')" + > + <template #cell(name)="{ value, index }"> + <div + class="item-color" + :style="`background-color: ${colors[index]}`" + ></div> + {{ value }} + </template> + <template #cell(minDate)="{ value }"> + <span style="color: rgb(12, 28, 41)"> + {{ value.time }} + </span> + <span> + {{ value.date }} + </span> + </template> + <template #cell(maxDate)="{ value }"> + <span style="color: rgb(12, 28, 41)"> + {{ value.time }} + </span> + <span> + {{ value.date }} + </span> + </template> + </b-table> </b-container> </template> @@ -18,6 +54,7 @@ import Chart from '@/components/_sila/Global/Chart'; import DataFormatterMixin from '@/components/_sila/Mixins/DataFormatterMixin'; import LoadingBarMixin from '@/components/_sila/Mixins/LoadingBarMixin'; import TableFilterMixin from '@/components/_sila/Mixins/TableFilterMixin'; +import { getItems } from '@/utilities/_sila/metricProperties'; export default { components: { PageTitle, Chart }, @@ -27,6 +64,37 @@ export default { activeFilters: [], fanSpeedWarninig: 2450, fanSpeedShutdown: 3150, + fields: [ + { + key: 'name', + label: this.$t('pageFans.table.name'), + }, + { + key: 'current', + label: this.$t('pageFans.table.current'), + }, + { + key: 'middle', + label: this.$t('pageFans.table.middle'), + }, + { + key: 'min', + label: this.$t('pageFans.table.min'), + }, + { + key: 'minDate', + label: this.$t('pageFans.table.minDate'), + }, + { + key: 'max', + label: this.$t('pageFans.table.max'), + }, + { + key: 'maxDate', + label: this.$t('pageFans.table.maxDate'), + }, + ], + items: [], }; }, @@ -39,6 +107,20 @@ export default { filteredSensors() { return this.getFilteredTableData(this.allSensors, this.activeFilters); }, + + colors() { + return this.$randomColor({ + count: this.items?.length, + hue: 'random', + luminosity: 'random', + }); + }, + }, + + watch: { + filteredSensors(data) { + this.items = getItems(data); + }, }, created() { |