Commit 2e963228 authored by Maxym Borodenko's avatar Maxym Borodenko
Browse files

#324 Single crop selection

parent e954c116
...@@ -18,6 +18,7 @@ import Header from './layout/Header'; ...@@ -18,6 +18,7 @@ import Header from './layout/Header';
import Footer from './layout/Footer'; import Footer from './layout/Footer';
import Snackbar from 'ui/common/snackbar/Snackbar'; import Snackbar from 'ui/common/snackbar/Snackbar';
import renderRoutes from 'ui/renderRoutes'; import renderRoutes from 'ui/renderRoutes';
import {Crop} from 'model/crop.model';
interface IAppProps extends React.ClassAttributes<any> { interface IAppProps extends React.ClassAttributes<any> {
children: any; children: any;
...@@ -28,6 +29,8 @@ interface IAppProps extends React.ClassAttributes<any> { ...@@ -28,6 +29,8 @@ interface IAppProps extends React.ClassAttributes<any> {
loginAppRequest: () => Promise<any>; loginAppRequest: () => Promise<any>;
setAppMounted: () => void; setAppMounted: () => void;
updateHistory: (path: string) => void; updateHistory: (path: string) => void;
crops: Crop[];
listCrops: () => void;
} }
class App extends React.Component<IAppProps, any> { class App extends React.Component<IAppProps, any> {
...@@ -38,7 +41,14 @@ class App extends React.Component<IAppProps, any> { ...@@ -38,7 +41,14 @@ class App extends React.Component<IAppProps, any> {
public constructor(props: any) { public constructor(props: any) {
super(props); super(props);
} }
public componentWillMount() {
const { crops, listCrops } = this.props;
if (!crops || crops.length === 0) {
listCrops();
}
}
public componentWillReceiveProps(nextProps) { public componentWillReceiveProps(nextProps) {
const {updateHistory} = this.props; const {updateHistory} = this.props;
...@@ -63,6 +73,7 @@ class App extends React.Component<IAppProps, any> { ...@@ -63,6 +73,7 @@ class App extends React.Component<IAppProps, any> {
} }
const mapStateToProps = (state) => ({ const mapStateToProps = (state) => ({
crops: state.crop.list,
// accessToken: state.login.access_token, // accessToken: state.login.access_token,
}); });
...@@ -71,6 +82,7 @@ const mapDispatchToProps = (dispatch) => bindActionCreators({ ...@@ -71,6 +82,7 @@ const mapDispatchToProps = (dispatch) => bindActionCreators({
loginAppRequest, loginAppRequest,
setAppMounted, setAppMounted,
updateHistory, updateHistory,
listCrops,
}, dispatch); }, dispatch);
export default withRouter(connect(mapStateToProps, mapDispatchToProps)(App)); export default withRouter(connect(mapStateToProps, mapDispatchToProps)(App));
...@@ -5,17 +5,20 @@ import { translate } from 'react-i18next'; ...@@ -5,17 +5,20 @@ import { translate } from 'react-i18next';
import Grid from 'material-ui/Grid'; import Grid from 'material-ui/Grid';
import { FormControlLabel, FormLabel, FormControl, FormHelperText } from 'material-ui/Form'; import { FormControlLabel, FormLabel, FormControl, FormHelperText } from 'material-ui/Form';
import Checkbox from 'material-ui/Checkbox'; import Checkbox from 'material-ui/Checkbox';
import Radio from 'material-ui/Radio';
import {Crop} from 'model/crop.model'; import {Crop} from 'model/crop.model';
interface ICropSelectorProps extends React.ClassAttributes<any> { interface ICropSelectorProps extends React.ClassAttributes<any> {
t: any; t: any;
crops: Crop[]; crops: Crop[];
fields: any; fields?: any;
label: string; label: string;
input?: any;
single?: boolean;
} }
const handleChange = (fields, code) => () => { const handleCheckboxChange = (fields, code) => () => {
const index = fields.getAll() ? fields.getAll().indexOf(code) : -1; const index = fields.getAll() ? fields.getAll().indexOf(code) : -1;
if (index === -1) { if (index === -1) {
...@@ -25,7 +28,27 @@ const handleChange = (fields, code) => () => { ...@@ -25,7 +28,27 @@ const handleChange = (fields, code) => () => {
} }
}; };
const CropSelector = ({t, fields, crops, label}: ICropSelectorProps) => crops && ( const handleRadioButtonChange = (input, code) => () => {
input.onChange(code);
};
const renderCheckbox = (fields, code) => (
<Checkbox
checked={ fields.getAll() && fields.getAll().indexOf(code) !== -1 }
onChange={ handleCheckboxChange(fields, code) }
value={ code }
/>
);
const renderRadioButton = (input, code) => (
<Radio
checked={ input.value === code }
onChange={ handleRadioButtonChange(input, code) }
value={ code }
/>
);
const CropSelector = ({t, crops, label, single, fields, input}: ICropSelectorProps) => crops && (
<FormControl fullWidth> <FormControl fullWidth>
<FormLabel>{ label }</FormLabel> <FormLabel>{ label }</FormLabel>
<FormHelperText>{ t('m.crop.helper') }</FormHelperText> <FormHelperText>{ t('m.crop.helper') }</FormHelperText>
...@@ -35,11 +58,8 @@ const CropSelector = ({t, fields, crops, label}: ICropSelectorProps) => crops && ...@@ -35,11 +58,8 @@ const CropSelector = ({t, fields, crops, label}: ICropSelectorProps) => crops &&
<Grid item key={ crop.uuid } xs={ 6 } md={ 4 } lg={ 3 } xl={ 2 }> <Grid item key={ crop.uuid } xs={ 6 } md={ 4 } lg={ 3 } xl={ 2 }>
<FormControlLabel <FormControlLabel
control={ control={
<Checkbox single ? renderRadioButton(input, crop.code)
checked={ fields.getAll() && fields.getAll().indexOf(crop.code) !== -1 } : renderCheckbox(fields, crop.code)
onChange={ handleChange(fields, crop.code) }
value={ crop.code }
/>
} }
label={ crop.title } label={ crop.title }
/> />
...@@ -52,7 +72,7 @@ const CropSelector = ({t, fields, crops, label}: ICropSelectorProps) => crops && ...@@ -52,7 +72,7 @@ const CropSelector = ({t, fields, crops, label}: ICropSelectorProps) => crops &&
const mapStateToProps = (state) => ({ const mapStateToProps = (state) => ({
crops: state.crop.list, crops: state.crop.list,
}); });
......
...@@ -24,6 +24,7 @@ import { FormLabel, FormControlLabel } from 'material-ui/Form'; ...@@ -24,6 +24,7 @@ import { FormLabel, FormControlLabel } from 'material-ui/Form';
import Grid from 'material-ui/Grid'; import Grid from 'material-ui/Grid';
import { setPageTitle } from 'actions/pageTitle'; import { setPageTitle } from 'actions/pageTitle';
import { bindActionCreators } from 'redux'; import { bindActionCreators } from 'redux';
import CropSelector from 'ui/catalog/crop/CropSelector';
// FIXME Use Descriptor.DATATYPES // FIXME Use Descriptor.DATATYPES
const renderDataTypeRadioGroup = ({input, meta, ...rest}) => ( const renderDataTypeRadioGroup = ({input, meta, ...rest}) => (
...@@ -141,8 +142,9 @@ class DescriptorForm extends React.Component<any, any> { ...@@ -141,8 +142,9 @@ class DescriptorForm extends React.Component<any, any> {
validate={ [ Validators.required ] } validate={ [ Validators.required ] }
/> />
<Field name="crop" <Field name="crop"
label="Crop code" placeholder="maize" label="Crop code"
component={ TextField } component={ CropSelector }
single
/> />
<Field required name="title" <Field required name="title"
label="Descriptor title" placeholder="Color of magic" label="Descriptor title" placeholder="Color of magic"
......
...@@ -8,6 +8,7 @@ import Authorize from 'ui/common/authorized/Authorize'; ...@@ -8,6 +8,7 @@ import Authorize from 'ui/common/authorized/Authorize';
import SelectPartner from 'ui/catalog/partner/SelectPartner'; import SelectPartner from 'ui/catalog/partner/SelectPartner';
import Validators from 'utilities/Validators'; import Validators from 'utilities/Validators';
import remoteSubmit from 'ui/pages/descriptorlist/descriptorlist-stepper/steps/basic-info/RemoteSubmit'; import remoteSubmit from 'ui/pages/descriptorlist/descriptorlist-stepper/steps/basic-info/RemoteSubmit';
import CropSelector from 'ui/catalog/crop/CropSelector';
class DescriptorListForm extends React.Component<any, any> { class DescriptorListForm extends React.Component<any, any> {
...@@ -50,7 +51,8 @@ class DescriptorListForm extends React.Component<any, any> { ...@@ -50,7 +51,8 @@ class DescriptorListForm extends React.Component<any, any> {
<Field name="crop" <Field name="crop"
label="Crop code" label="Crop code"
placeholder="maize" placeholder="maize"
component={ TextField } component={ CropSelector }
single
/> />
<Field required <Field required
name="title" name="title"
...@@ -61,7 +63,7 @@ class DescriptorListForm extends React.Component<any, any> { ...@@ -61,7 +63,7 @@ class DescriptorListForm extends React.Component<any, any> {
validate={ [Validators.required] } validate={ [Validators.required] }
/> />
<Field required <Field required
disabled={ initialValues.uuid } disabled={ !!initialValues.uuid }
name="versionTag" name="versionTag"
label="Version tag" label="Version tag"
placeholder="1.0" placeholder="1.0"
......
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment