diff options
author | Vitalii Lysak <v.lysak@dunice.net> | 2022-07-21 13:02:11 +0300 |
---|---|---|
committer | Vitalii Lysak <v.lysak@dunice.net> | 2022-07-21 13:02:11 +0300 |
commit | e389d00a0c024b90983d40ff771684c5680fe2f5 (patch) | |
tree | 2f52247d76d005ba73164c6c089bb1e831346f4c /src/components/_sila/Global/Chart.vue | |
parent | d7e60a3db8f09deef39e2f798eef121be414d40a (diff) | |
download | webui-vue-e389d00a0c024b90983d40ff771684c5680fe2f5.tar.xz |
code clean
Diffstat (limited to 'src/components/_sila/Global/Chart.vue')
-rw-r--r-- | src/components/_sila/Global/Chart.vue | 47 |
1 files changed, 30 insertions, 17 deletions
diff --git a/src/components/_sila/Global/Chart.vue b/src/components/_sila/Global/Chart.vue index 73c5a6f2..24ad77d6 100644 --- a/src/components/_sila/Global/Chart.vue +++ b/src/components/_sila/Global/Chart.vue @@ -3,7 +3,7 @@ </template> <script> -import { setTime, setCategories } from './helpers'; +import { setCategories } from './helpers'; import { Chart } from 'highcharts-vue'; export default { @@ -33,8 +33,8 @@ export default { }, }, computed: { - groupData() { - let tr = this.data.map((metric) => { + metricData() { + let transform = this.data.map((metric) => { let date = new Date(metric.Timestamp); let time = date.getHours() + ':' + String(date.getMinutes()).padStart(2, '0'); @@ -45,20 +45,17 @@ export default { }; }); - let group = tr.reduce(function (rv, x) { + let group = transform.reduce(function (rv, x) { (rv[x['MetricProperty']] = rv[x['MetricProperty']] || []).push(x); return rv; }, {}); - let arr = Object.keys(group).map((key) => { + let metricArr = Object.keys(group).map((key) => { let groupTime = group[key].reduce(function (rv, x) { (rv[x['Timestamp']] = rv[x['Timestamp']] || []).push(x); return rv; }, {}); - this.timeData = Object.keys(groupTime).slice(-60); - console.log('timeData!!!!!!', this.timeData); - let arr = Object.keys(groupTime).map((key) => { const findAverage = (arr) => { const { length } = arr; @@ -75,7 +72,29 @@ export default { }; }); - return arr; + return metricArr; + }, + + metricTime() { + let transform = this.data.map((metric) => { + let date = new Date(metric.Timestamp); + let time = + date.getHours() + ':' + String(date.getMinutes()).padStart(2, '0'); + return { + ...metric, + Timestamp: time, + MetricValue: Math.round(metric.MetricValue), + }; + }); + + let timeGroup = transform.reduce(function (rv, x) { + (rv[x['Timestamp']] = rv[x['Timestamp']] || []).push(x); + return rv; + }, {}); + + let timeArr = Object.keys(timeGroup).slice(-60); + + return timeArr; }, chartOptions() { @@ -87,7 +106,7 @@ export default { }, title: null, xAxis: { - categories: setTime(60, 'hour'), + categories: this.metricTime, title: null, labels: { step: 10, @@ -137,7 +156,7 @@ export default { }, ], }, - series: this.groupData.map((item) => ({ + series: this.metricData.map((item) => ({ ...item, marker: { enabled: false, @@ -158,12 +177,6 @@ export default { }; }, }, - - /* watch: { - groupData() { - console.log('group data!!!', this.groupData); - }, - },*/ }; </script> <style lang="scss"> |