Change the color of task records based on date_due

By
Last Modified Date

Looking for a solution to change the color of task records based on date_due in dashlet list-view on the home screen? Well, you’re in luck because we’ve compiled all the steps you need to take to change the color of task records based on due_date yourself. Read on!

The solution is simple and can be achieved in four simple steps:

1.   Change type of date_due field to custom field

“date_due”  custom/modules/Tasks/clients/base/views/list/list.php

array(
‘name’ => ‘date_due’,
‘width’ => ’15’,
‘label’ => ‘LBL_LIST_DUE_DATE’,
‘type’ => ‘date_due’,
‘link’ => false,
‘enabled’ => true,
‘default’ => true,
),

2.   Add date_due custom field definition in Task Module

/modules/Tasks/clients/base/fields/date_due/date_due.js
/*
* Customize to add Overdue functionality
*/
({

    extendsFrom: ‘DateTimeComboField’,
overDue:false,
format: function(value) {
if (!value) {
return value;
}
value = app.date(value);
if (!value.isValid()) {
return;
}

// check for due date
if(typeof this.view.layout.name != ‘undefined’ && this.view.layout.name == ‘dashlet’){
var now = new Date(),
dateOver = new Date(value);
this.overDue =  dateOver < now;
}

if (this.action === ‘edit’ || this.action === ‘massupdate’) {
value = {
‘date’: value.format(app.date.convertFormat(this.getUserDateFormat())),
‘time’: value.format(app.date.convertFormat(this.getUserTimeFormat()))
};
} else {
value = value.formatUser(false);
}
return value;
},

})

3.   Add list.hbs in custom due_date field

custom/modules/Tasks/clients/base/fields/date_due/list.hbs
{{!–
/*
* customize to add overDue class for a field incase due date
*/
–}}
<div data-placement=”bottom” title=”{{#unless value}}{{#if def.placeholder}}{{str def.placeholder this.model.module}}{{/if}}{{/unless}}{{value}}” >
{{#if def.link}}<a href=”{{#if def.events}}javascript:void(0);{{else}}{{href}}{{/if}}”>{{value}}</a>{{else}}{{value}}{{/if}}
</div>

4.    Define new class in custom.less file

custom/themes/custom.less

.overDue{ background-color: red;}

If you’re looking for more complex SugarCRM Customization, then get in touch with us. Rolustech is a Certified SugarCRM Partner Firm with over 700 CRM Integrations and Customization under its belt. Get your Free Consultation Session and make your Sugar truly your own!

Need Help? Get Free Consultation


By clicking you agree to our Terms and Conditions

Send me news and updates

Get in touch


Contact Information