diff --git a/frontend/src/components/MeetingTicket/TicketInfo.tsx b/frontend/src/components/MeetingTicket/TicketInfo.tsx new file mode 100644 index 000000000..13a73d73c --- /dev/null +++ b/frontend/src/components/MeetingTicket/TicketInfo.tsx @@ -0,0 +1,56 @@ +import { useParams } from 'react-router-dom'; + +import { useGetConfirmedMeetingInfoQuery } from '@stores/servers/confirm/queries'; + +export default function TicketInfo() { + const params = useParams<{ uuid: string }>(); + const uuid = params.uuid!; + + const { data } = useGetConfirmedMeetingInfoQuery(uuid); + + if (!data) { + return null; + } + + const { + meetingName, + availableAttendeeNames, + startDate, + startTime, + startDayOfWeek, + endDate, + endTime, + endDayOfWeek, + } = data; + + console.log(data); + return ( +
+
{meetingName}
+ +
+
날짜
+
+ + {startDate}({startDayOfWeek})부터 + + + {endDate}({endDayOfWeek})까지 + +
+
+ +
+
시간
+
{`${startTime} ~ ${endTime}`}
+
+ +
+
참여자 ({availableAttendeeNames.length}명)
+ {availableAttendeeNames.map((attendeeName) => ( +
{attendeeName}
+ ))} +
+
+ ); +}