mirror of
https://github.com/lemeow125/EquipmentTracker-Frontend.git
synced 2024-11-17 06:09:25 +08:00
Fixed table rendering being broken when there are too many records and added logs pages
This commit is contained in:
parent
1c595b3b03
commit
23a743ce2b
8 changed files with 435 additions and 4 deletions
22
src/App.tsx
22
src/App.tsx
|
|
@ -13,6 +13,8 @@ import ActivationPage from "./Pages/ActivationPage/ActivationPage";
|
||||||
import ResetPasswordPage from "./Pages/ResetPasswordPage/ResetPasswordPage";
|
import ResetPasswordPage from "./Pages/ResetPasswordPage/ResetPasswordPage";
|
||||||
import EquipmentInstancesListPage from "./Pages/EquipmentInstancesListPage/EquipmentInstancesListPage";
|
import EquipmentInstancesListPage from "./Pages/EquipmentInstancesListPage/EquipmentInstancesListPage";
|
||||||
import EquipmentListPage from "./Pages/EquipmentListPage/EquipmentListPage";
|
import EquipmentListPage from "./Pages/EquipmentListPage/EquipmentListPage";
|
||||||
|
import EquipmentLogsPage from "./Pages/EquipmentLogsPage/EquipmentLogsPage";
|
||||||
|
import EquipmentInstanceLogsPage from "./Pages/EquipmentInstanceLogsPage/EquipmentInstanceLogsPage";
|
||||||
|
|
||||||
const queryClient = new QueryClient();
|
const queryClient = new QueryClient();
|
||||||
const router = createHashRouter([
|
const router = createHashRouter([
|
||||||
|
|
@ -46,6 +48,16 @@ const router = createHashRouter([
|
||||||
),
|
),
|
||||||
errorElement: <ErrorPage />,
|
errorElement: <ErrorPage />,
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
path: "/view/equipment_instances/logs",
|
||||||
|
element: (
|
||||||
|
<>
|
||||||
|
<Revalidator />
|
||||||
|
<EquipmentInstanceLogsPage />
|
||||||
|
</>
|
||||||
|
),
|
||||||
|
errorElement: <ErrorPage />,
|
||||||
|
},
|
||||||
{
|
{
|
||||||
path: "/view/equipments",
|
path: "/view/equipments",
|
||||||
element: (
|
element: (
|
||||||
|
|
@ -56,6 +68,16 @@ const router = createHashRouter([
|
||||||
),
|
),
|
||||||
errorElement: <ErrorPage />,
|
errorElement: <ErrorPage />,
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
path: "/view/equipments/logs",
|
||||||
|
element: (
|
||||||
|
<>
|
||||||
|
<Revalidator />
|
||||||
|
<EquipmentLogsPage />
|
||||||
|
</>
|
||||||
|
),
|
||||||
|
errorElement: <ErrorPage />,
|
||||||
|
},
|
||||||
{
|
{
|
||||||
path: "/activation/:uid/:token",
|
path: "/activation/:uid/:token",
|
||||||
element: (
|
element: (
|
||||||
|
|
|
||||||
|
|
@ -13,6 +13,8 @@ import {
|
||||||
EquipmentInstanceType,
|
EquipmentInstanceType,
|
||||||
PatchEquipmentInstanceType,
|
PatchEquipmentInstanceType,
|
||||||
PatchEquipmentType,
|
PatchEquipmentType,
|
||||||
|
EquipmentLogListType,
|
||||||
|
EquipmentInstanceLogListType,
|
||||||
} from "../Types/Types";
|
} from "../Types/Types";
|
||||||
|
|
||||||
const debug = false;
|
const debug = false;
|
||||||
|
|
@ -246,8 +248,31 @@ export async function EquipmentCreateAPI(equipment: AddEquipmentType) {
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
export async function EquipmentLogsAPI() {
|
||||||
|
const config = await GetConfig();
|
||||||
|
return instance
|
||||||
|
.get("api/v1/equipments/equipments/logs", config)
|
||||||
|
.then((response) => {
|
||||||
|
return response.data as EquipmentLogListType;
|
||||||
|
})
|
||||||
|
.catch(() => {
|
||||||
|
console.log("Error retrieving equipment logs");
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
// Equipment Instances APIs
|
// Equipment Instances APIs
|
||||||
|
|
||||||
|
export async function EquipmentInstanceLogsAPI() {
|
||||||
|
const config = await GetConfig();
|
||||||
|
return instance
|
||||||
|
.get("api/v1/equipments/equipment_instances/logs", config)
|
||||||
|
.then((response) => {
|
||||||
|
return response.data as EquipmentInstanceLogListType;
|
||||||
|
})
|
||||||
|
.catch(() => {
|
||||||
|
console.log("Error retrieving equipment logs");
|
||||||
|
});
|
||||||
|
}
|
||||||
export async function EquipmentInstanceAPI(id: number) {
|
export async function EquipmentInstanceAPI(id: number) {
|
||||||
const config = await GetConfig();
|
const config = await GetConfig();
|
||||||
return instance
|
return instance
|
||||||
|
|
|
||||||
|
|
@ -46,6 +46,18 @@ export type EquipmentType = {
|
||||||
|
|
||||||
export type EquipmentListType = Array<EquipmentType>;
|
export type EquipmentListType = Array<EquipmentType>;
|
||||||
|
|
||||||
|
export type EquipmentLogType = {
|
||||||
|
history_id: number;
|
||||||
|
id: number;
|
||||||
|
name: string;
|
||||||
|
category: string;
|
||||||
|
description: string;
|
||||||
|
history_date: string;
|
||||||
|
history_user: string;
|
||||||
|
};
|
||||||
|
|
||||||
|
export type EquipmentLogListType = Array<EquipmentLogType>;
|
||||||
|
|
||||||
export type AddEquipmentInstanceType = {
|
export type AddEquipmentInstanceType = {
|
||||||
equipment: number;
|
equipment: number;
|
||||||
status: string;
|
status: string;
|
||||||
|
|
@ -70,3 +82,17 @@ export type EquipmentInstanceType = {
|
||||||
};
|
};
|
||||||
|
|
||||||
export type EquipmentInstanceListType = Array<EquipmentInstanceType>;
|
export type EquipmentInstanceListType = Array<EquipmentInstanceType>;
|
||||||
|
|
||||||
|
export type EquipmentInstanceLogType = {
|
||||||
|
history_id: number;
|
||||||
|
id: number;
|
||||||
|
equipment: number;
|
||||||
|
equipment_name: string;
|
||||||
|
category: string;
|
||||||
|
status: string;
|
||||||
|
remarks: string;
|
||||||
|
history_date: string;
|
||||||
|
history_user: string;
|
||||||
|
};
|
||||||
|
|
||||||
|
export type EquipmentInstanceLogListType = Array<EquipmentInstanceLogType>;
|
||||||
|
|
|
||||||
|
|
@ -11,6 +11,7 @@ import FormatListBulletedIcon from "@mui/icons-material/FormatListBulleted";
|
||||||
import AddToQueueIcon from "@mui/icons-material/AddToQueue";
|
import AddToQueueIcon from "@mui/icons-material/AddToQueue";
|
||||||
import NoteAddIcon from "@mui/icons-material/NoteAdd";
|
import NoteAddIcon from "@mui/icons-material/NoteAdd";
|
||||||
import NoteIcon from "@mui/icons-material/Note";
|
import NoteIcon from "@mui/icons-material/Note";
|
||||||
|
import ManageSearchIcon from "@mui/icons-material/ManageSearch";
|
||||||
import { colors } from "../../styles";
|
import { colors } from "../../styles";
|
||||||
import { useNavigate } from "react-router-dom";
|
import { useNavigate } from "react-router-dom";
|
||||||
import { useState } from "react";
|
import { useState } from "react";
|
||||||
|
|
@ -491,6 +492,87 @@ export default function Dashboard() {
|
||||||
</p>
|
</p>
|
||||||
</Button>
|
</Button>
|
||||||
</div>
|
</div>
|
||||||
|
<p
|
||||||
|
style={{
|
||||||
|
...styles.text_dark,
|
||||||
|
...styles.text_L,
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
Logs
|
||||||
|
</p>
|
||||||
|
<div
|
||||||
|
style={{
|
||||||
|
...styles.flex_row,
|
||||||
|
...{
|
||||||
|
alignSelf: "center",
|
||||||
|
justifyContent: "center",
|
||||||
|
flexWrap: "wrap",
|
||||||
|
},
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<Button
|
||||||
|
style={{
|
||||||
|
...styles.flex_column,
|
||||||
|
...{
|
||||||
|
alignSelf: "center",
|
||||||
|
justifyContent: "center",
|
||||||
|
flexWrap: "wrap",
|
||||||
|
},
|
||||||
|
}}
|
||||||
|
onClick={() => {
|
||||||
|
navigate("/view/equipments/logs");
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<ManageSearchIcon
|
||||||
|
style={{
|
||||||
|
height: 64,
|
||||||
|
width: 64,
|
||||||
|
fill: colors.font_dark,
|
||||||
|
marginLeft: "1rem",
|
||||||
|
marginRight: "1rem",
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
<p
|
||||||
|
style={{
|
||||||
|
...styles.text_dark,
|
||||||
|
...styles.text_M,
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
SKU Logs
|
||||||
|
</p>
|
||||||
|
</Button>
|
||||||
|
<Button
|
||||||
|
style={{
|
||||||
|
...styles.flex_column,
|
||||||
|
...{
|
||||||
|
alignSelf: "center",
|
||||||
|
justifyContent: "center",
|
||||||
|
flexWrap: "wrap",
|
||||||
|
},
|
||||||
|
}}
|
||||||
|
onClick={() => {
|
||||||
|
navigate("/view/equipment_instances/logs");
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<ManageSearchIcon
|
||||||
|
style={{
|
||||||
|
height: 64,
|
||||||
|
width: 64,
|
||||||
|
fill: colors.font_dark,
|
||||||
|
marginLeft: "1rem",
|
||||||
|
marginRight: "1rem",
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
<p
|
||||||
|
style={{
|
||||||
|
...styles.text_dark,
|
||||||
|
...styles.text_M,
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
Item Logs
|
||||||
|
</p>
|
||||||
|
</Button>
|
||||||
|
</div>
|
||||||
<Popup
|
<Popup
|
||||||
open={addSKUmodalOpen}
|
open={addSKUmodalOpen}
|
||||||
onClose={() => SetAddSKUModalOpen(false)}
|
onClose={() => SetAddSKUModalOpen(false)}
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,140 @@
|
||||||
|
import { useQuery } from "@tanstack/react-query";
|
||||||
|
import Header from "../../Components/Header/Header";
|
||||||
|
import styles from "../../styles";
|
||||||
|
import { EquipmentInstanceLogsAPI } from "../../Components/API/API";
|
||||||
|
import { CircularProgress } from "@mui/material";
|
||||||
|
import Table from "@mui/material/Table";
|
||||||
|
import TableBody from "@mui/material/TableBody";
|
||||||
|
import TableCell from "@mui/material/TableCell";
|
||||||
|
import TableContainer from "@mui/material/TableContainer";
|
||||||
|
import TableHead from "@mui/material/TableHead";
|
||||||
|
import TableRow from "@mui/material/TableRow";
|
||||||
|
import Paper from "@mui/material/Paper";
|
||||||
|
import { colors } from "../../styles";
|
||||||
|
|
||||||
|
export default function EquipmentInstanceLogsPage() {
|
||||||
|
const equipment_instance_logs = useQuery({
|
||||||
|
queryKey: ["equipment_instance_logs"],
|
||||||
|
queryFn: EquipmentInstanceLogsAPI,
|
||||||
|
});
|
||||||
|
if (equipment_instance_logs.isLoading) {
|
||||||
|
return (
|
||||||
|
<div style={styles.background}>
|
||||||
|
<Header label={"Dashboard"} />
|
||||||
|
<div
|
||||||
|
style={{
|
||||||
|
...styles.flex_column,
|
||||||
|
...{
|
||||||
|
alignItems: "center",
|
||||||
|
justifyContent: "center",
|
||||||
|
paddingTop: "64px",
|
||||||
|
},
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<CircularProgress style={{ height: "128px", width: "128px" }} />
|
||||||
|
<p
|
||||||
|
style={{
|
||||||
|
...styles.text_dark,
|
||||||
|
...styles.text_L,
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
Loading
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
return (
|
||||||
|
<div style={styles.background}>
|
||||||
|
<Header label={"Item History"} />
|
||||||
|
<div
|
||||||
|
style={{
|
||||||
|
...styles.flex_column,
|
||||||
|
display: "flex",
|
||||||
|
alignItems: "center",
|
||||||
|
justifyContent: "center",
|
||||||
|
height: "100%",
|
||||||
|
width: "100%",
|
||||||
|
minHeight: "100%",
|
||||||
|
minWidth: "100%",
|
||||||
|
flexWrap: "wrap",
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<div style={{ width: "90%", overflowY: "scroll", marginTop: "2rem" }}>
|
||||||
|
<TableContainer component={Paper}>
|
||||||
|
<Table sx={{ minWidth: "32rem" }} size="medium">
|
||||||
|
<TableHead>
|
||||||
|
<TableRow style={{ backgroundColor: colors.header_color }}>
|
||||||
|
<TableCell align="center" style={styles.text_light}>
|
||||||
|
Transaction ID
|
||||||
|
</TableCell>
|
||||||
|
<TableCell align="center" style={styles.text_light}>
|
||||||
|
Item ID
|
||||||
|
</TableCell>
|
||||||
|
<TableCell align="center" style={styles.text_light}>
|
||||||
|
SKU
|
||||||
|
</TableCell>
|
||||||
|
<TableCell align="center" style={styles.text_light}>
|
||||||
|
Remarks
|
||||||
|
</TableCell>
|
||||||
|
<TableCell align="center" style={styles.text_light}>
|
||||||
|
Status
|
||||||
|
</TableCell>
|
||||||
|
<TableCell align="center" style={styles.text_light}>
|
||||||
|
Date Modified
|
||||||
|
</TableCell>
|
||||||
|
</TableRow>
|
||||||
|
</TableHead>
|
||||||
|
<TableBody>
|
||||||
|
{equipment_instance_logs.data ? (
|
||||||
|
equipment_instance_logs.data.map((equipment_instance_log) => (
|
||||||
|
<TableRow
|
||||||
|
key={equipment_instance_log.history_id}
|
||||||
|
sx={{
|
||||||
|
"&:last-child td, &:last-child th": { border: 0 },
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<TableCell align="center" component="th" scope="row">
|
||||||
|
{equipment_instance_log.history_id}
|
||||||
|
</TableCell>
|
||||||
|
<TableCell align="center" component="th" scope="row">
|
||||||
|
{equipment_instance_log.id}
|
||||||
|
</TableCell>
|
||||||
|
<TableCell align="center" component="th" scope="row">
|
||||||
|
{`SKU #${equipment_instance_log.equipment} - ${equipment_instance_log.equipment_name}`}
|
||||||
|
</TableCell>
|
||||||
|
|
||||||
|
<TableCell align="center" component="th" scope="row">
|
||||||
|
{equipment_instance_log.remarks}
|
||||||
|
</TableCell>
|
||||||
|
<TableCell align="center" component="th" scope="row">
|
||||||
|
{equipment_instance_log.status}
|
||||||
|
</TableCell>
|
||||||
|
<TableCell align="right">
|
||||||
|
<div
|
||||||
|
style={{
|
||||||
|
...styles.flex_column,
|
||||||
|
...{ alignItems: "center" },
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<div>{equipment_instance_log.history_date}</div>
|
||||||
|
<div>
|
||||||
|
{equipment_instance_log.history_user
|
||||||
|
? "by " + equipment_instance_log.history_user
|
||||||
|
: ""}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</TableCell>
|
||||||
|
</TableRow>
|
||||||
|
))
|
||||||
|
) : (
|
||||||
|
<></>
|
||||||
|
)}
|
||||||
|
</TableBody>
|
||||||
|
</Table>
|
||||||
|
</TableContainer>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
@ -63,10 +63,9 @@ export default function EquipmentInstancesListPage() {
|
||||||
minHeight: "100%",
|
minHeight: "100%",
|
||||||
minWidth: "100%",
|
minWidth: "100%",
|
||||||
flexWrap: "wrap",
|
flexWrap: "wrap",
|
||||||
overflowY: "scroll",
|
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
<div style={{ width: "90%" }}>
|
<div style={{ width: "90%", overflowY: "scroll", marginTop: "2rem" }}>
|
||||||
<TableContainer component={Paper}>
|
<TableContainer component={Paper}>
|
||||||
<Table sx={{ minWidth: "32rem" }} size="medium">
|
<Table sx={{ minWidth: "32rem" }} size="medium">
|
||||||
<TableHead>
|
<TableHead>
|
||||||
|
|
|
||||||
|
|
@ -63,10 +63,9 @@ export default function EquipmentListPage() {
|
||||||
minHeight: "100%",
|
minHeight: "100%",
|
||||||
minWidth: "100%",
|
minWidth: "100%",
|
||||||
flexWrap: "wrap",
|
flexWrap: "wrap",
|
||||||
overflowY: "scroll",
|
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
<div style={{ width: "90%" }}>
|
<div style={{ width: "90%", overflowY: "scroll", marginTop: "2rem" }}>
|
||||||
<TableContainer component={Paper}>
|
<TableContainer component={Paper}>
|
||||||
<Table sx={{ minWidth: "32rem" }} size="medium">
|
<Table sx={{ minWidth: "32rem" }} size="medium">
|
||||||
<TableHead>
|
<TableHead>
|
||||||
|
|
|
||||||
138
src/Pages/EquipmentLogsPage/EquipmentLogsPage.tsx
Normal file
138
src/Pages/EquipmentLogsPage/EquipmentLogsPage.tsx
Normal file
|
|
@ -0,0 +1,138 @@
|
||||||
|
import { useQuery } from "@tanstack/react-query";
|
||||||
|
import Header from "../../Components/Header/Header";
|
||||||
|
import styles from "../../styles";
|
||||||
|
import { EquipmentLogsAPI } from "../../Components/API/API";
|
||||||
|
import { CircularProgress } from "@mui/material";
|
||||||
|
import Table from "@mui/material/Table";
|
||||||
|
import TableBody from "@mui/material/TableBody";
|
||||||
|
import TableCell from "@mui/material/TableCell";
|
||||||
|
import TableContainer from "@mui/material/TableContainer";
|
||||||
|
import TableHead from "@mui/material/TableHead";
|
||||||
|
import TableRow from "@mui/material/TableRow";
|
||||||
|
import Paper from "@mui/material/Paper";
|
||||||
|
import { colors } from "../../styles";
|
||||||
|
|
||||||
|
export default function EquipmentLogsPage() {
|
||||||
|
const equipment_logs = useQuery({
|
||||||
|
queryKey: ["equipment_logs"],
|
||||||
|
queryFn: EquipmentLogsAPI,
|
||||||
|
});
|
||||||
|
if (equipment_logs.isLoading) {
|
||||||
|
return (
|
||||||
|
<div style={styles.background}>
|
||||||
|
<Header label={"Dashboard"} />
|
||||||
|
<div
|
||||||
|
style={{
|
||||||
|
...styles.flex_column,
|
||||||
|
...{
|
||||||
|
alignItems: "center",
|
||||||
|
justifyContent: "center",
|
||||||
|
paddingTop: "64px",
|
||||||
|
},
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<CircularProgress style={{ height: "128px", width: "128px" }} />
|
||||||
|
<p
|
||||||
|
style={{
|
||||||
|
...styles.text_dark,
|
||||||
|
...styles.text_L,
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
Loading
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
return (
|
||||||
|
<div style={styles.background}>
|
||||||
|
<Header label={"SKU History"} />
|
||||||
|
<div
|
||||||
|
style={{
|
||||||
|
...styles.flex_column,
|
||||||
|
display: "flex",
|
||||||
|
alignItems: "center",
|
||||||
|
justifyContent: "center",
|
||||||
|
height: "100%",
|
||||||
|
width: "100%",
|
||||||
|
minHeight: "100%",
|
||||||
|
minWidth: "100%",
|
||||||
|
flexWrap: "wrap",
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<div style={{ width: "90%", overflowY: "scroll", marginTop: "2rem" }}>
|
||||||
|
<TableContainer component={Paper}>
|
||||||
|
<Table sx={{ minWidth: "32rem" }} size="medium">
|
||||||
|
<TableHead>
|
||||||
|
<TableRow style={{ backgroundColor: colors.header_color }}>
|
||||||
|
<TableCell align="center" style={styles.text_light}>
|
||||||
|
Transaction ID
|
||||||
|
</TableCell>
|
||||||
|
<TableCell align="center" style={styles.text_light}>
|
||||||
|
SKU ID
|
||||||
|
</TableCell>
|
||||||
|
<TableCell align="center" style={styles.text_light}>
|
||||||
|
Name
|
||||||
|
</TableCell>
|
||||||
|
<TableCell align="center" style={styles.text_light}>
|
||||||
|
Description
|
||||||
|
</TableCell>
|
||||||
|
<TableCell align="center" style={styles.text_light}>
|
||||||
|
Category
|
||||||
|
</TableCell>
|
||||||
|
<TableCell align="center" style={styles.text_light}>
|
||||||
|
Date Modified
|
||||||
|
</TableCell>
|
||||||
|
</TableRow>
|
||||||
|
</TableHead>
|
||||||
|
<TableBody>
|
||||||
|
{equipment_logs.data ? (
|
||||||
|
equipment_logs.data.map((equipment_log) => (
|
||||||
|
<TableRow
|
||||||
|
key={equipment_log.history_id}
|
||||||
|
sx={{ "&:last-child td, &:last-child th": { border: 0 } }}
|
||||||
|
>
|
||||||
|
<TableCell align="center" component="th" scope="row">
|
||||||
|
{equipment_log.history_id}
|
||||||
|
</TableCell>
|
||||||
|
<TableCell align="center" component="th" scope="row">
|
||||||
|
{equipment_log.id}
|
||||||
|
</TableCell>
|
||||||
|
<TableCell align="center" component="th" scope="row">
|
||||||
|
{equipment_log.name}
|
||||||
|
</TableCell>
|
||||||
|
|
||||||
|
<TableCell align="center" component="th" scope="row">
|
||||||
|
{equipment_log.description}
|
||||||
|
</TableCell>
|
||||||
|
<TableCell align="center" component="th" scope="row">
|
||||||
|
{equipment_log.category}
|
||||||
|
</TableCell>
|
||||||
|
<TableCell align="right">
|
||||||
|
<div
|
||||||
|
style={{
|
||||||
|
...styles.flex_column,
|
||||||
|
...{ alignItems: "center" },
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<div>{equipment_log.history_date}</div>
|
||||||
|
<div>
|
||||||
|
{equipment_log.history_user
|
||||||
|
? "by " + equipment_log.history_user
|
||||||
|
: ""}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</TableCell>
|
||||||
|
</TableRow>
|
||||||
|
))
|
||||||
|
) : (
|
||||||
|
<></>
|
||||||
|
)}
|
||||||
|
</TableBody>
|
||||||
|
</Table>
|
||||||
|
</TableContainer>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
Loading…
Reference in a new issue