Starting to add simple autogenerated forms
This commit is contained in:
parent
949fcd86e6
commit
b5db94c5b7
|
@ -1,8 +1,46 @@
|
||||||
'use strict';
|
'use strict';
|
||||||
|
|
||||||
|
var $$Array = require("bs-platform/lib/js/array.js");
|
||||||
|
var Curry = require("bs-platform/lib/js/curry.js");
|
||||||
|
var React = require("react");
|
||||||
|
var Belt_Option = require("bs-platform/lib/js/belt_Option.js");
|
||||||
|
var Belt_MapString = require("bs-platform/lib/js/belt_MapString.js");
|
||||||
|
var Model$ProbExample = require("../Model.bs.js");
|
||||||
var EAFunds_Model$ProbExample = require("./EAFunds_Model.bs.js");
|
var EAFunds_Model$ProbExample = require("./EAFunds_Model.bs.js");
|
||||||
|
|
||||||
|
function handleChange(handleChange$1, $$event) {
|
||||||
|
return Curry._1(handleChange$1, $$event.target.value);
|
||||||
|
}
|
||||||
|
|
||||||
var model = EAFunds_Model$ProbExample.Interface.model;
|
var model = EAFunds_Model$ProbExample.Interface.model;
|
||||||
|
|
||||||
|
var initialMap = Model$ProbExample.toMaps(model);
|
||||||
|
|
||||||
|
function EAFunds_Form(Props) {
|
||||||
|
var match = React.useState((function () {
|
||||||
|
return Model$ProbExample.toMaps(model);
|
||||||
|
}));
|
||||||
|
var params = match[0];
|
||||||
|
return $$Array.map((function (parameter) {
|
||||||
|
var __x = Belt_MapString.get(params[/* inputs */1], parameter[/* id */0]);
|
||||||
|
var value = Belt_Option.flatMap(__x, (function (param) {
|
||||||
|
return param[1];
|
||||||
|
}));
|
||||||
|
return React.createElement(React.Fragment, undefined, parameter[/* name */1], parameter[/* id */0], React.createElement(Model$ProbExample.Input.Form.make, {
|
||||||
|
parameter: parameter,
|
||||||
|
value: value,
|
||||||
|
onChange: (function (r) {
|
||||||
|
console.log(r);
|
||||||
|
return /* () */0;
|
||||||
|
})
|
||||||
|
}));
|
||||||
|
}), $$Array.of_list(model[/* inputs */3]));
|
||||||
|
}
|
||||||
|
|
||||||
|
var make = EAFunds_Form;
|
||||||
|
|
||||||
|
exports.handleChange = handleChange;
|
||||||
exports.model = model;
|
exports.model = model;
|
||||||
/* EAFunds_Model-ProbExample Not a pure module */
|
exports.initialMap = initialMap;
|
||||||
|
exports.make = make;
|
||||||
|
/* initialMap Not a pure module */
|
||||||
|
|
|
@ -1 +1,24 @@
|
||||||
let model = EAFunds_Model.Interface.model;
|
let model = EAFunds_Model.Interface.model;
|
||||||
|
|
||||||
|
let handleChange = (handleChange, event) =>
|
||||||
|
handleChange(ReactEvent.Form.target(event)##value);
|
||||||
|
|
||||||
|
let model = EAFunds_Model.Interface.model;
|
||||||
|
let initialMap = Model.toMaps(model);
|
||||||
|
|
||||||
|
[@react.component]
|
||||||
|
let make = () => {
|
||||||
|
let (params, changeParams) = React.useState(() => Model.toMaps(model));
|
||||||
|
model.inputs
|
||||||
|
|> Array.of_list
|
||||||
|
|> Array.map((parameter: Model.Input.parameter) => {
|
||||||
|
let value =
|
||||||
|
params.inputs->Model.MS.get(parameter.id)
|
||||||
|
|> Belt.Option.flatMap(_, ((_, b)) => b);
|
||||||
|
<>
|
||||||
|
{parameter.name |> ReasonReact.string}
|
||||||
|
{parameter.id |> ReasonReact.string}
|
||||||
|
<Model.Input.Form parameter value onChange={r => Js.log(r)} />
|
||||||
|
</>;
|
||||||
|
});
|
||||||
|
};
|
66
src/Model.re
66
src/Model.re
|
@ -37,8 +37,15 @@ module Input = {
|
||||||
type parameterType =
|
type parameterType =
|
||||||
| Year(IOTypes.withDefaultMinMax(float))
|
| Year(IOTypes.withDefaultMinMax(float))
|
||||||
| SingleChoice(IOTypes.singleChoice)
|
| SingleChoice(IOTypes.singleChoice)
|
||||||
| FloatPoint
|
| FloatPoint;
|
||||||
| FloatCdf;
|
|
||||||
|
let toInput = (p: parameterType) =>
|
||||||
|
switch (p) {
|
||||||
|
| Year(r) => r.default->Belt.Option.map(p => InputTypes.Year(p))
|
||||||
|
| SingleChoice(r) =>
|
||||||
|
r.default->Belt.Option.map(p => InputTypes.SingleChoice(p))
|
||||||
|
| FloatPoint => None
|
||||||
|
};
|
||||||
|
|
||||||
type parameter = {
|
type parameter = {
|
||||||
id: string,
|
id: string,
|
||||||
|
@ -57,6 +64,33 @@ module Input = {
|
||||||
name,
|
name,
|
||||||
parameterType,
|
parameterType,
|
||||||
};
|
};
|
||||||
|
|
||||||
|
module Form = {
|
||||||
|
let handleChange = (handleChange, event) =>
|
||||||
|
handleChange(ReactEvent.Form.target(event)##value);
|
||||||
|
[@react.component]
|
||||||
|
let make =
|
||||||
|
(~parameter: parameter, ~value: option(InputTypes.t), ~onChange) => {
|
||||||
|
switch (parameter.parameterType, value) {
|
||||||
|
| (Year(_), Some(Year(r))) =>
|
||||||
|
<input
|
||||||
|
type_="number"
|
||||||
|
value={r |> Js.Float.toString}
|
||||||
|
onChange={handleChange(r =>
|
||||||
|
switch (Js.Float.fromString(r)) {
|
||||||
|
| r => onChange(_ => Some(InputTypes.Year(r)))
|
||||||
|
}
|
||||||
|
)}
|
||||||
|
/>
|
||||||
|
| (FloatPoint, Some(FloatPoint(r))) =>
|
||||||
|
<input type_="number" value={r |> Js.Float.toString} />
|
||||||
|
| (Year(_), _)
|
||||||
|
| (FloatPoint, _) => <input type_="number" value="" />
|
||||||
|
| (SingleChoice(_), _) =>
|
||||||
|
<div> {"Single Choice" |> ReasonReact.string} </div>
|
||||||
|
};
|
||||||
|
};
|
||||||
|
};
|
||||||
};
|
};
|
||||||
|
|
||||||
module Output = {
|
module Output = {
|
||||||
|
@ -101,6 +135,34 @@ let gatherInputs = (m: model, a: list(InputTypes.withName)) => {
|
||||||
|> List.flatten;
|
|> List.flatten;
|
||||||
};
|
};
|
||||||
|
|
||||||
|
module MS = Belt.Map.String;
|
||||||
|
|
||||||
|
type modelMaps = {
|
||||||
|
assumptions: MS.t((Input.parameter, option(InputTypes.t))),
|
||||||
|
inputs: MS.t((Input.parameter, option(InputTypes.t))),
|
||||||
|
output: (Output.parameter, option(InputTypes.t)),
|
||||||
|
};
|
||||||
|
|
||||||
|
let toMaps = (m: model): modelMaps => {
|
||||||
|
assumptions:
|
||||||
|
MS.fromArray(
|
||||||
|
m.assumptions
|
||||||
|
|> List.map((r: Input.parameter) =>
|
||||||
|
(r.id, (r, Input.toInput(r.parameterType)))
|
||||||
|
)
|
||||||
|
|> Array.of_list,
|
||||||
|
),
|
||||||
|
inputs:
|
||||||
|
MS.fromArray(
|
||||||
|
m.inputs
|
||||||
|
|> List.map((r: Input.parameter) =>
|
||||||
|
(r.id, (r, Input.toInput(r.parameterType)))
|
||||||
|
)
|
||||||
|
|> Array.of_list,
|
||||||
|
),
|
||||||
|
output: (Output.make(~name="Payouts", ~parameterType=FloatCdf, ()), None),
|
||||||
|
};
|
||||||
|
|
||||||
type modelParams = {
|
type modelParams = {
|
||||||
assumptions: list(option(InputTypes.t)),
|
assumptions: list(option(InputTypes.t)),
|
||||||
inputs: list(option(InputTypes.t)),
|
inputs: list(option(InputTypes.t)),
|
||||||
|
|
Loading…
Reference in New Issue
Block a user