How to change the colours on Report shell

if the preoficiency_level (star) greater than or equal to 3 star it will be green or else Orange


frappe.query_reports["Employee Skill Report"] = {
	"filters": [
		{
			"fieldname": "branch",
			"label": __("Select Branch"),
			"fieldtype": "Link",
			"options": "Branch"
		},
		{
			"fieldname":"project_manager",
			"label": __("Project Manager"),
			"fieldtype": "Link",
			"options":"User",
			"get_query": function () {
						return {
							query: "ss_custom_erpnext.ss_custom_erpnext.constant.constant.get_project_manager_list"
						}
			}
		},
	],
	"formatter": function (value, row, column, data, default_formatter) {
		value = default_formatter(value, row, column, data);
		let star = ['***','****','*****']
		if (column.id == "technology"){
			if(star.includes(data["proficiency_level"])){
				value = `<span style='color:green';>${data['technology']} </span>`;
			}
			else{
				value = `<span style='color:#ff8c00';>${data['technology']} </span>`;
			}
		}else if (column.id == "employee"){ 
			if (data['employee'].includes("(hide)")){
				return value = ''
			}else{
				return value = data['employee']
			}
		}else if (column.id == "employee_name"){ 
			if (data['employee_name'].includes("(hide)")){
				return value = ''
			}else{
				return value = data['employee_name']
			}
		}else if (column.id == "team_lead"){ 
			if (data['team_lead'].includes("(hide)")){
				return value = ''
			}else{
				return value = data['team_lead']
			}
		}else if (column.id == "date_of_joining"){ 
			if (data['date_of_joining'].includes("(hide)")){
				return value = ''
			}else{
				return value = data['date_of_joining']
			}
		}
        return value;
        },

};

@Antony_Praveenkumar a nice trick I ve been doing . if the columns is not a LINK . I just add a html code to the data like

<span style="color:#548765"> value</span>

and voila you get any color you want . you can add also small images , icons . and they will look great.

@bahaou can you please share the screen shoot of your report


this one has small images I added them to the country doctype .

5 Likes

@bahaou really nice

it works also with charts . see those colors are not standard . also the box when you scroll the mouse on top of the chart has little icons

1 Like

it’s really nice man, can i get the code for that report @bahaou