Opportunity Close Countdown | ⚡ Lightning Component

Arun Kumar has shared a custom "Lightning Component" called "Opportunity Close Countdown". This countdown timer indicates the remaining time to close a sales opportunity, working based on the "closed date" field on the opportunity record. It's a tool that helps sales users keep track of their opportunity close dates to ensure timely deal closure.

Hello There,

In this post I am going to share an interesting custom “Lightning Component” with you. I called it “Opportunity Close Countdown” this is basically a count down timer which will tell us the remaining time left to close an opportunity. This timer works based on the “closed date” field on the opportunity record.

I think this component will be very helpful for sales user, they can keep eyes on their opportunity close date very easily so that they can close the deal within the time limit.

1

9

Code:

var interval = window.setInterval(
$A.getCallback(function() {
//Fomart the Opportunity Close Date
var opptyCloseDate = new Date( closeDate+" 00:00:00 ");
//Todays date
var now_date = new Date();
// time difference between opportunity close date and today's date
var timeDiff = opptyCloseDate.getTime()- now_date.getTime(); //Return the number of milliseconds since 1970/01/01
component.set("v.isValid",true);
//seprate the timeDiff into total seconds, minnutes, hours and days.
var seconds=Math.floor(timeDiff/1000); // seconds
var minutes=Math.floor(seconds/60); //minute
var hours=Math.floor(minutes/60); //hours
var days=Math.floor(hours/24); //days
//get the remaining hours, minutes, seconds.
hours %=24;
minutes %=60;
seconds %=60;
//put the calculated value in lightning component Attributes.
component.set("v.day",days);
component.set("v.hour",hours);
component.set("v.minute",minutes);
component.set("v.second",seconds);
}), 1000);

The setInterval() javascript method calls a function or it evaluates an expression at specified intervals (in milliseconds).

👉 Steps to add this component on the Opportunity detail page:

  • Go To Opportunity record detail page.
  • Click on setting icon shown in the screenshot below | click on ‘Edit Page’.

7

Lightning app builder page will open. Here drag the component in the section. (Shown in the screenshot below).

8

You can find this “Lightning Component” complete code 👉 here.

👉 https://sfdclesson.com/opportunity-close-countdown-%E2%9A%A1-lightning-component/

Thanks

Arun Kumar

Arun Kumar
Arun Kumar

Arun Kumar is a Salesforce Certified Platform Developer I with over 7+ years of experience working on the Salesforce platform. He specializes in developing custom applications, integrations, and reports to help customers streamline their business processes. Arun is passionate about helping businesses leverage the power of Salesforce to achieve their goals.

Articles: 162

Leave a Reply

Discover more from SFDC Lessons

Subscribe now to keep reading and get access to the full archive.

Continue reading

Discover more from SFDC Lessons

Subscribe now to keep reading and get access to the full archive.

Continue reading