change some
This commit is contained in:
BoyuZhou
parent
16b56350fb
commit
c23e4597ca
|
|
@ -1,6 +1,10 @@
|
|||
@import "../node_modules/tinper-bee-core/scss/index.scss";
|
||||
@import "../src/Table.scss";
|
||||
@import "../node_modules/bee-panel/src/Panel.scss";
|
||||
@import "../node_modules/bee-layout/src/Layout.scss";
|
||||
@import "../node_modules/bee-button/src/Button.scss";
|
||||
@import "../node_modules/bee-transition/src/Transition.scss";
|
||||
@import "../node_modules/bee-transition/src/Transition.scss";
|
||||
@import "../src/animation.scss";
|
||||
@import "../src/bordered.scss";
|
||||
@import "../src/index.scss";
|
||||
@import "../node_modules/bee-dropdown/src/Dropdown.scss";
|
||||
@import "../node_modules/bee-menus/src/Menus.scss";
|
||||
|
|
|
|||
|
|
@ -4,12 +4,64 @@
|
|||
* @description 这是描述
|
||||
*
|
||||
*/
|
||||
class Demo1 extends Component {
|
||||
render () {
|
||||
return (
|
||||
<div>
|
||||
欢迎使用老赵DEMO系统
|
||||
</div>
|
||||
)
|
||||
class Demo1 extends React.Component {
|
||||
constructor(props) {
|
||||
super(props);
|
||||
this.columns = [
|
||||
{ title: 'title1', dataIndex: 'a', key: 'a', width: 100 },
|
||||
{ id: '123', title: 'title2', dataIndex: 'b', key: 'b', width: 100 },
|
||||
{ title: 'title3', dataIndex: 'c', key: 'c', width: 200 },
|
||||
{
|
||||
title: 'Operations', dataIndex: '', key: 'd', render: (text, record) =>
|
||||
<a onClick={e => this.onDelete(record.key, e)} href="#">Delete</a>,
|
||||
},
|
||||
];
|
||||
this.state = {
|
||||
data: [
|
||||
{ a: '123', key: '1' },
|
||||
{ a: 'cdd', b: 'edd', key: '2' },
|
||||
{ a: '1333', c: 'eee', key: '3' },
|
||||
],
|
||||
};
|
||||
}
|
||||
|
||||
onDelete(key, e) {
|
||||
console.log('Delete', key);
|
||||
e.preventDefault();
|
||||
const data = this.state.data.filter(item => item.key !== key);
|
||||
this.setState({ data });
|
||||
}
|
||||
|
||||
onAdd() {
|
||||
const data = [...this.state.data];
|
||||
data.push({
|
||||
a: 'new data',
|
||||
b: 'new data',
|
||||
c: 'new data',
|
||||
key: Date.now(),
|
||||
});
|
||||
this.setState({ data });
|
||||
}
|
||||
|
||||
getBodyWrapper(body) {
|
||||
return (
|
||||
<Animate transitionName="move" component="tbody" className={body.props.className}>
|
||||
{body.props.children}
|
||||
</Animate>
|
||||
);
|
||||
}
|
||||
|
||||
render() {
|
||||
return (
|
||||
<div style={{ margin: 20 }}>
|
||||
<h2>Table row with animation</h2>
|
||||
<button onClick={() => this.onAdd()}>添加</button>
|
||||
<Table
|
||||
columns={this.columns}
|
||||
data={this.state.data}
|
||||
getBodyWrapper={this.getBodyWrapper}
|
||||
/>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,90 @@
|
|||
/**
|
||||
*
|
||||
* @title 这是标题
|
||||
* @description 这是描述
|
||||
*
|
||||
*/
|
||||
|
||||
const columns1 = [{
|
||||
title: 'Name',
|
||||
dataIndex: 'name',
|
||||
key: 'name',
|
||||
width: 400,
|
||||
}, {
|
||||
title: 'Age',
|
||||
dataIndex: 'age',
|
||||
key: 'age',
|
||||
width: 100,
|
||||
}, {
|
||||
title: 'Address',
|
||||
dataIndex: 'address',
|
||||
key: 'address',
|
||||
width: 200,
|
||||
}, {
|
||||
title: 'Operations',
|
||||
dataIndex: 'operation',
|
||||
key: 'x',
|
||||
width: 150,
|
||||
}];
|
||||
|
||||
const data1 = [{
|
||||
key: 1,
|
||||
name: 'a',
|
||||
age: 32,
|
||||
address: 'I am a',
|
||||
children: [{
|
||||
key: 11,
|
||||
name: 'aa',
|
||||
age: 33,
|
||||
address: 'I am aa',
|
||||
}, {
|
||||
key: 12,
|
||||
name: 'ab',
|
||||
age: 33,
|
||||
address: 'I am ab',
|
||||
children: [{
|
||||
key: 121,
|
||||
name: 'aba',
|
||||
age: 33,
|
||||
address: 'I am aba',
|
||||
}],
|
||||
}, {
|
||||
key: 13,
|
||||
name: 'ac',
|
||||
age: 33,
|
||||
address: 'I am ac',
|
||||
children: [{
|
||||
key: 131,
|
||||
name: 'aca',
|
||||
age: 33,
|
||||
address: 'I am aca',
|
||||
children: [{
|
||||
key: 1311,
|
||||
name: 'acaa',
|
||||
age: 33,
|
||||
address: 'I am acaa',
|
||||
}, {
|
||||
key: 1312,
|
||||
name: 'acab',
|
||||
age: 33,
|
||||
address: 'I am acab',
|
||||
}],
|
||||
}],
|
||||
}],
|
||||
}, {
|
||||
key: 2,
|
||||
name: 'b',
|
||||
age: 32,
|
||||
address: 'I am b',
|
||||
}];
|
||||
|
||||
function onExpand(expanded, record) {
|
||||
console.log('onExpand', expanded, record);
|
||||
}
|
||||
class Demo2 extends Component {
|
||||
render () {
|
||||
return (
|
||||
<Table defaultExpandAllRows columns={columns1} data={data1} indentSize={30} onExpand={onExpand} />
|
||||
)
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,49 @@
|
|||
/**
|
||||
*
|
||||
* @title 这是标题
|
||||
* @description 这是描述
|
||||
*
|
||||
*/
|
||||
|
||||
const columns2 = [
|
||||
{ title: 'title1', dataIndex: 'a',
|
||||
className: 'a',
|
||||
key: 'a', width: 100 },
|
||||
{ id: '123', title: 'title2', dataIndex: 'b',
|
||||
className: 'b',
|
||||
key: 'b', width: 100 },
|
||||
{ title: 'title3', dataIndex: 'c',
|
||||
className: 'c',
|
||||
key: 'c', width: 200 },
|
||||
{
|
||||
title: 'Operations', dataIndex: '',
|
||||
className: 'd',
|
||||
key: 'd', render() {
|
||||
return <a href="#">Operations</a>;
|
||||
},
|
||||
},
|
||||
];
|
||||
|
||||
const data2 = [
|
||||
{ a: '123', key: '1' },
|
||||
{ a: 'cdd', b: 'edd', key: '2' },
|
||||
{ a: '1333', c: 'eee', d: 2, key: '3' },
|
||||
];
|
||||
|
||||
class Demo3 extends Component {
|
||||
render () {
|
||||
return (
|
||||
<div>
|
||||
<h2>rowClassName and className</h2>
|
||||
<Table
|
||||
columns={columns2}
|
||||
rowClassName={(record, i) => `row-${i}`}
|
||||
expandedRowRender={record => <p>extra: {record.a}</p>}
|
||||
expandedRowClassName={(record, i) => `ex-row-${i}`}
|
||||
data={data2}
|
||||
className="table"
|
||||
/>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,112 @@
|
|||
/**
|
||||
*
|
||||
* @title 这是标题
|
||||
* @description 这是描述
|
||||
*
|
||||
*/
|
||||
|
||||
const columns3 = [
|
||||
{ title: '手机号', dataIndex: 'a', colSpan: 2, width: 100, key: 'a', render(o, row, index) {
|
||||
const obj = {
|
||||
children: o,
|
||||
props: {},
|
||||
};
|
||||
// 设置第一行为链接
|
||||
if (index === 0) {
|
||||
obj.children = <a href="#">{o}</a>;
|
||||
}
|
||||
// 第5行合并两列
|
||||
if (index === 4) {
|
||||
obj.props.colSpan = 2;
|
||||
}
|
||||
|
||||
if (index === 5) {
|
||||
obj.props.colSpan = 6;
|
||||
}
|
||||
return obj;
|
||||
} },
|
||||
{ title: '电话', dataIndex: 'b', colSpan: 0, width: 100, key: 'b', render(o, row, index) {
|
||||
const obj = {
|
||||
children: o,
|
||||
props: {},
|
||||
};
|
||||
// 列合并掉的表格设置colSpan=0，不会去渲染
|
||||
if (index === 4 || index === 5) {
|
||||
obj.props.colSpan = 0;
|
||||
}
|
||||
return obj;
|
||||
} },
|
||||
{ title: 'Name', dataIndex: 'c', width: 100, key: 'c', render(o, row, index) {
|
||||
const obj = {
|
||||
children: o,
|
||||
props: {},
|
||||
};
|
||||
|
||||
if (index === 5) {
|
||||
obj.props.colSpan = 0;
|
||||
}
|
||||
return obj;
|
||||
} },
|
||||
{ title: 'Address', dataIndex: 'd', width: 200, key: 'd', render(o, row, index) {
|
||||
const obj = {
|
||||
children: o,
|
||||
props: {},
|
||||
};
|
||||
if (index === 0) {
|
||||
obj.props.rowSpan = 2;
|
||||
}
|
||||
if (index === 1 || index === 5) {
|
||||
obj.props.rowSpan = 0;
|
||||
}
|
||||
|
||||
return obj;
|
||||
} },
|
||||
{ title: 'Gender', dataIndex: 'e', width: 200, key: 'e', render(o, row, index) {
|
||||
const obj = {
|
||||
children: o,
|
||||
props: {},
|
||||
};
|
||||
if (index === 5) {
|
||||
obj.props.colSpan = 0;
|
||||
}
|
||||
return obj;
|
||||
} },
|
||||
{
|
||||
title: 'Operations', dataIndex: '', key: 'f',
|
||||
render(o, row, index) {
|
||||
if (index === 5) {
|
||||
return {
|
||||
props: {
|
||||
colSpan: 0,
|
||||
},
|
||||
};
|
||||
}
|
||||
return <a href="#">Operations</a>;
|
||||
},
|
||||
},
|
||||
];
|
||||
|
||||
const data3 = [
|
||||
{ a: '13812340987', b: '0571-12345678', c: '张三', d: '文一西路', e: 'Male', key: '1' },
|
||||
{ a: '13812340986', b: '0571-98787658', c: '张夫人', d: '文一西路', e: 'Female', key: '2' },
|
||||
{ a: '13812988888', b: '0571-099877', c: '李四', d: '文二西路', e: 'Male', key: '3' },
|
||||
{ a: '1381200008888', b: '0571-099877', c: '王五', d: '文二西路', e: 'Male', key: '4' },
|
||||
{ a: '0571-88888110', c: '李警官', d: '武林门', e: 'Male', key: '5' },
|
||||
{ a: '资料统计完毕于xxxx年xxx月xxx日', key: '6' },
|
||||
];
|
||||
|
||||
|
||||
class Demo4 extends Component {
|
||||
render () {
|
||||
return (
|
||||
<div>
|
||||
<h2>colSpan & rowSpan</h2>
|
||||
<Table
|
||||
columns={columns3}
|
||||
data={data3}
|
||||
className="table"
|
||||
/>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,102 @@
|
|||
/**
|
||||
*
|
||||
* @title 这是标题
|
||||
* @description 这是描述
|
||||
*
|
||||
*/
|
||||
|
||||
|
||||
const data = [];
|
||||
for (let i = 0; i < 10; i++) {
|
||||
data.push({
|
||||
key: i,
|
||||
a: `a${i}`,
|
||||
b: `b${i}`,
|
||||
c: `c${i}`,
|
||||
});
|
||||
}
|
||||
|
||||
const Demo5 = React.createClass({
|
||||
getInitialState() {
|
||||
this.filters = [];
|
||||
return {
|
||||
visible: false,
|
||||
};
|
||||
},
|
||||
|
||||
handleVisibleChange(visible) {
|
||||
this.setState({ visible });
|
||||
},
|
||||
|
||||
handleSelect(selected) {
|
||||
this.filters.push(selected);
|
||||
},
|
||||
|
||||
handleDeselect(key) {
|
||||
const index = this.filters.indexOf(key);
|
||||
if (index !== -1) {
|
||||
this.filters.splice(index, 1);
|
||||
}
|
||||
},
|
||||
|
||||
confirmFilter() {
|
||||
console.log(this.filters.join(','));
|
||||
this.setState({
|
||||
visible: false,
|
||||
});
|
||||
},
|
||||
|
||||
render() {
|
||||
const menu = (
|
||||
<Menu
|
||||
style={{ width: 200 }}
|
||||
multiple
|
||||
onSelect={this.handleSelect}
|
||||
onDeselect={this.handleDeselect}
|
||||
>
|
||||
<Item key="1">one</Item>
|
||||
<Item key="2">two</Item>
|
||||
<Item key="3">three</Item>
|
||||
<Divider />
|
||||
<Item disabled>
|
||||
<button
|
||||
style={{
|
||||
cursor: 'pointer',
|
||||
color: '#000',
|
||||
pointerEvents: 'visible',
|
||||
}}
|
||||
onClick={this.confirmFilter}
|
||||
>确定</button>
|
||||
</Item>
|
||||
</Menu>
|
||||
);
|
||||
|
||||
const columns = [
|
||||
{
|
||||
title: (
|
||||
<div>
|
||||
title1
|
||||
<DropDown
|
||||
trigger={['click']}
|
||||
onVisibleChange={this.handleVisibleChange}
|
||||
visible={this.state.visible}
|
||||
overlay={menu}
|
||||
>
|
||||
<a href="#">filter</a>
|
||||
</DropDown>
|
||||
</div>
|
||||
), key: 'a', dataIndex: 'a', width: 100,
|
||||
},
|
||||
{ title: 'title2', key: 'b', dataIndex: 'b', width: 100 },
|
||||
{ title: 'title3', key: 'c', dataIndex: 'c', width: 200 },
|
||||
];
|
||||
|
||||
return (
|
||||
<Table
|
||||
columns={columns}
|
||||
data={data}
|
||||
rowKey={record => record.key}
|
||||
/>
|
||||
);
|
||||
},
|
||||
});
|
||||
|
|
@ -5,6 +5,9 @@ import Button from 'bee-button';
|
|||
import React, { Component } from 'react';
|
||||
import ReactDOM from 'react-dom';
|
||||
import Table from '../src';
|
||||
import Animate from 'bee-animate';
|
||||
import Menu, { Item, Divider } from 'bee-menus';
|
||||
import DropDown from 'bee-dropdown';
|
||||
|
||||
|
||||
const CARET = <i className="uf uf-chevronarrowdown"></i>;
|
||||
|
|
|
|||
File diff suppressed because one or more lines are too long
56
package.json
56
package.json
|
|
@ -15,15 +15,14 @@
|
|||
},
|
||||
"homepage": "https://github.com/tinper-bee/bee-table.git",
|
||||
"author": "Yonyou FED",
|
||||
"repository": "http://github.com/tinper-bee/bee-table",
|
||||
"bugs": "https://github.com/tinper-bee/bee-table.git/issues",
|
||||
"license": "MIT",
|
||||
|
||||
"main":"./build/index.js",
|
||||
"config":{
|
||||
"repository": "http://github.com/tinper-bee/bee-table",
|
||||
"bugs": "https://github.com/tinper-bee/bee-table.git/issues",
|
||||
"license": "MIT",
|
||||
"main": "./build/index.js",
|
||||
"config": {
|
||||
"port": 3000
|
||||
},
|
||||
"scripts": {
|
||||
},
|
||||
"scripts": {
|
||||
"dev": "bee-tools run start",
|
||||
"build": "bee-tools run build",
|
||||
"lint": "bee-tools run lint",
|
||||
|
|
@ -32,21 +31,28 @@
|
|||
"coveralls": "bee-tools run coverage",
|
||||
"browsers": "bee-tools run browsers",
|
||||
"pub": "bee-tools run pub"
|
||||
},
|
||||
"dependencies": {
|
||||
"classnames": "^2.2.5",
|
||||
"tinper-bee-core": "latest"
|
||||
},
|
||||
"devDependencies": {
|
||||
"chai": "^3.5.0",
|
||||
"enzyme": "^2.4.1",
|
||||
"react": "~0.14.0",
|
||||
"react-addons-test-utils": "15.3.2",
|
||||
"react-dom": "~0.14.0",
|
||||
"console-polyfill": "~0.2.1",
|
||||
"es5-shim": "~4.1.10",
|
||||
"bee-panel": "latest",
|
||||
"bee-layout": "latest",
|
||||
"bee-button": "latest"
|
||||
}
|
||||
},
|
||||
"dependencies": {
|
||||
"classnames": "^2.2.5",
|
||||
"object-path": "^0.11.3",
|
||||
"rc-util": "^4.0.2",
|
||||
"shallowequal": "^0.2.2",
|
||||
"tinper-bee-core": "latest",
|
||||
"warning": "^3.0.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"bee-animate": "0.0.3",
|
||||
"bee-button": "latest",
|
||||
"bee-dropdown": "^0.1.4",
|
||||
"bee-layout": "latest",
|
||||
"bee-menus": "0.0.5",
|
||||
"bee-panel": "latest",
|
||||
"chai": "^3.5.0",
|
||||
"console-polyfill": "~0.2.1",
|
||||
"enzyme": "^2.4.1",
|
||||
"es5-shim": "~4.1.10",
|
||||
"react": "~0.14.0",
|
||||
"react-addons-test-utils": "15.3.2",
|
||||
"react-dom": "~0.14.0"
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,7 +1,6 @@
|
|||
import { Component, PropTypes } from 'react';
|
||||
|
||||
export default class Column extends Component {
|
||||
static propTypes = {
|
||||
const propTypes = {
|
||||
className: PropTypes.string,
|
||||
colSpan: PropTypes.number,
|
||||
title: PropTypes.node,
|
||||
|
|
@ -16,6 +15,13 @@ export default class Column extends Component {
|
|||
'right',
|
||||
]),
|
||||
render: PropTypes.func,
|
||||
onCellClick: PropTypes.func,
|
||||
}
|
||||
onCellClick: PropTypes.func
|
||||
}
|
||||
|
||||
class Column extends Component {
|
||||
|
||||
}
|
||||
|
||||
Column.propTypes = propTypes;
|
||||
|
||||
export default Column;
|
||||
|
|
|
|||
|
|
@ -53,7 +53,7 @@ const Table = React.createClass({
|
|||
onExpandedRowsChange() {},
|
||||
onRowClick() {},
|
||||
onRowDoubleClick() {},
|
||||
prefixCls: 'rc-table',
|
||||
prefixCls: 'u-table',
|
||||
bodyStyle: {},
|
||||
style: {},
|
||||
childrenColumnName: 'children',
|
||||
|
|
|
|||
|
|
@ -1,11 +1,11 @@
|
|||
@tablePrefixCls: rc-table;
|
||||
@table-border-color: #e9e9e9;
|
||||
|
||||
.@{tablePrefixCls}.bordered {
|
||||
$table-border-color: #e9e9e9;
|
||||
|
||||
.u-table.bordered {
|
||||
table {
|
||||
border-collapse: collapse;
|
||||
}
|
||||
th, td {
|
||||
border: 1px solid @table-border-color;
|
||||
border: 1px solid $table-border-color;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,27 +1,27 @@
|
|||
@tablePrefixCls: rc-table;
|
||||
@text-color : #666;
|
||||
@font-size-base : 12px;
|
||||
@line-height: 1.5;
|
||||
@table-border-color: #e9e9e9;
|
||||
@table-head-background-color: #f7f7f7;
|
||||
@vertical-padding: 16px;
|
||||
@horizontal-padding: 8px;
|
||||
|
||||
.@{tablePrefixCls} {
|
||||
font-size: @font-size-base;
|
||||
color: @text-color;
|
||||
$text-color : #666;
|
||||
$font-size-base : 12px;
|
||||
$line-height: 1.5;
|
||||
$table-border-color: #e9e9e9;
|
||||
$table-head-background-color: #f7f7f7;
|
||||
$vertical-padding: 16px;
|
||||
$horizontal-padding: 8px;
|
||||
|
||||
.u-table {
|
||||
font-size: $font-size-base;
|
||||
color: $text-color;
|
||||
transition: opacity 0.3s ease;
|
||||
position: relative;
|
||||
line-height: @line-height;
|
||||
line-height: $line-height;
|
||||
overflow: hidden;
|
||||
|
||||
.@{tablePrefixCls}-scroll {
|
||||
&-scroll {
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
.@{tablePrefixCls}-header {
|
||||
&-header {
|
||||
overflow: hidden;
|
||||
background: @table-head-background-color;
|
||||
background: $table-head-background-color;
|
||||
}
|
||||
|
||||
&-fixed-header &-body {
|
||||
|
|
@ -42,24 +42,24 @@
|
|||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.@{tablePrefixCls}-title {
|
||||
padding: @vertical-padding @horizontal-padding;
|
||||
border-top: 1px solid @table-border-color;
|
||||
&-title {
|
||||
padding: $vertical-padding $horizontal-padding;
|
||||
border-top: 1px solid $table-border-color;
|
||||
}
|
||||
|
||||
.@{tablePrefixCls}-content {
|
||||
&-content {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.@{tablePrefixCls}-footer {
|
||||
padding: @vertical-padding @horizontal-padding;
|
||||
border-bottom: 1px solid @table-border-color;
|
||||
&-footer {
|
||||
padding: $vertical-padding $horizontal-padding;
|
||||
border-bottom: 1px solid $table-border-color;
|
||||
}
|
||||
|
||||
.@{tablePrefixCls}-placeholder {
|
||||
&-placeholder {
|
||||
padding: 16px 8px;
|
||||
background: #fff;
|
||||
border-bottom: 1px solid @table-border-color;
|
||||
border-bottom: 1px solid $table-border-color;
|
||||
text-align: center;
|
||||
position: relative;
|
||||
}
|
||||
|
|
@ -71,13 +71,13 @@
|
|||
}
|
||||
|
||||
th {
|
||||
background: @table-head-background-color;
|
||||
background: $table-head-background-color;
|
||||
font-weight: bold;
|
||||
transition: background .3s ease;
|
||||
}
|
||||
|
||||
td {
|
||||
border-bottom: 1px solid @table-border-color;
|
||||
border-bottom: 1px solid $table-border-color;
|
||||
}
|
||||
|
||||
tr {
|
||||
|
|
@ -85,17 +85,18 @@
|
|||
&:hover {
|
||||
background: #eaf8fe;
|
||||
}
|
||||
&.@{tablePrefixCls}-row-hover {
|
||||
background: #eaf8fe;
|
||||
}
|
||||
|
||||
}
|
||||
tr.tr-row-hover {
|
||||
background: #eaf8fe;
|
||||
}
|
||||
|
||||
th, td {
|
||||
padding: @vertical-padding @horizontal-padding;
|
||||
padding: $vertical-padding $horizontal-padding;
|
||||
}
|
||||
}
|
||||
|
||||
.@{tablePrefixCls} {
|
||||
.u-table {
|
||||
&-expand-icon-col {
|
||||
width: 10px;
|
||||
}
|
||||
|
|
@ -107,7 +108,7 @@
|
|||
height: 16px;
|
||||
text-align: center;
|
||||
line-height: 16px;
|
||||
border: 1px solid @table-border-color;
|
||||
border: 1px solid $table-border-color;
|
||||
user-select: none;
|
||||
background: #fff;
|
||||
}
|
||||
|
|
@ -126,7 +127,7 @@
|
|||
content: '+'
|
||||
}
|
||||
}
|
||||
tr&-expanded-row {
|
||||
tr.u-table-expanded-row {
|
||||
background: #f7f7f7;
|
||||
&:hover {
|
||||
background: #f7f7f7;
|
||||
|
|
@ -179,11 +180,11 @@
|
|||
&-fixed-left {
|
||||
left: 0;
|
||||
box-shadow: 4px 0 4px rgba(100, 100, 100, 0.1);
|
||||
& .@{tablePrefixCls}-body-inner {
|
||||
& &-body-inner {
|
||||
margin-right: -20px;
|
||||
padding-right: 20px;
|
||||
}
|
||||
.@{tablePrefixCls}-fixed-header & .@{tablePrefixCls}-body-inner {
|
||||
&-fixed-header & &-body-inner {
|
||||
padding-right: 0;
|
||||
}
|
||||
}
|
||||
|
|
@ -194,17 +195,17 @@
|
|||
|
||||
// hide expand row content in right fixed Table
|
||||
// https://github.com/ant-design/ant-design/issues/1898
|
||||
.@{tablePrefixCls}-expanded-row {
|
||||
&-expanded-row {
|
||||
color: transparent;
|
||||
pointer-events: none;
|
||||
}
|
||||
}
|
||||
|
||||
&&-scroll-position-left &-fixed-left {
|
||||
& &-scroll-position-left &-fixed-left {
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
&&-scroll-position-right &-fixed-right {
|
||||
& &-scroll-position-right &-fixed-right {
|
||||
box-shadow: none;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in New Issue