bin card, no svg yet
This commit is contained in:
Carter
parent
a0eabf50c6
commit
7edba7e25b
4 changed files with 848 additions and 153 deletions
|
|
@ -1,27 +1,29 @@
|
|||
import { Box, Button, Grid } from "@material-ui/core";
|
||||
import { getTableIcons } from "common/ResponsiveTable";
|
||||
import { Box, Button, Grid2 as Grid } from "@mui/material";
|
||||
// import { getTableIcons } from "common/ResponsiveTable";
|
||||
import SearchBar from "common/SearchBar";
|
||||
import SearchSelect, { Option } from "common/SearchSelect";
|
||||
import MaterialTable, { MTableToolbar } from "material-table";
|
||||
import { Bin, BinYard, Field } from "models";
|
||||
import { Gate } from "models/Gate";
|
||||
import { GrainBag } from "models/GrainBag";
|
||||
import { ObjectHeater } from "models/ObjectHeater";
|
||||
// import MaterialTable, { MTableToolbar } from "material-table";
|
||||
// import { Bin, BinYard, Field } from "models";
|
||||
import { Bin } from "models";
|
||||
// import { Gate } from "models/Gate";
|
||||
// import { GrainBag } from "models/GrainBag";
|
||||
// import { ObjectHeater } from "models/ObjectHeater";
|
||||
import ObjectDescriber, { SearchableObjects } from "objects/ObjectDescriber";
|
||||
import { pond } from "protobuf-ts/pond";
|
||||
import {
|
||||
useBinAPI,
|
||||
useBinYardAPI,
|
||||
useFieldAPI,
|
||||
// useFieldAPI,
|
||||
useGateAPI,
|
||||
useGlobalState,
|
||||
useGrainBagAPI,
|
||||
useObjectHeaterAPI
|
||||
// useGrainBagAPI,
|
||||
// useObjectHeaterAPI
|
||||
} from "providers";
|
||||
import React, { useCallback, useEffect, useState } from "react";
|
||||
import { useCallback, useEffect, useState } from "react";
|
||||
import TeamSearch from "teams/TeamSearch";
|
||||
import BulkBinSettings from "./bulkEditForms/bulkBinSettings";
|
||||
import BulkGrainBagSettings from "./bulkEditForms/bulkGrainBagSettings";
|
||||
import ResponsiveTable from "common/ResponsiveTable";
|
||||
//import BulkGateSettings from "./bulkEditForms/bulkGateSettings";
|
||||
|
||||
interface customButton {
|
||||
|
|
@ -58,12 +60,13 @@ export default function ObjectTable(props: Props) {
|
|||
//the api's to load all the objects available to look at in this table
|
||||
const binAPI = useBinAPI();
|
||||
const binyardAPI = useBinYardAPI();
|
||||
const fieldAPI = useFieldAPI();
|
||||
// const fieldAPI = useFieldAPI();
|
||||
const gateAPI = useGateAPI();
|
||||
const grainBagAPI = useGrainBagAPI();
|
||||
const heaterAPI = useObjectHeaterAPI();
|
||||
// const grainBagAPI = useGrainBagAPI();
|
||||
// const heaterAPI = useObjectHeaterAPI();
|
||||
|
||||
const load = useCallback(() => {
|
||||
console.log("Hello!")
|
||||
if (tableLoading) return;
|
||||
/**
|
||||
* switch case to use the correct api to load the object that was selected.
|
||||
|
|
@ -78,6 +81,7 @@ export default function ObjectTable(props: Props) {
|
|||
if (currentType !== pond.ObjectType.OBJECT_TYPE_UNKNOWN) {
|
||||
setTableLoading(true);
|
||||
}
|
||||
console.log("Hello!")
|
||||
switch (currentType) {
|
||||
case pond.ObjectType.OBJECT_TYPE_BIN:
|
||||
binAPI
|
||||
|
|
@ -97,98 +101,98 @@ export default function ObjectTable(props: Props) {
|
|||
setTableLoading(false);
|
||||
});
|
||||
break;
|
||||
case pond.ObjectType.OBJECT_TYPE_BINYARD:
|
||||
binyardAPI
|
||||
.listBinYards(
|
||||
pageSize,
|
||||
pageSize * tablePage,
|
||||
currentDirection,
|
||||
currentOrder,
|
||||
search,
|
||||
undefined,
|
||||
selectedUser
|
||||
)
|
||||
.then(resp => {
|
||||
setTableData(resp.data.yard.map(b => BinYard.create(b)));
|
||||
setObjectTotal(resp.data.total);
|
||||
setTableLoading(false);
|
||||
});
|
||||
break;
|
||||
case pond.ObjectType.OBJECT_TYPE_FIELD:
|
||||
fieldAPI
|
||||
.listFields(
|
||||
pageSize,
|
||||
pageSize * tablePage,
|
||||
currentDirection,
|
||||
currentOrder,
|
||||
search,
|
||||
selectedUser
|
||||
)
|
||||
.then(resp => {
|
||||
setTableData(resp.data.fields.map(f => Field.create(f)));
|
||||
setObjectTotal(resp.data.total);
|
||||
setTableLoading(false);
|
||||
});
|
||||
break;
|
||||
case pond.ObjectType.OBJECT_TYPE_GATE:
|
||||
gateAPI
|
||||
.listGates(
|
||||
pageSize,
|
||||
pageSize * tablePage,
|
||||
currentDirection,
|
||||
currentOrder,
|
||||
search,
|
||||
undefined,
|
||||
undefined,
|
||||
undefined,
|
||||
isNumerical,
|
||||
selectedUser
|
||||
)
|
||||
.then(resp => {
|
||||
setTableData(resp.data.gates.map(g => Gate.create(g)));
|
||||
setObjectTotal(resp.data.total);
|
||||
setTableLoading(false);
|
||||
});
|
||||
break;
|
||||
case pond.ObjectType.OBJECT_TYPE_GRAIN_BAG:
|
||||
grainBagAPI
|
||||
.listGrainBags(
|
||||
pageSize,
|
||||
pageSize * tablePage,
|
||||
currentDirection,
|
||||
currentOrder,
|
||||
search,
|
||||
undefined,
|
||||
undefined,
|
||||
isNumerical,
|
||||
selectedUser
|
||||
)
|
||||
.then(resp => {
|
||||
setTableData(resp.data.grainBags.map(gb => GrainBag.create(gb)));
|
||||
setObjectTotal(resp.data.total);
|
||||
setTableLoading(false);
|
||||
});
|
||||
break;
|
||||
case pond.ObjectType.OBJECT_TYPE_HEATER:
|
||||
heaterAPI
|
||||
.listObjectHeaters(
|
||||
pageSize,
|
||||
pageSize * tablePage,
|
||||
currentDirection,
|
||||
currentOrder,
|
||||
search,
|
||||
undefined,
|
||||
selectedUser,
|
||||
undefined,
|
||||
undefined,
|
||||
isNumerical
|
||||
)
|
||||
.then(resp => {
|
||||
setTableData(resp.data.heaters.map(h => ObjectHeater.create(h)));
|
||||
setObjectTotal(resp.data.total);
|
||||
setTableLoading(false);
|
||||
});
|
||||
break;
|
||||
// case pond.ObjectType.OBJECT_TYPE_BINYARD:
|
||||
// binyardAPI
|
||||
// .listBinYards(
|
||||
// pageSize,
|
||||
// pageSize * tablePage,
|
||||
// currentDirection,
|
||||
// currentOrder,
|
||||
// search,
|
||||
// undefined,
|
||||
// selectedUser
|
||||
// )
|
||||
// .then(resp => {
|
||||
// setTableData(resp.data.yard.map(b => BinYard.create(b)));
|
||||
// setObjectTotal(resp.data.total);
|
||||
// setTableLoading(false);
|
||||
// });
|
||||
// break;
|
||||
// case pond.ObjectType.OBJECT_TYPE_FIELD:
|
||||
// fieldAPI
|
||||
// .listFields(
|
||||
// pageSize,
|
||||
// pageSize * tablePage,
|
||||
// currentDirection,
|
||||
// currentOrder,
|
||||
// search,
|
||||
// selectedUser
|
||||
// )
|
||||
// .then(resp => {
|
||||
// setTableData(resp.data.fields.map(f => Field.create(f)));
|
||||
// setObjectTotal(resp.data.total);
|
||||
// setTableLoading(false);
|
||||
// });
|
||||
// break;
|
||||
// case pond.ObjectType.OBJECT_TYPE_GATE:
|
||||
// gateAPI
|
||||
// .listGates(
|
||||
// pageSize,
|
||||
// pageSize * tablePage,
|
||||
// currentDirection,
|
||||
// currentOrder,
|
||||
// search,
|
||||
// undefined,
|
||||
// undefined,
|
||||
// undefined,
|
||||
// isNumerical,
|
||||
// selectedUser
|
||||
// )
|
||||
// .then(resp => {
|
||||
// setTableData(resp.data.gates.map(g => Gate.create(g)));
|
||||
// setObjectTotal(resp.data.total);
|
||||
// setTableLoading(false);
|
||||
// });
|
||||
// break;
|
||||
// case pond.ObjectType.OBJECT_TYPE_GRAIN_BAG:
|
||||
// grainBagAPI
|
||||
// .listGrainBags(
|
||||
// pageSize,
|
||||
// pageSize * tablePage,
|
||||
// currentDirection,
|
||||
// currentOrder,
|
||||
// search,
|
||||
// undefined,
|
||||
// undefined,
|
||||
// isNumerical,
|
||||
// selectedUser
|
||||
// )
|
||||
// .then(resp => {
|
||||
// setTableData(resp.data.grainBags.map(gb => GrainBag.create(gb)));
|
||||
// setObjectTotal(resp.data.total);
|
||||
// setTableLoading(false);
|
||||
// });
|
||||
// break;
|
||||
// case pond.ObjectType.OBJECT_TYPE_HEATER:
|
||||
// heaterAPI
|
||||
// .listObjectHeaters(
|
||||
// pageSize,
|
||||
// pageSize * tablePage,
|
||||
// currentDirection,
|
||||
// currentOrder,
|
||||
// search,
|
||||
// undefined,
|
||||
// selectedUser,
|
||||
// undefined,
|
||||
// undefined,
|
||||
// isNumerical
|
||||
// )
|
||||
// .then(resp => {
|
||||
// setTableData(resp.data.heaters.map(h => ObjectHeater.create(h)));
|
||||
// setObjectTotal(resp.data.total);
|
||||
// setTableLoading(false);
|
||||
// });
|
||||
// break;
|
||||
}
|
||||
// eslint-disable-next-line react-hooks/exhaustive-deps
|
||||
}, [
|
||||
|
|
@ -202,10 +206,10 @@ export default function ObjectTable(props: Props) {
|
|||
currentSearchText,
|
||||
binAPI,
|
||||
binyardAPI,
|
||||
fieldAPI,
|
||||
// fieldAPI,
|
||||
gateAPI,
|
||||
grainBagAPI,
|
||||
heaterAPI
|
||||
// grainBagAPI,
|
||||
// heaterAPI
|
||||
]);
|
||||
|
||||
useEffect(() => {
|
||||
|
|
@ -232,14 +236,15 @@ export default function ObjectTable(props: Props) {
|
|||
);
|
||||
case pond.ObjectType.OBJECT_TYPE_GRAIN_BAG:
|
||||
return (
|
||||
<BulkGrainBagSettings
|
||||
selectedBags={selectedObjects as GrainBag[]}
|
||||
refreshCallback={reLoad => {
|
||||
if (reLoad) {
|
||||
load();
|
||||
}
|
||||
}}
|
||||
/>
|
||||
// <BulkGrainBagSettings
|
||||
// selectedBags={selectedObjects as GrainBag[]}
|
||||
// refreshCallback={reLoad => {
|
||||
// if (reLoad) {
|
||||
// load();
|
||||
// }
|
||||
// }}
|
||||
// />
|
||||
null
|
||||
);
|
||||
default:
|
||||
}
|
||||
|
|
@ -259,7 +264,7 @@ export default function ObjectTable(props: Props) {
|
|||
{customButtons &&
|
||||
selectedObjects.length > 0 &&
|
||||
customButtons.map((button, i) => (
|
||||
<Grid item xs={3} key={i}>
|
||||
<Grid size={{ xs: 3 }} key={i}>
|
||||
<Button
|
||||
style={{ width: "100%" }}
|
||||
variant="contained"
|
||||
|
|
@ -274,11 +279,17 @@ export default function ObjectTable(props: Props) {
|
|||
);
|
||||
};
|
||||
|
||||
const handleRowsPerPageChange = (event: any) => {
|
||||
const newRowsPerPage = parseInt(event.target.value, 10); // Get selected value
|
||||
setPageSize(newRowsPerPage);
|
||||
setTablePage(0)
|
||||
}
|
||||
|
||||
return (
|
||||
<Box padding={2}>
|
||||
{showControls && (
|
||||
<Grid container direction="row" spacing={2} style={{ padding: 10 }}>
|
||||
<Grid item>
|
||||
<Grid>
|
||||
<SearchSelect
|
||||
style={{ width: 200 }}
|
||||
label="From"
|
||||
|
|
@ -295,7 +306,7 @@ export default function ObjectTable(props: Props) {
|
|||
}}
|
||||
/>
|
||||
</Grid>
|
||||
<Grid item style={{ width: 300 }}>
|
||||
<Grid style={{ width: 300 }}>
|
||||
<TeamSearch
|
||||
label="User/Team"
|
||||
loadUsers
|
||||
|
|
@ -307,8 +318,16 @@ export default function ObjectTable(props: Props) {
|
|||
</Grid>
|
||||
</Grid>
|
||||
)}
|
||||
|
||||
<MaterialTable
|
||||
|
||||
<ResponsiveTable
|
||||
rows={tableData}
|
||||
total={objectTotal}
|
||||
pageSize={pageSize}
|
||||
page={tablePage}
|
||||
setPage={setTablePage}
|
||||
handleRowsPerPageChange={handleRowsPerPageChange}
|
||||
/>
|
||||
{/* <MaterialTable
|
||||
isLoading={tableLoading}
|
||||
key="objectList"
|
||||
title={ObjectDescriber(currentType).name}
|
||||
|
|
@ -354,13 +373,13 @@ export default function ObjectTable(props: Props) {
|
|||
onSelectionChange={(data, rowData) => {
|
||||
setSelectedObjects(data);
|
||||
}}
|
||||
// actions={[
|
||||
// {
|
||||
// tooltip: "Update Selected Objects",
|
||||
// icon: "edit",
|
||||
// onClick: (evt, data) => {console.log(data)}
|
||||
// }
|
||||
// ]}
|
||||
actions={[
|
||||
{
|
||||
tooltip: "Update Selected Objects",
|
||||
icon: "edit",
|
||||
onClick: (evt, data) => {console.log(data)}
|
||||
}
|
||||
]}
|
||||
onChangeRowsPerPage={pageSize => {
|
||||
setPageSize(pageSize);
|
||||
}}
|
||||
|
|
@ -372,7 +391,7 @@ export default function ObjectTable(props: Props) {
|
|||
</React.Fragment>
|
||||
)
|
||||
}}
|
||||
/>
|
||||
/> */}
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue