Add field groups to Size (storeys expanded)

This commit is contained in:
Maciej Ziarkowski 2019-10-09 14:12:19 +01:00
parent 38d84ff5ce
commit 4cd21088ce

View File

@ -3,79 +3,87 @@ import React, { Fragment } from 'react';
import withCopyEdit from '../data-container'; import withCopyEdit from '../data-container';
import NumericDataEntry from '../data-components/numeric-data-entry'; import NumericDataEntry from '../data-components/numeric-data-entry';
import SelectDataEntry from '../data-components/select-data-entry'; import SelectDataEntry from '../data-components/select-data-entry';
import { DataEntryGroup } from '../data-components/data-entry-group';
/** /**
* Size view/edit section * Size view/edit section
*/ */
const SizeView = (props) => ( const SizeView = (props) => (
<Fragment> <Fragment>
<NumericDataEntry <DataEntryGroup name="Storeys" collapsed={false}>
title="Core storeys"
slug="size_storeys_core" <NumericDataEntry
value={props.building.size_storeys_core} title="Core storeys"
mode={props.mode} slug="size_storeys_core"
copy={props.copy} value={props.building.size_storeys_core}
tooltip="How many storeys between the pavement and start of roof?" mode={props.mode}
onChange={props.onChange} copy={props.copy}
step={1} tooltip="How many storeys between the pavement and start of roof?"
/> onChange={props.onChange}
<NumericDataEntry step={1}
title="Attic storeys" />
slug="size_storeys_attic" <NumericDataEntry
value={props.building.size_storeys_attic} title="Attic storeys"
mode={props.mode} slug="size_storeys_attic"
copy={props.copy} value={props.building.size_storeys_attic}
tooltip="How many storeys above start of roof?" mode={props.mode}
onChange={props.onChange} copy={props.copy}
step={1} tooltip="How many storeys above start of roof?"
/> onChange={props.onChange}
<NumericDataEntry step={1}
title="Basement storeys" />
slug="size_storeys_basement" <NumericDataEntry
value={props.building.size_storeys_basement} title="Basement storeys"
mode={props.mode} slug="size_storeys_basement"
copy={props.copy} value={props.building.size_storeys_basement}
tooltip="How many storeys below pavement level?" mode={props.mode}
onChange={props.onChange} copy={props.copy}
step={1} tooltip="How many storeys below pavement level?"
/> onChange={props.onChange}
<NumericDataEntry step={1}
title="Height to apex (m)" />
slug="size_height_apex" </DataEntryGroup>
value={props.building.size_height_apex} <DataEntryGroup name="Height">
mode={props.mode} <NumericDataEntry
copy={props.copy} title="Height to apex (m)"
onChange={props.onChange} slug="size_height_apex"
step={0.1} value={props.building.size_height_apex}
/> mode={props.mode}
<NumericDataEntry copy={props.copy}
title="Height to eaves (m)" onChange={props.onChange}
slug="size_height_eaves" step={0.1}
disabled={true} />
value={props.building.size_height_eaves} <NumericDataEntry
mode={props.mode} title="Height to eaves (m)"
copy={props.copy} slug="size_height_eaves"
onChange={props.onChange} disabled={true}
step={0.1} value={props.building.size_height_eaves}
/> mode={props.mode}
<NumericDataEntry copy={props.copy}
title="Ground floor area (m²)" onChange={props.onChange}
slug="size_floor_area_ground" step={0.1}
value={props.building.size_floor_area_ground} />
mode={props.mode} </DataEntryGroup>
copy={props.copy} <DataEntryGroup name="Floor area">
onChange={props.onChange} <NumericDataEntry
step={0.1} title="Ground floor area (m²)"
/> slug="size_floor_area_ground"
<NumericDataEntry value={props.building.size_floor_area_ground}
title="Total floor area (m²)" mode={props.mode}
slug="size_floor_area_total" copy={props.copy}
value={props.building.size_floor_area_total} onChange={props.onChange}
mode={props.mode} step={0.1}
copy={props.copy} />
onChange={props.onChange} <NumericDataEntry
step={0.1} title="Total floor area (m²)"
/> slug="size_floor_area_total"
value={props.building.size_floor_area_total}
mode={props.mode}
copy={props.copy}
onChange={props.onChange}
step={0.1}
/>
</DataEntryGroup>
<NumericDataEntry <NumericDataEntry
title="Frontage Width (m)" title="Frontage Width (m)"
slug="size_width_frontage" slug="size_width_frontage"