src/components/Section/History/Employment/ReasonOptions.jsx
import React from 'react'
import { i18n } from '../../../../config'
import {
Field,
Radio,
RadioGroup,
Show,
Textarea,
DateControl
} from '../../../Form'
export default class ReasonOptions extends React.Component {
constructor(props) {
super(props)
this.state = {
Reason: props.Reason,
Text: props.Text,
Date: props.Date
}
this.onUpdate = this.onUpdate.bind(this)
this.updateReason = this.updateReason.bind(this)
this.updateText = this.updateText.bind(this)
this.updateDate = this.updateDate.bind(this)
}
onUpdate(name, values) {
this.setState({ [name]: values }, () => {
if (this.props.onUpdate) {
this.props.onUpdate({
name: this.props.name,
Reason: this.state.Reason,
Text: this.state.Text,
Date: this.state.Date
})
}
})
}
updateReason(values) {
this.onUpdate('Reason', values)
}
updateText(values) {
this.onUpdate('Text', values)
}
updateDate(values) {
this.onUpdate('Date', values)
}
labelText() {
switch ((this.state.Reason || {}).value) {
case 'Fired':
return i18n.t('history.employment.default.left.fired.text')
case 'Quit':
return i18n.t('history.employment.default.left.quit.text')
case 'Charges':
return i18n.t('history.employment.default.left.charges.text')
case 'Performance':
return i18n.t('history.employment.default.left.performance.text')
}
return null
}
labelDate() {
switch ((this.state.Reason || {}).value) {
case 'Fired':
return i18n.t('history.employment.default.left.fired.date')
case 'Quit':
return i18n.t('history.employment.default.left.quit.date')
case 'Charges':
return i18n.t('history.employment.default.left.charges.date')
case 'Performance':
return i18n.t('history.employment.default.left.performance.date')
}
return null
}
render() {
const text = this.labelText()
const date = this.labelDate()
return (
<div className={this.props.className}>
<Field
title="Select the type of incident"
adjustFor="big-buttons"
shrink={true}
scrollIntoView={this.props.scrollIntoView}>
<RadioGroup
className="employment-left option-list option-list-vertical"
selectedValue={(this.state.Reason || {}).value}
required={this.props.required}
onError={this.props.onError}>
<Radio
name="employment_left"
label={i18n.m('history.employment.default.left.fired.option')}
value="Fired"
onUpdate={this.updateReason}
onError={this.props.onError}
/>
<Radio
name="employment_quit"
label={i18n.m('history.employment.default.left.quit.option')}
value="Quit"
onUpdate={this.updateReason}
onError={this.props.onError}
/>
<Radio
name="employment_charges"
label={i18n.m('history.employment.default.left.charges.option')}
value="Charges"
onUpdate={this.updateReason}
onError={this.props.onError}
/>
<Radio
name="employment_performance"
label={i18n.m(
'history.employment.default.left.performance.option'
)}
value="Performance"
onUpdate={this.updateReason}
onError={this.props.onError}
/>
</RadioGroup>
</Field>
<Show when={(this.state.Reason || {}).value}>
<div>
<div className="explanation-left">
<Field
title={text}
shrink={true}
scrollIntoView={this.props.scrollIntoView}>
<Textarea
name="Text"
maxlength="100"
{...this.state.Text}
onUpdate={this.updateText}
onError={this.props.onError}
required={this.props.required}
/>
</Field>
</div>
<div className="date-left">
<Field
title={date}
shrink={true}
scrollIntoView={this.props.scrollIntoView}>
<DateControl
name="Date"
{...this.state.Date}
minDateEqualTo={true}
onUpdate={this.updateDate}
onError={this.props.onError}
required={this.props.required}
/>
</Field>
</div>
</div>
</Show>
</div>
)
}
}
ReasonOptions.defaultProps = {
onError: (value, arr) => {
return arr
}
}