Merge branch 'master' of github.com:tinper-bee/bee-table
This commit is contained in:
commit
1f46e1e7af
|
@ -344,10 +344,10 @@
|
|||
content: "."; }
|
||||
.u-table-row-expanded:after, .u-table-expanded-row-expanded:after {
|
||||
content: "\e639";
|
||||
font-family: "uf" !important; }
|
||||
font-family: "uf"; }
|
||||
.u-table-row-collapsed:after, .u-table-expanded-row-collapsed:after {
|
||||
content: "\e61c";
|
||||
font-family: "uf" !important; }
|
||||
font-family: "uf"; }
|
||||
.u-table-row.selected {
|
||||
background: #FFF7E7; }
|
||||
.u-table tr.u-table-expanded-row {
|
||||
|
|
|
@ -96,7 +96,7 @@ var TableHeader = function (_Component) {
|
|||
_this.drag.oldWidth = parseInt(currentObj.style.width);
|
||||
_this.drag.minWidth = currentObj.style.minWidth != "" ? parseInt(currentObj.style.minWidth) : defaultWidth;
|
||||
_this.drag.tableWidth = parseInt(_this.table.table.style.width ? _this.table.table.style.width : _this.table.table.scrollWidth);
|
||||
console.log(" ----- ", _this.drag);
|
||||
// console.log(" ----- ",this.drag);
|
||||
if (!_this.tableOldWidth) {
|
||||
_this.tableOldWidth = _this.drag.tableWidth; //this.getTableWidth();
|
||||
// console.log(" this.tableOldWidth--- ",this.tableOldWidth);
|
||||
|
@ -156,8 +156,7 @@ var TableHeader = function (_Component) {
|
|||
var currentCols = _this.table.cols[_this.drag.currIndex];
|
||||
var diff = event.x - _this.drag.oldLeft;
|
||||
var newWidth = _this.drag.oldWidth + diff;
|
||||
_this.drag.newWidth = newWidth;
|
||||
|
||||
_this.drag.newWidth = newWidth > 0 ? newWidth : _this.minWidth;
|
||||
// if(newWidth > this.drag.minWidth){
|
||||
if (newWidth > _this.minWidth) {
|
||||
currentCols.style.width = newWidth + 'px';
|
||||
|
@ -210,6 +209,8 @@ var TableHeader = function (_Component) {
|
|||
_this.optTableScroll(_this.table.fixedRightBodyTable, { x: 'auto' });
|
||||
}
|
||||
}
|
||||
} else {
|
||||
_this.drag.newWidth = _this.minWidth;
|
||||
}
|
||||
} else if (_this.props.draggable && _this.drag.option == "draggable") {
|
||||
// console.log(" --onTrMouseMove--draggable- ",this.drag.option);
|
||||
|
@ -306,7 +307,7 @@ var TableHeader = function (_Component) {
|
|||
if (!currentIndex || parseInt(currentIndex) === _this.drag.currIndex) return;
|
||||
if (target.nodeName.toUpperCase() === "TH") {
|
||||
// target.style.border = "2px dashed rgba(5,0,0,0.25)";
|
||||
target.setAttribute("style", "border:2px dashed rgba(5,0,0,0.25)");
|
||||
target.setAttribute("style", "border-right:2px dashed rgba(5,0,0,0.25)");
|
||||
// target.style.backgroundColor = 'rgb(235, 236, 240)';
|
||||
}
|
||||
};
|
||||
|
|
|
@ -73,7 +73,7 @@ function singleSelect(Table, Radio) {
|
|||
onChange: function onChange(value) {
|
||||
return _this.onRadioChange(value, record, index);
|
||||
},
|
||||
style: { width: '16px', height: '16px', display: 'block', marginLeft: '4px' } },
|
||||
style: { width: '14px', height: '14px', display: 'block', marginLeft: '4px' } },
|
||||
_react2["default"].createElement(Radio, { value: index })
|
||||
);
|
||||
}
|
||||
|
@ -117,8 +117,7 @@ function singleSelect(Table, Radio) {
|
|||
|
||||
return _react2["default"].createElement(Table, _extends({}, this.props, {
|
||||
columns: this.getDefaultColumns(columns),
|
||||
data: data,
|
||||
height: 40 }));
|
||||
data: data }));
|
||||
};
|
||||
|
||||
return SingleSelect;
|
||||
|
|
|
@ -1,7 +1,7 @@
|
|||
'use strict';
|
||||
|
||||
Object.defineProperty(exports, "__esModule", {
|
||||
value: true
|
||||
value: true
|
||||
});
|
||||
|
||||
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
|
||||
|
@ -20,29 +20,29 @@ exports.ObjectAssign = ObjectAssign;
|
|||
*/
|
||||
|
||||
function sortBy(arr, prop, desc) {
|
||||
var props = [],
|
||||
ret = [],
|
||||
i = 0,
|
||||
len = arr.length;
|
||||
if (typeof prop == 'string') {
|
||||
for (; i < len; i++) {
|
||||
var oI = arr[i];
|
||||
(props[i] = new String(oI && oI[prop] || ''))._obj = oI;
|
||||
}
|
||||
} else if (typeof prop == 'function') {
|
||||
for (; i < len; i++) {
|
||||
var _oI = arr[i];
|
||||
(props[i] = new String(_oI && prop(_oI) || ''))._obj = _oI;
|
||||
}
|
||||
} else {
|
||||
throw '参数类型错误';
|
||||
var props = [],
|
||||
ret = [],
|
||||
i = 0,
|
||||
len = arr.length;
|
||||
if (typeof prop == 'string') {
|
||||
for (; i < len; i++) {
|
||||
var oI = arr[i];
|
||||
(props[i] = new String(oI && oI[prop] || ''))._obj = oI;
|
||||
}
|
||||
props.sort();
|
||||
for (i = 0; i < len; i++) {
|
||||
ret[i] = props[i]._obj;
|
||||
} else if (typeof prop == 'function') {
|
||||
for (; i < len; i++) {
|
||||
var _oI = arr[i];
|
||||
(props[i] = new String(_oI && prop(_oI) || ''))._obj = _oI;
|
||||
}
|
||||
if (desc) ret.reverse();
|
||||
return ret;
|
||||
} else {
|
||||
throw '参数类型错误';
|
||||
}
|
||||
props.sort();
|
||||
for (i = 0; i < len; i++) {
|
||||
ret[i] = props[i]._obj;
|
||||
}
|
||||
if (desc) ret.reverse();
|
||||
return ret;
|
||||
};
|
||||
|
||||
/**
|
||||
|
@ -51,11 +51,11 @@ function sortBy(arr, prop, desc) {
|
|||
* @param {} property
|
||||
*/
|
||||
function compare(property) {
|
||||
return function (a, b) {
|
||||
var value1 = a[property];
|
||||
var value2 = b[property];
|
||||
return value1 - value2;
|
||||
};
|
||||
return function (a, b) {
|
||||
var value1 = a[property];
|
||||
var value2 = b[property];
|
||||
return value1 - value2;
|
||||
};
|
||||
}
|
||||
|
||||
/**
|
||||
|
@ -63,17 +63,17 @@ function compare(property) {
|
|||
* @param {*} obj 要拷贝的对象
|
||||
*/
|
||||
function ObjectAssign(obj) {
|
||||
var b = obj instanceof Array;
|
||||
var tagObj = b ? [] : {};
|
||||
if (b) {
|
||||
//数组
|
||||
obj.forEach(function (da) {
|
||||
var _da = {};
|
||||
_extends(_da, da);
|
||||
tagObj.push(_da);
|
||||
});
|
||||
} else {
|
||||
_extends(tagObj, obj);
|
||||
}
|
||||
return tagObj;
|
||||
var b = obj instanceof Array;
|
||||
var tagObj = b ? [] : {};
|
||||
if (b) {
|
||||
//数组
|
||||
obj.forEach(function (da) {
|
||||
var _da = {};
|
||||
_extends(_da, da);
|
||||
tagObj.push(_da);
|
||||
});
|
||||
} else {
|
||||
_extends(tagObj, obj);
|
||||
}
|
||||
return tagObj;
|
||||
}
|
File diff suppressed because one or more lines are too long
|
@ -326,10 +326,10 @@
|
|||
content: "."; }
|
||||
.u-table-row-expanded:after, .u-table-expanded-row-expanded:after {
|
||||
content: "\e639";
|
||||
font-family: "uf" !important; }
|
||||
font-family: "uf"; }
|
||||
.u-table-row-collapsed:after, .u-table-expanded-row-collapsed:after {
|
||||
content: "\e61c";
|
||||
font-family: "uf" !important; }
|
||||
font-family: "uf"; }
|
||||
.u-table-row.selected {
|
||||
background: #FFF7E7; }
|
||||
.u-table tr.u-table-expanded-row {
|
||||
|
|
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
|
@ -1,6 +1,6 @@
|
|||
{
|
||||
"name": "bee-table",
|
||||
"version": "2.1.4-alpha.2",
|
||||
"version": "2.1.4-alpha.4",
|
||||
"description": "Table ui component for react",
|
||||
"keywords": [
|
||||
"react",
|
||||
|
|
|
@ -635,6 +635,7 @@ class Table extends Component {
|
|||
}
|
||||
const lazyCurrentIndex = props.lazyLoad && props.lazyLoad.startIndex ?props.lazyLoad.startIndex :0;
|
||||
const lazyParentIndex = props.lazyLoad && props.lazyLoad.startParentIndex ?props.lazyLoad.startParentIndex :0;
|
||||
const lazyEndIndex = props.lazyLoad && props.lazyLoad.endIndex ?props.lazyLoad.endIndex :-1;
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
let isHiddenExpandIcon;
|
||||
const record = data[i];
|
||||
|
@ -738,6 +739,8 @@ class Table extends Component {
|
|||
tableUid = {this.tableUid}
|
||||
expandedIcon={props.expandedIcon}
|
||||
collapsedIcon={props.collapsedIcon}
|
||||
lazyStartIndex = {lazyCurrentIndex}
|
||||
lazyEndIndex = {lazyEndIndex}
|
||||
/>
|
||||
);
|
||||
this.treeRowIndex++;
|
||||
|
|
|
@ -307,13 +307,13 @@ $icon-color:#505F79;
|
|||
&-expanded {
|
||||
&:after {
|
||||
content: "\e639";
|
||||
font-family: "uf" !important;
|
||||
font-family: "uf";
|
||||
}
|
||||
}
|
||||
&-collapsed {
|
||||
&:after {
|
||||
content: "\e61c";
|
||||
font-family: "uf" !important;
|
||||
font-family: "uf";
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -30,7 +30,7 @@ class TableCell extends Component{
|
|||
}
|
||||
render() {
|
||||
const { record, indentSize, clsPrefix, indent,
|
||||
index, expandIcon, column ,fixed,showSum, bodyDisplayInRow} = this.props;
|
||||
index, expandIcon, column ,fixed,showSum, bodyDisplayInRow,lazyStartIndex,lazyEndIndex} = this.props;
|
||||
const { dataIndex, render } = column;
|
||||
let {className = ''} = column;
|
||||
|
||||
|
@ -43,7 +43,7 @@ class TableCell extends Component{
|
|||
text = render(text, record, index);
|
||||
if (this.isInvalidRenderCellText(text)) {
|
||||
tdProps = text.props || {};
|
||||
rowSpan = tdProps.rowSpan;
|
||||
rowSpan = (tdProps.rowSpan>lazyEndIndex && lazyEndIndex>5)?lazyEndIndex-index:tdProps.rowSpan;
|
||||
colSpan = tdProps.colSpan;
|
||||
text = text.children;
|
||||
}
|
||||
|
@ -61,9 +61,13 @@ class TableCell extends Component{
|
|||
/>
|
||||
) : null;
|
||||
|
||||
if (rowSpan === 0 || colSpan === 0) {
|
||||
if ((lazyStartIndex !==index) &&(rowSpan === 0 || colSpan === 0) ) {
|
||||
return null;
|
||||
}
|
||||
if(tdProps && tdProps.mergeEndIndex && index<tdProps.mergeEndIndex && rowSpan === 0){
|
||||
rowSpan = tdProps.mergeEndIndex - index;
|
||||
text = ''
|
||||
}
|
||||
//不是固定表格并且当前列是固定,则隐藏当前列
|
||||
if(column.fixed && !fixed){
|
||||
className = className+` ${clsPrefix}-fixed-columns-in-body`;
|
||||
|
@ -80,7 +84,8 @@ class TableCell extends Component{
|
|||
rowSpan={rowSpan}
|
||||
className={className}
|
||||
onClick={this.handleClick}
|
||||
title = {title}
|
||||
title={title}
|
||||
|
||||
>
|
||||
{indentText}
|
||||
{expandIcon}
|
||||
|
|
|
@ -206,7 +206,7 @@ class TableHeader extends Component {
|
|||
this.drag.oldWidth = parseInt((currentObj).style.width);
|
||||
this.drag.minWidth = currentObj.style.minWidth != ""?parseInt(currentObj.style.minWidth):defaultWidth;
|
||||
this.drag.tableWidth = parseInt(this.table.table.style.width ?this.table.table.style.width:this.table.table.scrollWidth);
|
||||
console.log(" ----- ",this.drag);
|
||||
// console.log(" ----- ",this.drag);
|
||||
if(!this.tableOldWidth){
|
||||
this.tableOldWidth = this.drag.tableWidth;//this.getTableWidth();
|
||||
// console.log(" this.tableOldWidth--- ",this.tableOldWidth);
|
||||
|
@ -264,8 +264,7 @@ class TableHeader extends Component {
|
|||
let currentCols = this.table.cols[this.drag.currIndex];
|
||||
let diff = (event.x - this.drag.oldLeft);
|
||||
let newWidth = this.drag.oldWidth + diff;
|
||||
this.drag.newWidth = newWidth;
|
||||
|
||||
this.drag.newWidth = newWidth > 0 ? newWidth : this.minWidth;
|
||||
// if(newWidth > this.drag.minWidth){
|
||||
if(newWidth > this.minWidth){
|
||||
currentCols.style.width = newWidth +'px';
|
||||
|
@ -317,6 +316,8 @@ class TableHeader extends Component {
|
|||
this.optTableScroll( this.table.fixedRightBodyTable,{x:'auto'});
|
||||
}
|
||||
}
|
||||
}else {
|
||||
this.drag.newWidth = this.minWidth;
|
||||
}
|
||||
}else if(this.props.draggable && this.drag.option == "draggable"){
|
||||
// console.log(" --onTrMouseMove--draggable- ",this.drag.option);
|
||||
|
@ -476,7 +477,7 @@ class TableHeader extends Component {
|
|||
if(!currentIndex || parseInt(currentIndex) === this.drag.currIndex)return;
|
||||
if(target.nodeName.toUpperCase() === "TH"){
|
||||
// target.style.border = "2px dashed rgba(5,0,0,0.25)";
|
||||
target.setAttribute("style","border:2px dashed rgba(5,0,0,0.25)");
|
||||
target.setAttribute("style","border-right:2px dashed rgba(5,0,0,0.25)");
|
||||
// target.style.backgroundColor = 'rgb(235, 236, 240)';
|
||||
}
|
||||
}
|
||||
|
|
|
@ -418,7 +418,7 @@ class TableRow extends Component{
|
|||
clsPrefix, columns, record, height, visible, index,
|
||||
expandIconColumnIndex, expandIconAsCell, expanded, expandRowByClick,rowDraggAble,
|
||||
expandable, onExpand, needIndentSpaced, indent, indentSize,isHiddenExpandIcon,fixed,bodyDisplayInRow
|
||||
,expandedIcon,collapsedIcon, hoverKey
|
||||
,expandedIcon,collapsedIcon, hoverKey,lazyStartIndex,lazyEndIndex
|
||||
} = this.props;
|
||||
let showSum = false;
|
||||
let { className } = this.props;
|
||||
|
@ -471,6 +471,8 @@ class TableRow extends Component{
|
|||
showSum={showSum}
|
||||
expandIcon={(isColumnHaveExpandIcon) ? expandIcon : null}
|
||||
bodyDisplayInRow = {bodyDisplayInRow}
|
||||
lazyStartIndex={lazyStartIndex}
|
||||
lazyEndIndex={lazyEndIndex}
|
||||
/>
|
||||
);
|
||||
}
|
||||
|
|
|
@ -1,7 +1,7 @@
|
|||
import React, { Component } from "react";
|
||||
import PropTypes from "prop-types";
|
||||
const defaultHeight = 30;
|
||||
const rowDiff = 3; //行差值
|
||||
const rowDiff = 2; //行差值
|
||||
let treeTypeIndex = 0;
|
||||
export default function bigData(Table) {
|
||||
return class BigData extends Component {
|
||||
|
@ -298,11 +298,12 @@ export default function bigData(Table) {
|
|||
// 向下滚动 下临界值超出缓存的endIndex则重新渲染
|
||||
if (rowsInView + index > endIndex - rowDiff && isOrder) {
|
||||
startIndex = index - loadBuffer > 0 ? index - loadBuffer : 0;
|
||||
// endIndex = startIndex + rowsInView + loadBuffer*2;
|
||||
endIndex = startIndex + loadCount;
|
||||
if (endIndex > data.length) {
|
||||
endIndex = data.length;
|
||||
}
|
||||
if (endIndex !== this.endIndex) {
|
||||
if (endIndex > this.endIndex ) {
|
||||
this.startIndex = startIndex;
|
||||
this.endIndex = endIndex;
|
||||
this.setState({ needRender: !needRender });
|
||||
|
@ -314,7 +315,7 @@ export default function bigData(Table) {
|
|||
if (startIndex < 0) {
|
||||
startIndex = 0;
|
||||
}
|
||||
if (startIndex !== this.startIndex ) {
|
||||
if (startIndex < this.startIndex) {
|
||||
this.startIndex = startIndex;
|
||||
this.endIndex = this.startIndex + loadCount;
|
||||
this.setState({ needRender: !needRender });
|
||||
|
@ -430,6 +431,7 @@ export default function bigData(Table) {
|
|||
}
|
||||
const lazyLoad = {
|
||||
startIndex: startIndex,
|
||||
endIndex:endIndex,
|
||||
startParentIndex: startIndex //为树状节点做准备
|
||||
};
|
||||
if (this.treeType) {
|
||||
|
|
|
@ -70,7 +70,7 @@ export default function singleSelect(Table, Radio) {
|
|||
name="table-radio"
|
||||
selectedValue={selectedRowIndex}
|
||||
onChange={value => this.onRadioChange(value, record, index)}
|
||||
style={{width:'16px', height:'16px', display:'block', marginLeft:'4px'}}>
|
||||
style={{width:'14px', height:'14px', display:'block', marginLeft:'4px'}}>
|
||||
<Radio value={index}/>
|
||||
</Radio.RadioGroup>
|
||||
}
|
||||
|
@ -84,8 +84,7 @@ export default function singleSelect(Table, Radio) {
|
|||
return <Table
|
||||
{...this.props}
|
||||
columns={this.getDefaultColumns(columns)}
|
||||
data={data}
|
||||
height={40}/>
|
||||
data={data} />
|
||||
}
|
||||
};
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue