source: sources/client/src/screens/AdminHomeScreen/index.js@ e8b1076

Last change on this file since e8b1076 was 3a58bd6, checked in by Viktor <39170279+Tasevski2@…>, 3 years ago

Added Frontend

  • Property mode set to 100644
File size: 3.1 KB
Line 
1import { Route, Switch, Redirect } from 'react-router-dom';
2import { useHistory } from 'react-router-dom';
3
4import {
5 Container,
6 Header,
7 TitleAndLogoWrapper,
8 LogoWrapper,
9 Logo,
10 HeaderTitle,
11 UserNameAndLogoutWrapper,
12 UserName,
13 LogoutIcon,
14 HeaderAndMainSectionWrapper,
15 SideMenu,
16 DashboardIcon,
17 SupervisorAccountIcon,
18 MainSection,
19 DividerUnderHeader,
20 UserIcon,
21} from './styles';
22
23import IconButton from '@mui/material/IconButton';
24
25import logo from '../../resources/logo_2_transparent_bg.jpg';
26import { roles } from '../../config/enums';
27import DestinationComponent from '../../utils/DestinationComponent';
28import onClickRouting from '../../utils/onClickRouting';
29
30import ParkingZones from '../../components/admin/ParkingZones';
31import EmployeesTable from '../../components/admin/EmployeesTable';
32import EmployeeEdit from '../../components/admin/EmployeeEdit';
33import EmployeeCreate from '../../components/admin/EmployeeCreate';
34import ParkingZone from '../../components/admin/ParkingZone';
35
36const ToParkingZones = new DestinationComponent('/', ParkingZones, true);
37const ToEmployeesTable = new DestinationComponent(
38 '/employees',
39 EmployeesTable,
40 true
41);
42const ToEmployeeCreate = new DestinationComponent(
43 '/employees/create',
44 EmployeeCreate,
45 true
46);
47const ToEmployeeEdit = new DestinationComponent(
48 '/employees/:employeeId',
49 EmployeeEdit,
50 true
51);
52const ToParkingZone = new DestinationComponent(
53 '/zone/:zone_id',
54 ParkingZone,
55 true
56);
57
58const adminRoutes = [
59 ToParkingZones,
60 ToEmployeesTable,
61 ToEmployeeCreate,
62 ToEmployeeEdit,
63 ToParkingZone,
64];
65
66const employeeRoutes = [ToParkingZones, ToParkingZone];
67
68const AdminHomeScreen = (props) => {
69 let history = useHistory();
70 const user = {
71 role: 'ROLE_ADMIN',
72 };
73
74 let routes = user.role === roles.admin ? adminRoutes : employeeRoutes;
75
76 return (
77 <Container>
78 <SideMenu>
79 <IconButton onClick={() => onClickRouting('/', history)}>
80 <DashboardIcon />
81 </IconButton>
82 {user.role === roles.admin ? (
83 <IconButton onClick={() => onClickRouting('/employees', history)}>
84 <SupervisorAccountIcon />
85 </IconButton>
86 ) : null}
87 </SideMenu>
88
89 <HeaderAndMainSectionWrapper>
90 <Header>
91 <TitleAndLogoWrapper>
92 <LogoWrapper>
93 <Logo src={logo} />
94 </LogoWrapper>
95 <HeaderTitle>Park Up</HeaderTitle>
96 </TitleAndLogoWrapper>
97
98 <UserNameAndLogoutWrapper>
99 <UserIcon />
100 <UserName>Viktor Tasevski</UserName>
101 <IconButton>
102 <LogoutIcon />
103 </IconButton>
104 </UserNameAndLogoutWrapper>
105 </Header>
106 <DividerUnderHeader />
107 <MainSection>
108 <Switch>
109 {routes?.map((route, index) => (
110 <Route
111 key={index}
112 path={route.path}
113 component={route.component}
114 exact={route.exact}
115 />
116 ))}
117 <Redirect to='/' />
118 </Switch>
119 </MainSection>
120 </HeaderAndMainSectionWrapper>
121 </Container>
122 );
123};
124
125export default AdminHomeScreen;
Note: See TracBrowser for help on using the repository browser.