Add creating year groups

frontend/src/App.tsx

@@ -20,6 +20,7 @@ import SupervisorSchedules from './views/supervisor/SupervisorSchedules'
 import StudentSchedules from './views/student/StudentSchedules'
 import StudentSchedule from './views/student/StudentSchedule'
 import SupervisorSchedule from './views/supervisor/SupervisorSchedule'
+import Home from './views/coordinator/Home'
 
 const queryClient = new QueryClient({
   defaultOptions: {
@@ -36,7 +37,7 @@ function App() {
         <Routes>
           <Route index element={<Login />} />
           <Route path="coordinator" element={<Coordinator />}>
-            <Route index element={<Navigate to="students" />} />
+            <Route index element={<Home />} />
             <Route path="groups" element={<Groups />} />
             <Route path="students" element={<Students />} />
             <Route path="leaders" element={<Leaders />} />

frontend/src/api/students.ts

@@ -12,7 +12,7 @@ export interface Student {
   last_name: string
   index: number
   pesel: string
-  mode: boolean
+  mode?: boolean
   group?: any
 }
 
@@ -32,7 +32,7 @@ export const getStudents = (
     { params },
   )
 
-export const createStudent = (payload: Student) =>
+export const createStudent = (payload: Student & { year_group_id: number }) =>
   axiosInstance.post('coordinator/students/', payload)
 
 export const uploadStudents = (payload: FormData) =>

frontend/src/api/yearGroups.ts

@@ -23,3 +23,6 @@ export const getYearGroups = (
       params,
     },
   )
+
+export const createYearGroup = (payload: CreateYearGroup) =>
+  axiosInstance.post('coordinator/year-group/', payload)

frontend/src/views/coordinator/AddStudent.tsx

@@ -1,6 +1,7 @@
 import { useState } from 'react'
 import { useForm } from 'react-hook-form'
 import { useMutation } from 'react-query'
+import useLocalStorageState from 'use-local-storage-state'
 import { createStudent, Student } from '../../api/students'
 import InputError from '../../components/InputError'
 
@@ -12,10 +13,11 @@ const AddStudent = () => {
     formState: { errors },
     reset,
   } = useForm<Student>({ mode: 'onBlur' })
+  const [yearGroupId] = useLocalStorageState('yearGroupId')
 
   const { mutate: mutateCreateStudent } = useMutation(
     'createStudent',
-    (payload: Student) => createStudent(payload),
+    (payload: Student & { year_group_id: number }) => createStudent(payload),
     {
       onSuccess: () => {
         reset()
@@ -25,7 +27,8 @@ const AddStudent = () => {
   )
 
   const onSubmit = (data: Student) => {
-    mutateCreateStudent(data)
+    delete data.mode
+    mutateCreateStudent({ ...data, year_group_id: Number(yearGroupId) })
   }
 
   return (
@@ -104,7 +107,7 @@ const AddStudent = () => {
           <InputError>Pesel musi mieć 11 cyfr</InputError>
         )}
       </div>
-      <div className="form-control gap-2">
+      {/* <div className="form-control gap-2">
         <label className="label">Tryb studiów</label>
         <div className="flex gap-2">
           <input
@@ -133,7 +136,7 @@ const AddStudent = () => {
         {errors.mode?.type === 'required' && (
           <InputError>Wybierz tryb studiów</InputError>
         )}
-      </div>
+      </div> */}
       <button className="btn btn-success mt-4">Dodaj studenta</button>
     </form>
   )

frontend/src/views/coordinator/Coordinator.tsx

@@ -6,6 +6,7 @@ const Coordinator = () => {
     <>
       <TopBar
         routes={[
+          { name: 'Home', path: '/coordinator/' },
           { name: 'Grupy', path: '/coordinator/groups' },
           { name: 'Studenci', path: '/coordinator/students' },
           { name: 'Opiekunowie', path: '/coordinator/leaders' },

frontend/src/views/coordinator/Home.tsx

@@ -0,0 +1,92 @@
+import { useForm } from 'react-hook-form'
+import { useMutation, useQuery } from 'react-query'
+import {
+  createYearGroup,
+  CreateYearGroup,
+  getYearGroups,
+} from '../../api/yearGroups'
+
+const Home = () => {
+  const { register, handleSubmit } = useForm<{
+    name: string
+    mode: string
+  }>({
+    mode: 'onBlur',
+  })
+
+  const { data: yearGroups, refetch } = useQuery(['yearGroups'], () =>
+    getYearGroups({ per_page: 100 }),
+  )
+
+  const { mutate: mutateCreateYearGroup } = useMutation(
+    ['createYearGroup'],
+    (payload: CreateYearGroup) => createYearGroup(payload),
+    {
+      onSuccess: () => {
+        refetch()
+      },
+    },
+  )
+  const onSubmit = (data: any) => {
+    mutateCreateYearGroup(data)
+  }
+
+  return (
+    <div>
+      <form
+        className="w-full lg:w-1/4 flex flex-col mb-5"
+        onSubmit={handleSubmit(onSubmit)}
+      >
+        <div className="form-control">
+          <label className="label" htmlFor="title">
+            Nazwa
+          </label>
+          <input
+            className="input input-bordered"
+            id="title"
+            type="text"
+            {...register('name', { required: true })}
+          />
+          <div className="form-control gap-2">
+            <label className="label">Tryb studiów</label>
+            <div className="flex gap-2">
+              <input
+                className="radio"
+                id="mode-1"
+                type="radio"
+                {...register('mode', {
+                  required: true,
+                })}
+                value="s"
+                checked
+              />
+              <label htmlFor="mode-1">Stacjonarny</label>
+            </div>
+            <div className="flex gap-2">
+              <input
+                className="radio"
+                id="mode-0"
+                type="radio"
+                {...register('mode', {
+                  required: true,
+                })}
+                value="n"
+              />
+              <label htmlFor="mode-0">Niestacjonarny</label>
+            </div>
+          </div>
+        </div>
+        <button className="btn btn-success mt-4">Stwórz grupę roku</button>
+      </form>
+      <h2 className="text-2xl font-bold mb-2">Grupy:</h2>
+      {yearGroups &&
+        yearGroups?.data?.year_groups.map((yearGroup) => (
+          <h3 className="text-xl " key={yearGroup.name}>
+            - {yearGroup.name}
+          </h3>
+        ))}
+    </div>
+  )
+}
+
+export default Home

frontend/src/views/coordinator/Schedules.tsx

@@ -91,7 +91,6 @@ const Schedules = () => {
             >
               {schedule.title}
             </Link>
-            1
           </h3>
         ))}
     </div>