diff options
Diffstat (limited to 'modern/src/reports/ReplayPage.js')
-rw-r--r-- | modern/src/reports/ReplayPage.js | 18 |
1 files changed, 16 insertions, 2 deletions
diff --git a/modern/src/reports/ReplayPage.js b/modern/src/reports/ReplayPage.js index b762e58..7a4bc96 100644 --- a/modern/src/reports/ReplayPage.js +++ b/modern/src/reports/ReplayPage.js @@ -14,7 +14,7 @@ import MainToolbar from '../MainToolbar'; import Map from '../map/Map'; import ReplayPathMap from '../map/ReplayPathMap'; import PositionsMap from '../map/PositionsMap'; -import { formatPosition, formatSpeed } from '../common/formatter'; +import { formatPosition, formatSpeed, formatDistance } from '../common/formatter'; import ReportFilter from './ReportFilter'; import { useTranslation } from '../LocalizationProvider'; import { useAttributePreference } from '../common/preferences'; @@ -58,6 +58,7 @@ const ReplayPage = () => { const [playback, setPlayback] = useState(false); const [expanded, setExpanded] = useState(true); const [positions, setPositions] = useState([]); + const [totalDistance, setTotalDistance] = useState(0.0); const [index, setIndex] = useState(0); const handleSubmit = async (deviceId, from, to, _, headers) => { @@ -67,6 +68,14 @@ const ReplayPage = () => { setIndex(0); setPositions(await response.json()); setExpanded(false); + + const response2 = await fetch(`/api/reports/summary?${query.toString()}`, { headers }); + if (response2.ok) { + let data = await response2.json(); + if (data.length > 0) { + setTotalDistance (data[0].distance); + } + } } }; @@ -102,8 +111,13 @@ const ReplayPage = () => { {positions[index].speed != undefined && <> <br/> + <Box flexGrow={1}> + <Typography variant="secondary"> + {formatSpeed(positions[index].speed, speedUnit, t)} + </Typography> + </Box> <Typography variant="secondary"> - {formatSpeed(positions[index].speed, speedUnit, t)} + <b>{t('deviceTotalDistance')}</b> {formatDistance(totalDistance, 'km', t)} </Typography> </>} </Box> |