Skip to content
This repository has been archived by the owner on May 16, 2023. It is now read-only.

Commit

Permalink
feat: add weekly, monthly statistics (#236)
Browse files Browse the repository at this point in the history
* added statistics for today, this week and this month

* revised layout

* revised

Co-authored-by: fOppenheimer <Fatma.Krueger@T-Systems.com>
  • Loading branch information
ggrund-tsi and fOppenheimer authored Sep 8, 2021
1 parent 746aa2f commit 38295da
Show file tree
Hide file tree
Showing 4 changed files with 141 additions and 17 deletions.
67 changes: 65 additions & 2 deletions src/api.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -339,6 +339,10 @@ export const useGetTests = (onError?: (error: any) => void) => {
export const useStatistics = (onSuccess?: (status: number) => void, onError?: (error: any) => void) => {
const { keycloak, initialized } = useKeycloak();
const [statisticData, setStatisticData] = React.useState<StatisticData>();
const [thisWeekStatisticData, setThisWeekStaticData] = React.useState<StatisticData>();
const [thisMonthStatisticData, setThisMonthStatisticData] = React.useState<StatisticData>()

let uri = '/api/quickteststatistics';

const header = {
"Authorization": initialized ? `Bearer ${keycloak.token}` : "",
Expand All @@ -362,8 +366,65 @@ export const useStatistics = (onSuccess?: (status: number) => void, onError?: (e
}
// eslint-disable-next-line react-hooks/exhaustive-deps
}, []);

React.useEffect(() => {
if (!thisWeekStatisticData) {
let today = new Date();
today.setUTCHours(0, 0, 0, 0);
let startDay = today.getDate() - today.getDay() + 1;

let start = new Date(today.setDate(startDay));
let end = new Date();

let thisWeekUri = uri + '?dateFrom=' + start.toISOString() + '&dateTo=' + end.toISOString();

api.get(thisWeekUri, { headers: header })
.then(response => {
setThisWeekStaticData(response.data);
if (onSuccess) {
onSuccess(response?.status);
}
})
.catch(error => {
if (onError) {
onError(error);
}
});
}
// eslint-disable-next-line react-hooks/exhaustive-deps
}, []);

React.useEffect(() => {
if (!thisMonthStatisticData) {
let start = new Date();
start.setDate(1);
start.setUTCHours(0, 0, 0, 0);
let end = new Date();

let thisMonthUri = uri + '?dateFrom=' + start.toISOString() + '&dateTo=' + end.toISOString();

api.get(thisMonthUri, { headers: header })
.then(response => {
setThisMonthStatisticData(response.data);
if (onSuccess) {
onSuccess(response?.status);
}
})
.catch(error => {
if (onError) {
onError(error);
}
});
}
// eslint-disable-next-line react-hooks/exhaustive-deps
}, []);

return [
statisticData,
thisWeekStatisticData,
thisMonthStatisticData
] as const;

return statisticData;
}

export const useGetKeycloakConfig = (onSuccess?: (status: number) => void, onError?: (error: any) => void) => {
Expand Down Expand Up @@ -687,4 +748,6 @@ export const addGroupAsChild = (childGroupId: string, parentGroupId: string, tok
};
const uri = '/api/usermanagement/groups/' + parentGroupId + '/subgroups';
return api.post(uri, JSON.stringify({ groupId: childGroupId }), { headers: header })
}
}


5 changes: 4 additions & 1 deletion src/assets/i18n/de/translation.json
Original file line number Diff line number Diff line change
Expand Up @@ -59,11 +59,14 @@
"error-message": "Fehlermeldung",
"serverError": "Es ist ein Fehler aufgetreten: ",
"error-patient-data-load": "Patientendaten konnten nicht geladen werden.",
"statistics": "Auswertungen für den ",
"statistics": "Auswertungen",
"statistics-menu-item": "Auswertungen",
"failed-report": "Testergebnisse",
"totalTestCount": "Gesamtanzahl der Tests",
"positiveTestCount": "Anzahl der positiven Tests",
"today": "Heute",
"thisWeek": "Diese Woche",
"thisMonth": "Dieser Monat",
"successfull-transferred": "Die Daten wurden erfolgreich übermittelt",
"timerange": "Testzeitraum",
"from": "am",
Expand Down
3 changes: 3 additions & 0 deletions src/assets/i18n/en/translation.json
Original file line number Diff line number Diff line change
Expand Up @@ -61,6 +61,9 @@
"failed-report": "Test Report",
"totalTestCount": "Total test count",
"positiveTestCount": "Positive test count",
"today": "Today",
"thisWeek": "This week",
"thisMonth": "This month",
"successfull-transferred": "Data successfully transferred",
"timerange": "Timerange",
"from": "from",
Expand Down
83 changes: 69 additions & 14 deletions src/components/statistics.component.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -20,7 +20,7 @@
*/

import React from 'react';
import { Button, Card, Col, Fade, Row } from 'react-bootstrap'
import { Button, Card, Col, Fade, Form, Row } from 'react-bootstrap'

import '../i18n';
import { useTranslation } from 'react-i18next';
Expand All @@ -44,7 +44,9 @@ const Statistics = (props: any) => {
props.setError({ error: error, message: msg, onCancel: context.navigation!.toLanding });
}

const statisticData = useStatistics(undefined, handleError);
const [statisticData,
thisWeekStatisticData,
thisMonthStatisticData] = useStatistics(undefined, handleError);
const [isInit, setIsInit] = React.useState(false)

React.useEffect(() => {
Expand All @@ -53,35 +55,88 @@ const Statistics = (props: any) => {
}, [context.navigation, context.valueSets, statisticData])

return (
!(isInit && context && context.valueSets)
!(isInit && context && context.valueSets && statisticData && thisWeekStatisticData && thisMonthStatisticData)
? <CwaSpinner />
: <Fade appear={true} in={true} >
<Card id='data-card'>
<CardHeader title={t('translation:statistics') + new Date().toLocaleDateString()} />
<CardHeader title={t('translation:statistics')} />

{/*
content area with patient inputs and check box
*/}
<Card.Body id='data-header'>
<Row>
<Col md='6'>
<Card.Text className='input-label jcc-xs-jcfs-sm mb-0' >{t('translation:totalTestCount')}</Card.Text>
<Col xs='12' md='3'>
<Form.Label className='input-label jcc-xs-jcfs-md mb-md-0'>{t('translation:today')}</Form.Label>
</Col>
<Col md='6'>
{statisticData!.totalTestCount}
<Col md='9'>
<Row className='text-center'>
<Col >
{t('translation:totalTestCount')}
</Col>
<Col>
{t('translation:positiveTestCount')}
</Col>
</Row>
<Row className='text-center'>
<Col>
{statisticData!.totalTestCount}
</Col>
<Col>
{statisticData!.totalTestCount > 0 ? statisticData!.positiveTestCount + ' ( ' + (100 * statisticData!.positiveTestCount / statisticData!.totalTestCount).toFixed(2) + "% )" : undefined}
</Col>
</Row>
</Col>
</Row>
<hr />
<Row>
<Col md='6'>
<Card.Text className='input-label jcc-xs-jcfs-sm mb-0' >{t('translation:positiveTestCount')}</Card.Text>
<Col xs='12' md='3'>
<Form.Label className='input-label jcc-xs-jcfs-md mb-md-0'>{t('translation:thisWeek')}</Form.Label>
</Col>
<Col md='3'>
{statisticData!.positiveTestCount}
<Col md='9'>
<Row className='text-center'>
<Col >
{t('translation:totalTestCount')}
</Col>
<Col>
{t('translation:positiveTestCount')}
</Col>
</Row>
<Row className='text-center'>
<Col>
{thisWeekStatisticData!.totalTestCount}
</Col>
<Col>
{thisWeekStatisticData!.totalTestCount > 0 ? thisWeekStatisticData!.positiveTestCount + ' ( ' + (100 * thisWeekStatisticData!.positiveTestCount / thisWeekStatisticData!.totalTestCount).toFixed(2) + "% )" : undefined}
</Col>
</Row>
</Col>
<Col md='3'>
{statisticData!.totalTestCount > 0 ? (100 * statisticData!.positiveTestCount / statisticData!.totalTestCount).toFixed(2) : undefined} %
</Row>
<hr />
<Row>
<Col xs='12' md='3'>
<Card.Text className='input-label jcc-xs-jcfs-md mb-2 mb-md-0' >{t('translation:thisMonth')}</Card.Text>
</Col>
<Col md='9'>
<Row className='text-center'>
<Col >
{t('translation:totalTestCount')}
</Col>
<Col>
{t('translation:positiveTestCount')}
</Col>
</Row>
<Row className='text-center'>
<Col>
{thisMonthStatisticData!.totalTestCount}
</Col>
<Col>
{thisMonthStatisticData!.totalTestCount > 0 ? thisMonthStatisticData!.positiveTestCount + ' ( ' + (100 * thisMonthStatisticData!.positiveTestCount / thisMonthStatisticData!.totalTestCount).toFixed(2) + "% )" : undefined}
</Col>
</Row>
</Col>
</Row>
<hr />
</Card.Body>

{/*
Expand Down

0 comments on commit 38295da

Please sign in to comment.