diff --git a/frontend/src/components/Stats/SpiderStats.vue b/frontend/src/components/Stats/SpiderStats.vue index 5bc5608b..24a9b257 100644 --- a/frontend/src/components/Stats/SpiderStats.vue +++ b/frontend/src/components/Stats/SpiderStats.vue @@ -27,7 +27,7 @@

{{$t('Tasks by Status')}}

-
+
@@ -41,8 +41,8 @@ -

{{$t('Long Tasks')}}

- +

{{$t('Tasks by Node')}}

+
@@ -66,8 +66,8 @@ export default { name: 'SpiderStats', components: { MetricCard }, methods: { - renderTaskPie () { - const chart = echarts.init(this.$el.querySelector('#task-pie')) + renderTaskPieStatus () { + const chart = echarts.init(this.$el.querySelector('#task-pie-status')) const option = { series: [{ name: '', @@ -97,6 +97,27 @@ export default { chart.setOption(option) }, + renderTaskPieNode () { + const chart = echarts.init(this.$el.querySelector('#task-pie-node')) + const option = { + series: [{ + name: '', + type: 'pie', + radius: ['50%', '70%'], + data: this.nodeStats.map(d => { + return { + name: d.name, + value: d.value + // itemStyle: { + // color + // } + } + }) + }] + } + chart.setOption(option) + }, + renderTaskLine () { const chart = echarts.init(this.$el.querySelector('#task-line')) const option = { @@ -154,8 +175,9 @@ export default { }, render () { - this.renderTaskPie() + this.renderTaskPieStatus() this.renderTaskLine() + this.renderTaskPieNode() this.renderDurationLine() }, @@ -180,6 +202,7 @@ export default { ...mapState('spider', [ 'overviewStats', 'statusStats', + 'nodeStats', 'dailyStats' ]) }, diff --git a/frontend/src/store/modules/spider.js b/frontend/src/store/modules/spider.js index bb7d948f..b8345082 100644 --- a/frontend/src/store/modules/spider.js +++ b/frontend/src/store/modules/spider.js @@ -23,7 +23,10 @@ const state = { statusStats: [], // spider daily stats - dailyStats: [] + dailyStats: [], + + // spider node stats + nodeStats: [] } const getters = {} @@ -49,7 +52,10 @@ const mutations = { }, SET_DAILY_STATS (state, value) { state.dailyStats = value - } + }, + SET_NODE_STATS (state, value) { + state.nodeStats = value + }, } const actions = { @@ -163,6 +169,7 @@ const actions = { commit('SET_OVERVIEW_STATS', response.data.overview) commit('SET_STATUS_STATS', response.data.task_count_by_status) commit('SET_DAILY_STATS', response.data.daily_stats) + commit('SET_NODE_STATS', response.data.task_count_by_node) }) } }