admin/ota-admin-portal
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

CEC-252, CEC-253 Remove modal status popup, new car selection control (#45)

Browse Source 
* Create multiselect car table control
Remove table overflow containers

* Include trim to add car form

* CEC-252 Replace modal status with link to car details page

* Remove send command from car status page
Fix menu key warning
This commit is contained in:
John Wu
2021-06-01 13:16:13 -07:00
committed by GitHub
parent 5943b42a91
commit c36f6976f7
15 changed files with 3096 additions and 2876 deletions
Download Patch File Download Diff File Expand all files Collapse all files

91
src/components/Cars/Status/index.jsx
View File

@@ -1,11 +1,9 @@
import React, { useEffect, useState } from "react";
import { useParams } from "react-router";
import {
Grid,
Table,
TableBody,
TableCell,
TableContainer,
TableFooter,
TablePagination,
TableRow,
@@ -16,13 +14,11 @@ import {
useUpdatesContext,
} from "../../Contexts/UpdatesContext";
import { VehicleProvider } from "../../Contexts/VehicleContext";
import { useUserContext } from "../../Contexts/UserContext";
import { useStatusContext } from "../../Contexts/StatusContext";
import useStyles from "../../useStyles";
import { LocalDateTimeString } from "../../../utils/dates";
import TableHeaderSortable from "../../Table/HeaderSortable";
import SendCommand from "../SendCommand";
const tableColumns = [
{
@@ -107,54 +103,47 @@ const MainForm = () => {
return (
<div className={classes.paper} style={{ height: 700, width: "100%" }}>
<TableContainer>
<Table>
<TableHeaderSortable
classes={classes}
orderBy={orderBy}
order={order}
columnData={tableColumns}
onSortRequest={handleSort}
/>
<TableBody>
{carUpdates.map((row) => (
<TableRow key={row.id}>
<TableCell align="center">{row.id}</TableCell>
<TableCell align="center">{`${row.updatepackage.package_name} ${row.updatepackage.version}`}</TableCell>
<TableCell align="center">{row.status}</TableCell>
<TableCell align="center">
{LocalDateTimeString(row.created)}
</TableCell>
<TableCell align="center">
{LocalDateTimeString(row.updated)}
</TableCell>
</TableRow>
))}
</TableBody>
<TableFooter>
<TableRow>
<TablePagination
rowsPerPageOptions={[5, 10, 25, 100]}
colSpan={5}
count={totalCarUpdates}
rowsPerPage={pageSize}
page={pageIndex}
SelectProps={{
inputProps: { "aria-label": "rows per page" },
native: true,
}}
onChangePage={handleChangePageIndex}
onChangeRowsPerPage={handleChangePageSize}
/>
<Table>
<TableHeaderSortable
classes={classes}
orderBy={orderBy}
order={order}
columnData={tableColumns}
onSortRequest={handleSort}
/>
<TableBody>
{carUpdates.map((row) => (
<TableRow key={row.id}>
<TableCell align="center">{row.id}</TableCell>
<TableCell align="center">{`${row.updatepackage.package_name} ${row.updatepackage.version}`}</TableCell>
<TableCell align="center">{row.status}</TableCell>
<TableCell align="center">
{LocalDateTimeString(row.created)}
</TableCell>
<TableCell align="center">
{LocalDateTimeString(row.updated)}
</TableCell>
</TableRow>
</TableFooter>
</Table>
</TableContainer>
<Grid container className={classes.root} spacing={2}>
<Grid item lg={6} md={12}>
<SendCommand vins={[vin]} />
</Grid>
</Grid>
))}
</TableBody>
<TableFooter>
<TableRow>
<TablePagination
rowsPerPageOptions={[5, 10, 25, 100]}
colSpan={5}
count={totalCarUpdates}
rowsPerPage={pageSize}
page={pageIndex}
SelectProps={{
inputProps: { "aria-label": "rows per page" },
native: true,
}}
onChangePage={handleChangePageIndex}
onChangeRowsPerPage={handleChangePageSize}
/>
</TableRow>
</TableFooter>
</Table>
</div>
);
};