s459309/system-pri
3
3
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Reload on year change

Browse Source
This commit is contained in:
adam-skowronek 2023-01-03 23:01:28 +01:00
parent d01fa307c6
commit 98e203efb2
1 changed files with 27 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

45
frontend/src/components/TopBar.tsx
View File

@ -11,8 +11,15 @@ type SelectValue = {
label: string label: string
} }
const TopBar = ({ routes, color }: { routes: { name: string; path: string }[]; color: string}, ) => { const TopBar = ({
const linkClass = ({ isActive }: { isActive: boolean }) => isActive ? 'underline font-bold' : '' routes,
color,
}: {
routes: { name: string; path: string }[]
color: string
}) => {
const linkClass = ({ isActive }: { isActive: boolean }) =>
isActive ? 'underline font-bold' : ''
const [yearGroupId, setYearGroupId] = useLocalStorageState('yearGroupId', { const [yearGroupId, setYearGroupId] = useLocalStorageState('yearGroupId', {
defaultValue: -1, defaultValue: -1,
@ -21,11 +28,10 @@ const TopBar = ({ routes, color }: { routes: { name: string; path: string }[]; c
defaultValue: 'coordinator', defaultValue: 'coordinator',
}) })
const [yearGroupOptions, setYearGroupOptions] = useState<SelectValue[]>() const [yearGroupOptions, setYearGroupOptions] = useState<SelectValue[]>()
const [name, setName] = useState("")
const onYearChange = (v: any) => { const onYearChange = (v: any) => {
setYearGroupId(v?.value) setYearGroupId(v?.value)
window.location.reload()
} }
useQuery('year_groups', () => getYearGroups({ per_page: 100 }), { useQuery('year_groups', () => getYearGroups({ per_page: 100 }), {
onSuccess: (data) => { onSuccess: (data) => {
@ -41,7 +47,7 @@ const TopBar = ({ routes, color }: { routes: { name: string; path: string }[]; c
}) })
return ( return (
<div className={"flex items-center py-6 px-10 shadow " + color}> <div className={'flex items-center py-6 px-10 shadow ' + color}>
<h1 className="text-xl font-bold">System PRI</h1> <h1 className="text-xl font-bold">System PRI</h1>
<div className="flex ml-10 gap-3"> <div className="flex ml-10 gap-3">
{routes.map(({ path, name }) => ( {routes.map(({ path, name }) => (
@ -51,19 +57,22 @@ const TopBar = ({ routes, color }: { routes: { name: string; path: string }[]; c
))} ))}
</div> </div>
<div className="m-auto flex-col"> <div className="m-auto flex-col">
{userType == 'coordinator' ? <Select {userType === 'coordinator' ? (
closeMenuOnSelect={true} <Select
options={yearGroupOptions} closeMenuOnSelect={true}
placeholder="Wybierz rok" options={yearGroupOptions}
onChange={onYearChange} placeholder="Wybierz rok"
styles={{ onChange={onYearChange}
control: (styles: any) => ({ styles={{
...styles, control: (styles: any) => ({
padding: '0.01rem', ...styles,
borderRadius: '0.5rem', padding: '0.01rem',
}), borderRadius: '0.5rem',
}} }),
/> : null} }}
value={yearGroupOptions?.find((year) => year.value === yearGroupId)}
/>
) : null}
</div> </div>
<NavLink className="ml-auto" to="/"> <NavLink className="ml-auto" to="/">
Wyloguj Wyloguj