Could someone tell me how to change the color on a progress bar. I would like it to change dynamically depending on the percentage in the progressbar. The specific progressbar I'm wanting to change is on the Tasks Form View under Projects.
Odoo is the world's easiest all-in-one management software.
It includes hundreds of business apps:
- CRM
- e-Commerce
- Accounting
- Inventory
- PoS
- Project management
- MRP
This question has been flagged
3
Replies
7196
Views
You can inherit progressbar in progress_bar.js
add this code to set different colors in formview
do add css
.o_progressbar .o_progress .o_progressbar_complete.o_progress_gt_fty {
background-color: #456325;
height: 100%;
}.o_progressbar .o_progress .o_progressbar_complete.o_progress_lt_fty {
background-color: #000000;
height: 100%;
}ProgressBar.include({
_render_value: function(v) {
var value = this.value;
var max_value = this.max_value;
if(!isNaN(v)) {
if(this.edit_max_value) {
max_value = v;
} else {
value = v;
}
}
value = value || 0;
max_value = max_value || 0;
var widthComplete;
if(value <= max_value) {
widthComplete = value/max_value * 100;
} else {
widthComplete = max_value/value * 100;
}
this.$('.o_progress').toggleClass('o_progress_overflow', value > max_value);
this.$('.o_progressbar_complete').toggleClass('o_progress_gt_fty', widthComplete > 70).css('width', widthComplete + '%');
this.$('.o_progressbar_complete').toggleClass('o_progress_lt_fty', widthComplete <= 70).css('width', widthComplete + '%');
if(this.readonly) {
if(max_value !== 100) {
this.$('.o_progressbar_value').html(utils.human_number(value) + " / " + utils.human_number(max_value));
} else {
this.$('.o_progressbar_value').html(utils.human_number(value) + "%");
}
} else if(isNaN(v)) {
this.$('.o_progressbar_value').val(this.edit_max_value ? max_value : value);
}
}
});
Hi,
To change the color on a progress bar widget in Odoo , you can refer to the following blog post
https://www.cybrosys.com/blog/how-to-change-the-color-on-a-progress-bar-in-the-odoo-15
This blog post provides a step-by-step guide on how to change the color of a progress bar widget in Odoo
Regards
Look how to add progress bar widget in Odoo: https://learnopenerp.blogspot.com/2022/05/use-and-add-progressbar-percentpie-gauge-widget-in-odoo.html