CEC-2587 Add edge_mask field (#217)

This commit is contained in:
arpanetus
2022-10-14 19:35:58 +06:00
committed by GitHub
parent 3d06baa272
commit 131c97fa7b
8 changed files with 158 additions and 0 deletions

View File

@@ -172,6 +172,29 @@ exports[`CANFiltersTable Render 1`] = `
</svg>
</span>
</th>
<th
class="MuiTableCell-root MuiTableCell-head MuiTableCell-alignCenter"
scope="col"
>
<span
aria-disabled="false"
class="MuiButtonBase-root MuiTableSortLabel-root"
role="button"
tabindex="0"
>
Edge mask
<svg
aria-hidden="true"
class="MuiSvgIcon-root MuiTableSortLabel-icon MuiTableSortLabel-iconDirectionAsc"
focusable="false"
viewBox="0 0 24 24"
>
<path
d="M20 12l-1.41-1.41L13 16.17V4h-2v12.17l-5.58-5.59L4 12l8 8 8-8z"
/>
</svg>
</span>
</th>
<th
class="MuiTableCell-root MuiTableCell-head MuiTableCell-alignCenter"
scope="col"
@@ -203,6 +226,9 @@ exports[`CANFiltersTable Render 1`] = `
href="/fleet/undefined"
/>
</td>
<td
class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignCenter"
/>
<td
class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignCenter"
>
@@ -263,6 +289,9 @@ exports[`CANFiltersTable Render 1`] = `
href="/fleet/undefined"
/>
</td>
<td
class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignCenter"
/>
<td
class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignCenter"
>
@@ -323,6 +352,9 @@ exports[`CANFiltersTable Render 1`] = `
href="/fleet/undefined"
/>
</td>
<td
class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignCenter"
/>
<td
class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignCenter"
>

View File

@@ -29,6 +29,7 @@ import SearchField from "../../Controls/SearchField";
import { logger } from "../../../services/monitoring";
import { Roles, hasRole } from "../../../utils/roles";
import {useLocalStorage} from "../../useLocalStorage";
import {trimIfMoreThan} from "../../../utils/strings";
const tableColumns = [
{
@@ -43,6 +44,10 @@ const tableColumns = [
id: "fleet",
label: "Fleet"
},
{
id: "edge_mask",
label: "Edge mask"
},
{
id: "",
label: "Actions"
@@ -121,6 +126,10 @@ const MainForm = ({ vin }) => {
};
const Actions = (row) => {
if(row.fleet != null) {
return
}
let actions = [];
if (hasRole([Roles.CREATE], groups)) {
actions.push({
@@ -187,6 +196,7 @@ const MainForm = ({ vin }) => {
<TableCell align="center">
<Link to={`/fleet/${row.fleet}`}>{row.fleet}</Link>
</TableCell>
<TableCell align="center">{trimIfMoreThan(row.edge_mask, 15, "...")}</TableCell>
<TableCell align="center">{Actions(row)}</TableCell>
</TableRow>
))}

View File

@@ -24,6 +24,7 @@ const MainForm = () => {
const vin = queries.get("vin") ?? ""
const canID = queries.get("can_id") ?? ""
const interval = queries.get("interval") ?? ""
// const edge_mask = queries.get("edge_mask") ?? ""
useEffect(() => {
setTitle("Update CAN Filter");

View File

@@ -171,6 +171,29 @@ exports[`CANFiltersTab Render 1`] = `
</svg>
</span>
</th>
<th
class="MuiTableCell-root MuiTableCell-head MuiTableCell-alignCenter"
scope="col"
>
<span
aria-disabled="false"
class="MuiButtonBase-root MuiTableSortLabel-root"
role="button"
tabindex="0"
>
Edge mask
<svg
aria-hidden="true"
class="MuiSvgIcon-root MuiTableSortLabel-icon MuiTableSortLabel-iconDirectionAsc"
focusable="false"
viewBox="0 0 24 24"
>
<path
d="M20 12l-1.41-1.41L13 16.17V4h-2v12.17l-5.58-5.59L4 12l8 8 8-8z"
/>
</svg>
</span>
</th>
<th
class="MuiTableCell-root MuiTableCell-head MuiTableCell-alignCenter"
scope="col"
@@ -202,6 +225,9 @@ exports[`CANFiltersTab Render 1`] = `
href="/fleet/undefined"
/>
</td>
<td
class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignCenter"
/>
<td
class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignCenter"
>
@@ -262,6 +288,9 @@ exports[`CANFiltersTab Render 1`] = `
href="/fleet/undefined"
/>
</td>
<td
class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignCenter"
/>
<td
class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignCenter"
>
@@ -322,6 +351,9 @@ exports[`CANFiltersTab Render 1`] = `
href="/fleet/undefined"
/>
</td>
<td
class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignCenter"
/>
<td
class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignCenter"
>

View File

@@ -150,6 +150,29 @@ exports[`FleetCANFiltersTable Render 1`] = `
</svg>
</span>
</th>
<th
class="MuiTableCell-root MuiTableCell-head MuiTableCell-alignCenter"
scope="col"
>
<span
aria-disabled="false"
class="MuiButtonBase-root MuiTableSortLabel-root"
role="button"
tabindex="0"
>
Edge mask
<svg
aria-hidden="true"
class="MuiSvgIcon-root MuiTableSortLabel-icon MuiTableSortLabel-iconDirectionAsc"
focusable="false"
viewBox="0 0 24 24"
>
<path
d="M20 12l-1.41-1.41L13 16.17V4h-2v12.17l-5.58-5.59L4 12l8 8 8-8z"
/>
</svg>
</span>
</th>
<th
class="MuiTableCell-root MuiTableCell-head MuiTableCell-alignCenter"
scope="col"
@@ -174,6 +197,9 @@ exports[`FleetCANFiltersTable Render 1`] = `
>
789
</td>
<td
class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignCenter"
/>
<td
class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignCenter"
>
@@ -227,6 +253,9 @@ exports[`FleetCANFiltersTable Render 1`] = `
>
1000
</td>
<td
class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignCenter"
/>
<td
class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignCenter"
>
@@ -280,6 +309,9 @@ exports[`FleetCANFiltersTable Render 1`] = `
>
1
</td>
<td
class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignCenter"
/>
<td
class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignCenter"
>

View File

@@ -24,6 +24,7 @@ import SearchField from "../../../../Controls/SearchField";
import { logger } from "../../../../../services/monitoring";
import { Roles, hasRole } from "../../../../../utils/roles";
import {useLocalStorage} from "../../../../useLocalStorage";
import {trimIfMoreThan} from "../../../../../utils/strings"
const tableColumns = [
{
@@ -34,6 +35,10 @@ const tableColumns = [
id: "interval",
label: "Interval (ms)"
},
{
id: "edge_mask",
label: "Edge mask"
},
{
id: "",
label: "Actions"
@@ -173,6 +178,7 @@ const MainForm = ({ name }) => {
<TableRow key={row.can_id}>
<TableCell align="center">{row.can_id}</TableCell>
<TableCell align="center">{row.interval}</TableCell>
<TableCell align="center">{trimIfMoreThan(row.edge_mask, 15, "...")}</TableCell>
<TableCell align="center">{Actions(row)}</TableCell>
</TableRow>
))}

View File

@@ -149,6 +149,29 @@ exports[`CANFiltersTab Render 1`] = `
</svg>
</span>
</th>
<th
class="MuiTableCell-root MuiTableCell-head MuiTableCell-alignCenter"
scope="col"
>
<span
aria-disabled="false"
class="MuiButtonBase-root MuiTableSortLabel-root"
role="button"
tabindex="0"
>
Edge mask
<svg
aria-hidden="true"
class="MuiSvgIcon-root MuiTableSortLabel-icon MuiTableSortLabel-iconDirectionAsc"
focusable="false"
viewBox="0 0 24 24"
>
<path
d="M20 12l-1.41-1.41L13 16.17V4h-2v12.17l-5.58-5.59L4 12l8 8 8-8z"
/>
</svg>
</span>
</th>
<th
class="MuiTableCell-root MuiTableCell-head MuiTableCell-alignCenter"
scope="col"
@@ -173,6 +196,9 @@ exports[`CANFiltersTab Render 1`] = `
>
789
</td>
<td
class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignCenter"
/>
<td
class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignCenter"
>
@@ -226,6 +252,9 @@ exports[`CANFiltersTab Render 1`] = `
>
1000
</td>
<td
class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignCenter"
/>
<td
class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignCenter"
>
@@ -279,6 +308,9 @@ exports[`CANFiltersTab Render 1`] = `
>
1
</td>
<td
class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignCenter"
/>
<td
class="MuiTableCell-root MuiTableCell-body MuiTableCell-alignCenter"
>

13
src/utils/strings.js Normal file
View File

@@ -0,0 +1,13 @@
export function trimIfMoreThan(maybeString, maxLength = 20, sfx = "") {
if (typeof maybeString == "string" && maybeString !== "") {
let toAppSfx = sfx
let toTrimLnth = maxLength - toAppSfx.length
if (maybeString.length <= maxLength) {
toAppSfx = ""
toTrimLnth = maxLength
}
return maybeString.substring(0, toTrimLnth) + toAppSfx
}
return ""
}