Sketch structure for year estimate

This commit is contained in:
Tom Russell 2019-04-04 13:05:58 +01:00
parent 4fbaa36328
commit 86a369f801
2 changed files with 23 additions and 5 deletions

View File

@ -224,6 +224,9 @@ class EditForm extends Component {
case "number": case "number":
return <NumberInput {...props} handleChange={this.handleChange} return <NumberInput {...props} handleChange={this.handleChange}
value={this.state[props.slug]} key={props.slug} /> value={this.state[props.slug]} key={props.slug} />
case "year_estimator":
return <YearEstimator {...props} handleChange={this.handleChange}
value={this.state[props.slug]} key={props.slug} />
case "text_multi": case "text_multi":
return <MultiTextInput {...props} handleChange={this.handleUpdate} return <MultiTextInput {...props} handleChange={this.handleUpdate}
value={this.state[props.slug]} key={props.slug} /> value={this.state[props.slug]} key={props.slug} />
@ -383,6 +386,21 @@ const NumberInput = (props) => (
</Fragment> </Fragment>
); );
class YearEstimator extends Component {
constructor(props) {
super(props);
}
// TODO add dropdown for decade, century
// TODO roll in first/last year estimate
// TODO handle changes internally, reporting out date_year, date_upper, date_lower
render() {
return (
<NumberInput {...this.props} handleChange={this.props.handleChange}
value={this.props.value} key={this.props.slug} />
)
}
}
const CheckboxInput = (props) => ( const CheckboxInput = (props) => (
<div className="form-check"> <div className="form-check">
<input className="form-check-input" type="checkbox" <input className="form-check-input" type="checkbox"

View File

@ -74,16 +74,16 @@
"intro": "Building age data can support energy analysis and help predict long-term change.", "intro": "Building age data can support energy analysis and help predict long-term change.",
"fields": [ "fields": [
{ {
"title": "Year built (best estimate)", "slug": "date_year", "type": "number", "step": 1 "title": "Year built (best estimate)", "slug": "date_year", "type": "year_estimator"
}, },
{ {
"title": "Latest possible start date", "slug": "date_upper", "type": "number", "step": 1, "title": "Latest possible start year", "slug": "date_upper", "type": "number", "step": 1,
"tooltip": "This should be the latest date building could have started." }, "tooltip": "This should be the latest year in which building could have started." },
{ {
"title": "Earliest possible start date", "slug": "date_lower", "type": "number", "step": 1, "title": "Earliest possible start date", "slug": "date_lower", "type": "number", "step": 1,
"tooltip": "This should be the earliest date building could have started." }, "tooltip": "This should be the earliest year in which building could have started." },
{ {
"title": "Facade date", "slug": "facade_year", "type": "number", "step": 1, "title": "Facade year", "slug": "facade_year", "type": "number", "step": 1,
"tooltip": "Best estimate" "tooltip": "Best estimate"
}, },
{ {