[3a58bd6] | 1 | import { useEffect, useState } from 'react';
|
---|
| 2 | import {
|
---|
| 3 | Wrapper,
|
---|
| 4 | Title,
|
---|
| 5 | SessionsWrapper,
|
---|
| 6 | StatsWrapper,
|
---|
| 7 | Stats,
|
---|
| 8 | KeyValueWrapper,
|
---|
| 9 | StatsKey,
|
---|
| 10 | StatsValue,
|
---|
| 11 | } from './styles';
|
---|
| 12 | import SessionCard from './SessionCard';
|
---|
| 13 | import { sessionStatus } from '../../../config/enums';
|
---|
| 14 | import { sessionsData } from './mockData';
|
---|
| 15 |
|
---|
| 16 | const ParkingZoneSessions = ({ zone }) => {
|
---|
| 17 | const [sessions, setSession] = useState(sessionsData);
|
---|
| 18 | const [stats, setStats] = useState({
|
---|
| 19 | activeSessions: 0,
|
---|
| 20 | idleSessions: 0,
|
---|
| 21 | overSessions: 0,
|
---|
| 22 | });
|
---|
| 23 | const setSessionsStats = () => {
|
---|
| 24 | let aS = 0;
|
---|
| 25 | let iS = 0;
|
---|
| 26 | let oS = 0;
|
---|
| 27 | sessions.forEach((s) => {
|
---|
| 28 | switch (s.status) {
|
---|
| 29 | case sessionStatus.active:
|
---|
| 30 | aS += 1;
|
---|
| 31 | break;
|
---|
| 32 | case sessionStatus.idle:
|
---|
| 33 | iS += 1;
|
---|
| 34 | break;
|
---|
| 35 | case sessionStatus.over:
|
---|
| 36 | oS += 1;
|
---|
| 37 | break;
|
---|
| 38 | default:
|
---|
| 39 | break;
|
---|
| 40 | }
|
---|
| 41 | });
|
---|
| 42 | setStats({
|
---|
| 43 | activeSessions: aS,
|
---|
| 44 | idleSessions: iS,
|
---|
| 45 | overSessions: oS,
|
---|
| 46 | });
|
---|
| 47 | };
|
---|
| 48 |
|
---|
| 49 | useEffect(() => {
|
---|
| 50 | setSessionsStats();
|
---|
| 51 | }, [sessions]);
|
---|
| 52 |
|
---|
| 53 | return (
|
---|
| 54 | <Wrapper>
|
---|
| 55 | <Title>ОТВОРЕНИ ПАРКИНГ СЕСИИ</Title>
|
---|
| 56 | <StatsWrapper>
|
---|
| 57 | <Stats>
|
---|
| 58 | {/* PARKING SPACES STATS*/}
|
---|
| 59 | <KeyValueWrapper>
|
---|
| 60 | <StatsKey>Вкупно паркинг места:</StatsKey>
|
---|
| 61 | <StatsValue>{zone.parkingSpaces}</StatsValue>
|
---|
| 62 | </KeyValueWrapper>
|
---|
| 63 | <KeyValueWrapper>
|
---|
| 64 | <StatsKey>Слободни паркинг места:</StatsKey>
|
---|
| 65 | <StatsValue>
|
---|
| 66 | {zone.parkingSpaces - zone.takenParkingSpaces}
|
---|
| 67 | </StatsValue>
|
---|
| 68 | </KeyValueWrapper>
|
---|
| 69 | <KeyValueWrapper>
|
---|
| 70 | <StatsKey>Зафатени паркинг места:</StatsKey>
|
---|
| 71 | <StatsValue>{zone.takenParkingSpaces}</StatsValue>
|
---|
| 72 | </KeyValueWrapper>
|
---|
| 73 | </Stats>
|
---|
| 74 | {/* SESSIONS STATS*/}
|
---|
| 75 | <Stats>
|
---|
| 76 | <KeyValueWrapper>
|
---|
| 77 | <StatsKey>Активни паркинг сесии:</StatsKey>
|
---|
| 78 | <StatsValue>{stats.activeSessions}</StatsValue>
|
---|
| 79 | </KeyValueWrapper>
|
---|
| 80 | <KeyValueWrapper>
|
---|
| 81 | <StatsKey>Завршени паркинг сесии:</StatsKey>
|
---|
| 82 | <StatsValue>{stats.overSessions}</StatsValue>
|
---|
| 83 | </KeyValueWrapper>
|
---|
| 84 | <KeyValueWrapper>
|
---|
| 85 | <StatsKey>Неактивни паркинг сесии:</StatsKey>
|
---|
| 86 | <StatsValue>{stats.idleSessions}</StatsValue>
|
---|
| 87 | </KeyValueWrapper>
|
---|
| 88 | </Stats>
|
---|
| 89 | </StatsWrapper>
|
---|
| 90 | <SessionsWrapper>
|
---|
| 91 | {sessions.map((session) => (
|
---|
| 92 | <SessionCard key={session.id} {...session} />
|
---|
| 93 | ))}
|
---|
| 94 | </SessionsWrapper>
|
---|
| 95 | </Wrapper>
|
---|
| 96 | );
|
---|
| 97 | };
|
---|
| 98 |
|
---|
| 99 | export default ParkingZoneSessions;
|
---|