You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

88 lines
2.5 KiB

10 years ago
import React from 'react';
import Calendar from 'rc-calendar';
const Datepicker = Calendar.Picker;
import GregorianCalendar from 'gregorian-calendar';
import zhCn from 'gregorian-calendar/lib/locale/zh-cn';
import CalendarLocale from 'rc-calendar/lib/locale/zh-cn';
import DateTimeFormat from 'gregorian-calendar-format';
10 years ago
// 和顶部文案保持一致
10 years ago
import Locale from 'gregorian-calendar-format/lib/locale/zh-cn';
Locale.shortMonths = ['1月', '2月', '3月', '4月', '5月', '6月',
'7月', '8月', '9月', '10月', '11月', '12月'];
10 years ago
10 years ago
// 以下两行代码
// 给没有初始值的日期选择框提供本地化信息
10 years ago
let defaultCalendarValue = new GregorianCalendar(zhCn);
10 years ago
defaultCalendarValue.setTime(Date.now());
10 years ago
export default React.createClass({
10 years ago
getInitialState() {
10 years ago
var value;
10 years ago
if (this.props.value) {
10 years ago
value = new GregorianCalendar(zhCn);
10 years ago
value.setTime(new Date(this.props.value).valueOf());
}
return {
10 years ago
value: value
};
},
10 years ago
componentWillReceiveProps(nextProps) {
10 years ago
if (nextProps.value) {
10 years ago
var value = new GregorianCalendar(zhCn);
value.setTime(new Date(nextProps.value).valueOf());
this.setState({
value: value
});
}
},
10 years ago
getDefaultProps() {
10 years ago
return {
format: 'yyyy-MM-dd',
10 years ago
placeholder: '请选择日期',
transitionName: 'slide-up',
onSelect: function () {
}
10 years ago
};
},
10 years ago
handleChange(v) {
10 years ago
this.setState({
value: v
});
this.props.onSelect(new Date(v.getTime()));
},
10 years ago
render() {
10 years ago
var calendar = (
<Calendar
disabledDate={this.props.disabledDate}
10 years ago
locale={CalendarLocale}
orient={['top', 'left']}
defaultValue={defaultCalendarValue}
showTime={this.props.showTime}
prefixCls="ant-calendar"
showOk={this.props.showTime}
showClear={false}/>
10 years ago
);
return (
<Datepicker
transitionName={this.props.transitionName}
disabled={this.props.disabled}
trigger={<span className="ant-calendar-picker-icon" />}
10 years ago
calendar={calendar}
adjustOrientOnCalendarOverflow={{
x: true,
y: false
}}
10 years ago
formatter={new DateTimeFormat(this.props.format)}
value={this.state.value}
prefixCls="ant-calendar-picker"
10 years ago
onChange={this.handleChange}>
9 years ago
<input
placeholder={this.props.placeholder}
className={'ant-calendar-picker-input ant-input ant-input-' + this.props.size}/>
</Datepicker>
10 years ago
);
}
});