Browse Source

Add LocaleProvider support for Calendar

pull/1313/head
afc163 9 years ago
parent
commit
eba37c9ef7
  1. 26
      components/calendar/index.jsx
  2. 5
      components/locale-provider/demo/all.md
  3. 1
      components/locale-provider/en_US.js

26
components/calendar/index.jsx

@ -1,6 +1,6 @@
import React, { PropTypes } from 'react';
import GregorianCalendar from 'gregorian-calendar';
import zhCN from './locale/zh_CN';
import defaultLocale from './locale/zh_CN';
import FullCalendar from 'rc-calendar/lib/FullCalendar';
import { PREFIX_CLS } from './Constants';
import Header from './Header';
@ -16,7 +16,7 @@ export default class Calendar extends React.Component {
static defaultProps = {
monthCellRender: noop,
dateCellRender: noop,
locale: zhCN,
locale: {},
fullscreen: true,
prefixCls: PREFIX_CLS,
onPanelChange: noop,
@ -35,6 +35,10 @@ export default class Calendar extends React.Component {
value: PropTypes.instanceOf(Date),
}
static contextTypes = {
antLocale: PropTypes.object,
}
constructor(props) {
super(props);
this.state = {
@ -44,7 +48,7 @@ export default class Calendar extends React.Component {
}
parseDateFromValue(value) {
const date = new GregorianCalendar(this.props.locale);
const date = new GregorianCalendar(this.getLocale());
date.setTime(+value);
return date;
}
@ -57,6 +61,19 @@ export default class Calendar extends React.Component {
}
}
getLocale = () => {
const props = this.props;
let locale = defaultLocale;
const context = this.context;
if (context && context.antLocale && context.antLocale.Calendar) {
locale = context.antLocale.Calendar;
}
// Locale
const result = { ...locale, ...props.locale };
result.lang = { ...locale.lang, ...props.locale.lang };
return result;
}
monthCellRender = (value, locale) => {
const prefixCls = this.props.prefixCls;
const month = value.getMonth();
@ -104,8 +121,9 @@ export default class Calendar extends React.Component {
render() {
const props = this.props;
const { value, mode } = this.state;
const { locale, prefixCls, style, className, fullscreen } = props;
const { prefixCls, style, className, fullscreen } = props;
const type = (mode === 'year') ? 'month' : 'date';
const locale = this.getLocale();
let cls = className || '';
if (fullscreen) {

5
components/locale-provider/demo/all.md

@ -8,7 +8,7 @@ title: 所有组件
````jsx
import { LocaleProvider, Pagination, DatePicker, TimePicker,
import { LocaleProvider, Pagination, DatePicker, TimePicker, Calendar,
Popconfirm, Table, Modal, Button, Select, Transfer } from 'antd';
import enUS from 'antd/lib/locale-provider/en_US';
const Option = Select.Option;
@ -73,6 +73,9 @@ const Page = React.createClass({
targetKeys={[]}
render={item => item.title} />
</div>
<div style={{ width: 290, border: '1px solid #d9d9d9', borderRadius: 4 }}>
<Calendar fullscreen={false} />
</div>
<div className="example">
<Table dataSource={[]} columns={columns} />
</div>

1
components/locale-provider/en_US.js

@ -2,6 +2,7 @@ export default {
Pagination: require('rc-pagination/lib/locale/en_US'),
DatePicker: require('../date-picker/locale/en_US'),
TimePicker: require('../time-picker/locale/en_US'),
Calendar: require('../calendar/locale/en_US'),
Table: {
filterTitle: 'Filter Menu',
filterConfirm: 'OK',

Loading…
Cancel
Save