diff --git a/src/Components/Events/EventSchedule/CreateSchedule.tsx b/src/Components/Events/EventSchedule/CreateSchedule.tsx index d7be9a7..8506ea2 100644 --- a/src/Components/Events/EventSchedule/CreateSchedule.tsx +++ b/src/Components/Events/EventSchedule/CreateSchedule.tsx @@ -260,7 +260,7 @@ export default function EventEdit({ onChange={(e) => { setNewEvent((prev) => ({ ...prev, - datetime: e ? new Date(e.toString()) : new Date(), + datetime: e ? new Date(e.toLocaleString()) : new Date(), })); }} /> diff --git a/src/Hooks/Event/useScheduleList.tsx b/src/Hooks/Event/useScheduleList.tsx index 64392a4..7bb4256 100644 --- a/src/Hooks/Event/useScheduleList.tsx +++ b/src/Hooks/Event/useScheduleList.tsx @@ -160,20 +160,26 @@ export function useScheduleList() { selectedEvent: IScheduleItem | null, round: string, roundId: number, + newDatetime: Date, + day: number, ) => { try { setError(''); + const formattedDate = newDatetime.toLocaleString(); + await axiosEventsPrivate.put(`/api/schedule`, { eventId: selectedEvent?.eventId, round, roundId, - day: selectedEvent?.day, - datetime: selectedEvent?.datetime, + day, + datetime: formattedDate, }); setEventList((prevList) => prevList.map((event) => - event.eventId === selectedEvent?.eventId ? { ...event, round, roundId } : event, + event.eventId === selectedEvent?.eventId && event.roundId === selectedEvent?.roundId + ? { ...event, round, roundId, datetime: newDatetime, day } + : event, ), ); } catch (error) { diff --git a/src/Pages/Events/EventSchedule.tsx b/src/Pages/Events/EventSchedule.tsx index b3fbf41..2e86ae4 100644 --- a/src/Pages/Events/EventSchedule.tsx +++ b/src/Pages/Events/EventSchedule.tsx @@ -7,6 +7,11 @@ import { DialogTitle, Typography, TextField, + Box, + Select, + MenuItem, + FormControl, + InputLabel, } from '@mui/material'; import { DataGrid, @@ -30,6 +35,8 @@ import { } from 'Hooks/Event/eventRoles'; import { TypeSafeColDef } from 'Hooks/gridColumType'; import { useScheduleList } from 'Hooks/Event/useScheduleList'; +import { DateTimePicker } from '@mui/x-date-pickers'; +import dayjs from 'dayjs'; function getRowId(row: IScheduleItem) { return row.id; @@ -54,6 +61,8 @@ export default function EventSchedule() { const [selectedEvent, setSelectedEvent] = useState(null); const [editRound, setEditRound] = useState(''); const [editRoundId, setEditRoundId] = useState(''); + const [editDatetime, setEditDatetime] = useState(new Date()); + const [editDay, setEditDay] = useState(1); const navigate = useNavigate(); @@ -62,6 +71,8 @@ export default function EventSchedule() { setSelectedEvent(event); setEditRound(event.round); setEditRoundId(event.roundId.toString()); + setEditDatetime(new Date(event.datetime)); + setEditDay(event.day); setEditModalOpen(true); }; @@ -70,14 +81,21 @@ export default function EventSchedule() { setSelectedEvent(null); setEditRound(''); setEditRoundId(''); + setEditDatetime(new Date()); + setEditDay(1); }; const handleSaveEdit = async () => { - if (selectedEvent?.round === editRound && selectedEvent?.roundId === Number(editRoundId)) { + if ( + selectedEvent?.round === editRound && + selectedEvent?.roundId === Number(editRoundId) && + selectedEvent?.datetime.getTime() === editDatetime.getTime() && + selectedEvent?.day === editDay + ) { handleCloseModal(); return; } - await updateScheduleItem(selectedEvent, editRound, Number(editRoundId)); + await updateScheduleItem(selectedEvent, editRound, Number(editRoundId), editDatetime, editDay); handleCloseModal(); }; @@ -201,6 +219,29 @@ export default function EventSchedule() { value={editRoundId} onChange={(e) => setEditRoundId(e.target.value)} /> + + Day + + + + { + if (newValue) setEditDatetime(dayjs(newValue).toDate()); + }} + sx={{ width: '100%' }} + /> +