ant-design-vue/components/date-picker/__tests__/__snapshots__/RangePicker.test.js.snap

763 lines
58 KiB
Plaintext

// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`RangePicker show month panel according to value 1`] = `
<div id="app" data-v-app=""><span class="ant-calendar-picker ant-calendar-picker" style="width: 350px;" tabindex="0"><!--teleport start--><!--teleport end--><span class="ant-calendar-picker-input ant-input" style=""><input readonly="" placeholder="Start date" class="ant-calendar-range-picker-input" tabindex="-1"><span class="ant-calendar-range-picker-separator"> ~ </span><input readonly="" placeholder="End date" class="ant-calendar-range-picker-input" tabindex="-1"><span class="anticon anticon-close-circle ant-calendar-picker-clear" role="img" aria-label="close-circle" tabindex="-1"><svg class="" data-icon="close-circle" width="1em" height="1em" fill="currentColor" aria-hidden="true" viewBox="64 64 896 896" focusable="false"><path d="M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm165.4 618.2l-66-.3L512 563.4l-99.3 118.4-66.1.3c-4.4 0-8-3.5-8-8 0-1.9.7-3.7 1.9-5.2l130.1-155L340.5 359a8.32 8.32 0 01-1.9-5.2c0-4.4 3.6-8 8-8l66.1.3L512 464.6l99.3-118.4 66-.3c4.4 0 8 3.5 8 8 0 1.9-.7 3.7-1.9 5.2L553.5 514l130 155c1.2 1.5 1.9 3.3 1.9 5.2 0 4.4-3.6 8-8 8z"></path></svg></span><span class="ant-calendar-picker-icon"><!----></span>
<div style="position: absolute; top: 0px; left: 0px; width: 100%;">
<div>
<!---->
<div class="ant-calendar-picker-container ant-calendar-picker-container-placement-bottomLeft slide-up-enter" style="left: -999px; top: -1002px;">
<div class="ant-calendar-time ant-calendar-picker-container-content ant-calendar ant-calendar-range" tabindex="0">
<!---->
<div class="ant-calendar-panel">
<!---->
<div class="ant-calendar-date-panel">
<div class="ant-calendar-range-part ant-calendar-range-left">
<div class="ant-calendar-input-wrap">
<div class="ant-calendar-date-input-wrap"><input class="ant-calendar-input " placeholder="Start date"></div>
<!---->
</div>
<div style="outline: none;">
<div class="ant-calendar-header">
<div style="position: relative;"><a class="ant-calendar-prev-year-btn" role="button" title="Last year (Control + left)"></a><a class="ant-calendar-prev-month-btn" role="button" title="Previous month (PageUp)"></a><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>
<!---->
<!---->
</div>
<!---->
</div>
<!---->
<div class="ant-calendar-body">
<table class="ant-calendar-table" cellspacing="0" role="grid">
<thead>
<tr role="row">
<!---->
<th role="columnheader" title="周一" class="ant-calendar-column-header"><span class="ant-calendar-column-header-inner">一</span></th>
<th role="columnheader" title="周二" class="ant-calendar-column-header"><span class="ant-calendar-column-header-inner">二</span></th>
<th role="columnheader" title="周三" class="ant-calendar-column-header"><span class="ant-calendar-column-header-inner">三</span></th>
<th role="columnheader" title="周四" class="ant-calendar-column-header"><span class="ant-calendar-column-header-inner">四</span></th>
<th role="columnheader" title="周五" class="ant-calendar-column-header"><span class="ant-calendar-column-header-inner">五</span></th>
<th role="columnheader" title="周六" class="ant-calendar-column-header"><span class="ant-calendar-column-header-inner">六</span></th>
<th role="columnheader" title="周日" class="ant-calendar-column-header"><span class="ant-calendar-column-header-inner">日</span></th>
</tr>
</thead>
<tbody class="ant-calendar-tbody">
<tr role="row" class="ant-calendar-active-week">
<!---->
<td role="gridcell" title="1999年12月27日" class="ant-calendar-cell ant-calendar-last-month-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">27</div>
</td>
<td role="gridcell" title="1999年12月28日" class="ant-calendar-cell ant-calendar-last-month-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">28</div>
</td>
<td role="gridcell" title="1999年12月29日" class="ant-calendar-cell ant-calendar-last-month-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">29</div>
</td>
<td role="gridcell" title="1999年12月30日" class="ant-calendar-cell ant-calendar-last-month-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">30</div>
</td>
<td role="gridcell" title="1999年12月31日" class="ant-calendar-cell ant-calendar-last-month-cell ant-calendar-last-day-of-month">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">31</div>
</td>
<td role="gridcell" title="2000年1月1日" class="ant-calendar-cell ant-calendar-selected-start-date ant-calendar-selected-end-date ant-calendar-selected-day">
<div class="ant-calendar-date" aria-selected="true" aria-disabled="false">1</div>
</td>
<td role="gridcell" title="2000年1月2日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">2</div>
</td>
</tr>
<tr role="row" class="">
<!---->
<td role="gridcell" title="2000年1月3日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">3</div>
</td>
<td role="gridcell" title="2000年1月4日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">4</div>
</td>
<td role="gridcell" title="2000年1月5日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">5</div>
</td>
<td role="gridcell" title="2000年1月6日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">6</div>
</td>
<td role="gridcell" title="2000年1月7日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">7</div>
</td>
<td role="gridcell" title="2000年1月8日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">8</div>
</td>
<td role="gridcell" title="2000年1月9日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">9</div>
</td>
</tr>
<tr role="row" class="">
<!---->
<td role="gridcell" title="2000年1月10日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">10</div>
</td>
<td role="gridcell" title="2000年1月11日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">11</div>
</td>
<td role="gridcell" title="2000年1月12日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">12</div>
</td>
<td role="gridcell" title="2000年1月13日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">13</div>
</td>
<td role="gridcell" title="2000年1月14日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">14</div>
</td>
<td role="gridcell" title="2000年1月15日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">15</div>
</td>
<td role="gridcell" title="2000年1月16日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">16</div>
</td>
</tr>
<tr role="row" class="">
<!---->
<td role="gridcell" title="2000年1月17日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">17</div>
</td>
<td role="gridcell" title="2000年1月18日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">18</div>
</td>
<td role="gridcell" title="2000年1月19日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">19</div>
</td>
<td role="gridcell" title="2000年1月20日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">20</div>
</td>
<td role="gridcell" title="2000年1月21日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">21</div>
</td>
<td role="gridcell" title="2000年1月22日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">22</div>
</td>
<td role="gridcell" title="2000年1月23日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">23</div>
</td>
</tr>
<tr role="row" class="">
<!---->
<td role="gridcell" title="2000年1月24日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">24</div>
</td>
<td role="gridcell" title="2000年1月25日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">25</div>
</td>
<td role="gridcell" title="2000年1月26日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">26</div>
</td>
<td role="gridcell" title="2000年1月27日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">27</div>
</td>
<td role="gridcell" title="2000年1月28日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">28</div>
</td>
<td role="gridcell" title="2000年1月29日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">29</div>
</td>
<td role="gridcell" title="2000年1月30日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">30</div>
</td>
</tr>
<tr role="row" class="">
<!---->
<td role="gridcell" title="2000年1月31日" class="ant-calendar-cell ant-calendar-last-day-of-month">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">31</div>
</td>
<td role="gridcell" title="2000年2月1日" class="ant-calendar-cell ant-calendar-next-month-btn-day">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">1</div>
</td>
<td role="gridcell" title="2000年2月2日" class="ant-calendar-cell ant-calendar-next-month-btn-day">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">2</div>
</td>
<td role="gridcell" title="2000年2月3日" class="ant-calendar-cell ant-calendar-next-month-btn-day">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">3</div>
</td>
<td role="gridcell" title="2000年2月4日" class="ant-calendar-cell ant-calendar-next-month-btn-day">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">4</div>
</td>
<td role="gridcell" title="2000年2月5日" class="ant-calendar-cell ant-calendar-next-month-btn-day">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">5</div>
</td>
<td role="gridcell" title="2000年2月6日" class="ant-calendar-cell ant-calendar-next-month-btn-day">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">6</div>
</td>
</tr>
</tbody>
</table>
</div>
</div>
</div><span class="ant-calendar-range-middle">~</span>
<div class="ant-calendar-range-part ant-calendar-range-right">
<div class="ant-calendar-input-wrap">
<div class="ant-calendar-date-input-wrap"><input class="ant-calendar-input " placeholder="End date"></div>
<!---->
</div>
<div style="outline: none;">
<div class="ant-calendar-header">
<div style="position: relative;">
<!---->
<!----><span class="ant-calendar-my-select"><a class="ant-calendar-month-select" role="button" title="Choose a month">2月</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><a class="ant-calendar-next-year-btn" title="Next year (Control + right)"></a></div>
<!---->
</div>
<!---->
<div class="ant-calendar-body">
<table class="ant-calendar-table" cellspacing="0" role="grid">
<thead>
<tr role="row">
<!---->
<th role="columnheader" title="周一" class="ant-calendar-column-header"><span class="ant-calendar-column-header-inner">一</span></th>
<th role="columnheader" title="周二" class="ant-calendar-column-header"><span class="ant-calendar-column-header-inner">二</span></th>
<th role="columnheader" title="周三" class="ant-calendar-column-header"><span class="ant-calendar-column-header-inner">三</span></th>
<th role="columnheader" title="周四" class="ant-calendar-column-header"><span class="ant-calendar-column-header-inner">四</span></th>
<th role="columnheader" title="周五" class="ant-calendar-column-header"><span class="ant-calendar-column-header-inner">五</span></th>
<th role="columnheader" title="周六" class="ant-calendar-column-header"><span class="ant-calendar-column-header-inner">六</span></th>
<th role="columnheader" title="周日" class="ant-calendar-column-header"><span class="ant-calendar-column-header-inner">日</span></th>
</tr>
</thead>
<tbody class="ant-calendar-tbody">
<tr role="row" class="">
<!---->
<td role="gridcell" title="2000年1月31日" class="ant-calendar-cell ant-calendar-last-month-cell ant-calendar-last-day-of-month">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">31</div>
</td>
<td role="gridcell" title="2000年2月1日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">1</div>
</td>
<td role="gridcell" title="2000年2月2日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">2</div>
</td>
<td role="gridcell" title="2000年2月3日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">3</div>
</td>
<td role="gridcell" title="2000年2月4日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">4</div>
</td>
<td role="gridcell" title="2000年2月5日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">5</div>
</td>
<td role="gridcell" title="2000年2月6日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">6</div>
</td>
</tr>
<tr role="row" class="">
<!---->
<td role="gridcell" title="2000年2月7日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">7</div>
</td>
<td role="gridcell" title="2000年2月8日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">8</div>
</td>
<td role="gridcell" title="2000年2月9日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">9</div>
</td>
<td role="gridcell" title="2000年2月10日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">10</div>
</td>
<td role="gridcell" title="2000年2月11日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">11</div>
</td>
<td role="gridcell" title="2000年2月12日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">12</div>
</td>
<td role="gridcell" title="2000年2月13日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">13</div>
</td>
</tr>
<tr role="row" class="">
<!---->
<td role="gridcell" title="2000年2月14日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">14</div>
</td>
<td role="gridcell" title="2000年2月15日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">15</div>
</td>
<td role="gridcell" title="2000年2月16日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">16</div>
</td>
<td role="gridcell" title="2000年2月17日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">17</div>
</td>
<td role="gridcell" title="2000年2月18日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">18</div>
</td>
<td role="gridcell" title="2000年2月19日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">19</div>
</td>
<td role="gridcell" title="2000年2月20日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">20</div>
</td>
</tr>
<tr role="row" class="">
<!---->
<td role="gridcell" title="2000年2月21日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">21</div>
</td>
<td role="gridcell" title="2000年2月22日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">22</div>
</td>
<td role="gridcell" title="2000年2月23日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">23</div>
</td>
<td role="gridcell" title="2000年2月24日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">24</div>
</td>
<td role="gridcell" title="2000年2月25日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">25</div>
</td>
<td role="gridcell" title="2000年2月26日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">26</div>
</td>
<td role="gridcell" title="2000年2月27日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">27</div>
</td>
</tr>
<tr role="row" class="">
<!---->
<td role="gridcell" title="2000年2月28日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">28</div>
</td>
<td role="gridcell" title="2000年2月29日" class="ant-calendar-cell ant-calendar-last-day-of-month">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">29</div>
</td>
<td role="gridcell" title="2000年3月1日" class="ant-calendar-cell ant-calendar-next-month-btn-day">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">1</div>
</td>
<td role="gridcell" title="2000年3月2日" class="ant-calendar-cell ant-calendar-next-month-btn-day">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">2</div>
</td>
<td role="gridcell" title="2000年3月3日" class="ant-calendar-cell ant-calendar-next-month-btn-day">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">3</div>
</td>
<td role="gridcell" title="2000年3月4日" class="ant-calendar-cell ant-calendar-next-month-btn-day">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">4</div>
</td>
<td role="gridcell" title="2000年3月5日" class="ant-calendar-cell ant-calendar-next-month-btn-day">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">5</div>
</td>
</tr>
<tr role="row" class="">
<!---->
<td role="gridcell" title="2000年3月6日" class="ant-calendar-cell ant-calendar-next-month-btn-day">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">6</div>
</td>
<td role="gridcell" title="2000年3月7日" class="ant-calendar-cell ant-calendar-next-month-btn-day">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">7</div>
</td>
<td role="gridcell" title="2000年3月8日" class="ant-calendar-cell ant-calendar-next-month-btn-day">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">8</div>
</td>
<td role="gridcell" title="2000年3月9日" class="ant-calendar-cell ant-calendar-next-month-btn-day">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">9</div>
</td>
<td role="gridcell" title="2000年3月10日" class="ant-calendar-cell ant-calendar-next-month-btn-day">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">10</div>
</td>
<td role="gridcell" title="2000年3月11日" class="ant-calendar-cell ant-calendar-next-month-btn-day">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">11</div>
</td>
<td role="gridcell" title="2000年3月12日" class="ant-calendar-cell ant-calendar-next-month-btn-day">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">12</div>
</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
<div class="ant-calendar-footer ant-calendar-range-bottom ant-calendar-footer-show-ok">
<div class="ant-calendar-footer-btn">
<!---->
<!----><a class="ant-calendar-time-picker-btn" role="button">select time</a><a class="ant-calendar-ok-btn" role="button">Ok</a></div>
</div>
</div>
</div>
</div>
</div>
</div></span></span>
</div>
`;
exports[`RangePicker switch to corresponding month panel when click presetted ranges 1`] = `
<span class="ant-calendar-picker ant-calendar-picker" style="width: 350px;" tabindex="0"><!--teleport start--><!--teleport end--><span class="ant-calendar-picker-input ant-input" style=""><input readonly="" placeholder="Start date" class="ant-calendar-range-picker-input" tabindex="-1"><span class="ant-calendar-range-picker-separator"> ~ </span><input readonly="" placeholder="End date" class="ant-calendar-range-picker-input" tabindex="-1"><span class="anticon anticon-close-circle ant-calendar-picker-clear" role="img" aria-label="close-circle" tabindex="-1"><svg class="" data-icon="close-circle" width="1em" height="1em" fill="currentColor" aria-hidden="true" viewBox="64 64 896 896" focusable="false"><path d="M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm165.4 618.2l-66-.3L512 563.4l-99.3 118.4-66.1.3c-4.4 0-8-3.5-8-8 0-1.9.7-3.7 1.9-5.2l130.1-155L340.5 359a8.32 8.32 0 01-1.9-5.2c0-4.4 3.6-8 8-8l66.1.3L512 464.6l99.3-118.4 66-.3c4.4 0 8 3.5 8 8 0 1.9-.7 3.7-1.9 5.2L553.5 514l130 155c1.2 1.5 1.9 3.3 1.9 5.2 0 4.4-3.6 8-8 8z"></path></svg></span><span class="ant-calendar-picker-icon"><!----></span>
<div style="position: absolute; top: 0px; left: 0px; width: 100%;">
<div>
<!---->
<div class="ant-calendar-picker-container ant-calendar-picker-container-placement-bottomLeft slide-up-enter" style="left: -999px; top: -1002px;">
<div class="ant-calendar-time ant-calendar-range-with-ranges ant-calendar-picker-container-content ant-calendar ant-calendar-range" tabindex="0">
<!---->
<div class="ant-calendar-panel">
<!---->
<div class="ant-calendar-date-panel">
<div class="ant-calendar-range-part ant-calendar-range-left">
<div class="ant-calendar-input-wrap">
<div class="ant-calendar-date-input-wrap"><input class="ant-calendar-input " placeholder="Start date"></div>
<!---->
</div>
<div style="outline: none;">
<div class="ant-calendar-header">
<div style="position: relative;"><a class="ant-calendar-prev-year-btn" role="button" title="Last year (Control + left)"></a><a class="ant-calendar-prev-month-btn" role="button" title="Previous month (PageUp)"></a><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>
<!---->
<!---->
</div>
<!---->
</div>
<!---->
<div class="ant-calendar-body">
<table class="ant-calendar-table" cellspacing="0" role="grid">
<thead>
<tr role="row">
<!---->
<th role="columnheader" title="周一" class="ant-calendar-column-header"><span class="ant-calendar-column-header-inner">一</span></th>
<th role="columnheader" title="周二" class="ant-calendar-column-header"><span class="ant-calendar-column-header-inner">二</span></th>
<th role="columnheader" title="周三" class="ant-calendar-column-header"><span class="ant-calendar-column-header-inner">三</span></th>
<th role="columnheader" title="周四" class="ant-calendar-column-header"><span class="ant-calendar-column-header-inner">四</span></th>
<th role="columnheader" title="周五" class="ant-calendar-column-header"><span class="ant-calendar-column-header-inner">五</span></th>
<th role="columnheader" title="周六" class="ant-calendar-column-header"><span class="ant-calendar-column-header-inner">六</span></th>
<th role="columnheader" title="周日" class="ant-calendar-column-header"><span class="ant-calendar-column-header-inner">日</span></th>
</tr>
</thead>
<tbody class="ant-calendar-tbody">
<tr role="row" class="ant-calendar-active-week">
<!---->
<td role="gridcell" title="1999年12月27日" class="ant-calendar-cell ant-calendar-last-month-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">27</div>
</td>
<td role="gridcell" title="1999年12月28日" class="ant-calendar-cell ant-calendar-last-month-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">28</div>
</td>
<td role="gridcell" title="1999年12月29日" class="ant-calendar-cell ant-calendar-last-month-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">29</div>
</td>
<td role="gridcell" title="1999年12月30日" class="ant-calendar-cell ant-calendar-last-month-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">30</div>
</td>
<td role="gridcell" title="1999年12月31日" class="ant-calendar-cell ant-calendar-last-month-cell ant-calendar-last-day-of-month">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">31</div>
</td>
<td role="gridcell" title="2000年1月1日" class="ant-calendar-cell ant-calendar-selected-start-date ant-calendar-selected-end-date ant-calendar-selected-day">
<div class="ant-calendar-date" aria-selected="true" aria-disabled="false">1</div>
</td>
<td role="gridcell" title="2000年1月2日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">2</div>
</td>
</tr>
<tr role="row" class="">
<!---->
<td role="gridcell" title="2000年1月3日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">3</div>
</td>
<td role="gridcell" title="2000年1月4日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">4</div>
</td>
<td role="gridcell" title="2000年1月5日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">5</div>
</td>
<td role="gridcell" title="2000年1月6日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">6</div>
</td>
<td role="gridcell" title="2000年1月7日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">7</div>
</td>
<td role="gridcell" title="2000年1月8日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">8</div>
</td>
<td role="gridcell" title="2000年1月9日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">9</div>
</td>
</tr>
<tr role="row" class="">
<!---->
<td role="gridcell" title="2000年1月10日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">10</div>
</td>
<td role="gridcell" title="2000年1月11日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">11</div>
</td>
<td role="gridcell" title="2000年1月12日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">12</div>
</td>
<td role="gridcell" title="2000年1月13日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">13</div>
</td>
<td role="gridcell" title="2000年1月14日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">14</div>
</td>
<td role="gridcell" title="2000年1月15日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">15</div>
</td>
<td role="gridcell" title="2000年1月16日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">16</div>
</td>
</tr>
<tr role="row" class="">
<!---->
<td role="gridcell" title="2000年1月17日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">17</div>
</td>
<td role="gridcell" title="2000年1月18日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">18</div>
</td>
<td role="gridcell" title="2000年1月19日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">19</div>
</td>
<td role="gridcell" title="2000年1月20日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">20</div>
</td>
<td role="gridcell" title="2000年1月21日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">21</div>
</td>
<td role="gridcell" title="2000年1月22日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">22</div>
</td>
<td role="gridcell" title="2000年1月23日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">23</div>
</td>
</tr>
<tr role="row" class="">
<!---->
<td role="gridcell" title="2000年1月24日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">24</div>
</td>
<td role="gridcell" title="2000年1月25日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">25</div>
</td>
<td role="gridcell" title="2000年1月26日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">26</div>
</td>
<td role="gridcell" title="2000年1月27日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">27</div>
</td>
<td role="gridcell" title="2000年1月28日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">28</div>
</td>
<td role="gridcell" title="2000年1月29日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">29</div>
</td>
<td role="gridcell" title="2000年1月30日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">30</div>
</td>
</tr>
<tr role="row" class="">
<!---->
<td role="gridcell" title="2000年1月31日" class="ant-calendar-cell ant-calendar-last-day-of-month">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">31</div>
</td>
<td role="gridcell" title="2000年2月1日" class="ant-calendar-cell ant-calendar-next-month-btn-day">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">1</div>
</td>
<td role="gridcell" title="2000年2月2日" class="ant-calendar-cell ant-calendar-next-month-btn-day">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">2</div>
</td>
<td role="gridcell" title="2000年2月3日" class="ant-calendar-cell ant-calendar-next-month-btn-day">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">3</div>
</td>
<td role="gridcell" title="2000年2月4日" class="ant-calendar-cell ant-calendar-next-month-btn-day">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">4</div>
</td>
<td role="gridcell" title="2000年2月5日" class="ant-calendar-cell ant-calendar-next-month-btn-day">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">5</div>
</td>
<td role="gridcell" title="2000年2月6日" class="ant-calendar-cell ant-calendar-next-month-btn-day">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">6</div>
</td>
</tr>
</tbody>
</table>
</div>
</div>
</div><span class="ant-calendar-range-middle">~</span>
<div class="ant-calendar-range-part ant-calendar-range-right">
<div class="ant-calendar-input-wrap">
<div class="ant-calendar-date-input-wrap"><input class="ant-calendar-input " placeholder="End date"></div>
<!---->
</div>
<div style="outline: none;">
<div class="ant-calendar-header">
<div style="position: relative;">
<!---->
<!----><span class="ant-calendar-my-select"><a class="ant-calendar-month-select" role="button" title="Choose a month">2月</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><a class="ant-calendar-next-year-btn" title="Next year (Control + right)"></a></div>
<!---->
</div>
<!---->
<div class="ant-calendar-body">
<table class="ant-calendar-table" cellspacing="0" role="grid">
<thead>
<tr role="row">
<!---->
<th role="columnheader" title="周一" class="ant-calendar-column-header"><span class="ant-calendar-column-header-inner">一</span></th>
<th role="columnheader" title="周二" class="ant-calendar-column-header"><span class="ant-calendar-column-header-inner">二</span></th>
<th role="columnheader" title="周三" class="ant-calendar-column-header"><span class="ant-calendar-column-header-inner">三</span></th>
<th role="columnheader" title="周四" class="ant-calendar-column-header"><span class="ant-calendar-column-header-inner">四</span></th>
<th role="columnheader" title="周五" class="ant-calendar-column-header"><span class="ant-calendar-column-header-inner">五</span></th>
<th role="columnheader" title="周六" class="ant-calendar-column-header"><span class="ant-calendar-column-header-inner">六</span></th>
<th role="columnheader" title="周日" class="ant-calendar-column-header"><span class="ant-calendar-column-header-inner">日</span></th>
</tr>
</thead>
<tbody class="ant-calendar-tbody">
<tr role="row" class="">
<!---->
<td role="gridcell" title="2000年1月31日" class="ant-calendar-cell ant-calendar-last-month-cell ant-calendar-last-day-of-month">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">31</div>
</td>
<td role="gridcell" title="2000年2月1日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">1</div>
</td>
<td role="gridcell" title="2000年2月2日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">2</div>
</td>
<td role="gridcell" title="2000年2月3日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">3</div>
</td>
<td role="gridcell" title="2000年2月4日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">4</div>
</td>
<td role="gridcell" title="2000年2月5日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">5</div>
</td>
<td role="gridcell" title="2000年2月6日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">6</div>
</td>
</tr>
<tr role="row" class="">
<!---->
<td role="gridcell" title="2000年2月7日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">7</div>
</td>
<td role="gridcell" title="2000年2月8日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">8</div>
</td>
<td role="gridcell" title="2000年2月9日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">9</div>
</td>
<td role="gridcell" title="2000年2月10日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">10</div>
</td>
<td role="gridcell" title="2000年2月11日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">11</div>
</td>
<td role="gridcell" title="2000年2月12日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">12</div>
</td>
<td role="gridcell" title="2000年2月13日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">13</div>
</td>
</tr>
<tr role="row" class="">
<!---->
<td role="gridcell" title="2000年2月14日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">14</div>
</td>
<td role="gridcell" title="2000年2月15日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">15</div>
</td>
<td role="gridcell" title="2000年2月16日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">16</div>
</td>
<td role="gridcell" title="2000年2月17日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">17</div>
</td>
<td role="gridcell" title="2000年2月18日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">18</div>
</td>
<td role="gridcell" title="2000年2月19日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">19</div>
</td>
<td role="gridcell" title="2000年2月20日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">20</div>
</td>
</tr>
<tr role="row" class="">
<!---->
<td role="gridcell" title="2000年2月21日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">21</div>
</td>
<td role="gridcell" title="2000年2月22日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">22</div>
</td>
<td role="gridcell" title="2000年2月23日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">23</div>
</td>
<td role="gridcell" title="2000年2月24日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">24</div>
</td>
<td role="gridcell" title="2000年2月25日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">25</div>
</td>
<td role="gridcell" title="2000年2月26日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">26</div>
</td>
<td role="gridcell" title="2000年2月27日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">27</div>
</td>
</tr>
<tr role="row" class="">
<!---->
<td role="gridcell" title="2000年2月28日" class="ant-calendar-cell">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">28</div>
</td>
<td role="gridcell" title="2000年2月29日" class="ant-calendar-cell ant-calendar-last-day-of-month">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">29</div>
</td>
<td role="gridcell" title="2000年3月1日" class="ant-calendar-cell ant-calendar-next-month-btn-day">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">1</div>
</td>
<td role="gridcell" title="2000年3月2日" class="ant-calendar-cell ant-calendar-next-month-btn-day">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">2</div>
</td>
<td role="gridcell" title="2000年3月3日" class="ant-calendar-cell ant-calendar-next-month-btn-day">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">3</div>
</td>
<td role="gridcell" title="2000年3月4日" class="ant-calendar-cell ant-calendar-next-month-btn-day">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">4</div>
</td>
<td role="gridcell" title="2000年3月5日" class="ant-calendar-cell ant-calendar-next-month-btn-day">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">5</div>
</td>
</tr>
<tr role="row" class="">
<!---->
<td role="gridcell" title="2000年3月6日" class="ant-calendar-cell ant-calendar-next-month-btn-day">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">6</div>
</td>
<td role="gridcell" title="2000年3月7日" class="ant-calendar-cell ant-calendar-next-month-btn-day">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">7</div>
</td>
<td role="gridcell" title="2000年3月8日" class="ant-calendar-cell ant-calendar-next-month-btn-day">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">8</div>
</td>
<td role="gridcell" title="2000年3月9日" class="ant-calendar-cell ant-calendar-next-month-btn-day">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">9</div>
</td>
<td role="gridcell" title="2000年3月10日" class="ant-calendar-cell ant-calendar-next-month-btn-day">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">10</div>
</td>
<td role="gridcell" title="2000年3月11日" class="ant-calendar-cell ant-calendar-next-month-btn-day">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">11</div>
</td>
<td role="gridcell" title="2000年3月12日" class="ant-calendar-cell ant-calendar-next-month-btn-day">
<div class="ant-calendar-date" aria-selected="false" aria-disabled="false">12</div>
</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
<div class="ant-calendar-footer ant-calendar-range-bottom ant-calendar-footer-show-ok">
<div class="ant-calendar-footer-btn">
<div class="ant-calendar-footer-extra ant-calendar-range-quick-selector"><span class="ant-tag ant-tag-blue">My Birthday<!----></span></div>
<!---->
<!----><a class="ant-calendar-time-picker-btn" role="button">select time</a><a class="ant-calendar-ok-btn" role="button">Ok</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div></span></span>
`;