diff options
Diffstat (limited to 'src/client/app/desktop/views/pages/admin/admin.users-chart.chart.vue')
| -rw-r--r-- | src/client/app/desktop/views/pages/admin/admin.users-chart.chart.vue | 74 |
1 files changed, 0 insertions, 74 deletions
diff --git a/src/client/app/desktop/views/pages/admin/admin.users-chart.chart.vue b/src/client/app/desktop/views/pages/admin/admin.users-chart.chart.vue deleted file mode 100644 index 45ecc13929..0000000000 --- a/src/client/app/desktop/views/pages/admin/admin.users-chart.chart.vue +++ /dev/null @@ -1,74 +0,0 @@ -<template> -<div> - <a @click="span = 'day'">Per day</a> | <a @click="span = 'hour'">Per hour</a> - <svg :viewBox="`0 0 ${ viewBoxX } ${ viewBoxY }`"> - <polyline - :points="points" - fill="none" - stroke-width="0.3" - stroke="#555"/> - </svg> -</div> -</template> - -<script lang="ts"> -import Vue from 'vue'; - -export default Vue.extend({ - props: { - chart: { - required: true - }, - type: { - type: String, - required: true - } - }, - data() { - return { - viewBoxX: 100, - viewBoxY: 30, - points: null, - span: 'day' - }; - }, - computed: { - stats(): any[] { - return ( - this.span == 'day' ? this.chart.perDay : - this.span == 'hour' ? this.chart.perHour : - null - ); - } - }, - watch: { - stats() { - this.render(); - } - }, - mounted() { - this.render(); - }, - methods: { - render() { - const peak = Math.max.apply(null, this.stats.map(d => this.type == 'local' ? d.users.local.diff : d.users.remote.diff)); - - if (peak != 0) { - const data = this.stats.slice().reverse().map(x => ({ - count: this.type == 'local' ? x.users.local.diff : x.users.remote.diff - })); - - this.points = data.map((d, i) => `${(this.viewBoxX / data.length) * i},${(1 - (d.count / peak)) * this.viewBoxY}`).join(' '); - } - } - } -}); -</script> - -<style lang="stylus" scoped> -svg - display block - padding 10px - width 100% - -</style> |