Как ограничить период в Atnd datePicker используя moment.js?

Всем привет. помогите решить задачу. Есть два пикета даты, использую Ant Design + moment.js. Суть такая, стартовая дата ограничена от текущей до трех лет назад, если разница между стартовой и конечной датой меньше 30 дней, то максимальная дата === текущей.Если больше то максимальная дата и время === стразовая дата + 30 дней и остальные даты должны быть не активны. именно это условие и не получается реализовать. Для того чтобы сделать неактивными датами используются пропы disabledDate disabledTime

Компонент:

const InputDatePicker = (props) => {

const [startDate, setStartDate] = useState('')
const [endDate, setEndDate] = useState('')
const minDate = moment().subtract(3, 'years')
const maxDate = moment()

const getRange = (start, end) =>
    [...Array(end - start + 1).keys()].map((i) => i + start) // массив для времени

const disabledStartDate = (current) => {
    if (current === null) {
        return null
    }

    return (
        (minDate !== null &&
            current.isBefore(minDate) &&
            !current.isSame(minDate, 'day')) ||
        (maxDate !== null &&
            current.isAfter(maxDate) &&
            !current.isSame(maxDate, 'day'))
    )
} // начальные даты

const disabledEndDate = (current) => {
    if (current === null) {
        return null
    }
    return (
        (startDate != null &&
            current.isBefore(startDate) &&
            !current.isSame(startDate, 'day')) ||
        (maxDate != null &&                   // <<<< ---- ?????? условие если разница больше 30 дней
            current.isAfter(maxDate) &&
            !current.isSame(maxDate, 'day'))
    )
} //конечные даты

const disabledStartTime = (current) => {
    if (current == null) {
        return null
    }

    if (current.isSame(minDate, 'day')) {
        return {
            disabledHours: () =>
                minDate.hour() > 0 ? getRange(0, minDate.hour() - 1) : [],
            disabledMinutes: (hour) =>
                hour === minDate.hour() && minDate.minutes() > 0
                    ? getRange(0, minDate.minutes() - 1)
                    : [],
            disabledSeconds: (hour) =>
                hour === minDate.hour() && minDate.second() > 0
                    ? getRange(0, minDate.second() - 1)
                    : [],
        }
    }

    if (current.isSame(maxDate, 'day')) {
        return {
            disabledHours: () => getRange(maxDate.hour() + 1, 24),
            disabledMinutes: (hour) =>
                hour === maxDate.hour() ? getRange(maxDate.minutes() + 1, 60) : [],
            disabledSeconds: (hour) =>
                hour === maxDate.hour() && maxDate.second() > 0
                    ? getRange(maxDate.second() + 1, 60)
                    : [],
        }
    }

    return null
}// начальное время

const disabledEndTime = (current) => {
  // ????
}

return (
    <div>

        <DatePicker
            id="startField"
            format="DD.MM.YYYY HH:mm:ss"
            placeholder="Початкова дата"
            showTime 
            onFocus={(e) => e.preventDefault()}
            onBlur={(e) => e.preventDefault()}
            onChange={(e) => setStartDate(e)}
            locale={locale}
            disabledDate={disabledStartDate}
            disabledTime={disabledStartTime}
        />
        <DatePicker
            id="endField"
            format="DD.MM.YYYY HH:mm:ss"
            locale={locale}
            showTime
            placeholder="Кінцева дата"
            onFocus={(e) => e.preventDefault()}
            onBlur={(e) => e.preventDefault()}
            onChange={(e) => setEndDate(e)}
            disabledDate={disabledEndDate}
            disabledTime={disabledEndTime}
        />

        
    </div>
)

}

Очень нужна помощь !!


Ответы (0 шт):