upgrade rc-calendar dependency to 9.3.0 (#8353)

This commit is contained in:
niko 2017-11-29 11:23:15 +08:00 committed by 偏右
parent 250eed0fc9
commit be1cbd4eae
8 changed files with 242 additions and 213 deletions

View File

@ -353,6 +353,21 @@ exports[`renders ./components/date-picker/demo/extra-footer.md correctly 1`] = `
/> />
</span> </span>
</span> </span>
<span
class="ant-calendar-picker"
>
<div>
<input
class="ant-calendar-picker-input ant-input"
placeholder="Select month"
readonly=""
value=""
/>
<span
class="ant-calendar-picker-icon"
/>
</div>
</span>
</div> </div>
`; `;
@ -627,7 +642,7 @@ exports[`renders ./components/date-picker/demo/size.md correctly 1`] = `
<div> <div>
<input <input
class="ant-calendar-picker-input ant-input" class="ant-calendar-picker-input ant-input"
placeholder="Select date" placeholder="Select Month"
readonly="" readonly=""
value="" value=""
/> />
@ -672,7 +687,7 @@ exports[`renders ./components/date-picker/demo/size.md correctly 1`] = `
<span> <span>
<input <input
class="ant-calendar-picker-input ant-input" class="ant-calendar-picker-input ant-input"
placeholder="Select date" placeholder="Select Week"
readonly="" readonly=""
value="" value=""
/> />

View File

@ -10,243 +10,251 @@ exports[`MonthPicker and WeekPicker render MonthPicker 1`] = `
tabindex="0" tabindex="0"
> >
<div <div
class="ant-calendar-header" class="ant-calendar-month-calendar-content"
> >
<div <div
style="position:relative" class="ant-calendar-month-header-wrap"
> >
<a <div
class="ant-calendar-prev-year-btn" class="ant-calendar-header"
role="button"
title="Last year (Control + left)"
/>
<a
class="ant-calendar-prev-month-btn"
role="button"
title="Previous month (PageUp)"
/>
<span
class="ant-calendar-my-select"
> >
<a
class="ant-calendar-month-select"
role="button"
title="Choose a month"
>
1月
</a>
<a
class="ant-calendar-year-select"
role="button"
title="Choose a year"
>
2000
</a>
</span>
<a
class="ant-calendar-next-month-btn"
title="Next month (PageDown)"
/>
<a
class="ant-calendar-next-year-btn"
title="Next year (Control + right)"
/>
</div>
<div
class="ant-calendar-month-panel"
>
<div>
<div <div
class="ant-calendar-month-panel-header" style="position:relative"
> >
<a <a
class="ant-calendar-month-panel-prev-year-btn" class="ant-calendar-prev-year-btn"
role="button" role="button"
title="Last year (Control + left)" title="Last year (Control + left)"
/> />
<a <a
class="ant-calendar-month-panel-year-select" class="ant-calendar-prev-month-btn"
role="button" role="button"
title="Choose a year" title="Previous month (PageUp)"
/>
<span
class="ant-calendar-my-select"
> >
<span <a
class="ant-calendar-month-panel-year-select-content" class="ant-calendar-month-select"
role="button"
title="Choose a month"
>
1月
</a>
<a
class="ant-calendar-year-select"
role="button"
title="Choose a year"
> >
2000 2000
</span> </a>
<span </span>
class="ant-calendar-month-panel-year-select-arrow"
>
x
</span>
</a>
<a <a
class="ant-calendar-month-panel-next-year-btn" class="ant-calendar-next-month-btn"
role="button" title="Next month (PageDown)"
/>
<a
class="ant-calendar-next-year-btn"
title="Next year (Control + right)" title="Next year (Control + right)"
/> />
</div> </div>
<div <div
class="ant-calendar-month-panel-body" class="ant-calendar-month-panel"
> >
<table <div>
cellspacing="0" <div
class="ant-calendar-month-panel-table" class="ant-calendar-month-panel-header"
role="grid"
>
<tbody
class="ant-calendar-month-panel-tbody"
> >
<tr <a
role="row" class="ant-calendar-month-panel-prev-year-btn"
role="button"
title="Last year (Control + left)"
/>
<a
class="ant-calendar-month-panel-year-select"
role="button"
title="Choose a year"
> >
<td <span
class="ant-calendar-month-panel-cell ant-calendar-month-panel-selected-cell" class="ant-calendar-month-panel-year-select-content"
role="gridcell"
title="一月"
> >
<a 2000
class="ant-calendar-month-panel-month" </span>
> <span
一月 class="ant-calendar-month-panel-year-select-arrow"
</a>
</td>
<td
class="ant-calendar-month-panel-cell"
role="gridcell"
title="二月"
> >
<a x
class="ant-calendar-month-panel-month" </span>
> </a>
二月 <a
</a> class="ant-calendar-month-panel-next-year-btn"
</td> role="button"
<td title="Next year (Control + right)"
class="ant-calendar-month-panel-cell" />
role="gridcell" </div>
title="三月" <div
> class="ant-calendar-month-panel-body"
<a >
class="ant-calendar-month-panel-month" <table
> cellspacing="0"
三月 class="ant-calendar-month-panel-table"
</a> role="grid"
</td>
</tr>
<tr
role="row"
> >
<td <tbody
class="ant-calendar-month-panel-cell" class="ant-calendar-month-panel-tbody"
role="gridcell"
title="四月"
> >
<a <tr
class="ant-calendar-month-panel-month" role="row"
> >
四月 <td
</a> class="ant-calendar-month-panel-cell ant-calendar-month-panel-selected-cell"
</td> role="gridcell"
<td title="一月"
class="ant-calendar-month-panel-cell" >
role="gridcell" <a
title="五月" class="ant-calendar-month-panel-month"
> >
<a 一月
class="ant-calendar-month-panel-month" </a>
</td>
<td
class="ant-calendar-month-panel-cell"
role="gridcell"
title="二月"
>
<a
class="ant-calendar-month-panel-month"
>
二月
</a>
</td>
<td
class="ant-calendar-month-panel-cell"
role="gridcell"
title="三月"
>
<a
class="ant-calendar-month-panel-month"
>
三月
</a>
</td>
</tr>
<tr
role="row"
> >
五月 <td
</a> class="ant-calendar-month-panel-cell"
</td> role="gridcell"
<td title="四月"
class="ant-calendar-month-panel-cell" >
role="gridcell" <a
title="六月" class="ant-calendar-month-panel-month"
> >
<a 四月
class="ant-calendar-month-panel-month" </a>
</td>
<td
class="ant-calendar-month-panel-cell"
role="gridcell"
title="五月"
>
<a
class="ant-calendar-month-panel-month"
>
五月
</a>
</td>
<td
class="ant-calendar-month-panel-cell"
role="gridcell"
title="六月"
>
<a
class="ant-calendar-month-panel-month"
>
六月
</a>
</td>
</tr>
<tr
role="row"
> >
六月 <td
</a> class="ant-calendar-month-panel-cell"
</td> role="gridcell"
</tr> title="七月"
<tr >
role="row" <a
> class="ant-calendar-month-panel-month"
<td >
class="ant-calendar-month-panel-cell" 七月
role="gridcell" </a>
title="七月" </td>
> <td
<a class="ant-calendar-month-panel-cell"
class="ant-calendar-month-panel-month" role="gridcell"
title="八月"
>
<a
class="ant-calendar-month-panel-month"
>
八月
</a>
</td>
<td
class="ant-calendar-month-panel-cell"
role="gridcell"
title="九月"
>
<a
class="ant-calendar-month-panel-month"
>
九月
</a>
</td>
</tr>
<tr
role="row"
> >
七月 <td
</a> class="ant-calendar-month-panel-cell"
</td> role="gridcell"
<td title="十月"
class="ant-calendar-month-panel-cell" >
role="gridcell" <a
title="八月" class="ant-calendar-month-panel-month"
> >
<a 十月
class="ant-calendar-month-panel-month" </a>
> </td>
八月 <td
</a> class="ant-calendar-month-panel-cell"
</td> role="gridcell"
<td title="十一月"
class="ant-calendar-month-panel-cell" >
role="gridcell" <a
title="九月" class="ant-calendar-month-panel-month"
> >
<a 十一月
class="ant-calendar-month-panel-month" </a>
> </td>
九月 <td
</a> class="ant-calendar-month-panel-cell"
</td> role="gridcell"
</tr> title="十二月"
<tr >
role="row" <a
> class="ant-calendar-month-panel-month"
<td >
class="ant-calendar-month-panel-cell" 十二月
role="gridcell" </a>
title="十月" </td>
> </tr>
<a </tbody>
class="ant-calendar-month-panel-month" </table>
> </div>
十月 </div>
</a>
</td>
<td
class="ant-calendar-month-panel-cell"
role="gridcell"
title="十一月"
>
<a
class="ant-calendar-month-panel-month"
>
十一月
</a>
</td>
<td
class="ant-calendar-month-panel-cell"
role="gridcell"
title="十二月"
>
<a
class="ant-calendar-month-panel-month"
>
十二月
</a>
</td>
</tr>
</tbody>
</table>
</div> </div>
</div> </div>
</div> </div>

View File

@ -15,7 +15,7 @@ Render extra footer in panel for customized requirements.
````jsx ````jsx
import { DatePicker } from 'antd'; import { DatePicker } from 'antd';
const { RangePicker } = DatePicker; const { RangePicker, MonthPicker } = DatePicker;
ReactDOM.render( ReactDOM.render(
<div> <div>
@ -23,6 +23,7 @@ ReactDOM.render(
<DatePicker renderExtraFooter={() => 'extra footer'} showTime /> <DatePicker renderExtraFooter={() => 'extra footer'} showTime />
<RangePicker renderExtraFooter={() => 'extra footer'} /> <RangePicker renderExtraFooter={() => 'extra footer'} />
<RangePicker renderExtraFooter={() => 'extra footer'} showTime /> <RangePicker renderExtraFooter={() => 'extra footer'} showTime />
<MonthPicker renderExtraFooter={() => 'extra footer'} placeholder="Select month" />
</div> </div>
, mountNode); , mountNode);
```` ````

View File

@ -39,11 +39,11 @@ class PickerSizesDemo extends React.Component {
<br /><br /> <br /><br />
<DatePicker size={size} /> <DatePicker size={size} />
<br /> <br />
<MonthPicker size={size} /> <MonthPicker size={size} placeholder="Select Month" />
<br /> <br />
<RangePicker size={size} /> <RangePicker size={size} />
<br /> <br />
<WeekPicker size={size} /> <WeekPicker size={size} placeholder="Select Week" />
</div> </div>
); );
} }

View File

@ -74,6 +74,7 @@ The following APIs are shared by DatePicker, MonthPicker, RangePicker, WeekPicke
| monthCellContentRender | Custom month cell content render method | function(date, locale): ReactNode | - | | monthCellContentRender | Custom month cell content render method | function(date, locale): ReactNode | - |
| value | to set date | [moment](http://momentjs.com/) | - | | value | to set date | [moment](http://momentjs.com/) | - |
| onChange | a callback function, can be executed when the selected time is changing | function(date: moment, dateString: string) | - | | onChange | a callback function, can be executed when the selected time is changing | function(date: moment, dateString: string) | - |
| renderExtraFooter | render extra footer in panel | () => React.ReactNode | - |
### WeekPicker ### WeekPicker

View File

@ -75,6 +75,7 @@ subtitle: 日期选择框
| monthCellContentRender | 自定义的月份内容渲染方法 | function(date, locale): ReactNode | - | | monthCellContentRender | 自定义的月份内容渲染方法 | function(date, locale): ReactNode | - |
| value | 日期 | [moment](http://momentjs.com/) | 无 | | value | 日期 | [moment](http://momentjs.com/) | 无 |
| onChange | 时间发生变化的回调,发生在用户选择时间时 | function(date: moment, dateString: string) | - | | onChange | 时间发生变化的回调,发生在用户选择时间时 | function(date: moment, dateString: string) | - |
| renderExtraFooter | 在面板中添加额外的页脚 | () => React.ReactNode | - |
### WeekPicker ### WeekPicker

View File

@ -1,5 +1,8 @@
.@{calendar-prefix-cls}-month { .@{calendar-prefix-cls}-month {
height: 248px; .@{calendar-prefix-cls}-month-header-wrap {
position: relative;
height: 288px;
}
.@{calendar-prefix-cls}-month-panel, .@{calendar-prefix-cls}-month-panel,
.@{calendar-prefix-cls}-year-panel { .@{calendar-prefix-cls}-year-panel {
top: 0; top: 0;

View File

@ -51,7 +51,7 @@
"omit.js": "^1.0.0", "omit.js": "^1.0.0",
"prop-types": "^15.5.7", "prop-types": "^15.5.7",
"rc-animate": "^2.4.1", "rc-animate": "^2.4.1",
"rc-calendar": "~9.2.0", "rc-calendar": "~9.3.0",
"rc-cascader": "~0.12.0", "rc-cascader": "~0.12.0",
"rc-checkbox": "~2.1.1", "rc-checkbox": "~2.1.1",
"rc-collapse": "~1.7.5", "rc-collapse": "~1.7.5",