feat: feat haveExpandIcon to control hidden expandIcon
This commit is contained in:
parent
92c6468549
commit
98a403db30
|
@ -85,11 +85,12 @@ class Demo extends Component {
|
|||
| scroll | 横向或纵向支持滚动,也可用于指定滚动区域的宽高度:{ x: true, y: 300 } | object | {} |
|
||||
| rowRef | 获取行的ref | Function(record, index, indent):string | () => null |
|
||||
| getBodyWrapper | 添加对table body的包装 | Function(body) | body => body |
|
||||
| expandedRowRender | 额外的展开行 | Function | - |
|
||||
| expandedRowRender | 额外的展开行 | Function(record, index, indent):node | - |
|
||||
| expandIconAsCell | 展开按钮是否单独作为一个单元格 | bool | false |
|
||||
| expandRowByClick | 设置展开行是否通过点击行触发,此参数需要与上面参数搭配使用(默认是通过点击行前面的加号展开行 | bool | false |
|
||||
| footerScroll | 表尾和body是否公用同一个横向滚动条。( 如果footer中也是一个table组件,并且也具有滚动条,那么也需要加入footerScroll参数。 ) | bool | false |
|
||||
| loading | 表格是否加载中 | bool|object(详情可以参考上面示例) | false |
|
||||
| haveExpandIcon | 控制是否显示行展开icon.**注:该参数只有在和expandedRowRender同时使用才生效** | Function(record, index):bool | () =>false |
|
||||
|
||||
*注意: data参数中的key值必需,否则会导致部分功能出现问题!建议使用唯一的值,如id*
|
||||
|
||||
|
|
|
@ -55,9 +55,10 @@ var ExpandIcon = function (_Component) {
|
|||
onExpand = _props.onExpand,
|
||||
needIndentSpaced = _props.needIndentSpaced,
|
||||
expanded = _props.expanded,
|
||||
record = _props.record;
|
||||
record = _props.record,
|
||||
isHiddenExpandIcon = _props.isHiddenExpandIcon;
|
||||
|
||||
if (expandable) {
|
||||
if (expandable && !isHiddenExpandIcon) {
|
||||
var expandClassName = expanded ? 'expanded' : 'collapsed';
|
||||
return _react2["default"].createElement('span', {
|
||||
className: clsPrefix + '-expand-icon ' + clsPrefix + '-' + expandClassName,
|
||||
|
@ -65,7 +66,7 @@ var ExpandIcon = function (_Component) {
|
|||
return onExpand(!expanded, record, e);
|
||||
}
|
||||
});
|
||||
} else if (needIndentSpaced) {
|
||||
} else if (needIndentSpaced || isHiddenExpandIcon) {
|
||||
return _react2["default"].createElement('span', { className: clsPrefix + '-expand-icon ' + clsPrefix + '-spaced' });
|
||||
}
|
||||
return null;
|
||||
|
|
153
build/Table.css
153
build/Table.css
|
@ -1,5 +1,158 @@
|
|||
@charset "UTF-8";
|
||||
/* FormGroup */
|
||||
/* Navlayout */
|
||||
/* FormGroup */
|
||||
/* Navlayout */
|
||||
/**
|
||||
* 加载背景
|
||||
*/
|
||||
/**
|
||||
* 文字
|
||||
*/
|
||||
.u-loading-desc {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
font-size: 16px;
|
||||
color: #000;
|
||||
text-align: center; }
|
||||
|
||||
/**
|
||||
* default样式 单个圆圈加载
|
||||
*/
|
||||
.u-loading.u-loading-rotate > div {
|
||||
position: absolute;
|
||||
border-radius: 100%;
|
||||
margin: 2px;
|
||||
-webkit-animation-fill-mode: both;
|
||||
animation-fill-mode: both;
|
||||
border: 2px solid #0084ff;
|
||||
border-bottom-color: transparent;
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
margin-left: -22px;
|
||||
margin-top: -22px;
|
||||
background: transparent !important;
|
||||
display: inline-block;
|
||||
-webkit-animation: rotate 0.75s 0s linear infinite;
|
||||
animation: rotate 0.75s 0s linear infinite; }
|
||||
|
||||
.u-loading.u-loading-rotate.u-loading-rotate-lg > div {
|
||||
margin-left: -35px;
|
||||
margin-top: -35px;
|
||||
width: 60px;
|
||||
height: 60px; }
|
||||
|
||||
.u-loading.u-loading-rotate.u-loading-rotate-sm > div {
|
||||
margin-left: -15px;
|
||||
margin-top: -15px;
|
||||
width: 25px;
|
||||
height: 25px; }
|
||||
|
||||
.u-loading.u-loading-rotate.u-loading-rotate-primary > div {
|
||||
border: 2px solid #3f51b5;
|
||||
border-bottom-color: transparent; }
|
||||
|
||||
.u-loading.u-loading-rotate.u-loading-rotate-success > div {
|
||||
border: 2px solid #4caf50;
|
||||
border-bottom-color: transparent; }
|
||||
|
||||
.u-loading.u-loading-rotate.u-loading-rotate-warning > div {
|
||||
border: 2px solid #ff9800;
|
||||
border-bottom-color: transparent; }
|
||||
|
||||
.u-loading-backdrop {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
z-index: 1600;
|
||||
opacity: .7;
|
||||
filter: blur(0.5px);
|
||||
background-color: #fff; }
|
||||
.u-loading-backdrop.full-screen {
|
||||
position: fixed; }
|
||||
|
||||
@keyframes rotate {
|
||||
0% {
|
||||
-webkit-transform: rotate(0deg) scale(1);
|
||||
transform: rotate(0deg) scale(1); }
|
||||
50% {
|
||||
-webkit-transform: rotate(180deg) scale(0.6);
|
||||
transform: rotate(180deg) scale(0.6); }
|
||||
100% {
|
||||
-webkit-transform: rotate(360deg) scale(1);
|
||||
transform: rotate(360deg) scale(1); } }
|
||||
|
||||
.u-loading.u-loading-line {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
margin-top: -30px;
|
||||
margin-left: -25px; }
|
||||
.u-loading.u-loading-line > div {
|
||||
background-color: #C2C3C5;
|
||||
width: 6px;
|
||||
height: 50px;
|
||||
border-radius: 2px;
|
||||
margin: 2px;
|
||||
-webkit-animation-fill-mode: both;
|
||||
animation-fill-mode: both;
|
||||
display: inline-block; }
|
||||
.u-loading.u-loading-line.u-loading-line-lg {
|
||||
margin-top: -50px;
|
||||
margin-left: -30px; }
|
||||
.u-loading.u-loading-line.u-loading-line-lg > div {
|
||||
width: 8px;
|
||||
height: 90px; }
|
||||
.u-loading.u-loading-line.u-loading-line-sm {
|
||||
margin-top: -22px;
|
||||
margin-left: -20px; }
|
||||
.u-loading.u-loading-line.u-loading-line-sm > div {
|
||||
width: 4px;
|
||||
height: 35px; }
|
||||
.u-loading.u-loading-line div:nth-child(1) {
|
||||
-webkit-animation: line-scale 1s 0.1s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08);
|
||||
animation: line-scale 1s 0.1s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08);
|
||||
background-color: #F44336; }
|
||||
.u-loading.u-loading-line div:nth-child(2) {
|
||||
-webkit-animation: line-scale 1s 0.2s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08);
|
||||
animation: line-scale 1s 0.2s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08);
|
||||
background-color: #7ED321; }
|
||||
.u-loading.u-loading-line div:nth-child(3) {
|
||||
-webkit-animation: line-scale 1s 0.3s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08);
|
||||
animation: line-scale 1s 0.3s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08);
|
||||
background-color: #0084FF; }
|
||||
.u-loading.u-loading-line div:nth-child(4) {
|
||||
-webkit-animation: line-scale 1s 0.4s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08);
|
||||
animation: line-scale 1s 0.4s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08);
|
||||
background-color: #FF9800; }
|
||||
.u-loading.u-loading-line div:nth-child(5) {
|
||||
-webkit-animation: line-scale 1s 0.5s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08);
|
||||
animation: line-scale 1s 0.5s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08);
|
||||
background-color: #D0021B; }
|
||||
.u-loading.u-loading-line.u-loading-line-primary > div {
|
||||
background-color: #3f51b5; }
|
||||
.u-loading.u-loading-line.u-loading-line-success > div {
|
||||
background-color: #4caf50; }
|
||||
.u-loading.u-loading-line.u-loading-line-warning > div {
|
||||
background-color: #ff9800; }
|
||||
|
||||
@keyframes line-scale {
|
||||
0% {
|
||||
-webkit-transform: scaley(1);
|
||||
transform: scaley(1); }
|
||||
50% {
|
||||
-webkit-transform: scaley(0.4);
|
||||
transform: scaley(0.4); }
|
||||
100% {
|
||||
-webkit-transform: scaley(1);
|
||||
transform: scaley(1); } }
|
||||
|
||||
.u-table {
|
||||
font-size: 12px;
|
||||
color: #666;
|
||||
|
|
|
@ -40,6 +40,10 @@ var _createStore = require('./createStore');
|
|||
|
||||
var _createStore2 = _interopRequireDefault(_createStore);
|
||||
|
||||
var _beeLoading = require('bee-loading');
|
||||
|
||||
var _beeLoading2 = _interopRequireDefault(_beeLoading);
|
||||
|
||||
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
|
||||
|
||||
function _defaults(obj, defaults) { var keys = Object.getOwnPropertyNames(defaults); for (var i = 0; i < keys.length; i++) { var key = keys[i]; var value = Object.getOwnPropertyDescriptor(defaults, key); if (value && value.configurable && obj[key] === undefined) { Object.defineProperty(obj, key, value); } } return obj; }
|
||||
|
@ -386,6 +390,7 @@ var Table = function (_Component) {
|
|||
var fixedColumnsBodyRowsHeight = this.state.fixedColumnsBodyRowsHeight;
|
||||
|
||||
var rst = [];
|
||||
var isHiddenExpandIcon = void 0;
|
||||
var rowClassName = props.rowClassName;
|
||||
var rowRef = props.rowRef;
|
||||
var expandedRowClassName = props.expandedRowClassName;
|
||||
|
@ -407,6 +412,10 @@ var Table = function (_Component) {
|
|||
if (expandedRowRender && isRowExpanded) {
|
||||
expandedRowContent = expandedRowRender(record, i, indent);
|
||||
}
|
||||
//只有当使用expandedRowRender参数的时候才去识别isHiddenExpandIcon(隐藏行展开的icon)
|
||||
if (expandedRowRender && typeof props.haveExpandIcon == 'function') {
|
||||
isHiddenExpandIcon = props.haveExpandIcon(record, i);
|
||||
}
|
||||
var className = rowClassName(record, i, indent);
|
||||
|
||||
var onHoverProps = {};
|
||||
|
@ -445,7 +454,8 @@ var Table = function (_Component) {
|
|||
expandIconColumnIndex: expandIconColumnIndex,
|
||||
onRowClick: onRowClick,
|
||||
onRowDoubleClick: onRowDoubleClick,
|
||||
height: height
|
||||
height: height,
|
||||
isHiddenExpandIcon: isHiddenExpandIcon
|
||||
}, onHoverProps, {
|
||||
key: key,
|
||||
hoverKey: key,
|
||||
|
@ -811,6 +821,12 @@ var Table = function (_Component) {
|
|||
className += ' ' + clsPrefix + '-scroll-position-' + this.state.scrollPosition;
|
||||
|
||||
var isTableScroll = this.columnManager.isAnyColumnsFixed() || props.scroll.x || props.scroll.y;
|
||||
var loading = props.loading;
|
||||
if (typeof loading === 'boolean') {
|
||||
loading = {
|
||||
show: loading
|
||||
};
|
||||
}
|
||||
return _react2["default"].createElement(
|
||||
'div',
|
||||
{ className: className, style: props.style },
|
||||
|
@ -835,7 +851,10 @@ var Table = function (_Component) {
|
|||
{ className: clsPrefix + '-fixed-right' },
|
||||
this.getRightFixedTable()
|
||||
)
|
||||
)
|
||||
),
|
||||
_react2["default"].createElement(_beeLoading2["default"], _extends({
|
||||
container: this
|
||||
}, loading))
|
||||
);
|
||||
};
|
||||
|
||||
|
|
|
@ -169,7 +169,8 @@ var TableRow = function (_Component) {
|
|||
onExpand = _props7.onExpand,
|
||||
needIndentSpaced = _props7.needIndentSpaced,
|
||||
indent = _props7.indent,
|
||||
indentSize = _props7.indentSize;
|
||||
indentSize = _props7.indentSize,
|
||||
isHiddenExpandIcon = _props7.isHiddenExpandIcon;
|
||||
var className = this.props.className;
|
||||
|
||||
|
||||
|
@ -185,7 +186,8 @@ var TableRow = function (_Component) {
|
|||
onExpand: onExpand,
|
||||
needIndentSpaced: needIndentSpaced,
|
||||
expanded: expanded,
|
||||
record: record
|
||||
record: record,
|
||||
isHiddenExpandIcon: isHiddenExpandIcon
|
||||
});
|
||||
|
||||
for (var i = 0; i < columns.length; i++) {
|
||||
|
|
|
@ -73,7 +73,7 @@ function sum(Table) {
|
|||
}
|
||||
return item;
|
||||
});
|
||||
return _react2["default"].createElement(Table, _extends({}, _this.props, { footerScroll: true, showHeader: false, columns: columns_sum, data: obj }));
|
||||
return _react2["default"].createElement(Table, _extends({}, _this.props, { loading: false, footerScroll: true, showHeader: false, columns: columns_sum, data: obj }));
|
||||
};
|
||||
|
||||
return _this;
|
||||
|
|
|
@ -71,6 +71,7 @@ var InputRender = function (_Component) {
|
|||
var value = e;
|
||||
_this.setState({ value: value });
|
||||
}, _this.check = function () {
|
||||
console.log('1');
|
||||
if (typeof _this.flag === "undefined" || _this.flag) {
|
||||
_this.props.check(_this.flag, _this.obj);
|
||||
_this.setState({ editable: false });
|
||||
|
@ -87,6 +88,8 @@ var InputRender = function (_Component) {
|
|||
}, _this.handleKeydown = function (event) {
|
||||
if (event.keyCode == 13) {
|
||||
_this.check();
|
||||
} else if (event.keyCode == 9) {
|
||||
debugger;
|
||||
}
|
||||
}, _this.formatCurrency = function (money) {
|
||||
if (money && money != null && !!Number(money)) {
|
||||
|
|
|
@ -72,12 +72,18 @@ class Demo16 extends Component {
|
|||
})
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
haveExpandIcon=(record, index)=>{
|
||||
//控制是否显示行展开icon,该参数只有在和expandedRowRender同时使用才生效
|
||||
if(index == 0){
|
||||
return true;
|
||||
}
|
||||
return false;
|
||||
}
|
||||
render() {
|
||||
return (
|
||||
<Table
|
||||
haveExpandIcon={this.haveExpandIcon}
|
||||
columns={columns16}
|
||||
data={data16}
|
||||
onExpand={this.getData}
|
||||
|
|
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
|
@ -43,12 +43,12 @@ import 'bee-table/build/Table.css';
|
|||
| scroll | 横向或纵向支持滚动,也可用于指定滚动区域的宽高度:{ x: true, y: 300 } | object | {} |
|
||||
| rowRef | 获取行的ref | Function(record, index, indent):string | () => null |
|
||||
| getBodyWrapper | 添加对table body的包装 | Function(body) | body => body |
|
||||
| expandedRowRender | 额外的展开行 | Function | - |
|
||||
| expandedRowRender | 额外的展开行 | Function(record, index, indent):node | - |
|
||||
| expandIconAsCell | 展开按钮是否单独作为一个单元格 | bool | false |
|
||||
| expandRowByClick | 设置展开行是否通过点击行触发,此参数需要与上面参数搭配使用(默认是通过点击行前面的加号展开行 | bool | false |
|
||||
| footerScroll | 表尾和body是否公用同一个横向滚动条。( 如果footer中也是一个table组件,并且也具有滚动条,那么也需要加入footerScroll参数。 ) | bool | false |
|
||||
| loading | 表格是否加载中 | bool|object(详情可以参考上面示例) | false |
|
||||
|
||||
| haveExpandIcon | 控制是否显示行展开icon.**注:该参数只有在和expandedRowRender同时使用才生效** | Function(record, index):bool | () =>false |
|
||||
|
||||
|
||||
*注意: data参数中的key值必需,否则会导致部分功能出现问题!建议使用唯一的值,如id*
|
||||
|
|
169
package.json
169
package.json
|
@ -1,87 +1,88 @@
|
|||
{
|
||||
"name": "bee-table",
|
||||
"version": "1.0.12",
|
||||
"description": "Table ui component for react",
|
||||
"keywords": [
|
||||
"react",
|
||||
"react-component",
|
||||
"bee-table",
|
||||
"iuap-design",
|
||||
"tinper-bee",
|
||||
"Table"
|
||||
"name": "bee-table",
|
||||
"version": "1.0.13",
|
||||
"description": "Table ui component for react",
|
||||
"keywords": [
|
||||
"react",
|
||||
"react-component",
|
||||
"bee-table",
|
||||
"iuap-design",
|
||||
"tinper-bee",
|
||||
"Table"
|
||||
],
|
||||
"engines": {
|
||||
"node": ">=4.0.0"
|
||||
},
|
||||
"jest": {
|
||||
"moduleFileExtensions": [
|
||||
"js",
|
||||
"jsx"
|
||||
],
|
||||
"engines": {
|
||||
"node": ">=4.0.0"
|
||||
},
|
||||
"jest": {
|
||||
"moduleFileExtensions": [
|
||||
"js",
|
||||
"jsx"
|
||||
],
|
||||
"transform": {
|
||||
"^.+\\.js$": "babel-jest"
|
||||
}
|
||||
},
|
||||
"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": {
|
||||
"port": 3000,
|
||||
"commitizen": {
|
||||
"path": "./node_modules/cz-conventional-changelog"
|
||||
}
|
||||
},
|
||||
"scripts": {
|
||||
"dev": "bee-tools run start",
|
||||
"build": "bee-tools run build",
|
||||
"lint": "bee-tools run lint",
|
||||
"test": "jest",
|
||||
"chrome": "bee-tools run chrome",
|
||||
"coveralls": "jest",
|
||||
"browsers": "bee-tools run browsers",
|
||||
"pub": "bee-tools run pub",
|
||||
"changelog": "conventional-changelog -p angular -i CHANGELOG.md -s -r 0"
|
||||
},
|
||||
"dependencies": {
|
||||
"bee-loading": "^1.0.3",
|
||||
"classnames": "^2.2.5",
|
||||
"object-path": "^0.11.3",
|
||||
"tinper-bee-core": "latest",
|
||||
"warning": "^3.0.0"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"react": "^15.3.0 || ^16.0",
|
||||
"react-dom": "^15.3.0 || ^16.0",
|
||||
"prop-types": "15.6.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"babel-jest": "^22.0.4",
|
||||
"bee-animate": "latest",
|
||||
"bee-button": "latest",
|
||||
"bee-checkbox": "latest",
|
||||
"bee-datepicker": "latest",
|
||||
"bee-form": "^1.0.8",
|
||||
"bee-form-control": "latest",
|
||||
"bee-icon": "latest",
|
||||
"bee-input-group": "latest",
|
||||
"bee-layout": "latest",
|
||||
"bee-pagination": "latest",
|
||||
"bee-panel": "latest",
|
||||
"bee-popconfirm": "^1.0.1",
|
||||
"bee-select": "latest",
|
||||
"bee-tools": "latest",
|
||||
"bee-tooltip": "^1.0.2",
|
||||
"chai": "^3.5.0",
|
||||
"console-polyfill": "~0.2.1",
|
||||
"cz-conventional-changelog": "^2.1.0",
|
||||
"enzyme": "^2.9.1",
|
||||
"es5-shim": "~4.1.10",
|
||||
"jest": "^22.0.4",
|
||||
"react": "^15.5.0",
|
||||
"react-addons-test-utils": "^15.5.0",
|
||||
"react-dom": "^15.5.0"
|
||||
"transform": {
|
||||
"^.+\\.js$": "babel-jest"
|
||||
}
|
||||
}
|
||||
},
|
||||
"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": {
|
||||
"port": 3000,
|
||||
"commitizen": {
|
||||
"path": "./node_modules/cz-conventional-changelog"
|
||||
}
|
||||
},
|
||||
"scripts": {
|
||||
"dev": "bee-tools run start",
|
||||
"build": "bee-tools run build",
|
||||
"lint": "bee-tools run lint",
|
||||
"test": "jest",
|
||||
"chrome": "bee-tools run chrome",
|
||||
"coveralls": "jest",
|
||||
"browsers": "bee-tools run browsers",
|
||||
"pub": "bee-tools run pub",
|
||||
"changelog": "conventional-changelog -p angular -i CHANGELOG.md -s -r 0"
|
||||
},
|
||||
"dependencies": {
|
||||
"bee-loading": "^1.0.3",
|
||||
"classnames": "^2.2.5",
|
||||
"object-path": "^0.11.3",
|
||||
"shallowequal": "^1.0.2",
|
||||
"tinper-bee-core": "latest",
|
||||
"warning": "^3.0.0"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"react": "^15.3.0 || ^16.0",
|
||||
"react-dom": "^15.3.0 || ^16.0",
|
||||
"prop-types": "15.6.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"babel-jest": "^22.0.4",
|
||||
"bee-animate": "latest",
|
||||
"bee-button": "latest",
|
||||
"bee-checkbox": "latest",
|
||||
"bee-datepicker": "latest",
|
||||
"bee-form": "^1.0.8",
|
||||
"bee-form-control": "latest",
|
||||
"bee-icon": "latest",
|
||||
"bee-input-group": "latest",
|
||||
"bee-layout": "latest",
|
||||
"bee-pagination": "latest",
|
||||
"bee-panel": "latest",
|
||||
"bee-popconfirm": "^1.0.1",
|
||||
"bee-select": "latest",
|
||||
"bee-tools": "latest",
|
||||
"bee-tooltip": "^1.0.2",
|
||||
"chai": "^3.5.0",
|
||||
"console-polyfill": "~0.2.1",
|
||||
"cz-conventional-changelog": "^2.1.0",
|
||||
"enzyme": "^2.9.1",
|
||||
"es5-shim": "~4.1.10",
|
||||
"jest": "^22.0.4",
|
||||
"react": "^15.5.0",
|
||||
"react-addons-test-utils": "^15.5.0",
|
||||
"react-dom": "^15.5.0"
|
||||
}
|
||||
}
|
|
@ -19,8 +19,8 @@ class ExpandIcon extends Component{
|
|||
return !shallowequal(nextProps, this.props);
|
||||
}
|
||||
render() {
|
||||
const { expandable, clsPrefix, onExpand, needIndentSpaced, expanded, record } = this.props;
|
||||
if (expandable) {
|
||||
const { expandable, clsPrefix, onExpand, needIndentSpaced, expanded, record, isHiddenExpandIcon } = this.props;
|
||||
if (expandable && !isHiddenExpandIcon) {
|
||||
const expandClassName = expanded ? 'expanded' : 'collapsed';
|
||||
return (
|
||||
<span
|
||||
|
@ -28,7 +28,7 @@ class ExpandIcon extends Component{
|
|||
onClick={(e) => onExpand(!expanded, record, e)}
|
||||
/>
|
||||
);
|
||||
} else if (needIndentSpaced) {
|
||||
} else if (needIndentSpaced || isHiddenExpandIcon) {
|
||||
return <span className={`${clsPrefix}-expand-icon ${clsPrefix}-spaced`} />;
|
||||
}
|
||||
return null;
|
||||
|
|
|
@ -318,6 +318,7 @@ class Table extends Component{
|
|||
const expandRowByClick = props.expandRowByClick;
|
||||
const { fixedColumnsBodyRowsHeight } = this.state;
|
||||
let rst = [];
|
||||
let isHiddenExpandIcon;
|
||||
const rowClassName = props.rowClassName;
|
||||
const rowRef = props.rowRef;
|
||||
const expandedRowClassName = props.expandedRowClassName;
|
||||
|
@ -337,6 +338,10 @@ class Table extends Component{
|
|||
if (expandedRowRender && isRowExpanded) {
|
||||
expandedRowContent = expandedRowRender(record, i, indent);
|
||||
}
|
||||
//只有当使用expandedRowRender参数的时候才去识别isHiddenExpandIcon(隐藏行展开的icon)
|
||||
if(expandedRowRender && typeof props.haveExpandIcon == 'function'){
|
||||
isHiddenExpandIcon = props.haveExpandIcon(record, i);
|
||||
}
|
||||
const className = rowClassName(record, i, indent);
|
||||
|
||||
const onHoverProps = {};
|
||||
|
@ -356,7 +361,8 @@ class Table extends Component{
|
|||
} else {
|
||||
leafColumns = this.columnManager.leafColumns();
|
||||
}
|
||||
|
||||
|
||||
|
||||
rst.push(
|
||||
<TableRow
|
||||
indent={indent}
|
||||
|
@ -379,6 +385,7 @@ class Table extends Component{
|
|||
onRowClick={onRowClick}
|
||||
onRowDoubleClick={onRowDoubleClick}
|
||||
height={height}
|
||||
isHiddenExpandIcon={isHiddenExpandIcon}
|
||||
{...onHoverProps}
|
||||
key={key}
|
||||
hoverKey={key}
|
||||
|
|
|
@ -108,7 +108,7 @@ class TableRow extends Component{
|
|||
const {
|
||||
clsPrefix, columns, record, height, visible, index,
|
||||
expandIconColumnIndex, expandIconAsCell, expanded, expandRowByClick,
|
||||
expandable, onExpand, needIndentSpaced, indent, indentSize,
|
||||
expandable, onExpand, needIndentSpaced, indent, indentSize,isHiddenExpandIcon
|
||||
} = this.props;
|
||||
|
||||
let { className } = this.props;
|
||||
|
@ -127,6 +127,7 @@ class TableRow extends Component{
|
|||
needIndentSpaced={needIndentSpaced}
|
||||
expanded={expanded}
|
||||
record={record}
|
||||
isHiddenExpandIcon={isHiddenExpandIcon}
|
||||
/>
|
||||
);
|
||||
|
||||
|
@ -152,7 +153,7 @@ class TableRow extends Component{
|
|||
index={index}
|
||||
column={columns[i]}
|
||||
key={columns[i].key}
|
||||
expandIcon={isColumnHaveExpandIcon ? expandIcon : null}
|
||||
expandIcon={(isColumnHaveExpandIcon) ? expandIcon : null}
|
||||
/>
|
||||
);
|
||||
}
|
||||
|
|
|
@ -44,6 +44,8 @@ export default class InputRender extends Component {
|
|||
handleKeydown = event => {
|
||||
if (event.keyCode == 13) {
|
||||
this.check();
|
||||
}else if(event.keyCode == 9){
|
||||
debugger;
|
||||
}
|
||||
};
|
||||
//货币的格式化方法
|
||||
|
|
Loading…
Reference in New Issue