if else not working correctly if both dates are the same day

user_13928344 0
Viewed 73

I would like to display the deadline date if it is today or in the future and the word 'Closed' if the date has passed.

I have the following code which is working APART from when the deadline and today's date are the same.

HTML

<div class="deadline-inner">
              <p
                v-if="Date.now() > new Date(deadline)"
                class="showclosedtitle"
              >
                <i class="fa fa-calendar-check-o" aria-hidden="true"></i>Closed
              </p>
              <p v-else>
                <i class="fa fa-calendar-check-o" aria-hidden="true"></i>
                <strong>Deadline: </strong>{{ deadline }}
              </p>
            </div>

The deadline is in this format: "21 December 2021"

I have also tried:

 v-if="Date.now() >= new Date(deadline)"
 v-if="Date.now() > +1 new Date(deadline)"

but all of them show the 'else' part of the statement if the deadline and today's date are the same. Any help is appreciated.

vue.js
2 Answers

Try with "end of day" time

Typing your dates into the browser console (at the time of writing this):

> new Date('21 December 2021');
Tue Dec 21 2021 00:00:00

> new Date();
Tue Dec 21 2021 12:19:09

So new Date() is always "now" down to the second (millisecond, really).
Your compared date is always from "00:00:00".
So if you want to know if new Date() is later than deadline, add 23:59:59 as the time:

new Date() > new Date('21 December 2021 23:59:59');

This will now be false until tomorrow.

So in your case you could solve it in deadline itself or add the time manually:

v-if="Date.now() > new Date(deadline + ' 23:59:59')"
user_104416710

@user13928344 Your deadline isn't specific enough. There's no hours/minutes/seconds/milliseconds, so it defaults to the very first moment that date exists, which is midnight, or 00:00:00:000. So your new Date() will always be greater than the deadline date and return true (barring the very slim chance your logic will run at exactly midnight and all of the zero's, in which case it would be equal to your deadline and not greater than, so would return false). Where are you getting your deadline data from? Are you transforming it into the current format yourself and getting it from a backend? If so, convert it to a more specific date/time. Otherwise if it's coming from user input, ie a form, convert your date to milliseconds and then add 86340000 which will take your deadline up to the the very end of that day

user_50974930
Related