took out the old exclusion stuff from the component types, moved the excluded nodes to the component settings rather than preferences, commented out some deprecated stuff relating to the old measurements
This commit is contained in:
csawatzky
parent
885d308f3b
commit
e586421ffa
39 changed files with 147 additions and 243 deletions
|
|
@ -11,7 +11,7 @@ import {
|
|||
FormControl,
|
||||
FormControlLabel,
|
||||
FormGroup,
|
||||
FormLabel,
|
||||
//FormLabel,
|
||||
Grid2 as Grid,
|
||||
Theme,
|
||||
Typography
|
||||
|
|
@ -20,21 +20,21 @@ import { lightGreen } from "@mui/material/colors";
|
|||
import { ExpandMore } from "@mui/icons-material";
|
||||
import MeasurementsChart from "charts/MeasurementsChart";
|
||||
//import { GraphOrientation } from "common/Graph";
|
||||
import RangeInput, { Range } from "common/RangeInput";
|
||||
//import RangeInput, { Range } from "common/RangeInput";
|
||||
import { GetDefaultDateRange } from "common/time/DateRange";
|
||||
import DateSelect from "common/time/DateSelect";
|
||||
import MeasurementSummary from "component/MeasurementSummary";
|
||||
//import DateSelect from "common/time/DateSelect";
|
||||
//import MeasurementSummary from "component/MeasurementSummary";
|
||||
import { grainName } from "grain";
|
||||
import { useMobile, usePrevious } from "hooks";
|
||||
import { useMobile } from "hooks";
|
||||
import { cloneDeep } from "lodash";
|
||||
import { Component, Interaction } from "models";
|
||||
import { UnitMeasurement } from "models/UnitMeasurement";
|
||||
import moment from "moment";
|
||||
import { deviceComponentID } from "pbHelpers/Component";
|
||||
//import { deviceComponentID } from "pbHelpers/Component";
|
||||
import {
|
||||
extension,
|
||||
//getComponentVisual,
|
||||
GetNumNodes,
|
||||
//GetNumNodes,
|
||||
GetNumNodesFromUnitMeasurement,
|
||||
GraphFilters
|
||||
} from "pbHelpers/ComponentType";
|
||||
|
|
@ -43,9 +43,9 @@ import { findInteractionsAsSource } from "pbHelpers/Interaction";
|
|||
import { describeMeasurement } from "pbHelpers/MeasurementDescriber";
|
||||
import { pond } from "protobuf-ts/pond";
|
||||
import { quack } from "protobuf-ts/quack";
|
||||
import { useGlobalState } from "providers";
|
||||
import React, { useEffect, useState } from "react";
|
||||
import { or } from "utils/types";
|
||||
//import { useGlobalState } from "providers";
|
||||
import React, { useState } from "react";
|
||||
//import { or } from "utils/types";
|
||||
import UnitMeasurementSummary from "./UnitMeasurementSummary";
|
||||
import { makeStyles } from "@mui/styles";
|
||||
|
||||
|
|
@ -82,34 +82,34 @@ interface Props {
|
|||
component: Component;
|
||||
interactions: Interaction[];
|
||||
sampling: boolean;
|
||||
samples?: pond.Measurement[]; //deprecated: old measurement structure
|
||||
//samples?: pond.Measurement[]; //deprecated: old measurement structure
|
||||
unitMeasurements?: UnitMeasurement[];
|
||||
sampleLimit?: number;
|
||||
updateDate?: (startDate: any, endDate: any, live?: boolean) => void;
|
||||
allowLive?: boolean;
|
||||
recentMeasurement?: pond.Measurement;
|
||||
//recentMeasurement?: pond.Measurement;
|
||||
recentUnitMeasurement?: UnitMeasurement[];
|
||||
deviceComponentPreferences?: pond.DeviceComponentPreferences;
|
||||
}
|
||||
|
||||
function setComponentGraphRanges(device: number | string, component: string, ranges: Range[]) {
|
||||
const key: string = "graphRanges-" + deviceComponentID(device, component);
|
||||
localStorage.setItem(key, JSON.stringify(or(ranges, [])));
|
||||
}
|
||||
// function setComponentGraphRanges(device: number | string, component: string, ranges: Range[]) {
|
||||
// const key: string = "graphRanges-" + deviceComponentID(device, component);
|
||||
// localStorage.setItem(key, JSON.stringify(or(ranges, [])));
|
||||
// }
|
||||
|
||||
function getComponentGraphRanges(device: number | string, component: string): Range[] {
|
||||
const key: string = "graphRanges-" + deviceComponentID(device, component);
|
||||
return JSON.parse(or(localStorage.getItem(key), "[]"));
|
||||
}
|
||||
// function getComponentGraphRanges(device: number | string, component: string): Range[] {
|
||||
// const key: string = "graphRanges-" + deviceComponentID(device, component);
|
||||
// return JSON.parse(or(localStorage.getItem(key), "[]"));
|
||||
// }
|
||||
|
||||
export default function ComponentChart(props: Props) {
|
||||
const { component, deviceComponentPreferences } = props;
|
||||
//const { component, deviceComponentPreferences } = props;
|
||||
const classes = useStyles();
|
||||
const isMobile = useMobile();
|
||||
const { deviceKey, componentKey } = props;
|
||||
const prevDevice = usePrevious(props.deviceKey);
|
||||
const prevComponentKey = usePrevious(props.componentKey);
|
||||
const prevComponent = usePrevious(props.component);
|
||||
// const { deviceKey, componentKey } = props;
|
||||
// const prevDevice = usePrevious(props.deviceKey);
|
||||
// const prevComponentKey = usePrevious(props.componentKey);
|
||||
// const prevComponent = usePrevious(props.component);
|
||||
const defaultDateRange = GetDefaultDateRange();
|
||||
const [startDate, setStartDate] = useState(defaultDateRange.start);
|
||||
const [endDate, setEndDate] = useState(defaultDateRange.end);
|
||||
|
|
@ -127,45 +127,45 @@ export default function ComponentChart(props: Props) {
|
|||
const [showOriginal, setShowOriginal] = useState(true);
|
||||
const [showAveraged, setShowAveraged] = useState(false);
|
||||
|
||||
useEffect(() => {
|
||||
if (prevComponent !== props.component) {
|
||||
let updatedFilters = cloneDeep(graphFilters);
|
||||
let filledTo = props.component.settings.grainFilledTo;
|
||||
updatedFilters.grainFilledTo = filledTo > 0 ? filledTo : undefined;
|
||||
updatedFilters.grainType = props.component.settings.grainType;
|
||||
setGraphFilters(updatedFilters);
|
||||
}
|
||||
}, [prevComponent, graphFilters, props.component]);
|
||||
// useEffect(() => {
|
||||
// if (prevComponent !== props.component) {
|
||||
// let updatedFilters = cloneDeep(graphFilters);
|
||||
// let filledTo = props.component.settings.grainFilledTo;
|
||||
// updatedFilters.grainFilledTo = filledTo > 0 ? filledTo : undefined;
|
||||
// updatedFilters.grainType = props.component.settings.grainType;
|
||||
// setGraphFilters(updatedFilters);
|
||||
// }
|
||||
// }, [prevComponent, graphFilters, props.component]);
|
||||
|
||||
useEffect(() => {
|
||||
if (prevDevice !== deviceKey || prevComponentKey !== componentKey) {
|
||||
const ranges = getComponentGraphRanges(deviceKey, componentKey);
|
||||
let updatedFilters = cloneDeep(graphFilters);
|
||||
updatedFilters.ranges = ranges;
|
||||
setGraphFilters(updatedFilters);
|
||||
}
|
||||
}, [deviceKey, prevDevice, prevComponentKey, componentKey, graphFilters]);
|
||||
// useEffect(() => {
|
||||
// if (prevDevice !== deviceKey || prevComponentKey !== componentKey) {
|
||||
// const ranges = getComponentGraphRanges(deviceKey, componentKey);
|
||||
// let updatedFilters = cloneDeep(graphFilters);
|
||||
// updatedFilters.ranges = ranges;
|
||||
// setGraphFilters(updatedFilters);
|
||||
// }
|
||||
// }, [deviceKey, prevDevice, prevComponentKey, componentKey, graphFilters]);
|
||||
|
||||
//use the excluded nodes to set the default for the graph filters
|
||||
useEffect(() => {
|
||||
let excludedNodes = component.settings.excludedNodes;
|
||||
if (excludedNodes === undefined || excludedNodes.length === 0) return;
|
||||
let updatedFilters = cloneDeep(graphFilters);
|
||||
if (excludedNodes && component.lastMeasurement[0]) {
|
||||
let includedNodes: string[] = [];
|
||||
let numNodes = GetNumNodesFromUnitMeasurement(
|
||||
UnitMeasurement.any(component.lastMeasurement[0])
|
||||
);
|
||||
// useEffect(() => {
|
||||
// let excludedNodes = component.settings.excludedNodes;
|
||||
// if (excludedNodes === undefined || excludedNodes.length === 0) return;
|
||||
// let updatedFilters = cloneDeep(graphFilters);
|
||||
// if (excludedNodes && component.lastMeasurement[0]) {
|
||||
// let includedNodes: string[] = [];
|
||||
// let numNodes = GetNumNodesFromUnitMeasurement(
|
||||
// UnitMeasurement.any(component.lastMeasurement[0])
|
||||
// );
|
||||
|
||||
for (let i = 0; i < numNodes; i++) {
|
||||
if (!excludedNodes.includes(i)) {
|
||||
includedNodes.push(i.toString());
|
||||
}
|
||||
}
|
||||
updatedFilters.selectedNodes = includedNodes;
|
||||
}
|
||||
setGraphFilters(updatedFilters);
|
||||
}, [component]); //eslint-disable-line react-hooks/exhaustive-deps
|
||||
// for (let i = 0; i < numNodes; i++) {
|
||||
// if (!excludedNodes.includes(i)) {
|
||||
// includedNodes.push(i.toString());
|
||||
// }
|
||||
// }
|
||||
// updatedFilters.selectedNodes = includedNodes;
|
||||
// }
|
||||
// setGraphFilters(updatedFilters);
|
||||
// }, [component]); //eslint-disable-line react-hooks/exhaustive-deps
|
||||
|
||||
const updateDateRange = (newStartDate: any, newEndDate: any, live: boolean) => {
|
||||
setStartDate(newStartDate);
|
||||
|
|
@ -176,14 +176,14 @@ export default function ComponentChart(props: Props) {
|
|||
}
|
||||
};
|
||||
|
||||
const changeRange = (index: number, range: Range) => {
|
||||
let updatedFilters = cloneDeep(graphFilters);
|
||||
let ranges = updatedFilters.ranges ? updatedFilters.ranges : [];
|
||||
ranges[index] = range;
|
||||
updatedFilters.ranges = ranges;
|
||||
setComponentGraphRanges(deviceKey, componentKey, ranges);
|
||||
setGraphFilters(updatedFilters);
|
||||
};
|
||||
// const changeRange = (index: number, range: Range) => {
|
||||
// let updatedFilters = cloneDeep(graphFilters);
|
||||
// let ranges = updatedFilters.ranges ? updatedFilters.ranges : [];
|
||||
// ranges[index] = range;
|
||||
// updatedFilters.ranges = ranges;
|
||||
// setComponentGraphRanges(deviceKey, componentKey, ranges);
|
||||
// setGraphFilters(updatedFilters);
|
||||
// };
|
||||
|
||||
const handleGrainCableControlsChange = (name: string) => (event: any) => {
|
||||
let updatedFilters = cloneDeep(graphFilters);
|
||||
|
|
@ -211,24 +211,22 @@ export default function ComponentChart(props: Props) {
|
|||
};
|
||||
|
||||
const cableControls = () => {
|
||||
const { component, samples } = props;
|
||||
const { recentUnitMeasurement } = props;
|
||||
//const excludedNodes = component.settings.excludedNodes ?? [];
|
||||
const selectedNodes = graphFilters.selectedNodes ? graphFilters.selectedNodes : ["all"];
|
||||
const lastMeasurement = component.status.lastMeasurement;
|
||||
const excludedNodes = component.settings.excludedNodes ?? [];
|
||||
|
||||
let numNodes = 0;
|
||||
if (samples) {
|
||||
numNodes = GetNumNodes(
|
||||
component.settings.type,
|
||||
lastMeasurement && lastMeasurement.measurement
|
||||
);
|
||||
} else {
|
||||
if (component.lastMeasurement && component.lastMeasurement[0]) {
|
||||
// if (samples) {
|
||||
// numNodes = GetNumNodes(
|
||||
// component.settings.type,
|
||||
// recentUnitMeasurement
|
||||
// );
|
||||
// } else {
|
||||
if (recentUnitMeasurement && recentUnitMeasurement.length > 0) {
|
||||
numNodes = GetNumNodesFromUnitMeasurement(
|
||||
UnitMeasurement.any(component.lastMeasurement[0])
|
||||
recentUnitMeasurement[0]
|
||||
);
|
||||
}
|
||||
}
|
||||
//}
|
||||
|
||||
if (numNodes <= 1) {
|
||||
return null;
|
||||
|
|
@ -302,17 +300,17 @@ export default function ComponentChart(props: Props) {
|
|||
}
|
||||
|
||||
//TODO-DRAGER: this mey not be necessary to do anymore with them being split up
|
||||
if (component.type() === quack.ComponentType.COMPONENT_TYPE_DRAGER_GAS_DONGLE) {
|
||||
let describer = describeMeasurement(
|
||||
component.lastMeasurement[0].type,
|
||||
component.type(),
|
||||
component.subType()
|
||||
);
|
||||
let details = describer.nodeDetails();
|
||||
if (details) {
|
||||
nodeLabel = details.labels[i - 1];
|
||||
}
|
||||
}
|
||||
// if (component.type() === quack.ComponentType.COMPONENT_TYPE_DRAGER_GAS_DONGLE) {
|
||||
// let describer = describeMeasurement(
|
||||
// component.lastMeasurement[0].type,
|
||||
// component.type(),
|
||||
// component.subType()
|
||||
// );
|
||||
// let details = describer.nodeDetails();
|
||||
// if (details) {
|
||||
// nodeLabel = details.labels[i - 1];
|
||||
// }
|
||||
// }
|
||||
|
||||
grainCableControls.push(
|
||||
<Grid size={{ xs: 6 }} key={"node-" + (i - 1).toString()}>
|
||||
|
|
@ -700,15 +698,14 @@ export default function ComponentChart(props: Props) {
|
|||
const {
|
||||
component,
|
||||
sampling,
|
||||
samples,
|
||||
recentMeasurement,
|
||||
recentUnitMeasurement,
|
||||
deviceComponentPreferences
|
||||
recentUnitMeasurement
|
||||
} = props;
|
||||
const ext = extension(component.settings.type, component.settings.subtype);
|
||||
const ranges = graphFilters.ranges ? graphFilters.ranges : [];
|
||||
//const ext = extension(component.settings.type, component.settings.subtype);
|
||||
//const ranges = graphFilters.ranges ? graphFilters.ranges : [];
|
||||
let convertedLastMeasurement;
|
||||
|
||||
//console.log(recentUnitMeasurement)
|
||||
|
||||
if (recentUnitMeasurement && recentUnitMeasurement.length > 0) {
|
||||
let measurements = recentUnitMeasurement;
|
||||
convertedLastMeasurement = UnitMeasurement.convertLastMeasurement(measurements);
|
||||
|
|
@ -717,18 +714,17 @@ export default function ComponentChart(props: Props) {
|
|||
<Grid container spacing={2} direction={isMobile ? "column" : "row-reverse"}>
|
||||
{isMobile && (
|
||||
<Grid className={classes.borderedContainer}>
|
||||
{samples ? (
|
||||
{/* {samples ? (
|
||||
<MeasurementSummary component={component} reading={recentMeasurement} />
|
||||
) : (
|
||||
) : ( */}
|
||||
<Card raised className={classes.container}>
|
||||
<Typography style={{ fontWeight: 650 }}>Latest Measurements:</Typography>
|
||||
<UnitMeasurementSummary
|
||||
component={component}
|
||||
reading={convertedLastMeasurement}
|
||||
excludedNodes={component.settings.excludedNodes}
|
||||
/>
|
||||
</Card>
|
||||
)}
|
||||
{/* )} */}
|
||||
</Grid>
|
||||
)}
|
||||
<Grid
|
||||
|
|
@ -755,9 +751,9 @@ export default function ComponentChart(props: Props) {
|
|||
</Grid>
|
||||
{/* )} */}
|
||||
<Grid size={{ xs: 12 }} className={classes.borderedContainer}>
|
||||
{samples ? (
|
||||
{/* {samples ? (
|
||||
<MeasurementSummary component={component} reading={recentMeasurement} />
|
||||
) : (
|
||||
) : ( */}
|
||||
<Card raised style={{ padding: 25, marginBottom: 20 }}>
|
||||
<Typography style={{ fontWeight: 650 }}>Latest Measurements:</Typography>
|
||||
<UnitMeasurementSummary
|
||||
|
|
@ -765,10 +761,9 @@ export default function ComponentChart(props: Props) {
|
|||
reading={convertedLastMeasurement}
|
||||
largeText
|
||||
boldMeasurements
|
||||
excludedNodes={component.settings.excludedNodes}
|
||||
/>
|
||||
</Card>
|
||||
)}
|
||||
{/* )} */}
|
||||
</Grid>
|
||||
</React.Fragment>
|
||||
)}
|
||||
|
|
@ -793,7 +788,7 @@ export default function ComponentChart(props: Props) {
|
|||
</Grid>
|
||||
)}
|
||||
|
||||
{!sampling &&
|
||||
{/* {!sampling &&
|
||||
ext.measurements.map((m, i) => {
|
||||
const range = ranges[i] ? ranges[i] : ({} as Range);
|
||||
if (m.measurementType === quack.MeasurementType.MEASUREMENT_TYPE_BOOLEAN) {
|
||||
|
|
@ -811,7 +806,7 @@ export default function ComponentChart(props: Props) {
|
|||
);
|
||||
}
|
||||
return null;
|
||||
})}
|
||||
})} */}
|
||||
</Grid>
|
||||
</Grid>
|
||||
);
|
||||
|
|
|
|||
|
|
@ -21,7 +21,6 @@ interface Props {
|
|||
onlyRecent?: boolean;
|
||||
largeText?: boolean;
|
||||
boldMeasurements?: boolean;
|
||||
excludedNodes?: number[];
|
||||
}
|
||||
|
||||
const useStyles = makeStyles((theme: Theme) => {
|
||||
|
|
@ -61,8 +60,7 @@ export default function UnitMeasurementSummary(props: Props) {
|
|||
dense,
|
||||
onlyRecent,
|
||||
largeText,
|
||||
boldMeasurements,
|
||||
excludedNodes
|
||||
boldMeasurements
|
||||
} = props;
|
||||
const [summaries, setSummaries] = useState<Summary[]>([]);
|
||||
const [timestamp, setTimestamp] = useState("");
|
||||
|
|
@ -80,12 +78,11 @@ export default function UnitMeasurementSummary(props: Props) {
|
|||
setTimestamp(reading.timestamp);
|
||||
setSummaries(
|
||||
extension(component.type(), component.subType()).unitMeasurementSummary(
|
||||
reading,
|
||||
excludedNodes
|
||||
reading
|
||||
)
|
||||
);
|
||||
}
|
||||
}, [component, reading, excludedNodes]); // eslint-disable-line react-hooks/exhaustive-deps
|
||||
}, [component, reading]); // eslint-disable-line react-hooks/exhaustive-deps
|
||||
|
||||
const noSummary = () => {
|
||||
return (
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue