Convert task distribution chart to Vue.js component

1 files changed, 18 insertions, 0 deletions

diff --git a/assets/js/components/chart-project-task-distribution.js b/assets/js/components/chart-project-task-distribution.js
new file mode 100644
index 00000000..b5d712ce
--- /dev/null
+++ b/assets/js/components/chart-project-task-distribution.js
@@ -0,0 +1,18 @@
+Vue.component('chart-project-task-distribution', {
+    props: ['metrics'],
+    template: '<div id="chart"></div>',
+    ready: function () {
+        var columns = [];
+
+        for (var i = 0; i < this.metrics.length; i++) {
+            columns.push([this.metrics[i].column_title, this.metrics[i].nb_tasks]);
+        }
+
+        c3.generate({
+            data: {
+                columns: columns,
+                type : 'donut'
+            }
+        });
+    }
+});