From cee6b4ed848f5178881f5d48a4092fb2bec2bd6b Mon Sep 17 00:00:00 2001 From: Ashutosh Bishnoi Date: Tue, 30 Mar 2021 12:09:16 +0530 Subject: event report data-grid implementation --- modern/src/reports/EventReportPage.js | 54 +++++++++++++++++++---------------- 1 file changed, 30 insertions(+), 24 deletions(-) diff --git a/modern/src/reports/EventReportPage.js b/modern/src/reports/EventReportPage.js index 459383e..cbe2ced 100644 --- a/modern/src/reports/EventReportPage.js +++ b/modern/src/reports/EventReportPage.js @@ -1,8 +1,8 @@ import React, { useState } from 'react'; -import { TableContainer, Table, TableRow, TableCell, TableHead, TableBody, Paper } from '@material-ui/core'; +import { DataGrid } from '@material-ui/data-grid'; import { FormControl, InputLabel, Select, MenuItem } from '@material-ui/core'; import t from '../common/localization'; -import { formatPosition } from '../common/formatter'; +import { formatDate } from '../common/formatter'; import ReportFilter from './ReportFilter'; import ReportLayoutPage from './ReportLayoutPage'; @@ -59,30 +59,36 @@ const EventReportPage = () => { const [items, setItems] = useState([]); + const columns = [{ + headerName: t('positionFixTime'), + field: 'serverTime', + type: 'dateTime', + flex: 1, + valueFormatter: ({ value }) => formatDate(value), + }, { + headerName: t('sharedType'), + field: 'type', + type: 'string', + flex:1, + }, { + headerName: t('sharedGeofence'), + field: 'geofenceId', + type: 'number', + flex: 1, + }, { + headerName: t('sharedMaintenance'), + field: 'maintenanceId', + type: 'number', + flex: 1 + }]; + return ( }> - - - - - {t('positionFixTime')} - {t('sharedType')} - {t('sharedGeofence')} - {t('sharedMaintenance')} - - - - {items.map(item => ( - - {formatPosition(item, 'eventTime')} - {item.type} - {} - {} - - ))} - -
-
+
); } -- cgit v1.2.3