static-cms/src/components/Widgets/DateControl.js

50 lines
1.2 KiB
JavaScript
Raw Normal View History

import PropTypes from 'prop-types';
import React from 'react';
import DateTime from 'react-datetime';
import moment from 'moment';
2017-11-27 14:19:38 -08:00
export default class DateControl extends React.Component {
componentDidMount() {
2017-11-27 14:19:38 -08:00
const { value, field, onChange } = this.props;
2017-11-27 21:13:02 -05:00
this.format = field.get('format');
2017-11-27 21:17:17 -05:00
/**
* Set the current date as default value if no default value is provided. An
* empty string means the value is intentionally blank.
*/
if (!value && value !== '') {
2017-11-27 21:13:02 -05:00
this.handleChange(new Date());
}
}
2017-11-27 21:13:02 -05:00
handleChange = datetime => {
const { onChange } = this.props;
if (!this.format || datetime === '') {
onChange(datetime);
} else {
const formattedValue = moment(datetime).format(this.format);
onChange(formattedValue);
}
};
render() {
2017-11-27 21:13:02 -05:00
const { includeTime, value } = this.props;
const format = this.format || moment.defaultFormat;
2017-11-27 14:19:38 -08:00
return (<DateTime
2017-11-27 15:06:21 -08:00
timeFormat={!!includeTime}
2017-11-27 14:19:38 -08:00
value={moment(value, format)}
onChange={this.handleChange}
/>);
}
}
2017-11-27 14:19:38 -08:00
DateControl.propTypes = {
onChange: PropTypes.func.isRequired,
value: PropTypes.oneOfType([
PropTypes.object,
PropTypes.string,
]),
includeTime: PropTypes.bool,
2017-11-27 14:19:38 -08:00
field: PropTypes.object,
};