Skip to content

Commit

Permalink
Merge pull request #125 from react-component/fix-fixed-column-and-header
Browse files Browse the repository at this point in the history 
fix: should not rely on z-index
  • Loading branch information
@afc163
afc163 committed Feb 22, 2017
2 parents d416737 + 5fb55ac commit 61a6205
Show file tree
Hide file tree
Showing 3 changed files with 150 additions and 151 deletions.
1 change: 0 additions & 1 deletion assets/index.less
View file
Original file line number Diff line number Diff line change
Expand Up @@ -169,7 +169,6 @@
position: absolute;
top: 0;
overflow: hidden;
z-index: 1;
table {
width: auto;
background: #fff;
Expand Down
8 changes: 4 additions & 4 deletions src/Table.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -709,15 +709,15 @@ export default class Table extends React.Component {
<div ref={node => (this.tableNode = node)} className={className} style={props.style}>
{this.getTitle()}
<div className={`${prefixCls}-content`}>
{this.columnManager.isAnyColumnsLeftFixed() &&
<div className={`${prefixCls}-fixed-left`}>
{this.getLeftFixedTable()}
</div>}
<div className={isTableScroll ? `${prefixCls}-scroll` : ''}>
{this.getTable({ columns: this.columnManager.groupedColumns() })}
{this.getEmptyText()}
{this.getFooter()}
</div>
{this.columnManager.isAnyColumnsLeftFixed() &&
<div className={`${prefixCls}-fixed-left`}>
{this.getLeftFixedTable()}
</div>}
{this.columnManager.isAnyColumnsRightFixed() &&
<div className={`${prefixCls}-fixed-right`}>
{this.getRightFixedTable()}
Expand Down
292 changes: 146 additions & 146 deletions tests/__snapshots__/Table.fixedColumns.spec.js.snap
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,152 +3,6 @@ exports[`Table.fixedColumns renders correctly 1`] = `
class="rc-table rc-table-scroll-position-left">
<div
class="rc-table-content">
<div
class="rc-table-fixed-left">
<div
class="rc-table-body-outer">
<div
class="rc-table-body-inner">
<table
class="rc-table-fixed">
<colgroup>
<col
style="width:100px;min-width:100px;" />
<col
style="width:100px;min-width:100px;" />
</colgroup>
<thead
class="rc-table-thead">
<tr>
<th
class="">
title1
</th>
<th
class="">
title2
</th>
</tr>
</thead>
<tbody
class="rc-table-tbody">
<tr
class="rc-table-row rc-table-row-level-0">
<td
class="">
<span
class="rc-table-row-indent indent-level-0"
style="padding-left:0px;" />
123
</td>
<td
class="">
xxxxxxxx
</td>
</tr>
<tr
class="rc-table-row rc-table-row-level-0">
<td
class="">
<span
class="rc-table-row-indent indent-level-0"
style="padding-left:0px;" />
cdd
</td>
<td
class="">
edd12221
</td>
</tr>
<tr
class="rc-table-row rc-table-row-level-0">
<td
class="">
<span
class="rc-table-row-indent indent-level-0"
style="padding-left:0px;" />
133
</td>
<td
class="" />
</tr>
<tr
class="rc-table-row rc-table-row-level-0">
<td
class="">
<span
class="rc-table-row-indent indent-level-0"
style="padding-left:0px;" />
133
</td>
<td
class="" />
</tr>
<tr
class="rc-table-row rc-table-row-level-0">
<td
class="">
<span
class="rc-table-row-indent indent-level-0"
style="padding-left:0px;" />
133
</td>
<td
class="" />
</tr>
<tr
class="rc-table-row rc-table-row-level-0">
<td
class="">
<span
class="rc-table-row-indent indent-level-0"
style="padding-left:0px;" />
133
</td>
<td
class="" />
</tr>
<tr
class="rc-table-row rc-table-row-level-0">
<td
class="">
<span
class="rc-table-row-indent indent-level-0"
style="padding-left:0px;" />
133
</td>
<td
class="" />
</tr>
<tr
class="rc-table-row rc-table-row-level-0">
<td
class="">
<span
class="rc-table-row-indent indent-level-0"
style="padding-left:0px;" />
133
</td>
<td
class="" />
</tr>
<tr
class="rc-table-row rc-table-row-level-0">
<td
class="">
<span
class="rc-table-row-indent indent-level-0"
style="padding-left:0px;" />
133
</td>
<td
class="" />
</tr>
</tbody>
</table>
</div>
</div>
</div>
<div
class="rc-table-scroll">
<div
Expand Down Expand Up @@ -575,6 +429,152 @@ exports[`Table.fixedColumns renders correctly 1`] = `
</table>
</div>
</div>
<div
class="rc-table-fixed-left">
<div
class="rc-table-body-outer">
<div
class="rc-table-body-inner">
<table
class="rc-table-fixed">
<colgroup>
<col
style="width:100px;min-width:100px;" />
<col
style="width:100px;min-width:100px;" />
</colgroup>
<thead
class="rc-table-thead">
<tr>
<th
class="">
title1
</th>
<th
class="">
title2
</th>
</tr>
</thead>
<tbody
class="rc-table-tbody">
<tr
class="rc-table-row rc-table-row-level-0">
<td
class="">
<span
class="rc-table-row-indent indent-level-0"
style="padding-left:0px;" />
123
</td>
<td
class="">
xxxxxxxx
</td>
</tr>
<tr
class="rc-table-row rc-table-row-level-0">
<td
class="">
<span
class="rc-table-row-indent indent-level-0"
style="padding-left:0px;" />
cdd
</td>
<td
class="">
edd12221
</td>
</tr>
<tr
class="rc-table-row rc-table-row-level-0">
<td
class="">
<span
class="rc-table-row-indent indent-level-0"
style="padding-left:0px;" />
133
</td>
<td
class="" />
</tr>
<tr
class="rc-table-row rc-table-row-level-0">
<td
class="">
<span
class="rc-table-row-indent indent-level-0"
style="padding-left:0px;" />
133
</td>
<td
class="" />
</tr>
<tr
class="rc-table-row rc-table-row-level-0">
<td
class="">
<span
class="rc-table-row-indent indent-level-0"
style="padding-left:0px;" />
133
</td>
<td
class="" />
</tr>
<tr
class="rc-table-row rc-table-row-level-0">
<td
class="">
<span
class="rc-table-row-indent indent-level-0"
style="padding-left:0px;" />
133
</td>
<td
class="" />
</tr>
<tr
class="rc-table-row rc-table-row-level-0">
<td
class="">
<span
class="rc-table-row-indent indent-level-0"
style="padding-left:0px;" />
133
</td>
<td
class="" />
</tr>
<tr
class="rc-table-row rc-table-row-level-0">
<td
class="">
<span
class="rc-table-row-indent indent-level-0"
style="padding-left:0px;" />
133
</td>
<td
class="" />
</tr>
<tr
class="rc-table-row rc-table-row-level-0">
<td
class="">
<span
class="rc-table-row-indent indent-level-0"
style="padding-left:0px;" />
133
</td>
<td
class="" />
</tr>
</tbody>
</table>
</div>
</div>
</div>
<div
class="rc-table-fixed-right">
<div
Expand Down

0 comments on commit 61a6205

Please sign in to comment.