Add workload view

frontend/src/App.tsx

@@ -27,6 +27,7 @@ import AvailabilitySchedule from './views/coordinator/AvailabilitySchedule'
 import GradeCard from './views/GradeCard'
 import Group from './views/coordinator/Group'
 import dayjs from 'dayjs'
+import WorkloadStatistics from './views/coordinator/WorkloadStatistics'
 
 require('dayjs/locale/pl')
 dayjs.locale('pl')
@@ -65,6 +66,10 @@ function App() {
               path="supervisors_availability/:id"
               element={<AvailabilitySchedule />}
             />
+            <Route
+              path="schedule/:id/workload"
+              element={<WorkloadStatistics />}
+            />
           </Route>
           <Route path="student" element={<Student />}>
             <Route index element={<Navigate to="enrollment" />} />

frontend/src/api/schedule.ts

@@ -8,8 +8,9 @@ interface TermOfDefences {
   end_date: string
   title: string
   members_of_committee: {
-    members: { first_name: string; last_name: string }[]
+    first_name: string
-  }
+    last_name: string
+  }[]
   group: { name: string; students: Student[] }
 }
 
@@ -191,3 +192,13 @@ export const setDateOfExaminationSchedule = (
 export const generateTermsOfDefence = (scheduleId: number) => {
   return axiosInstance.post(`coordinator/enrollments/${scheduleId}/generate`)
 }
+
+export const geWorkloadStatistics = (scheduleId: number) => {
+  return axiosInstance.get<{
+    workloads: {
+      assigned_to_committee: number
+      full_name: string
+      groups_assigned_to_his_committee: number
+    }[]
+  }>(`coordinator/examination_schedule/${scheduleId}/workloads/`)
+}

frontend/src/views/coordinator/Schedule.tsx

@@ -8,7 +8,7 @@ import {
   getTermsOfDefencesWithGroups,
   setDateOfExaminationSchedule,
 } from '../../api/schedule'
-import { useParams } from 'react-router-dom'
+import { Link, useParams } from 'react-router-dom'
 import Modal from 'react-modal'
 import { Controller, NestedValue, useForm } from 'react-hook-form'
 import EditSchedule from './EditSchedule'
@@ -307,13 +307,20 @@ const Schedule = () => {
           ZAPISZ
         </button>
       </div>
-
+      <div className="flex self-end gap-4 mb-4">
-      <button
+        <Link
-        className="btn btn-success btn-xs md:btn-md self-end mb-4"
+          className="underline font-bold self-center"
-        onClick={() => mutateDownload(Number(id))}
+          to={`/coordinator/schedule/${id}/workload`}
-      >
+        >
-        Eksportuj harmonogram
+          Statystyki
-      </button>
+        </Link>
+        <button
+          className="btn btn-success btn-xs md:btn-md "
+          onClick={() => mutateDownload(Number(id))}
+        >
+          Eksportuj harmonogram
+        </button>
+      </div>
       <Calendar
         localizer={localizer}
         startAccessor="start"

frontend/src/views/coordinator/WorkloadStatistics.tsx

@@ -0,0 +1,35 @@
+import { useQuery } from 'react-query'
+import { useParams } from 'react-router-dom'
+import { geWorkloadStatistics } from '../../api/schedule'
+
+const WorkloadStatistics = () => {
+  const { id } = useParams<{ id: string }>()
+
+  const { data: workloads } = useQuery(['workload'], () =>
+    geWorkloadStatistics(Number(id)),
+  )
+  return (
+    <div className="flex">
+      <table className="table table-compact border border-gray-100">
+        <thead>
+          <tr className="bg-gray-50">
+            <th>Imię i nazwisko</th>
+            <th>Ilość przypisanych komisji</th>
+          </tr>
+        </thead>
+        <tbody className="divide-y divide-gray-100">
+          {workloads?.data?.workloads.map(
+            ({ full_name, assigned_to_committee }) => (
+              <tr key={full_name}>
+                <td>{full_name}</td>
+                <td>{assigned_to_committee}</td>
+              </tr>
+            ),
+          )}
+        </tbody>
+      </table>
+    </div>
+  )
+}
+
+export default WorkloadStatistics