fox/interviews_InfoTrack
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

integrate new ui design with api call

Browse Source
This commit is contained in:
Fox 2026-06-24 13:17:52 +01:00
parent ab6c443092
commit dd0c586a1f
2 changed files with 48 additions and 45 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

64
frontend/src/components/sidebar.tsx
View File

@ -5,8 +5,6 @@ import { useEffect, useState } from "react";
import NumberField from "./numberField";
import getRatingsProviders from "../functions/getRatingsProviders";
import capitaliseFirstLetter from "../functions/capitaliseFirstLetter";
import CheckIcon from '@mui/icons-material/Check';
import ClearIcon from '@mui/icons-material/Clear';
interface SidebarProps {
filters : FilterState;
@ -51,9 +49,9 @@ export default function Sidebar(props : SidebarProps) {
onChange={(_, value) => props.onChange(Object.assign({}, {...props.filters}, {nameOnly: value}))}
/>
</Box>
<Divider />
{!props.filters.nameOnly &&
<>
<Divider />
<Box sx={{ p: 2}}>
<Typography component='legend'>Cities</Typography>
<Autocomplete
@ -105,37 +103,37 @@ export default function Sidebar(props : SidebarProps) {
</Grid>
</Box>
<Divider />
<Box sx={{p: 2}}>
<Typography component='legend'>Results per Page</Typography>
<NumberField
label=""
value={props.filters.resultsPerPage}
onValueChange={value => props.onChange(Object.assign({}, {...props.filters}, {resultsPerPage: value, currentPage: 1}))}
min={10}
max={40}
/>
</Box>
<Divider />
<Box sx={{p: 2}}>
<InputLabel id='sort-label'>Sort By</InputLabel>
<Select
labelId='sort-label'
value={props.filters.sortBy}
onChange={(e : SelectChangeEvent) => props.onChange(Object.assign({}, {...props.filters}, {sortBy: (e.target as any).value}))}
>
{sortingOptions.map(option => {
return (
<MenuItem
value={option.value}
selected={option.value === props.filters.sortBy}
>
{option.name}
</MenuItem>
)
})}
</Select>
</Box>
</>}
<Box sx={{p: 2}}>
<Typography component='legend'>Results per Page</Typography>
<NumberField
label=""
value={props.filters.resultsPerPage}
onValueChange={value => props.onChange(Object.assign({}, {...props.filters}, {resultsPerPage: value, currentPage: 1}))}
min={10}
max={40}
/>
</Box>
<Divider />
<Box sx={{p: 2}}>
<InputLabel id='sort-label'>Sort By</InputLabel>
<Select
labelId='sort-label'
value={props.filters.sortBy}
onChange={(e : SelectChangeEvent) => props.onChange(Object.assign({}, {...props.filters}, {sortBy: (e.target as any).value}))}
>
{sortingOptions.map(option => {
return (
<MenuItem
value={option.value}
selected={option.value === props.filters.sortBy}
>
{option.name}
</MenuItem>
)
})}
</Select>
</Box>
</Paper>
)
}

29
frontend/src/functions/getSolicitors.ts
View File

@ -4,24 +4,29 @@ import FilterState from "../models/filterState";
import api from "./axios";
export default async function GetSolicitors(filters : FilterState) {
var minRating = filters.minRating;
if (minRating == null) {
minRating = 0;
}
let queryString = `pageSize=${filters.resultsPerPage}&pageNumber=${filters.currentPage}&ratingsProvider=${filters.ratingsProvider}&minRating=${minRating}`;
if (filters.cities.length > 0) {
queryString += '&cities=' + filters.cities.join('&cities=');
}
if (filters.sortBy != null) {
queryString += `&orderingType=${filters.sortBy}`;
}
let queryString = `pageSize=${filters.resultsPerPage}&pageNumber=${filters.currentPage}`;
if (filters.namePart != null && filters.namePart !== '') {
queryString += `&nameFilter=${filters.namePart}`;
}
if (!filters.nameOnly) {
var minRating = filters.minRating;
if (minRating == null) {
minRating = 0;
}
queryString += `&minRating=${minRating}&ratingsProvider=${filters.ratingsProvider}`;
if (filters.cities.length > 0) {
queryString += '&cities=' + filters.cities.join('&cities=');
}
}
if (filters.sortBy != null) {
queryString += `&orderingType=${filters.sortBy}`;
}
const response = await api.get(`/solicitors?${queryString}`);
return response.data as PaginationResponse<SolicitorSummary>;
}