CEC-2291 Remote Commands (#194)

src/components/Controls/SendCommand/Parameters.jsx

@@ -0,0 +1,73 @@
+import PropTypes from "prop-types";
+import {FormControl} from "@material-ui/core";
+import useStyles from "../../useStyles";
+import {MuiPickersUtilsProvider} from "@material-ui/pickers";
+import DateFnsUtils from "@date-io/date-fns";
+
+export const Dates = (
+  {
+    startDateFunc,
+    endDateFunc,
+    startDate,
+    handleStartChange,
+    endDate,
+    handleEndChange,
+  }) => {
+  if (startDateFunc && endDateFunc) {
+    return (<MuiPickersUtilsProvider utils={DateFnsUtils}>
+      {startDateFunc(startDate, handleStartChange)}
+      {endDateFunc(endDate, handleEndChange, startDate)}
+    </MuiPickersUtilsProvider>);
+  }
+
+  return null;
+}
+
+Dates.propTypes = {
+  startDateFunc: PropTypes.func,
+  endDateFunc: PropTypes.func,
+  startDate: PropTypes.instanceOf(Date),
+  handleStartChange: PropTypes.func,
+  endDate: PropTypes.instanceOf(Date),
+  handleEndChange: PropTypes.func
+}
+
+export const Parameters = (props) => {
+  const {params} = props;
+
+  const classes = useStyles();
+
+  if (params === null || params === undefined || params === "") {
+    return null;
+  }
+
+  const {data, handleDataChange} = props;
+  const {startDate, handleStartChange} = props;
+  const {endDate, handleEndChange} = props;
+
+  return (
+    <FormControl size="small" className={classes.formControl}>
+      <div style={{width: "300px", marginTop: "1em"}}>
+        {params.dataFunc(data, handleDataChange)}
+      </div>
+      <Dates
+        startDateFunc={params.startDateFunc}
+        endDateFunc={params.endDateFunc}
+        startDate={startDate}
+        handleStartChange={handleStartChange}
+        endDate={endDate}
+        handleEndChange={handleEndChange}
+      ></Dates>
+    </FormControl>
+  )
+}
+
+Parameters.propTypes = {
+  params: PropTypes.any,
+  data: PropTypes.any,
+  handleDataChange: PropTypes.func,
+  startDate: PropTypes.instanceOf(Date),
+  handleStartChange: PropTypes.func,
+  endDate: PropTypes.instanceOf(Date),
+  handleEndChange: PropTypes.func
+};