From b02ccf09ee6bd40f271cb957e131424aec941be4 Mon Sep 17 00:00:00 2001 From: Dietmar Maurer Date: Thu, 31 Aug 2017 13:16:39 +0200 Subject: [PATCH] add hourly mail distribution bar charts --- js/HourlyMailDistribution.js | 105 +++++++++++++++++++++++++++++++++++ js/Makefile | 1 + js/NavigationTree.js | 6 ++ 3 files changed, 112 insertions(+) create mode 100644 js/HourlyMailDistribution.js diff --git a/js/HourlyMailDistribution.js b/js/HourlyMailDistribution.js new file mode 100644 index 0000000..5231a45 --- /dev/null +++ b/js/HourlyMailDistribution.js @@ -0,0 +1,105 @@ +Ext.define('PMG.MailDistChart', { + extend: 'Ext.chart.CartesianChart', + xtype: 'pmgMailDistChart', + + width: 770, + height: 300, + animation: false, + + axes: [{ + type: 'numeric', + title: gettext('Count'), + position: 'left', + grid: true, + minimum: 0 + }, { + type: 'category', + position: 'bottom', + fields: ['index'] + }], + + initComponent: function() { + var me = this; + + + if (!me.store) { + throw "cannot work without store"; + } + + if (!me.field) { + throw "cannot work without a field"; + } + + me.callParent(); + + me.addSeries({ + type: 'bar', + xField: 'index', + yField: me.field, + tooltip: { + trackMouse: true, + renderer: function(tooltip, record, item) { + var start = record.get('index'); + var end = start+1; + tooltip.setHtml('Time: ' + start + ' - ' + end + '
' + + 'Count: ' + record.get(item.field)); + } + } + }); + } +}); + +Ext.define('PMG.HourlyMailDistribution', { + extend: 'Ext.panel.Panel', + xtype: 'pmgHourlyMailDistribution', + + scrollable: true, + + bodyPadding: '0 0 10 0', + defaults: { + margin: '10 10 0 10' + }, + + title: gettext('Hourly Distribution'), + + tbar: [ { xtype: 'pmgStatTimeSelector' } ], + + initComponent: function() { + var me = this; + + var store = Ext.create('PMG.data.StatStore', { + staturl: '/api2/json/statistics/maildistribution', + fields: [ + { type: 'integer', name: 'index' }, + { type: 'integer', name: 'count' }, + { type: 'integer', name: 'count_in' }, + { type: 'integer', name: 'count_out' }, + { type: 'integer', name: 'spamcount_in' }, + { type: 'integer', name: 'spamcount_out' }, + { type: 'integer', name: 'viruscount_in' }, + { type: 'integer', name: 'viruscount_ou' }, + { type: 'integer', name: 'bounces_in' }, + { type: 'integer', name: 'bounces_out' }, + ] + }); + + me.items = [ + { + xtype: 'pmgMailDistChart', + title: gettext('Incoming Mails'), + field: 'count_in', + store: store + }, + { + xtype: 'pmgMailDistChart', + title: gettext('Outgoing Mails'), + field: 'count_out', + store: store + } + ]; + + me.callParent(); + + me.on('destroy', store.destroy, store); + } +}); diff --git a/js/Makefile b/js/Makefile index 10d2588..ad374b5 100644 --- a/js/Makefile +++ b/js/Makefile @@ -59,6 +59,7 @@ JSSRC= \ VirusCharts.js \ SpamScoreDistribution.js \ GeneralMailStatistics.js \ + HourlyMailDistribution.js \ Application.js lint: ${JSSRC} diff --git a/js/NavigationTree.js b/js/NavigationTree.js index fd4a1a9..8c35d12 100644 --- a/js/NavigationTree.js +++ b/js/NavigationTree.js @@ -112,6 +112,12 @@ Ext.define('PMG.store.NavigationStore', { path: 'pmgVirusCharts', border: false, leaf: true + }, + { + text: gettext('Hourly Distribution'), + path: 'pmgHourlyMailDistribution', + border: false, + leaf: true } ] },