Mizah/mizzkey
1
0
Fork 0
Code Issues Pull requests Actions Packages Projects Releases Wiki Activity

Better queue chart

Browse source
This commit is contained in:
syuilo 2019-03-15 13:09:19 +09:00
parent bf5d43054b
commit 09e25e6a02
No known key found for this signature in database
GPG key ID: BDC4C49D06AB9D69
2 changed files with 9 additions and 7 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

14
src/client/app/admin/views/queue.vue
View file

@ -9,7 +9,7 @@
<ui-input :value="latestStats.deliver.activeSincePrevTick | number" type="text" readonly> <ui-input :value="latestStats.deliver.activeSincePrevTick | number" type="text" readonly>
<span>Process</span> <span>Process</span>
<template #prefix><fa :icon="fasPlayCircle"/></template> <template #prefix><fa :icon="fasPlayCircle"/></template>
<template #suffix>jobs/s</template> <template #suffix>jobs/tick</template>
</ui-input> </ui-input>
<ui-input :value="latestStats.deliver.active | number" type="text" readonly> <ui-input :value="latestStats.deliver.active | number" type="text" readonly>
<span>Active</span> <span>Active</span>
@ -36,7 +36,7 @@
<ui-input :value="latestStats.inbox.activeSincePrevTick | number" type="text" readonly> <ui-input :value="latestStats.inbox.activeSincePrevTick | number" type="text" readonly>
<span>Process</span> <span>Process</span>
<template #prefix><fa :icon="fasPlayCircle"/></template> <template #prefix><fa :icon="fasPlayCircle"/></template>
<template #suffix>jobs/s</template> <template #suffix>jobs/tick</template>
</ui-input> </ui-input>
<ui-input :value="latestStats.inbox.active | number" type="text" readonly> <ui-input :value="latestStats.inbox.active | number" type="text" readonly>
<span>Active</span> <span>Active</span>
@ -131,8 +131,10 @@ export default Vue.extend({
}, },
mounted() { mounted() {
const chartOpts = { const chartOpts = id => ({
chart: { chart: {
id,
group: 'queue',
type: 'area', type: 'area',
height: 200, height: 200,
animations: { animations: {
@ -186,10 +188,10 @@ export default Vue.extend({
show: false, show: false,
min: 0, min: 0,
} }
}; });
this.inboxChart = new ApexCharts(this.$refs.inboxChart, chartOpts); this.inboxChart = new ApexCharts(this.$refs.inboxChart, chartOpts('a'));
this.deliverChart = new ApexCharts(this.$refs.deliverChart, chartOpts); this.deliverChart = new ApexCharts(this.$refs.deliverChart, chartOpts('b'));
this.inboxChart.render(); this.inboxChart.render();
this.deliverChart.render(); this.deliverChart.render();

2
src/daemons/queue-stats.ts
View file

@ -4,7 +4,7 @@ import { deliverQueue, inboxQueue } from '../queue';
const ev = new Xev(); const ev = new Xev();
const interval = 1000; const interval = 2000;
/** /**
* Report queue stats regularly * Report queue stats regularly