44 lines
1.4 KiB
TypeScript
44 lines
1.4 KiB
TypeScript
import React from 'react';
|
|
import common from '../src/helpers/common'; // Ensure this path is correct
|
|
|
|
interface ModalProps {
|
|
children: React.ReactNode;
|
|
isOpen: boolean;
|
|
onClose: () => void;
|
|
forDate: Date;
|
|
useFilterDate: boolean;
|
|
onUseFilterDateChange: (value: boolean) => void;
|
|
}
|
|
|
|
function Modal({ children, isOpen, onClose, forDate, useFilterDate, onUseFilterDateChange }: ModalProps) {
|
|
if (!isOpen) return null;
|
|
const isValidDate = forDate instanceof Date && !isNaN(forDate.getTime());
|
|
console.log("forDate", forDate, isValidDate);
|
|
|
|
return (
|
|
<div className="fixed inset-0 flex items-center justify-center z-50">
|
|
<div className="bg-white p-4 rounded-md shadow-lg modal-content">
|
|
{isValidDate && (
|
|
<h2 className="text-xl font-bold mb-2">
|
|
<label className="cursor-pointer">
|
|
<input
|
|
type="checkbox"
|
|
checked={useFilterDate}
|
|
onChange={(e) => onUseFilterDateChange(e.target.checked)}
|
|
/>
|
|
{` на разположение ${common.getDateFormated(forDate)} или ${common.getDayOfWeekName(forDate)}`}
|
|
</label>
|
|
</h2>
|
|
)}
|
|
{children}
|
|
<button type="button" onClick={onClose} className="mt-4 text-red-500">
|
|
Close
|
|
</button>
|
|
</div>
|
|
<div className="fixed inset-0 bg-black opacity-50 modal-overlay" onClick={onClose}></div>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
export default Modal;
|