解决右侧固定列无法设置展开功能
This commit is contained in:
parent
0613edbc05
commit
0df167281a
|
@ -342,9 +342,16 @@ var Table = function (_Component) {
|
||||||
_this.onBodyMouseLeave = _this.onBodyMouseLeave.bind(_this);
|
_this.onBodyMouseLeave = _this.onBodyMouseLeave.bind(_this);
|
||||||
_this.tableUid = null;
|
_this.tableUid = null;
|
||||||
_this.contentTable = null;
|
_this.contentTable = null;
|
||||||
|
_this.leftColumnsLength; //左侧固定列的长度
|
||||||
|
_this.centerColumnsLength; //非固定列的长度
|
||||||
return _this;
|
return _this;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
Table.prototype.componentWillMount = function componentWillMount() {
|
||||||
|
this.centerColumnsLength = this.columnManager.centerColumns().length;
|
||||||
|
this.leftColumnsLength = this.columnManager.leftColumns().length;
|
||||||
|
};
|
||||||
|
|
||||||
Table.prototype.componentDidMount = function componentDidMount() {
|
Table.prototype.componentDidMount = function componentDidMount() {
|
||||||
this.getTableUID();
|
this.getTableUID();
|
||||||
_utils.EventUtil.addHandler(this.contentTable, 'keydown', this.onKeyDown);
|
_utils.EventUtil.addHandler(this.contentTable, 'keydown', this.onKeyDown);
|
||||||
|
@ -818,7 +825,7 @@ var Table = function (_Component) {
|
||||||
var onRowDoubleClick = props.onRowDoubleClick;
|
var onRowDoubleClick = props.onRowDoubleClick;
|
||||||
|
|
||||||
var expandIconAsCell = fixed !== 'right' ? props.expandIconAsCell : false;
|
var expandIconAsCell = fixed !== 'right' ? props.expandIconAsCell : false;
|
||||||
var expandIconColumnIndex = fixed !== 'right' ? props.expandIconColumnIndex : -1;
|
var expandIconColumnIndex = props.expandIconColumnIndex;
|
||||||
if (props.lazyLoad && props.lazyLoad.preHeight && indent == 0) {
|
if (props.lazyLoad && props.lazyLoad.preHeight && indent == 0) {
|
||||||
rst.push(_react2["default"].createElement(_TableRow2["default"], { height: props.lazyLoad.preHeight, columns: [], className: '', key: 'table_row_first', store: this.store, visible: true }));
|
rst.push(_react2["default"].createElement(_TableRow2["default"], { height: props.lazyLoad.preHeight, columns: [], className: '', key: 'table_row_first', store: this.store, visible: true }));
|
||||||
}
|
}
|
||||||
|
@ -926,7 +933,9 @@ var Table = function (_Component) {
|
||||||
expandedIcon: props.expandedIcon,
|
expandedIcon: props.expandedIcon,
|
||||||
collapsedIcon: props.collapsedIcon,
|
collapsedIcon: props.collapsedIcon,
|
||||||
lazyStartIndex: lazyCurrentIndex,
|
lazyStartIndex: lazyCurrentIndex,
|
||||||
lazyEndIndex: lazyEndIndex
|
lazyEndIndex: lazyEndIndex,
|
||||||
|
centerColumnsLength: this.centerColumnsLength,
|
||||||
|
leftColumnsLength: this.leftColumnsLength
|
||||||
})));
|
})));
|
||||||
this.treeRowIndex++;
|
this.treeRowIndex++;
|
||||||
var subVisible = visible && isRowExpanded;
|
var subVisible = visible && isRowExpanded;
|
||||||
|
|
|
@ -593,6 +593,12 @@ var TableRow = function (_Component) {
|
||||||
isHiddenExpandIcon: isHiddenExpandIcon
|
isHiddenExpandIcon: isHiddenExpandIcon
|
||||||
});
|
});
|
||||||
var isExpandIconAsCell = expandIconAsCell ? clsPrefix + '-expand-columns-in-body' : '';
|
var isExpandIconAsCell = expandIconAsCell ? clsPrefix + '-expand-columns-in-body' : '';
|
||||||
|
var expandIndexInThisTable;
|
||||||
|
if (this.props.fixed === 'right') {
|
||||||
|
expandIndexInThisTable = expandIconColumnIndex - this.props.leftColumnsLength - this.props.centerColumnsLength;
|
||||||
|
} else {
|
||||||
|
expandIndexInThisTable = expandIconColumnIndex;
|
||||||
|
}
|
||||||
for (var i = 0; i < columns.length; i++) {
|
for (var i = 0; i < columns.length; i++) {
|
||||||
if (expandIconAsCell && i === 0 && !showSum) {
|
if (expandIconAsCell && i === 0 && !showSum) {
|
||||||
cells.push(_react2["default"].createElement(
|
cells.push(_react2["default"].createElement(
|
||||||
|
@ -604,7 +610,7 @@ var TableRow = function (_Component) {
|
||||||
expandIcon
|
expandIcon
|
||||||
));
|
));
|
||||||
}
|
}
|
||||||
var isColumnHaveExpandIcon = expandIconAsCell || expandRowByClick || showSum ? false : i === expandIconColumnIndex;
|
var isColumnHaveExpandIcon = expandIconAsCell || expandRowByClick || showSum ? false : i === expandIndexInThisTable;
|
||||||
cells.push(_react2["default"].createElement(_TableCell2["default"], {
|
cells.push(_react2["default"].createElement(_TableCell2["default"], {
|
||||||
clsPrefix: clsPrefix,
|
clsPrefix: clsPrefix,
|
||||||
record: record,
|
record: record,
|
||||||
|
|
|
@ -37194,9 +37194,16 @@
|
||||||
_this.onBodyMouseLeave = _this.onBodyMouseLeave.bind(_this);
|
_this.onBodyMouseLeave = _this.onBodyMouseLeave.bind(_this);
|
||||||
_this.tableUid = null;
|
_this.tableUid = null;
|
||||||
_this.contentTable = null;
|
_this.contentTable = null;
|
||||||
|
_this.leftColumnsLength; //左侧固定列的长度
|
||||||
|
_this.centerColumnsLength; //非固定列的长度
|
||||||
return _this;
|
return _this;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
Table.prototype.componentWillMount = function componentWillMount() {
|
||||||
|
this.centerColumnsLength = this.columnManager.centerColumns().length;
|
||||||
|
this.leftColumnsLength = this.columnManager.leftColumns().length;
|
||||||
|
};
|
||||||
|
|
||||||
Table.prototype.componentDidMount = function componentDidMount() {
|
Table.prototype.componentDidMount = function componentDidMount() {
|
||||||
this.getTableUID();
|
this.getTableUID();
|
||||||
_utils.EventUtil.addHandler(this.contentTable, 'keydown', this.onKeyDown);
|
_utils.EventUtil.addHandler(this.contentTable, 'keydown', this.onKeyDown);
|
||||||
|
@ -37670,7 +37677,7 @@
|
||||||
var onRowDoubleClick = props.onRowDoubleClick;
|
var onRowDoubleClick = props.onRowDoubleClick;
|
||||||
|
|
||||||
var expandIconAsCell = fixed !== 'right' ? props.expandIconAsCell : false;
|
var expandIconAsCell = fixed !== 'right' ? props.expandIconAsCell : false;
|
||||||
var expandIconColumnIndex = fixed !== 'right' ? props.expandIconColumnIndex : -1;
|
var expandIconColumnIndex = props.expandIconColumnIndex;
|
||||||
if (props.lazyLoad && props.lazyLoad.preHeight && indent == 0) {
|
if (props.lazyLoad && props.lazyLoad.preHeight && indent == 0) {
|
||||||
rst.push(_react2['default'].createElement(_TableRow2['default'], { height: props.lazyLoad.preHeight, columns: [], className: '', key: 'table_row_first', store: this.store, visible: true }));
|
rst.push(_react2['default'].createElement(_TableRow2['default'], { height: props.lazyLoad.preHeight, columns: [], className: '', key: 'table_row_first', store: this.store, visible: true }));
|
||||||
}
|
}
|
||||||
|
@ -37778,7 +37785,9 @@
|
||||||
expandedIcon: props.expandedIcon,
|
expandedIcon: props.expandedIcon,
|
||||||
collapsedIcon: props.collapsedIcon,
|
collapsedIcon: props.collapsedIcon,
|
||||||
lazyStartIndex: lazyCurrentIndex,
|
lazyStartIndex: lazyCurrentIndex,
|
||||||
lazyEndIndex: lazyEndIndex
|
lazyEndIndex: lazyEndIndex,
|
||||||
|
centerColumnsLength: this.centerColumnsLength,
|
||||||
|
leftColumnsLength: this.leftColumnsLength
|
||||||
})));
|
})));
|
||||||
this.treeRowIndex++;
|
this.treeRowIndex++;
|
||||||
var subVisible = visible && isRowExpanded;
|
var subVisible = visible && isRowExpanded;
|
||||||
|
@ -39027,6 +39036,12 @@
|
||||||
isHiddenExpandIcon: isHiddenExpandIcon
|
isHiddenExpandIcon: isHiddenExpandIcon
|
||||||
});
|
});
|
||||||
var isExpandIconAsCell = expandIconAsCell ? clsPrefix + '-expand-columns-in-body' : '';
|
var isExpandIconAsCell = expandIconAsCell ? clsPrefix + '-expand-columns-in-body' : '';
|
||||||
|
var expandIndexInThisTable;
|
||||||
|
if (this.props.fixed === 'right') {
|
||||||
|
expandIndexInThisTable = expandIconColumnIndex - this.props.leftColumnsLength - this.props.centerColumnsLength;
|
||||||
|
} else {
|
||||||
|
expandIndexInThisTable = expandIconColumnIndex;
|
||||||
|
}
|
||||||
for (var i = 0; i < columns.length; i++) {
|
for (var i = 0; i < columns.length; i++) {
|
||||||
if (expandIconAsCell && i === 0 && !showSum) {
|
if (expandIconAsCell && i === 0 && !showSum) {
|
||||||
cells.push(_react2['default'].createElement(
|
cells.push(_react2['default'].createElement(
|
||||||
|
@ -39038,7 +39053,7 @@
|
||||||
expandIcon
|
expandIcon
|
||||||
));
|
));
|
||||||
}
|
}
|
||||||
var isColumnHaveExpandIcon = expandIconAsCell || expandRowByClick || showSum ? false : i === expandIconColumnIndex;
|
var isColumnHaveExpandIcon = expandIconAsCell || expandRowByClick || showSum ? false : i === expandIndexInThisTable;
|
||||||
cells.push(_react2['default'].createElement(_TableCell2['default'], {
|
cells.push(_react2['default'].createElement(_TableCell2['default'], {
|
||||||
clsPrefix: clsPrefix,
|
clsPrefix: clsPrefix,
|
||||||
record: record,
|
record: record,
|
||||||
|
|
File diff suppressed because one or more lines are too long
10
src/Table.js
10
src/Table.js
|
@ -154,6 +154,12 @@ class Table extends Component {
|
||||||
this.onBodyMouseLeave = this.onBodyMouseLeave.bind(this);
|
this.onBodyMouseLeave = this.onBodyMouseLeave.bind(this);
|
||||||
this.tableUid = null;
|
this.tableUid = null;
|
||||||
this.contentTable = null;
|
this.contentTable = null;
|
||||||
|
this.leftColumnsLength //左侧固定列的长度
|
||||||
|
this.centerColumnsLength //非固定列的长度
|
||||||
|
}
|
||||||
|
componentWillMount() {
|
||||||
|
this.centerColumnsLength = this.columnManager.centerColumns().length
|
||||||
|
this.leftColumnsLength = this.columnManager.leftColumns().length
|
||||||
}
|
}
|
||||||
|
|
||||||
componentDidMount() {
|
componentDidMount() {
|
||||||
|
@ -661,7 +667,7 @@ class Table extends Component {
|
||||||
const onRowDoubleClick = props.onRowDoubleClick;
|
const onRowDoubleClick = props.onRowDoubleClick;
|
||||||
|
|
||||||
const expandIconAsCell = fixed !== 'right' ? props.expandIconAsCell : false;
|
const expandIconAsCell = fixed !== 'right' ? props.expandIconAsCell : false;
|
||||||
const expandIconColumnIndex = fixed !== 'right' ? props.expandIconColumnIndex : -1;
|
const expandIconColumnIndex = props.expandIconColumnIndex
|
||||||
if(props.lazyLoad && props.lazyLoad.preHeight && indent == 0){
|
if(props.lazyLoad && props.lazyLoad.preHeight && indent == 0){
|
||||||
rst.push(
|
rst.push(
|
||||||
<TableRow height={props.lazyLoad.preHeight} columns={[]} className='' key={'table_row_first'} store={this.store} visible = {true}/>
|
<TableRow height={props.lazyLoad.preHeight} columns={[]} className='' key={'table_row_first'} store={this.store} visible = {true}/>
|
||||||
|
@ -776,6 +782,8 @@ class Table extends Component {
|
||||||
collapsedIcon={props.collapsedIcon}
|
collapsedIcon={props.collapsedIcon}
|
||||||
lazyStartIndex = {lazyCurrentIndex}
|
lazyStartIndex = {lazyCurrentIndex}
|
||||||
lazyEndIndex = {lazyEndIndex}
|
lazyEndIndex = {lazyEndIndex}
|
||||||
|
centerColumnsLength={this.centerColumnsLength}
|
||||||
|
leftColumnsLength={this.leftColumnsLength}
|
||||||
/>
|
/>
|
||||||
);
|
);
|
||||||
this.treeRowIndex++;
|
this.treeRowIndex++;
|
||||||
|
|
|
@ -200,21 +200,21 @@ class TableRow extends Component{
|
||||||
let event = Event.getEvent(e) ,
|
let event = Event.getEvent(e) ,
|
||||||
_target = Event.getTarget(event),
|
_target = Event.getTarget(event),
|
||||||
target = _target.parentNode;
|
target = _target.parentNode;
|
||||||
|
|
||||||
if (target.tagName === 'TR') {
|
if (target.tagName === 'TR') {
|
||||||
|
|
||||||
this.currentIndex = target.getAttribute("data-row-key");
|
this.currentIndex = target.getAttribute("data-row-key");
|
||||||
|
|
||||||
onDragRowStart && onDragRowStart(this.currentIndex);
|
onDragRowStart && onDragRowStart(this.currentIndex);
|
||||||
}else{
|
}else{
|
||||||
|
|
||||||
this.canBeTouch = false
|
this.canBeTouch = false
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
onTouchMove = (e) => {
|
onTouchMove = (e) => {
|
||||||
|
|
||||||
if (!this.canBeTouch) return;
|
if (!this.canBeTouch) return;
|
||||||
e.stopPropagation()
|
e.stopPropagation()
|
||||||
let event = Event.getEvent(e);
|
let event = Event.getEvent(e);
|
||||||
|
@ -235,7 +235,7 @@ class TableRow extends Component{
|
||||||
* 手指移开时触发
|
* 手指移开时触发
|
||||||
*/
|
*/
|
||||||
onTouchEnd = (e) => {
|
onTouchEnd = (e) => {
|
||||||
|
|
||||||
if(!this.canBeTouch){
|
if(!this.canBeTouch){
|
||||||
this.canBeTouch = true
|
this.canBeTouch = true
|
||||||
return
|
return
|
||||||
|
@ -476,6 +476,12 @@ class TableRow extends Component{
|
||||||
/>
|
/>
|
||||||
);
|
);
|
||||||
let isExpandIconAsCell = expandIconAsCell ? `${clsPrefix}-expand-columns-in-body` : '';
|
let isExpandIconAsCell = expandIconAsCell ? `${clsPrefix}-expand-columns-in-body` : '';
|
||||||
|
var expandIndexInThisTable
|
||||||
|
if(this.props.fixed === 'right'){
|
||||||
|
expandIndexInThisTable = expandIconColumnIndex - this.props.leftColumnsLength-this.props.centerColumnsLength
|
||||||
|
}else {
|
||||||
|
expandIndexInThisTable = expandIconColumnIndex
|
||||||
|
}
|
||||||
for (let i = 0; i < columns.length; i++) {
|
for (let i = 0; i < columns.length; i++) {
|
||||||
if (expandIconAsCell && i === 0 && !showSum ) {
|
if (expandIconAsCell && i === 0 && !showSum ) {
|
||||||
cells.push(
|
cells.push(
|
||||||
|
@ -488,7 +494,7 @@ class TableRow extends Component{
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
const isColumnHaveExpandIcon = (expandIconAsCell || expandRowByClick || showSum)
|
const isColumnHaveExpandIcon = (expandIconAsCell || expandRowByClick || showSum)
|
||||||
? false : (i === expandIconColumnIndex);
|
? false : (i === expandIndexInThisTable);
|
||||||
cells.push(
|
cells.push(
|
||||||
<TableCell
|
<TableCell
|
||||||
clsPrefix={clsPrefix}
|
clsPrefix={clsPrefix}
|
||||||
|
|
Loading…
Reference in New Issue