summaryrefslogtreecommitdiff
path: root/code_backend_theme/static/src/js/fields
diff options
context:
space:
mode:
authorstephanchrst <stephanchrst@gmail.com>2022-05-10 17:14:58 +0700
committerstephanchrst <stephanchrst@gmail.com>2022-05-10 17:14:58 +0700
commit1ca3b3df3421961caec3b747a364071c80f5c7da (patch)
tree6778a1f0f3f9b4c6e26d6d87ccde16e24da6c9d6 /code_backend_theme/static/src/js/fields
parentb57188be371d36d96caac4b8d65a40745c0e972c (diff)
initial commit
Diffstat (limited to 'code_backend_theme/static/src/js/fields')
-rw-r--r--code_backend_theme/static/src/js/fields/basic_fields.js53
-rw-r--r--code_backend_theme/static/src/js/fields/graph.js101
2 files changed, 154 insertions, 0 deletions
diff --git a/code_backend_theme/static/src/js/fields/basic_fields.js b/code_backend_theme/static/src/js/fields/basic_fields.js
new file mode 100644
index 0000000..1680bd9
--- /dev/null
+++ b/code_backend_theme/static/src/js/fields/basic_fields.js
@@ -0,0 +1,53 @@
+odoo.define('code_backend_theme.fields', function (require) {
+ "use strict";
+
+ var basic_fields = require("web.basic_fields");
+
+ //Changing Sales Team Graph color
+ var SalesTeamGraph = basic_fields.JournalDashboardGraph.include({
+
+ _getBarChartConfig: function () {
+ this._super();
+ var data = [];
+ var labels = [];
+ var backgroundColor = [];
+
+ this.data[0].values.forEach(function (pt) {
+ data.push(pt.value);
+ labels.push(pt.label);
+ var color = pt.type === 'past' ? '#ccbdc8' : (pt.type === 'future' ? '#f1b44c' : '#556ee6');
+ backgroundColor.push(color);
+ });
+ return {
+ type: 'bar',
+ data: {
+ labels: labels,
+ datasets: [{
+ data: data,
+ fill: 'start',
+ label: this.data[0].key,
+ backgroundColor: backgroundColor,
+ }]
+ },
+ options: {
+ legend: {display: false},
+ scales: {
+ yAxes: [{display: false}],
+ },
+ maintainAspectRatio: false,
+ tooltips: {
+ intersect: false,
+ position: 'nearest',
+ caretSize: 0,
+ },
+ elements: {
+ line: {
+ tension: 0.000001
+ }
+ },
+ },
+ };
+ },
+ });
+});
+
diff --git a/code_backend_theme/static/src/js/fields/graph.js b/code_backend_theme/static/src/js/fields/graph.js
new file mode 100644
index 0000000..e5f7c67
--- /dev/null
+++ b/code_backend_theme/static/src/js/fields/graph.js
@@ -0,0 +1,101 @@
+odoo.define('code_backend_theme.graph', function (require) {
+ "use strict";
+
+ var GraphRenderer = require('web.GraphRenderer');
+
+ var MyCOLORS = ["#556ee6", "#f1b44c", "#50a5f1", "#ffbb78", "#34c38f", "#98df8a", "#d62728",
+ "#ff9896", "#9467bd", "#c5b0d5", "#8c564b", "#c49c94", "#e377c2", "#f7b6d2",
+ "#7f7f7f", "#c7c7c7", "#bcbd22", "#dbdb8d", "#17becf", "#9edae5"];
+ var MyCOLOR_NB = MyCOLORS.length;
+
+ function hexToRGBA(hex, opacity) {
+ var result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex);
+ var rgb = result.slice(1, 4).map(function (n) {
+ return parseInt(n, 16);
+ }).join(',');
+ return 'rgba(' + rgb + ',' + opacity + ')';
+ }
+
+ return GraphRenderer.include({
+
+ _getMyColor: function (index) {
+ return MyCOLORS[index % MyCOLOR_NB];
+ },
+
+ _renderBarChart: function (dataPoints) {
+ var self = this;
+
+ // prepare data
+ var data = this._prepareData(dataPoints);
+
+ data.datasets.forEach(function (dataset, index) {
+ // used when stacked
+ dataset.stack = self.state.stacked ? self.state.origins[dataset.originIndex] : undefined;
+ // set dataset color
+ var color = self._getMyColor(index);
+ dataset.backgroundColor = color;
+ });
+
+ // prepare options
+ var options = this._prepareOptions(data.datasets.length);
+
+ // create chart
+ var ctx = document.getElementById(this.chartId);
+ this.chart = new Chart(ctx, {
+ type: 'bar',
+ data: data,
+ options: options,
+ });
+ },
+
+ _renderLineChart: function (dataPoints) {
+ var self = this;
+
+ // prepare data
+ var data = this._prepareData(dataPoints);
+ data.datasets.forEach(function (dataset, index) {
+ if (self.state.processedGroupBy.length <= 1 && self.state.origins.length > 1) {
+ if (dataset.originIndex === 0) {
+ dataset.fill = 'origin';
+ dataset.backgroundColor = hexToRGBA(MyCOLORS[0], 0.4);
+ dataset.borderColor = hexToRGBA(MyCOLORS[0], 1);
+ } else if (dataset.originIndex === 1) {
+ dataset.borderColor = hexToRGBA(MyCOLORS[1], 1);
+ } else {
+ dataset.borderColor = self._getMyColor(index);
+ }
+ } else {
+ dataset.borderColor = self._getMyColor(index);
+ }
+ if (data.labels.length === 1) {
+ // shift of the real value to right. This is done to center the points in the chart
+ // See data.labels below in Chart parameters
+ dataset.data.unshift(undefined);
+ }
+ dataset.pointBackgroundColor = dataset.borderColor;
+ dataset.pointBorderColor = 'rgba(0,0,0,0.2)';
+ });
+ if (data.datasets.length === 1) {
+ const dataset = data.datasets[0];
+ dataset.fill = 'origin';
+ dataset.backgroundColor = hexToRGBA(MyCOLORS[0], 0.4);
+ }
+
+ // center the points in the chart (without that code they are put on the left and the graph seems empty)
+ data.labels = data.labels.length > 1 ?
+ data.labels :
+ Array.prototype.concat.apply([], [[['']], data.labels, [['']]]);
+
+ // prepare options
+ var options = this._prepareOptions(data.datasets.length);
+
+ // create chart
+ var ctx = document.getElementById(this.chartId);
+ this.chart = new Chart(ctx, {
+ type: 'line',
+ data: data,
+ options: options,
+ });
+ },
+ });
+}); \ No newline at end of file