diff options
| -rw-r--r-- | modern/src/common/chartTypes.js | 7 | ||||
| -rw-r--r-- | modern/src/common/converter.js | 24 | ||||
| -rw-r--r-- | modern/src/common/formatter.js | 23 | ||||
| -rw-r--r-- | modern/src/reports/ChartReportPage.js | 21 | ||||
| -rw-r--r-- | modern/src/reports/ReportLayoutPage.js | 11 |
5 files changed, 42 insertions, 44 deletions
diff --git a/modern/src/common/chartTypes.js b/modern/src/common/chartTypes.js deleted file mode 100644 index fa868a9..0000000 --- a/modern/src/common/chartTypes.js +++ /dev/null @@ -1,7 +0,0 @@ -import t from '../common/localization'; - -export const chartTypes = [ - { id: 'speed', name: t('positionSpeed') }, - { id: 'accuracy', name: t('positionAccuracy') }, - { id: 'altitude', name: t('positionAltitude') }, -]; diff --git a/modern/src/common/converter.js b/modern/src/common/converter.js new file mode 100644 index 0000000..8fdb4b8 --- /dev/null +++ b/modern/src/common/converter.js @@ -0,0 +1,24 @@ +const speedConverter = (value, unit) => { + let factor; + switch (unit) { + case 'kmh': + factor = 1.852; + case 'mph': + factor = 1.15078; + case 'kn': + default: + factor = 1; + } + return (value * factor).toFixed(2); +}; + +export const getConverter = (key) => { + switch (key) { + case 'speed': + return speedConverter; + default: + return function (value) { + return value; + } + } +};
\ No newline at end of file diff --git a/modern/src/common/formatter.js b/modern/src/common/formatter.js index b2f305a..e41e591 100644 --- a/modern/src/common/formatter.js +++ b/modern/src/common/formatter.js @@ -80,26 +80,3 @@ export const formatVolume = (value, unit) => { export const formatHours = (value) => { return moment.duration(value).humanize(); }; - -const speedConverter = (value, unit) => { - switch (unit) { - case 'kmh': - return (value * 1.852).toFixed(2); - case 'mph': - return (value * 1.15078).toFixed(2); - case 'kn': - default: - return (value * 1).toFixed(2); - } -}; - -export const getConverter = (key) => { - switch (key) { - case 'speed': - return speedConverter; - default: - return function (value) { - return value; - } - } -}; diff --git a/modern/src/reports/ChartReportPage.js b/modern/src/reports/ChartReportPage.js index 5aefca1..19ec9c1 100644 --- a/modern/src/reports/ChartReportPage.js +++ b/modern/src/reports/ChartReportPage.js @@ -3,7 +3,8 @@ import { Box, Paper } from '@material-ui/core'; import ReportFilter from './ReportFilter'; import ReportLayoutPage from './ReportLayoutPage'; import { useAttributePreference } from '../common/preferences'; -import { getConverter, formatDate } from '../common/formatter'; +import { formatDate } from '../common/formatter'; +import { getConverter } from '../common/converter'; import {LineChart, Line, XAxis, YAxis, CartesianGrid, Tooltip, Legend, ResponsiveContainer } from 'recharts'; const ReportFilterForm = ({ setItems }) => { @@ -14,13 +15,17 @@ const ReportFilterForm = ({ setItems }) => { const query = new URLSearchParams({ deviceId, from, to, mail }); const response = await fetch(`/api/reports/route?${query.toString()}`, { headers }); if (response.ok) { + const data = await response.json(); - let formattedData = data.map((obj)=>{ - return Object.assign(obj, - {speed: Number(getConverter('speed')(obj.speed, speedUnit))}, - {fixTime: formatDate(obj.fixTime)} - ); - }) + + let formattedData = data.map(obj => { + return Object.assign( + obj, + {speed: Number(getConverter('speed')(obj.speed, speedUnit))}, + {fixTime: formatDate(obj.fixTime)} + ); + }); + setItems(formattedData); } } @@ -46,7 +51,7 @@ const ChartReportPage = () => { const [type, setType] = useState('speed'); return ( - <ReportLayoutPage reportFilterForm={ReportFilterForm} setItems={setItems} setType={setType} showChartType> + <ReportLayoutPage reportFilterForm={ReportFilterForm} setItems={setItems} type={type} setType={setType} showChartType> <Paper> <Box height={400}> <ResponsiveContainer> diff --git a/modern/src/reports/ReportLayoutPage.js b/modern/src/reports/ReportLayoutPage.js index 53b7039..51e4101 100644 --- a/modern/src/reports/ReportLayoutPage.js +++ b/modern/src/reports/ReportLayoutPage.js @@ -1,7 +1,6 @@ import React from 'react'; import { Grid, Paper, makeStyles, FormControl, InputLabel, Select, MenuItem } from '@material-ui/core'; import MainToolbar from '../MainToolbar'; -import { chartTypes } from '../common/chartTypes'; import t from '../common/localization'; const useStyles = makeStyles(theme => ({ @@ -24,7 +23,7 @@ const useStyles = makeStyles(theme => ({ }, })); -const ReportLayoutPage = ({ reportFilterForm:ReportFilterForm, setItems, setType, showChartType, children }) => { +const ReportLayoutPage = ({ reportFilterForm:ReportFilterForm, setItems, type, setType, showChartType, children }) => { const classes = useStyles(); return ( <div className={classes.root}> @@ -39,10 +38,10 @@ const ReportLayoutPage = ({ reportFilterForm:ReportFilterForm, setItems, setType <Paper className={classes.chart}> <FormControl variant="filled" margin="normal" fullWidth> <InputLabel>{t('reportChartType')}</InputLabel> - <Select defaultValue="speed" onChange={e => setType(e.target.value)}> - {chartTypes.map(item => ( - <MenuItem key={item.id} value={item.id}>{item.name}</MenuItem> - ))} + <Select value={type} onChange={e => setType(e.target.value)}> + <MenuItem value="speed">{t('positionSpeed')}</MenuItem> + <MenuItem value="accuracy">{t('positionAccuracy')}</MenuItem> + <MenuItem value="altitude">{t('positionAltitude')}</MenuItem> </Select> </FormControl> </Paper> |