test/ant-design
1
0
Fork 0
mirror of https://gitee.com/ant-design/ant-design.git synced 2024-11-30 19:19:26 +08:00
Code Issues Actions 68 Packages Projects Releases Wiki Activity

refactor: reduce table nested level (#4869)

Browse Source 
* reduce table nested level, #4868

* update table snapshot
This commit is contained in:
偏右 2017-02-16 15:36:34 +08:00 committed by Benjy Cui
parent 1c24600f8f
commit 4c0af2ba1f
6 changed files with 7464 additions and 7614 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

84
components/locale-provider/__tests__/__snapshots__/demo.test.js.snap
View File

@ -1146,56 +1146,50 @@ exports[`test renders ./components/locale-provider/demo/all.md correctly 1`] = `
<div
class="example">
<div
class=" clearfix">
class="">
<div
class="ant-spin-nested-loading">
class="ant-table ant-table-large ant-table-empty ant-table-scroll-position-left">
<div
class="ant-spin-container">
class="ant-table-content">
<div
class="ant-table ant-table-large ant-table-empty ant-table-scroll-position-left">
<div
class="ant-table-content">
class="">
<span>
<div
class="">
<span>
<div
class="ant-table-body">
<table
class="">
<colgroup>
<col />
<col />
</colgroup>
<thead
class="ant-table-thead">
<tr>
<th
class="">
<span>
Name
<i
class="anticon anticon-filter ant-dropdown-trigger"
title="Filter Menu" />
</span>
</th>
<th
class="">
<span>
Age
</span>
</th>
</tr>
</thead>
<tbody
class="ant-table-tbody" />
</table>
</div>
</span>
<div
class="ant-table-placeholder">
No Data
</div>
class="ant-table-body">
<table
class="">
<colgroup>
<col />
<col />
</colgroup>
<thead
class="ant-table-thead">
<tr>
<th
class="">
<span>
Name
<i
class="anticon anticon-filter ant-dropdown-trigger"
title="Filter Menu" />
</span>
</th>
<th
class="">
<span>
Age
</span>
</th>
</tr>
</thead>
<tbody
class="ant-table-tbody" />
</table>
</div>
</span>
<div
class="ant-table-placeholder">
No Data
</div>
</div>
</div>

24
components/table/Table.tsx
View File

@ -720,6 +720,7 @@ export default class Table<T> extends React.Component<TableProps<T>, any> {
let total = pagination.total || this.getLocalData().length;
return (total > 0) ?
<Pagination
key="pagination"
{...pagination}
className={`${this.props.prefixCls}-pagination`}
onChange={this.handlePageChange}
@ -829,7 +830,7 @@ export default class Table<T> extends React.Component<TableProps<T>, any> {
}
render() {
const { style, className, prefixCls, showHeader, ...restProps } = this.props;
const { style, className, prefixCls, showHeader, loading, ...restProps } = this.props;
const data = this.getCurrentPageData();
let columns = this.renderRowSelection();
const expandIconAsCell = this.props.expandedRowRender && this.props.expandIconAsCell !== false;
@ -854,8 +855,9 @@ export default class Table<T> extends React.Component<TableProps<T>, any> {
expandIconColumnIndex = restProps.expandIconColumnIndex as number;
}
let table = (
const table = (
<RcTable
key="table"
{...restProps}
prefixCls={prefixCls}
data={data}
@ -867,18 +869,22 @@ export default class Table<T> extends React.Component<TableProps<T>, any> {
emptyText={() => locale.emptyText}
/>
);
// if there is no pagination or no data,
// the height of spin should decrease by half of pagination
const paginationPatchClass = (this.hasPagination() && data && data.length !== 0)
? `${prefixCls}-with-pagination`
: `${prefixCls}-without-pagination`;
const spinClassName = this.props.loading ? `${paginationPatchClass} ${prefixCls}-spin-holder` : '';
return (
<div className={`${className} clearfix`} style={style}>
<Spin className={spinClassName} spinning={this.props.loading}>
? `${prefixCls}-with-pagination` : `${prefixCls}-without-pagination`;
const tableWithSpin = loading ? (
<Spin className={loading ? `${paginationPatchClass} ${prefixCls}-spin-holder` : ''}>
{table}
{this.renderPagination()}
</Spin>
</Spin>
) : [table, this.renderPagination()];
return (
<div className={className} style={style}>
{tableWithSpin}
</div>
);
}

146
components/table/__tests__/__snapshots__/Table.filter.test.js.snap
View File

@ -14,87 +14,81 @@ exports[`Table.filter renders custom content correctly 1`] = `
exports[`Table.filter renders filter correctly 1`] = `
<div
class=" clearfix">
class="">
<div
class="ant-spin-nested-loading">
class="ant-table ant-table-large ant-table-scroll-position-left">
<div
class="ant-spin-container">
class="ant-table-content">
<div
class="ant-table ant-table-large ant-table-scroll-position-left">
<div
class="ant-table-content">
class="">
<span>
<div
class="">
<span>
<div
class="ant-table-body">
<table
class="">
<colgroup>
<col />
</colgroup>
<thead
class="ant-table-thead">
<tr>
<th
class="">
<span>
Name
<i
class="anticon anticon-filter ant-dropdown-trigger"
title="筛选" />
</span>
</th>
</tr>
</thead>
<tbody
class="ant-table-tbody">
<tr
class="ant-table-row ant-table-row-level-0">
<td
class="">
<span
class="ant-table-row-indent indent-level-0"
style="padding-left:0px;" />
Jack
</td>
</tr>
<tr
class="ant-table-row ant-table-row-level-0">
<td
class="">
<span
class="ant-table-row-indent indent-level-0"
style="padding-left:0px;" />
Lucy
</td>
</tr>
<tr
class="ant-table-row ant-table-row-level-0">
<td
class="">
<span
class="ant-table-row-indent indent-level-0"
style="padding-left:0px;" />
Tom
</td>
</tr>
<tr
class="ant-table-row ant-table-row-level-0">
<td
class="">
<span
class="ant-table-row-indent indent-level-0"
style="padding-left:0px;" />
Jerry
</td>
</tr>
</tbody>
</table>
</div>
</span>
class="ant-table-body">
<table
class="">
<colgroup>
<col />
</colgroup>
<thead
class="ant-table-thead">
<tr>
<th
class="">
<span>
Name
<i
class="anticon anticon-filter ant-dropdown-trigger"
title="筛选" />
</span>
</th>
</tr>
</thead>
<tbody
class="ant-table-tbody">
<tr
class="ant-table-row ant-table-row-level-0">
<td
class="">
<span
class="ant-table-row-indent indent-level-0"
style="padding-left:0px;" />
Jack
</td>
</tr>
<tr
class="ant-table-row ant-table-row-level-0">
<td
class="">
<span
class="ant-table-row-indent indent-level-0"
style="padding-left:0px;" />
Lucy
</td>
</tr>
<tr
class="ant-table-row ant-table-row-level-0">
<td
class="">
<span
class="ant-table-row-indent indent-level-0"
style="padding-left:0px;" />
Tom
</td>
</tr>
<tr
class="ant-table-row ant-table-row-level-0">
<td
class="">
<span
class="ant-table-row-indent indent-level-0"
style="padding-left:0px;" />
Jerry
</td>
</tr>
</tbody>
</table>
</div>
</div>
</span>
</div>
</div>
</div>

156
components/table/__tests__/__snapshots__/Table.pagination.test.js.snap
View File

@ -1,93 +1,87 @@
exports[`Table.pagination renders pagination correctly 1`] = `
<div
class=" clearfix">
class="">
<div
class="ant-spin-nested-loading">
class="ant-table ant-table-large ant-table-scroll-position-left">
<div
class="ant-spin-container">
class="ant-table-content">
<div
class="ant-table ant-table-large ant-table-scroll-position-left">
<div
class="ant-table-content">
class="">
<span>
<div
class="">
<span>
<div
class="ant-table-body">
<table
class="">
<colgroup>
<col />
</colgroup>
<thead
class="ant-table-thead">
<tr>
<th
class="">
<span>
Name
</span>
</th>
</tr>
</thead>
<tbody
class="ant-table-tbody">
<tr
class="ant-table-row ant-table-row-level-0">
<td
class="">
<span
class="ant-table-row-indent indent-level-0"
style="padding-left:0px;" />
Jack
</td>
</tr>
<tr
class="ant-table-row ant-table-row-level-0">
<td
class="">
<span
class="ant-table-row-indent indent-level-0"
style="padding-left:0px;" />
Lucy
</td>
</tr>
</tbody>
</table>
</div>
</span>
class="ant-table-body">
<table
class="">
<colgroup>
<col />
</colgroup>
<thead
class="ant-table-thead">
<tr>
<th
class="">
<span>
Name
</span>
</th>
</tr>
</thead>
<tbody
class="ant-table-tbody">
<tr
class="ant-table-row ant-table-row-level-0">
<td
class="">
<span
class="ant-table-row-indent indent-level-0"
style="padding-left:0px;" />
Jack
</td>
</tr>
<tr
class="ant-table-row ant-table-row-level-0">
<td
class="">
<span
class="ant-table-row-indent indent-level-0"
style="padding-left:0px;" />
Lucy
</td>
</tr>
</tbody>
</table>
</div>
</div>
</span>
</div>
<ul
class="ant-pagination ant-table-pagination"
unselectable="unselectable">
<li
class="ant-pagination-disabled ant-pagination-prev"
title="上一页">
<a />
</li>
<li
class="ant-pagination-item ant-pagination-item-1 ant-pagination-item-active"
title="1">
<a>
1
</a>
</li>
<li
class="ant-pagination-item ant-pagination-item-2"
title="2">
<a>
2
</a>
</li>
<li
class=" ant-pagination-next"
title="下一页">
<a />
</li>
</ul>
</div>
</div>
<ul
class="ant-pagination ant-table-pagination"
unselectable="unselectable">
<li
class="ant-pagination-disabled ant-pagination-prev"
title="上一页">
<a />
</li>
<li
class="ant-pagination-item ant-pagination-item-1 ant-pagination-item-active"
title="1">
<a>
1
</a>
</li>
<li
class="ant-pagination-item ant-pagination-item-2"
title="2">
<a>
2
</a>
</li>
<li
class=" ant-pagination-next"
title="下一页">
<a />
</li>
</ul>
</div>
`;

180
components/table/__tests__/__snapshots__/Table.test.js.snap
View File

@ -1,103 +1,97 @@
exports[`Table renders JSX correctly 1`] = `
<div
class=" clearfix">
class="">
<div
class="ant-spin-nested-loading">
class="ant-table ant-table-large ant-table-scroll-position-left">
<div
class="ant-spin-container">
class="ant-table-content">
<div
class="ant-table ant-table-large ant-table-scroll-position-left">
<div
class="ant-table-content">
class="">
<span>
<div
class="">
<span>
<div
class="ant-table-body">
<table
class="">
<colgroup>
<col />
<col />
<col />
</colgroup>
<thead
class="ant-table-thead">
<tr>
<th
class=""
colspan="2">
<span>
Name
</span>
</th>
<th
class=""
rowspan="2">
<span>
Age
</span>
</th>
</tr>
<tr>
<th
class="">
<span>
First Name
</span>
</th>
<th
class="">
<span>
Last Name
</span>
</th>
</tr>
</thead>
<tbody
class="ant-table-tbody">
<tr
class="ant-table-row ant-table-row-level-0">
<td
class="">
<span
class="ant-table-row-indent indent-level-0"
style="padding-left:0px;" />
John
</td>
<td
class="">
Brown
</td>
<td
class="">
32
</td>
</tr>
<tr
class="ant-table-row ant-table-row-level-0">
<td
class="">
<span
class="ant-table-row-indent indent-level-0"
style="padding-left:0px;" />
Jim
</td>
<td
class="">
Green
</td>
<td
class="">
42
</td>
</tr>
</tbody>
</table>
</div>
</span>
class="ant-table-body">
<table
class="">
<colgroup>
<col />
<col />
<col />
</colgroup>
<thead
class="ant-table-thead">
<tr>
<th
class=""
colspan="2">
<span>
Name
</span>
</th>
<th
class=""
rowspan="2">
<span>
Age
</span>
</th>
</tr>
<tr>
<th
class="">
<span>
First Name
</span>
</th>
<th
class="">
<span>
Last Name
</span>
</th>
</tr>
</thead>
<tbody
class="ant-table-tbody">
<tr
class="ant-table-row ant-table-row-level-0">
<td
class="">
<span
class="ant-table-row-indent indent-level-0"
style="padding-left:0px;" />
John
</td>
<td
class="">
Brown
</td>
<td
class="">
32
</td>
</tr>
<tr
class="ant-table-row ant-table-row-level-0">
<td
class="">
<span
class="ant-table-row-indent indent-level-0"
style="padding-left:0px;" />
Jim
</td>
<td
class="">
Green
</td>
<td
class="">
42
</td>
</tr>
</tbody>
</table>
</div>
</div>
</span>
</div>
</div>
</div>

14488
components/table/__tests__/__snapshots__/demo.test.js.snap
View File

File diff suppressed because it is too large Load Diff