various display updates to use the custom grain name and colors

This commit is contained in:
csawatzky 2025-12-17 14:04:37 -06:00
parent e2ad43975d
commit be8dc1d11f
8 changed files with 64 additions and 46 deletions

View file

@ -200,25 +200,27 @@ export default function BinCard(props: Props) {
const typeDisplay = () => { const typeDisplay = () => {
let grainType = bin.settings.inventory?.grainType ?? pond.Grain.GRAIN_NONE; let grainType = bin.settings.inventory?.grainType ?? pond.Grain.GRAIN_NONE;
if (bin.storage() === pond.BinStorage.BIN_STORAGE_SUPPORTED_GRAIN) { switch (bin.storage()){
return ( case pond.BinStorage.BIN_STORAGE_SUPPORTED_GRAIN:
<Box> return (
<Typography variant="subtitle2" style={{ fontSize: "0.7rem", fontWeight: 700 }}> <Box>
{GrainDescriber(grainType).name} <Typography variant="subtitle2" style={{ fontSize: "0.7rem", fontWeight: 700 }}>
</Typography> {GrainDescriber(grainType).name}
<Typography variant="subtitle2" style={{ fontSize: "0.7rem", fontWeight: 700 }}> </Typography>
{bin.settings.inventory?.grainSubtype} <Typography variant="subtitle2" style={{ fontSize: "0.7rem", fontWeight: 700 }}>
</Typography> {bin.settings.inventory?.grainSubtype}
</Box> </Typography>
</Box>
)
default:
return (
<Box>
<Typography variant="subtitle2" style={{ fontSize: "0.7rem", fontWeight: 700 }}>
{bin.grainName()}
</Typography>
</Box>
); );
} }
return (
<Box>
<Typography variant="subtitle2" style={{ fontSize: "0.7rem", fontWeight: 700 }}>
{bin.settings.inventory?.customTypeName}
</Typography>
</Box>
);
}; };
const tempDisplay = () => { const tempDisplay = () => {

View file

@ -449,6 +449,11 @@ export default function BinSettings(props: Props) {
form.inventory.inventoryControl = inventoryControl form.inventory.inventoryControl = inventoryControl
form.inventory.autoThreshold = autoFillThreshold form.inventory.autoThreshold = autoFillThreshold
form.inventory.lidarDropCm = getDistanceUnit() === pond.DistanceUnit.DISTANCE_UNIT_FEET ? lidarDropDistance * 30.48 : lidarDropDistance form.inventory.lidarDropCm = getDistanceUnit() === pond.DistanceUnit.DISTANCE_UNIT_FEET ? lidarDropDistance * 30.48 : lidarDropDistance
if(form.inventory.grainType !== pond.Grain.GRAIN_CUSTOM){
form.inventory.customGrain = undefined
}else{
form.inventory.customGrain = customGrain
}
} }
binAPI binAPI
@ -498,7 +503,11 @@ export default function BinSettings(props: Props) {
form.inventory.autoThreshold = autoFillThreshold form.inventory.autoThreshold = autoFillThreshold
//if the users preferences are in feet convert the distance to cm otherwise it was entered as cm so use that //if the users preferences are in feet convert the distance to cm otherwise it was entered as cm so use that
form.inventory.lidarDropCm = getDistanceUnit() === pond.DistanceUnit.DISTANCE_UNIT_FEET ? lidarDropDistance * 30.48 : lidarDropDistance form.inventory.lidarDropCm = getDistanceUnit() === pond.DistanceUnit.DISTANCE_UNIT_FEET ? lidarDropDistance * 30.48 : lidarDropDistance
form.inventory.customGrain = customGrain if(form.inventory.grainType !== pond.Grain.GRAIN_CUSTOM){
form.inventory.customGrain = undefined
}else{
form.inventory.customGrain = customGrain
}
} }
binAPI binAPI
.updateBin(bin.key(), form, as) .updateBin(bin.key(), form, as)

View file

@ -70,6 +70,7 @@ import Edit from "@mui/icons-material/Edit";
import { makeStyles } from "@mui/styles"; import { makeStyles } from "@mui/styles";
import ButtonGroup from "common/ButtonGroup"; import ButtonGroup from "common/ButtonGroup";
import ModeChangeDialog from "./conditioning/modeChangeDialog"; import ModeChangeDialog from "./conditioning/modeChangeDialog";
import CustomGrainForm from "grain/CustomGrainForm";
const useStyles = makeStyles((theme: Theme) => { const useStyles = makeStyles((theme: Theme) => {
return ({ return ({
@ -286,6 +287,7 @@ export default function BinVisualizer(props: Props) {
const [openModeChange, setOpenModeChange] = useState(false) const [openModeChange, setOpenModeChange] = useState(false)
const [modeChangeInProgress, setModeChangeInProgress] = useState(false) const [modeChangeInProgress, setModeChangeInProgress] = useState(false)
const [newGrainSettings, setNewGrainSettings] = useState<pond.GrainSettings>()
useEffect(() => { useEffect(() => {
setModeTime(moment(bin.status.lastModeChange)); setModeTime(moment(bin.status.lastModeChange));
@ -327,6 +329,7 @@ export default function BinVisualizer(props: Props) {
setBushPerTonne(bin.settings.inventory.bushelsPerTonne.toFixed(2)); setBushPerTonne(bin.settings.inventory.bushelsPerTonne.toFixed(2));
setGrainSubtype(bin.subtype()); setGrainSubtype(bin.subtype());
setNewBinMode(bin.settings.mode); setNewBinMode(bin.settings.mode);
setNewGrainSettings(bin.customGrain());
} }
if (bin.settings) { if (bin.settings) {
let t = bin.settings.outdoorTemp; let t = bin.settings.outdoorTemp;
@ -515,18 +518,13 @@ export default function BinVisualizer(props: Props) {
const capacity = bin.settings.specs?.bushelCapacity ?? 0; const capacity = bin.settings.specs?.bushelCapacity ?? 0;
const grainBushels = bin.bushels(); const grainBushels = bin.bushels();
const isEmpty = bin.settings.inventory?.empty === true || !grainBushels || grainBushels <= 0; const isEmpty = bin.settings.inventory?.empty === true || !grainBushels || grainBushels <= 0;
const grainType = bin.settings.inventory?.grainType;
const grainTypeName = isEmpty || !grainType ? "" : GrainDescriber(grainType).name;
const customTypeName = bin.settings.inventory?.customTypeName;
const grainSubtype = bin.settings.inventory?.grainSubtype; const grainSubtype = bin.settings.inventory?.grainSubtype;
return ( return (
<Box> <Box>
{/* grain display */} {/* grain display */}
<Box display="flex" justifyContent="space-between"> <Box display="flex" justifyContent="space-between">
<Typography variant="subtitle2" color="textPrimary" style={{ fontWeight: 800 }}> <Typography variant="subtitle2" color="textPrimary" style={{ fontWeight: 800 }}>
{bin.storage() === pond.BinStorage.BIN_STORAGE_SUPPORTED_GRAIN {isEmpty ? "" : bin.grainName()}
? grainTypeName
: customTypeName}
{grainSubtype !== "" ? " - " + grainSubtype : ""} {grainSubtype !== "" ? " - " + grainSubtype : ""}
</Typography> </Typography>
<Box <Box
@ -768,6 +766,7 @@ export default function BinVisualizer(props: Props) {
setGrainType(bin.settings.inventory.grainType); setGrainType(bin.settings.inventory.grainType);
setGrainOption(ToGrainOption(bin.settings.inventory.grainType)); setGrainOption(ToGrainOption(bin.settings.inventory.grainType));
setBushPerTonne(bin.settings.inventory.bushelsPerTonne.toFixed(2)); setBushPerTonne(bin.settings.inventory.bushelsPerTonne.toFixed(2));
setNewGrainSettings(bin.customGrain())
setGrainSubtype(bin.subtype()); setGrainSubtype(bin.subtype());
} }
setGrainChangeDialog(false); setGrainChangeDialog(false);
@ -799,11 +798,13 @@ export default function BinVisualizer(props: Props) {
setCustomTypeName(""); setCustomTypeName("");
setGrainOption(ToGrainOption(pond.Grain.GRAIN_NONE)); setGrainOption(ToGrainOption(pond.Grain.GRAIN_NONE));
if (checked) { if (checked) {
setStorageType(pond.BinStorage.BIN_STORAGE_SUPPORTED_GRAIN);
setGrainType(pond.Grain.GRAIN_CUSTOM);
} else {
setStorageType(pond.BinStorage.BIN_STORAGE_UNSUPPORTED_GRAIN); setStorageType(pond.BinStorage.BIN_STORAGE_UNSUPPORTED_GRAIN);
setGrainType(pond.Grain.GRAIN_CUSTOM);
setNewGrainSettings(bin.customGrain())
} else {
setStorageType(pond.BinStorage.BIN_STORAGE_SUPPORTED_GRAIN);
setGrainType(pond.Grain.GRAIN_NONE); setGrainType(pond.Grain.GRAIN_NONE);
setNewGrainSettings(undefined)
} }
}} }}
name="storage" name="storage"
@ -834,7 +835,7 @@ export default function BinVisualizer(props: Props) {
)} )}
{isCustomInventory ? ( {isCustomInventory ? (
<React.Fragment> <React.Fragment>
<TextField {/* <TextField
label="Type" label="Type"
value={customTypeName} value={customTypeName}
type="text" type="text"
@ -859,7 +860,8 @@ export default function BinVisualizer(props: Props) {
variant="outlined" variant="outlined"
className={classes.bottomSpacing} className={classes.bottomSpacing}
/> />
)} )} */}
<CustomGrainForm initialGrain={bin.customGrain()} onGrainSettingsChange={settings => {setNewGrainSettings(settings)}}/>
</React.Fragment> </React.Fragment>
) : ( ) : (
<TextField <TextField
@ -1975,6 +1977,7 @@ export default function BinVisualizer(props: Props) {
? 0 ? 0
: parseFloat(bushPerTonne); : parseFloat(bushPerTonne);
b.settings.inventory.grainSubtype = grainSubtype; b.settings.inventory.grainSubtype = grainSubtype;
b.settings.inventory.customGrain = newGrainSettings
} }
if (b.settings.outdoorTemp !== undefined) { if (b.settings.outdoorTemp !== undefined) {

View file

@ -170,18 +170,18 @@ export default function BinGraphs(props: Props) {
setEndDate(newEndDate); setEndDate(newEndDate);
}; };
const determineGrainColour = () => { // const determineGrainColour = () => {
let col = "yellow"; // let col = "yellow";
let binInv = bin.settings.inventory; // let binInv = bin.settings.inventory;
if (binInv) { // if (binInv) {
if (binInv.grainType === pond.Grain.GRAIN_CUSTOM) { // if (binInv.grainType === pond.Grain.GRAIN_CUSTOM) {
col = stringToMaterialColour(binInv.customTypeName); // col = stringToMaterialColour(binInv.customTypeName);
} else if (binInv.grainType !== pond.Grain.GRAIN_NONE) { // } else if (binInv.grainType !== pond.Grain.GRAIN_NONE) {
col = GrainDescriber(binInv.grainType).colour; // col = GrainDescriber(binInv.grainType).colour;
} // }
} // }
return col; // return col;
}; // };
const inventoryGraph = () => { const inventoryGraph = () => {
return ( return (
@ -193,7 +193,7 @@ export default function BinGraphs(props: Props) {
endDate={endDate} endDate={endDate}
binLoading={binLoading} binLoading={binLoading}
bin={bin} bin={bin}
colour={determineGrainColour()} colour={bin.grainColour()}
fertilizerBin={bin.settings.storage === pond.BinStorage.BIN_STORAGE_FERTILIZER} fertilizerBin={bin.settings.storage === pond.BinStorage.BIN_STORAGE_FERTILIZER}
/> />
</Grid> </Grid>

View file

@ -391,7 +391,6 @@ export default function ComponentForm(props: Props) {
}; };
const updateCustomGrain = (grainSettings?: pond.GrainSettings) => { const updateCustomGrain = (grainSettings?: pond.GrainSettings) => {
console.log("update custom grain")
let f = cloneDeep(form) let f = cloneDeep(form)
f.component.settings.customGrain = grainSettings f.component.settings.customGrain = grainSettings
f.component.settings.grainType = pond.Grain.GRAIN_CUSTOM f.component.settings.grainType = pond.Grain.GRAIN_CUSTOM

View file

@ -10,6 +10,7 @@ import { Pressure } from "models/Pressure";
import { GrainCable } from "models/GrainCable"; import { GrainCable } from "models/GrainCable";
import { extension, Summary } from "pbHelpers/ComponentType"; import { extension, Summary } from "pbHelpers/ComponentType";
import { makeStyles } from "@mui/styles"; import { makeStyles } from "@mui/styles";
import { stringToMaterialColour } from "utils";
interface Props { interface Props {
component: Component | Plenum | Pressure | GrainCable; component: Component | Plenum | Pressure | GrainCable;
@ -109,7 +110,7 @@ export default function UnitMeasurementSummary(props: Props) {
const grainColor = () => { const grainColor = () => {
if(component.settings.grainType === pond.Grain.GRAIN_CUSTOM && component.settings.customGrain?.name){ if(component.settings.grainType === pond.Grain.GRAIN_CUSTOM && component.settings.customGrain?.name){
return return stringToMaterialColour(component.settings.customGrain.name)
} }
return GrainDescriber(component.settings.grainType).colour return GrainDescriber(component.settings.grainType).colour
} }

View file

@ -65,7 +65,7 @@ export default function CustomGrainForm(props: Props) {
}) })
}) })
} }
setGrainOptions(options) setGrainOptions([...options])
setGrainMap(map) setGrainMap(map)
}) })
},[grainAPI]) },[grainAPI])

View file

@ -90,7 +90,11 @@ export class Bin {
public customType(): string { public customType(): string {
let c = ""; let c = "";
if (this.settings.inventory) { if (this.settings.inventory) {
c = this.settings.inventory.customTypeName; if (this.settings.inventory.customGrain){
c = this.settings.inventory.customGrain.name
}else{
c = this.settings.inventory.customTypeName;
}
} }
return c; return c;
} }