mirror/ant-design
1
0
Fork 0
mirror of https://github.com/ant-design/ant-design.git synced 2024-11-28 05:05:48 +08:00
Code Issues Actions 43 Packages Projects Releases Wiki Activity

refactor: Optimize default selection column width implement (#15990)

Browse Source 
* 🔨 Optimize default selection column width implement

make it be able to overrided in css

close #15968

* ✅ update snapshots
This commit is contained in:
偏右 2019-04-11 00:54:46 +08:00 committed by zombieJ
parent dcdd7fb414
commit d922c377cb
6 changed files with 13 additions and 26 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
components/table/Table.tsx
View File

@ -59,8 +59,6 @@ const defaultPagination = {
onShowSizeChange: noop,
};
const ROW_SELECTION_COLUMN_WIDTH = '62px';
/**
* Avoid creating new object, so that parent component's shouldComponentUpdate
* can works appropriately。
@ -775,7 +773,7 @@ export default class Table<T> extends React.Component<TableProps<T>, TableState<
render: this.renderSelectionBox(rowSelection.type),
className: selectionColumnClass,
fixed: rowSelection.fixed,
width: rowSelection.columnWidth || ROW_SELECTION_COLUMN_WIDTH,
width: rowSelection.columnWidth,
title: rowSelection.columnTitle,
};
if (rowSelection.type !== 'radio') {

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

@ -26,9 +26,7 @@ exports[`Table.rowSelection fix selection column on the left 1`] = `
class=""
>
<colgroup>
<col
style="width:62px;min-width:62px"
/>
<col />
<col />
</colgroup>
<thead
@ -252,9 +250,7 @@ exports[`Table.rowSelection fix selection column on the left 1`] = `
class="ant-table-fixed"
>
<colgroup>
<col
style="width:62px;min-width:62px"
/>
<col />
</colgroup>
<thead
class="ant-table-thead"

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

@ -2411,9 +2411,7 @@ exports[`renders ./components/table/demo/dynamic-settings.md correctly 1`] = `
<col
class="ant-table-expand-icon-col"
/>
<col
style="width:62px;min-width:62px"
/>
<col />
<col
style="width:150px;min-width:150px"
/>
@ -4827,9 +4825,7 @@ exports[`renders ./components/table/demo/expand-children.md correctly 1`] = `
class=""
>
<colgroup>
<col
style="width:62px;min-width:62px"
/>
<col />
<col />
<col
style="width:12%;min-width:12%"
@ -12343,9 +12339,7 @@ exports[`renders ./components/table/demo/row-selection.md correctly 1`] = `
class=""
>
<colgroup>
<col
style="width:62px;min-width:62px"
/>
<col />
<col />
<col />
<col />
@ -12770,9 +12764,7 @@ exports[`renders ./components/table/demo/row-selection-and-operation.md correctl
class=""
>
<colgroup>
<col
style="width:62px;min-width:62px"
/>
<col />
<col />
<col />
<col />
@ -13467,9 +13459,7 @@ exports[`renders ./components/table/demo/row-selection-custom.md correctly 1`] =
class=""
>
<colgroup>
<col
style="width:62px;min-width:62px"
/>
<col />
<col />
<col />
<col />

2
components/table/index.en-US.md
View File

@ -157,7 +157,7 @@ Properties for row selection.
| Property | Description | Type | Default |
| -------- | ----------- | ---- | ------- |
| columnWidth | Set the width of the selection column | string\|number | - |
| columnWidth | Set the width of the selection column | string\|number | `60px` |
| columnTitle | Set the title of the selection column | string\|React.ReactNode | - |
| fixed | Fixed selection column on the left | boolean | - |
| getCheckboxProps | Get Checkbox or Radio props | Function(record) | - |

2
components/table/index.zh-CN.md
View File

@ -162,7 +162,7 @@ const columns = [{
| 参数 | 说明 | 类型 | 默认值 |
| --- | --- | --- | --- |
| columnWidth | 自定义列表选择框宽度 | string\|number | - |
| columnWidth | 自定义列表选择框宽度 | string\|number | `60px` |
| columnTitle | 自定义列表选择框标题 | string\|React.ReactNode | - |
| fixed | 把选择框列固定在左边 | boolean | - |
| getCheckboxProps | 选择框的默认属性配置 | Function(record) | - |

3
components/table/style/index.less
View File

@ -5,6 +5,7 @@
@table-header-icon-color: #bfbfbf;
@table-header-sort-active-bg: darken(@table-header-bg, 3%);
@table-header-filter-active-bg: darken(@table-header-sort-active-bg, 5%);
@table-selection-column-width: 60px;
.@{table-prefix-cls}-wrapper {
.clearfix;
@ -315,7 +316,9 @@
&-thead > tr > th.@{table-prefix-cls}-selection-column,
&-tbody > tr > td.@{table-prefix-cls}-selection-column {
width: @table-selection-column-width;
text-align: center;
.@{ant-prefix}-radio-wrapper {
margin-right: 0;
}