rewrite availability form

This commit is contained in:
Dobromir Popov
2024-03-03 02:52:41 +02:00
parent e52d962c49
commit 193dd91605
4 changed files with 229 additions and 314 deletions

View File

@ -16,6 +16,7 @@ import { MdToday } from 'react-icons/md';
import { useSwipeable } from 'react-swipeable';
import axiosInstance from '../../src/axiosSecure';
import { set } from 'date-fns';
// Set moment to use the Bulgarian locale
moment.locale('bg');
@ -43,7 +44,7 @@ const AvCalendar = ({ publisherId, events, selectedDate }) => {
const [evts, setEvents] = useState(events); // Existing events
const [displayedEvents, setDisplayedEvents] = useState(evts); // Events to display in the calendar
const [isModalOpen, setIsModalOpen] = useState(false);
const [selectedEvent, setSelectedEvent] = useState(null);
const [selectedEvents, setSelectedEvents] = useState([]);
const [visibleRange, setVisibleRange] = useState(() => {
const start = new Date();
start.setDate(1); // Set to the first day of the current month
@ -182,18 +183,21 @@ const AvCalendar = ({ publisherId, events, selectedDate }) => {
// get exising events for the selected date
const existingEvents = evts?.filter(event => event.publisherId === publisherId && event.startTime === start.toDateString());
setSelectedEvent({
date: start,
startTime: start,
endTime: end,
dayOfMonth: start.getDate(),
isactive: true,
publisherId: publisherId,
// Add any other initial values needed
//set dayOfMonth to null, so that we repeat the availability every week
dayOfMonth: null,
console.log("handleSelect: " + existingEvents);
setSelectedEvents(existingEvents);
});
// setSelectedEvent({
// date: start,
// startTime: start,
// endTime: end,
// dayOfMonth: start.getDate(),
// isactive: true,
// publisherId: publisherId,
// // Add any other initial values needed
// //set dayOfMonth to null, so that we repeat the availability every week
// dayOfMonth: null,
// });
setIsModalOpen(true);
};
@ -214,7 +218,7 @@ const AvCalendar = ({ publisherId, events, selectedDate }) => {
delete eventForEditing.type;
delete eventForEditing.publisher
console.log("handleEventClick: " + eventForEditing);
setSelectedEvent(eventForEditing);
setSelectedEvents([eventForEditing]);
setIsModalOpen(true);
};
@ -223,22 +227,6 @@ const AvCalendar = ({ publisherId, events, selectedDate }) => {
setIsModalOpen(false);
if (dialogEvent === null || dialogEvent === undefined) {
} else {
// if (dialogEvent.deleted) {
// // Remove the old event from the calendar
// setEvents(currentEvents => currentEvents.filter(e => e.id !== selectedEvent.id));
// }
// else {
// // Update the event data
// dialogEvent.start = dialogEvent.startTime;
// dialogEvent.end = dialogEvent.endTime;
// // Update the events array by first removing the old event and then adding the updated one
// setEvents(currentEvents => {
// const filteredEvents = currentEvents?.filter(e => e.id !== selectedEvent.id) || [];
// return [...filteredEvents, dialogEvent];
// });
// }
//refresh the events from the server
let e = await axiosInstance.get(`/api/?action=getCalendarEvents&publisherId=${publisherId}`);
var newEvents = e.data;
// set start and end to Date objects for all events. Fix for the calendar component
@ -468,7 +456,8 @@ const AvCalendar = ({ publisherId, events, selectedDate }) => {
<div className="modal-content">
<AvailabilityForm
publisherId={publisherId}
existingItem={selectedEvent}
existingItems={selectedEvents}
date={date}
onDone={handleDialogClose}
inline={true}
// Pass other props as needed