merged in messages changes
This commit is contained in:
commit
13e2f689e9
66 changed files with 2105 additions and 609 deletions
|
|
@ -13,7 +13,7 @@ import { CssBaseline, Theme } from '@mui/material'
|
|||
import { AppThemeProvider } from 'theme/AppThemeProvider'
|
||||
import HTTPProvider from 'providers/http'
|
||||
import { Crisp } from "crisp-sdk-web";
|
||||
import { useSnackbar } from 'hooks'
|
||||
import { useMobile, useSnackbar } from 'hooks'
|
||||
// import FirmwareLoader from './FirmwareLoader'
|
||||
|
||||
const reducer = (state: GlobalState, action: GlobalStateAction): GlobalState => {
|
||||
|
|
@ -67,6 +67,7 @@ export default function UserWrapper(props: Props) {
|
|||
const hasFetched = useRef(false);
|
||||
const [global, setGlobal] = useState<undefined | GlobalState>(undefined)
|
||||
const snackbar = useSnackbar()
|
||||
const isMobile = useMobile()
|
||||
|
||||
const user_id = or(useAuth.user?.sub, "")
|
||||
|
||||
|
|
@ -128,6 +129,54 @@ export default function UserWrapper(props: Props) {
|
|||
Crisp.setTokenId(global?.user.id()); // e.g., your DB user ID
|
||||
}
|
||||
}, [global]);
|
||||
|
||||
// useEffect(() => {
|
||||
// if (window.$crisp) {
|
||||
// if (isMobile) {
|
||||
// $crisp.push(["config", "position:offset", [20, 120]]);
|
||||
// } else {
|
||||
// $crisp.push(["config", "position:offset", [20, 20]]);
|
||||
// }
|
||||
// }
|
||||
// }, [isMobile]);
|
||||
|
||||
// useEffect(() => {
|
||||
// console.log("crisb")
|
||||
// const crispEl = document.getElementById("crisp-chatbox");
|
||||
// console.log(crispEl)
|
||||
// if (crispEl) {
|
||||
// if (isMobile) {
|
||||
// console.log("setting margin")
|
||||
// crispEl.style.setProperty("margin-bottom", "180px", "important");
|
||||
// } else {
|
||||
// crispEl.style.setProperty("margin-bottom", "0px", "important");
|
||||
// }
|
||||
// }
|
||||
// }, [isMobile]);
|
||||
|
||||
useEffect(() => {
|
||||
let style = document.getElementById("crisp-offset-override");
|
||||
if (!style) {
|
||||
style = document.createElement("style");
|
||||
style.id = "crisp-offset-override";
|
||||
document.head.appendChild(style);
|
||||
}
|
||||
|
||||
if (isMobile) {
|
||||
style.textContent = `
|
||||
#crisp-chatbox [aria-label="Open chat"] {
|
||||
bottom: 6em !important;
|
||||
}
|
||||
// #crisp-chatbox [data-visible][style*="width: 360px"] {
|
||||
// bottom: 180px !important;
|
||||
// }
|
||||
`;
|
||||
} else {
|
||||
style.textContent = "";
|
||||
}
|
||||
|
||||
return () => style?.remove();
|
||||
}, [isMobile]);
|
||||
|
||||
useEffect(() => {
|
||||
if (loading) return;
|
||||
|
|
|
|||
BIN
src/assets/whitelabels/MiPCA/MiPCALogo.png
Normal file
BIN
src/assets/whitelabels/MiPCA/MiPCALogo.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 23 KiB |
|
|
@ -65,7 +65,7 @@ import { getDistanceUnit, or, getTemperatureUnit, getGrainUnit } from "utils";
|
|||
import { makeStyles } from "@mui/styles";
|
||||
import { useNavigate } from "react-router-dom";
|
||||
import BinSelector from "./BinSelector";
|
||||
import CustomGrainForm from "grain/CustomGrainForm";
|
||||
import CustomGrainSelector from "grain/CustomGrainSelector";
|
||||
// import BinSelector from "./BinSelector";
|
||||
|
||||
const useStyles = makeStyles((theme: Theme) => {
|
||||
|
|
@ -1054,7 +1054,7 @@ export default function BinSettings(props: Props) {
|
|||
</React.Fragment>
|
||||
:
|
||||
<Box sx={{border: "1px solid white", borderRadius: 2, padding: 2, marginBottom: 2}}>
|
||||
<CustomGrainForm initialGrain={customGrain} onGrainSettingsChange={(newGrainSettings) => {setCustomGrain(newGrainSettings)}}/>
|
||||
<CustomGrainSelector initialGrain={customGrain} onGrainSettingsChange={(newGrainSettings) => {setCustomGrain(newGrainSettings)}}/>
|
||||
</Box>
|
||||
}
|
||||
</React.Fragment>
|
||||
|
|
|
|||
|
|
@ -70,7 +70,7 @@ import Edit from "@mui/icons-material/Edit";
|
|||
import { makeStyles } from "@mui/styles";
|
||||
import ButtonGroup from "common/ButtonGroup";
|
||||
import ModeChangeDialog from "./conditioning/modeChangeDialog";
|
||||
import CustomGrainForm from "grain/CustomGrainForm";
|
||||
import CustomGrainSelector from "grain/CustomGrainSelector";
|
||||
|
||||
const useStyles = makeStyles((theme: Theme) => {
|
||||
return ({
|
||||
|
|
@ -332,14 +332,23 @@ export default function BinVisualizer(props: Props) {
|
|||
setNewGrainSettings(bin.customGrain());
|
||||
}
|
||||
if (bin.settings) {
|
||||
let t = bin.settings.outdoorTemp;
|
||||
let t = 0
|
||||
let h = 0
|
||||
if(ambient){
|
||||
t = ambient.temperature
|
||||
h = ambient.humidity
|
||||
}else{
|
||||
t = bin.settings.outdoorTemp;//use what is already set in the bin settings
|
||||
h = bin.settings.outdoorHumidity
|
||||
}
|
||||
|
||||
if (user.settings.temperatureUnit === pond.TemperatureUnit.TEMPERATURE_UNIT_FAHRENHEIT) {
|
||||
t = CtoF(t);
|
||||
}
|
||||
setOutdoorTemp(t);
|
||||
setOutdoorHumidity(h)
|
||||
}
|
||||
if (bin.settings) setOutdoorHumidity(bin.settings.outdoorHumidity);
|
||||
}, [bin, user]);
|
||||
}, [bin, user, ambient]);
|
||||
|
||||
useEffect(() => {
|
||||
//if(loadingTrend) return
|
||||
|
|
@ -861,7 +870,7 @@ export default function BinVisualizer(props: Props) {
|
|||
className={classes.bottomSpacing}
|
||||
/>
|
||||
)} */}
|
||||
<CustomGrainForm initialGrain={bin.customGrain()} onGrainSettingsChange={settings => {setNewGrainSettings(settings)}}/>
|
||||
<CustomGrainSelector initialGrain={bin.customGrain()} onGrainSettingsChange={settings => {setNewGrainSettings(settings)}}/>
|
||||
</React.Fragment>
|
||||
) : (
|
||||
<TextField
|
||||
|
|
@ -1425,6 +1434,7 @@ export default function BinVisualizer(props: Props) {
|
|||
|
||||
const controls = () => {
|
||||
if (bin.settings.inventory?.empty === true) return null;
|
||||
const canEdit = permissions ? permissions.includes(pond.Permission.PERMISSION_WRITE) : false;
|
||||
return (
|
||||
<Box
|
||||
height={1}
|
||||
|
|
@ -1438,12 +1448,13 @@ export default function BinVisualizer(props: Props) {
|
|||
<React.Fragment>
|
||||
<Box display="flex" height={isMobile ? 35 : 40} marginBottom={1}>
|
||||
<IconButton
|
||||
disabled={!canEdit}
|
||||
onClick={() => {
|
||||
setGrainUpdate(true);
|
||||
}}
|
||||
style={{
|
||||
margin: "auto",
|
||||
backgroundColor: "gold",
|
||||
backgroundColor: canEdit ? "gold" : "grey",
|
||||
color: "black",
|
||||
height: "100%",
|
||||
width: isMobile ? 35 : 40
|
||||
|
|
@ -1459,6 +1470,7 @@ export default function BinVisualizer(props: Props) {
|
|||
alignContent="flex-end">
|
||||
{fillPercentage !== null && (
|
||||
<Slider
|
||||
disabled={!canEdit}
|
||||
orientation="vertical"
|
||||
value={fillPercentage}
|
||||
classes={{
|
||||
|
|
@ -1468,7 +1480,7 @@ export default function BinVisualizer(props: Props) {
|
|||
// thumb: isMobile ? classes.mobileSliderThumb : classes.sliderThumb,
|
||||
valueLabel: classes.sliderValLabel,
|
||||
}}
|
||||
style={{ height: "100%", color: sliderColour }}
|
||||
style={{ height: "100%", color: canEdit ? sliderColour : "gray" }}
|
||||
min={0}
|
||||
max={100}
|
||||
valueLabelDisplay="auto"
|
||||
|
|
@ -1998,7 +2010,7 @@ export default function BinVisualizer(props: Props) {
|
|||
}
|
||||
b.settings.mode = newBinMode;
|
||||
}
|
||||
|
||||
console.log(b.settings)
|
||||
binAPI.updateBin(bin.key(), b.settings, as).then(resp => {
|
||||
refresh();
|
||||
});
|
||||
|
|
@ -2025,8 +2037,8 @@ export default function BinVisualizer(props: Props) {
|
|||
if(refresh) updateBin();
|
||||
}}
|
||||
defaultTargetMoisture={bin.settings.inventory?.initialMoisture}
|
||||
// defaultOutdoorTemp={get this from any ambient sensors}
|
||||
// defaultOutdoorHumidity={get this from any ambient sensors}
|
||||
defaultOutdoorTemp={outdoorTemp}
|
||||
defaultOutdoorHumidity={outdoorHumidity}
|
||||
changeTargetMoisture={newMoisture => {
|
||||
setTargetMoisture(newMoisture)
|
||||
}}
|
||||
|
|
|
|||
|
|
@ -108,9 +108,9 @@ export default function ModeChangeDialog(props: Props){
|
|||
const [deviceOption, setDeviceOption] = useState<Option>()
|
||||
|
||||
useEffect(()=>{
|
||||
setMoistureInput(defaultTargetMoisture?.toFixed(2) ?? "0")
|
||||
setOutdoorTempInput(defaultOutdoorTemp?.toFixed(2) ?? "0")
|
||||
setOutdoorHumidityInput(defaultOutdoorHumidity?.toFixed(2) ?? "0")
|
||||
setMoistureInput(defaultTargetMoisture?.toString() ?? "0")
|
||||
setOutdoorTempInput(defaultOutdoorTemp?.toString() ?? "0")
|
||||
setOutdoorHumidityInput(defaultOutdoorHumidity?.toString() ?? "0")
|
||||
},[defaultTargetMoisture, defaultOutdoorTemp, defaultOutdoorHumidity])
|
||||
|
||||
//get the interactions and components for the device when it is selected from the dropdown
|
||||
|
|
@ -436,7 +436,9 @@ if (!selectedDevice) return;
|
|||
}
|
||||
stage1.steps.push(newStep);
|
||||
});
|
||||
stages.push(stage1)
|
||||
if(stage1.steps.length > 0){
|
||||
stages.push(stage1)
|
||||
}
|
||||
//stage two is to add the new interactions
|
||||
let stage2: Stage = {
|
||||
title: "Add New Interactions",
|
||||
|
|
@ -447,7 +449,9 @@ if (!selectedDevice) return;
|
|||
}
|
||||
]
|
||||
}
|
||||
stages.push(stage2)
|
||||
if(stage2.steps.length > 0){
|
||||
stages.push(stage2)
|
||||
}
|
||||
|
||||
//stage three is to update the controller components
|
||||
let stage3: Stage = {
|
||||
|
|
@ -463,7 +467,9 @@ if (!selectedDevice) return;
|
|||
stage3.steps.push(newStep)
|
||||
})
|
||||
})
|
||||
stages.push(stage3)
|
||||
if(stage3.steps.length > 0){
|
||||
stages.push(stage3)
|
||||
}
|
||||
//set those stages to a state variable
|
||||
setPromiseStages(stages)
|
||||
}
|
||||
|
|
@ -618,11 +624,7 @@ if (!selectedDevice) return;
|
|||
onChange={event => {
|
||||
setOutdoorTempInput(event.target.value)
|
||||
if(changeOutdoorTemp && !isNaN(parseFloat(event.target.value))){
|
||||
//if the users prefs are F will need to convert it to C when sending it back
|
||||
let val = parseFloat(event.target.value)
|
||||
if(getTemperatureUnit() === pond.TemperatureUnit.TEMPERATURE_UNIT_FAHRENHEIT){
|
||||
val = fahrenheitToCelsius(val)
|
||||
}
|
||||
changeOutdoorTemp(val)
|
||||
}
|
||||
}}
|
||||
|
|
@ -721,7 +723,7 @@ if (!selectedDevice) return;
|
|||
<Box>
|
||||
<PromiseProgress
|
||||
stages={promiseStages}
|
||||
automaticStart
|
||||
description="These are the changes that will occur in order to change your bin mode with the given options. Press start to begin."
|
||||
failFast
|
||||
onStart={() => {
|
||||
startChange()
|
||||
|
|
|
|||
|
|
@ -29,7 +29,7 @@ export default function BinUtilizationChart(props: Props) {
|
|||
const theme = useTheme();
|
||||
const grainColour = customColour ? customColour : GrainColour(grain);
|
||||
return (
|
||||
<Box height={1} width={1}>
|
||||
<Box height={200} width={200}>
|
||||
<CardActionArea
|
||||
onClick={onClick}
|
||||
style={{ height: "100%", borderRadius: theme.shape.borderRadius }}>
|
||||
|
|
|
|||
|
|
@ -1,9 +1,10 @@
|
|||
import { useTheme } from "@mui/material";
|
||||
import moment from "moment";
|
||||
import React, { useEffect, useState } from "react";
|
||||
import React, { useEffect, useMemo, useState } from "react";
|
||||
import {
|
||||
Area,
|
||||
AreaChart,
|
||||
Legend,
|
||||
ReferenceArea,
|
||||
ReferenceLine,
|
||||
ResponsiveContainer,
|
||||
|
|
@ -13,25 +14,38 @@ import {
|
|||
YAxis
|
||||
} from "recharts";
|
||||
import MaterialChartTooltip from "./MaterialChartTooltip";
|
||||
import { blue, orange } from "@mui/material/colors";
|
||||
import { Payload } from "recharts/types/component/DefaultLegendContent";
|
||||
|
||||
export interface SSAreaDataPoint {
|
||||
timestamp: number;
|
||||
value: number;
|
||||
}
|
||||
|
||||
export interface ColourData {
|
||||
colour: string,
|
||||
label: string
|
||||
}
|
||||
|
||||
interface Props {
|
||||
data: SSAreaDataPoint[];
|
||||
tooltipLabel: string
|
||||
tooltipUnit?: string
|
||||
yAxisLabel: string
|
||||
maxRef?: number;
|
||||
minRef?: number;
|
||||
newXDomain?: number[] | string[];
|
||||
multiGraphZoom?: (domain: number[] | string[]) => void;
|
||||
colourAboveZero?: ColourData
|
||||
colourBelowZero?: ColourData
|
||||
}
|
||||
|
||||
export default function SingleSetAreaChart(props: Props) {
|
||||
const { data, maxRef, minRef, newXDomain, multiGraphZoom } = props;
|
||||
const { data, maxRef, minRef, newXDomain, multiGraphZoom, yAxisLabel, colourAboveZero, colourBelowZero, tooltipLabel, tooltipUnit } = props;
|
||||
const [xDomain, setXDomain] = useState<string[] | number[]>(["dataMin", "dataMax"]);
|
||||
const [refLeft, setRefLeft] = useState<number | undefined>();
|
||||
const [refRight, setRefRight] = useState<number | undefined>();
|
||||
const [legendPayload, setLegendPayload] = useState<Payload[]>([])
|
||||
const theme = useTheme();
|
||||
const now = moment();
|
||||
|
||||
|
|
@ -41,6 +55,40 @@ export default function SingleSetAreaChart(props: Props) {
|
|||
}
|
||||
}, [newXDomain]);
|
||||
|
||||
useEffect(() => {
|
||||
let legend: Payload[] = []
|
||||
if(colourAboveZero){
|
||||
legend.push({
|
||||
value: colourAboveZero.label,
|
||||
color: colourAboveZero.colour,
|
||||
id: colourAboveZero.label,
|
||||
type: "square"
|
||||
})
|
||||
}
|
||||
if(colourBelowZero){
|
||||
legend.push({
|
||||
value: colourBelowZero.label,
|
||||
color: colourBelowZero.colour,
|
||||
id: colourBelowZero.label,
|
||||
type: "square"
|
||||
})
|
||||
}
|
||||
setLegendPayload(legend)
|
||||
}, [colourAboveZero, colourBelowZero])
|
||||
|
||||
const gradientOffset = useMemo(() => {
|
||||
if (!data.length) return 0;
|
||||
|
||||
const values = data.map(p => p.value);
|
||||
const max = Math.max(...values);
|
||||
const min = Math.min(...values);
|
||||
|
||||
if (max <= 0) return 0;
|
||||
if (min >= 0) return 1;
|
||||
|
||||
return max / (max - min);
|
||||
}, [data]);
|
||||
|
||||
const zoom = () => {
|
||||
let newDomain: number[] | string[] = ["dataMin", "dataMax"];
|
||||
if (refLeft && refRight && refLeft !== refRight) {
|
||||
|
|
@ -75,12 +123,16 @@ export default function SingleSetAreaChart(props: Props) {
|
|||
setRefRight(undefined);
|
||||
zoom();
|
||||
}}>
|
||||
<Legend
|
||||
verticalAlign="top"
|
||||
payload={legendPayload}
|
||||
/>
|
||||
<Tooltip
|
||||
animationEasing="ease-out"
|
||||
cursor={{ fill: theme.palette.text.primary, opacity: "0.15" }}
|
||||
labelFormatter={timestamp => moment(timestamp).format("lll")}
|
||||
content={(props: TooltipProps<any, any>) => (
|
||||
<MaterialChartTooltip {...props} valueFormatter={value => `${value}`} />
|
||||
<MaterialChartTooltip {...props} valueFormatter={value => `${value}` + (tooltipUnit ? tooltipUnit : "")} />
|
||||
)}
|
||||
/>
|
||||
<XAxis
|
||||
|
|
@ -102,13 +154,26 @@ export default function SingleSetAreaChart(props: Props) {
|
|||
type="number"
|
||||
domain={["auto", "auto"]}
|
||||
label={{
|
||||
value: "Mass Flow (kg/s)",
|
||||
value: yAxisLabel,
|
||||
position: "insideLeft",
|
||||
angle: -90,
|
||||
fill: theme.palette.text.primary
|
||||
}}
|
||||
/>
|
||||
<Area dataKey={"value"} strokeWidth={3} />
|
||||
<defs>
|
||||
{colourAboveZero && colourBelowZero &&
|
||||
<linearGradient id="solidColour" x1="0" y1="0" x2="0" y2="1">
|
||||
<stop offset={gradientOffset} stopColor={colourAboveZero.colour} stopOpacity="75%" />
|
||||
<stop offset={gradientOffset} stopColor={colourBelowZero.colour} stopOpacity="75%" />
|
||||
</linearGradient>
|
||||
}
|
||||
</defs>
|
||||
<Area dataKey={"value"} strokeWidth={3}
|
||||
type="monotone"
|
||||
name={tooltipLabel}
|
||||
stroke={(colourAboveZero && colourBelowZero) && "url(#solidColour)"}
|
||||
fill={(colourAboveZero && colourBelowZero) && "url(#solidColour)"}
|
||||
/>
|
||||
<ReferenceLine
|
||||
ifOverflow="extendDomain"
|
||||
y={maxRef}
|
||||
|
|
|
|||
|
|
@ -1,41 +1,39 @@
|
|||
import { ChevronRight } from "@mui/icons-material";
|
||||
import { Box, Drawer, IconButton, Theme, Typography } from "@mui/material";
|
||||
import { Avatar, Box, Drawer, IconButton, Theme, Typography } from "@mui/material";
|
||||
import { makeStyles } from "@mui/styles";
|
||||
import { useMobile } from "hooks";
|
||||
import { Team } from "models";
|
||||
import Chat from "./Chat";
|
||||
import { pond } from "protobuf-ts/pond";
|
||||
|
||||
const useStyles = makeStyles((theme: Theme) => {
|
||||
return ({
|
||||
chatDrawer: {
|
||||
display: "flex",
|
||||
flexDirection: "column", // Arrange children vertically
|
||||
backgroundColor: theme.palette.background.default,
|
||||
height: "100%",
|
||||
maxHeight: "100%",
|
||||
minHeight: "100%",
|
||||
minWidth: theme.spacing(54),
|
||||
maxWidth: theme.spacing(54),
|
||||
},
|
||||
chatContainer: {
|
||||
flex: 1,
|
||||
overflow: "hidden",
|
||||
},
|
||||
chatDrawerMobile: {
|
||||
backgroundColor: theme.palette.background.default,
|
||||
height: "auto",
|
||||
width: "100%"
|
||||
},
|
||||
drawerHeader: {
|
||||
display: "flex",
|
||||
alignItems: "center",
|
||||
padding: theme.spacing(1),
|
||||
...theme.mixins.toolbar,
|
||||
justifyContent: "flex-start"
|
||||
}
|
||||
});
|
||||
});
|
||||
const useStyles = makeStyles<Theme>((theme: Theme) => ({
|
||||
chatDrawer: {
|
||||
display: "flex",
|
||||
flexDirection: "column",
|
||||
backgroundColor: theme.palette.background.default,
|
||||
height: "100%",
|
||||
maxHeight: "100%",
|
||||
minHeight: "100%",
|
||||
minWidth: theme.spacing(54),
|
||||
maxWidth: theme.spacing(54),
|
||||
},
|
||||
chatContainer: {
|
||||
flex: 1,
|
||||
overflow: "hidden",
|
||||
},
|
||||
chatDrawerMobile: {
|
||||
backgroundColor: theme.palette.background.default,
|
||||
height: "auto",
|
||||
width: "100%",
|
||||
},
|
||||
drawerHeader: {
|
||||
display: "flex",
|
||||
alignItems: "center",
|
||||
padding: theme.spacing(1),
|
||||
...theme.mixins.toolbar,
|
||||
justifyContent: "flex-start",
|
||||
},
|
||||
}));
|
||||
|
||||
interface Props {
|
||||
open: boolean;
|
||||
|
|
@ -48,17 +46,53 @@ export function ChatDrawer(props: Props) {
|
|||
const isMobile = useMobile();
|
||||
const classes = useStyles()
|
||||
|
||||
console.log(team.settings.avatar)
|
||||
|
||||
return (
|
||||
<Drawer open={open} onClose={onClose} anchor="right" >
|
||||
<Box className={isMobile ? classes.chatDrawerMobile : classes.chatDrawer}>
|
||||
<Box className={classes.drawerHeader}>
|
||||
<IconButton onClick={onClose}>
|
||||
<ChevronRight />
|
||||
<Drawer
|
||||
open={open}
|
||||
onClose={onClose}
|
||||
anchor="right"
|
||||
slotProps={{
|
||||
paper: {
|
||||
sx: isMobile ? { width: "100%" } : undefined,
|
||||
},
|
||||
}}
|
||||
>
|
||||
<Box display="flex" flexDirection="row" height="100%">
|
||||
{/* Side icon column */}
|
||||
<Box
|
||||
display="flex"
|
||||
flexDirection="column"
|
||||
alignItems="center"
|
||||
padding={1}
|
||||
gap={1}
|
||||
sx={(theme: Theme) => ({
|
||||
backgroundColor: theme.palette.background.paper,
|
||||
borderRight: `1px solid ${theme.palette.divider}`,
|
||||
})}
|
||||
>
|
||||
{/* Add your icons here */}
|
||||
<IconButton >
|
||||
{/* <SomeIcon /> */}
|
||||
<Avatar src={team.settings.avatar} />
|
||||
</IconButton>
|
||||
<IconButton>
|
||||
{/* <AnotherIcon /> */}
|
||||
</IconButton>
|
||||
<Typography>{team.name()} Chat</Typography>
|
||||
</Box>
|
||||
<Box className={classes.chatContainer}>
|
||||
<Chat objectKey={team.settings.key} type={pond.NoteType.NOTE_TYPE_TEAM}/>
|
||||
|
||||
{/* Main chat area */}
|
||||
<Box className={isMobile ? classes.chatDrawerMobile : classes.chatDrawer}>
|
||||
<Box className={classes.drawerHeader}>
|
||||
<IconButton onClick={onClose}>
|
||||
<ChevronRight />
|
||||
</IconButton>
|
||||
<Typography>{team.name()} Chat</Typography>
|
||||
</Box>
|
||||
<Box className={classes.chatContainer}>
|
||||
<Chat objectKey={team.settings.key} type={pond.NoteType.NOTE_TYPE_TEAM} />
|
||||
</Box>
|
||||
</Box>
|
||||
</Box>
|
||||
</Drawer>
|
||||
|
|
|
|||
|
|
@ -21,6 +21,7 @@ import { pond } from "protobuf-ts/pond";
|
|||
import React, { useEffect, useState } from "react";
|
||||
import { makeStyles } from "@mui/styles";
|
||||
import { useGlobalState } from "providers";
|
||||
import { getContextKeys, getContextTypes } from "pbHelpers/Context";
|
||||
|
||||
interface TabPanelProps {
|
||||
children?: React.ReactNode;
|
||||
|
|
@ -116,13 +117,7 @@ export default function DeviceLinkDrawer(props: Props) {
|
|||
undefined,
|
||||
undefined,
|
||||
undefined,
|
||||
true,
|
||||
undefined,
|
||||
undefined,
|
||||
undefined,
|
||||
undefined,
|
||||
undefined,
|
||||
as
|
||||
true
|
||||
)
|
||||
.then(resp => {
|
||||
let devMap = new Map<string, pond.ComprehensiveDevice>();
|
||||
|
|
|
|||
|
|
@ -9,7 +9,7 @@ import {
|
|||
Typography
|
||||
} from "@mui/material";
|
||||
import { useFileControllerAPI, useGlobalState } from "providers";
|
||||
import { useState } from "react";
|
||||
import { useEffect, useState } from "react";
|
||||
import ErrorIcon from "@mui/icons-material/Error";
|
||||
import CheckCircleOutlineIcon from "@mui/icons-material/CheckCircleOutline";
|
||||
import { getThemeType } from "theme";
|
||||
|
|
@ -25,6 +25,7 @@ interface Props {
|
|||
uniqueID?: string;
|
||||
keys?: string[];
|
||||
types?: string[];
|
||||
hasFilePermission: boolean;
|
||||
}
|
||||
|
||||
const useStyles = makeStyles((theme: Theme) => {
|
||||
|
|
@ -53,8 +54,8 @@ const useStyles = makeStyles((theme: Theme) => {
|
|||
});
|
||||
|
||||
export default function FileSelector(props: Props) {
|
||||
const { uploadEnd, uploadStart, uniqueID, toAttach, keys, types } = props;
|
||||
const [{ userTeamPermissions }] = useGlobalState();
|
||||
const { uploadEnd, uploadStart, uniqueID, toAttach, keys, types, hasFilePermission } = props;
|
||||
// const [{ userTeamPermissions }] = useGlobalState();
|
||||
const [fileList, setFileList] = useState<FileList | undefined>();
|
||||
const classes = useStyles();
|
||||
const fileAPI = useFileControllerAPI();
|
||||
|
|
@ -142,7 +143,7 @@ export default function FileSelector(props: Props) {
|
|||
disabled={
|
||||
uploading ||
|
||||
(!uploadFailed && fileID !== "") ||
|
||||
!userTeamPermissions.includes(pond.Permission.PERMISSION_FILE_MANAGEMENT)
|
||||
!hasFilePermission
|
||||
}
|
||||
multiple={false}
|
||||
name={uniqueID || "fileInput"}
|
||||
|
|
@ -163,7 +164,7 @@ export default function FileSelector(props: Props) {
|
|||
<label
|
||||
htmlFor={uniqueID || "fileInput"}
|
||||
className={
|
||||
userTeamPermissions.includes(pond.Permission.PERMISSION_FILE_MANAGEMENT)
|
||||
hasFilePermission
|
||||
? classes.fileSelect
|
||||
: classes.fileDisabled
|
||||
}>
|
||||
|
|
|
|||
|
|
@ -10,19 +10,22 @@ interface Props {
|
|||
uploadEnd: (fileID?: string, fileName?: string) => void;
|
||||
keys?: string[];
|
||||
types?: string[];
|
||||
hasFilePermission: boolean
|
||||
}
|
||||
|
||||
export default function FileUploader(props: Props) {
|
||||
const { uploadStart, uploadEnd, startingSelectorCount, toAttach, keys, types } = props;
|
||||
const { uploadStart, uploadEnd, startingSelectorCount, toAttach, keys, types, hasFilePermission } = props;
|
||||
const [numSelectors, setNumSelectors] = useState(startingSelectorCount || 1);
|
||||
const [selectors, setSelectors] = useState<JSX.Element[]>([]);
|
||||
|
||||
|
||||
useEffect(() => {
|
||||
let currentSelectors: JSX.Element[] = [];
|
||||
for (let i = 0; i < numSelectors; i++) {
|
||||
currentSelectors.push(
|
||||
<Box key={i} margin={2}>
|
||||
<FileSelector
|
||||
hasFilePermission={hasFilePermission}
|
||||
toAttach={toAttach}
|
||||
keys={keys}
|
||||
types={types}
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
import { AxiosResponse } from "axios"
|
||||
import { Box, Button, CircularProgress, DialogActions, DialogContent, DialogTitle, Typography } from "@mui/material"
|
||||
import { Box, Button, CircularProgress, DialogActions, DialogContent, DialogTitle, Divider, Typography } from "@mui/material"
|
||||
import { useEffect, useState } from "react"
|
||||
import { CheckCircle, Error, Pending } from "@mui/icons-material"
|
||||
import React from "react"
|
||||
|
|
@ -18,7 +18,7 @@ export interface Step {
|
|||
|
||||
interface Props {
|
||||
stages: Stage[]
|
||||
automaticStart: boolean
|
||||
description?: string
|
||||
failFast?: boolean
|
||||
onStart?: () => void
|
||||
onComplete?: () => void
|
||||
|
|
@ -32,7 +32,7 @@ enum progress {
|
|||
}
|
||||
|
||||
export function PromiseProgress(props: Props){
|
||||
const {stages, failFast, onStart, onComplete, automaticStart} = props
|
||||
const {stages, failFast, onStart, onComplete, description } = props
|
||||
const [completion, setCompletion] = useState<Map<string, progress>>(new Map())
|
||||
|
||||
const execute = () => {
|
||||
|
|
@ -84,12 +84,6 @@ export function PromiseProgress(props: Props){
|
|||
});
|
||||
}
|
||||
|
||||
useEffect(() => {
|
||||
if(automaticStart){
|
||||
execute()
|
||||
}
|
||||
},[automaticStart, execute])
|
||||
|
||||
const getCompletion = (completion?: progress) => {
|
||||
switch(completion){
|
||||
case progress.InProgress:
|
||||
|
|
@ -123,16 +117,17 @@ export function PromiseProgress(props: Props){
|
|||
Progress
|
||||
</DialogTitle>
|
||||
<DialogContent>
|
||||
{stages.map((stage, number) => displayStage(stage, number))}
|
||||
<Typography>{description}</Typography>
|
||||
<Box marginTop={2}>
|
||||
{stages.map((stage, number) => displayStage(stage, number))}
|
||||
</Box>
|
||||
</DialogContent>
|
||||
<DialogActions>
|
||||
{!automaticStart &&
|
||||
<Button onClick={() => {
|
||||
execute()
|
||||
}}>
|
||||
Start
|
||||
</Button>
|
||||
}
|
||||
<Button variant="contained" color="primary" onClick={() => {
|
||||
execute()
|
||||
}}>
|
||||
Start
|
||||
</Button>
|
||||
</DialogActions>
|
||||
</React.Fragment>
|
||||
)
|
||||
|
|
|
|||
|
|
@ -48,7 +48,7 @@ import { getDistanceUnit } from "utils";
|
|||
import { GrainOptions } from "grain";
|
||||
import CompModes from "component/ComponentMode.json";
|
||||
import FanPicker from "fans/fanPicker";
|
||||
import CustomGrainForm from "grain/CustomGrainForm";
|
||||
import CustomGrainSelector from "grain/CustomGrainSelector";
|
||||
|
||||
const useStyles = makeStyles((theme: Theme) => {
|
||||
return ({
|
||||
|
|
@ -654,7 +654,7 @@ export default function ComponentForm(props: Props) {
|
|||
/>
|
||||
{useCustomGrain ?
|
||||
<Box sx={{border: "1px solid white", borderRadius: 2, padding: 2, marginBottom: 2}}>
|
||||
<CustomGrainForm onGrainSettingsChange={updateCustomGrain} initialGrain={form.component.customGrainProps()}/>
|
||||
<CustomGrainSelector onGrainSettingsChange={updateCustomGrain} initialGrain={form.component.customGrainProps()}/>
|
||||
</Box>
|
||||
:
|
||||
<SearchSelect
|
||||
|
|
|
|||
|
|
@ -402,7 +402,7 @@ export default function ContractSettings(props: Props) {
|
|||
borderRadius: 5,
|
||||
margin: 20
|
||||
}}>
|
||||
Note: When delivering grain on contract from a field or a bin the Grain Types must match
|
||||
Note: When delivering grain on contract from a field or a bin the Grain Types must match, if it is a custom type the names must match.
|
||||
</Typography>
|
||||
</Box>
|
||||
<Grid
|
||||
|
|
|
|||
|
|
@ -6,26 +6,17 @@ import {
|
|||
Button,
|
||||
Grid2,
|
||||
IconButton,
|
||||
Paper,
|
||||
Stack,
|
||||
Tab,
|
||||
Table,
|
||||
TableBody,
|
||||
TableCell,
|
||||
TableContainer,
|
||||
TableHead,
|
||||
TableRow,
|
||||
Tabs,
|
||||
Typography
|
||||
} from "@mui/material";
|
||||
import React, { useCallback, useEffect, useState } from "react";
|
||||
import { useMobile, useSnackbar, useUserAPI } from "hooks";
|
||||
import { useMobile, useSnackbar } from "hooks";
|
||||
import { useGlobalState, useFieldAPI, useJohnDeereProxyAPI, useCNHiProxyAPI } from "providers";
|
||||
//import HarvestTable from "harvestPlan/HarvestTable";
|
||||
import { Field, fieldScope, teamScope } from "models";
|
||||
import { Field } from "models";
|
||||
import GrainDescriber from "grain/GrainDescriber";
|
||||
import { pond } from "protobuf-ts/pond";
|
||||
import HarvestSettings from "harvestPlan/HarvestSettings";
|
||||
import ResponsiveTable, { Column } from "common/ResponsiveTable";
|
||||
import FieldMinimap from "./Fieldminimap";
|
||||
import FieldActions from "./FieldActions";
|
||||
|
|
@ -36,12 +27,6 @@ import ShareAllFields from "./ShareAllFields";
|
|||
import EventBlocker from "common/EventBlocker";
|
||||
import { useNavigate } from "react-router-dom";
|
||||
|
||||
interface TabPanelProps {
|
||||
children?: React.ReactNode;
|
||||
index: any;
|
||||
value: any;
|
||||
}
|
||||
|
||||
export default function FieldList() {
|
||||
const [{ as }] = useGlobalState();
|
||||
const isMobile = useMobile();
|
||||
|
|
@ -50,7 +35,6 @@ export default function FieldList() {
|
|||
const cnhAPI = useCNHiProxyAPI();
|
||||
const { openSnack } = useSnackbar();
|
||||
const [tabValue, setTabValue] = React.useState(0);
|
||||
const [openHarvestSettings, setOpenHarvestSettings] = useState(false);
|
||||
// const [fieldForPlan, setFieldForPlan] = useState(Field.create());
|
||||
const [fields, setFields] = useState<Field[]>([]);
|
||||
const [total, setTotal] = useState(0)
|
||||
|
|
@ -235,7 +219,7 @@ const columns: Column<Field>[] = [
|
|||
<Typography textAlign="center">{row.grainName()}</Typography>
|
||||
<Typography textAlign="center">{row.acres()} Acres</Typography>
|
||||
</Stack>
|
||||
<Button variant="contained" color="primary">Go</Button>
|
||||
<Button variant="contained" color="primary" fullWidth onClick={() => goTo(row)}>Go</Button>
|
||||
</Grid2>
|
||||
</Grid2>
|
||||
</AccordionDetails>
|
||||
|
|
|
|||
152
src/gate/GateDeltaTempGraph.tsx
Normal file
152
src/gate/GateDeltaTempGraph.tsx
Normal file
|
|
@ -0,0 +1,152 @@
|
|||
import { Box, Card, CardHeader, Grid2, Typography } from "@mui/material"
|
||||
import { blue, orange } from "@mui/material/colors"
|
||||
import SingleSetAreaChart, { SSAreaDataPoint } from "charts/SingleSetAreaChart"
|
||||
import { useComponentAPI } from "hooks"
|
||||
import { cloneDeep } from "lodash"
|
||||
import { Component } from "models"
|
||||
import { UnitMeasurement } from "models/UnitMeasurement"
|
||||
import moment from "moment"
|
||||
import { Moment } from "moment"
|
||||
import { pond } from "protobuf-ts/pond"
|
||||
import { quack } from "protobuf-ts/quack"
|
||||
import { useGlobalState } from "providers"
|
||||
import { useEffect, useState } from "react"
|
||||
import { getTemperatureUnit } from "utils"
|
||||
|
||||
|
||||
interface Props {
|
||||
//the key for the temperature chain, this may be overhauled to only be a single node in the future for the outlet and the 'inlet' would be the ambient
|
||||
deviceID: number
|
||||
tempComponent: Component
|
||||
ambient?: Component
|
||||
start: Moment;
|
||||
end: Moment;
|
||||
}
|
||||
|
||||
export default function GateDeltaTempGraph(props: Props){
|
||||
const {
|
||||
tempComponent,
|
||||
ambient,
|
||||
deviceID,
|
||||
start,
|
||||
end
|
||||
} = props
|
||||
const [data, setData] = useState<SSAreaDataPoint[]>([])
|
||||
const [{user}] = useGlobalState()
|
||||
const componentAPI = useComponentAPI();
|
||||
const [recent, setRecent] = useState<SSAreaDataPoint>()
|
||||
const warmingColour = orange["500"]
|
||||
const coolingColour = blue["500"]
|
||||
|
||||
/**
|
||||
* the use effect will use the temp component passed in get the measurements, then use the first node and the last node to determine the difference,
|
||||
* if there is only one node, or only one node is reading due to errors, then it will use that as both the inlet and outlet so the delta will be 0,
|
||||
*
|
||||
* //NOT IMPLEMENTED YET//
|
||||
* if an ambient is passed in it will use the readings from the ambient as the inlet and the temp component as the outlet
|
||||
*/
|
||||
useEffect(()=>{
|
||||
//get the measurements for the temp component
|
||||
componentAPI.listUnitMeasurements(
|
||||
deviceID,
|
||||
tempComponent.key(),
|
||||
start.toISOString(),
|
||||
end.toISOString(),
|
||||
500,
|
||||
0,
|
||||
"timestamp",
|
||||
).then(resp => {
|
||||
if(resp.data.measurements){
|
||||
let tempCompMeasurements = resp.data.measurements.map(um => UnitMeasurement.any(um, user));
|
||||
//if there is an ambient component, then treat the temp component like a single sensor and not a chain, and use the ambient measurements as the inlet
|
||||
if(ambient){
|
||||
//TODO: this is just an idea of how to handle a possible path for the overhaul of gates, if that is the route we take then this needs to be coded
|
||||
|
||||
}else{//else no ambient is passed in treat the temp component like a chain
|
||||
let deltas: SSAreaDataPoint[] = []
|
||||
tempCompMeasurements.forEach(um => {
|
||||
if (um.type === quack.MeasurementType.MEASUREMENT_TYPE_TEMPERATURE){
|
||||
um.values.forEach((nodes, index) => {
|
||||
if (nodes.values && nodes.values.length > 0 && um.timestamps[index]){
|
||||
//use the first node as the inlet
|
||||
let inletNode = nodes.values[0]
|
||||
//use the second node as the outlet, if there is an error or there is only one node then it will be used as both and the delta will be 0
|
||||
let outletNode = nodes.values[nodes.values.length -1]
|
||||
let newDelta: SSAreaDataPoint = {
|
||||
value: Math.round((outletNode - inletNode)*100)/100,
|
||||
timestamp: moment(um.timestamps[index]).valueOf(),
|
||||
}
|
||||
deltas.push(newDelta)
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
setData(deltas)
|
||||
//use the components status to set the recent to show in the header of the card
|
||||
let recent: SSAreaDataPoint | undefined
|
||||
if(tempComponent.status.measurement){
|
||||
tempComponent.status.measurement.forEach(um => {
|
||||
if(um.type === quack.MeasurementType.MEASUREMENT_TYPE_TEMPERATURE){
|
||||
let clone = cloneDeep(um)
|
||||
let m = UnitMeasurement.create(clone, user)
|
||||
if(m.values.length > 0){
|
||||
let lastReading = m.values[m.values.length - 1]
|
||||
if (lastReading.values.length > 0){
|
||||
recent = {
|
||||
value: lastReading.values[lastReading.values.length -1] - lastReading.values[0],
|
||||
timestamp: moment(m.timestamps[m.values.length - 1]).valueOf()
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
setRecent(recent)
|
||||
}
|
||||
}
|
||||
})
|
||||
},[tempComponent, ambient, deviceID, start, end])
|
||||
|
||||
return (
|
||||
<Card raised style={{ padding: 10, marginBottom: 15, marginTop: 15 }}>
|
||||
<CardHeader
|
||||
title={<Typography style={{ fontSize: 25, fontWeight: 650 }}>Delta Temp</Typography>}
|
||||
subheader={
|
||||
recent ?
|
||||
(
|
||||
<Grid2 container>
|
||||
<Grid2 size={12}>
|
||||
<span>
|
||||
{"Delta Temp: "}
|
||||
<span style={{ color: recent.value > 0 ? warmingColour : coolingColour, fontWeight: 500 }}>
|
||||
{recent.value.toFixed(2) + (getTemperatureUnit() === pond.TemperatureUnit.TEMPERATURE_UNIT_FAHRENHEIT ? " °F" : " °C")}
|
||||
</span>
|
||||
<br />
|
||||
</span>
|
||||
</Grid2>
|
||||
<Grid2 size={12}>
|
||||
<Typography color="textSecondary" variant={"caption"}>
|
||||
{moment(recent.timestamp).fromNow()}
|
||||
</Typography>
|
||||
</Grid2>
|
||||
</Grid2>
|
||||
)
|
||||
: (
|
||||
<Typography variant="body1" color="textPrimary">
|
||||
No Data
|
||||
</Typography>
|
||||
)
|
||||
|
||||
}
|
||||
/>
|
||||
<SingleSetAreaChart
|
||||
data={data}
|
||||
tooltipLabel="Delta Temp"
|
||||
tooltipUnit={getTemperatureUnit() === pond.TemperatureUnit.TEMPERATURE_UNIT_FAHRENHEIT ? " °F" : " °C"}
|
||||
yAxisLabel={"Delta T" + (getTemperatureUnit() === pond.TemperatureUnit.TEMPERATURE_UNIT_FAHRENHEIT ? " °F" : " °C")}
|
||||
colourAboveZero={{colour: warmingColour, label: "Heating"}}
|
||||
colourBelowZero={{colour: coolingColour, label: "Cooling"}}/>
|
||||
</Card>
|
||||
)
|
||||
|
||||
}
|
||||
|
|
@ -44,21 +44,33 @@ export default function GateDevice(props: Props) {
|
|||
const [tempKey, setTempKey] = useState("");
|
||||
const [pressureKey, setPressureKey] = useState("");
|
||||
const [ambientKey, setAmbientKey] = useState("");
|
||||
const [greenLightKey, setGreenLightKey] = useState("");
|
||||
const [redLightKey, setRedLightKey] = useState("");
|
||||
const { openSnack } = useSnackbar();
|
||||
const [{ user }] = useGlobalState();
|
||||
const [interactionDialog, setInteractionDialog] = useState(false);
|
||||
const [densityTemp, setDensityTemp] = useState(0);
|
||||
const isMobile = useMobile();
|
||||
const [pcaState, setPCAState] = useState(false);
|
||||
const [pcaFanOn, setPCAFanOn] = useState(false);
|
||||
// const [pcaState, setPCAState] = useState(false);
|
||||
// const [pcaFanOn, setPCAFanOn] = useState(false);
|
||||
const [detail, setDetail] = useState<"sensors" | "analytics">("analytics");
|
||||
const [lastAmbient, setLastAmbient] = useState(0);
|
||||
const [lastTemps, setLastTemps] = useState({ t1: 0, t2: 0 });
|
||||
const [lastPressures, setLastPressures] = useState({ p1: 0, p2: 0 });
|
||||
|
||||
useEffect(() => {
|
||||
//addresses of controller LEDs on a V1 device
|
||||
let redAddr = "3-1-512";
|
||||
let greenAddr = "3-1-1024";
|
||||
if (comprehensiveDevice.device) {
|
||||
setDevice(Device.any(comprehensiveDevice.device));
|
||||
|
||||
//check if the device is a MiPCA V2 device since the lEDs will have different addresses
|
||||
let dev = Device.create(comprehensiveDevice.device);
|
||||
if (dev.settings.product === pond.DeviceProduct.DEVICE_PRODUCT_MIPCA_V2) {
|
||||
redAddr = "3-1-256";
|
||||
greenAddr = "3-1-512";
|
||||
}
|
||||
}
|
||||
if (comprehensiveDevice.components) {
|
||||
let components: Map<string, Component> = new Map<string, Component>();
|
||||
|
|
@ -87,19 +99,24 @@ export default function GateDevice(props: Props) {
|
|||
break;
|
||||
case pond.GateComponentType.GATE_COMPONENT_TYPE_PRESSURE:
|
||||
setPressureKey(c.key());
|
||||
if (
|
||||
c.status.measurement[0] &&
|
||||
c.status.measurement[0].values[0] &&
|
||||
c.status.measurement[0].values[0].values[1]
|
||||
) {
|
||||
setPCAFanOn(c.status.measurement[0].values[0].values[1] > 996); //apx 4 iwg
|
||||
}
|
||||
// if (
|
||||
// c.status.measurement[0] &&
|
||||
// c.status.measurement[0].values[0] &&
|
||||
// c.status.measurement[0].values[0].values[1]
|
||||
// ) {
|
||||
// setPCAFanOn(c.status.measurement[0].values[0].values[1] > 996); //apx 4 iwg
|
||||
// }
|
||||
break;
|
||||
default:
|
||||
// type is unknown, do nothing
|
||||
break;
|
||||
}
|
||||
}
|
||||
if (c.locationString() === redAddr && c.subType() === 1) {
|
||||
setRedLightKey(c.key());
|
||||
} else if (c.locationString() === greenAddr && c.subType() === 1) {
|
||||
setGreenLightKey(c.key());
|
||||
}
|
||||
});
|
||||
setComponentOptions(components);
|
||||
}
|
||||
|
|
@ -328,8 +345,8 @@ export default function GateDevice(props: Props) {
|
|||
ambientSelector={ambientSelector}
|
||||
tempChainSelector={tempSelector}
|
||||
pressureChainSelector={pressureSelector}
|
||||
pcaState={pcaState}
|
||||
pcaFanState={pcaFanOn}
|
||||
pcaState={gate.status.pcaState}
|
||||
// pcaFanState={pcaFanOn}
|
||||
checkInTime={device.status.lastActive}
|
||||
/>
|
||||
<Button
|
||||
|
|
@ -357,11 +374,14 @@ export default function GateDevice(props: Props) {
|
|||
gate={gate}
|
||||
display={detail}
|
||||
compMap={componentOptions}
|
||||
setPCAState={(state: boolean) => {
|
||||
setPCAState(state);
|
||||
}}
|
||||
// setPCAState={(state: boolean) => {
|
||||
// setPCAState(state);
|
||||
// }}
|
||||
ambient={ambientKey}
|
||||
pressure={pressureKey}
|
||||
tempChain={tempKey}
|
||||
redKey={redLightKey}
|
||||
greenKey={greenLightKey}
|
||||
device={device.id()}
|
||||
/>
|
||||
</Grid>
|
||||
|
|
|
|||
|
|
@ -1,4 +1,5 @@
|
|||
import { Button, DialogActions, DialogContent, DialogTitle, Typography } from "@mui/material";
|
||||
import { CheckBox } from "@mui/icons-material";
|
||||
import { Button, Checkbox, DialogActions, DialogContent, DialogTitle, FormControl, FormControlLabel, FormLabel, InputAdornment, TextField, Typography } from "@mui/material";
|
||||
import ResponsiveDialog from "common/ResponsiveDialog";
|
||||
import { Component, Device } from "models";
|
||||
import { Gate } from "models/Gate";
|
||||
|
|
@ -6,6 +7,7 @@ import moment from "moment";
|
|||
import { pond, quack } from "protobuf-ts/pond";
|
||||
import { useGlobalState, useInteractionsAPI, useSnackbar } from "providers";
|
||||
import React, { useEffect, useState } from "react";
|
||||
import { getPressureUnit } from "utils";
|
||||
|
||||
interface Props {
|
||||
open: boolean;
|
||||
|
|
@ -37,6 +39,7 @@ const densityMap = new Map<number, number>([
|
|||
export default function GateDeviceInteraction(props: Props) {
|
||||
const { open, close, gate, compDevice, densityTemp } = props;
|
||||
const [{ user, as }] = useGlobalState();
|
||||
const [device, setDevice] = useState<Device>(Device.create())
|
||||
const [lowDelta, setLowDelta] = useState(0);
|
||||
const [highDelta, setHighDelta] = useState(0);
|
||||
const [greenComponent, setGreenComponent] = useState<Component>();
|
||||
|
|
@ -44,7 +47,12 @@ export default function GateDeviceInteraction(props: Props) {
|
|||
const [pressureComponent, setPressureComponent] = useState<Component>();
|
||||
const interactionsAPI = useInteractionsAPI();
|
||||
const [adding, setAdding] = useState(false);
|
||||
//boolean to determine if a third condition should be put on the interaction for the red light, requires a V2 device running at least fromware version 2.1.9
|
||||
const [useRedOffCondition, setUseRedOffCondition] = useState(false)
|
||||
//if the pressure is under this value then the red light should be off
|
||||
const [redThreshold, setRedThreshold] = useState("0")
|
||||
const { openSnack } = useSnackbar();
|
||||
const [pressureSource, setPressureSource] = useState<quack.ComponentID>(quack.ComponentID.create())
|
||||
|
||||
useEffect(() => {
|
||||
//math to determine what the delta pressures to set will be
|
||||
|
|
@ -95,46 +103,64 @@ export default function GateDeviceInteraction(props: Props) {
|
|||
gate.preferences[component.key()] === pond.GateComponentType.GATE_COMPONENT_TYPE_PRESSURE
|
||||
) {
|
||||
setPressureComponent(component);
|
||||
setPressureSource(
|
||||
quack.ComponentID.create({
|
||||
type: component.type(),
|
||||
address: component.settings.address,
|
||||
addressType: component.settings.addressType
|
||||
})
|
||||
)
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
if(compDevice.device){
|
||||
setDevice(Device.create(compDevice.device))
|
||||
}
|
||||
}, [gate, densityTemp, user, compDevice]);
|
||||
|
||||
// useEffect(() => {
|
||||
// //load current interactions for the device
|
||||
// let deviceID = Device.any(compDevice.device).id();
|
||||
// interactionsAPI.listInteractionsByDevice(deviceID).then(resp => {
|
||||
// setCurrentInteractions(resp);
|
||||
// });
|
||||
// }, [compDevice.device, interactionsAPI]);
|
||||
|
||||
// const removeCurrentInteractions = () => {
|
||||
// let deviceID = Device.any(compDevice.device).id();
|
||||
// currentInteractions.forEach(interaction => {
|
||||
// interactionsAPI.removeInteraction(deviceID, interaction.key());
|
||||
// });
|
||||
// };
|
||||
const buttonDisabled = () => {
|
||||
if (greenComponent === undefined) return true
|
||||
if (redComponent === undefined) return true
|
||||
if (adding) return true
|
||||
if (useRedOffCondition && isNaN(parseFloat(redThreshold))) return true
|
||||
return false
|
||||
}
|
||||
|
||||
const createInteractions = async () => {
|
||||
//the interactions to be made
|
||||
|
||||
//TOGGLE green ON when pressure within range of upper and lower
|
||||
if (
|
||||
greenComponent !== undefined &&
|
||||
redComponent !== undefined &&
|
||||
pressureComponent !== undefined
|
||||
) {
|
||||
let greenToggle: pond.InteractionSettings = pond.InteractionSettings.create({
|
||||
sink: quack.ComponentID.create({
|
||||
type: greenComponent.type(),
|
||||
address: greenComponent.settings.address,
|
||||
addressType: greenComponent.settings.addressType
|
||||
}),
|
||||
source: quack.ComponentID.create({
|
||||
type: pressureComponent.type(),
|
||||
address: pressureComponent.settings.address,
|
||||
addressType: pressureComponent.settings.addressType
|
||||
}),
|
||||
|
||||
let lightInteractions: pond.InteractionSettings[] = []
|
||||
//making variables for the parameters of the interactions
|
||||
const redSink = quack.ComponentID.create({
|
||||
type: redComponent.type(),
|
||||
address: redComponent.settings.address,
|
||||
addressType: redComponent.settings.addressType
|
||||
})
|
||||
|
||||
const greenSink = quack.ComponentID.create({
|
||||
type: greenComponent.type(),
|
||||
address: greenComponent.settings.address,
|
||||
addressType: greenComponent.settings.addressType
|
||||
})
|
||||
|
||||
const lightSchedule = pond.InteractionSchedule.create({
|
||||
timezone: moment.tz.guess(),
|
||||
weekdays: ["sunday", "monday", "tuesday", "wednesday", "thursday", "friday", "saturday"],
|
||||
timeOfDayStart: "00:00",
|
||||
timeOfDayEnd: "24:00"
|
||||
})
|
||||
|
||||
//TOGGLE green ON when pressure within range of upper and lower, this will always be the same regardless
|
||||
lightInteractions.push(pond.InteractionSettings.create({
|
||||
sink: greenSink,
|
||||
source: pressureSource,
|
||||
conditions: [
|
||||
pond.InteractionCondition.create({
|
||||
comparison: quack.RelationalOperator.RELATIONAL_OPERATOR_GREATER_THAN,
|
||||
|
|
@ -150,61 +176,146 @@ export default function GateDeviceInteraction(props: Props) {
|
|||
nodeOne: 2,
|
||||
nodeTwo: 1,
|
||||
subtype: 18,
|
||||
schedule: pond.InteractionSchedule.create({
|
||||
timezone: moment.tz.guess(),
|
||||
weekdays: ["sunday", "monday", "tuesday", "wednesday", "thursday", "friday", "saturday"],
|
||||
timeOfDayStart: "00:00",
|
||||
timeOfDayEnd: "24:00"
|
||||
}),
|
||||
schedule: lightSchedule,
|
||||
result: pond.InteractionResult.create({
|
||||
type: quack.InteractionResultType.INTERACTION_RESULT_TYPE_TOGGLE,
|
||||
value: 1
|
||||
})
|
||||
});
|
||||
}))
|
||||
|
||||
//TOGGLE red OFF when pressure within range of upper and lower
|
||||
let redToggle: pond.InteractionSettings = pond.InteractionSettings.create({
|
||||
sink: quack.ComponentID.create({
|
||||
type: redComponent.type(),
|
||||
address: redComponent.settings.address,
|
||||
addressType: redComponent.settings.addressType
|
||||
}),
|
||||
source: quack.ComponentID.create({
|
||||
type: pressureComponent.type(),
|
||||
address: pressureComponent.settings.address,
|
||||
addressType: pressureComponent.settings.addressType
|
||||
}),
|
||||
conditions: [
|
||||
pond.InteractionCondition.create({
|
||||
comparison: quack.RelationalOperator.RELATIONAL_OPERATOR_GREATER_THAN,
|
||||
value: -highDelta,
|
||||
measurementType: quack.MeasurementType.MEASUREMENT_TYPE_PRESSURE
|
||||
}),
|
||||
pond.InteractionCondition.create({
|
||||
comparison: quack.RelationalOperator.RELATIONAL_OPERATOR_LESS_THAN,
|
||||
value: -lowDelta,
|
||||
measurementType: quack.MeasurementType.MEASUREMENT_TYPE_PRESSURE
|
||||
//if they want the red light off when below a certain pressure, it will need 4 seperate SET interactions
|
||||
if(useRedOffCondition){
|
||||
//need to make sure the redthreshold is in pascals
|
||||
let thresholdPascals = 0
|
||||
if(!isNaN(parseFloat(redThreshold))){
|
||||
if(getPressureUnit() === pond.PressureUnit.PRESSURE_UNIT_KILOPASCALS){
|
||||
thresholdPascals = parseFloat(redThreshold)*1000
|
||||
}else if (getPressureUnit() === pond.PressureUnit.PRESSURE_UNIT_INCHES_OF_WATER){
|
||||
thresholdPascals = parseFloat(redThreshold)*249
|
||||
}
|
||||
}
|
||||
|
||||
//SET red on when above high
|
||||
lightInteractions.push(pond.InteractionSettings.create({
|
||||
sink: redSink,
|
||||
source: pressureSource,
|
||||
conditions: [
|
||||
pond.InteractionCondition.create({
|
||||
comparison: quack.RelationalOperator.RELATIONAL_OPERATOR_LESS_THAN,
|
||||
value: -highDelta,
|
||||
measurementType: quack.MeasurementType.MEASUREMENT_TYPE_PRESSURE
|
||||
})
|
||||
],
|
||||
nodeOne: 2,
|
||||
nodeTwo: 1,
|
||||
subtype: 18,
|
||||
schedule: lightSchedule,
|
||||
result: pond.InteractionResult.create({
|
||||
type: quack.InteractionResultType.INTERACTION_RESULT_TYPE_SET,
|
||||
value: 1
|
||||
})
|
||||
],
|
||||
nodeOne: 2,
|
||||
nodeTwo: 1,
|
||||
subtype: 18,
|
||||
schedule: pond.InteractionSchedule.create({
|
||||
timezone: moment.tz.guess(),
|
||||
weekdays: ["sunday", "monday", "tuesday", "wednesday", "thursday", "friday", "saturday"],
|
||||
timeOfDayStart: "00:00",
|
||||
timeOfDayEnd: "24:00"
|
||||
}),
|
||||
result: pond.InteractionResult.create({
|
||||
type: quack.InteractionResultType.INTERACTION_RESULT_TYPE_TOGGLE,
|
||||
value: 0
|
||||
})
|
||||
});
|
||||
}))
|
||||
//SET red off when below high and above low
|
||||
lightInteractions.push(pond.InteractionSettings.create({
|
||||
sink: redSink,
|
||||
source: pressureSource,
|
||||
conditions: [
|
||||
pond.InteractionCondition.create({
|
||||
comparison: quack.RelationalOperator.RELATIONAL_OPERATOR_GREATER_THAN,
|
||||
value: -highDelta,
|
||||
measurementType: quack.MeasurementType.MEASUREMENT_TYPE_PRESSURE
|
||||
}),
|
||||
pond.InteractionCondition.create({
|
||||
comparison: quack.RelationalOperator.RELATIONAL_OPERATOR_LESS_THAN,
|
||||
value: -lowDelta,
|
||||
measurementType: quack.MeasurementType.MEASUREMENT_TYPE_PRESSURE
|
||||
})
|
||||
],
|
||||
nodeOne: 2,
|
||||
nodeTwo: 1,
|
||||
subtype: 18,
|
||||
schedule: lightSchedule,
|
||||
result: pond.InteractionResult.create({
|
||||
type: quack.InteractionResultType.INTERACTION_RESULT_TYPE_SET,
|
||||
value: 0
|
||||
})
|
||||
}))
|
||||
//SET red on when below low and above threshold
|
||||
lightInteractions.push(pond.InteractionSettings.create({
|
||||
sink: redSink,
|
||||
source: pressureSource,
|
||||
conditions: [
|
||||
pond.InteractionCondition.create({
|
||||
comparison: quack.RelationalOperator.RELATIONAL_OPERATOR_GREATER_THAN,
|
||||
value: -lowDelta,
|
||||
measurementType: quack.MeasurementType.MEASUREMENT_TYPE_PRESSURE
|
||||
}),
|
||||
pond.InteractionCondition.create({
|
||||
comparison: quack.RelationalOperator.RELATIONAL_OPERATOR_LESS_THAN,
|
||||
value: -thresholdPascals,
|
||||
measurementType: quack.MeasurementType.MEASUREMENT_TYPE_PRESSURE
|
||||
}),
|
||||
],
|
||||
nodeOne: 2,
|
||||
nodeTwo: 1,
|
||||
subtype: 18,
|
||||
schedule: lightSchedule,
|
||||
result: pond.InteractionResult.create({
|
||||
type: quack.InteractionResultType.INTERACTION_RESULT_TYPE_SET,
|
||||
value: 1
|
||||
})
|
||||
}))
|
||||
//SET red off when below threshold
|
||||
lightInteractions.push(pond.InteractionSettings.create({
|
||||
sink: redSink,
|
||||
source: pressureSource,
|
||||
conditions: [
|
||||
pond.InteractionCondition.create({
|
||||
comparison: quack.RelationalOperator.RELATIONAL_OPERATOR_LESS_THAN,
|
||||
value: thresholdPascals,
|
||||
measurementType: quack.MeasurementType.MEASUREMENT_TYPE_PRESSURE
|
||||
}),
|
||||
],
|
||||
subtype: 1,
|
||||
schedule: lightSchedule,
|
||||
result: pond.InteractionResult.create({
|
||||
type: quack.InteractionResultType.INTERACTION_RESULT_TYPE_SET,
|
||||
value: 0
|
||||
})
|
||||
}))
|
||||
}else{
|
||||
//otherwise use the regular single TOGGLE interaction
|
||||
//TOGGLE red OFF when pressure within range of upper and lower
|
||||
lightInteractions.push(pond.InteractionSettings.create({
|
||||
sink: redSink,
|
||||
source: pressureSource,
|
||||
conditions: [
|
||||
pond.InteractionCondition.create({
|
||||
comparison: quack.RelationalOperator.RELATIONAL_OPERATOR_GREATER_THAN,
|
||||
value: -highDelta,
|
||||
measurementType: quack.MeasurementType.MEASUREMENT_TYPE_PRESSURE
|
||||
}),
|
||||
pond.InteractionCondition.create({
|
||||
comparison: quack.RelationalOperator.RELATIONAL_OPERATOR_LESS_THAN,
|
||||
value: -lowDelta,
|
||||
measurementType: quack.MeasurementType.MEASUREMENT_TYPE_PRESSURE
|
||||
})
|
||||
],
|
||||
nodeOne: 2,
|
||||
nodeTwo: 1,
|
||||
subtype: 18,
|
||||
schedule: lightSchedule,
|
||||
result: pond.InteractionResult.create({
|
||||
type: quack.InteractionResultType.INTERACTION_RESULT_TYPE_TOGGLE,
|
||||
value: 0
|
||||
})
|
||||
}))
|
||||
}
|
||||
|
||||
let deviceID = Device.any(compDevice.device).id();
|
||||
if (deviceID !== undefined) {
|
||||
let multi = pond.MultiInteractionSettings.create({
|
||||
interactions: [greenToggle, redToggle]
|
||||
interactions: lightInteractions
|
||||
});
|
||||
interactionsAPI
|
||||
.addMultiInteractions(deviceID, multi, as)
|
||||
|
|
@ -230,11 +341,51 @@ export default function GateDeviceInteraction(props: Props) {
|
|||
}}>
|
||||
<DialogTitle>Set Interaction For Light Toggle</DialogTitle>
|
||||
<DialogContent>
|
||||
Your Delta Pressures, in pascals, will be:
|
||||
{/* Your Delta Pressures, in pascals, will be:
|
||||
<Typography>low = {lowDelta}</Typography>
|
||||
<Typography>high = {highDelta}</Typography>
|
||||
<Typography>{greenComponent ? "" : "Green LED Component not found"}</Typography>
|
||||
<Typography>{redComponent ? "" : "Red LED Component not found"}</Typography>
|
||||
<Typography>{redComponent ? "" : "Red LED Component not found"}</Typography> */}
|
||||
<Typography>
|
||||
This will clear existing interactions on the pressure chain and set new ones to toggle the green light on and the red light off
|
||||
when the difference between the pressures falls within this range and vice versa:
|
||||
</Typography>
|
||||
<br />
|
||||
<Typography>Upper Limit: {getPressureUnit() === pond.PressureUnit.PRESSURE_UNIT_INCHES_OF_WATER ? (highDelta/249.089).toFixed(2) + " iwg" : highDelta/1000 + " kPa"}</Typography>
|
||||
<Typography>Lower Limit: {getPressureUnit() === pond.PressureUnit.PRESSURE_UNIT_INCHES_OF_WATER ? (lowDelta/249.089).toFixed(2) + " iwg" : lowDelta/1000 + " kPa"}</Typography>
|
||||
<br />
|
||||
|
||||
<Typography>If you would like to have the interactions set in such a way that if the average pressure falls below a given value set the use off condition and set the value to use</Typography>
|
||||
<FormControlLabel
|
||||
control={
|
||||
<Checkbox
|
||||
checked={useRedOffCondition}
|
||||
onChange={(e, checked) => {
|
||||
setUseRedOffCondition(checked)
|
||||
}}
|
||||
/>
|
||||
}
|
||||
label={<Typography>Use Off Condition</Typography>}
|
||||
/>
|
||||
<TextField
|
||||
type="number"
|
||||
fullWidth
|
||||
disabled={!useRedOffCondition}
|
||||
value={redThreshold}
|
||||
error={isNaN(parseFloat(redThreshold))}
|
||||
helperText={isNaN(parseFloat(redThreshold)) ? "Must be a valid number" : ""}
|
||||
InputProps={{
|
||||
endAdornment: (
|
||||
<InputAdornment position="end">
|
||||
{getPressureUnit() === pond.PressureUnit.PRESSURE_UNIT_INCHES_OF_WATER ? "iwg" : "kPa"}
|
||||
</InputAdornment>
|
||||
)
|
||||
}}
|
||||
onChange={e => {
|
||||
setRedThreshold(e.target.value)
|
||||
}}
|
||||
/>
|
||||
|
||||
</DialogContent>
|
||||
<DialogActions>
|
||||
<Button
|
||||
|
|
@ -244,9 +395,13 @@ export default function GateDeviceInteraction(props: Props) {
|
|||
//TODO: Once we figure out how to fix the backend to handle rapid addition/removal of interactions
|
||||
//removeCurrentInteractions();
|
||||
setAdding(true);
|
||||
createInteractions();
|
||||
interactionsAPI.clearInteractions(device.id(), [pressureSource]).then(resp => {
|
||||
createInteractions();
|
||||
}).catch(err => {
|
||||
console.error(err)
|
||||
})
|
||||
}}
|
||||
disabled={greenComponent === undefined || redComponent === undefined || adding}>
|
||||
disabled={buttonDisabled()}>
|
||||
{adding ? "Adding Interaction" : "Create Interaction"}
|
||||
</Button>
|
||||
</DialogActions>
|
||||
|
|
|
|||
|
|
@ -25,7 +25,7 @@ interface Props {
|
|||
ambient?: string;
|
||||
newXDomain?: number[] | string[];
|
||||
pressureComponent?: string;
|
||||
setPCAState: (state: boolean) => void;
|
||||
// setPCAState: (state: boolean) => void;
|
||||
multiGraphZoom?: (domain: number[] | string[]) => void;
|
||||
}
|
||||
|
||||
|
|
@ -55,7 +55,7 @@ export default function GateFlowGraph(props: Props) {
|
|||
device,
|
||||
ambient,
|
||||
pressureComponent,
|
||||
setPCAState,
|
||||
// setPCAState,
|
||||
start,
|
||||
end,
|
||||
newXDomain,
|
||||
|
|
@ -70,13 +70,19 @@ export default function GateFlowGraph(props: Props) {
|
|||
const classes = useStyles();
|
||||
const [flowEvents, setFlowEvents] = useState<pond.AirFlowEvent[]>([]);
|
||||
const [eventsLoading, setEventsLoading] = useState(false);
|
||||
//these two constants could be entered by the user at time of retrieval
|
||||
//these two constants could be entered by the user at time of retrieval or set in the gates settings
|
||||
const eventThreshold = 5; //the threshold that if crossed from one measurement to the next during a flow event will end the current flow event and start a new one
|
||||
const idleFlow = 3.5; //the mass air flow that must be crossed in order to start a flow event, anything below this will not start an event but must go below this to end an event
|
||||
|
||||
//const idleFlow = 3.5; //the mass air flow that must be crossed in order to start a flow event, anything below this will not start an event but must go below this to end an event
|
||||
const [idleFlow, setIdleFlow] = useState(3.5)
|
||||
|
||||
useEffect(() => {
|
||||
if (loadingChartData) return;
|
||||
if (ambient && pressureComponent) {
|
||||
let gateIdle = idleFlow
|
||||
if(gate.settings.idleFlow){
|
||||
gateIdle = gate.settings.idleFlow
|
||||
}
|
||||
|
||||
let recent: SSAreaDataPoint | undefined;
|
||||
setLoadingChartData(true);
|
||||
gateAPI
|
||||
|
|
@ -110,11 +116,11 @@ export default function GateFlowGraph(props: Props) {
|
|||
|
||||
/** determine runtime */
|
||||
// set the start time if the values is greater than the idleFlow and start is not already set
|
||||
if (val.airFlow >= idleFlow && !start) {
|
||||
if (val.airFlow >= gateIdle && !start) {
|
||||
start = time;
|
||||
}
|
||||
// set the stop time when off or at the last measurements and the start time is set
|
||||
if ((val.airFlow < idleFlow || i === resp.data.values.length - idleFlow) && start) {
|
||||
if ((val.airFlow < gateIdle || i === resp.data.values.length - gateIdle) && start) {
|
||||
stop = time;
|
||||
}
|
||||
// if both start and stop are set calculate add the timeframe to the total runtime
|
||||
|
|
@ -125,22 +131,22 @@ export default function GateFlowGraph(props: Props) {
|
|||
}
|
||||
});
|
||||
setRuntime(moment.duration(runtime));
|
||||
let state = false;
|
||||
if (
|
||||
data.length > 1 &&
|
||||
data[data.length - 1].value > gate.lowerFlow() &&
|
||||
data[data.length - 1].value < gate.upperFlow()
|
||||
) {
|
||||
state = true;
|
||||
}
|
||||
setPCAState(state);
|
||||
// let state = false;
|
||||
// if (
|
||||
// data.length > 1 &&
|
||||
// data[data.length - 1].value > gate.lowerFlow() &&
|
||||
// data[data.length - 1].value < gate.upperFlow()
|
||||
// ) {
|
||||
// state = true;
|
||||
// }
|
||||
// setPCAState(state);
|
||||
}
|
||||
setFlowData(data);
|
||||
setLoadingChartData(false);
|
||||
setRecent(recent);
|
||||
});
|
||||
}
|
||||
}, [gateAPI, gate, ambient, pressureComponent, start, end, device, setPCAState, as]); // eslint-disable-line react-hooks/exhaustive-deps
|
||||
}, [gateAPI, gate, ambient, pressureComponent, start, end, device, as]); // eslint-disable-line react-hooks/exhaustive-deps
|
||||
|
||||
const loadFlowEvents = () => {
|
||||
if (ambient && pressureComponent) {
|
||||
|
|
@ -203,6 +209,8 @@ export default function GateFlowGraph(props: Props) {
|
|||
{flowData.length !== 0 ? (
|
||||
<SingleSetAreaChart
|
||||
data={flowData}
|
||||
tooltipLabel="Flow"
|
||||
yAxisLabel="Mass Flow (kg/s)"
|
||||
maxRef={gate.upperFlow()}
|
||||
minRef={gate.lowerFlow()}
|
||||
newXDomain={newXDomain}
|
||||
|
|
|
|||
|
|
@ -28,15 +28,19 @@ import { avg } from "utils";
|
|||
import GateFlowGraph from "./GateFlowGraph";
|
||||
import { makeStyles } from "@mui/styles";
|
||||
import { cloneDeep } from "lodash";
|
||||
import GateDeltaTempGraph from "./GateDeltaTempGraph";
|
||||
|
||||
interface Props {
|
||||
gate: Gate;
|
||||
display: "analytics" | "sensors";
|
||||
compMap: Map<string, Component>;
|
||||
device: string | number;
|
||||
device: number;
|
||||
pressure: string;
|
||||
ambient: string;
|
||||
setPCAState: (state: boolean) => void;
|
||||
tempChain: string;
|
||||
redKey: string;
|
||||
greenKey: string;
|
||||
// setPCAState: (state: boolean) => void;
|
||||
}
|
||||
|
||||
const useStyles = makeStyles((theme: Theme) => ({
|
||||
|
|
@ -60,7 +64,7 @@ const useStyles = makeStyles((theme: Theme) => ({
|
|||
);
|
||||
|
||||
export default function GateGraphs(props: Props) {
|
||||
const { gate, display, compMap, device, pressure, ambient, setPCAState } = props;
|
||||
const { gate, display, compMap, device, pressure, ambient, tempChain, greenKey, redKey } = props;
|
||||
const [{ as }] = useGlobalState();
|
||||
const [xDomain, setXDomain] = useState<string[] | number[]>(["dataMin", "dataMax"]);
|
||||
const [zoomed, setZoomed] = useState(false);
|
||||
|
|
@ -270,44 +274,77 @@ export default function GateGraphs(props: Props) {
|
|||
);
|
||||
};
|
||||
|
||||
const sensorGraphs = () => {
|
||||
const graphCard = (component: Component, unitMeasurements: UnitMeasurement[]) => {
|
||||
return (
|
||||
<Box>
|
||||
{Array.from(compMeasurements.values()).map((compMeasurement, i) => {
|
||||
let c = Component.create();
|
||||
if (compMeasurement[0]) {
|
||||
c = compMap.get(compMeasurement[0].componentId) ?? Component.create();
|
||||
}
|
||||
if (compMap.get(c.key())) {
|
||||
return (
|
||||
<Card raised key={i} style={{ padding: 10, marginBottom: 15 }}>
|
||||
{graphHeader(c)}
|
||||
{compMeasurement.map(um => {
|
||||
if (um.values[0] && um.values[0].values.length > 1) {
|
||||
return areaGraph(
|
||||
um,
|
||||
describeMeasurement(um.type, c.type(), c.subType()),
|
||||
c.settings.smoothingAverages
|
||||
);
|
||||
} else {
|
||||
return lineGraph(
|
||||
um,
|
||||
describeMeasurement(um.type, c.type(), c.subType()),
|
||||
c.settings.smoothingAverages
|
||||
);
|
||||
}
|
||||
})}
|
||||
</Card>
|
||||
<Card raised key={component.key()} style={{ padding: 10, marginBottom: 15 }}>
|
||||
{graphHeader(component)}
|
||||
{unitMeasurements.map(um => {
|
||||
if (um.values[0] && um.values[0].values.length > 1) {
|
||||
return areaGraph(
|
||||
um,
|
||||
describeMeasurement(um.type, component.type(), component.subType()),
|
||||
component.settings.smoothingAverages
|
||||
);
|
||||
} else {
|
||||
return <Box></Box>;
|
||||
return lineGraph(
|
||||
um,
|
||||
describeMeasurement(um.type, component.type(), component.subType()),
|
||||
component.settings.smoothingAverages
|
||||
);
|
||||
}
|
||||
})}
|
||||
</Box>
|
||||
</Card>
|
||||
);
|
||||
};
|
||||
}
|
||||
|
||||
/**
|
||||
* This function creates the charts for the gate page using the MAIN components on the gate, and delta time, it DOES NOT show any other components that could be on the device
|
||||
* @returns list of cards for the charts
|
||||
*/
|
||||
const sensorGraphs = () => {
|
||||
const tempComp = compMap.get(tempChain)
|
||||
let graphs: JSX.Element[] = []
|
||||
|
||||
//pressure
|
||||
let pressureComp = compMap.get(pressure)
|
||||
let pressureReadings = compMeasurements.get(pressure)
|
||||
if(pressureComp && pressureReadings){
|
||||
graphs.push(graphCard(pressureComp, pressureReadings))
|
||||
}
|
||||
|
||||
if(tempComp){
|
||||
graphs.push(
|
||||
<GateDeltaTempGraph deviceID={device} start={startDate} end={endDate} tempComponent={tempComp}/>
|
||||
)
|
||||
}
|
||||
//T/H chain
|
||||
let tempReadings = compMeasurements.get(tempChain)
|
||||
if(tempComp && tempReadings){
|
||||
graphs.push(graphCard(tempComp, tempReadings))
|
||||
}
|
||||
//ambient
|
||||
let ambientComp = compMap.get(ambient)
|
||||
let ambientReadings = compMeasurements.get(ambient)
|
||||
if (ambientComp && ambientReadings){
|
||||
graphs.push(graphCard(ambientComp, ambientReadings))
|
||||
}
|
||||
//green
|
||||
let greenComp = compMap.get(greenKey)
|
||||
let greenReadings = compMeasurements.get(greenKey)
|
||||
if (greenComp && greenReadings){
|
||||
graphs.push(graphCard(greenComp, greenReadings))
|
||||
}
|
||||
//red
|
||||
let redComp = compMap.get(redKey)
|
||||
let redReadings = compMeasurements.get(redKey)
|
||||
if (redComp && redReadings){
|
||||
graphs.push(graphCard(redComp, redReadings))
|
||||
}
|
||||
return graphs
|
||||
}
|
||||
|
||||
const analyticGraphs = () => {
|
||||
let tempComp = compMap.get(tempChain)
|
||||
return (
|
||||
<Box>
|
||||
<GateFlowGraph
|
||||
|
|
@ -318,14 +355,18 @@ export default function GateGraphs(props: Props) {
|
|||
gate={gate}
|
||||
ambient={ambient}
|
||||
pressureComponent={pressure}
|
||||
setPCAState={(state: boolean) => {
|
||||
setPCAState(state);
|
||||
}}
|
||||
// setPCAState={(state: boolean) => {
|
||||
// setPCAState(state);
|
||||
// }}
|
||||
multiGraphZoom={domain => {
|
||||
setXDomain(domain);
|
||||
setZoomed(true);
|
||||
}}
|
||||
/>
|
||||
{/* add a new chart here for the delta temp over time */}
|
||||
{tempComp &&
|
||||
<GateDeltaTempGraph deviceID={device} start={startDate} end={endDate} tempComponent={tempComp}/>
|
||||
}
|
||||
</Box>
|
||||
);
|
||||
};
|
||||
|
|
|
|||
|
|
@ -11,8 +11,15 @@ import ResponsiveTable, { Column } from "common/ResponsiveTable";
|
|||
import AddGateFab from "./AddGateFab";
|
||||
import GateSettings from "./GateSettings";
|
||||
import { useGateAPI, useGlobalState } from "providers";
|
||||
import { Settings } from "@mui/icons-material";
|
||||
import { CheckCircleOutline, DoNotDisturb, ErrorOutline, HelpOutlineOutlined, Settings } from "@mui/icons-material";
|
||||
import { cloneDeep } from "lodash";
|
||||
import moment from "moment";
|
||||
import { pond } from "protobuf-ts/pond";
|
||||
import { UnitMeasurement } from "models/UnitMeasurement";
|
||||
import { quack } from "protobuf-ts/quack";
|
||||
import { getTemperatureUnit } from "utils";
|
||||
import { teal } from "@mui/material/colors";
|
||||
import { react } from "@babel/types";
|
||||
|
||||
interface Props {
|
||||
//gates: Gate[];
|
||||
|
|
@ -45,6 +52,7 @@ export default function GateList(props: Props) {
|
|||
const navigate = useNavigate();
|
||||
const isMobile = useMobile();
|
||||
const classes = useStyles();
|
||||
const [{user}] = useGlobalState()
|
||||
const [gateDialog, setGateDialog] = useState(false);
|
||||
const [tablePage, setTablePage] = useState(0)
|
||||
const [pageSize, setPageSize] = useState(10)
|
||||
|
|
@ -89,6 +97,108 @@ export default function GateList(props: Props) {
|
|||
setPageSize(event.target.value);
|
||||
};
|
||||
|
||||
const displayPCAStatus = (state: pond.PCAState) => {
|
||||
switch(state){
|
||||
case pond.PCAState.PCA_STATE_IN_BOUNDS:
|
||||
return <CheckCircleOutline sx={{color: "green"}}/>
|
||||
case pond.PCAState.PCA_STATE_OUT_BOUNDS:
|
||||
return <ErrorOutline sx={{color: "red"}} />
|
||||
case pond.PCAState.PCA_STATE_OFF:
|
||||
return <DoNotDisturb />
|
||||
default:
|
||||
return <HelpOutlineOutlined />
|
||||
}
|
||||
}
|
||||
|
||||
// const lastOutletReading = (reading: pond.UnitMeasurementsForComponent[]) => {
|
||||
// let outletDisplay = "--"
|
||||
// let timeSince = "No Reading Yet"
|
||||
// let color = ""
|
||||
// reading.forEach(um => {
|
||||
// let clone = cloneDeep(um)
|
||||
// let measurement = UnitMeasurement.create(clone, user)
|
||||
// if(measurement.type === quack.MeasurementType.MEASUREMENT_TYPE_TEMPERATURE || measurement.type === quack.MeasurementType.MEASUREMENT_TYPE_PRESSURE){
|
||||
// let nodes = measurement.values[measurement.values.length-1].values
|
||||
// outletDisplay = nodes[nodes.length-1].toFixed(2) + " " + measurement.unit
|
||||
// timeSince = moment(measurement.timestamps[measurement.timestamps.length-1]).fromNow()
|
||||
// color = measurement.colour
|
||||
// }
|
||||
// })
|
||||
|
||||
// if(isMobile){
|
||||
// return (
|
||||
// <React.Fragment>
|
||||
// <Typography color={color}>{outletDisplay}</Typography>
|
||||
// <Typography>{timeSince}</Typography>
|
||||
// </React.Fragment>
|
||||
// )
|
||||
// }
|
||||
// return (
|
||||
// <Box padding={2}>
|
||||
// <Box display="flex" justifyContent="space-between">
|
||||
// <Typography>Value:</Typography>
|
||||
// <Typography color={color}>{outletDisplay}</Typography>
|
||||
// </Box>
|
||||
// <Box display="flex" justifyContent="space-between">
|
||||
// <Typography>Time:</Typography>
|
||||
// <Typography>{timeSince}</Typography>
|
||||
// </Box>
|
||||
// </Box>
|
||||
// )
|
||||
// }
|
||||
|
||||
// const tempDisplay = (gate: Gate) => {
|
||||
// let display = "--"
|
||||
// if(gate.status.pcaState !== pond.PCAState.PCA_STATE_OFF){
|
||||
// //only display it if the final temp is between -4 and 60 C, is a valid number, and is not exactly 0
|
||||
// //0 is technically a valid number but the likely hood of the calculation being exactly 0 is negligible
|
||||
// if (gate.status.finalTemp < 60 && gate.status.finalTemp > -40 && !isNaN(gate.status.finalTemp) && gate.status.finalTemp !== 0){
|
||||
// display = getTemperatureUnit() === pond.TemperatureUnit.TEMPERATURE_UNIT_FAHRENHEIT ? CtoF(gate.status.finalTemp).toFixed(2) + "°F" : gate.status.finalTemp.toFixed(2) + "°C"
|
||||
// }
|
||||
// }
|
||||
// return (
|
||||
// <Typography>
|
||||
// {display}
|
||||
// </Typography>
|
||||
// )
|
||||
// }
|
||||
|
||||
const conditionDisplay = (gate: Gate) => {
|
||||
console.log(gate)
|
||||
let display = ""
|
||||
let deltaTemp = 0
|
||||
if(gate.status.pcaState === pond.PCAState.PCA_STATE_OFF){
|
||||
display = "Inactive"
|
||||
} else if (gate.status.pcaState === pond.PCAState.PCA_STATE_UNKNOWN){
|
||||
display = "--"
|
||||
} else { //the pca is currently active calulate the delta temp (T2 - T1) provided there are two temps
|
||||
//loop to find the temp readings
|
||||
let clone = cloneDeep(gate.status.lastTempReading)
|
||||
clone.forEach(unitMeasurement => {
|
||||
let um = UnitMeasurement.create(unitMeasurement, user)
|
||||
if(um.type === quack.MeasurementType.MEASUREMENT_TYPE_TEMPERATURE){
|
||||
if(um.values.length > 0){ //as long as there is at least on thing in the measurements
|
||||
let lastReading = um.values[um.values.length-1] //there should only be one measurement in here but just make sure to get the end of the array
|
||||
if(lastReading.values.length > 1){ //make sure there are at least two values in the array
|
||||
console.log(lastReading.values)
|
||||
deltaTemp = lastReading.values[lastReading.values.length -1] - lastReading.values[0] //subtract the first value from the last value to get the delta
|
||||
}
|
||||
}
|
||||
}
|
||||
})
|
||||
display = deltaTemp.toFixed(2) + (getTemperatureUnit() === pond.TemperatureUnit.TEMPERATURE_UNIT_FAHRENHEIT ? "°F" : "°C")
|
||||
}
|
||||
return (
|
||||
<Typography>
|
||||
{display}
|
||||
</Typography>
|
||||
)
|
||||
}
|
||||
|
||||
// const CtoF = (celsius: number) => {
|
||||
// return Math.round((celsius * (9 / 5) + 32) * 100) / 100;
|
||||
// };
|
||||
|
||||
const desktopCols = (): Column<Gate>[] => {
|
||||
return [
|
||||
{
|
||||
|
|
@ -112,45 +222,60 @@ export default function GateList(props: Props) {
|
|||
)
|
||||
},
|
||||
{
|
||||
title: "Duct Type",
|
||||
render: gate => (
|
||||
<Box padding={2}>
|
||||
<Typography>
|
||||
{gate.settings.ductName}
|
||||
</Typography>
|
||||
</Box>
|
||||
)
|
||||
title: "PCA Status",
|
||||
render: gate => {
|
||||
return (<Box padding={2}>
|
||||
{displayPCAStatus(gate.status.pcaState)}
|
||||
</Box>)
|
||||
}
|
||||
},
|
||||
{
|
||||
title: "Duct Size(mm)",
|
||||
render: gate => (
|
||||
title: "Delta Temperature",
|
||||
render: gate => {
|
||||
return (
|
||||
<Box padding={2}>
|
||||
<Typography>
|
||||
{gate.ductDiameter()}
|
||||
</Typography>
|
||||
{conditionDisplay(gate)}
|
||||
</Box>
|
||||
)
|
||||
},
|
||||
{
|
||||
title: "Duct Length(m)",
|
||||
render: gate => (
|
||||
<Box padding={2}>
|
||||
<Typography>
|
||||
{gate.settings.ductLength}
|
||||
</Typography>
|
||||
</Box>
|
||||
)
|
||||
},
|
||||
{
|
||||
title: "PCA Unit",
|
||||
render: gate => (
|
||||
<Box padding={2}>
|
||||
<Typography>
|
||||
{gate.settings.pcaType}
|
||||
</Typography>
|
||||
</Box>
|
||||
)
|
||||
)}
|
||||
},
|
||||
//taking out these columns for now because were not sure if the customer actually wants them
|
||||
// {
|
||||
// title: "Estimated Temp",
|
||||
// render: gate => {
|
||||
// return (
|
||||
// <Box padding={2}>
|
||||
// {tempDisplay(gate)}
|
||||
// </Box>
|
||||
// )
|
||||
// }
|
||||
// },
|
||||
// {
|
||||
// title: "Last FLow",
|
||||
// render: gate => (
|
||||
// <Box padding={2}>
|
||||
// <Box display="flex" justifyContent="space-between">
|
||||
// <Typography>Flow:</Typography>
|
||||
// <Typography color={teal[500]}>{gate.status.lastMassAirflow.toFixed(2)} kg/s</Typography>
|
||||
// </Box>
|
||||
// <Box display="flex" justifyContent="space-between">
|
||||
// <Typography>Read:</Typography>
|
||||
// <Typography>{gate.status.lastUpdate !== "" ? moment(gate.status.lastUpdate).fromNow() : "No Reading Yet"}</Typography>
|
||||
// </Box>
|
||||
// </Box>
|
||||
// )
|
||||
// },
|
||||
// {
|
||||
// title: "Outlet Temperature",
|
||||
// render: gate => (
|
||||
// <Box>{lastOutletReading(gate.status.lastTempReading)}</Box>
|
||||
// )
|
||||
// },
|
||||
// {
|
||||
// title: "Outlet Pressure",
|
||||
// render: gate => (
|
||||
// <Box>{lastOutletReading(gate.status.lastPressureReading)}</Box>
|
||||
// )
|
||||
// }
|
||||
]
|
||||
}
|
||||
const mobileCols = (): Column<Gate>[] => {
|
||||
|
|
@ -162,13 +287,16 @@ export default function GateList(props: Props) {
|
|||
<Typography margin="auto" marginLeft={0} fontWeight={650} fontSize={20}>
|
||||
{gate.name}
|
||||
</Typography>
|
||||
<IconButton onClick={(event) => {
|
||||
event.stopPropagation()
|
||||
setSelectedGate(gate)
|
||||
setGateDialog(true)
|
||||
}}>
|
||||
<Settings />
|
||||
</IconButton>
|
||||
<Box display="flex" alignItems="center" gap={1}>
|
||||
{displayPCAStatus(gate.status.pcaState)}
|
||||
<IconButton onClick={(event) => {
|
||||
event.stopPropagation()
|
||||
setSelectedGate(gate)
|
||||
setGateDialog(true)
|
||||
}}>
|
||||
<Settings />
|
||||
</IconButton>
|
||||
</Box>
|
||||
</Box>
|
||||
)
|
||||
}
|
||||
|
|
@ -183,25 +311,28 @@ export default function GateList(props: Props) {
|
|||
<Typography>{terminalMap.get(gate.terminal()) ?? "None"}</Typography>
|
||||
</Box>
|
||||
<Box padding={2} display="flex" flexDirection="row" justifyContent="space-between">
|
||||
<Typography>Duct Type:</Typography>
|
||||
<Typography>{gate.ductName() !== "" ? gate.ductName() : "None"}</Typography>
|
||||
<Typography>Delta Temperature:</Typography>
|
||||
{conditionDisplay(gate)}
|
||||
</Box>
|
||||
{/* taking these out for now because we are not sure if the customer wants them */}
|
||||
{/* <Box padding={2} display="flex" flexDirection="row" justifyContent="space-between">
|
||||
<Typography>Estimated Temp:</Typography>
|
||||
{tempDisplay(gate)}
|
||||
</Box>
|
||||
<Box padding={2} display="flex" flexDirection="row" justifyContent="space-between">
|
||||
<Typography>Duct Size(mm):</Typography>
|
||||
<Typography>{gate.ductDiameter()}</Typography>
|
||||
<Typography>Last Flow:</Typography>
|
||||
<Typography color={teal[500]}>{gate.status.lastMassAirflow.toFixed(2)} kg/s</Typography>
|
||||
<Typography>{gate.status.lastUpdate !== "" ? moment(gate.status.lastUpdate).fromNow() : "No PCA reading yet"}</Typography>
|
||||
</Box>
|
||||
<Box padding={2} display="flex" flexDirection="row" justifyContent="space-between">
|
||||
<Typography>DuctLength(m):</Typography>
|
||||
<Typography>{gate.ductLength()}</Typography>
|
||||
</Box>
|
||||
<Box padding={2} display="flex" flexDirection="row" justifyContent="space-between">
|
||||
<Typography>PCA Unit:</Typography>
|
||||
<Typography>{gate.settings.pcaType !== "" ? gate.settings.pcaType : "None"}</Typography>
|
||||
<Typography>Outlet Temp:</Typography>
|
||||
{lastOutletReading(gate.status.lastTempReading)}
|
||||
</Box>
|
||||
<Box padding={2} display="flex" flexDirection="row" justifyContent="space-between">
|
||||
<Typography>Outlet Pressure:</Typography>
|
||||
{lastOutletReading(gate.status.lastPressureReading)}
|
||||
</Box> */}
|
||||
</Box>
|
||||
// <Typography variant="body2" color="textSecondary" sx={{ padding: 1 }}>
|
||||
|
||||
// </Typography>
|
||||
)
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -48,8 +48,8 @@ interface Props {
|
|||
ambientSelector: () => JSX.Element;
|
||||
tempChainSelector: () => JSX.Element;
|
||||
pressureChainSelector: () => JSX.Element;
|
||||
pcaState: boolean;
|
||||
pcaFanState: boolean;
|
||||
pcaState: pond.PCAState;
|
||||
// pcaFanState: boolean;
|
||||
checkInTime: string;
|
||||
}
|
||||
|
||||
|
|
@ -63,7 +63,7 @@ export default function GateSVG(props: Props) {
|
|||
tempChainSelector,
|
||||
pressureChainSelector,
|
||||
pcaState,
|
||||
pcaFanState,
|
||||
// pcaFanState,
|
||||
checkInTime
|
||||
} = props;
|
||||
const classes = useStyles();
|
||||
|
|
@ -242,16 +242,23 @@ export default function GateSVG(props: Props) {
|
|||
return temp;
|
||||
};
|
||||
|
||||
const finalTempDisplay = (temp: number) => {
|
||||
let display = "--"
|
||||
if(pcaState === pond.PCAState.PCA_STATE_IN_BOUNDS || pcaState === pond.PCAState.PCA_STATE_OUT_BOUNDS){
|
||||
if(temp < 60 && temp > -40 && !isNaN(temp) && temp !== 0){
|
||||
display = convertFinalTemp(finalTemp).toFixed(2) + (user.settings.temperatureUnit === pond.TemperatureUnit.TEMPERATURE_UNIT_FAHRENHEIT ? "°F" : "°C")
|
||||
}
|
||||
}
|
||||
return display
|
||||
}
|
||||
|
||||
const renderValues = () => {
|
||||
let values: JSX.Element[] = [];
|
||||
//add the final temp display to the array
|
||||
values.push(
|
||||
<g key={"finalTemp"} id={"finalTemp"} data-name={"finalTemp"}>
|
||||
<text fontSize={7} className={classes.fontBase} x={100} y={85}>
|
||||
{convertFinalTemp(finalTemp).toFixed(2)}
|
||||
{user.settings.temperatureUnit === pond.TemperatureUnit.TEMPERATURE_UNIT_FAHRENHEIT
|
||||
? "°F"
|
||||
: "°C"}
|
||||
{finalTempDisplay(finalTemp)}
|
||||
</text>
|
||||
</g>
|
||||
);
|
||||
|
|
@ -302,7 +309,8 @@ export default function GateSVG(props: Props) {
|
|||
const pcaRed = () => {
|
||||
return (
|
||||
<g key={"pcaRed"} id={"pcaRed"} data-name={"pcaRed"}>
|
||||
<circle cx={175} cy={152} r={8} fill={pcaFanState ? (pcaState ? "grey" : "red") : "grey"} />
|
||||
{/* <circle cx={175} cy={152} r={8} fill={(pcaFanState && pcaState === pond.PCAState.PCA_STATE_OUT_BOUNDS) ? "red" : "grey"} /> */}
|
||||
<circle cx={175} cy={152} r={8} fill={pcaState === pond.PCAState.PCA_STATE_OUT_BOUNDS ? "red" : "grey"} />
|
||||
</g>
|
||||
);
|
||||
};
|
||||
|
|
@ -314,7 +322,8 @@ export default function GateSVG(props: Props) {
|
|||
cx={175}
|
||||
cy={174}
|
||||
r={8}
|
||||
fill={pcaFanState ? (pcaState ? "green" : "grey") : "grey"}
|
||||
//fill={(pcaFanState && pcaState === pond.PCAState.PCA_STATE_IN_BOUNDS) ? "green" : "grey"}
|
||||
fill={pcaState === pond.PCAState.PCA_STATE_IN_BOUNDS ? "green" : "grey"}
|
||||
/>
|
||||
</g>
|
||||
);
|
||||
|
|
@ -324,7 +333,8 @@ export default function GateSVG(props: Props) {
|
|||
return (
|
||||
<g key={"fanStatus"}>
|
||||
<text x={125} y={180} fontSize={5} className={classes.fontBase}>
|
||||
PCA Fan: {pcaFanState ? "ON" : "OFF"}
|
||||
{/* PCA Fan: {pcaFanState ? "ON" : "OFF"} */}
|
||||
PCA Fan: {pcaState === pond.PCAState.PCA_STATE_OFF ? "OFF" : "ON"}
|
||||
</text>
|
||||
</g>
|
||||
);
|
||||
|
|
|
|||
|
|
@ -76,6 +76,7 @@ export default function GateSettings(props: Props) {
|
|||
//user set identifier to be shown on the marker on the map
|
||||
const [terminalIdentifier, setTerminalIdentifier] = useState("");
|
||||
const [gateIdentifier, setGateIdentifier] = useState("");
|
||||
const [idleLimit, setIdleLimit] = useState<number>(0);
|
||||
const [hourlyPCA, setHourlyPCA] = useState<number>(0);
|
||||
const [hourlyAPU, setHourlyAPU] = useState<number>(0);
|
||||
|
||||
|
|
@ -140,6 +141,7 @@ export default function GateSettings(props: Props) {
|
|||
settings.thermalResistance = ductProps.thermalResistance;
|
||||
settings.lowerFlow = lowerFlowBound;
|
||||
settings.upperFlow = upperFlowBound;
|
||||
settings.idleFlow = idleLimit;
|
||||
settings.ductName = ductName;
|
||||
settings.pcaType = pcaUnit;
|
||||
settings.letterIdentifier = terminalIdentifier;
|
||||
|
|
@ -167,6 +169,7 @@ export default function GateSettings(props: Props) {
|
|||
thermalResistance: ductProps.thermalResistance,
|
||||
lowerFlow: lowerFlowBound,
|
||||
upperFlow: upperFlowBound,
|
||||
idleFlow: idleLimit,
|
||||
ductName: ductName,
|
||||
pcaType: pcaUnit,
|
||||
letterIdentifier: terminalIdentifier,
|
||||
|
|
@ -283,16 +286,18 @@ export default function GateSettings(props: Props) {
|
|||
return (
|
||||
<React.Fragment>
|
||||
<TextField
|
||||
margin="dense"
|
||||
label="Gate Name"
|
||||
fullWidth
|
||||
value={gateName}
|
||||
onChange={e => setGateName(e.target.value)}
|
||||
/>
|
||||
<Select
|
||||
<TextField
|
||||
margin="dense"
|
||||
id="terminal"
|
||||
label="Terminal"
|
||||
fullWidth
|
||||
displayEmpty
|
||||
select
|
||||
value={terminalKey}
|
||||
onChange={e => {
|
||||
setTerminalKey(e.target.value as string);
|
||||
|
|
@ -305,8 +310,9 @@ export default function GateSettings(props: Props) {
|
|||
{terminal.name}
|
||||
</MenuItem>
|
||||
))}
|
||||
</Select>
|
||||
</TextField>
|
||||
<TextField
|
||||
margin="dense"
|
||||
label="Low Mass Air Flow"
|
||||
fullWidth
|
||||
type="number"
|
||||
|
|
@ -314,19 +320,30 @@ export default function GateSettings(props: Props) {
|
|||
onChange={e => setLowerFlowBound(+e.target.value)}
|
||||
/>
|
||||
<TextField
|
||||
margin="dense"
|
||||
label="High Mass Air Flow"
|
||||
fullWidth
|
||||
type="number"
|
||||
type="dense"
|
||||
value={upperFlowBound}
|
||||
onChange={e => setUpperFlowBound(+e.target.value)}
|
||||
/>
|
||||
<TextField
|
||||
margin="dense"
|
||||
label="Idle Mass Air Flow"
|
||||
fullWidth
|
||||
type="number"
|
||||
value={idleLimit}
|
||||
onChange={e => setIdleLimit(+e.target.value)}
|
||||
/>
|
||||
<TextField
|
||||
margin="dense"
|
||||
label="PCA Unit"
|
||||
fullWidth
|
||||
value={pcaUnit}
|
||||
onChange={e => setPcaUnit(e.target.value)}
|
||||
/>
|
||||
<TextField
|
||||
margin="dense"
|
||||
style={{ width: "45%" }}
|
||||
select
|
||||
label="Terminal Identifier"
|
||||
|
|
@ -340,6 +357,7 @@ export default function GateSettings(props: Props) {
|
|||
{tiOptions}
|
||||
</TextField>
|
||||
<TextField
|
||||
margin="dense"
|
||||
style={{ width: "45%", marginLeft: "10%" }}
|
||||
label="Gate Identifier"
|
||||
select
|
||||
|
|
@ -351,6 +369,7 @@ export default function GateSettings(props: Props) {
|
|||
{numberOptions}
|
||||
</TextField>
|
||||
<TextField
|
||||
margin="dense"
|
||||
label="Hourly PCA Cost"
|
||||
fullWidth
|
||||
type="number"
|
||||
|
|
@ -361,6 +380,7 @@ export default function GateSettings(props: Props) {
|
|||
onChange={e => setHourlyPCA(+e.target.value)}
|
||||
/>
|
||||
<TextField
|
||||
margin="dense"
|
||||
label="Hourly APU Cost"
|
||||
fullWidth
|
||||
type="number"
|
||||
|
|
|
|||
|
|
@ -1,101 +1,57 @@
|
|||
import { ExpandMore } from "@mui/icons-material"
|
||||
import { Accordion, AccordionDetails, AccordionSummary, Box, Button, MenuItem, TextField, Typography } from "@mui/material"
|
||||
import SearchSelect, { Option } from "common/SearchSelect"
|
||||
import {MenuItem, TextField } from "@mui/material"
|
||||
import { cloneDeep } from "lodash"
|
||||
import { pond } from "protobuf-ts/pond"
|
||||
import { useGlobalState } from "providers"
|
||||
import { useGrainAPI } from "providers/pond/grainAPI"
|
||||
import React, { useEffect, useState } from "react"
|
||||
import React, { useEffect, useRef, useState } from "react"
|
||||
|
||||
interface Props {
|
||||
initialGrain?: pond.GrainSettings
|
||||
onGrainSettingsChange: (settings: pond.GrainSettings) => void
|
||||
grainSettings?: pond.GrainSettings
|
||||
onGrainSettingsChange: (settings: pond.GrainSettings, formValid: boolean) => void
|
||||
}
|
||||
|
||||
export default function CustomGrainForm(props: Props) {
|
||||
const {initialGrain, onGrainSettingsChange} = props
|
||||
const grainAPI = useGrainAPI()
|
||||
const [{as}] = useGlobalState()
|
||||
const [name, setName] = useState(initialGrain ? initialGrain.name : "")
|
||||
const [group, setGroup] = useState(initialGrain ? initialGrain.group : "")
|
||||
const [equation, setEquation] = useState<pond.MoistureEquation>(initialGrain ? initialGrain.equation : pond.MoistureEquation.MOISTURE_EQUATION_NONE)
|
||||
const [constantA, setConstantA] = useState(initialGrain ? initialGrain.a.toString() : "0")
|
||||
const [constantB, setConstantB] = useState(initialGrain ? initialGrain.b.toString() : "0")
|
||||
const [constantC, setConstantC] = useState(initialGrain ? initialGrain.c.toString() : "0")
|
||||
const [kgPerBushel, setKgPerBushel] = useState(initialGrain ? initialGrain.kgPerBushel.toString() : "0")
|
||||
const [bushelsPerTonne, setBushelsPerTonne] = useState(initialGrain ? initialGrain.bushelsPerTonne.toString() : "0")
|
||||
const [newGrainSettings, setNewGrainSettings] = useState(initialGrain ?? pond.GrainSettings.create())
|
||||
const [grainMap, setGrainMap] = useState<Map<string, pond.GrainObject>>(
|
||||
initialGrain ?
|
||||
new Map([
|
||||
["Active", pond.GrainObject.create({key: "Active", name: initialGrain.name, settings: initialGrain})]
|
||||
])
|
||||
:
|
||||
new Map())
|
||||
const [grainOptions, setGrainOptions] = useState<Option[]>(
|
||||
initialGrain ?
|
||||
[
|
||||
{
|
||||
label: initialGrain.name,
|
||||
value: "Active",
|
||||
group: "Active"
|
||||
}
|
||||
]
|
||||
:
|
||||
[]
|
||||
)
|
||||
const [isNew, setIsNew] = useState(false)
|
||||
const [selectedOption, setSelectedOption] = useState<Option | null>(initialGrain ? {
|
||||
label: initialGrain.name,
|
||||
value: "Active",
|
||||
group: "Active"
|
||||
} : null)
|
||||
const {grainSettings, onGrainSettingsChange} = props
|
||||
const [newGrainSettings, setNewGrainSettings] = useState(pond.GrainSettings.create())
|
||||
const [name, setName] = useState("")
|
||||
const [group, setGroup] = useState("")
|
||||
const [equation, setEquation] = useState<pond.MoistureEquation>(pond.MoistureEquation.MOISTURE_EQUATION_NONE)
|
||||
const [constantA, setConstantA] = useState("0")
|
||||
const [constantB, setConstantB] = useState("0")
|
||||
const [constantC, setConstantC] = useState("0")
|
||||
const [kgPerBushel, setKgPerBushel] = useState("0")
|
||||
const [bushelsPerTonne, setBushelsPerTonne] = useState("0")
|
||||
const valid = useRef(false)
|
||||
|
||||
useEffect(()=>{
|
||||
grainAPI.listGrains(0, 0, "asc", "name", undefined, undefined, undefined, as).then(resp => {
|
||||
let options: Option[] = grainOptions
|
||||
let map: Map<string, pond.GrainObject> = grainMap
|
||||
if (resp.data.grains){
|
||||
resp.data.grains.forEach(grain => {
|
||||
map.set(grain.key, grain)
|
||||
options.push({
|
||||
label: grain.name,
|
||||
value: grain.key,
|
||||
group: grain.settings?.group,
|
||||
})
|
||||
})
|
||||
}
|
||||
setGrainOptions([...options])
|
||||
setGrainMap(map)
|
||||
})
|
||||
},[grainAPI])
|
||||
if(grainSettings){
|
||||
setName(grainSettings.name)
|
||||
setGroup(grainSettings.group)
|
||||
setEquation(grainSettings.equation)
|
||||
setConstantA(grainSettings.a.toString())
|
||||
setConstantB(grainSettings.b.toString())
|
||||
setConstantC(grainSettings.c.toString())
|
||||
setKgPerBushel(grainSettings.kgPerBushel.toString())
|
||||
setBushelsPerTonne(grainSettings.bushelsPerTonne.toString())
|
||||
setNewGrainSettings(grainSettings)
|
||||
}
|
||||
},[grainSettings])
|
||||
|
||||
const invalid = () => {
|
||||
if (name === "") return true
|
||||
if (group === "") return true
|
||||
if (isNaN(parseFloat(constantA))) return true
|
||||
if (isNaN(parseFloat(constantB))) return true
|
||||
if (isNaN(parseFloat(constantA))) return true
|
||||
if (isNaN(parseFloat(kgPerBushel))) return true
|
||||
if (isNaN(parseFloat(bushelsPerTonne))) return true
|
||||
return false
|
||||
}
|
||||
|
||||
const saveGrain = () => {
|
||||
// console.log(newGrainSettings)
|
||||
grainAPI.addGrain(newGrainSettings, as).then(resp => {
|
||||
console.log("grain added")
|
||||
}).catch(err => {
|
||||
console.log("err")
|
||||
})
|
||||
const validate = (name: string, group: string, constA: string, constB: string, constC: string, kgPerBushel: string, bushelsPerTonne: string) => {
|
||||
if (name === "") return false
|
||||
if (group === "") return false
|
||||
if (isNaN(parseFloat(constA))) return false
|
||||
if (isNaN(parseFloat(constB))) return false
|
||||
if (isNaN(parseFloat(constC))) return false
|
||||
if (isNaN(parseFloat(kgPerBushel))) return false
|
||||
if (isNaN(parseFloat(bushelsPerTonne))) return false
|
||||
return true
|
||||
}
|
||||
|
||||
const settingsChanged = (newSettings: pond.GrainSettings) => {
|
||||
setNewGrainSettings(newSettings)
|
||||
onGrainSettingsChange(newSettings)
|
||||
onGrainSettingsChange(newSettings, valid.current)
|
||||
}
|
||||
|
||||
const newGrain = () => {
|
||||
const grainForm = () => {
|
||||
return (
|
||||
<React.Fragment>
|
||||
<TextField
|
||||
|
|
@ -106,9 +62,9 @@ export default function CustomGrainForm(props: Props) {
|
|||
onChange={(e) => {
|
||||
let name = e.target.value
|
||||
setName(name)
|
||||
setIsNew(true)
|
||||
let settings = cloneDeep(newGrainSettings)
|
||||
settings.name = name
|
||||
valid.current = validate(name, group, constantA, constantB, constantC, kgPerBushel, bushelsPerTonne)
|
||||
settingsChanged(settings)
|
||||
}}/>
|
||||
<TextField
|
||||
|
|
@ -119,9 +75,9 @@ export default function CustomGrainForm(props: Props) {
|
|||
onChange={(e) => {
|
||||
let group = e.target.value
|
||||
setGroup(group)
|
||||
setIsNew(true)
|
||||
let settings = cloneDeep(newGrainSettings)
|
||||
settings.group = group
|
||||
valid.current = validate(name, group, constantA, constantB, constantC, kgPerBushel, bushelsPerTonne)
|
||||
settingsChanged(settings)
|
||||
}}/>
|
||||
<TextField
|
||||
|
|
@ -133,9 +89,9 @@ export default function CustomGrainForm(props: Props) {
|
|||
onChange={(e) => {
|
||||
let enumVal = parseFloat(e.target.value)
|
||||
setEquation(enumVal)
|
||||
setIsNew(true)
|
||||
let settings = cloneDeep(newGrainSettings)
|
||||
settings.equation = enumVal
|
||||
valid.current = validate(name, group, constantA, constantB, constantC, kgPerBushel, bushelsPerTonne)
|
||||
settingsChanged(settings)
|
||||
}}
|
||||
select>
|
||||
|
|
@ -165,12 +121,12 @@ export default function CustomGrainForm(props: Props) {
|
|||
onChange={(e) => {
|
||||
let val = e.target.value
|
||||
setConstantA(val)
|
||||
setIsNew(true)
|
||||
valid.current = validate(name, group, val, constantB, constantC, kgPerBushel, bushelsPerTonne)
|
||||
let settings = cloneDeep(newGrainSettings)
|
||||
if(!isNaN(parseFloat(val))){
|
||||
let settings = cloneDeep(newGrainSettings)
|
||||
settings.a = parseFloat(val)
|
||||
settingsChanged(settings)
|
||||
}
|
||||
settingsChanged(settings)
|
||||
}}
|
||||
label="Constant A"/>
|
||||
<TextField
|
||||
|
|
@ -183,12 +139,12 @@ export default function CustomGrainForm(props: Props) {
|
|||
onChange={(e) => {
|
||||
let val = e.target.value
|
||||
setConstantB(val)
|
||||
setIsNew(true)
|
||||
valid.current = validate(name, group, constantA, val, constantC, kgPerBushel, bushelsPerTonne)
|
||||
let settings = cloneDeep(newGrainSettings)
|
||||
if(!isNaN(parseFloat(val))){
|
||||
let settings = cloneDeep(newGrainSettings)
|
||||
settings.b = parseFloat(val)
|
||||
settingsChanged(settings)
|
||||
}
|
||||
settingsChanged(settings)
|
||||
}}
|
||||
label="Constant B"/>
|
||||
<TextField
|
||||
|
|
@ -201,12 +157,12 @@ export default function CustomGrainForm(props: Props) {
|
|||
onChange={(e) => {
|
||||
let val = e.target.value
|
||||
setConstantC(val)
|
||||
setIsNew(true)
|
||||
valid.current = validate(name, group, constantA, constantB, val, kgPerBushel, bushelsPerTonne)
|
||||
let settings = cloneDeep(newGrainSettings)
|
||||
if(!isNaN(parseFloat(val))){
|
||||
let settings = cloneDeep(newGrainSettings)
|
||||
settings.c = parseFloat(val)
|
||||
settingsChanged(settings)
|
||||
}
|
||||
settingsChanged(settings)
|
||||
}}
|
||||
label="Constant C"/>
|
||||
<TextField
|
||||
|
|
@ -219,12 +175,12 @@ export default function CustomGrainForm(props: Props) {
|
|||
onChange={(e) => {
|
||||
let val = e.target.value
|
||||
setKgPerBushel(val)
|
||||
setIsNew(true)
|
||||
valid.current = validate(name, group, constantA, constantB, constantC, val, bushelsPerTonne)
|
||||
let settings = cloneDeep(newGrainSettings)
|
||||
if(!isNaN(parseFloat(val))){
|
||||
let settings = cloneDeep(newGrainSettings)
|
||||
settings.kgPerBushel = parseFloat(val)
|
||||
settingsChanged(settings)
|
||||
}
|
||||
settingsChanged(settings)
|
||||
}}
|
||||
label="kg per Bushel"/>
|
||||
<TextField
|
||||
|
|
@ -237,85 +193,21 @@ export default function CustomGrainForm(props: Props) {
|
|||
onChange={(e) => {
|
||||
let val = e.target.value
|
||||
setBushelsPerTonne(val)
|
||||
setIsNew(true)
|
||||
valid.current = validate(name, group, constantA, constantB, constantC, kgPerBushel, val)
|
||||
let settings = cloneDeep(newGrainSettings)
|
||||
if(!isNaN(parseFloat(val))){
|
||||
let settings = cloneDeep(newGrainSettings)
|
||||
settings.bushelsPerTonne = parseFloat(val)
|
||||
settingsChanged(settings)
|
||||
}
|
||||
settingsChanged(settings)
|
||||
}}
|
||||
label="Bushels per Tonne"/>
|
||||
{isNew &&
|
||||
<Box display='flex' justifyContent="flex-end">
|
||||
<Button
|
||||
variant="contained"
|
||||
disabled={invalid()}
|
||||
onClick={() => {
|
||||
saveGrain()
|
||||
setIsNew(false)
|
||||
}}
|
||||
color="primary">
|
||||
Save Custom Grain
|
||||
</Button>
|
||||
</Box>
|
||||
}
|
||||
</React.Fragment>
|
||||
)
|
||||
}
|
||||
|
||||
const grainAccordion = () => {
|
||||
return (
|
||||
<Accordion>
|
||||
<AccordionSummary expandIcon={<ExpandMore />}>Custom Grain Properties</AccordionSummary>
|
||||
<AccordionDetails>
|
||||
{newGrain()}
|
||||
</AccordionDetails>
|
||||
</Accordion>
|
||||
)
|
||||
}
|
||||
|
||||
return (
|
||||
<React.Fragment>
|
||||
{grainOptions.length === 0 ?
|
||||
<Box>
|
||||
<Typography sx={{marginBottom: 1}}>Custom Grain Properties</Typography>
|
||||
{newGrain()}
|
||||
</Box>
|
||||
:
|
||||
<Box>
|
||||
<Box sx={{marginBottom: 2}}>
|
||||
<SearchSelect
|
||||
label="My Grains"
|
||||
selected={selectedOption}
|
||||
changeSelection={option => {
|
||||
setIsNew(false)
|
||||
setSelectedOption(option)
|
||||
//when an option is selected set all of the state variables controlling the form entries
|
||||
let grain = grainMap.get(option?.value)
|
||||
if(grain && grain.settings){
|
||||
//set the form values
|
||||
setName(grain.name)
|
||||
setGroup(grain.settings.group)
|
||||
setEquation(grain.settings.equation)
|
||||
setConstantA(grain.settings.a.toString())
|
||||
setConstantB(grain.settings.b.toString())
|
||||
setConstantC(grain.settings.c.toString())
|
||||
setKgPerBushel(grain.settings.kgPerBushel.toString())
|
||||
setBushelsPerTonne(grain.settings.bushelsPerTonne.toString())
|
||||
//the the new grain settings object
|
||||
setNewGrainSettings(grain.settings)
|
||||
//pass that settings object back up
|
||||
settingsChanged(grain.settings)
|
||||
}
|
||||
}}
|
||||
group
|
||||
options={grainOptions}
|
||||
/>
|
||||
</Box>
|
||||
{grainAccordion()}
|
||||
</Box>
|
||||
|
||||
}
|
||||
{grainForm()}
|
||||
</React.Fragment>
|
||||
)
|
||||
}
|
||||
155
src/grain/CustomGrainSelector.tsx
Normal file
155
src/grain/CustomGrainSelector.tsx
Normal file
|
|
@ -0,0 +1,155 @@
|
|||
import { ExpandMore } from "@mui/icons-material"
|
||||
import { Accordion, AccordionDetails, AccordionSummary, Box, Button, Typography } from "@mui/material"
|
||||
import SearchSelect, { Option } from "common/SearchSelect"
|
||||
import { pond } from "protobuf-ts/pond"
|
||||
import { useGlobalState } from "providers"
|
||||
import { useGrainAPI } from "providers/pond/grainAPI"
|
||||
import React, { useEffect, useState } from "react"
|
||||
import CustomGrainForm from "./CustomGrainForm"
|
||||
|
||||
interface Props {
|
||||
initialGrain?: pond.GrainSettings
|
||||
onGrainSettingsChange: (settings: pond.GrainSettings) => void
|
||||
}
|
||||
|
||||
export default function CustomGrainSelector(props: Props) {
|
||||
const {initialGrain, onGrainSettingsChange} = props
|
||||
const grainAPI = useGrainAPI()
|
||||
const [{as}] = useGlobalState()
|
||||
const [newGrainSettings, setNewGrainSettings] = useState(initialGrain ?? pond.GrainSettings.create())
|
||||
const [formValid, setFormValid] = useState(true)
|
||||
const [grainMap, setGrainMap] = useState<Map<string, pond.GrainObject>>(
|
||||
initialGrain ?
|
||||
new Map([
|
||||
["Active", pond.GrainObject.create({key: "Active", name: initialGrain.name, settings: initialGrain})]
|
||||
])
|
||||
:
|
||||
new Map())
|
||||
const [grainOptions, setGrainOptions] = useState<Option[]>(
|
||||
initialGrain ?
|
||||
[
|
||||
{
|
||||
label: initialGrain.name,
|
||||
value: "Active",
|
||||
group: "Active"
|
||||
}
|
||||
]
|
||||
:
|
||||
[]
|
||||
)
|
||||
const [isNew, setIsNew] = useState(false)
|
||||
const [selectedOption, setSelectedOption] = useState<Option | null>(initialGrain ? {
|
||||
label: initialGrain.name,
|
||||
value: "Active",
|
||||
group: "Active"
|
||||
} : null)
|
||||
|
||||
useEffect(()=>{
|
||||
grainAPI.listGrains(0, 0, "asc", "name", undefined, undefined, undefined, as).then(resp => {
|
||||
let options: Option[] = grainOptions
|
||||
let map: Map<string, pond.GrainObject> = grainMap
|
||||
if (resp.data.grains){
|
||||
resp.data.grains.forEach(grain => {
|
||||
map.set(grain.key, grain)
|
||||
options.push({
|
||||
label: grain.name,
|
||||
value: grain.key,
|
||||
group: grain.settings?.group,
|
||||
})
|
||||
})
|
||||
}
|
||||
setGrainOptions([...options])
|
||||
setGrainMap(map)
|
||||
})
|
||||
},[grainAPI])
|
||||
|
||||
const saveGrain = () => {
|
||||
// console.log(newGrainSettings)
|
||||
grainAPI.addGrain(newGrainSettings, as).then(resp => {
|
||||
console.log("grain added")
|
||||
}).catch(err => {
|
||||
console.log("err")
|
||||
})
|
||||
}
|
||||
|
||||
const settingsChanged = (newSettings: pond.GrainSettings, formValid: boolean) => {
|
||||
setNewGrainSettings(newSettings)
|
||||
setIsNew(true)
|
||||
setFormValid(formValid)
|
||||
onGrainSettingsChange(newSettings)
|
||||
}
|
||||
|
||||
const grainAccordion = () => {
|
||||
return (
|
||||
<Accordion>
|
||||
<AccordionSummary expandIcon={<ExpandMore />}>Custom Grain Properties</AccordionSummary>
|
||||
<AccordionDetails>
|
||||
<CustomGrainForm grainSettings={newGrainSettings} onGrainSettingsChange={settingsChanged}/>
|
||||
{isNew &&
|
||||
<Box display='flex' justifyContent="flex-end">
|
||||
<Button
|
||||
variant="contained"
|
||||
disabled={!formValid}
|
||||
onClick={() => {
|
||||
setIsNew(false)
|
||||
saveGrain()
|
||||
}}
|
||||
color="primary">
|
||||
Save Custom Grain
|
||||
</Button>
|
||||
</Box>
|
||||
}
|
||||
</AccordionDetails>
|
||||
</Accordion>
|
||||
)
|
||||
}
|
||||
|
||||
return (
|
||||
<React.Fragment>
|
||||
{grainOptions.length === 0 ?
|
||||
<Box>
|
||||
<Typography sx={{marginBottom: 1}}>Custom Grain Properties</Typography>
|
||||
<CustomGrainForm grainSettings={newGrainSettings} onGrainSettingsChange={settingsChanged}/>
|
||||
{isNew &&
|
||||
<Box display='flex' justifyContent="flex-end">
|
||||
<Button
|
||||
variant="contained"
|
||||
disabled={!formValid}
|
||||
onClick={() => {
|
||||
setIsNew(false)
|
||||
}}
|
||||
color="primary">
|
||||
Save Custom Grain
|
||||
</Button>
|
||||
</Box>
|
||||
}
|
||||
</Box>
|
||||
:
|
||||
<Box>
|
||||
<Box sx={{marginBottom: 2}}>
|
||||
<SearchSelect
|
||||
label="My Grains"
|
||||
selected={selectedOption}
|
||||
changeSelection={option => {
|
||||
setIsNew(false)
|
||||
setSelectedOption(option)
|
||||
//when an option is selected set all of the state variables controlling the form entries
|
||||
let grain = grainMap.get(option?.value)
|
||||
if(grain && grain.settings){
|
||||
//the the new grain settings object
|
||||
setNewGrainSettings(grain.settings)
|
||||
//pass that settings object back up
|
||||
settingsChanged(grain.settings, true)
|
||||
}
|
||||
}}
|
||||
group
|
||||
options={grainOptions}
|
||||
/>
|
||||
</Box>
|
||||
{grainAccordion()}
|
||||
</Box>
|
||||
|
||||
}
|
||||
</React.Fragment>
|
||||
)
|
||||
}
|
||||
|
|
@ -14,11 +14,12 @@ import WheatImg from "assets/grain/wheat.jpg";
|
|||
import { Option } from "common/SearchSelect";
|
||||
import { cloneDeep } from "lodash";
|
||||
import { pond } from "protobuf-ts/pond";
|
||||
import { Equation } from "./GrainMoisture";
|
||||
|
||||
export interface GrainExtension {
|
||||
name: string;
|
||||
group: string;
|
||||
equation: pond.MoistureEquation;
|
||||
equation: Equation;
|
||||
a: number;
|
||||
b: number;
|
||||
c: number;
|
||||
|
|
@ -36,7 +37,7 @@ const defaultSetTemp = 30.0;
|
|||
const defaultGrain: GrainExtension = {
|
||||
name: "None",
|
||||
group: "",
|
||||
equation: pond.MoistureEquation.MOISTURE_EQUATION_NONE,
|
||||
equation: Equation.none,
|
||||
a: 0,
|
||||
b: 0,
|
||||
c: 0,
|
||||
|
|
@ -55,7 +56,7 @@ export const GrainExtensions: Map<pond.Grain, GrainExtension> = new Map([
|
|||
{
|
||||
name: "Custom Type",
|
||||
group: "",
|
||||
equation: pond.MoistureEquation.MOISTURE_EQUATION_NONE,
|
||||
equation: Equation.none,
|
||||
a: 0,
|
||||
b: 0,
|
||||
c: 0,
|
||||
|
|
@ -71,7 +72,7 @@ export const GrainExtensions: Map<pond.Grain, GrainExtension> = new Map([
|
|||
{
|
||||
name: "Barley",
|
||||
group: "Barley",
|
||||
equation: pond.MoistureEquation.MOISTURE_EQUATION_CHUNG_PFOST,
|
||||
equation: Equation.chungPfost,
|
||||
a: 475.12,
|
||||
b: 0.14843,
|
||||
c: 71.996,
|
||||
|
|
@ -88,7 +89,7 @@ export const GrainExtensions: Map<pond.Grain, GrainExtension> = new Map([
|
|||
{
|
||||
name: "Buckwheat",
|
||||
group: "Buckwheat",
|
||||
equation: pond.MoistureEquation.MOISTURE_EQUATION_CHUNG_PFOST,
|
||||
equation: Equation.chungPfost,
|
||||
a: 103540000,
|
||||
b: 0.1646,
|
||||
c: 15853000,
|
||||
|
|
@ -105,7 +106,7 @@ export const GrainExtensions: Map<pond.Grain, GrainExtension> = new Map([
|
|||
{
|
||||
name: "Canola",
|
||||
group: "Canola",
|
||||
equation: pond.MoistureEquation.MOISTURE_EQUATION_HALSEY,
|
||||
equation: Equation.halsey,
|
||||
a: 3.489,
|
||||
b: -0.010553,
|
||||
c: 1.86,
|
||||
|
|
@ -123,7 +124,7 @@ export const GrainExtensions: Map<pond.Grain, GrainExtension> = new Map([
|
|||
{
|
||||
name: "Rapeseed",
|
||||
group: "Canola",
|
||||
equation: pond.MoistureEquation.MOISTURE_EQUATION_HALSEY,
|
||||
equation: Equation.halsey,
|
||||
a: 3.0026,
|
||||
b: -0.0048967,
|
||||
c: 1.7607,
|
||||
|
|
@ -140,7 +141,7 @@ export const GrainExtensions: Map<pond.Grain, GrainExtension> = new Map([
|
|||
{
|
||||
name: "Corn (Henderson)",
|
||||
group: "Corn",
|
||||
equation: pond.MoistureEquation.MOISTURE_EQUATION_HENDERSON,
|
||||
equation: Equation.henderson,
|
||||
a: 0.000066612,
|
||||
b: 1.9677,
|
||||
c: 42.143,
|
||||
|
|
@ -157,7 +158,7 @@ export const GrainExtensions: Map<pond.Grain, GrainExtension> = new Map([
|
|||
{
|
||||
name: "Corn (Chung-Pfost)",
|
||||
group: "Corn",
|
||||
equation: pond.MoistureEquation.MOISTURE_EQUATION_CHUNG_PFOST,
|
||||
equation: Equation.chungPfost,
|
||||
a: 374.34,
|
||||
b: 0.18662,
|
||||
c: 31.696,
|
||||
|
|
@ -174,7 +175,7 @@ export const GrainExtensions: Map<pond.Grain, GrainExtension> = new Map([
|
|||
{
|
||||
name: "Corn (Oswin)",
|
||||
group: "Corn",
|
||||
equation: pond.MoistureEquation.MOISTURE_EQUATION_OSWIN,
|
||||
equation: Equation.oswin,
|
||||
a: 15.303,
|
||||
b: -0.10164,
|
||||
c: 3.0358,
|
||||
|
|
@ -191,7 +192,7 @@ export const GrainExtensions: Map<pond.Grain, GrainExtension> = new Map([
|
|||
{
|
||||
name: "Maize White",
|
||||
group: "Corn",
|
||||
equation: pond.MoistureEquation.MOISTURE_EQUATION_HENDERSON,
|
||||
equation: Equation.henderson,
|
||||
a: 0.000066612,
|
||||
b: 1.9677,
|
||||
c: 70.143,
|
||||
|
|
@ -208,7 +209,7 @@ export const GrainExtensions: Map<pond.Grain, GrainExtension> = new Map([
|
|||
{
|
||||
name: "Maize Yellow",
|
||||
group: "Corn",
|
||||
equation: pond.MoistureEquation.MOISTURE_EQUATION_HENDERSON,
|
||||
equation: Equation.henderson,
|
||||
a: 0.000066612,
|
||||
b: 1.9677,
|
||||
c: 65.143,
|
||||
|
|
@ -225,7 +226,7 @@ export const GrainExtensions: Map<pond.Grain, GrainExtension> = new Map([
|
|||
{
|
||||
name: "Oats (Henderson)",
|
||||
group: "Oats",
|
||||
equation: pond.MoistureEquation.MOISTURE_EQUATION_HENDERSON,
|
||||
equation: Equation.henderson,
|
||||
a: 0.000085511,
|
||||
b: 2.0087,
|
||||
c: 37.811,
|
||||
|
|
@ -242,7 +243,7 @@ export const GrainExtensions: Map<pond.Grain, GrainExtension> = new Map([
|
|||
{
|
||||
name: "Oats (Chung-Pfost)",
|
||||
group: "Oats",
|
||||
equation: pond.MoistureEquation.MOISTURE_EQUATION_CHUNG_PFOST,
|
||||
equation: Equation.chungPfost,
|
||||
a: 442.85,
|
||||
b: 0.21228,
|
||||
c: 35.803,
|
||||
|
|
@ -259,7 +260,7 @@ export const GrainExtensions: Map<pond.Grain, GrainExtension> = new Map([
|
|||
{
|
||||
name: "Oats (Oswin)",
|
||||
group: "Oats",
|
||||
equation: pond.MoistureEquation.MOISTURE_EQUATION_OSWIN,
|
||||
equation: Equation.oswin,
|
||||
a: 12.412,
|
||||
b: -0.060707,
|
||||
c: 2.9397,
|
||||
|
|
@ -276,7 +277,7 @@ export const GrainExtensions: Map<pond.Grain, GrainExtension> = new Map([
|
|||
{
|
||||
name: "Peanuts",
|
||||
group: "Peanuts",
|
||||
equation: pond.MoistureEquation.MOISTURE_EQUATION_OSWIN,
|
||||
equation: Equation.oswin,
|
||||
a: 8.6588,
|
||||
b: -0.057904,
|
||||
c: 2.6204,
|
||||
|
|
@ -293,7 +294,7 @@ export const GrainExtensions: Map<pond.Grain, GrainExtension> = new Map([
|
|||
{
|
||||
name: "Long Grain Rice",
|
||||
group: "Rice",
|
||||
equation: pond.MoistureEquation.MOISTURE_EQUATION_HENDERSON,
|
||||
equation: Equation.henderson,
|
||||
a: 0.000041276,
|
||||
b: 2.1191,
|
||||
c: 49.828,
|
||||
|
|
@ -310,7 +311,7 @@ export const GrainExtensions: Map<pond.Grain, GrainExtension> = new Map([
|
|||
{
|
||||
name: "Medium Grain Rice",
|
||||
group: "Rice",
|
||||
equation: pond.MoistureEquation.MOISTURE_EQUATION_HENDERSON,
|
||||
equation: Equation.henderson,
|
||||
a: 0.000035502,
|
||||
b: 2.31,
|
||||
c: 27.396,
|
||||
|
|
@ -327,7 +328,7 @@ export const GrainExtensions: Map<pond.Grain, GrainExtension> = new Map([
|
|||
{
|
||||
name: "Short Grain Rice",
|
||||
group: "Rice",
|
||||
equation: pond.MoistureEquation.MOISTURE_EQUATION_HENDERSON,
|
||||
equation: Equation.henderson,
|
||||
a: 0.000048524,
|
||||
b: 2.0794,
|
||||
c: 45.646,
|
||||
|
|
@ -344,7 +345,7 @@ export const GrainExtensions: Map<pond.Grain, GrainExtension> = new Map([
|
|||
{
|
||||
name: "Sorghum",
|
||||
group: "Sorghum",
|
||||
equation: pond.MoistureEquation.MOISTURE_EQUATION_CHUNG_PFOST,
|
||||
equation: Equation.chungPfost,
|
||||
a: 797.33,
|
||||
b: 0.18159,
|
||||
c: 52.238,
|
||||
|
|
@ -361,8 +362,7 @@ export const GrainExtensions: Map<pond.Grain, GrainExtension> = new Map([
|
|||
{
|
||||
name: "Soybeans",
|
||||
group: "Soybeans",
|
||||
//equation: Equation.chungPfost,
|
||||
equation: pond.MoistureEquation.MOISTURE_EQUATION_CHUNG_PFOST,
|
||||
equation: Equation.chungPfost,
|
||||
a: 228.2,
|
||||
b: 0.2072,
|
||||
c: 30,
|
||||
|
|
@ -379,7 +379,7 @@ export const GrainExtensions: Map<pond.Grain, GrainExtension> = new Map([
|
|||
{
|
||||
name: "Sunflower",
|
||||
group: "Sunflower",
|
||||
equation: pond.MoistureEquation.MOISTURE_EQUATION_HENDERSON,
|
||||
equation: Equation.henderson,
|
||||
a: 0.00031,
|
||||
b: 1.7459,
|
||||
c: 66.603,
|
||||
|
|
@ -396,7 +396,7 @@ export const GrainExtensions: Map<pond.Grain, GrainExtension> = new Map([
|
|||
{
|
||||
name: "Durum Wheat",
|
||||
group: "Wheat",
|
||||
equation: pond.MoistureEquation.MOISTURE_EQUATION_OSWIN,
|
||||
equation: Equation.oswin,
|
||||
a: 13.101,
|
||||
b: -0.052626,
|
||||
c: 2.9987,
|
||||
|
|
@ -413,8 +413,7 @@ export const GrainExtensions: Map<pond.Grain, GrainExtension> = new Map([
|
|||
{
|
||||
name: "Hard Red Wheat",
|
||||
group: "Wheat",
|
||||
//equation: Equation.chungPfost,
|
||||
equation: pond.MoistureEquation.MOISTURE_EQUATION_CHUNG_PFOST,
|
||||
equation: Equation.chungPfost,
|
||||
a: 610.34,
|
||||
b: 0.15526,
|
||||
c: 93.213,
|
||||
|
|
@ -431,8 +430,7 @@ export const GrainExtensions: Map<pond.Grain, GrainExtension> = new Map([
|
|||
{
|
||||
name: "Wheat SAWOS",
|
||||
group: "Wheat",
|
||||
//equation: Equation.chungPfost,
|
||||
equation: pond.MoistureEquation.MOISTURE_EQUATION_CHUNG_PFOST,
|
||||
equation: Equation.chungPfost,
|
||||
a: 610.34,
|
||||
b: 0.15526,
|
||||
c: 93.213,
|
||||
|
|
@ -449,7 +447,7 @@ export const GrainExtensions: Map<pond.Grain, GrainExtension> = new Map([
|
|||
{
|
||||
name: "Un-retted Flax",
|
||||
group: "Flax",
|
||||
equation: pond.MoistureEquation.MOISTURE_EQUATION_HALSEY,
|
||||
equation: Equation.halsey,
|
||||
a: 5.11,
|
||||
b: Math.pow(-8.46 * 10, -3),
|
||||
c: 2.26,
|
||||
|
|
@ -466,7 +464,7 @@ export const GrainExtensions: Map<pond.Grain, GrainExtension> = new Map([
|
|||
{
|
||||
name: "Dew-retted Flax",
|
||||
group: "Flax",
|
||||
equation: pond.MoistureEquation.MOISTURE_EQUATION_OSWIN,
|
||||
equation: Equation.oswin,
|
||||
a: 6.5,
|
||||
b: Math.pow(-1.68 * 10, -2),
|
||||
c: 3.2,
|
||||
|
|
@ -483,7 +481,7 @@ export const GrainExtensions: Map<pond.Grain, GrainExtension> = new Map([
|
|||
{
|
||||
name: "Yellow Peas",
|
||||
group: "Peas",
|
||||
equation: pond.MoistureEquation.MOISTURE_EQUATION_OSWIN,
|
||||
equation: Equation.oswin,
|
||||
a: 14.81,
|
||||
b: -0.109,
|
||||
c: 3.019,
|
||||
|
|
@ -500,7 +498,7 @@ export const GrainExtensions: Map<pond.Grain, GrainExtension> = new Map([
|
|||
{
|
||||
name: "Blaze Lentils",
|
||||
group: "Lentils",
|
||||
equation: pond.MoistureEquation.MOISTURE_EQUATION_HALSEY,
|
||||
equation: Equation.halsey,
|
||||
a: 5.39,
|
||||
b: -0.015,
|
||||
c: 2.273,
|
||||
|
|
@ -517,7 +515,7 @@ export const GrainExtensions: Map<pond.Grain, GrainExtension> = new Map([
|
|||
{
|
||||
name: "Redberry Lentils",
|
||||
group: "Lentils",
|
||||
equation: pond.MoistureEquation.MOISTURE_EQUATION_HALSEY,
|
||||
equation: Equation.halsey,
|
||||
a: 4.749,
|
||||
b: -0.0116,
|
||||
c: 2.066,
|
||||
|
|
@ -534,7 +532,7 @@ export const GrainExtensions: Map<pond.Grain, GrainExtension> = new Map([
|
|||
{
|
||||
name: "Robin Lentils",
|
||||
group: "Lentils",
|
||||
equation: pond.MoistureEquation.MOISTURE_EQUATION_HALSEY,
|
||||
equation: Equation.halsey,
|
||||
a: 5.176,
|
||||
b: -0.0065,
|
||||
c: 2.337,
|
||||
|
|
@ -551,7 +549,7 @@ export const GrainExtensions: Map<pond.Grain, GrainExtension> = new Map([
|
|||
{
|
||||
name: "Dry Beans Red",
|
||||
group: "Dry Beans",
|
||||
equation: pond.MoistureEquation.MOISTURE_EQUATION_HALSEY,
|
||||
equation: Equation.halsey,
|
||||
a: 4.2669,
|
||||
b: -0.013382,
|
||||
c: 1.6933,
|
||||
|
|
@ -566,7 +564,7 @@ export const GrainExtensions: Map<pond.Grain, GrainExtension> = new Map([
|
|||
{
|
||||
name: "Dry Beans Black",
|
||||
group: "Dry Beans",
|
||||
equation: pond.MoistureEquation.MOISTURE_EQUATION_HALSEY,
|
||||
equation: Equation.halsey,
|
||||
a: 5.2003,
|
||||
b: -0.022685,
|
||||
c: 1.9656,
|
||||
|
|
@ -581,7 +579,7 @@ export const GrainExtensions: Map<pond.Grain, GrainExtension> = new Map([
|
|||
{
|
||||
name: "Rye (Henderson)",
|
||||
group: "Rye",
|
||||
equation: pond.MoistureEquation.MOISTURE_EQUATION_HENDERSON,
|
||||
equation: Equation.henderson,
|
||||
a: 0.00006343,
|
||||
b: 2.2060,
|
||||
c: 13.1810,
|
||||
|
|
@ -596,8 +594,7 @@ export const GrainExtensions: Map<pond.Grain, GrainExtension> = new Map([
|
|||
{
|
||||
name: "Rye (Chung-Pfost)",
|
||||
group: "Rye",
|
||||
//equation: Equation.chungPfost,
|
||||
equation: pond.MoistureEquation.MOISTURE_EQUATION_CHUNG_PFOST,
|
||||
equation: Equation.chungPfost,
|
||||
a: 461.0230,
|
||||
b: 0.1840,
|
||||
c: 36.7410,
|
||||
|
|
@ -612,7 +609,7 @@ export const GrainExtensions: Map<pond.Grain, GrainExtension> = new Map([
|
|||
{
|
||||
name: "Rye (Halsey)",
|
||||
group: "Rye",
|
||||
equation: pond.MoistureEquation.MOISTURE_EQUATION_HALSEY,
|
||||
equation: Equation.halsey,
|
||||
a: 4.2970,
|
||||
b: 0.380,
|
||||
c: 2.2710,
|
||||
|
|
@ -627,7 +624,7 @@ export const GrainExtensions: Map<pond.Grain, GrainExtension> = new Map([
|
|||
{
|
||||
name: "Rye (Oswin)",
|
||||
group: "Rye",
|
||||
equation: pond.MoistureEquation.MOISTURE_EQUATION_OSWIN,
|
||||
equation: Equation.oswin,
|
||||
a: 11.8870,
|
||||
b: 0.0210,
|
||||
c: 3.2620,
|
||||
|
|
@ -644,6 +641,16 @@ export function GetGrainExtensionMap(): Map<pond.Grain, GrainExtension> {
|
|||
return cloneDeep(GrainExtensions);
|
||||
}
|
||||
|
||||
export function GetValidGrainExtensions(): GrainExtension[] {
|
||||
let validGrains: GrainExtension[] = []
|
||||
GrainExtensions.forEach((ext, key) => {
|
||||
if(key !== pond.Grain.GRAIN_NONE && key !== pond.Grain.GRAIN_INVALID && key !== pond.Grain.GRAIN_CUSTOM){
|
||||
validGrains.push(ext)
|
||||
}
|
||||
})
|
||||
return validGrains
|
||||
}
|
||||
|
||||
export default function GrainDescriber(type: pond.Grain): GrainExtension {
|
||||
let describer = GrainExtensions.get(type);
|
||||
//console.log(describer)
|
||||
|
|
|
|||
|
|
@ -14,8 +14,8 @@ import {
|
|||
import FileUploader from "common/FileUploads/FileUploader";
|
||||
import ResponsiveDialog from "common/ResponsiveDialog";
|
||||
import SearchSelect, { Option } from "common/SearchSelect";
|
||||
import { useMobile } from "hooks";
|
||||
import { Bin, Field, Contract, GrainBag } from "models";
|
||||
import { useMobile, useUserAPI } from "hooks";
|
||||
import { Bin, Field, Contract, GrainBag, teamScope } from "models";
|
||||
// import { Contract } from "models/Contract";
|
||||
// import { GrainBag } from "models/GrainBag";
|
||||
import moment from "moment";
|
||||
|
|
@ -66,7 +66,7 @@ export default function GrainTransaction(props: Props) {
|
|||
const binAPI = useBinAPI();
|
||||
const grainBagAPI = useGrainBagAPI();
|
||||
const fieldAPI = useFieldAPI();
|
||||
const [{ as }] = useGlobalState();
|
||||
const [{ as, user }] = useGlobalState();
|
||||
const { openSnack } = useSnackbar();
|
||||
const [grainChangeDialog, setGrainChangeDialog] = useState(false);
|
||||
const [grainEntry, setGrainEntry] = useState("0");
|
||||
|
|
@ -79,6 +79,8 @@ export default function GrainTransaction(props: Props) {
|
|||
const [fieldsLoading, setFieldsLoading] = useState(false);
|
||||
const [uploadingFile, setUploadingFile] = useState(false);
|
||||
const [imageIDs, setImageIDs] = useState<string[]>([]);
|
||||
const userAPI = useUserAPI();
|
||||
const [filePermission, setFilePermission] = useState(false);
|
||||
|
||||
const closeDialogs = (confirmed: boolean, newTransaction?: pond.Transaction) => {
|
||||
close();
|
||||
|
|
@ -91,6 +93,20 @@ export default function GrainTransaction(props: Props) {
|
|||
}
|
||||
};
|
||||
|
||||
useEffect(()=>{
|
||||
//if they are viewing as a team make sure they have file permission to the team for the transactions
|
||||
if(as){
|
||||
let scope = teamScope(as)
|
||||
userAPI.getUser(user.id(), scope).then(resp => {
|
||||
setFilePermission(resp.permissions.includes(pond.Permission.PERMISSION_FILE_MANAGEMENT))
|
||||
});
|
||||
}else{
|
||||
//if they are not viewing as a team and they were able to open this window, they have edit permission to at least the one object they started the change with
|
||||
//a transaction is a new object that permissions will not exist for yet so just allow them to do it
|
||||
setFilePermission(true)
|
||||
}
|
||||
},[as])
|
||||
|
||||
//get the possible destinations/options (grainbags and bins)
|
||||
useEffect(() => {
|
||||
if (open) {
|
||||
|
|
@ -527,6 +543,7 @@ export default function GrainTransaction(props: Props) {
|
|||
<Box marginTop={1}>
|
||||
{allowAttachmentUploads && (
|
||||
<FileUploader
|
||||
hasFilePermission={filePermission}
|
||||
uploadEnd={fileID => {
|
||||
if (fileID) {
|
||||
let ids = imageIDs;
|
||||
|
|
|
|||
|
|
@ -161,6 +161,7 @@ export default function HarvestPlanActions(props: Props) {
|
|||
update={updatePlan}
|
||||
open={openState.settings}
|
||||
plan={plan.key() !== "" ? plan : undefined}
|
||||
permissions={permissions}
|
||||
close={(refresh, updatedPlan) => {
|
||||
setOpenState({ ...openState, settings: false });
|
||||
if (refresh) {
|
||||
|
|
|
|||
|
|
@ -58,25 +58,25 @@ export default function HarvestPlanDisplay(props: Props) {
|
|||
<Grid container direction="column">
|
||||
<Grid className={classes.dark}>
|
||||
<Box style={{ display: "flex", justifyContent: "space-between" }}>
|
||||
<Typography variant="subtitle1">Break Even Yield:</Typography>
|
||||
<Typography variant="subtitle1">Break Even Yield (acre):</Typography>
|
||||
<Typography variant="subtitle1">
|
||||
{(
|
||||
{plan.bushelPrice() !== 0 ? (
|
||||
(plan.totalEquipmentCost() + plan.totalMaterialCost()) /
|
||||
plan.bushelPrice()
|
||||
).toFixed(2)}{" "}
|
||||
).toFixed(2) : 0}{" "}
|
||||
BU
|
||||
</Typography>
|
||||
</Box>
|
||||
</Grid>
|
||||
<Grid className={classes.light}>
|
||||
<Box style={{ display: "flex", justifyContent: "space-between" }}>
|
||||
<Typography variant="subtitle1">Break Even Sales Price</Typography>
|
||||
<Typography variant="subtitle1">Break Even Sales Price (BU):</Typography>
|
||||
<Typography variant="subtitle1">
|
||||
$
|
||||
{(
|
||||
{plan.yieldTarget() !== 0 ? (
|
||||
(plan.totalEquipmentCost() + plan.totalMaterialCost()) /
|
||||
plan.yieldTarget()
|
||||
).toFixed(2)}
|
||||
).toFixed(2) : 0}
|
||||
</Typography>
|
||||
</Box>
|
||||
</Grid>
|
||||
|
|
|
|||
|
|
@ -11,6 +11,7 @@ import { getThemeType } from "theme"
|
|||
|
||||
interface Props {
|
||||
field: Field
|
||||
planSelected: (plan: HarvestPlan) => void
|
||||
}
|
||||
|
||||
const useStyles = makeStyles((theme: Theme) => ({
|
||||
|
|
@ -25,7 +26,7 @@ const useStyles = makeStyles((theme: Theme) => ({
|
|||
}));
|
||||
|
||||
export default function HarvestPlanTable(props: Props){
|
||||
const {field} = props
|
||||
const {field, planSelected} = props
|
||||
const harvestAPI = useHarvestPlanAPI()
|
||||
const [page, setPage] = useState(0)
|
||||
const [pageSize, setPageSize] = useState(10)
|
||||
|
|
@ -114,6 +115,9 @@ export default function HarvestPlanTable(props: Props){
|
|||
title={"Harvest Plans"}
|
||||
resizeable
|
||||
page={page}
|
||||
onRowClick={(row) => {
|
||||
planSelected(row)
|
||||
}}
|
||||
pageSize={pageSize}
|
||||
rows={loadedPlans}
|
||||
total={total}
|
||||
|
|
|
|||
|
|
@ -35,6 +35,7 @@ interface Props {
|
|||
field: Field;
|
||||
update?: boolean;
|
||||
plan?: HarvestPlan;
|
||||
permissions?: pond.Permission[]
|
||||
}
|
||||
|
||||
const cropOptions = [
|
||||
|
|
@ -160,7 +161,7 @@ const useStyles = makeStyles((theme: Theme) => ({
|
|||
const steps = ["Pre-Seeding", "Seeding", "Post-Seeding", "Harvest", "Fall"];
|
||||
|
||||
export default function HarvestSettings(props: Props) {
|
||||
const { open, plan, close, field, update } = props;
|
||||
const { open, plan, close, field, update, permissions } = props;
|
||||
const [{as}] = useGlobalState()
|
||||
const [planKey, setPlanKey] = useState<string>();
|
||||
const [newPlan, setNewPlan] = useState(HarvestPlan.create());
|
||||
|
|
@ -177,6 +178,7 @@ export default function HarvestSettings(props: Props) {
|
|||
const [variety, setVariety] = useState("");
|
||||
const [harvestYear, setHarvestYear] = useState(new Date().getFullYear());
|
||||
const [targetYield, setTargetYield] = useState(0);
|
||||
const [actualYield, setActualYield] = useState(0);
|
||||
const [price, setPrice] = useState("");
|
||||
const [newTaskDialog, setNewTaskDialog] = useState(false);
|
||||
const [type, setType] = useState("");
|
||||
|
|
@ -184,10 +186,16 @@ export default function HarvestSettings(props: Props) {
|
|||
const { openSnack } = useSnackbar();
|
||||
const [deleteOpen, setDeleteOpen] = useState(false);
|
||||
|
||||
|
||||
|
||||
const loadTasks = useCallback(() => {
|
||||
if (planKey) {
|
||||
taskAPI.getMultiTasks([planKey], as).then(resp => {
|
||||
setPlanTasks(resp.data.tasks.map(t => Task.any(t)));
|
||||
if(resp.data.tasks){
|
||||
setPlanTasks(resp.data.tasks.map(t => Task.any(t)));
|
||||
}else{
|
||||
setPlanTasks([])
|
||||
}
|
||||
});
|
||||
}
|
||||
}, [taskAPI, planKey, as]);
|
||||
|
|
@ -197,7 +205,7 @@ export default function HarvestSettings(props: Props) {
|
|||
}, [loadTasks]);
|
||||
|
||||
useEffect(() => {
|
||||
if (!plan || (plan && plan.permissions.includes(pond.Permission.PERMISSION_WRITE))) {
|
||||
if (!plan || (permissions && permissions.includes(pond.Permission.PERMISSION_WRITE))) {
|
||||
setActiveStep(0);
|
||||
} else {
|
||||
setActiveStep(1);
|
||||
|
|
@ -358,6 +366,7 @@ export default function HarvestSettings(props: Props) {
|
|||
tempPlan.settings.grainType = variety;
|
||||
tempPlan.settings.harvestYear = harvestYear;
|
||||
tempPlan.settings.yieldTarget = targetYield;
|
||||
tempPlan.settings.actualYield =
|
||||
tempPlan.settings.bushelPrice = !isNaN(parseFloat(price))
|
||||
? Math.round(parseFloat(price) * 100) / 100
|
||||
: 0;
|
||||
|
|
@ -411,7 +420,7 @@ export default function HarvestSettings(props: Props) {
|
|||
key={0}
|
||||
classes={{ root: classes.tab }}
|
||||
disabled={
|
||||
!planKey || !(plan && plan.permissions.includes(pond.Permission.PERMISSION_WRITE))
|
||||
!planKey || !(permissions && permissions.includes(pond.Permission.PERMISSION_WRITE))
|
||||
}
|
||||
label={"General"}
|
||||
aria-label={"general"}
|
||||
|
|
@ -494,6 +503,16 @@ export default function HarvestSettings(props: Props) {
|
|||
!isNaN(+e.target.value) && setTargetYield(+e.target.value);
|
||||
}}
|
||||
/>
|
||||
<TextField
|
||||
fullWidth
|
||||
margin="normal"
|
||||
type="number"
|
||||
label="Actual Yield per acre"
|
||||
value={actualYield}
|
||||
onChange={e => {
|
||||
!isNaN(+e.target.value) && setActualYield(+e.target.value);
|
||||
}}
|
||||
/>
|
||||
<TextField
|
||||
margin="dense"
|
||||
id="bushPrice"
|
||||
|
|
@ -710,7 +729,7 @@ export default function HarvestSettings(props: Props) {
|
|||
<TaskSettings
|
||||
task={taskToEdit}
|
||||
hasCost
|
||||
costTitle="Material Cost(acres)"
|
||||
costTitle="Material Cost(acre)"
|
||||
secondaryCostTitle="Equipment Cost(acre)"
|
||||
objectKey={planKey}
|
||||
type={type}
|
||||
|
|
|
|||
|
|
@ -134,7 +134,7 @@ export default function FieldDrawer(props: Props) {
|
|||
hPlanAPI
|
||||
.listHarvestPlans(1, 0, "desc", "createDate", field.key(), as)
|
||||
.then(resp => {
|
||||
if (resp.data.harvestPlan.length > 0) {
|
||||
if (resp.data.harvestPlan) {
|
||||
let plan = resp.data.harvestPlan[0];
|
||||
setHPlan(HarvestPlan.any(plan));
|
||||
} else {
|
||||
|
|
|
|||
|
|
@ -176,12 +176,23 @@ export class Device {
|
|||
case pond.DevicePlatform.DEVICE_PLATFORM_V2_WIFI_BLUE:
|
||||
case pond.DevicePlatform.DEVICE_PLATFORM_V2_CELLULAR_BLUE:
|
||||
case pond.DevicePlatform.DEVICE_PLATFORM_V2_ETHERNET_BLUE:
|
||||
max = this.status.firmwareVersion >= "2.1.9" ? 4 : 2;
|
||||
max = this.versionComparison(this.status.firmwareVersion, "2.1.9") ? 4 : 2;
|
||||
}
|
||||
return max
|
||||
}
|
||||
|
||||
private versionComparison(deviceVersion: string, requiredVersion: string): boolean {
|
||||
// Feature explicitly not supported on this platform
|
||||
if (!requiredVersion || requiredVersion === "N/A") {
|
||||
return false;
|
||||
}
|
||||
|
||||
// Device firmware missing / unset
|
||||
if (!deviceVersion || deviceVersion.trim() === "") {
|
||||
return false;
|
||||
}
|
||||
|
||||
//compare the versions
|
||||
const parse = (v: string) => {
|
||||
const [core, pre] = v.split("-");
|
||||
const parts = core.split(".").map(n => parseInt(n, 10));
|
||||
|
|
|
|||
|
|
@ -5,22 +5,24 @@ import { or } from "utils/types";
|
|||
|
||||
export class Gate {
|
||||
public settings: pond.GateSettings = pond.GateSettings.create();
|
||||
public status: pond.GateStatus = pond.GateStatus.create();
|
||||
public name: string = "Gate";
|
||||
public key: string = "";
|
||||
public preferences: any = {};
|
||||
public gateMutations: any = {};
|
||||
public pcaState: pond.PCAState = pond.PCAState.PCA_STATE_UNKNOWN;
|
||||
// public pcaState: pond.PCAState = pond.PCAState.PCA_STATE_UNKNOWN;
|
||||
|
||||
public static create(pb?: pond.Gate): Gate {
|
||||
let my = new Gate();
|
||||
if (pb) {
|
||||
let g = pond.Gate.fromObject(pb);
|
||||
my.settings = pond.GateSettings.fromObject(cloneDeep(or(g.settings, {})));
|
||||
my.status = pond.GateStatus.fromObject(cloneDeep(or(g.status, {})));
|
||||
my.name = g.name;
|
||||
my.key = g.key;
|
||||
my.preferences = g.componentPreferences;
|
||||
my.gateMutations = g.gateMutations;
|
||||
my.pcaState = g.pcaState;
|
||||
// my.pcaState = g.pcaState;
|
||||
}
|
||||
return my;
|
||||
}
|
||||
|
|
@ -77,7 +79,7 @@ export class Gate {
|
|||
}
|
||||
|
||||
public gateMarkerColour(): string {
|
||||
switch (this.pcaState) {
|
||||
switch (this.status.pcaState) {
|
||||
case pond.PCAState.PCA_STATE_OFF:
|
||||
return "grey";
|
||||
case pond.PCAState.PCA_STATE_IN_BOUNDS:
|
||||
|
|
|
|||
|
|
@ -13,7 +13,7 @@ import BinsIcon from "products/Bindapt/BinsIcon";
|
|||
import { useGlobalState } from "providers";
|
||||
import { useCallback, useEffect, useState } from "react";
|
||||
import { useNavigate, useLocation } from "react-router-dom";
|
||||
import { IsAdaptiveAgriculture, isBXT, IsMiVent, IsAdCon, IsOmniAir } from "services/whiteLabel";
|
||||
import { IsAdaptiveAgriculture, isBXT, IsMiVent, IsAdCon, IsOmniAir, IsMiPCA } from "services/whiteLabel";
|
||||
import FieldsIcon from "products/AgIcons/FieldsIcon";
|
||||
import NexusSTIcon from "products/Construction/NexusSTIcon";
|
||||
import OmniAirDeviceIcon from "products/AviationIcons/OmniAirDeviceIcon";
|
||||
|
|
@ -40,6 +40,7 @@ export default function BottomNavigator(props: Props) {
|
|||
const isMiVent = IsMiVent();
|
||||
const isAdCon = IsAdCon();
|
||||
const isOmni = IsOmniAir();
|
||||
const isMiPCA = IsMiPCA();
|
||||
|
||||
const reRoute = useCallback(
|
||||
(path: string) => {
|
||||
|
|
@ -117,14 +118,14 @@ export default function BottomNavigator(props: Props) {
|
|||
value="constructionMap"
|
||||
/>
|
||||
)}
|
||||
{isOmni && (
|
||||
{(isOmni || isMiPCA) && (
|
||||
<BottomNavigationAction
|
||||
label="Map"
|
||||
icon={<AirportMapIcon type={getType()} />}
|
||||
value="aviationMap"
|
||||
/>
|
||||
)}
|
||||
{isOmni && (
|
||||
{(isOmni || isMiPCA) && (
|
||||
<BottomNavigationAction
|
||||
label="Terminals"
|
||||
icon={<PlaneIcon type={getType()} />}
|
||||
|
|
@ -139,7 +140,7 @@ export default function BottomNavigator(props: Props) {
|
|||
<BindaptIcon type={getType()} />
|
||||
) : isAdCon ? (
|
||||
<NexusSTIcon type={getType()} />
|
||||
) : isOmni ? (
|
||||
) : (isOmni || isMiPCA) ? (
|
||||
<OmniAirDeviceIcon type={getType()} />
|
||||
) : (
|
||||
<DevicesIcon />
|
||||
|
|
|
|||
|
|
@ -48,6 +48,7 @@ const JohnDeere = lazy(() => import("pages/JohnDeere"));
|
|||
const CNHi = lazy(() => import("pages/CNHi"));
|
||||
const LibraCart = lazy(() => import("pages/LibraCart"));
|
||||
const FieldPage = lazy(()=>import("pages/Field"));
|
||||
const GrainsPage = lazy(()=>import("pages/Grains"));
|
||||
|
||||
export const appendToUrl = (appendage: number | string) => {
|
||||
const basePath = location.pathname.replace(/\/$/, "");
|
||||
|
|
@ -360,6 +361,7 @@ export default function Router() {
|
|||
{user.hasFeature("libra-cart") &&
|
||||
<Route path="libracart" element={<LibraCart />} />
|
||||
}
|
||||
<Route path="grains" element={<GrainsPage />} />
|
||||
{/* Map routes */}
|
||||
<Route path="visualFarm" element={<FieldMap />} />
|
||||
<Route path="aviationMap" element={<AviationMap />} />
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
import { ChevronRight, Code, Memory, People, Person, SyncAlt, TapAndPlay } from "@mui/icons-material";
|
||||
import { ChevronRight, Code, Grain, Memory, People, Person, SyncAlt, TapAndPlay } from "@mui/icons-material";
|
||||
import ChevronLeft from "@mui/icons-material/ChevronLeft";
|
||||
import {
|
||||
darken,
|
||||
|
|
@ -27,6 +27,7 @@ import {
|
|||
IsAdaptiveAgriculture,
|
||||
// hasTutorialPlaylist,
|
||||
IsAdCon,
|
||||
IsMiPCA,
|
||||
// isBXT,
|
||||
IsMiVent,
|
||||
IsOmniAir,
|
||||
|
|
@ -166,7 +167,8 @@ export default function SideNavigator(props: Props) {
|
|||
const isMiVent = IsMiVent();
|
||||
const isAg = IsAdaptiveAgriculture()
|
||||
const isStreamline = IsStreamline()
|
||||
const isMiPCA = IsOmniAir()
|
||||
const isOmni = IsOmniAir()
|
||||
const isMiPCA = IsMiPCA()
|
||||
const isAdCon = IsAdCon()
|
||||
return (
|
||||
<List className={classes.list} component="nav">
|
||||
|
|
@ -184,7 +186,7 @@ export default function SideNavigator(props: Props) {
|
|||
</ListItemButton>
|
||||
</Tooltip>
|
||||
)}
|
||||
{(isMiPCA || user.hasFeature("admin")) && (
|
||||
{((isOmni || isMiPCA) || user.hasFeature("admin")) && (
|
||||
<Tooltip title="Aviation Map" placement="right">
|
||||
<ListItemButton
|
||||
id="tour-aviation-map"
|
||||
|
|
@ -240,7 +242,7 @@ export default function SideNavigator(props: Props) {
|
|||
</ListItemButton>
|
||||
</Tooltip>
|
||||
)}
|
||||
{(isMiPCA || user.hasFeature("admin")) && (
|
||||
{((isOmni || isMiPCA) || user.hasFeature("admin")) && (
|
||||
<Tooltip title="Terminals" placement="right">
|
||||
<ListItemButton
|
||||
id="tour-terminals"
|
||||
|
|
@ -374,6 +376,20 @@ export default function SideNavigator(props: Props) {
|
|||
</ListItemButton>
|
||||
</Tooltip>
|
||||
)}
|
||||
{(isAg || isStreamline || user.hasFeature("admin")) && (
|
||||
<Tooltip title="Grain Types" placement="right">
|
||||
<ListItemButton
|
||||
id="tour-grain-types"
|
||||
onClick={() => goTo("/grains")}
|
||||
classes={getClasses("/grains")}
|
||||
>
|
||||
<ListItemIcon>
|
||||
<Grain />
|
||||
</ListItemIcon>
|
||||
{open && <ListItemText primary="Grain Types" />}
|
||||
</ListItemButton>
|
||||
</Tooltip>
|
||||
)}
|
||||
|
||||
{(isAdCon || user.hasFeature("admin")) && (
|
||||
<Tooltip title="Jobsites" placement="right">
|
||||
|
|
|
|||
|
|
@ -109,7 +109,7 @@ export default function ObjectHeaterCard(props: Props) {
|
|||
});
|
||||
}
|
||||
}
|
||||
if (heaterData.devices[0]) {
|
||||
if (heaterData.devices && heaterData.devices[0]) {
|
||||
setConnectedDevice(Device.any(heaterData.devices[0].device));
|
||||
heaterData.devices[0].components.forEach(c => {
|
||||
//loop through the components and assign them accordingly
|
||||
|
|
@ -171,7 +171,7 @@ export default function ObjectHeaterCard(props: Props) {
|
|||
|
||||
const goToHeater = () => {
|
||||
//history.push("/objectHeaters/" + heater.key);
|
||||
let path = "/objectHeaters/" + heater.key;
|
||||
let path = "/heaters/" + heater.key;
|
||||
navigate(path, { state: {heater: heater} });
|
||||
};
|
||||
|
||||
|
|
|
|||
|
|
@ -179,7 +179,6 @@ export default function NewObjectInteraction(props: Props){
|
|||
setNewAlertComponentType(quack.ComponentType.COMPONENT_TYPE_INVALID);
|
||||
setConditions([]);
|
||||
setSelectedAlertComponents([]);
|
||||
setValidOptions([])
|
||||
setValidComponents([])
|
||||
setValStrings(["0", "0"]);
|
||||
setNumConditions(0)
|
||||
|
|
|
|||
|
|
@ -40,16 +40,18 @@ export default function Contracts() {
|
|||
.then(resp => {
|
||||
let contracts: Contract[] = [];
|
||||
let contractPermissions: Map<string, pond.Permission[]> = new Map();
|
||||
resp.data.contracts.forEach(contract => {
|
||||
let c = Contract.create(contract);
|
||||
contracts.push(c);
|
||||
let p = pond.EvaluatePermissionsResponse.fromObject(
|
||||
resp.data.contractPermissions[c.key()]
|
||||
);
|
||||
contractPermissions.set(c.key(), p.permissions);
|
||||
});
|
||||
setContracts(contracts);
|
||||
setContractPermissions(contractPermissions);
|
||||
if (resp.data.contracts){
|
||||
resp.data.contracts.forEach(contract => {
|
||||
let c = Contract.create(contract);
|
||||
contracts.push(c);
|
||||
let p = pond.EvaluatePermissionsResponse.fromObject(
|
||||
resp.data.contractPermissions[c.key()]
|
||||
);
|
||||
contractPermissions.set(c.key(), p.permissions);
|
||||
});
|
||||
setContracts(contracts);
|
||||
setContractPermissions(contractPermissions);
|
||||
}
|
||||
setLoading(false);
|
||||
})
|
||||
.catch(err => {});
|
||||
|
|
|
|||
|
|
@ -128,10 +128,9 @@ export default function DevicePage() {
|
|||
interaction.settings.nodeOne > interaction.settings.nodeTwo &&
|
||||
interaction.settings.nodeTwo !== 0
|
||||
) {
|
||||
//flip operator and send negative comparitor to save
|
||||
//flip operator to display what is actually happening
|
||||
interaction.settings.conditions.forEach(condition => {
|
||||
//coming back from the backend as a string for some reason
|
||||
if (condition.comparison.toString() === "RELATIONAL_OPERATOR_GREATER_THAN") {
|
||||
if (condition.comparison === quack.RelationalOperator.RELATIONAL_OPERATOR_GREATER_THAN) {
|
||||
condition.comparison = quack.RelationalOperator.RELATIONAL_OPERATOR_LESS_THAN;
|
||||
} else {
|
||||
condition.comparison = quack.RelationalOperator.RELATIONAL_OPERATOR_GREATER_THAN;
|
||||
|
|
|
|||
|
|
@ -227,7 +227,7 @@ export default function FieldPage() {
|
|||
</Grid2>
|
||||
<Grid2 size={8}>
|
||||
<Card raised>
|
||||
<HarvestPlanTable field={field}/>
|
||||
<HarvestPlanTable field={field} planSelected={(plan) => {setHPlan(plan)}}/>
|
||||
</Card>
|
||||
</Grid2>
|
||||
</Grid2>
|
||||
|
|
@ -276,7 +276,7 @@ export default function FieldPage() {
|
|||
</Card>
|
||||
</Grid2>
|
||||
<Grid2>
|
||||
<HarvestPlanTable field={field}/>
|
||||
<HarvestPlanTable field={field} planSelected={(plan) => {setHPlan(plan)}}/>
|
||||
</Grid2>
|
||||
</Grid2>
|
||||
</TabPanel>
|
||||
|
|
|
|||
|
|
@ -134,7 +134,6 @@ export default function Gate(props: Props) {
|
|||
gateAPI
|
||||
.getGatePageData(id, as)
|
||||
.then(resp => {
|
||||
//console.log(resp.data);
|
||||
let p = new Map<number, pond.GateDeviceType>();
|
||||
Object.keys(resp.data.preferences).forEach(k => {
|
||||
let prefKey = parseInt(k);
|
||||
|
|
@ -192,7 +191,9 @@ export default function Gate(props: Props) {
|
|||
const deviceDrawer = () => {
|
||||
return (
|
||||
<DeviceLinkDrawer
|
||||
deviceTags={["omniair"]}
|
||||
//the mipca tag was not working for some reason so just taking the tags out
|
||||
//and this way we dont have to worry about tagging them when they are provisioned
|
||||
//deviceTags={["omniair", "mipca", "MiPCA", "Mipca"]}
|
||||
devicePrefMap={devPrefs}
|
||||
prefOptions={[
|
||||
<MenuItem
|
||||
|
|
@ -341,16 +342,14 @@ export default function Gate(props: Props) {
|
|||
spacing={2}
|
||||
alignItems="center"
|
||||
alignContent="center">
|
||||
<Grid>
|
||||
<Grid size={12}>
|
||||
<Box display="flex" justifyContent="center" alignItems="center">
|
||||
<Link style={{ height: 50, width: 50 }} />
|
||||
<Typography paddingLeft={2} style={{ fontSize: 25, fontWeight: 650 }}>
|
||||
Connect Device
|
||||
</Typography>
|
||||
</Box>
|
||||
</Grid>
|
||||
<Grid>
|
||||
<Typography style={{ fontSize: 25, fontWeight: 650 }}>
|
||||
Connect Device
|
||||
</Typography>
|
||||
</Grid>
|
||||
<Grid size={12}>
|
||||
Click here to add a device to the gate. To add an additional device to a gate
|
||||
use the "Link Device" icon on the top right side of this page
|
||||
|
|
|
|||
474
src/pages/Grains.tsx
Normal file
474
src/pages/Grains.tsx
Normal file
|
|
@ -0,0 +1,474 @@
|
|||
import { useCallback, useEffect, useState } from "react";
|
||||
import PageContainer from "./PageContainer";
|
||||
import CustomGrainForm from "grain/CustomGrainForm";
|
||||
import { Accordion, AccordionDetails, AccordionSummary, Box, Button, DialogActions, DialogContent, DialogTitle, Divider, Grid2, IconButton, Typography } from "@mui/material";
|
||||
import { pond } from "protobuf-ts/pond";
|
||||
import ButtonGroup from "common/ButtonGroup";
|
||||
import { useMobile, useSnackbar, useUserAPI } from "hooks";
|
||||
import { useGrainAPI } from "providers/pond/grainAPI";
|
||||
import ResponsiveTable from "common/ResponsiveTable";
|
||||
import { GetGrainExtensionMap, GetValidGrainExtensions, GrainExtension } from "grain";
|
||||
import ResponsiveDialog from "common/ResponsiveDialog";
|
||||
import { useGlobalState } from "providers";
|
||||
import { Scope } from "models";
|
||||
import React from "react";
|
||||
import { AddCircle, ExpandMore } from "@mui/icons-material";
|
||||
|
||||
export default function Grains() {
|
||||
const [currentCustomGrain, setCurrentCustomGrain] = useState<pond.GrainSettings>()
|
||||
const [formValid, setFormValid] = useState(false)
|
||||
const [selectedGrain, setSelectedGrain] = useState<pond.GrainObject | undefined>()
|
||||
const [displayCustom, setDisplayCustom] = useState(false)
|
||||
const { openSnack } = useSnackbar()
|
||||
const [tableSize, setTableSize] = useState(10)
|
||||
const [tablePage, setTablePage] = useState(0)
|
||||
const [tableTotal, setTableTotal] = useState(0)
|
||||
const grainAPI = useGrainAPI()
|
||||
const userAPI = useUserAPI()
|
||||
const [{as, user}] = useGlobalState();
|
||||
const [permissions, setPermissions] = useState<pond.Permission[]>([])
|
||||
const [openRemoveConfirmation, setOpenRemoveConfirmation] = useState(false)
|
||||
const [openUpdateConfirmation, setOpenUpdateConfirmation] = useState(false)
|
||||
const [grainObjectTableData, setGrainObjectTableData] = useState<pond.GrainObject[]>([])
|
||||
const [supportedGrainTableData, setSupportedGrainTableData] = useState<GrainExtension[]>([])
|
||||
// const [selectedGrainExtension, setSelectedGrainExtension] = useState<GrainExtension | undefined>()
|
||||
const [accordionKey, setAccordionKey] = useState("allClosed")
|
||||
const [openNewGrainDialog, setOpenNewGrainDialog] = useState(false)
|
||||
const isMobile = useMobile()
|
||||
const extraLoad = 10 //the amount of more to load on the mobile view when load more is clicked
|
||||
|
||||
//function to load the first set of custom grains
|
||||
const loadCustomGrain = useCallback(() => {
|
||||
grainAPI.listGrains(tableSize, tablePage * tableSize, "asc", "name").then(resp => {
|
||||
setGrainObjectTableData(resp.data.grains)
|
||||
setTableTotal(resp.data.total)
|
||||
}).catch(err => {
|
||||
openSnack("There was an issue loading your custom grains")
|
||||
})
|
||||
},[tableSize, tablePage])
|
||||
|
||||
useEffect(() => {
|
||||
//load the custom grains
|
||||
if(displayCustom){
|
||||
loadCustomGrain()
|
||||
}else{
|
||||
let displayedGrains: GrainExtension[] = []
|
||||
let offset = tablePage * tableSize
|
||||
let limit = tableSize
|
||||
let grainList = GetValidGrainExtensions()
|
||||
let sortedGrain = grainList.sort((a, b) => (a.name.toLowerCase() > b.name.toLowerCase() ? 1 : -1))
|
||||
sortedGrain.forEach((ext, i) => {
|
||||
if(i >= offset && displayedGrains.length < limit){
|
||||
displayedGrains.push(ext)
|
||||
}
|
||||
})
|
||||
setSupportedGrainTableData(displayedGrains)
|
||||
setTableTotal(sortedGrain.length)
|
||||
}
|
||||
},[loadCustomGrain, tableSize, tablePage, displayCustom, as])
|
||||
|
||||
useEffect(()=>{
|
||||
//if the user is viewing as a team get their permissions to the team, if they are not then we will get their permission to the grain type individually when a type is selected
|
||||
if(as){
|
||||
userAPI.getUser(user.id(), { key: as, kind: "team" } as Scope).then(resp => {
|
||||
setPermissions(resp.permissions);
|
||||
});
|
||||
}
|
||||
},[as, userAPI])
|
||||
|
||||
const equationName = (enumVal: number) => {
|
||||
switch(enumVal){
|
||||
case pond.MoistureEquation.MOISTURE_EQUATION_CHUNG_PFOST:
|
||||
return "Chung-Pfost"
|
||||
case pond.MoistureEquation.MOISTURE_EQUATION_HALSEY:
|
||||
return "Halsey"
|
||||
case pond.MoistureEquation.MOISTURE_EQUATION_HENDERSON:
|
||||
return "Henderson"
|
||||
case pond.MoistureEquation.MOISTURE_EQUATION_OSWIN:
|
||||
return "Oswin"
|
||||
default:
|
||||
return "None"
|
||||
}
|
||||
}
|
||||
|
||||
//function to update
|
||||
|
||||
//table that will display the custom grains created by the user
|
||||
const grainObjectTable = () => {
|
||||
return (
|
||||
<ResponsiveTable<pond.GrainObject>
|
||||
rows={grainObjectTableData}
|
||||
noDataMessage="No Grain Types Found. Add a new custom grain to see them here"
|
||||
loadMore={() => {
|
||||
setTableSize(tableSize + extraLoad)
|
||||
}}
|
||||
renderMobile={(row) => <Accordion expanded={accordionKey === row.key} onChange={() => {
|
||||
//close it if it is already open
|
||||
if(accordionKey === row.key){
|
||||
setAccordionKey("allClosed")
|
||||
}else{
|
||||
setAccordionKey(row.key)
|
||||
}
|
||||
setCurrentCustomGrain(row.settings ?? pond.GrainSettings.create())
|
||||
}}>
|
||||
<AccordionSummary expandIcon={<ExpandMore />}>{row.name}</AccordionSummary>
|
||||
<AccordionDetails>
|
||||
{customGrainDisplay()}
|
||||
</AccordionDetails>
|
||||
</Accordion>}
|
||||
onRowClick={(grainObj) => {
|
||||
setSelectedGrain(grainObj)
|
||||
setFormValid(true)
|
||||
/** if they are viewin as a team leave the permissions alone, if not then use the users permissions to the grain type,
|
||||
* for the moment grain types are not shareable so this will be unused, but this will cover our bases if we want to implement sharing in the future
|
||||
* */
|
||||
if (!as) {
|
||||
userAPI.getUser(user.id(), { key: grainObj.key, kind: "grain" } as Scope).then(resp => {
|
||||
setPermissions(resp.permissions);
|
||||
});
|
||||
}
|
||||
}}
|
||||
columns={[
|
||||
{
|
||||
title: "Name",
|
||||
render: row => <Box padding={2}>
|
||||
<Typography>
|
||||
{row.name}
|
||||
</Typography>
|
||||
</Box>
|
||||
},
|
||||
{
|
||||
title: "Group",
|
||||
render: row => <Box padding={2}>
|
||||
<Typography>
|
||||
{row.settings?.group}
|
||||
</Typography>
|
||||
</Box>
|
||||
},
|
||||
{
|
||||
title: "Equation",
|
||||
render: row => <Box padding={2}>
|
||||
<Typography>
|
||||
{equationName(row.settings?.equation ?? 0)}
|
||||
</Typography>
|
||||
</Box>
|
||||
}
|
||||
]}
|
||||
page={tablePage}
|
||||
pageSize={tableSize}
|
||||
handleRowsPerPageChange={(e) => {
|
||||
setTableSize(e.target.value)
|
||||
}}
|
||||
setPage={(page) => {
|
||||
setTablePage(page)
|
||||
}}
|
||||
total={tableTotal}
|
||||
/>
|
||||
)
|
||||
}
|
||||
|
||||
//table that will display the grain extensions provided by us
|
||||
const supportedGrainTable = () => {
|
||||
return (
|
||||
<ResponsiveTable<GrainExtension>
|
||||
rows={supportedGrainTableData}
|
||||
page={tablePage}
|
||||
// onRowClick={(ext) => {setSelectedGrainExtension(ext)}}
|
||||
loadMore={() => {
|
||||
setTableSize(tableSize + extraLoad)
|
||||
}}
|
||||
renderMobile={(row) => <Accordion>
|
||||
<AccordionSummary expandIcon={<ExpandMore />}>{row.name}</AccordionSummary>
|
||||
<AccordionDetails>
|
||||
{supportedDisplay(row)}
|
||||
</AccordionDetails>
|
||||
</Accordion>}
|
||||
pageSize={tableSize}
|
||||
columns={[
|
||||
{
|
||||
title: "Name",
|
||||
render: row => <Box padding={2}>
|
||||
<Typography>
|
||||
{row.name}
|
||||
</Typography>
|
||||
</Box>
|
||||
},
|
||||
{
|
||||
title: "Group",
|
||||
render: row => <Box padding={2}>
|
||||
<Typography>
|
||||
{row.group}
|
||||
</Typography>
|
||||
</Box>
|
||||
},
|
||||
{
|
||||
title: "Equation",
|
||||
render: row => <Box padding={2}>
|
||||
<Typography>
|
||||
{equationName(row.equation ?? 0)}
|
||||
</Typography>
|
||||
</Box>
|
||||
},
|
||||
{
|
||||
title: "Kg Per Bushel",
|
||||
render: row => <Box padding={2}>
|
||||
<Typography>
|
||||
{row.weightConversionKg.toFixed(2)}
|
||||
</Typography>
|
||||
</Box>
|
||||
},
|
||||
{
|
||||
title: "Bushels Per Tonne",
|
||||
render: row => <Box padding={2}>
|
||||
<Typography>
|
||||
{row.bushelsPerTonne.toFixed(2)}
|
||||
</Typography>
|
||||
</Box>
|
||||
}
|
||||
]}
|
||||
handleRowsPerPageChange={(e) => {
|
||||
setTableSize(e.target.value)
|
||||
}}
|
||||
setPage={(page) => {
|
||||
setTablePage(page)
|
||||
}}
|
||||
total={tableTotal}
|
||||
/>
|
||||
)
|
||||
}
|
||||
|
||||
//the grain display for supported grain type to show the rest of the data such as what constants are used in the formula
|
||||
const supportedDisplay = (grain?: GrainExtension) => {
|
||||
return (
|
||||
<Box>
|
||||
{grain ?
|
||||
<React.Fragment>
|
||||
<Typography>
|
||||
Info
|
||||
</Typography>
|
||||
<Divider />
|
||||
<Box padding={2}>
|
||||
<Typography>Name: {grain.name}</Typography>
|
||||
<Typography>Group: {grain.group}</Typography>
|
||||
</Box>
|
||||
<Typography>
|
||||
Formula
|
||||
</Typography>
|
||||
<Divider />
|
||||
<Box padding={2}>
|
||||
<Typography>Equation: {equationName(grain.equation)}</Typography>
|
||||
{/* <Typography>Constant A: {grain.a}</Typography>
|
||||
<Typography>Constant B: {grain.b}</Typography>
|
||||
<Typography>Constant C: {grain.c}</Typography> */}
|
||||
</Box>
|
||||
<Typography>
|
||||
Conversions
|
||||
</Typography>
|
||||
<Divider />
|
||||
<Box padding={2}>
|
||||
<Typography>Kg per Bushel: {grain.weightConversionKg.toFixed(2)}</Typography>
|
||||
<Typography>Bushels per Tonne: {grain.bushelsPerTonne.toFixed(2)}</Typography>
|
||||
</Box>
|
||||
</React.Fragment>
|
||||
:
|
||||
<Typography>Select a Grain from the table to view its details</Typography>
|
||||
}
|
||||
</Box>
|
||||
)
|
||||
}
|
||||
|
||||
const updateGrain = () => {
|
||||
if(selectedGrain && currentCustomGrain){
|
||||
grainAPI.updateGrain(selectedGrain.key, currentCustomGrain).then(resp => {
|
||||
openSnack("Grain type updated")
|
||||
}).catch(err => {
|
||||
openSnack("There was an issue updating the selected grain type")
|
||||
}).finally(() => {
|
||||
setOpenUpdateConfirmation(false)
|
||||
loadCustomGrain()
|
||||
})
|
||||
}
|
||||
}
|
||||
const updateGrainConfirmation = () => {
|
||||
return (
|
||||
<ResponsiveDialog open={openUpdateConfirmation} onClose={() => {setOpenUpdateConfirmation(false)}}>
|
||||
<DialogTitle>Update Custom Grain</DialogTitle>
|
||||
<DialogContent>
|
||||
Update existing custom grain type?
|
||||
<br/>
|
||||
Note that updating the grain here will not change any bins or components this type was used for, those will retain the old settings.
|
||||
</DialogContent>
|
||||
<DialogActions>
|
||||
<Button variant="contained" color="primary" onClick={()=>{setOpenUpdateConfirmation(false)}}>Cancel</Button>
|
||||
<Button variant="contained" color="primary" onClick={()=>{updateGrain()}}>Confirm</Button>
|
||||
</DialogActions>
|
||||
</ResponsiveDialog>
|
||||
)
|
||||
}
|
||||
|
||||
//because the form is embedded on desktop this dialog is specifically for mobile view
|
||||
const newGrainDialog = () => {
|
||||
return (
|
||||
<ResponsiveDialog open={openNewGrainDialog} onClose={() => setOpenNewGrainDialog(false)}>
|
||||
<DialogTitle>Add New Grain</DialogTitle>
|
||||
<DialogActions>
|
||||
{customGrainDisplay()}
|
||||
|
||||
</DialogActions>
|
||||
</ResponsiveDialog>
|
||||
)
|
||||
}
|
||||
|
||||
const addNewGrain = () => {
|
||||
if(currentCustomGrain){
|
||||
grainAPI.addGrain(currentCustomGrain).then(resp => {
|
||||
//new grain added
|
||||
openSnack("New grain type added")
|
||||
}).catch(err => {
|
||||
openSnack("There was a problem creating the new grain type")
|
||||
}).finally(() => {
|
||||
loadCustomGrain()
|
||||
setOpenNewGrainDialog(false)//only for the mobile view since the desktop has it embedded
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
const removeGrain = () => {
|
||||
if(selectedGrain){
|
||||
grainAPI.removeGrain(selectedGrain.key).then(resp => {
|
||||
openSnack("Grain type removed")
|
||||
}).catch(err => {
|
||||
openSnack("There was a problem removing the selected grain type")
|
||||
}).finally(() => {
|
||||
setOpenRemoveConfirmation(false)
|
||||
loadCustomGrain()
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
const removeConfirmation = () => {
|
||||
return (
|
||||
<ResponsiveDialog open={openRemoveConfirmation} onClose={() => {setOpenRemoveConfirmation(false)}}>
|
||||
<DialogTitle>Remove Custom Grain</DialogTitle>
|
||||
<DialogContent>
|
||||
Remove custom grain type?
|
||||
<br />
|
||||
Note that removing the grain here will not change any bins or components this type was used for, those will retain the old settings.
|
||||
</DialogContent>
|
||||
<DialogActions>
|
||||
<Button variant="contained" color="primary" onClick={()=>{setOpenRemoveConfirmation(false)}}>Cancel</Button>
|
||||
<Button variant="contained" color="primary" onClick={()=>{removeGrain()}}>Confirm</Button>
|
||||
</DialogActions>
|
||||
</ResponsiveDialog>
|
||||
)
|
||||
}
|
||||
|
||||
const customGrainActions = () => {
|
||||
return (
|
||||
<Box display="flex" justifyContent="space-between">
|
||||
<Box>
|
||||
{selectedGrain &&
|
||||
<Button disabled={!permissions.includes(pond.Permission.PERMISSION_WRITE)} variant="contained" color="error" onClick={() => {setOpenRemoveConfirmation(true)}}>Remove Grain</Button>
|
||||
}
|
||||
</Box>
|
||||
<Box>
|
||||
{selectedGrain &&
|
||||
<Button sx={{marginRight: 1}} onClick={() => setOpenUpdateConfirmation(true)} disabled={!formValid || !permissions.includes(pond.Permission.PERMISSION_WRITE)} variant="contained" color="primary">Update</Button>
|
||||
}
|
||||
{isMobile && !selectedGrain && <Button onClick={() => {setOpenNewGrainDialog(false)}}>Cancel</Button>}
|
||||
<Button onClick={() => addNewGrain()} disabled={!formValid || (as !== "" && !permissions.includes(pond.Permission.PERMISSION_WRITE))} variant="contained" color="primary">Save New</Button>
|
||||
</Box>
|
||||
</Box>
|
||||
)
|
||||
}
|
||||
|
||||
//the grain display for custom grain the user has defined
|
||||
const customGrainDisplay = () => {
|
||||
return (
|
||||
<Box>
|
||||
<CustomGrainForm
|
||||
grainSettings={selectedGrain?.settings || undefined}
|
||||
onGrainSettingsChange={(newSettings, formValid)=>{
|
||||
setCurrentCustomGrain(newSettings)
|
||||
setFormValid(formValid)
|
||||
}}
|
||||
/>
|
||||
{customGrainActions()}
|
||||
</Box>
|
||||
)
|
||||
}
|
||||
|
||||
const desktopView = () => {
|
||||
if(displayCustom){
|
||||
return (
|
||||
<Grid2 container>
|
||||
<Grid2 size={7} padding={2}>
|
||||
{grainObjectTable()}
|
||||
</Grid2>
|
||||
<Grid2 size={5} padding={2}>
|
||||
{customGrainDisplay()}
|
||||
</Grid2>
|
||||
</Grid2>
|
||||
)
|
||||
}else{
|
||||
return (
|
||||
<Box marginTop={2}>
|
||||
{supportedGrainTable()}
|
||||
</Box>
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
const mobileView = () => {
|
||||
return (
|
||||
<Box>
|
||||
{displayCustom ? grainObjectTable() : supportedGrainTable()}
|
||||
</Box>
|
||||
)
|
||||
}
|
||||
|
||||
return (
|
||||
<PageContainer>
|
||||
<Box padding={2}>
|
||||
<Typography variant="h4">
|
||||
Adaptive Grains
|
||||
</Typography>
|
||||
<Box display="flex" marginTop={2} justifyContent="space-between">
|
||||
<ButtonGroup
|
||||
toggle
|
||||
buttons={[
|
||||
{
|
||||
title: "Supported",
|
||||
function: () => {
|
||||
setDisplayCustom(false)
|
||||
setTablePage(0)
|
||||
}
|
||||
},
|
||||
{
|
||||
title: "Custom",
|
||||
function: () => {
|
||||
setDisplayCustom(true)
|
||||
setTablePage(0)
|
||||
}
|
||||
}
|
||||
]}
|
||||
/>
|
||||
{isMobile && displayCustom &&
|
||||
<IconButton sx={{padding: 0}} color="primary" onClick={()=>{
|
||||
setSelectedGrain(undefined)
|
||||
setCurrentCustomGrain(undefined)
|
||||
setOpenNewGrainDialog(true)
|
||||
}}>
|
||||
<AddCircle />
|
||||
</IconButton>
|
||||
}
|
||||
</Box>
|
||||
{!isMobile ? desktopView() : mobileView()}
|
||||
</Box>
|
||||
{updateGrainConfirmation()}
|
||||
{removeConfirmation()}
|
||||
{newGrainDialog()}
|
||||
</PageContainer>
|
||||
)
|
||||
}
|
||||
|
|
@ -9,9 +9,21 @@ const useStyles = makeStyles((theme: Theme) => ({
|
|||
width: "100%",
|
||||
overflowX: "hidden",
|
||||
overflowY: "auto",
|
||||
// height: `calc(100vh - 112px)`,
|
||||
// [theme.breakpoints.up("sm")]: {
|
||||
// height: `calc(100vh - 64px)`
|
||||
// }
|
||||
minHeight: 0,
|
||||
height: `calc(100vh - 112px)`,
|
||||
"@supports (height: 100dvh)": {
|
||||
height: `calc(100dvh - 112px)`
|
||||
},
|
||||
[theme.breakpoints.up("sm")]: {
|
||||
height: `calc(100vh - 64px)`
|
||||
height: `calc(100vh - 64px)`,
|
||||
|
||||
"@supports (height: 100dvh)": {
|
||||
height: `calc(100dvh - 64px)`
|
||||
}
|
||||
}
|
||||
},
|
||||
fullViewportContainer: {
|
||||
|
|
@ -19,6 +31,9 @@ const useStyles = makeStyles((theme: Theme) => ({
|
|||
top: 0,
|
||||
left: 0,
|
||||
height: "100vh",
|
||||
"@supports (height: 100dvh)": {
|
||||
height: "100dvh"
|
||||
},
|
||||
width: "100vw",
|
||||
backgroundColor: theme.palette.background.default,
|
||||
zIndex: 2000,
|
||||
|
|
|
|||
|
|
@ -56,8 +56,8 @@ export default function Site() {
|
|||
siteAPI
|
||||
.getSitePage(siteKey, as)
|
||||
.then(resp => {
|
||||
setSite(ISite.any(resp.data.site));
|
||||
setHeaters(resp.data.heaterData);
|
||||
if(resp.data.site) setSite(ISite.any(resp.data.site));
|
||||
if(resp.data.heaterData) setHeaters(resp.data.heaterData);
|
||||
setLoadingSite(false);
|
||||
})
|
||||
.catch(err => {
|
||||
|
|
|
|||
|
|
@ -182,7 +182,6 @@ export default function Terminals(props: Props) {
|
|||
if(loading) return
|
||||
setLoading(true)
|
||||
terminalAPI.listTerminals(200, 0, "asc", "name", undefined, as).then(resp => {
|
||||
console.log(resp.data)
|
||||
if(resp.data.terminals){
|
||||
setTerminals(resp.data.terminals.map(a => Terminal.any(a)));
|
||||
}
|
||||
|
|
|
|||
|
|
@ -33,13 +33,13 @@ export function Airflow(subtype: number = 0): ComponentTypeExtension {
|
|||
|
||||
let measurementTypes = [
|
||||
{
|
||||
measurementType: quack.MeasurementType.MEASUREMENT_TYPE_PPM,
|
||||
measurementType: quack.MeasurementType.MEASUREMENT_TYPE_CFM,
|
||||
label: cfm.label(),
|
||||
colour: cfm.colour(),
|
||||
graphType: cfm.graph()
|
||||
} as ComponentMeasurement,
|
||||
{
|
||||
measurementType: quack.MeasurementType.MEASUREMENT_TYPE_VOLTAGE,
|
||||
measurementType: quack.MeasurementType.MEASUREMENT_TYPE_SPEED,
|
||||
label: velocity.label(),
|
||||
colour: velocity.colour(),
|
||||
graphType: velocity.graph()
|
||||
|
|
|
|||
|
|
@ -453,7 +453,7 @@ export class MeasurementDescriber {
|
|||
case quack.MeasurementType.MEASUREMENT_TYPE_SPEED:
|
||||
let speedUnit = getDistanceUnit()
|
||||
this.details.label = "Speed";
|
||||
this.details.unit = speedUnit === pond.DistanceUnit.DISTANCE_UNIT_METERS ? "m/s" : "ft/m";
|
||||
this.details.unit = speedUnit === pond.DistanceUnit.DISTANCE_UNIT_METERS ? "m/s" : "ft/m"; //yes this is meters per second and feet per minute
|
||||
this.details.colour = green["500"];
|
||||
this.details.path = "edgeTriggered.rises";
|
||||
this.details.max = 500;
|
||||
|
|
|
|||
|
|
@ -138,6 +138,7 @@ export default function GateProvider(props: PropsWithChildren<Props>) {
|
|||
return new Promise<AxiosResponse<pond.ListGatesResponse>>((resolve, reject) => {
|
||||
get<pond.ListGatesResponse>(url).then(resp => {
|
||||
resp.data = pond.ListGatesResponse.fromObject(resp.data)
|
||||
console.log(resp)
|
||||
return resolve(resp)
|
||||
}).catch(err => {
|
||||
return reject(err)
|
||||
|
|
|
|||
|
|
@ -22,6 +22,7 @@ export interface IGrainInterface {
|
|||
types?: string[],
|
||||
otherTeam?: string,
|
||||
) => Promise<AxiosResponse<pond.ListGrainsResponse>>;
|
||||
updateGrain: (key: string, settings: pond.GrainSettings, otherTeam?: string) => Promise<AxiosResponse<pond.UpdateGrainResponse>>
|
||||
removeGrain: (key: string, otherTeam?: string) => Promise<AxiosResponse<pond.RemoveGrainResponse>>;
|
||||
}
|
||||
|
||||
|
|
@ -31,7 +32,7 @@ interface Props {}
|
|||
|
||||
export default function GrainProvider(props: PropsWithChildren<Props>) {
|
||||
const { children } = props;
|
||||
const { get, del, post } = useHTTP();
|
||||
const { get, del, post, put } = useHTTP();
|
||||
const [{ as }] = useGlobalState();
|
||||
|
||||
//add
|
||||
|
|
@ -79,7 +80,6 @@ export default function GrainProvider(props: PropsWithChildren<Props>) {
|
|||
get<pond.ListGrainsResponse>(
|
||||
pondURL(
|
||||
"/grains?limit=" +
|
||||
"?limit=" +
|
||||
limit +
|
||||
"&offset=" +
|
||||
offset +
|
||||
|
|
@ -98,6 +98,19 @@ export default function GrainProvider(props: PropsWithChildren<Props>) {
|
|||
})
|
||||
})
|
||||
};
|
||||
|
||||
//update
|
||||
const updateGrain = (key: string, settings: pond.GrainSettings, otherTeam?: string) => {
|
||||
const view = otherTeam ? otherTeam : as
|
||||
if (view) {
|
||||
return put<pond.UpdateGrainResponse>(
|
||||
pondURL("/grains/"+ key + "?&as=" + view),
|
||||
settings
|
||||
);
|
||||
}
|
||||
return put<pond.UpdateGrainResponse>(pondURL("/grains/" + key), settings);
|
||||
}
|
||||
|
||||
//remove
|
||||
const removeGrain = (key: string, otherTeam?: string) => {
|
||||
const view = otherTeam ? otherTeam : as
|
||||
|
|
@ -113,6 +126,7 @@ export default function GrainProvider(props: PropsWithChildren<Props>) {
|
|||
addGrain,
|
||||
getGrain,
|
||||
listGrains,
|
||||
updateGrain,
|
||||
removeGrain
|
||||
}}>
|
||||
{children}
|
||||
|
|
|
|||
|
|
@ -36,6 +36,7 @@ export interface IInteractionsAPIContext {
|
|||
alerts: pond.AlertData[],
|
||||
otherTeam?: string
|
||||
) => Promise<AxiosResponse<pond.SetAlertInteractionsResponse>>;
|
||||
clearInteractions: (device: number, sources?: quack.ComponentID[], otherTeam?: string) => Promise<AxiosResponse<pond.ClearInteractionsResponse>>
|
||||
}
|
||||
|
||||
export const InteractionsAPIContext = createContext<IInteractionsAPIContext>(
|
||||
|
|
@ -285,6 +286,25 @@ export default function InteractionProvider(props: PropsWithChildren<Props>) {
|
|||
})
|
||||
};
|
||||
|
||||
const clearInteractions = (device: number, sources?: quack.ComponentID[], otherTeam?: string): Promise<AxiosResponse<pond.ClearInteractionsResponse>> => {
|
||||
const view = otherTeam ? otherTeam : as
|
||||
let sourceArray: string[] = []
|
||||
if (sources){
|
||||
sources.forEach(source => {
|
||||
sourceArray.push(componentIDToString(source))
|
||||
})
|
||||
}
|
||||
let url = pondURL("/devices/"+ device + "/interactions/clear" + (view ? "?as=" + view : "") + (sources ? "&sources=" + sourceArray.toString() : ""))
|
||||
return new Promise<AxiosResponse<pond.ClearInteractionsResponse>>((resolve, reject) => {
|
||||
post<pond.ClearInteractionsResponse>(url).then(resp => {
|
||||
resp.data = pond.ClearInteractionsResponse.fromObject(resp.data)
|
||||
return resolve(resp)
|
||||
}).catch(err => {
|
||||
return reject(err)
|
||||
})
|
||||
})
|
||||
}
|
||||
|
||||
return (
|
||||
<InteractionsAPIContext.Provider
|
||||
value={{
|
||||
|
|
@ -296,7 +316,8 @@ export default function InteractionProvider(props: PropsWithChildren<Props>) {
|
|||
updateInteractionPondSettings,
|
||||
removeInteraction,
|
||||
listInteractionsByDevice,
|
||||
listInteractionsByComponent
|
||||
listInteractionsByComponent,
|
||||
clearInteractions
|
||||
}}>
|
||||
{children}
|
||||
</InteractionsAPIContext.Provider>
|
||||
|
|
|
|||
|
|
@ -10,7 +10,7 @@ import AeroGrowDarkLogo from "../assets/whitelabels/AeroGrow/darkLogo.png";
|
|||
import AeroGrowLightLogo from "../assets/whitelabels/AeroGrow/lightLogo.png";
|
||||
import MiVentLightLogo from "../assets/whitelabels/MiVent/lightLogo.png";
|
||||
// import OmniAirLogo from "../assets/whitelabels/OmniAir/OmniAirLogo.png";
|
||||
import MiPCALogo from "../assets/whitelabels/OmniAir/MiPCALogo.png";
|
||||
import MiPCALogo from "../assets/whitelabels/MiPCA/MiPCALogo.png";
|
||||
import StreamlineLogo from "../assets/whitelabels/Streamline/stream-logo.png"
|
||||
// import { green, yellow } from "@mui/material/colors";
|
||||
|
||||
|
|
@ -284,6 +284,32 @@ export function IsOmniAir(): boolean {
|
|||
);
|
||||
}
|
||||
|
||||
const MIPCA_WHITE_LABEL: WhiteLabel = {
|
||||
name: "MiPCA",
|
||||
primaryColour: "#004f9b",
|
||||
secondaryColour: "yellow",
|
||||
signatureColour: "#272727",
|
||||
signatureAccentColour: "#fff",
|
||||
//omni air and MiPCA are the same client ID in Auth0, it is to replace it, once omniair gets removed we can re-name this
|
||||
auth0ClientId: import.meta.env.VITE_AUTH0_OMNIAIR_CLIENT_ID,
|
||||
redirectOnLogout: true,
|
||||
logoutRedirectTarget: "https://mionetech.com",
|
||||
darkLogo: MiPCALogo,
|
||||
lightLogo: MiPCALogo,
|
||||
transparentLogoBG: true,
|
||||
blacklist: ["cost"],
|
||||
docs: "MiPCA",
|
||||
protips: protips.concat([])
|
||||
};
|
||||
|
||||
export function IsMiPCA(): boolean {
|
||||
return (
|
||||
getName() === "MiPCA" ||
|
||||
window.location.origin.includes("staging") ||
|
||||
window.location.origin.includes("localhost")
|
||||
);
|
||||
}
|
||||
|
||||
const whitelabels = new Map<string, WhiteLabel>([
|
||||
["streamline", STREAMLINE_WHITE_LABEL],
|
||||
["adaptiveag", ADAPTIVE_AGRICULTURE_WHITE_LABEL],
|
||||
|
|
@ -296,7 +322,9 @@ const whitelabels = new Map<string, WhiteLabel>([
|
|||
["10.0", ADAPTIVE_CONSTRUCTION_WHITE_LABEL],
|
||||
["mivent", MIVENT_WHITE_LABEL],
|
||||
["adaptiveconstruction", ADAPTIVE_CONSTRUCTION_WHITE_LABEL],
|
||||
["omniair", OMNIAIR_WHITE_LABEL]
|
||||
["omniair", OMNIAIR_WHITE_LABEL],
|
||||
["mipca", MIPCA_WHITE_LABEL],
|
||||
["mionetech", MIPCA_WHITE_LABEL]
|
||||
]);
|
||||
|
||||
export function getWhitelabel(): WhiteLabel {
|
||||
|
|
@ -309,7 +337,7 @@ export function getWhitelabel(): WhiteLabel {
|
|||
return BXT_WHITE_LABEL;
|
||||
}
|
||||
if (window.location.origin.includes("localhost")) {
|
||||
return STREAMLINE_WHITE_LABEL;
|
||||
return MIPCA_WHITE_LABEL;
|
||||
}
|
||||
if (window.location.origin.includes("staging") || import.meta.env.VITE_LOCAL_STAGING=='true') {
|
||||
return STAGING_WHITELABEL;
|
||||
|
|
|
|||
|
|
@ -20,7 +20,7 @@ import Edit from "@mui/icons-material/Edit";
|
|||
import DeleteIcon from "@mui/icons-material/Delete";
|
||||
import { red } from "@mui/material/colors";
|
||||
import { pond } from "protobuf-ts/pond";
|
||||
import { taskScope } from "models/Scope";
|
||||
import { taskScope, teamScope } from "models/Scope";
|
||||
import EventBlocker from "common/EventBlocker";
|
||||
|
||||
interface Props {
|
||||
|
|
@ -58,19 +58,22 @@ export default function TaskCard(props: Props) {
|
|||
const [day, setDay] = useState(0);
|
||||
const classes = useStyles();
|
||||
const [permissions, setPermissions] = useState<pond.Permission[]>([]);
|
||||
const [{ user }] = useGlobalState();
|
||||
const [{ user, as }] = useGlobalState();
|
||||
const userAPI = useUserAPI();
|
||||
const [menuAnchorEl, setMenuAnchorEl] = useState<Element | null>(null);
|
||||
|
||||
const loadPermissions = useCallback(() => {
|
||||
let scope = taskScope(props.task.key);
|
||||
if(as){//if viewing as a team use the permissions to the team, and not the task itself
|
||||
scope = teamScope(as)
|
||||
}
|
||||
userAPI
|
||||
.getUser(user.id(), scope)
|
||||
.then(resp => {
|
||||
setPermissions(resp.permissions);
|
||||
})
|
||||
.catch(err => {});
|
||||
}, [props.task, userAPI, user]);
|
||||
}, [props.task, userAPI, user, as]);
|
||||
|
||||
useEffect(() => {
|
||||
loadPermissions();
|
||||
|
|
@ -176,3 +179,4 @@ export default function TaskCard(props: Props) {
|
|||
</Card>
|
||||
);
|
||||
}
|
||||
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue