86 lines
2.2 KiB
TypeScript
86 lines
2.2 KiB
TypeScript
import dayjs from 'dayjs'
|
|
import React, { useState } from 'react'
|
|
import { useForm } from 'react-hook-form'
|
|
import { useMutation } from 'react-query'
|
|
import useLocalStorageState from 'use-local-storage-state'
|
|
import { assignGroup } from '../../api/schedule'
|
|
|
|
const ScheduleAddGroup = ({
|
|
eventData,
|
|
scheduleId,
|
|
closeModal,
|
|
}: {
|
|
eventData: {
|
|
start: Date
|
|
end: Date
|
|
title: string
|
|
id: number
|
|
resource: any
|
|
}
|
|
scheduleId: string
|
|
closeModal: () => void
|
|
}) => {
|
|
const { register, handleSubmit, reset, control } = useForm<{
|
|
student_index: number
|
|
}>({ mode: 'onBlur' })
|
|
const [studentId] = useLocalStorageState('userId')
|
|
|
|
const { mutate: mutateAssignGroup } = useMutation(
|
|
['assignGroup'],
|
|
(data: {
|
|
scheduleId: number
|
|
enrollmentId: number
|
|
studentIndex: number
|
|
}) => assignGroup(data),
|
|
{
|
|
onSuccess: () => {
|
|
closeModal()
|
|
},
|
|
},
|
|
)
|
|
|
|
const onSubmit = (data: any) => {
|
|
mutateAssignGroup({
|
|
scheduleId: Number(scheduleId),
|
|
enrollmentId: eventData.id,
|
|
studentIndex: Number(studentId),
|
|
})
|
|
}
|
|
|
|
return (
|
|
<div>
|
|
<form className="w-full flex flex-col " onSubmit={handleSubmit(onSubmit)}>
|
|
<h3>
|
|
Termin {dayjs(eventData.start).format('YYYY-MM-DD HH:mm:ss')} -{' '}
|
|
{dayjs(eventData.end).format('YYYY-MM-DD HH:mm:ss')}
|
|
</h3>
|
|
{eventData.resource?.members_of_committee?.length > 0 && (
|
|
<>
|
|
Komisja:{' '}
|
|
<ul className="list-disc">
|
|
{eventData.resource.members_of_committee.map((member: any) => (
|
|
<li
|
|
key={`${member.first_name} ${member.last_name}`}
|
|
className="ml-4"
|
|
>
|
|
{member.first_name} {member.last_name}
|
|
</li>
|
|
))}
|
|
</ul>
|
|
</>
|
|
)}
|
|
{eventData.resource.group && (
|
|
<p className="mt-4">Grupa: {eventData.resource.group.name}</p>
|
|
)}
|
|
{!eventData.resource.group && (
|
|
<>
|
|
<button className="btn btn-success mt-4">ZAPISZ</button>
|
|
</>
|
|
)}
|
|
</form>
|
|
</div>
|
|
)
|
|
}
|
|
|
|
export default ScheduleAddGroup
|