Multiple style's on field based on date

Carl Fransen1 · ‎11-30-2017

Hi All,

I'm trying to work out how to put some styles onto the HR Case 'state' field when the state is 'Suspended' — but I also want to have a different colour based on the new date field I created 'u_suspend_till'.

What I want to achieve is the following:

If the date is in the future — upto a day from today colour it green
If the date is today — colour it yellow
If the date is yesterday or older colour it red

I have setup 3 styles as per below, but I can't seem to get it working correctly — Any ideas what I'm doing wrong?

javascript:current.u_suspend_till = gs.daysAgo(1) && current.u_suspend_till != "";

background-color:yellow

javascript:current.u_suspend_till > gs.daysAgo(1) && current.u_suspend_till != "";

background-color:green

javascript:current.u_suspend_till > gs.hoursAgo(-1) && current.u_suspend_till != "";

background-color:tomato

Carl Fransen1 · ‎06-10-2018

Hi All,

Update to this as I got it working. It was too much to code each individual style record, so I had to create a Script Include' to do the calculations and call this from my Field Style record.

Script include is:

var OpusHRfieldStyle = Class.create();
OpusHRfieldStyle.prototype = {
    initialize: function() {
		this.timeDiff = gs.dateDiff(gs.now().getDisplayValue(), current.u_suspend_till.getDisplayValue(), true);
    },

	//True if u_suspend_till is less than 1 day from now
	redTime: function() {
		return this.timeDiff <= 0;
	},
	
	//True if u_suspend_till is within 1 day from now
	orangeTime: function() {
		return this.timeDiff > 0 && this.timeDiff < 86400;
	},
	
	//True if u_suspend_till is more than  1 day and less than 21 days
	greenTime: function() {
		return this.timeDiff >= 86400 && this.timeDiff < 1814400;
	},
		
    type: 'OpusHRfieldStyle'
};

Each individual Field Style is then set as per below, calling the appropriate function:

javascript:new global.OpusHRfieldStyle().greenTime() && current.state == 24;

Then in the Style field I enter the required colour/style for the field - in my case it's 3 colours as per example below:

background-color:tomato;
color:red;

Now the field changes as needed based on the date field and the HR team is able to manage these much easier visually, see below

Hope this helps someone.

Cheers

Carl.

View solution in original post

Gowrisankar Sat · ‎12-01-2017

Use this in value field:

javascript:gs.dateDiff(gs.now(), current.u_suspend_till.getDisplayValue(), true) <86400

Use this in style field:

background-color:yellow

javascript:gs.dateDiff(gs.now(), current.opened_at.getDisplayValue(), true) > 86400

background-color:red

javascript:gs.dateDiff(gs.now(), current.opened_at.getDisplayValue(), true) < 0

background-color:tomato

Carl Fransen1 · ‎12-03-2017

Hi Gowrisankar sativada,

Thanks for your help with this - although it doesn't seem to be working. I receive an error stating:

looks like datediff isn't allowed for some reason in the HR Scope.

Hoping you can help with this issue.

Gowrisankar Sat · ‎12-04-2017

Hi Carl,

The gs.dateDiff() method is not available in scoped applications.

can you replace:

gs.dateDiff(gs.now(), current.opened_at.getDisplayValue(), true) with GlideDateTime.subtract(new GlideDateTime(), new GlideDateTime(current.opened_at.getDisplayValue())).getNumericValue()

Carl Fransen1 · ‎12-04-2017

Hello - unfortunately this still doesn't work - all i get is all my Cases coloured one colour (the <86400) whether they are old, null or todays date. All future dates have no colour (which is shown in the screenshot below).

The field I'm comparing against is a Date field only 'u_suspend_till' - not a datetime, but changing the glide from 'GlideDateTime' to 'GlideDate' didn't seem to work at all.