修改lib和render下的文件路径;bigData场景下增加钩子函数

This commit is contained in:
wanghaoo 2019-01-10 16:07:41 +08:00
parent 61d28a60af
commit 552e9822f9
14 changed files with 1065 additions and 1010 deletions

View File

@ -28,7 +28,7 @@ var _beeIcon = require('bee-icon');
var _beeIcon2 = _interopRequireDefault(_beeIcon);
var _i18n = require('./i18n');
var _i18n = require('./lib/i18n');
var _i18n2 = _interopRequireDefault(_i18n);

View File

@ -652,9 +652,15 @@ var TableHeader = function (_Component) {
}
thClassName += " " + fixedStyle;
if (!da.fixed) {
var keyTemp = {};
//避免key为undefined
if (da.dataindex) {
keyTemp.key = da.dataindex;
}
return _react2["default"].createElement(
"th",
_extends({}, da, { key: 'table-header-th-' + da.dataindex, className: thClassName, "data-th-fixed": da.fixed,
_extends({}, da, keyTemp, { className: thClassName, "data-th-fixed": da.fixed,
"data-line-key": da.key, "data-line-index": columIndex, "data-th-width": da.width }),
da.children,
dragborder ? _react2["default"].createElement(

View File

@ -16,8 +16,6 @@ var _propTypes = require("prop-types");
var _propTypes2 = _interopRequireDefault(_propTypes);
var _utils = require("../utils");
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; }
@ -102,7 +100,7 @@ function bigData(Table) {
BigData.prototype.getRowKey = function getRowKey(record, index) {
var rowKey = this.props.rowKey;
var key = typeof rowKey === 'function' ? rowKey(record, index) : record[rowKey];
(0, _utils.warningOnce)(key !== undefined, 'Each record in table should have a unique `key` prop,' + 'or set `rowKey` to an unique primary key.');
return key;
};
/**
@ -272,7 +270,8 @@ function bigData(Table) {
}(_react.Component), _class.defaultProps = {
data: [],
loadBuffer: 5,
rowKey: 'key'
rowKey: 'key',
onExpand: function onExpand() {}
}, _class.propTypes = {
loadBuffer: _propTypes2["default"].number
}, _initialiseProps = function _initialiseProps() {
@ -449,6 +448,8 @@ function bigData(Table) {
}), 1);
});
}
_this5.props.onExpand(expandState, record);
};
}, _temp;
}

View File

@ -22,7 +22,7 @@ var _beeIcon2 = _interopRequireDefault(_beeIcon);
var _util = require("./util");
var _i18n = require("../i18n");
var _i18n = require("./i18n");
var _i18n2 = _interopRequireDefault(_i18n);

1997
dist/demo.js vendored

File diff suppressed because one or more lines are too long

2
dist/demo.js.map vendored

File diff suppressed because one or more lines are too long

View File

@ -45,7 +45,7 @@ import 'bee-table/build/Table.css';
| expandedRowRender | 额外的展开行 | Function(record, index, indent):node | - |
| expandIconAsCell | 展开按钮是否单独作为一个单元格 | bool | false |
| expandRowByClick | 设置展开行是否通过点击行触发,此参数需要与上面参数搭配使用(默认是通过点击行前面的加号展开行 | bool | false |
| footerScroll | 表尾和body是否公用同一个横向滚动条。 如果footer中也是一个table组件并且也具有滚动条那么也需要加入footerScroll参数。 | bool | false |
| footerScroll | 表尾和body是否公用同一个横向滚动条。 如果footer中也是一个table组件并且也具有滚动条那么也需要加入footerScroll参数内层表格的footerScroll设置成false | bool | false |
| loading | 表格是否加载中 | bool|object(详情可以参考上面示例) | false |
| haveExpandIcon | 控制是否显示行展开icon.**注该参数只有在和expandedRowRender同时使用才生效** | Function(record, index):bool | () =>false |
| filterable | 是否开启根据条件来过滤数据 | bool | false

View File

@ -8,7 +8,7 @@ import Dropdown from 'bee-dropdown';
import Menu from 'bee-menus';
import Button from 'bee-button';
import Icon from 'bee-icon';
import i18n from './i18n';
import i18n from './lib/i18n';
import { getComponentLocale } from 'bee-locale/build/tool';
const { Item } = Menu;

View File

@ -980,7 +980,7 @@ class Table extends Component {
handleBodyScroll(e) {
const { scroll = {},clsPrefix,handleScroll } = this.props;
const { scroll = {},clsPrefix,handleScrollY, handleScrollX} = this.props;
const { headTable, bodyTable, fixedColumnsBodyLeft, fixedColumnsBodyRight } = this.refs;
// Prevent scrollTop setter trigger onScroll event
// http://stackoverflow.com/q/1386696
@ -1008,6 +1008,11 @@ class Table extends Component {
.remove(new RegExp(`^${clsPrefix}-scroll-position-.+$`))
.add(`${clsPrefix}-scroll-position-${position}`);
}
if(handleScrollX){
debounce(
handleScrollX(e.target.scrollLeft,this.treeType),
300)
}
}
// console.log('lastScrollTop--'+this.lastScrollTop+'--eventScrollTop--'+ e.target.scrollTop);
if (scroll.y && this.lastScrollTop != e.target.scrollTop) {
@ -1021,9 +1026,9 @@ class Table extends Component {
bodyTable.scrollTop = e.target.scrollTop;
}
this.lastScrollTop = e.target.scrollTop;
if(handleScroll){
if(handleScrollY){
debounce(
handleScroll(this.lastScrollTop,this.treeType),
handleScrollY(this.lastScrollTop,this.treeType),
300)
}
}

View File

@ -574,16 +574,22 @@ class TableHeader extends Component {
}
thClassName += ` ${fixedStyle}`;
if(!da.fixed){
return (<th {...da} key={'table-header-th-'+da.dataindex} className={thClassName} data-th-fixed={da.fixed}
const keyTemp = {};
//避免key为undefined
if(da.dataindex){
keyTemp.key = da.dataindex
}
return (<th {...da} {...keyTemp} className={thClassName} data-th-fixed={da.fixed}
data-line-key={da.key} data-line-index={columIndex} data-th-width={da.width} >
{da.children}
{
dragborder ? <div ref={el => (this.gap = el)} data-line-key={da.key}
data-line-index={columIndex} data-th-width={da.width}
data-type="online" className = {`${clsPrefix}-thead-th-drag-gap`}>
<div id='th-online' className='online' data-line-key={da.key} data-line-index={columIndex} data-th-width={da.width} /></div>:""
}
</th>)
{da.children}
{
dragborder ? <div ref={el => (this.gap = el)} data-line-key={da.key}
data-line-index={columIndex} data-th-width={da.width}
data-type="online" className = {`${clsPrefix}-thead-th-drag-gap`}>
<div id='th-online' className='online' data-line-key={da.key} data-line-index={columIndex} data-th-width={da.width} /></div>:""
}
</th>)
}else{
thDefaultObj = {
...da,

View File

@ -1,6 +1,5 @@
import React, { Component } from "react";
import PropTypes from "prop-types";
import { warningOnce } from '../utils';
const defaultHeight = 40;
const rowDiff = 3; //行差值
let treeTypeIndex = 0;
@ -10,6 +9,7 @@ export default function bigData(Table) {
data: [],
loadBuffer: 5,
rowKey: 'key',
onExpand() { },
};
static propTypes = {
loadBuffer: PropTypes.number
@ -75,11 +75,7 @@ export default function bigData(Table) {
const rowKey = this.props.rowKey;
const key = (typeof rowKey === 'function') ?
rowKey(record, index) : record[rowKey];
warningOnce(
key !== undefined,
'Each record in table should have a unique `key` prop,' +
'or set `rowKey` to an unique primary key.'
);
return key;
}
/**
@ -151,7 +147,7 @@ export default function bigData(Table) {
*@param 最新一次滚动的scrollTop
*@param treeType是否是树状表
*/
handleScroll = (nextScrollTop, treeType) => {
handleScrollY = (nextScrollTop, treeType) => {
//树表逻辑
// 关键点是动态的获取startIndex和endIndex
// 法子一子节点也看成普通tr最开始需要设置一共有多少行哪行显示哪行不显示如何确定
@ -355,6 +351,8 @@ export default function bigData(Table) {
_this.expandChildRowKeys.splice(_this.expandChildRowKeys.findIndex(fitem => fitem.key === item.key), 1)
})
}
_this.props.onExpand(expandState, record);
}
render() {
@ -386,7 +384,7 @@ export default function bigData(Table) {
{...this.props}
data={data.slice(startIndex, endIndex)}
lazyLoad={lazyLoad}
handleScroll={this.handleScroll}
handleScrollY={this.handleScrollY}
scrollTop={scrollTop}
setRowHeight={this.setRowHeight}
setRowParentIndex = {this.setRowParentIndex}

View File

@ -2,7 +2,7 @@ import React, { Component } from "react";
import Checkbox from "bee-checkbox";
import Icon from "bee-icon";
import { ObjectAssign } from "./util";
import i18n from "../i18n";
import i18n from "./i18n";
import { getComponentLocale } from "bee-locale/build/tool";
function noop() {}