70 lines
1.9 KiB
JavaScript
70 lines
1.9 KiB
JavaScript
"use client";
|
|
|
|
import { useEffect, useRef, useState } from "react";
|
|
import FirstDatePicker from "./date/FirstDatePicker";
|
|
import SecondDatePicker from "./date/SecondDatePicker";
|
|
|
|
function DatePicker({ date, updateDate }) {
|
|
const nextIconDatePickerF = useRef();
|
|
const prevIconDatePickerF = useRef();
|
|
const nextIconDatePickerS = useRef();
|
|
const prevIconDatePickerS = useRef();
|
|
|
|
const [startDate, setStartDate] = useState(null);
|
|
const [endDate, setEndDate] = useState();
|
|
const [loading, setLoading] = useState(true);
|
|
|
|
const handleStartDateChange = (date, e) => {
|
|
if (date) {
|
|
setStartDate(date);
|
|
setEndDate(null);
|
|
}
|
|
};
|
|
|
|
const handleEndDateChange = (date) => {
|
|
if (date) {
|
|
setEndDate(date);
|
|
setStartDate(null);
|
|
}
|
|
};
|
|
|
|
const handleDisableDate = (e) => {
|
|
const today = new Date();
|
|
return today >= e._d;
|
|
};
|
|
|
|
useEffect(() => {
|
|
if (nextIconDatePickerS.current) {
|
|
nextIconDatePickerS.current.click();
|
|
console.log(nextIconDatePickerS.current);
|
|
|
|
setLoading(false);
|
|
}
|
|
}, [nextIconDatePickerS]);
|
|
|
|
return (
|
|
<div className="datePickerApt flex items-start custom-datepicker justify-evenly w-full">
|
|
<FirstDatePicker
|
|
loading={loading}
|
|
startDate={startDate}
|
|
handleDisableDate={handleDisableDate}
|
|
nextIconDatePickerF={nextIconDatePickerF}
|
|
prevIconDatePickerF={prevIconDatePickerF}
|
|
prevIconDatePickerS={prevIconDatePickerS}
|
|
handleStartDateChange={handleStartDateChange}
|
|
/>
|
|
<SecondDatePicker
|
|
loading={loading}
|
|
endDate={endDate}
|
|
handleDisableDate={handleDisableDate}
|
|
nextIconDatePickerF={nextIconDatePickerF}
|
|
nextIconDatePickerS={nextIconDatePickerS}
|
|
prevIconDatePickerS={prevIconDatePickerS}
|
|
handleEndDateChange={handleEndDateChange}
|
|
/>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
export default DatePicker;
|