From f418231b6b2f5e030a0d2dcc390c314602b1f740 Mon Sep 17 00:00:00 2001 From: Anton Tananaev Date: Sat, 6 Apr 2024 09:22:10 -0700 Subject: Move modern to the top --- modern/src/reports/TripReportPage.jsx | 216 ---------------------------------- 1 file changed, 216 deletions(-) delete mode 100644 modern/src/reports/TripReportPage.jsx (limited to 'modern/src/reports/TripReportPage.jsx') diff --git a/modern/src/reports/TripReportPage.jsx b/modern/src/reports/TripReportPage.jsx deleted file mode 100644 index 897ee506..00000000 --- a/modern/src/reports/TripReportPage.jsx +++ /dev/null @@ -1,216 +0,0 @@ -import React, { useState } from 'react'; -import { useNavigate } from 'react-router-dom'; -import { - IconButton, Table, TableBody, TableCell, TableHead, TableRow, -} from '@mui/material'; -import GpsFixedIcon from '@mui/icons-material/GpsFixed'; -import LocationSearchingIcon from '@mui/icons-material/LocationSearching'; -import { - formatDistance, formatSpeed, formatVolume, formatTime, formatNumericHours, -} from '../common/util/formatter'; -import ReportFilter from './components/ReportFilter'; -import { useAttributePreference, usePreference } from '../common/util/preferences'; -import { useTranslation } from '../common/components/LocalizationProvider'; -import PageLayout from '../common/components/PageLayout'; -import ReportsMenu from './components/ReportsMenu'; -import ColumnSelect from './components/ColumnSelect'; -import usePersistedState from '../common/util/usePersistedState'; -import { useCatch, useEffectAsync } from '../reactHelper'; -import useReportStyles from './common/useReportStyles'; -import MapView from '../map/core/MapView'; -import MapRoutePath from '../map/MapRoutePath'; -import AddressValue from '../common/components/AddressValue'; -import TableShimmer from '../common/components/TableShimmer'; -import MapMarkers from '../map/MapMarkers'; -import MapCamera from '../map/MapCamera'; -import MapGeofence from '../map/MapGeofence'; -import scheduleReport from './common/scheduleReport'; - -const columnsArray = [ - ['startTime', 'reportStartTime'], - ['startOdometer', 'reportStartOdometer'], - ['startAddress', 'reportStartAddress'], - ['endTime', 'reportEndTime'], - ['endOdometer', 'reportEndOdometer'], - ['endAddress', 'reportEndAddress'], - ['distance', 'sharedDistance'], - ['averageSpeed', 'reportAverageSpeed'], - ['maxSpeed', 'reportMaximumSpeed'], - ['duration', 'reportDuration'], - ['spentFuel', 'reportSpentFuel'], - ['driverName', 'sharedDriver'], -]; -const columnsMap = new Map(columnsArray); - -const TripReportPage = () => { - const navigate = useNavigate(); - const classes = useReportStyles(); - const t = useTranslation(); - - const distanceUnit = useAttributePreference('distanceUnit'); - const speedUnit = useAttributePreference('speedUnit'); - const volumeUnit = useAttributePreference('volumeUnit'); - const hours12 = usePreference('twelveHourFormat'); - - const [columns, setColumns] = usePersistedState('tripColumns', ['startTime', 'endTime', 'distance', 'averageSpeed']); - const [items, setItems] = useState([]); - const [loading, setLoading] = useState(false); - const [selectedItem, setSelectedItem] = useState(null); - const [route, setRoute] = useState(null); - - const createMarkers = () => ([ - { - latitude: selectedItem.startLat, - longitude: selectedItem.startLon, - image: 'default-error', - }, - { - latitude: selectedItem.endLat, - longitude: selectedItem.endLon, - image: 'default-success', - }, - ]); - - useEffectAsync(async () => { - if (selectedItem) { - const query = new URLSearchParams({ - deviceId: selectedItem.deviceId, - from: selectedItem.startTime, - to: selectedItem.endTime, - }); - const response = await fetch(`/api/reports/route?${query.toString()}`, { - headers: { - Accept: 'application/json', - }, - }); - if (response.ok) { - setRoute(await response.json()); - } else { - throw Error(await response.text()); - } - } else { - setRoute(null); - } - }, [selectedItem]); - - const handleSubmit = useCatch(async ({ deviceId, from, to, type }) => { - const query = new URLSearchParams({ deviceId, from, to }); - if (type === 'export') { - window.location.assign(`/api/reports/trips/xlsx?${query.toString()}`); - } else if (type === 'mail') { - const response = await fetch(`/api/reports/trips/mail?${query.toString()}`); - if (!response.ok) { - throw Error(await response.text()); - } - } else { - setLoading(true); - try { - const response = await fetch(`/api/reports/trips?${query.toString()}`, { - headers: { Accept: 'application/json' }, - }); - if (response.ok) { - setItems(await response.json()); - } else { - throw Error(await response.text()); - } - } finally { - setLoading(false); - } - } - }); - - const handleSchedule = useCatch(async (deviceIds, groupIds, report) => { - report.type = 'trips'; - const error = await scheduleReport(deviceIds, groupIds, report); - if (error) { - throw Error(error); - } else { - navigate('/reports/scheduled'); - } - }); - - const formatValue = (item, key) => { - switch (key) { - case 'startTime': - case 'endTime': - return formatTime(item[key], 'minutes', hours12); - case 'startOdometer': - case 'endOdometer': - case 'distance': - return formatDistance(item[key], distanceUnit, t); - case 'averageSpeed': - case 'maxSpeed': - return formatSpeed(item[key], speedUnit, t); - case 'duration': - return formatNumericHours(item[key], t); - case 'spentFuel': - return formatVolume(item[key], volumeUnit, t); - case 'startAddress': - return (); - case 'endAddress': - return (); - default: - return item[key]; - } - }; - - return ( - } breadcrumbs={['reportTitle', 'reportTrips']}> -
- {selectedItem && ( -
- - - {route && ( - <> - - - - - )} - -
- )} -
-
- - - -
- - - - - {columns.map((key) => ({t(columnsMap.get(key))}))} - - - - {!loading ? items.map((item) => ( - - - {selectedItem === item ? ( - setSelectedItem(null)}> - - - ) : ( - setSelectedItem(item)}> - - - )} - - {columns.map((key) => ( - - {formatValue(item, key)} - - ))} - - )) : ()} - -
-
-
-
- ); -}; - -export default TripReportPage; -- cgit v1.2.3