时间戳

首页 > 解决方案 > 显示商店是否开张的功能，如果没有，何时开张

javascript - 显示商店是否开张的功能，如果没有，何时开张

问题描述

我正在尝试制作一个获取当前时间并基于开放时间数组的函数，显示商店是开放还是关闭，以及何时关闭和打开。

这是我的带有小时数的数组，它不能改变，我的意思是，小时数可以改变，但总体上它是如何工作的。

{
"openHours": [
              { days: [1, 2, 3, 4, 5], from: '11:00', to: '22:00' },
              { days: [6], from: '12:00', to: '23:00' },
             ]
}

如您所见，没有第 0 天，即星期日，因为那时商店关门。

我现在有这个

const [isOpen, setIsOpen] = useState(false);
const [opensAt, setOpensAt] = useState(false);
const [closesAt, setClosesAt] = useState(false);

const checkIfOpen = () => {
    const now = new Date();
    const openedHours = card.openHours.find(i => i.days.includes(now.getDay()));
    const nextDay = new Date(Date.now() + 3600 * 1000 * 24);
    const openedHoursNextDay = card.openHours.find(i => i.days.includes(nextDay.getDay()));

    if (openedHours) {
      const fromHours = new Date().setHours(...openedHours.from.split(':'));
      const toHours = new Date().setHours(...openedHours.to.split(':'));
      if (fromHours <= now.getTime() && now.getTime() <= toHours) {
        setIsOpen(true);
        setClosesAt(openedHours.to);
      } else if (now.getTime() > toHours) {
        setIsOpen(false);
        setOpensAt(openedHoursNextDay.from);
      } else {
        setIsOpen(false);
        setOpensAt(openedHours.from);
      }
    }
  };

return (
        <div className="info-text text-nowrap">
            {isOpen ? `Closed at ${closesAt}` : `Opens at ${opensAt}`}
        </div>
        <div className="info-text">{isOpen ? "Now open" : "Now closed"}</div>
);

所以我有一个问题。如果第二天是星期天，openedHoursNextDay 返回未定义，我怎样才能得到有营业时间的第二天？

标签： javascriptreactjsdatetime

解决方案

这就是我要做的...

const now = new Date();
const openedHours = card.openHours.find(i => i.days.includes(now.getDay()));
const nextDay = new Date(Date.now() + 3600 * 1000 * 24);
var nextAvailableDayOfTheWeek = nextDay.getDay();
var availableDays = new Array();
for ( let index = 0; index < openHours.length; index++ ) { // gathers all available days
    availableDays = availableDays.concat(openHours[index].days);
}
while ( ! availableDays.includes(nextAvailableDayOfTheWeek) ) { // if nextAvailableDayOfTheWeek is not available, go look for the next day that is
    nextAvailableDayOfTheWeek++;
    if ( 7 == nextAvailableDayOfTheWeek ) nextAvailableDayOfTheWeek = 0; // if after saturday then reset to sunday
}

推荐阅读