Add door lock charges screen #12

Merged
bilal.catic merged 8 commits from add-door-lock-charges-screen into master 2019-06-19 00:26:07 +02:00
Showing only changes of commit e5e86163ea - Show all commits

View File

@@ -1,7 +1,7 @@
import React, { Component } from 'react';
import moment from 'moment';
import { Form, Message } from 'semantic-ui-react';
import { Form, Message, Grid } from 'semantic-ui-react';
import { defaultDateFormat } from '../../constants/constants';
@@ -81,31 +81,45 @@ class DateRangePicker extends Component {
return (
<Form>
<Form.Group widths="equal">
<Form.Input
fluid
required
label={startDateLabel}
type="date"
value={startDateValue}
onChange={this.onStartDateChange.bind(this)}
/>
<Form.Input
fluid
required
label={endDateLabel}
type="date"
value={endDateValue}
onChange={this.onEndDateChange.bind(this)}
/>
</Form.Group>
{ error &&
<Message color="orange" onDismiss={this.onDismiss.bind(this)}>
<Message.Header>Wrong date</Message.Header>
<p><b>{startDateLabel}</b> has to be before <b>{endDateLabel}</b></p>
</Message>
}
<Form.Button onClick={this.onButtonClick.bind(this)}>{buttonLabel}</Form.Button>
<Grid columns="equal">
<Grid.Row>
<Grid.Column>
<label>{startDateLabel}</label>
<Form.Input
fluid
required
type="date"
value={startDateValue}
onChange={this.onStartDateChange.bind(this)}
/>
</Grid.Column>
<Grid.Column>
<label>{endDateLabel}</label>
<Form.Input
fluid
required
type="date"
value={endDateValue}
onChange={this.onEndDateChange.bind(this)}
/>
</Grid.Column>
</Grid.Row>
{ error &&
<Grid.Row>
<Grid.Column>
<Message color="orange" onDismiss={this.onDismiss.bind(this)}>
<Message.Header>Wrong date</Message.Header>
<p><b>{startDateLabel}</b> has to be before <b>{endDateLabel}</b></p>
</Message>
</Grid.Column>
</Grid.Row>
}
<Grid.Row>
<Grid.Column>
<Form.Button onClick={this.onButtonClick.bind(this)}>{buttonLabel}</Form.Button>
</Grid.Column>
</Grid.Row>
</Grid>
</Form>
);
}