SP-9 Dodanie filtrowania studentów bez grypy
This commit is contained in:
parent
79aac03500
commit
b03e369b73
@ -1,4 +1,4 @@
|
||||
import React from 'react'
|
||||
import React, { useState } from 'react'
|
||||
import { useMutation, useQuery } from 'react-query'
|
||||
import { getStudents, uploadStudents } from '../../api/students'
|
||||
|
||||
@ -30,28 +30,44 @@ const Students = () => {
|
||||
mutateUpload(payload)
|
||||
}
|
||||
|
||||
const [state, setState] = useState({
|
||||
showGroupless: false
|
||||
});
|
||||
|
||||
if (isStudentsLoading) {
|
||||
return <div>Ładowanie</div>
|
||||
}
|
||||
return (
|
||||
<div>
|
||||
<button className="bg-green-400 p-3 rounded-lg text-white font-extrabold hover:bg-green-300">
|
||||
Dodaj nowego studenta
|
||||
</button>
|
||||
<label
|
||||
className="ml-4 text-green-400 font-extrabold rounded-lg border-2 p-3 border-green-400 hover:border-green-300 cursor-pointer"
|
||||
htmlFor="file"
|
||||
>
|
||||
Importuj
|
||||
</label>
|
||||
<input
|
||||
type="file"
|
||||
id="file"
|
||||
name="avatar"
|
||||
accept=".csv"
|
||||
className="hidden"
|
||||
onChange={handleOnChange}
|
||||
/>
|
||||
<div className="flex items-center">
|
||||
<button className="bg-green-400 p-3 rounded-lg text-white font-extrabold hover:bg-green-300">
|
||||
Dodaj nowego studenta
|
||||
</button>
|
||||
<label
|
||||
className="ml-4 text-green-400 font-extrabold rounded-lg border-2 p-3 border-green-400 hover:border-green-300 cursor-pointer"
|
||||
htmlFor="file"
|
||||
>
|
||||
Importuj
|
||||
</label>
|
||||
<input
|
||||
type="file"
|
||||
id="file"
|
||||
name="avatar"
|
||||
accept=".csv"
|
||||
className="hidden"
|
||||
onChange={handleOnChange}
|
||||
/>
|
||||
<label className="ml-auto">
|
||||
<span className="slider round">Tylko niezapisani</span>
|
||||
<input type="checkbox"
|
||||
className="m-2 checked: bg-black-400"
|
||||
onChange={() => setState({
|
||||
...state,
|
||||
showGroupless: !state.showGroupless
|
||||
})}
|
||||
/>
|
||||
</label>
|
||||
</div>
|
||||
|
||||
<div className="flex mx-auto mt-5 overflow-hidden overflow-x-auto border border-gray-100 rounded">
|
||||
<table className="min-w-full text-sm divide-y divide-gray-200">
|
||||
@ -65,7 +81,9 @@ const Students = () => {
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody className="divide-y divide-gray-100">
|
||||
{students?.data?.students?.map(
|
||||
{students?.data?.students?.filter(
|
||||
(st) => (st.group === null || !state.showGroupless)
|
||||
).map(
|
||||
({ first_name, last_name, index, group, mode }) => (
|
||||
<tr key={index}>
|
||||
<td className="px-4 py-2 font-medium text-gray-900 whitespace-nowrap">
|
||||
|
Loading…
Reference in New Issue
Block a user