From 202c599e71cb6691e12fa516b579b2b0007b94f1 Mon Sep 17 00:00:00 2001 From: Yoshie Muranaka Date: Thu, 18 Jun 2020 12:02:57 -0700 Subject: Update Sensors page to use table mixins - Add number formatting to TableDataFormatter mixin - Use TableDataFormatter mixin to show different status icons for sensor status (OK, Warning, Critical) - Use TableSortMixin to sort by status (OK, Warning, Critical) Signed-off-by: Yoshie Muranaka Change-Id: I99899bbc19db3529f0fdfe34be30b09d41456b42 --- src/components/Mixins/TableDataFormatterMixin.js | 2 + src/views/Health/Sensors/Sensors.vue | 47 ++++++++---------------- 2 files changed, 18 insertions(+), 31 deletions(-) diff --git a/src/components/Mixins/TableDataFormatterMixin.js b/src/components/Mixins/TableDataFormatterMixin.js index 77db7de9..3e15926a 100644 --- a/src/components/Mixins/TableDataFormatterMixin.js +++ b/src/components/Mixins/TableDataFormatterMixin.js @@ -3,6 +3,8 @@ const TableDataFormatterMixin = { tableFormatter(value) { if (value === undefined || value === null || value === '') { return '--'; + } else if (typeof value === 'number') { + return parseFloat(value.toFixed(3)); } else { return value; } diff --git a/src/views/Health/Sensors/Sensors.vue b/src/views/Health/Sensors/Sensors.vue index 3b368976..879e2363 100644 --- a/src/views/Health/Sensors/Sensors.vue +++ b/src/views/Health/Sensors/Sensors.vue @@ -92,15 +92,8 @@ import TableToolbarExport from '@/components/Global/TableToolbarExport'; import TableFilterMixin from '../../../components/Mixins/TableFilterMixin'; import BVTableSelectableMixin from '@/components/Mixins/BVTableSelectableMixin'; import LoadingBarMixin from '@/components/Mixins/LoadingBarMixin'; - -const SENSOR_STATUS = ['OK', 'Warning', 'Critical']; - -const valueFormatter = value => { - if (value === null || value === undefined) { - return '--'; - } - return parseFloat(value.toFixed(3)); -}; +import TableDataFormatterMixin from '@/components/Mixins/TableDataFormatterMixin'; +import TableSortMixin from '@/components/Mixins/TableSortMixin'; export default { name: 'Sensors', @@ -112,7 +105,13 @@ export default { TableToolbar, TableToolbarExport }, - mixins: [TableFilterMixin, BVTableSelectableMixin, LoadingBarMixin], + mixins: [ + TableFilterMixin, + BVTableSelectableMixin, + LoadingBarMixin, + TableDataFormatterMixin, + TableSortMixin + ], data() { return { fields: [ @@ -133,35 +132,35 @@ export default { }, { key: 'lowerCritical', - formatter: valueFormatter, + formatter: this.tableFormatter, label: this.$t('pageSensors.table.lowerCritical') }, { key: 'lowerCaution', - formatter: valueFormatter, + formatter: this.tableFormatter, label: this.$t('pageSensors.table.lowerWarning') }, { key: 'currentValue', - formatter: valueFormatter, + formatter: this.tableFormatter, label: this.$t('pageSensors.table.currentValue') }, { key: 'upperCaution', - formatter: valueFormatter, + formatter: this.tableFormatter, label: this.$t('pageSensors.table.upperWarning') }, { key: 'upperCritical', - formatter: valueFormatter, + formatter: this.tableFormatter, label: this.$t('pageSensors.table.upperCritical') } ], tableFilters: [ { label: this.$t('pageSensors.table.status'), - values: SENSOR_STATUS + values: ['OK', 'Warning', 'Critical'] } ], activeFilters: [], @@ -187,23 +186,9 @@ export default { next(); }, methods: { - statusIcon(status) { - switch (status) { - case SENSOR_STATUS[0]: - return 'success'; - case SENSOR_STATUS[1]: - return 'warning'; - case SENSOR_STATUS[2]: - return 'danger'; - default: - return ''; - } - }, sortCompare(a, b, key) { if (key === 'status') { - return ( - SENSOR_STATUS.indexOf(a.status) - SENSOR_STATUS.indexOf(b.status) - ); + return this.sortStatus(a, b, key); } }, onFilterChange({ activeFilters }) { -- cgit v1.2.3