1 | $(document).ready(() => { |
||
2 | $('.selectpicker').selectpicker(); |
||
3 | |||
4 | loadInitialProduct(); |
||
5 | |||
6 | document.getElementById('id_select_product').onchange = updateTestPlanSelect; |
||
7 | document.getElementById('id_select_test_plan').onchange = reloadCharts; |
||
8 | }); |
||
9 | |||
10 | function loadInitialProduct() { |
||
11 | jsonRPC('Product.filter', {}, data => { |
||
12 | updateSelect(data, '#id_select_product', 'id', 'name'); |
||
13 | reloadCharts(); |
||
14 | }); |
||
15 | } |
||
16 | |||
17 | function updateTestPlanSelect() { |
||
18 | const productId = $('#id_select_product').val(); |
||
19 | |||
20 | if (!productId) { |
||
21 | updateSelect([], '#id_select_test_plan', 'plan_id', 'name'); |
||
22 | reloadCharts(); |
||
23 | return; |
||
24 | } |
||
25 | jsonRPC('TestPlan.filter', {'product_id': productId}, data => { |
||
26 | updateSelect(data, '#id_select_test_plan', 'plan_id', 'name'); |
||
27 | reloadCharts(); |
||
28 | }) |
||
29 | } |
||
30 | |||
31 | function reloadCharts() { |
||
32 | const query = {}; |
||
33 | |||
34 | const testPlanId = $('#id_select_test_plan').val(); |
||
35 | const productId = $('#id_select_product').val(); |
||
36 | |||
37 | if (testPlanId) { |
||
38 | query['plan'] = testPlanId; |
||
39 | } else if (productId) { |
||
40 | query['category__product_id'] = productId; |
||
41 | } |
||
42 | jsonRPC('Testing.breakdown', query, result => { |
||
43 | drawAutomatedBar(result.count); |
||
44 | drawPrioritiesChart(result.priorities); |
||
45 | drawCategoriesChart(result.categories); |
||
46 | }, true); |
||
47 | } |
||
48 | |||
49 | function drawAutomatedBar(count) { |
||
50 | d3.select('#total-count') |
||
0 ignored issues
–
show
|
|||
51 | .style('font-weight', 'bold') |
||
52 | .style('font-size', '18px') |
||
53 | .text(count.all); |
||
54 | |||
55 | d3.selectAll('.progress-bar') |
||
56 | .attr('aria-valuemin', '0') |
||
57 | .attr('aria-valuemax', '100'); |
||
58 | |||
59 | const automatedPercent = count.automated / count.all * 100; |
||
60 | |||
61 | d3.select('.automated-bar') |
||
62 | .attr('aria-valuenow', `${automatedPercent}`) |
||
63 | .attr('title', `${count.automated} Automated`) |
||
64 | .style('width', `${automatedPercent}%`); |
||
65 | |||
66 | $('.automated-bar').tooltip(); |
||
67 | |||
68 | const manualPercent = count.manual / count.all * 100; |
||
69 | |||
70 | d3.select('.manual-bar') |
||
71 | .attr('aria-valuenow', `${manualPercent}`) |
||
72 | .attr('title', `${count.manual} Manual`) |
||
73 | .style('width', `${manualPercent}%`); |
||
74 | |||
75 | $('.manual-bar').tooltip(); |
||
76 | } |
||
77 | |||
78 | function drawPrioritiesChart(priorities) { |
||
79 | drawChart(priorities, 'priority', '#priorities-chart'); |
||
80 | } |
||
81 | |||
82 | function drawCategoriesChart(categories) { |
||
83 | drawChart(categories, 'category', '#categories-chart'); |
||
84 | } |
||
85 | |||
86 | function drawChart(data, type, selector) { |
||
87 | const names = []; |
||
88 | const values = [[type]]; |
||
89 | data.forEach(c => { |
||
90 | names.push(c[0]); |
||
91 | values[0].push(c[1]); |
||
92 | }); |
||
93 | |||
94 | let chartConfig = $().c3ChartDefaults().getDefaultBarConfig(names); |
||
95 | chartConfig.bindto = selector; |
||
96 | chartConfig.axis = { |
||
97 | x: { |
||
98 | categories: names, |
||
99 | type: 'category', |
||
100 | }, |
||
101 | y: { |
||
102 | tick: { |
||
103 | format: showOnlyRoundNumbers |
||
104 | } |
||
105 | } |
||
106 | }; |
||
107 | chartConfig.data = { |
||
108 | type: 'bar', |
||
109 | columns: values, |
||
110 | }; |
||
111 | chartConfig.grid = { |
||
112 | show: false |
||
113 | }; |
||
114 | |||
115 | c3.generate(chartConfig); |
||
0 ignored issues
–
show
The variable
c3 seems to be never declared. If this is a global, consider adding a /** global: c3 */ comment.
This checks looks for references to variables that have not been declared. This is most likey a typographical error or a variable has been renamed. To learn more about declaring variables in Javascript, see the MDN.
Loading history...
|
|||
116 | } |
||
117 | |||
118 | function showOnlyRoundNumbers(number) { |
||
119 | if (number % 1 === 0) { |
||
120 | return number; |
||
121 | } |
||
122 | return ''; |
||
123 | } |
||
124 |
This checks looks for references to variables that have not been declared. This is most likey a typographical error or a variable has been renamed.
To learn more about declaring variables in Javascript, see the MDN.