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

CEC-4206-ecu-page-cut-off (#321)

Browse Source 
* CEC-4206-ecu-page-cut-off

* fix test

* Update snapshots

* Fix tooltip title warning

---------

Co-authored-by: jwu-fisker <jwu@fiskerinc.com>
Co-authored-by: John Wu <76966357+jwu-fisker@users.noreply.github.com>
This commit is contained in:
das31
2023-04-25 17:25:22 -04:00
committed by GitHub
parent bd1f6f632c
commit 7b061c0282
3 changed files with 145 additions and 43 deletions
Download Patch File Download Diff File Expand all files Collapse all files

170
src/components/Cars/Status/__snapshots__/ECUsTab.test.jsx.snap
View File

@@ -273,49 +273,94 @@ exports[`ECUsTab Render 1`] = `
class="MuiTableRow-root" class="MuiTableRow-root"
> >
<td <td
class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignCenter" class="MuiTableCell-root MuiTableCell-body makeStyles-limitWidthTableCell-0 MuiTableCell-alignCenter"
> >
ECUA <span
class=""
title="ECUA"
>
ECUA
</span>
</td> </td>
<td <td
class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignCenter" class="MuiTableCell-root MuiTableCell-body makeStyles-limitWidthTableCell-0 MuiTableCell-alignCenter"
> >
SWVERSION <span
class=""
title="SWVERSION"
>
SWVERSION
</span>
</td> </td>
<td <td
class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignCenter" class="MuiTableCell-root MuiTableCell-body makeStyles-limitWidthTableCell-0 MuiTableCell-alignCenter"
> >
HWVERSION <span
class=""
title="HWVERSION"
>
HWVERSION
</span>
</td> </td>
<td <td
class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignCenter" class="MuiTableCell-root MuiTableCell-body makeStyles-limitWidthTableCell-0 MuiTableCell-alignCenter"
> >
VENDOR <span
class=""
title="VENDOR"
>
VENDOR
</span>
</td> </td>
<td <td
class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignCenter" class="MuiTableCell-root MuiTableCell-body makeStyles-limitWidthTableCell-0 MuiTableCell-alignCenter"
> >
SUPPLIER_SW_VERSION <span
class=""
title="SUPPLIER_SW_VERSION"
>
SUPPLIER_SW_VERSION
</span>
</td> </td>
<td <td
class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignCenter" class="MuiTableCell-root MuiTableCell-body makeStyles-limitWidthTableCell-0 MuiTableCell-alignCenter"
> >
SERIAL_NUMBER <span
class=""
title="SERIAL_NUMBER"
>
SERIAL_NUMBER
</span>
</td> </td>
<td <td
class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignCenter" class="MuiTableCell-root MuiTableCell-body makeStyles-limitWidthTableCell-0 MuiTableCell-alignCenter"
> >
BOOT_LOADER <span
class=""
title="BOOT_LOADER"
>
BOOT_LOADER
</span>
</td> </td>
<td <td
class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignCenter" class="MuiTableCell-root MuiTableCell-body makeStyles-limitWidthTableCell-0 MuiTableCell-alignCenter"
> >
CONFIG <span
class=""
title="CONFIG"
>
CONFIG
</span>
</td> </td>
<td <td
class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignCenter" class="MuiTableCell-root MuiTableCell-body makeStyles-limitWidthTableCell-0 MuiTableCell-alignCenter"
> >
FINGERPRINT <span
class=""
title="FINGERPRINT"
>
FINGERPRINT
</span>
</td> </td>
<td <td
class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignCenter" class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignCenter"
@@ -327,40 +372,85 @@ exports[`ECUsTab Render 1`] = `
class="MuiTableRow-root" class="MuiTableRow-root"
> >
<td <td
class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignCenter" class="MuiTableCell-root MuiTableCell-body makeStyles-limitWidthTableCell-0 MuiTableCell-alignCenter"
> >
ECUB <span
class=""
title="ECUB"
>
ECUB
</span>
</td> </td>
<td <td
class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignCenter" class="MuiTableCell-root MuiTableCell-body makeStyles-limitWidthTableCell-0 MuiTableCell-alignCenter"
> >
SWVERSION <span
class=""
title="SWVERSION"
>
SWVERSION
</span>
</td> </td>
<td <td
class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignCenter" class="MuiTableCell-root MuiTableCell-body makeStyles-limitWidthTableCell-0 MuiTableCell-alignCenter"
> >
HWVERSION <span
class=""
title="HWVERSION"
>
HWVERSION
</span>
</td> </td>
<td <td
class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignCenter" class="MuiTableCell-root MuiTableCell-body makeStyles-limitWidthTableCell-0 MuiTableCell-alignCenter"
/>
<td
class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignCenter"
/>
<td
class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignCenter"
/>
<td
class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignCenter"
/>
<td
class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignCenter"
> >
CONFIG <span
class=""
title="none"
/>
</td> </td>
<td <td
class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignCenter" class="MuiTableCell-root MuiTableCell-body makeStyles-limitWidthTableCell-0 MuiTableCell-alignCenter"
/> >
<span
class=""
title="none"
/>
</td>
<td
class="MuiTableCell-root MuiTableCell-body makeStyles-limitWidthTableCell-0 MuiTableCell-alignCenter"
>
<span
class=""
title="none"
/>
</td>
<td
class="MuiTableCell-root MuiTableCell-body makeStyles-limitWidthTableCell-0 MuiTableCell-alignCenter"
>
<span
class=""
title="none"
/>
</td>
<td
class="MuiTableCell-root MuiTableCell-body makeStyles-limitWidthTableCell-0 MuiTableCell-alignCenter"
>
<span
class=""
title="CONFIG"
>
CONFIG
</span>
</td>
<td
class="MuiTableCell-root MuiTableCell-body makeStyles-limitWidthTableCell-0 MuiTableCell-alignCenter"
>
<span
class=""
title="none"
/>
</td>
<td <td
class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignCenter" class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignCenter"
> >

11
src/components/Controls/CarECUsTable/index.jsx
View File

@@ -4,7 +4,8 @@ import {
TableCell, TableCell,
TableFooter, TableFooter,
TablePagination, TablePagination,
TableRow TableRow,
Tooltip
} from "@material-ui/core"; } from "@material-ui/core";
import clsx from "clsx"; import clsx from "clsx";
import React, { useEffect, useState } from "react"; import React, { useEffect, useState } from "react";
@@ -136,7 +137,13 @@ const CarECUsTable = ({ vin, token, classes }) => {
{tableColumns.map((column, j) => { {tableColumns.map((column, j) => {
const key = `${row.ecu + i}${column.id}` const key = `${row.ecu + i}${column.id}`
if (column.id === "updated_at") return (<TableCell key={key} align="center">{LocalDateTimeString(row.updated)}</TableCell>); if (column.id === "updated_at") return (<TableCell key={key} align="center">{LocalDateTimeString(row.updated)}</TableCell>);
return (<TableCell key={key} align="center">{row[column.id]}</TableCell>); return (
<TableCell key={key} align="center" className={classes.limitWidthTableCell}>
<Tooltip title={`${row[column.id] || 'none'}`}>
<span>{row[column.id]}</span>
</Tooltip>
</TableCell>
);
})} })}
</TableRow> </TableRow>
))} ))}

7
src/components/useStyles.jsx
View File

@@ -288,7 +288,12 @@ const useStyles = makeStyles((theme) => ({
tableHeader: { tableHeader: {
textDecorationStyle: "solid", textDecorationStyle: "solid",
fontWeight:500, fontWeight:500,
} },
limitWidthTableCell: {
maxWidth: "200px",
whiteSpace: "normal",
wordWrap: "break-word",
},
})); }));
export default useStyles; export default useStyles;