Fix disabledDate of Calendar, close #6074

This commit is contained in:
afc163 2017-05-23 17:07:17 +08:00
parent b83529daf2
commit f414398fae
6 changed files with 26 additions and 14 deletions

View File

@ -43,3 +43,4 @@ moment.locale('zh-cn');
| locale | set locale | object | [default](https://github.com/ant-design/ant-design/blob/master/components/date-picker/locale/example.json) |
| onPanelChange| callback when panel change | function(date: moment, mode: string) | - |
| onSelect | callback when select date | function(date: moment | - |
| disabledDate | specify the date that cannot be selected | (currentDate: moment) => boolean | 无 |

View File

@ -39,6 +39,7 @@ export interface CalendarProps {
style?: React.CSSProperties;
onPanelChange?: (date?: moment.Moment, mode?: CalendarMode) => void;
onSelect?: (date?: moment.Moment) => void;
disabledDate?: (current: moment.Moment) => boolean;
}
export interface CalendarState {

View File

@ -45,3 +45,4 @@ moment.locale('zh-cn');
| locale | 国际化配置 | object | [默认配置](https://github.com/ant-design/ant-design/blob/master/components/date-picker/locale/example.json) |
| onPanelChange| 日期面板变化回调 | function(date: moment, mode: string) | 无 |
| onSelect | 点击选择日期回调 | function(date: moment | 无 |
| disabledDate | 不可选择的日期 | (currentDate: moment) => boolean | 无 |

View File

@ -125,18 +125,6 @@
color: #fff;
}
&-disabled-cell &-value {
cursor: not-allowed;
color: @disabled-color;
background: @disabled-bg;
border-radius: 0;
width: auto;
&:hover {
background: @disabled-bg;
}
}
&-disabled-cell-first-of-row &-value {
border-top-left-radius: @border-radius-base;
border-bottom-left-radius: @border-radius-base;
@ -254,4 +242,25 @@
left: auto;
bottom: auto;
}
&-disabled-cell &-date {
&,
&:hover {
cursor: not-allowed;
}
}
&-disabled-cell:not(&-today) &-date {
&,
&:hover {
background: transparent;
}
}
&-disabled-cell &-value {
color: @disabled-color;
border-radius: 0;
width: auto;
cursor: not-allowed;
}
}

View File

@ -42,7 +42,7 @@ The following APIs are shared by DatePicker, MonthPicker, RangePicker.
| popupStyle | to customize the style of the popup calendar | object | {} |
| size | determine the size of the input box, the height of `large` and `small`, are 32px and 22px respectively, while default size is 28px | string | - |
| locale | localization configuration | object | [default](https://github.com/ant-design/ant-design/blob/master/components/date-picker/locale/example.json) |
| disabledDate | to specify the date that cannot be selected | function | - |
| disabledDate | specify the date that cannot be selected | (currentDate: moment) => boolean | - |
| getCalendarContainer | to set the container of the floating layer, while the default is to create a `div` element in `body` | function(trigger) | - |
| open | open state of picker | boolean | - |
| onOpenChange | a callback function, can be executed whether the popup calendar is popped up or closed | function(status) | - |

View File

@ -43,7 +43,7 @@ moment.locale('zh-cn');
| popupStyle | 格外的弹出日历样式 | object | {} |
| size | 输入框大小,`large` 高度为 32px`small` 为 22px默认是 28px | string | 无 |
| locale | 国际化配置 | object | [默认配置](https://github.com/ant-design/ant-design/blob/master/components/date-picker/locale/example.json) |
| disabledDate | 不可选择的日期 | function | 无 |
| disabledDate | 不可选择的日期 | (currentDate: moment) => boolean | 无 |
| getCalendarContainer | 定义浮层的容器,默认为 body 上新建 div | function(trigger) | 无 |
| open | 控制弹层是否展开 | boolean | - |
| onOpenChange | 弹出日历和关闭日历的回调 | function(status) | 无 |