innov
/
bee-table
1
0
Fork 0
Code Issues Pull Requests 3 Projects Releases Wiki Activity

publish 2.0.0

This commit is contained in:
yangchch6 2019-03-01 11:08:23 +08:00
parent 9c97af1c02
commit 6c8af4fcab
28 changed files with 6724 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
CHANGELOG.md
View File

@ -1,5 +1,5 @@
<a name="1.6.44"></a>
## [1.6.44](https://github.com/tinper-bee/bee-table/compare/v1.6.43...v1.6.44) (2019-02-26)
<a name="2.0.0"></a>
# [2.0.0](https://github.com/tinper-bee/bee-table/compare/v1.6.43...v2.0.0) (2019-03-01)
@ -294,7 +294,7 @@
<a name="1.5.1"></a>
## [1.5.1](https://github.com/tinper-bee/bee-table/compare/v1.5.0...v1.5.1) (2018-11-19)
## [1.5.1](https://github.com/tinper-bee/bee-table/compare/v1.5.0...v1.5.1) (2018-11-18)

313
build/ColumnManager.js Normal file
View File

@ -0,0 +1,313 @@
'use strict';
Object.defineProperty(exports, "__esModule", {
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; };
var _react = require('react');
var _react2 = _interopRequireDefault(_react);
var _Column = require('./Column');
var _Column2 = _interopRequireDefault(_Column);
var _ColumnGroup = require('./ColumnGroup');
var _ColumnGroup2 = _interopRequireDefault(_ColumnGroup);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
function _toConsumableArray(arr) { if (Array.isArray(arr)) { for (var i = 0, arr2 = Array(arr.length); i < arr.length; i++) { arr2[i] = arr[i]; } return arr2; } else { return Array.from(arr); } }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
//行控制管理
var ColumnManager = function () {
function ColumnManager(columns, elements, originWidth) {
_classCallCheck(this, ColumnManager);
this._cached = {};
this.columns = columns || this.normalize(elements);
this.originWidth = originWidth;
}
ColumnManager.prototype.isAnyColumnsFixed = function isAnyColumnsFixed() {
var _this = this;
return this._cache('isAnyColumnsFixed', function () {
return _this.columns.some(function (column) {
return !!column.fixed;
});
});
};
ColumnManager.prototype.isAnyColumnsLeftFixed = function isAnyColumnsLeftFixed() {
var _this2 = this;
return this._cache('isAnyColumnsLeftFixed', function () {
return _this2.columns.some(function (column) {
return column.fixed === 'left' || column.fixed === true;
});
});
};
ColumnManager.prototype.isAnyColumnsRightFixed = function isAnyColumnsRightFixed() {
var _this3 = this;
return this._cache('isAnyColumnsRightFixed', function () {
return _this3.columns.some(function (column) {
return column.fixed === 'right';
});
});
};
ColumnManager.prototype.leftColumns = function leftColumns() {
var _this4 = this;
return this._cache('leftColumns', function () {
return _this4.groupedColumns().filter(function (column) {
return column.fixed === 'left' || column.fixed === true;
});
});
};
ColumnManager.prototype.rightColumns = function rightColumns() {
var _this5 = this;
return this._cache('rightColumns', function () {
return _this5.groupedColumns().filter(function (column) {
return column.fixed === 'right';
});
});
};
ColumnManager.prototype.centerColumns = function centerColumns() {
var _this6 = this;
return this._cache('centerColumns', function () {
return _this6.groupedColumns().filter(function (column) {
return !column.fixed;
});
});
};
ColumnManager.prototype.leafColumns = function leafColumns() {
var _this7 = this;
return this._cache('leafColumns', function () {
return _this7._leafColumns(_this7.columns);
});
};
ColumnManager.prototype.leftLeafColumns = function leftLeafColumns() {
var _this8 = this;
return this._cache('leftLeafColumns', function () {
return _this8._leafColumns(_this8.leftColumns());
});
};
ColumnManager.prototype.rightLeafColumns = function rightLeafColumns() {
var _this9 = this;
return this._cache('rightLeafColumns', function () {
return _this9._leafColumns(_this9.rightColumns());
});
};
ColumnManager.prototype.centerLeafColumns = function centerLeafColumns() {
var _this10 = this;
return this._cache('centerLeafColumns', function () {
return _this10._leafColumns(_this10.centerColumns());
});
};
// add appropriate rowspan and colspan to column
ColumnManager.prototype.groupedColumns = function groupedColumns(type) {
var _this11 = this;
return this._cache('groupedColumns', function () {
var _groupColumns = function _groupColumns(columns) {
var currentRow = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
var parentColumn = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
var rows = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : [];
// track how many rows we got
rows[currentRow] = rows[currentRow] || [];
var grouped = [];
var setRowSpan = function setRowSpan(column) {
var rowSpan = rows.length - currentRow;
if (column && !column.children && // parent columns are supposed to be one row
rowSpan > 1 && (!column.rowSpan || column.rowSpan < rowSpan)) {
column.rowSpan = rowSpan;
}
};
columns.forEach(function (column, index) {
var defaultOpt = {
ifshow: true
};
if (!_this11.originWidth) {
defaultOpt.width = 200;
}
//获取非固定列
if (type == 'nofixed' && column.fixed) {
return false;
}
var newColumn = _extends({}, defaultOpt, column);
rows[currentRow].push(newColumn);
parentColumn.colSpan = parentColumn.colSpan || 0;
if (newColumn.children && newColumn.children.length > 0) {
newColumn.children = _groupColumns(newColumn.children, currentRow + 1, newColumn, rows);
parentColumn.colSpan = parentColumn.colSpan + newColumn.colSpan;
} else {
parentColumn.colSpan++;
}
// update rowspan to all same row columns
for (var i = 0; i < rows[currentRow].length - 1; ++i) {
setRowSpan(rows[currentRow][i]);
}
// last column, update rowspan immediately
if (index + 1 === columns.length) {
setRowSpan(newColumn);
}
grouped.push(newColumn);
});
return grouped;
};
return _groupColumns(_this11.columns);
});
};
ColumnManager.prototype.normalize = function normalize(elements) {
var _this12 = this;
var columns = [];
_react2["default"].Children.forEach(elements, function (element) {
if (!_this12.isColumnElement(element)) return;
var column = _extends({}, element.props);
if (element.key) {
column.key = element.key;
}
if (element.type === _ColumnGroup2["default"]) {
column.children = _this12.normalize(column.children);
}
columns.push(column);
});
return columns;
};
ColumnManager.prototype.isColumnElement = function isColumnElement(element) {
return element && (element.type === _Column2["default"] || element.type === _ColumnGroup2["default"]);
};
ColumnManager.prototype.reset = function reset(columns, elements) {
this.columns = columns || this.normalize(elements);
this._cached = {};
};
ColumnManager.prototype.getColumnWidth = function getColumnWidth(contentWidth) {
var columns = this.leafColumns();
var res = { computeWidth: 0, lastShowIndex: -1 };
columns.forEach(function (col, index) {
//如果列显示
if (col.ifshow) {
var width = col.width;
if (typeof width == 'string' && width.includes('%')) {
width = contentWidth * parseInt(col.width) / 100;
}
res.computeWidth += parseInt(width);
if (!col.fixed) {
res.lastShowIndex = index;
}
}
});
return res;
};
ColumnManager.prototype.getLeftColumnsWidth = function getLeftColumnsWidth() {
var _this13 = this;
var contentWidth = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 1;
return this._cache('leftColumnsWidth', function () {
var leftColumnsWidth = 0;
_this13.groupedColumns().forEach(function (column) {
if (column.fixed === 'left' || column.fixed === true) {
var width = column.width;
if (typeof width == 'string' && width.includes('%')) {
width = contentWidth * parseInt(col.width) / 100;
}
leftColumnsWidth += parseInt(width);
}
});
return leftColumnsWidth;
});
};
ColumnManager.prototype.getRightColumnsWidth = function getRightColumnsWidth() {
var _this14 = this;
var contentWidth = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 1;
return this._cache('rightColumnsWidth', function () {
var rightColumnsWidth = 0;
_this14.groupedColumns().forEach(function (column) {
if (column.fixed === 'right') {
var width = column.width;
if (typeof width == 'string' && width.includes('%')) {
width = contentWidth * parseInt(col.width) / 100;
}
rightColumnsWidth += parseInt(width);
}
});
return rightColumnsWidth;
});
};
ColumnManager.prototype._cache = function _cache(name, fn) {
if (name in this._cached) {
return this._cached[name];
}
this._cached[name] = fn();
return this._cached[name];
};
//todo 含有children的宽度计算
ColumnManager.prototype._leafColumns = function _leafColumns(columns) {
var _this15 = this;
var leafColumns = [];
columns.forEach(function (column) {
if (!column.children) {
var defaultOpt = {
ifshow: true
};
if (!_this15.originWidth) {
defaultOpt.width = 200;
}
var newColumn = _extends({}, defaultOpt, column);
leafColumns.push(newColumn);
} else {
leafColumns.push.apply(leafColumns, _toConsumableArray(_this15._leafColumns(column.children)));
}
});
return leafColumns;
};
return ColumnManager;
}();
exports["default"] = ColumnManager;
module.exports = exports['default'];

83
build/ExpandIcon.js Normal file
View File

@ -0,0 +1,83 @@
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _react = require('react');
var _react2 = _interopRequireDefault(_react);
var _propTypes = require('prop-types');
var _propTypes2 = _interopRequireDefault(_propTypes);
var _shallowequal = require('shallowequal');
var _shallowequal2 = _interopRequireDefault(_shallowequal);
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; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : _defaults(subClass, superClass); }
var propTypes = {
record: _propTypes2["default"].object,
clsPrefix: _propTypes2["default"].string,
expandable: _propTypes2["default"].any,
expanded: _propTypes2["default"].bool,
needIndentSpaced: _propTypes2["default"].bool,
onExpand: _propTypes2["default"].func
};
var ExpandIcon = function (_Component) {
_inherits(ExpandIcon, _Component);
function ExpandIcon(props) {
_classCallCheck(this, ExpandIcon);
return _possibleConstructorReturn(this, _Component.call(this, props));
}
ExpandIcon.prototype.shouldComponentUpdate = function shouldComponentUpdate(nextProps) {
return !(0, _shallowequal2["default"])(nextProps, this.props);
};
ExpandIcon.prototype.render = function render() {
var _props = this.props,
expandable = _props.expandable,
clsPrefix = _props.clsPrefix,
onExpand = _props.onExpand,
needIndentSpaced = _props.needIndentSpaced,
expanded = _props.expanded,
record = _props.record,
isHiddenExpandIcon = _props.isHiddenExpandIcon;
if (expandable && !isHiddenExpandIcon) {
var expandClassName = expanded ? 'expanded' : 'collapsed';
return _react2["default"].createElement('span', {
className: clsPrefix + '-expand-icon ' + clsPrefix + '-' + expandClassName,
onClick: function onClick(e) {
return onExpand(!expanded, record, e);
}
});
} else if (needIndentSpaced || isHiddenExpandIcon) {
return _react2["default"].createElement('span', { className: clsPrefix + '-expand-icon ' + clsPrefix + '-spaced' });
}
return null;
};
return ExpandIcon;
}(_react.Component);
;
ExpandIcon.propTypes = propTypes;
exports["default"] = ExpandIcon;
module.exports = exports['default'];

317
build/FilterDropDown.js Normal file
View File

@ -0,0 +1,317 @@
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _react = require('react');
var _react2 = _interopRequireDefault(_react);
var _propTypes = require('prop-types');
var _propTypes2 = _interopRequireDefault(_propTypes);
var _beeDropdown = require('bee-dropdown');
var _beeDropdown2 = _interopRequireDefault(_beeDropdown);
var _beeMenus = require('bee-menus');
var _beeMenus2 = _interopRequireDefault(_beeMenus);
var _beeButton = require('bee-button');
var _beeButton2 = _interopRequireDefault(_beeButton);
var _beeIcon = require('bee-icon');
var _beeIcon2 = _interopRequireDefault(_beeIcon);
var _i18n = require('./lib/i18n');
var _i18n2 = _interopRequireDefault(_i18n);
var _tool = require('bee-locale/build/tool');
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; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : _defaults(subClass, superClass); } /**
* 过滤行功能内的下拉条件
*/
var Item = _beeMenus2["default"].Item;
var FilterDropDown = function (_Component) {
_inherits(FilterDropDown, _Component);
function FilterDropDown() {
_classCallCheck(this, FilterDropDown);
var _this = _possibleConstructorReturn(this, _Component.call(this));
_this.onSelectDropdown = function (item) {
var _this$props = _this.props,
onSelectDropdown = _this$props.onSelectDropdown,
filterDropdownType = _this$props.filterDropdownType;
if (onSelectDropdown) {
if (filterDropdownType == 'string') {
_this.setState({
selectValue: [item.key]
}, function () {
onSelectDropdown(item);
});
}
if (filterDropdownType == 'number') {
_this.setState({
selectNumberValue: [item.key]
}, function () {
onSelectDropdown(item);
});
}
}
};
_this.onClickClear = function () {
var onClickClear = _this.props.onClickClear;
if (onClickClear) {
_this.setState({
// selectValue: [],
// selectNumberValue: []
}, function () {
onClickClear();
});
}
};
_this.getMenu = function () {
var _this$state = _this.state,
selectValue = _this$state.selectValue,
selectNumberValue = _this$state.selectNumberValue;
var _this$props2 = _this.props,
filterDropdownType = _this$props2.filterDropdownType,
filterDropdownIncludeKeys = _this$props2.filterDropdownIncludeKeys;
var locale = (0, _tool.getComponentLocale)(_this.props, _this.context, 'Table', function () {
return _i18n2["default"];
});
var stringEnum = {
LIKE: 'include',
ULIKE: 'exclusive',
EQ: 'equal',
UEQ: 'unequal',
START: 'begin',
END: 'end'
};
var numberEnum = {
GT: 'greater_than',
GTEQ: 'great_than_equal_to',
LT: 'less_than',
LTEQ: 'less_than_equal_to',
EQ: 'be_equal_to',
UEQ: 'not_equal_to'
};
if (filterDropdownIncludeKeys != undefined) {
switch (filterDropdownType) {
case 'string':
return _react2["default"].createElement(
_beeMenus2["default"],
{
onSelect: _this.onSelectDropdown,
selectedKeys: selectValue
},
filterDropdownIncludeKeys.map(function (item) {
return _react2["default"].createElement(
Item,
{ key: item },
locale[stringEnum[item]]
);
})
);
case 'number':
return _react2["default"].createElement(
_beeMenus2["default"],
{
onSelect: _this.onSelectDropdown,
selectedKeys: selectNumberValue
},
filterDropdownIncludeKeys.map(function (item) {
return _react2["default"].createElement(
Item,
{ key: item },
locale[numberEnum[item]]
);
})
);
default:
return _react2["default"].createElement('div', null);
}
} else {
switch (filterDropdownType) {
case 'string':
return _react2["default"].createElement(
_beeMenus2["default"],
{
onSelect: _this.onSelectDropdown,
selectedKeys: selectValue
},
_react2["default"].createElement(
Item,
{ key: 'LIKE' },
locale['include']
),
_react2["default"].createElement(
Item,
{ key: 'ULIKE' },
locale['exclusive']
),
_react2["default"].createElement(
Item,
{ key: 'EQ' },
locale['equal']
),
_react2["default"].createElement(
Item,
{ key: 'UEQ' },
locale['unequal']
),
_react2["default"].createElement(
Item,
{ key: 'RLIKE' },
locale['begin']
),
_react2["default"].createElement(
Item,
{ key: 'LLIKE' },
locale['end']
)
);
case 'number':
return _react2["default"].createElement(
_beeMenus2["default"],
{
onSelect: _this.onSelectDropdown,
selectedKeys: selectNumberValue
},
_react2["default"].createElement(
Item,
{ key: 'GT' },
locale['greater_than']
),
_react2["default"].createElement(
Item,
{ key: 'GTEQ' },
locale['great_than_equal_to']
),
_react2["default"].createElement(
Item,
{ key: 'LT' },
locale['less_than']
),
_react2["default"].createElement(
Item,
{ key: 'LTEQ' },
locale['less_than_equal_to']
),
_react2["default"].createElement(
Item,
{ key: 'EQ' },
locale['be_equal_to']
),
_react2["default"].createElement(
Item,
{ key: 'UEQ' },
locale['not_equal_to']
)
);
default:
return _react2["default"].createElement('div', null);
}
}
};
_this.state = {
selectValue: ['LIKE'],
selectNumberValue: ['EQ']
};
return _this;
}
/**
* 点击下拉菜单
*
* @param {*} s 选中的selectRecord
*/
/**
* 清除事件
*
*/
/**
* 根据props来获得指定的Menu,分为String和Number
*
* @returns JSX Menu
*/
FilterDropDown.prototype.render = function render() {
var isShowCondition = this.props.isShowCondition;
return _react2["default"].createElement(
'div',
{ className: 'filter-btns' },
isShowCondition == 'show' && _react2["default"].createElement(
_beeDropdown2["default"],
{
overlayClassName: 'u-filter-dropdown-menu-wrap',
trigger: ['click'],
overlay: this.getMenu(),
animation: 'slide-up'
},
_react2["default"].createElement(
_beeButton2["default"],
{
shape: 'border',
style: { marginLeft: "3px", minWidth: "0px", width: "24px", padding: 0 }
},
_react2["default"].createElement(_beeIcon2["default"], { style: { padding: 0, color: '#585858' }, type: 'uf-filter' })
)
),
_react2["default"].createElement(
_beeButton2["default"],
{
onClick: this.onClickClear,
shape: 'border',
style: { marginLeft: "1px", minWidth: "0px", width: "24px", padding: 0, "visibility": this.props.isShowClear || this.state.selectValue.length > 0 ? "visible" : "hidden" }
},
_react2["default"].createElement(_beeIcon2["default"], { style: { padding: 0, color: '#585858', "visibility": this.props.isShowClear || this.state.selectValue.length > 0 ? "visible" : "hidden" }, type: 'uf-filterno' })
)
);
};
return FilterDropDown;
}(_react.Component);
FilterDropDown.propTypes = {
isShowCondition: _propTypes2["default"].string,
filterDropdownType: _propTypes2["default"].oneOf(['string', 'number'])
};
FilterDropDown.defaultProps = {
isShowCondition: 'show',
filterDropdownType: 'string'
};
exports["default"] = FilterDropDown;
module.exports = exports['default'];

420
build/FilterType.js Normal file
View File

@ -0,0 +1,420 @@
'use strict';
Object.defineProperty(exports, "__esModule", {
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; };
var _react = require('react');
var _react2 = _interopRequireDefault(_react);
var _propTypes = require('prop-types');
var _propTypes2 = _interopRequireDefault(_propTypes);
var _zh_CN = require('rc-calendar/lib/locale/zh_CN');
var _zh_CN2 = _interopRequireDefault(_zh_CN);
var _beeFormControl = require('bee-form-control');
var _beeFormControl2 = _interopRequireDefault(_beeFormControl);
var _beeSelect = require('bee-select');
var _beeSelect2 = _interopRequireDefault(_beeSelect);
var _beeInputNumber = require('bee-input-number');
var _beeInputNumber2 = _interopRequireDefault(_beeInputNumber);
var _beeDatepicker = require('bee-datepicker');
var _beeDatepicker2 = _interopRequireDefault(_beeDatepicker);
var _FilterDropDown = require('./FilterDropDown');
var _FilterDropDown2 = _interopRequireDefault(_FilterDropDown);
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; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : _defaults(subClass, superClass); }
var RangePicker = _beeDatepicker2["default"].RangePicker;
var propTypes = {
filterDropdown: _propTypes2["default"].string
};
var FilterType = function (_Component) {
_inherits(FilterType, _Component);
function FilterType(props) {
_classCallCheck(this, FilterType);
var _this = _possibleConstructorReturn(this, _Component.call(this, props));
_this.clearFilter = function () {
var _this$props = _this.props,
onFilterClear = _this$props.onFilterClear,
dataIndex = _this$props.dataIndex;
if (_this.state.value !== "") {
_this.setState({
value: "", //清空值
condition: _this.props.filterDropdownType == 'string' ? 'LIKE' : 'EQ' //切回默认查询条件
}, function () {
//调用清除方法参数为当前字段的field
onFilterClear && onFilterClear(dataIndex);
});
}
};
_this.changeText = function (val) {
_this.setState({
value: val
});
};
_this.changeTextCall = function (e) {
var _this$props2 = _this.props,
onFilterChange = _this$props2.onFilterChange,
dataIndex = _this$props2.dataIndex;
if (e.keyCode == 13) {
e.target.value !== "" && onFilterChange(dataIndex, e.target.value, _this.state.condition);
}
};
_this.changeValue = function () {
_this.setState({
value: ""
});
};
_this.onSelectDropdown = function (item) {
var _this$props3 = _this.props,
onFilterChange = _this$props3.onFilterChange,
dataIndex = _this$props3.dataIndex;
_this.setState({
condition: item.key
}, function () {
_this.state.value !== "" && onFilterChange && onFilterChange(dataIndex, _this.state.value, _this.state.condition);
});
};
_this.changeNumber = function (value) {
var _this$props4 = _this.props,
onFilterChange = _this$props4.onFilterChange,
dataIndex = _this$props4.dataIndex;
_this.setState({
value: value
}, function () {
onFilterChange(dataIndex, value, _this.state.condition);
});
};
_this.clearNumber = function () {
var onChange = _this.props.onChange;
onChange && onChange("");
_this.setState({
value: ""
});
};
_this.changeTextCallBlur = function (val) {
var onChange = _this.props.onChange;
onChange && onChange(val);
};
_this.changeSelect = function (value) {
var _this$props5 = _this.props,
onFilterChange = _this$props5.onFilterChange,
dataIndex = _this$props5.dataIndex;
if (onFilterChange) {
onFilterChange(dataIndex, value, _this.state.condition);
_this.setState({
value: value
});
}
};
_this.clearSelectValue = function () {
_this.setState({
selectValue: ""
}, function () {
_this.changeSelect("");
});
};
_this.clearDateValue = function () {
_this.setState({
dateValue: ""
}, function () {
_this.changeDate("");
});
};
_this.changeDate = function (value) {
var _this$props6 = _this.props,
onFilterChange = _this$props6.onFilterChange,
dataIndex = _this$props6.dataIndex;
if (onFilterChange) {
onFilterChange(dataIndex, value, _this.state.condition);
_this.setState({
value: value,
open: false
});
}
};
_this.renderControl = function (rendertype) {
var _this$props7 = _this.props,
filterInputNumberOptions = _this$props7.filterInputNumberOptions,
filterDropdownIncludeKeys = _this$props7.filterDropdownIncludeKeys,
dataIndex = _this$props7.dataIndex,
filterDropdown = _this$props7.filterDropdown,
filterDropdownType = _this$props7.filterDropdownType,
format = _this$props7.format,
className = _this$props7.className,
onChange = _this$props7.onChange,
onSelectDropdown = _this$props7.onSelectDropdown,
clsPrefix = _this$props7.clsPrefix,
locale = _this$props7.locale;
switch (rendertype) {
case 'text':
return _react2["default"].createElement(
'div',
{ className: clsPrefix + ' filter-wrap' },
_react2["default"].createElement(_beeFormControl2["default"], {
value: _this.state.value,
className: className,
onChange: _this.changeText,
onKeyDown: _this.changeTextCall
//onBlur={this.changeTextCallBlur}
}),
_react2["default"].createElement(_FilterDropDown2["default"], {
locale: locale,
dataIndex: dataIndex,
dataText: _this.state.value,
onSelectDropdown: _this.onSelectDropdown,
onClickClear: _this.clearFilter,
isShowClear: _this.state.value,
isShowCondition: filterDropdown,
filterDropdownType: filterDropdownType,
filterDropdownIncludeKeys: filterDropdownIncludeKeys
})
);
case 'number':
return _react2["default"].createElement(
'div',
{ className: clsPrefix + ' filter-wrap' },
_react2["default"].createElement(_beeInputNumber2["default"], _extends({}, filterInputNumberOptions, {
className: className,
value: _this.state.value,
onChange: _this.changeNumber,
iconStyle: 'one'
})),
_react2["default"].createElement(_FilterDropDown2["default"], {
locale: locale,
dataIndex: dataIndex,
dataText: _this.state.value,
onSelectDropdown: _this.onSelectDropdown,
onClickClear: _this.clearFilter,
isShowClear: _this.state.value != 0,
isShowCondition: filterDropdown,
filterDropdownType: filterDropdownType,
filterDropdownIncludeKeys: filterDropdownIncludeKeys
})
);
case 'dropdown':
return _react2["default"].createElement(
'div',
{ className: clsPrefix + ' filter-wrap' },
_react2["default"].createElement(_beeSelect2["default"], _extends({}, _this.props, {
value: _this.state.value,
onChange: _this.changeSelect
})),
_react2["default"].createElement(_FilterDropDown2["default"], {
locale: locale,
dataIndex: dataIndex,
dataText: _this.state.value,
onSelectDropdown: _this.onSelectDropdown,
onClickClear: _this.clearFilter,
isShowCondition: filterDropdown,
isShowClear: _this.state.value,
filterDropdownType: filterDropdownType,
filterDropdownIncludeKeys: filterDropdownIncludeKeys
})
);
case 'date':
return _react2["default"].createElement(
'div',
{ className: clsPrefix + ' filter-wrap' },
_react2["default"].createElement(_beeDatepicker2["default"], _extends({}, _this.props, {
value: _this.state.value,
onChange: _this.changeDate,
open: _this.state.open,
format: format,
locale: _zh_CN2["default"]
})),
_react2["default"].createElement(_FilterDropDown2["default"], {
locale: locale,
dataIndex: dataIndex,
dataText: _this.state.value,
onSelectDropdown: _this.onSelectDropdown,
onClickClear: _this.clearFilter,
isShowCondition: filterDropdown,
isShowClear: _this.state.value,
filterDropdownType: filterDropdownType,
filterDropdownIncludeKeys: filterDropdownIncludeKeys
})
);
case 'daterange':
return _react2["default"].createElement(
'div',
{ className: clsPrefix + ' filter-wrap' },
_react2["default"].createElement(RangePicker, _extends({}, _this.props, {
value: _this.state.value,
onChange: _this.changeDate,
open: _this.state.open,
format: format,
showTime: true,
locale: _zh_CN2["default"],
placeholder: '开始 ~ 结束',
dateInputPlaceholder: ['开始', '结束'],
showClear: true
})),
_react2["default"].createElement(_FilterDropDown2["default"], {
locale: locale,
dataIndex: dataIndex,
dataText: _this.state.value,
onSelectDropdown: _this.onSelectDropdown,
onClickClear: _this.clearFilter,
isShowCondition: filterDropdown,
isShowClear: _this.state.value,
filterDropdownIncludeKeys: filterDropdownIncludeKeys
})
);
case 'bool':
return _react2["default"].createElement(
'div',
{ className: clsPrefix + ' filter-wrap' },
_react2["default"].createElement(Switch, {
className: className,
onChange: onChange
}),
_react2["default"].createElement(_FilterDropDown2["default"], { locale: locale,
onSelectDropdown: onSelectDropdown,
filterDropdownIncludeKeys: filterDropdownIncludeKeys
})
);
default:
return _react2["default"].createElement('div', null);
}
};
_this.state = {
value: "",
text: "",
selectValue: "",
dateValue: "",
open: false,
condition: props.filterDropdownType == 'string' ? 'LIKE' : 'EQ',
number: 0
};
return _this;
}
/**
* 清除过滤条件
*
*/
/**
* 设置输入文本的值
*
*/
/**
* 输入框回车执行回调
*
*/
/**
* 更改修改值
*
*/
/**
* 下拉条件的回调
*
* @param {*} key 字段
* @param {*} value 值1,2,3...6
*/
/**
* 修改数值型的值
*
*/
//清除数值
//失去焦点后执行函数
//设置下拉值
//清除下拉值
//清除日期值
//设置日期值
//组件渲染
/**
* 根据不同的类型生成对应的组件类型包含一些参数的适应
*
* @param {*} rendertype 参数类型，包括['text','dropdown','date','daterange','number']
* @returns
*/
FilterType.prototype.render = function render() {
var rendertype = this.props.rendertype;
return _react2["default"].createElement(
'div',
{ 'data-filter-type': 'filterContext' },
this.renderControl(rendertype)
);
};
return FilterType;
}(_react.Component);
FilterType.propTypes = propTypes;
FilterType.defaultProps = {
filterDropdown: 'show'
};
exports["default"] = FilterType;
module.exports = exports['default'];

42
build/Table.css
View File

@ -180,21 +180,21 @@
.u-table td {
border-bottom: 1px solid rgb(233,233,233); }
.u-table td a {
color: rgb(30,136,229); }
color: rgb(245, 60, 50); }
.u-table td a:hover {
color: rgb(66,165,245); }
color: rgb(230, 0, 18); }
.u-table td a:active {
color: rgb(21,101,192); }
color: rgb(230, 0, 18); }
.u-table tr:hover td .uf-eye {
visibility: visible !important; }
.u-table tr tr a {
color: rgb(30,136,229); }
color: rgb(245, 60, 50); }
.u-table tr tr a:hover {
color: rgb(66,165,245); }
color: rgb(230, 0, 18); }
.u-table tr tr a:active {
color: rgb(21,101,192); }
color: rgb(230, 0, 18); }
.u-table tr.tr-row-hover {
background: rgb(227,242,253); }
background: rgb(235, 236, 240); }
.u-table th,
.u-table td {
padding: 12px 8px;
@ -205,7 +205,7 @@
.u-table tr.filterable th .filterContext {
height: 35px; }
.u-table-row-hover {
background: rgb(227,242,253); }
background: rgb(235, 236, 240); }
.u-table-scroll {
overflow: auto; }
.u-table-bordered table {
@ -285,7 +285,7 @@
.u-table-row-collapsed:after, .u-table-expanded-row-collapsed:after {
content: "+"; }
.u-table-row.selected {
background: rgb(227,242,253); }
background: rgb(235, 236, 240); }
.u-table tr.u-table-expanded-row {
background: #f7f7f7; }
.u-table tr.u-table-expanded-row:hover {
@ -401,7 +401,7 @@
.u-table-thead .th-drag {
cursor: move; }
.u-table-thead .th-drag:hover {
background: rgb(227,242,253); }
background: rgb(235, 236, 240); }
.u-table-thead .th-drag-hover {
background: #ccc; }
.u-table-thead-th {
@ -665,3 +665,25 @@
.u-row-hover2 {
position: absolute;
left: 100; }
::-webkit-scrollbar {
width: 8px;
height: 8px; }
::-webkit-scrollbar-button {
display: none; }
::-webkit-scrollbar-thumb {
background: #d5d5d5 !important;
border-radius: 5px; }
::-webkit-scrollbar-thumb {
border-radius: 4px;
background-color: #d5d5d5;
position: absolute; }
::-webkit-scrollbar-track {
display: none; }
::-webkit-scrollbar-track-piece {
display: none; }

1338
build/Table.js Normal file
View File

File diff suppressed because it is too large Load Diff

139
build/TableCell.js Normal file
View File

@ -0,0 +1,139 @@
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _react = require('react');
var _react2 = _interopRequireDefault(_react);
var _propTypes = require('prop-types');
var _propTypes2 = _interopRequireDefault(_propTypes);
var _objectPath = require('object-path');
var _objectPath2 = _interopRequireDefault(_objectPath);
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; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : _defaults(subClass, superClass); }
var propTypes = {
record: _propTypes2["default"].object,
clsPrefix: _propTypes2["default"].string,
index: _propTypes2["default"].number,
indent: _propTypes2["default"].number,
indentSize: _propTypes2["default"].number,
column: _propTypes2["default"].object,
expandIcon: _propTypes2["default"].node
};
var TableCell = function (_Component) {
_inherits(TableCell, _Component);
function TableCell(props) {
_classCallCheck(this, TableCell);
var _this = _possibleConstructorReturn(this, _Component.call(this, props));
_this.isInvalidRenderCellText = _this.isInvalidRenderCellText.bind(_this);
_this.handleClick = _this.handleClick.bind(_this);
return _this;
}
TableCell.prototype.isInvalidRenderCellText = function isInvalidRenderCellText(text) {
return text && !_react2["default"].isValidElement(text) && Object.prototype.toString.call(text) === '[object Object]';
};
TableCell.prototype.handleClick = function handleClick(e) {
var _props = this.props,
record = _props.record,
onCellClick = _props.column.onCellClick;
if (onCellClick) {
onCellClick(record, e);
}
};
TableCell.prototype.render = function render() {
var _props2 = this.props,
record = _props2.record,
indentSize = _props2.indentSize,
clsPrefix = _props2.clsPrefix,
indent = _props2.indent,
index = _props2.index,
expandIcon = _props2.expandIcon,
column = _props2.column,
fixed = _props2.fixed,
showSum = _props2.showSum;
var dataIndex = column.dataIndex,
render = column.render;
var _column$className = column.className,
className = _column$className === undefined ? '' : _column$className;
var text = _objectPath2["default"].get(record, dataIndex);
var tdProps = void 0;
var colSpan = void 0;
var rowSpan = void 0;
if (render && !showSum) {
text = render(text, record, index);
if (this.isInvalidRenderCellText(text)) {
tdProps = text.props || {};
rowSpan = tdProps.rowSpan;
colSpan = tdProps.colSpan;
text = text.children;
}
}
if (this.isInvalidRenderCellText(text)) {
text = null;
}
var indentText = expandIcon ? _react2["default"].createElement('span', {
style: { paddingLeft: indentSize * indent + 'px' },
className: clsPrefix + '-indent indent-level-' + indent
}) : null;
if (rowSpan === 0 || colSpan === 0) {
return null;
}
//不是固定表格并且当前列是固定，则隐藏当前列
if (column.fixed && !fixed) {
className = className + (' ' + clsPrefix + '-fixed-columns-in-body');
}
if (column.textAlign) {
className = className + (' text-' + column.textAlign);
}
return _react2["default"].createElement(
'td',
{
colSpan: colSpan,
rowSpan: rowSpan,
className: className,
onClick: this.handleClick
},
indentText,
expandIcon,
text
);
};
return TableCell;
}(_react.Component);
;
TableCell.propTypes = propTypes;
exports["default"] = TableCell;
module.exports = exports['default'];

751
build/TableHeader.js Normal file
View File

@ -0,0 +1,751 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
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; };
var _react = require("react");
var _react2 = _interopRequireDefault(_react);
var _reactDom = require("react-dom");
var _reactDom2 = _interopRequireDefault(_reactDom);
var _propTypes = require("prop-types");
var _propTypes2 = _interopRequireDefault(_propTypes);
var _throttleDebounce = require("throttle-debounce");
var _utils = require("./utils");
var _FilterType = require("./FilterType");
var _FilterType2 = _interopRequireDefault(_FilterType);
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; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : _defaults(subClass, superClass); }
var propTypes = {
clsPrefix: _propTypes2["default"].string,
rowStyle: _propTypes2["default"].object,
rows: _propTypes2["default"].array
};
var TableHeader = function (_Component) {
_inherits(TableHeader, _Component);
function TableHeader(props) {
_classCallCheck(this, TableHeader);
var _this = _possibleConstructorReturn(this, _Component.call(this, props));
_this.optTableMargin = function (table, scrollbarWidth) {
if (table) {
table.style.marginBottom = scrollbarWidth + "px";
}
};
_this.optTableScroll = function (table) {
var overflow = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
if (table) {
var innerTable = table.querySelector('.u-table-body-inner');
if (innerTable) {
overflow.x && (innerTable.style.overflowX = overflow.x);
overflow.y && (innerTable.style.overflowY = overflow.y);
}
}
};
_this.onLineMouseMove = function (e) {
var _this$props = _this.props,
clsPrefix = _this$props.clsPrefix,
dragborder = _this$props.dragborder,
contentDomWidth = _this$props.contentDomWidth,
scrollbarWidth = _this$props.scrollbarWidth,
contentTable = _this$props.contentTable,
headerScroll = _this$props.headerScroll;
_utils.Event.stopPropagation(e);
var event = _utils.Event.getEvent(e);
if (!_this.props.dragborder) return;
if (_this.drag.option != "border") {
return false;
}
//移动改变宽度
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;
// if(newWidth > this.drag.minWidth){
if (newWidth > _this.minWidth) {
currentCols.style.width = newWidth + 'px';
//hao 支持固定表头拖拽 修改表体的width
if (_this.fixedTable.cols) {
_this.fixedTable.cols[_this.drag.currIndex].style.width = newWidth + "px";
}
var oldTableWidth = parseInt(_this.table.table.style.width ? _this.table.table.style.width : _this.table.table.scrollWidth);
var newTableWidth = oldTableWidth + diff;
_this.table.table.style.width = newTableWidth; //改变table的width
var showScroll = contentDomWidth - newTableWidth - scrollbarWidth;
var fixedLeftHeaderTable = contentTable.querySelector('.u-table-fixed-left .u-table-header');
var fixedRighHeadertTable = contentTable.querySelector('.u-table-fixed-right .u-table-header');
var contentTableHeader = contentTable.querySelector('.u-table-scroll .u-table-header');
var fixedLeftBodyTable = contentTable.querySelector('.u-table-fixed-left .u-table-body-outer');
var fixedRightBodyTable = contentTable.querySelector('.u-table-fixed-right .u-table-body-outer');
//表头滚动条处理
if (headerScroll) {
if (showScroll < 0) {
//找到固定列表格，设置表头的marginBottom值为scrollbarWidth;
contentTableHeader.style.overflowX = 'scroll';
_this.optTableMargin(fixedLeftHeaderTable, scrollbarWidth);
_this.optTableMargin(fixedRighHeadertTable, scrollbarWidth);
// fixedLeftHeaderTable && (fixedLeftHeaderTable.style.marginBottom = scrollbarWidth + "px");
// fixedRighHeadertTable && (fixedRighHeadertTable.style.marginBottom = scrollbarWidth + "px");
//todo inner scroll-x去掉；outer marginbottom 设置成-15px】
} else {
contentTableHeader.style.overflowX = 'hidden';
_this.optTableMargin(fixedLeftHeaderTable, 0);
_this.optTableMargin(fixedRighHeadertTable, 0);
}
} else {
if (showScroll < 0) {
_this.optTableMargin(fixedLeftBodyTable, '-' + scrollbarWidth);
_this.optTableMargin(fixedRightBodyTable, '-' + scrollbarWidth);
_this.optTableScroll(fixedLeftBodyTable, { x: 'scroll' });
_this.optTableScroll(fixedRightBodyTable, { x: 'scroll' });
} else {
_this.optTableMargin(fixedLeftBodyTable, 0);
_this.optTableMargin(fixedRightBodyTable, 0);
_this.optTableScroll(fixedLeftBodyTable, { x: 'auto' });
_this.optTableScroll(fixedRightBodyTable, { x: 'auto' });
}
}
}
};
_this.onLineMouseDown = function (e) {
_utils.Event.stopPropagation(e);
var event = _utils.Event.getEvent(e);
var _this$props2 = _this.props,
clsPrefix = _this$props2.clsPrefix,
contentTable = _this$props2.contentTable;
if (!_this.props.dragborder) return;
var currentIndex = parseInt(_utils.Event.getTarget(event).getAttribute("data-line-index"));
var defaultWidth = _utils.Event.getTarget(event).getAttribute("data-th-width");
var currentObj = _this.table.cols[currentIndex];
_this.drag.option = "border"; //拖拽操作
_this.drag.currIndex = currentIndex;
_this.drag.oldLeft = event.x;
_this.drag.oldWidth = parseInt(currentObj.style.width);
_this.drag.minWidth = currentObj.style.minWidth != "" ? parseInt(currentObj.style.minWidth) : defaultWidth;
};
_this.onLineMouseUp = function (event) {
var width = _this.drag.newWidth;
_this.clearDragBorder(event);
_this.props.onDropBorder(event, width);
};
_this.bodyonLineMouseMove = function (event) {
_this.clearDragBorder(event);
};
_this.dragAbleMouseDown = function (e) {
// Event.stopPropagation(e);
var event = _utils.Event.getEvent(e);
if (!_this.props.draggable) return;
var th = _this.getThDome(event.target);
if (!th) return;
event.target.setAttribute('draggable', true); //添加交换列效果
_this.drag.option = 'dragAble';
_this.currentDome = event.target;
_this.thEventListen([{ key: 'mouseup', fun: _this.dragAbleMouseUp }], '', true); //th
_this.removeDragBorderEvent(); //清理掉拖拽列宽的事件
_this.addDragAbleEvent(); //添加拖拽交换列的事件
};
_this.dragAbleMouseUp = function (e) {
_this.currentDome.setAttribute('draggable', false); //添加交换列效果
_this.removeDragAbleEvent();
_this.thEventListen([{ key: 'mouseup', fun: _this.dragAbleMouseUp }], 'remove', true); //th
//拖拽交换列事件
_this.thEventListen([{ key: 'mousedown', fun: _this.dragAbleMouseDown }], 'remove', true); //表示把事件添加到th元素上
_this.initEvent();
};
_this.onDragStart = function (e) {
var event = _utils.Event.getEvent(e);
if (!_this.props.draggable) return;
if (_this.drag.option === 'border') {
return;
}
var th = _this.getThDome(event.target);
if (!th) return;
var currentIndex = parseInt(th.getAttribute("data-line-index"));
var currentKey = event.target.getAttribute('data-line-key');
event.dataTransfer.effectAllowed = "move";
event.dataTransfer.setData("Text", currentKey);
_this.currentObj = _this.props.rows[0][currentIndex];
// event.dataTransfer.setDragImage(event.target, 0, 0);
};
_this.onDragOver = function (e) {
event.preventDefault();
};
_this.onDrop = function (e) {
if (!_this.props.draggable) return;
if (_this.drag.option === 'border') {
return;
}
_this.currentDome.setAttribute('draggable', false); //添加交换列效果
var data = _this.getCurrentEventData(e);
if (!data) return;
if (!_this.currentObj || _this.currentObj.key == data.key) return;
if (!_this.props.onDrop) return;
_this.props.onDrop(event, { dragSource: _this.currentObj, dragTarg: data });
};
_this.handlerFilterChange = function (key, value, condition) {
var onFilterChange = _this.props.onFilterChange;
if (onFilterChange) {
onFilterChange(key, value, condition);
}
};
_this.handlerFilterClear = function (field) {
var onFilterClear = _this.props.onFilterClear;
if (onFilterClear) {
onFilterClear(field);
}
};
_this.filterRenderType = function (type, dataIndex, index) {
var _this$props3 = _this.props,
clsPrefix = _this$props3.clsPrefix,
rows = _this$props3.rows,
filterDelay = _this$props3.filterDelay,
locale = _this$props3.locale;
switch (type) {
//文本输入
case "text":
return _react2["default"].createElement(_FilterType2["default"], {
locale: locale //多语
, rendertype: type //渲染类型
, clsPrefix: clsPrefix //css前缀
, className: clsPrefix + " filter-text",
dataIndex: dataIndex //字段
, onFilterChange: _this.handlerFilterChange //输入框回调
, onFilterClear: _this.handlerFilterClear //清除回调
, filterDropdown: rows[1][index]["filterdropdown"] //是否显示下拉条件
, filterDropdownType: rows[1][index]["filterdropdowntype"] //下拉的条件类型为string,number
, filterDropdownIncludeKeys: rows[1][index]["filterdropdownincludekeys"] //下拉条件按照指定的keys去显示
});
//数值输入
case "number":
return _react2["default"].createElement(_FilterType2["default"], {
locale: locale,
rendertype: type,
clsPrefix: clsPrefix,
className: clsPrefix + " filter-text",
dataIndex: dataIndex //字段
, onFilterChange: (0, _throttleDebounce.debounce)(filterDelay || 300, _this.handlerFilterChange) //输入框回调并且函数防抖动
, onFilterClear: _this.handlerFilterClear //清除回调
, filterDropdown: rows[1][index]["filterdropdown"],
filterDropdownType: rows[1][index]["filterdropdowntype"] //下拉的条件类型为string,number
, filterDropdownIncludeKeys: rows[1][index]["filterdropdownincludekeys"] //下拉条件按照指定的keys去显示
, filterInputNumberOptions: rows[1][index]["filterinputnumberoptions"] //设置数值框内的详细属性
});
//下拉框选择
case "dropdown":
var selectDataSource = [];
//处理没有输入数据源的时候，系统自动查找自带的数据筛选后注入
if (rows.length > 0 && (rows[1][index]["filterdropdownauto"] || "auto") == "auto") {
var hash = {};
//处理下拉重复对象组装dropdown
selectDataSource = Array.from(rows[1][0].datasource, function (x) {
return {
key: x[dataIndex],
value: x[dataIndex]
};
});
selectDataSource = selectDataSource.reduceRight(function (item, next) {
hash[next.key] ? "" : hash[next.key] = true && item.push(next);
return item;
}, []);
} else {
//从外部数据源加载系统数据
selectDataSource = rows[1][index]["filterdropdowndata"];
}
return _react2["default"].createElement(_FilterType2["default"], {
locale: locale,
rendertype: type,
className: clsPrefix + " filter-dropdown",
data: selectDataSource,
notFoundContent: "Loading" //没有数据显示的默认字
, dataIndex: dataIndex //字段
, onFilterChange: _this.handlerFilterChange //输入框回调
, onFilterClear: _this.handlerFilterClear //清除回调
, filterDropdown: rows[1][index]["filterdropdown"],
onFocus: rows[1][index]["filterdropdownfocus"],
filterDropdownType: rows[1][index]["filterdropdowntype"] //下拉的条件类型为string,number
, filterDropdownIncludeKeys: rows[1][index]["filterdropdownincludekeys"] //下拉条件按照指定的keys去显示
});
//日期
case "date":
return _react2["default"].createElement(_FilterType2["default"], {
locale: locale,
rendertype: type,
className: "filter-date",
onClick: function onClick() {},
format: rows[1][index]["format"] || "YYYY-MM-DD",
dataIndex: dataIndex //字段
, onFilterChange: _this.handlerFilterChange //输入框回调
, onFilterClear: _this.handlerFilterClear //清除回调
, filterDropdown: rows[1][index]["filterdropdown"],
filterDropdownType: rows[1][index]["filterdropdowntype"] //下拉的条件类型为string,number
, filterDropdownIncludeKeys: rows[1][index]["filterdropdownincludekeys"] //下拉条件按照指定的keys去显示
});
//日期范围
case "daterange":
return _react2["default"].createElement(_FilterType2["default"], {
locale: locale,
rendertype: type,
className: "filter-date",
onClick: function onClick() {},
format: rows[1][index]["format"] || "YYYY-MM-DD",
dataIndex: dataIndex //字段
, onFilterChange: _this.handlerFilterChange //输入框回调
, onFilterClear: _this.handlerFilterClear //清除回调
, filterDropdown: rows[1][index]["filterdropdown"],
filterDropdownType: rows[1][index]["filterdropdowntype"] //下拉的条件类型为string,number
, filterDropdownIncludeKeys: rows[1][index]["filterdropdownincludekeys"] //下拉条件按照指定的keys去显示
});
default:
//不匹配类型默认文本输入
return _react2["default"].createElement("div", null);
}
};
_this.currentObj = null;
_this.theadKey = new Date().getTime();
_this.drag = {
option: ''
};
_this.minWidth = 80; //确定最小宽度就是80
_this.table = null;
_this._thead = null; //当前对象
return _this;
}
/**
*
* 动态绑定th line 事件方法
* @param {*} events
* @param {*} type type 为false 为增加事件
* @param {*} eventSource 为false 给 th 内部的div增加事件
* @memberof TableHeader
*/
TableHeader.prototype.thEventListen = function thEventListen(events, type, eventSource) {
var _table = this.table,
ths = _table.ths,
cols = _table.cols;
for (var index = 0; index < ths.length; index++) {
var element = ths[index]; //.getAttribute('data-type');
if (!element.getAttribute('data-th-fixed')) {
var colLine = null;
if (element.children.length === 0) {
colLine = element;
} else if (element.children.length > 0) {
colLine = element.lastElementChild;
} else if (element.children.length === 1) {
colLine = element.children[0];
}
// const colLine = element.children.length > 1?element.lastElementChild:element.children[0];
for (var i = 0; i < events.length; i++) {
var _event = events[i];
var _dataSource = eventSource ? element : colLine;
if (type === "remove") {
_utils.EventUtil.removeHandler(_dataSource, _event.key, _event.fun);
} else {
_utils.EventUtil.addHandler(_dataSource, _event.key, _event.fun);
}
}
}
}
};
/**
* 当前对象上绑定全局事件，用于拖拽区域以外时的事件处理
* @param {*} events
* @param {*} type
* @memberof TableHeader
*/
TableHeader.prototype.bodyEventListen = function bodyEventListen(events, type) {
for (var i = 0; i < events.length; i++) {
var _event = events[i];
if (type == "remove") {
_utils.EventUtil.removeHandler(document.body, _event.key, _event.fun);
} else {
_utils.EventUtil.addHandler(document.body, _event.key, _event.fun);
}
}
};
TableHeader.prototype.componentDidUpdate = function componentDidUpdate() {
this.initTable();
this.initEvent();
};
// componentDidMount(){
// this.initTable();
// this.initEvent();
// }
/**
* 初始化拖拽列宽的事件处理
* @returns
* @memberof TableHeader
*/
TableHeader.prototype.initEvent = function initEvent() {
var events = [{ key: 'mouseup', fun: this.onLineMouseUp }, { key: 'mousemove', fun: this.onLineMouseMove }];
if (this.props.dragborder) {
this.thEventListen(events, '', true); //表示把事件添加到th元素上
this.thEventListen([{ key: 'mousedown', fun: this.onLineMouseDown }]); //表示把事件添加到竖线
this.bodyEventListen([{ key: 'mouseup', fun: this.bodyonLineMouseMove }]);
}
if (!this.props.draggable) return;
//拖拽交换列事件
this.thEventListen([{ key: 'mousedown', fun: this.dragAbleMouseDown }], '', true); //表示把事件添加到th元素上
};
/**
* 移除当前全局事件对象
* @memberof TableHeader
*/
TableHeader.prototype.removeDragBorderEvent = function removeDragBorderEvent() {
var events = [{ key: 'mouseup', fun: this.onLineMouseUp }, { key: 'mousemove', fun: this.onLineMouseMove }];
this.thEventListen(events, 'remove', true); //表示把事件添加到th元素上
this.thEventListen([{ key: 'mousedown', fun: this.onLineMouseDown }], 'remove'); //表示把事件添加到竖线
this.bodyEventListen([{ key: 'mouseup', fun: this.bodyonLineMouseMove }], 'remove');
};
/**
* 获取table的属性存放在this.table 中。(公用方法)
* @returns
* @memberof TableHeader
*/
TableHeader.prototype.initTable = function initTable() {
if (!this.props.dragborder && !this.props.draggable) return;
// let el = ReactDOM.findDOMNode(this);
var tableDome = this._thead.parentNode;
var table = {};
if (tableDome && tableDome.nodeName && tableDome.nodeName.toUpperCase() == "TABLE") {
table.table = tableDome;
table.cols = tableDome.getElementsByTagName("col");
table.ths = tableDome.getElementsByTagName("th");
}
this.table = table;
if (!this.props.dragborder) return;
if (document.getElementById("u-table-drag-thead-" + this.theadKey)) {
//hao 固定列table
this.fixedTable = {};
var _fixedParentContext = document.getElementById("u-table-drag-thead-" + this.theadKey).parentNode;
var siblingDom = _fixedParentContext.parentNode.nextElementSibling;
if (siblingDom) {
var fixedTable = siblingDom.querySelector("table");
this.fixedTable.table = fixedTable;
this.fixedTable.cols = fixedTable.getElementsByTagName("col");
// this.fixedTable.ths = fixedTable.tableDome.getElementsByTagName("th");
}
}
};
/**
*相关滚动条联动操作
*
* @memberof TableHeader
*/
/**
* 调整列宽的move事件
* @memberof TableHeader
*/
/**
* 调整列宽的down事件
* @memberof TableHeader
*/
/**
* 调整列宽的up事件
* @memberof TableHeader
*/
/**
* 调整列宽到区域以外的up事件
*/
TableHeader.prototype.clearDragBorder = function clearDragBorder() {
if (!this.drag || !this.drag.option) return;
var rows = this.props.rows;
var data = { rows: rows[0], cols: this.table.cols, currIndex: this.drag.currIndex };
this.props.afterDragColWidth && this.props.afterDragColWidth(data);
this.drag = {
option: ""
};
if (this.props.draggable) {
this.removeDragAbleEvent();
}
};
//---拖拽列宽代码逻辑----start-----
/**
* 调整交换列down事件
* @memberof TableHeader
*/
/**
* 调整交换列up事件
* @memberof TableHeader
*/
/**
* 添加换列的事件监听
*/
TableHeader.prototype.addDragAbleEvent = function addDragAbleEvent() {
var events = [{ key: 'dragstart', fun: this.onDragStart }, //用户开始拖动元素时触发
{ key: 'dragover', fun: this.onDragOver }, //当某被拖动的对象在另一对象容器范围内拖动时触发此事件
{ key: 'drop', fun: this.onDrop }];
this.thEventListen(events, '', true);
};
/**
* 删除换列的事件监听
*/
TableHeader.prototype.removeDragAbleEvent = function removeDragAbleEvent() {
var events = [{ key: 'dragstart', fun: this.onDragStart }, { key: 'dragover', fun: this.onDragOver }, { key: 'drop', fun: this.onDrop }, { key: 'dragenter', fun: this.onDragEnter }];
this.thEventListen(events, 'remove', true);
};
/**
* 开始调整交换列的事件
*/
/**
* 在一个拖动过程中，释放鼠标键时触发此事件。【目标事件】
* @memberof TableHeader
*/
/**
* 获取当前th上的对象数据
* @param {*} e
* @returns
* @memberof TableHeader
*/
TableHeader.prototype.getCurrentEventData = function getCurrentEventData(e) {
var event = _utils.Event.getEvent(e);
var th = this.getThDome(event.target);
if (!th) {
console.log(" event target is not th ! ");
return null;
}
var key = th.getAttribute('data-line-key');
var data = this.props.rows[0].find(function (da) {
return da.key == key;
});
if (data) {
return data;
} else {
console.log(" getCurrentEventData data is null ");
return null;
}
};
/**
* 根据当前鼠标点击的节点，进行递归遍历，最终找到th
* @param {*} element
* @returns <th />对象
* @memberof TableHeader
*/
TableHeader.prototype.getThDome = function getThDome(element) {
var _tagName = element.tagName.toLowerCase();
if (element.getAttribute('data-filter-type') === 'filterContext') return null;
if (_tagName === 'i') return null;
if (_tagName != 'th') {
return this.getThDome(element.parentElement);
} else {
return element;
}
};
//---拖拽列交换----end-----
/**
* 过滤输入后或下拉条件的回调函数
*/
/**
* 过滤行清除回调
*/
/**
* 过滤渲染的组件类型
*/
TableHeader.prototype.render = function render() {
var _this2 = this;
var _props = this.props,
clsPrefix = _props.clsPrefix,
rowStyle = _props.rowStyle,
draggable = _props.draggable,
dragborder = _props.dragborder,
rows = _props.rows,
filterable = _props.filterable,
fixed = _props.fixed,
lastShowIndex = _props.lastShowIndex;
var attr = dragborder ? { id: "u-table-drag-thead-" + this.theadKey } : {};
return _react2["default"].createElement(
"thead",
_extends({ className: clsPrefix + "-thead" }, attr, { "data-theader-fixed": "scroll", ref: function ref(_thead) {
return _this2._thead = _thead;
} }),
rows.map(function (row, index) {
return _react2["default"].createElement(
"tr",
{ key: index, style: rowStyle, className: filterable && index == rows.length - 1 ? 'filterable' : '' },
row.map(function (da, columIndex, arr) {
var thHover = da.drgHover ? " " + clsPrefix + "-thead th-drag-hover" : "";
delete da.drgHover;
var fixedStyle = "";
var canDotDrag = "";
//主表格下、固定列或者是过滤行中含有固定列时添加该属性
if (!fixed && (da.fixed || filterable && index == rows.length - 1 && rows[0][columIndex].fixed)) {
fixedStyle = " " + clsPrefix + "-row-fixed-columns-in-body";
}
if (lastShowIndex == columIndex) {
canDotDrag = "th-can-not-drag";
}
var thClassName = "" + da.className ? "" + da.className : '';
if (da.textAlign) {
thClassName += " text-" + da.textAlign + " ";
}
delete da.textAlign;
var keyTemp = {};
//避免key为undefined
// if(da.dataindex && da.key ===undefined ){
keyTemp.key = da.key || da.dataindex || index + '-' + columIndex;
// }
if (filterable && index == rows.length - 1) {
da.children = _this2.filterRenderType(da["filtertype"], da.dataindex, columIndex);
if (da.key === undefined) {
keyTemp.key = keyTemp.key + '-filterable';
}
delete da.filterdropdownfocus;
}
var thDefaultObj = {};
if (draggable) {
thClassName += " " + clsPrefix + "-thead th-drag " + thHover + " ";
}
if (dragborder) {
thClassName += " " + clsPrefix + "-thead-th " + canDotDrag;
}
thClassName += " " + fixedStyle;
if (!da.fixed) {
return _react2["default"].createElement(
"th",
_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(
"div",
{ ref: function ref(el) {
return _this2.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" },
_react2["default"].createElement("div", { id: "th-online", className: "online", "data-line-key": da.key, "data-line-index": columIndex, "data-th-width": da.width })
) : ""
);
} else {
thDefaultObj = _extends({}, da, {
className: thClassName + " " + fixedStyle
});
da.onClick ? thDefaultObj.onClick = function (e) {
da.onClick(da, e);
} : "";
return _react2["default"].createElement("th", _extends({}, thDefaultObj, keyTemp, { "data-th-fixed": da.fixed }));
}
})
);
})
);
};
return TableHeader;
}(_react.Component);
TableHeader.defaultProps = {
contentWidthDiff: 0
};
TableHeader.propTypes = propTypes;
exports["default"] = TableHeader;
module.exports = exports["default"];

324
build/TableRow.js Normal file
View File

@ -0,0 +1,324 @@
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _react = require('react');
var _react2 = _interopRequireDefault(_react);
var _propTypes = require('prop-types');
var _propTypes2 = _interopRequireDefault(_propTypes);
var _TableCell = require('./TableCell');
var _TableCell2 = _interopRequireDefault(_TableCell);
var _ExpandIcon = require('./ExpandIcon');
var _ExpandIcon2 = _interopRequireDefault(_ExpandIcon);
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; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : _defaults(subClass, superClass); }
var propTypes = {
onDestroy: _propTypes2["default"].func,
onRowClick: _propTypes2["default"].func,
onRowDoubleClick: _propTypes2["default"].func,
record: _propTypes2["default"].object,
clsPrefix: _propTypes2["default"].string,
expandIconColumnIndex: _propTypes2["default"].number,
onHover: _propTypes2["default"].func,
columns: _propTypes2["default"].array,
height: _propTypes2["default"].oneOfType([_propTypes2["default"].string, _propTypes2["default"].number]),
visible: _propTypes2["default"].bool,
index: _propTypes2["default"].number,
hoverKey: _propTypes2["default"].any,
expanded: _propTypes2["default"].bool,
expandable: _propTypes2["default"].any,
onExpand: _propTypes2["default"].func,
needIndentSpaced: _propTypes2["default"].bool,
className: _propTypes2["default"].string,
indent: _propTypes2["default"].number,
indentSize: _propTypes2["default"].number,
expandIconAsCell: _propTypes2["default"].bool,
expandRowByClick: _propTypes2["default"].bool,
store: _propTypes2["default"].object.isRequired
};
var defaultProps = {
onRowClick: function onRowClick() {},
onRowDoubleClick: function onRowDoubleClick() {},
onDestroy: function onDestroy() {},
expandIconColumnIndex: 0,
expandRowByClick: false,
onHover: function onHover() {},
className: '',
setRowParentIndex: function setRowParentIndex() {}
};
var TableRow = function (_Component) {
_inherits(TableRow, _Component);
function TableRow(props) {
_classCallCheck(this, TableRow);
var _this = _possibleConstructorReturn(this, _Component.call(this, props));
_this.set = function (fn) {
_this.clear();
_this._timeout = window.setTimeout(fn, 300);
};
_this.clear = function (event) {
if (_this._timeout) {
window.clearTimeout(_this._timeout);
}
};
_this.bindElement = function (el) {
_this.element = el;
};
_this._timeout = null;
_this.state = {
hovered: false
};
_this.onRowClick = _this.onRowClick.bind(_this);
_this.onRowDoubleClick = _this.onRowDoubleClick.bind(_this);
_this.onMouseEnter = _this.onMouseEnter.bind(_this);
_this.onMouseLeave = _this.onMouseLeave.bind(_this);
_this.expandHeight = 0;
return _this;
}
TableRow.prototype.componentDidMount = function componentDidMount() {
var _this2 = this;
var _props = this.props,
store = _props.store,
hoverKey = _props.hoverKey,
treeType = _props.treeType;
this.unsubscribe = store.subscribe(function () {
if (store.getState().currentHoverKey === hoverKey) {
_this2.setState({ hovered: true });
} else if (_this2.state.hovered === true) {
_this2.setState({ hovered: false });
}
});
this.setRowHeight();
if (treeType) {
this.setRowParentIndex();
}
};
TableRow.prototype.componentDidUpdate = function componentDidUpdate(prevProps) {
if (this.props.treeType) {
this.setRowParentIndex();
}
this.setRowHeight();
};
TableRow.prototype.componentWillUnmount = function componentWillUnmount() {
var _props2 = this.props,
record = _props2.record,
onDestroy = _props2.onDestroy,
index = _props2.index;
onDestroy(record, index);
if (this.unsubscribe) {
this.unsubscribe();
}
};
TableRow.prototype.setRowHeight = function setRowHeight() {
var _props3 = this.props,
setRowHeight = _props3.setRowHeight,
_props3$expandedConte = _props3.expandedContentHeight,
expandedContentHeight = _props3$expandedConte === undefined ? 0 : _props3$expandedConte,
fixed = _props3.fixed,
fixedIndex = _props3.fixedIndex;
if (!setRowHeight || !this.element || fixed) return;
setRowHeight(this.element.clientHeight + expandedContentHeight, fixedIndex);
};
TableRow.prototype.setRowParentIndex = function setRowParentIndex() {
var _props4 = this.props,
index = _props4.index,
setRowParentIndex = _props4.setRowParentIndex,
fixedIndex = _props4.fixedIndex,
rootIndex = _props4.rootIndex;
// console.log('rootIndex',rootIndex<0?index:rootIndex,'index',fixedIndex);
setRowParentIndex(rootIndex < 0 ? index : rootIndex, fixedIndex);
};
TableRow.prototype.onRowClick = function onRowClick(event) {
var _props5 = this.props,
record = _props5.record,
index = _props5.index,
onRowClick = _props5.onRowClick,
expandable = _props5.expandable,
expandRowByClick = _props5.expandRowByClick,
expanded = _props5.expanded,
onExpand = _props5.onExpand,
fixedIndex = _props5.fixedIndex;
if (expandable && expandRowByClick) {
onExpand(!expanded, record, fixedIndex, event);
}
this.set(function (e) {
onRowClick(record, fixedIndex, event);
});
};
TableRow.prototype.onRowDoubleClick = function onRowDoubleClick(event) {
var _props6 = this.props,
record = _props6.record,
index = _props6.index,
onRowDoubleClick = _props6.onRowDoubleClick,
fixedIndex = _props6.fixedIndex;
this.clear();
onRowDoubleClick(record, fixedIndex, event);
};
TableRow.prototype.onMouseEnter = function onMouseEnter(e) {
var _props7 = this.props,
onHover = _props7.onHover,
hoverKey = _props7.hoverKey,
fixedIndex = _props7.fixedIndex,
syncHover = _props7.syncHover;
if (syncHover) {
this.setState({ hovered: true });
}
onHover(true, hoverKey, e, fixedIndex);
};
TableRow.prototype.onMouseLeave = function onMouseLeave(e) {
var _props8 = this.props,
onHover = _props8.onHover,
hoverKey = _props8.hoverKey,
fixedIndex = _props8.fixedIndex,
syncHover = _props8.syncHover;
if (syncHover) {
this.setState({ hovered: false });
}
onHover(false, hoverKey, e, fixedIndex);
};
TableRow.prototype.render = function render() {
var _props9 = this.props,
clsPrefix = _props9.clsPrefix,
columns = _props9.columns,
record = _props9.record,
height = _props9.height,
visible = _props9.visible,
index = _props9.index,
expandIconColumnIndex = _props9.expandIconColumnIndex,
expandIconAsCell = _props9.expandIconAsCell,
expanded = _props9.expanded,
expandRowByClick = _props9.expandRowByClick,
expandable = _props9.expandable,
onExpand = _props9.onExpand,
needIndentSpaced = _props9.needIndentSpaced,
indent = _props9.indent,
indentSize = _props9.indentSize,
isHiddenExpandIcon = _props9.isHiddenExpandIcon,
fixed = _props9.fixed;
var showSum = false;
var className = this.props.className;
if (this.state.hovered) {
className += ' ' + clsPrefix + '-hover';
}
// console.log('className--'+className,index);
//判断是否为合计行
if (className.indexOf('sumrow') > -1) {
showSum = true;
}
var cells = [];
var expandIcon = _react2["default"].createElement(_ExpandIcon2["default"], {
expandable: expandable,
clsPrefix: clsPrefix,
onExpand: onExpand,
needIndentSpaced: needIndentSpaced,
expanded: expanded,
record: record,
isHiddenExpandIcon: isHiddenExpandIcon
});
for (var i = 0; i < columns.length; i++) {
if (expandIconAsCell && i === 0 && !showSum) {
cells.push(_react2["default"].createElement(
'td',
{
className: clsPrefix + '-expand-icon-cell',
key: 'rc-table-expand-icon-cell'
},
expandIcon
));
}
var isColumnHaveExpandIcon = expandIconAsCell || expandRowByClick || showSum ? false : i === expandIconColumnIndex;
cells.push(_react2["default"].createElement(_TableCell2["default"], {
clsPrefix: clsPrefix,
record: record,
indentSize: indentSize,
indent: indent,
index: index,
column: columns[i],
key: columns[i].key || columns[i].dataIndex || i,
fixed: fixed,
showSum: showSum,
expandIcon: isColumnHaveExpandIcon ? expandIcon : null
}));
}
var style = { height: height };
if (!visible) {
style.display = 'none';
}
return _react2["default"].createElement(
'tr',
{
onClick: this.onRowClick,
onDoubleClick: this.onRowDoubleClick,
onMouseEnter: this.onMouseEnter,
onMouseLeave: this.onMouseLeave,
className: clsPrefix + ' ' + className + ' ' + clsPrefix + '-level-' + indent,
style: style
// key={hoverKey}
, ref: this.bindElement
},
cells.length > 0 ? cells : _react2["default"].createElement('td', null)
);
};
return TableRow;
}(_react.Component);
;
TableRow.propTypes = propTypes;
TableRow.defaultProps = defaultProps;
exports["default"] = TableRow;
module.exports = exports['default'];

40
build/createStore.js Normal file
View File

@ -0,0 +1,40 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
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; };
exports["default"] = createStore;
function createStore(initialState) {
var state = initialState;
var listeners = [];
function setState(partial) {
state = _extends({}, state, partial);
for (var i = 0; i < listeners.length; i++) {
listeners[i]();
}
}
function getState() {
return state;
}
function subscribe(listener) {
listeners.push(listener);
return function unsubscribe() {
var index = listeners.indexOf(listener);
listeners.splice(index, 1);
};
}
return {
setState: setState,
getState: getState,
subscribe: subscribe
};
}
module.exports = exports["default"];

10
build/index.js Normal file
View File

@ -0,0 +1,10 @@
'use strict';
var Table = require('./Table');
var Column = require('./Column');
var ColumnGroup = require('./ColumnGroup');
Table.Column = Column;
Table.ColumnGroup = ColumnGroup;
module.exports = Table;

512
build/lib/bigData.js Normal file
View File

@ -0,0 +1,512 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
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; };
exports["default"] = bigData;
var _react = require("react");
var _react2 = _interopRequireDefault(_react);
var _propTypes = require("prop-types");
var _propTypes2 = _interopRequireDefault(_propTypes);
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; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : _defaults(subClass, superClass); }
var defaultHeight = 30;
var rowDiff = 3; //行差值
var treeTypeIndex = 0;
function bigData(Table) {
var _class, _temp, _initialiseProps;
return _temp = _class = function (_Component) {
_inherits(BigData, _Component);
function BigData(props) {
_classCallCheck(this, BigData);
var _this2 = _possibleConstructorReturn(this, _Component.call(this, props));
_initialiseProps.call(_this2);
_this2.state = {
scrollLeft: 0,
scrollTop: 0
};
var rowHeight = _this2.props.height ? _this2.props.height : defaultHeight;
//默认显示25条，rowsInView根据定高算的。在非固定高下，这个只是一个大概的值。
var scrollY = _this2.props.scroll.y ? parseInt(_this2.props.scroll.y) : 0;
_this2.rowsInView = scrollY ? Math.floor(scrollY / rowHeight) : 20;
_this2.currentIndex = 0;
_this2.loadCount = props.loadBuffer ? _this2.rowsInView + props.loadBuffer * 2 : 26; //一次加载多少数据
_this2.cachedRowHeight = []; //缓存每行的高度
_this2.cachedRowParentIndex = [];
_this2.expandChildRowKeys = [];
_this2.firstLevelKey = [];
_this2.keys = [];
_this2.lastScrollTop = 0;
_this2.currentScrollTop = 0;
_this2.startIndex = _this2.currentIndex; //数据开始位置
_this2.endIndex = _this2.currentIndex + _this2.loadCount; //数据结束位置
_this2.setRowHeight = _this2.setRowHeight.bind(_this2);
_this2.setRowParentIndex = _this2.setRowParentIndex.bind(_this2);
_this2.expandedRowKeys = [];
return _this2;
}
BigData.prototype.componentWillReceiveProps = function componentWillReceiveProps(nextProps) {
var props = this.props;
var currentIndex = nextProps.currentIndex,
data = nextProps.data;
var _this = this,
dataLen = data.length;
if (nextProps.scroll.y !== props.scroll.y) {
var rowHeight = nextProps.height ? nextProps.height : defaultHeight;
var scrollY = nextProps.scroll.y ? parseInt(nextProps.scroll.y) : 0;
_this.rowsInView = scrollY ? Math.floor(scrollY / rowHeight) : 20;
_this.loadCount = props.loadBuffer ? _this.rowsInView + props.loadBuffer * 2 : 26; //一次加载多少数据
_this.currentIndex = 0;
_this.startIndex = _this.currentIndex; //数据开始位置
_this.endIndex = _this.currentIndex + _this.loadCount; //数据结束位置
}
if (nextProps.data !== props.data) {
_this.computeCachedRowParentIndex(nextProps.data);
if (nextProps.data.length > 0) {
_this.endIndex = _this.currentIndex - nextProps.loadBuffer + _this.loadCount; //数据结束位置
}
}
//如果传currentIndex，会判断该条数据是否在可视区域，如果没有的话，则重新计算startIndex和endIndex
if (currentIndex !== -1 && currentIndex !== this.currentIndex) {
_this.setStartAndEndIndex(currentIndex, dataLen);
}
};
BigData.prototype.componentDidMount = function componentDidMount() {
var data = this.props.data;
this.computeCachedRowParentIndex(data);
};
/**
*设置data中每个元素的parentIndex
*
*/
BigData.prototype.setStartAndEndIndex = function setStartAndEndIndex(currentIndex, dataLen) {
var _this = this;
if (currentIndex > _this.currentIndex + _this.rowsInView) {
_this.currentIndex = currentIndex;
_this.endIndex = _this.currentIndex; //数据开始位置
_this.startIndex = _this.currentIndex - _this.loadCount; //数据结束位置
if (_this.endIndex > dataLen) {
_this.endIndex = dataLen;
}
if (_this.startIndex < 0) {
_this.startIndex = 0;
}
//重新设定scrollTop值
_this.scrollTop = _this.getSumHeight(0, _this.endIndex - _this.rowsInView + 2);
} else if (currentIndex < _this.currentIndex) {
_this.currentIndex = currentIndex;
_this.startIndex = currentIndex;
_this.endIndex = currentIndex + _this.loadCount;
if (_this.endIndex > dataLen) {
_this.endIndex = dataLen;
}
if (_this.startIndex < 0) {
_this.startIndex = 0;
}
//重新设定scrollTop值
_this.scrollTop = _this.getSumHeight(0, _this.startIndex);
}
};
BigData.prototype.getRowKey = function getRowKey(record, index) {
var rowKey = this.props.rowKey;
var key = typeof rowKey === "function" ? rowKey(record, index) : record[rowKey];
return key;
};
/**
*判断是否是树形结构
*
*/
BigData.prototype.checkIsTreeType = function checkIsTreeType() {
var data = this.props.data;
var rs = false;
var len = data.length > 30 ? 30 : data.length;
//取前三十个看看是否有children属性，有则为树形结构
for (var i = 0; i < len; i++) {
if (data[i].children) {
rs = true;
break;
}
}
return rs;
};
BigData.prototype.getData = function getData(data, parentIndex) {
var _this3 = this;
data.forEach(function (subItem, subIndex) {
_this3.cachedRowParentIndex[treeTypeIndex] = parentIndex;
_this3.keys[treeTypeIndex] = _this3.getRowKey(subItem, subIndex);
treeTypeIndex++;
if (subItem.children) {
_this3.getData(subItem.children, parentIndex);
}
});
};
BigData.prototype.componentWillUnmount = function componentWillUnmount() {
this.cachedRowHeight = [];
this.cachedRowParentIndex = [];
};
/**
*获取数据区高度
*
*
**/
BigData.prototype.getContentHeight = function getContentHeight() {
if (!this.props.data) return 0;
return this.getSumHeight(0, this.props.data.length);
};
BigData.prototype.getSumHeight = function getSumHeight(start, end) {
var height = this.props.height;
var rowHeight = height ? height : defaultHeight;
var sumHeight = 0,
currentKey = void 0,
currentRowHeight = rowHeight;
for (var i = start; i < end; i++) {
if (this.cachedRowHeight[i] == undefined) {
if (this.treeType) {
currentKey = this.keys[i];
currentRowHeight = 0;
if (this.firstLevelKey.indexOf(currentKey) >= 0 || this.expandChildRowKeys.indexOf(currentKey) >= 0) {
currentRowHeight = rowHeight;
}
}
sumHeight += currentRowHeight;
} else {
sumHeight += this.cachedRowHeight[i];
}
}
return sumHeight;
};
/**
*@description 根据返回的scrollTop计算当前的索引。此处做了两次缓存一个是根据上一次的currentIndex计算当前currentIndex。另一个是根据当前内容区的数据是否在缓存中如果在则不重新render页面
*@param 最新一次滚动的scrollTop
*@param treeType是否是树状表
*/
BigData.prototype.setRowHeight = function setRowHeight(height, index) {
this.cachedRowHeight[index] = height;
};
BigData.prototype.setRowParentIndex = function setRowParentIndex(parentIndex, index) {}
// this.cachedRowParentIndex[index] = parentIndex;
/**
*
*根据当前行号获取该行的父节点行号
* @param {*} currentIndex 当前行号
*/
;
BigData.prototype.getParentIndex = function getParentIndex(targetIndex) {
var data = this.props.data;
var parentIndex = -1;
parentIndex = this.getIndex(data, -1, targetIndex);
if (parentIndex < 0) {
//小于0说明没有展开的子节点
parentIndex = targetIndex;
}
return parentIndex;
};
BigData.prototype.getIndex = function getIndex(data, index, targetIndex) {
var parentIndex = index;
for (var i = 0; i < data.length; i++) {
index++;
if (targetIndex <= index) {
break;
}
if (data[i].children) {
this.getIndex(data[i].children, index, targetIndex);
}
}
return parentIndex;
};
BigData.prototype.render = function render() {
var data = this.props.data;
var scrollTop = this.scrollTop;
var endIndex = this.endIndex,
startIndex = this.startIndex;
var expandedRowKeys = this.props.expandedRowKeys ? this.props.expandedRowKeys : this.expandedRowKeys;
if (startIndex < 0) {
startIndex = 0;
}
if (endIndex < 0) {
endIndex = 0;
}
if (endIndex > data.length) {
endIndex = data.length;
}
var lazyLoad = {
startIndex: startIndex,
startParentIndex: startIndex //为树状节点做准备
};
if (this.treeType) {
var preSubCounts = this.cachedRowParentIndex.findIndex(function (item) {
return item == startIndex;
});
var sufSubCounts = this.cachedRowParentIndex.findIndex(function (item) {
return item == endIndex;
});
lazyLoad.preHeight = this.getSumHeight(0, preSubCounts > -1 ? preSubCounts : 0);
lazyLoad.sufHeight = this.getSumHeight(sufSubCounts + 1 > 0 ? sufSubCounts + 1 : this.cachedRowParentIndex.length, this.cachedRowParentIndex.length);
if (preSubCounts > 0) {
lazyLoad.startIndex = preSubCounts;
}
} else {
lazyLoad.preHeight = this.getSumHeight(0, startIndex);
lazyLoad.sufHeight = this.getSumHeight(endIndex, data.length);
}
// console.log('*******expandedRowKeys*****'+expandedRowKeys);
return _react2["default"].createElement(Table, _extends({}, this.props, {
data: data.slice(startIndex, endIndex),
lazyLoad: lazyLoad,
handleScrollY: this.handleScrollY,
scrollTop: scrollTop,
setRowHeight: this.setRowHeight,
setRowParentIndex: this.setRowParentIndex,
onExpand: this.onExpand,
onExpandedRowsChange: this.onExpandedRowsChange,
expandedRowKeys: expandedRowKeys
// className={'lazy-table'}
}));
};
return BigData;
}(_react.Component), _class.defaultProps = {
data: [],
loadBuffer: 5,
rowKey: "key",
onExpand: function onExpand() {},
scroll: {},
currentIndex: -1,
isTree: false
}, _class.propTypes = {
loadBuffer: _propTypes2["default"].number
}, _initialiseProps = function _initialiseProps() {
var _this4 = this;
this.computeCachedRowParentIndex = function (data) {
var isTree = _this4.props.isTree;
var isTreeType = isTree ? true : _this4.checkIsTreeType();
if (isTreeType) {
data.forEach(function (item, index) {
_this4.firstLevelKey[index] = _this4.getRowKey(item, index);
_this4.cachedRowParentIndex[treeTypeIndex] = index;
//保存所有的keys跟小标对应起来
_this4.keys[treeTypeIndex] = _this4.getRowKey(item, index);
treeTypeIndex++;
if (item.children) {
_this4.getData(item.children, index);
}
});
}
};
this.handleScrollY = function (nextScrollTop, treeType) {
//树表逻辑
// 关键点是动态的获取startIndex和endIndex
// 法子一：子节点也看成普通tr，最开始需要设置一共有多少行，哪行显示哪行不显示如何确定
// 动态取start = current+buffer对应的父节点、end = start+loadCount+row的height为0的行数 展开节点的下一个节点作为end值，
var _this = _this4;
var _this$props = _this.props,
data = _this$props.data,
height = _this$props.height,
_this$props$scroll = _this$props.scroll,
scroll = _this$props$scroll === undefined ? {} : _this$props$scroll,
loadBuffer = _this$props.loadBuffer;
var rowHeight = height ? height : defaultHeight;
var _this$currentIndex = _this.currentIndex,
currentIndex = _this$currentIndex === undefined ? 0 : _this$currentIndex,
loadCount = _this.loadCount,
scrollTop = _this.scrollTop,
currentScrollTop = _this.currentScrollTop;
var endIndex = _this.endIndex,
startIndex = _this.startIndex;
var needRender = _this.state.needRender;
_this.scrollTop = nextScrollTop;
var viewHeight = parseInt(scroll.y);
_this.treeType = treeType;
var index = 0;
var temp = nextScrollTop;
var currentKey = void 0;
while (temp > 0) {
var currentRowHeight = _this4.cachedRowHeight[index];
if (currentRowHeight === undefined) {
if (_this4.treeType) {
currentKey = _this4.keys[index];
currentRowHeight = 0;
if (_this4.firstLevelKey.indexOf(currentKey) >= 0 || _this4.expandChildRowKeys.indexOf(currentKey) >= 0) {
currentRowHeight = rowHeight;
}
} else {
currentRowHeight = rowHeight;
}
}
temp -= currentRowHeight;
if (temp > 0) {
index += 1;
}
}
// console.log('currentIndex****',index);
var isOrder = index - currentIndex > 0 ? true : false;
if (index < 0) index = 0;
//如果之前的索引和下一次的不一样则重置索引和滚动的位置
if (currentIndex !== index) {
_this.currentIndex = index;
var rowsInView = 0; //可视区域显示多少行
var rowsHeight = 0; //可视区域内容高度
var tempIndex = index;
//如果可视区域中需要展示的数据已经在缓存中则不重现render。
if (viewHeight) {
//有时滚动过快时this.cachedRowHeight[rowsInView + index]为undifined
while (rowsHeight < viewHeight && tempIndex < _this4.cachedRowHeight.length) {
if (_this4.cachedRowHeight[tempIndex]) {
rowsHeight += _this4.cachedRowHeight[tempIndex];
if (treeType && _this.cachedRowParentIndex[tempIndex] !== tempIndex || !treeType) {
rowsInView++;
}
}
tempIndex++;
}
if (treeType) {
var treeIndex = index;
index = _this.cachedRowParentIndex[treeIndex];
if (index === undefined) {
// console.log('index is undefined********'+treeIndex);
index = _this4.getParentIndex(treeIndex);
// console.log("getParentIndex****"+index);
}
}
// console.log('parentIndex*********',index);
// 如果rowsInView 小于 缓存的数据则重新render
// 向下滚动 下临界值超出缓存的endIndex则重新渲染
if (rowsInView + index > endIndex - rowDiff && isOrder) {
startIndex = index - loadBuffer > 0 ? index - loadBuffer : 0;
endIndex = startIndex + loadCount;
if (endIndex > data.length) {
endIndex = data.length;
}
if (endIndex !== _this4.endIndex) {
_this4.startIndex = startIndex;
_this4.endIndex = endIndex;
_this4.setState({ needRender: !needRender });
}
}
// 向上滚动，当前的index是否已经加载（currentIndex），若干上临界值小于startIndex则重新渲染
if (!isOrder && index < startIndex + rowDiff) {
startIndex = index - loadBuffer;
if (startIndex < 0) {
startIndex = 0;
}
if (startIndex !== _this4.startIndex) {
_this4.startIndex = startIndex;
_this4.endIndex = _this4.startIndex + loadCount;
_this4.setState({ needRender: !needRender });
}
// console.log(
// "**index**" + index,
// "**startIndex**" + this.startIndex,
// "**endIndex**" + this.endIndex
// );
}
}
}
};
this.onExpand = function (expandState, record, index) {
var _this = _this4;
var _this$expandedRowKeys = _this.expandedRowKeys,
expandedRowKeys = _this$expandedRowKeys === undefined ? [] : _this$expandedRowKeys;
var needRender = _this.state.needRender;
var rowKey = _this.getRowKey(record, index);
// 记录展开子表行的key
// 展开
if (record.children) {
if (expandState) {
record.children.forEach(function (item, index) {
_this.expandChildRowKeys.push(rowKey);
});
} else {
// 收起
record.children.forEach(function (item, index) {
_this.expandChildRowKeys.splice(_this.expandChildRowKeys.findIndex(function (fitem) {
return fitem.key === item.key;
}), 1);
});
}
}
//滚动加载expandedRowKeys自己维护，否则有展开不全的问题
if (!_this.props.expandedRowKeys) {
if (expandState) {
expandedRowKeys.push(rowKey);
} else {
var _index = -1;
expandedRowKeys.forEach(function (r, i) {
if (r === rowKey) {
_index = i;
}
});
if (_index !== -1) {
expandedRowKeys.splice(_index, 1);
_this4.setState({ needRender: !needRender });
}
}
}
// expandState为true时，记录下
_this.props.onExpand(expandState, record);
};
}, _temp;
}
module.exports = exports["default"];

172
build/lib/dragColumn.js Normal file
View File

@ -0,0 +1,172 @@
'use strict';
Object.defineProperty(exports, "__esModule", {
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; };
var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) { return typeof obj; } : function (obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; };
exports["default"] = dragColumn;
var _react = require('react');
var _react2 = _interopRequireDefault(_react);
var _util = require('./util');
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; }
function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : _defaults(subClass, superClass); }
var cloneDeep = require('lodash.clonedeep');
/**
* 参数: 列拖拽
* @param {*} Table
*/
function dragColumn(Table) {
return function (_Component) {
_inherits(DragColumn, _Component);
function DragColumn(props) {
_classCallCheck(this, DragColumn);
var _this = _possibleConstructorReturn(this, _Component.call(this, props));
_this.setColumOrderByIndex = function (_column) {
_column.forEach(function (da, i) {
da.dragIndex = i;
da.drgHover = false;
});
return _column;
};
_this.onDrop = function (event, data) {
var dragSource = data.dragSource,
dragTarg = data.dragTarg;
var columns = _this.state.columns;
var sourceIndex = -1,
targetIndex = -1;
sourceIndex = columns.findIndex(function (da, i) {
return da.key == dragSource.key;
});
targetIndex = columns.findIndex(function (da, i) {
return da.key == dragTarg.key;
});
// for (let index = 0; index < columns.length; index++) {
// const da = columns[index];
// if(da.key === dragSource.key){
// columns[index] = dragTargColum;
// }
// if(da.key === dragTarg.key){
// columns[index] = dragSourceColum;
// }
// }
// 向前移动
if (targetIndex < sourceIndex) {
targetIndex = targetIndex + 1;
}
columns.splice(targetIndex, 0, columns.splice(sourceIndex, 1)[0]);
_this.setState({
columns: cloneDeep(columns)
});
if (_this.props.onDrop) {
_this.props.onDrop(event, data, columns);
}
};
_this.getTarget = function (evt) {
return evt.target || evt.srcElement;
};
_this.state = {
columns: _this.setColumOrderByIndex(props.columns)
};
return _this;
}
DragColumn.prototype.componentWillReceiveProps = function componentWillReceiveProps(nextProps) {
if (nextProps.columns != this.props.columns) {
this.setState({
columns: this.setColumOrderByIndex(nextProps.columns)
});
}
};
DragColumn.prototype.cloneDeep = function cloneDeep(obj) {
if ((typeof obj === 'undefined' ? 'undefined' : _typeof(obj)) !== 'object' || Object.keys(obj).length === 0) {
return obj;
}
var resultData = {};
return this.recursion(obj, resultData);
};
DragColumn.prototype.recursion = function (_recursion) {
function recursion(_x) {
return _recursion.apply(this, arguments);
}
recursion.toString = function () {
return _recursion.toString();
};
return recursion;
}(function (obj) {
var data = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
for (key in obj) {
if (_typeof(obj[key]) == 'object' && Object.keys(obj[key].length > 0)) {
data[key] = recursion(obj[key]);
} else {
data[key] = obj[key];
}
}
return data;
});
DragColumn.prototype.render = function render() {
var _props = this.props,
data = _props.data,
dragborder = _props.dragborder,
draggable = _props.draggable,
className = _props.className,
columns = _props.columns,
onDragStart = _props.onDragStart,
onDragEnter = _props.onDragEnter,
onDragOver = _props.onDragOver,
onDrop = _props.onDrop,
others = _objectWithoutProperties(_props, ['data', 'dragborder', 'draggable', 'className', 'columns', 'onDragStart', 'onDragEnter', 'onDragOver', 'onDrop']);
var key = new Date().getTime();
return _react2["default"].createElement(Table, _extends({}, others, {
columns: this.state.columns,
data: data,
className: className + ' u-table-drag-border',
onDragStart: this.onDragStart,
onDragOver: this.onDragOver,
onDrop: this.onDrop,
onDragEnter: this.onDragEnter,
draggable: draggable,
dragborder: dragborder
// dragborder={false}
, dragborderKey: key
}));
};
return DragColumn;
}(_react.Component);
}
module.exports = exports['default'];

274
build/lib/filterColumn.js Normal file
View File

@ -0,0 +1,274 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
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; };
exports["default"] = filterColumn;
var _react = require("react");
var _react2 = _interopRequireDefault(_react);
var _beeCheckbox = require("bee-checkbox");
var _beeCheckbox2 = _interopRequireDefault(_beeCheckbox);
var _beeIcon = require("bee-icon");
var _beeIcon2 = _interopRequireDefault(_beeIcon);
var _util = require("./util");
var _i18n = require("./i18n");
var _i18n2 = _interopRequireDefault(_i18n);
var _tool = require("bee-locale/build/tool");
var _propTypes = require("prop-types");
var _propTypes2 = _interopRequireDefault(_propTypes);
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; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : _defaults(subClass, superClass); }
function noop() {}
/**
* 参数: 过滤表头
* @param {*} Table
* @param {*} Popover
* @param {*} Icon
*/
function filterColumn(Table, Popover) {
var _class, _temp, _initialiseProps;
return _temp = _class = function (_Component) {
_inherits(FilterColumn, _Component);
function FilterColumn(props) {
_classCallCheck(this, FilterColumn);
var _this = _possibleConstructorReturn(this, _Component.call(this, props));
_initialiseProps.call(_this);
var columns = props.columns;
_this.state = {
columns: _this.setColumOrderByIndex((0, _util.ObjectAssign)(columns)),
showModal: false,
screenY: 0
};
return _this;
}
FilterColumn.prototype.componentWillReceiveProps = function componentWillReceiveProps(nextProps) {
if (nextProps.columns != this.props.columns) {
this.setState({
columns: this.setColumOrderByIndex((0, _util.ObjectAssign)(nextProps.columns))
});
}
this.setState({
showModal: nextProps.showFilterPopover ? true : false
});
};
FilterColumn.prototype.render = function render() {
var _props = this.props,
data = _props.data,
prefixCls = _props.prefixCls,
scrollPro = _props.scroll;
var _state = this.state,
columns = _state.columns,
showModal = _state.showModal;
var locale = (0, _tool.getComponentLocale)(this.props, this.context, 'Table', function () {
return _i18n2["default"];
});
var _columns = [],
widthState = 0,
scroll = scrollPro;
columns.forEach(function (da) {
if (da.ifshow) {
_columns.push(da);
if (da.width) {
widthState++;
}
}
});
// if(_columns.length == widthState){
// scroll.x = this.getCloumnsScroll(columns);
// }
var content = _react2["default"].createElement(
"div",
{ className: prefixCls + "-pop-cont" },
_react2["default"].createElement(
"span",
{ className: prefixCls + "-clear-setting", onClick: this.clear },
locale["resetSettings"]
),
_react2["default"].createElement(
"div",
null,
this.getCloumItem()
)
);
return _react2["default"].createElement(
"div",
{ className: prefixCls + "-cont" },
_react2["default"].createElement(Table, _extends({}, this.props, {
columns: _columns,
data: data
// scroll={scroll}
// scroll={{x:this.getCloumnsScroll(columns)}}
})),
this.props.columnFilterAble == false ? "" : _react2["default"].createElement(
"div",
{ className: prefixCls + "-filter-icon" },
_react2["default"].createElement(
Popover,
{
id: "filter_column_popover",
placement: "left",
content: content,
show: showModal
},
_react2["default"].createElement(
"div",
{ className: prefixCls + "-pop-column-filter-cont" },
_react2["default"].createElement(_beeIcon2["default"], { type: "uf-grid", onClick: this.openCloumList })
)
)
)
);
};
return FilterColumn;
}(_react.Component), _class.defaultProps = {
prefixCls: "u-table-filter-column",
afterFilter: noop,
columnFilterAble: true,
scroll: {}
}, _class.contextTypes = {
beeLocale: _propTypes2["default"].object
}, _initialiseProps = function _initialiseProps() {
var _this2 = this;
this.setColumOrderByIndex = function (_column) {
_column.forEach(function (da) {
//默认所有的列都显示，如果传递ifshow属性，根据ifshow属性值来判断是否显示某列
if (da.hasOwnProperty("ifshow")) {
da.checked = da.ifshow ? true : false;
da.ifshow = da.checked;
} else {
da.checked = true;
da.ifshow = true;
}
});
return _column;
};
this.checkedColumItemClick = function (da) {
var _props2 = _this2.props,
checkMinSize = _props2.checkMinSize,
afterFilter = _props2.afterFilter;
// if(checkMinSize)
var sum = 0,
leng = 0;
_this2.state.columns.forEach(function (da) {
da.fixed ? "" : leng++;
!da.fixed && da.checked ? sum++ : "";
});
if (sum < checkMinSize && da.checked) {
return;
} else {
if (sum <= 1 && da.checked) return;
}
da.checked = da.checked ? false : true;
da.ifshow = da.checked ? true : false;
_this2.setState(_extends({}, _this2.state));
afterFilter(da, _this2.state.columns);
};
this.openCloumList = function () {
_this2.setState({
showModal: true
});
};
this.getCloumItem = function () {
var prefixCls = _this2.props.prefixCls;
var columns = _this2.state.columns;
return columns.map(function (da, i) {
var paramObj = {
id: da.key,
checked: da.checked
};
if (da.fixed) {
paramObj.disabled = true;
} else {
paramObj.onClick = function () {
_this2.checkedColumItemClick(da);
};
}
return _react2["default"].createElement(
"div",
{
key: da.key + "_" + i,
className: prefixCls + "-pop-cont-item"
},
_react2["default"].createElement(_beeCheckbox2["default"], paramObj),
_react2["default"].createElement(
"span",
null,
da.title
)
);
});
};
this.clear = function () {
var columns = _this2.state.columns;
columns.forEach(function (da) {
da.checked = true;
da.ifshow = true;
});
_this2.setState({
columns: columns
});
_this2.props.afterFilter(_this2.state.columns, _this2.state.columns);
};
this.getCloumnsScroll = function (columns) {
var sum = 0;
columns.forEach(function (da) {
if (da.checked) {
sum += da.width;
}
});
// console.log("sum",sum);
return sum;
};
}, _temp;
}
module.exports = exports["default"];

48
build/lib/i18n.js Normal file
View File

@ -0,0 +1,48 @@
'use strict';
module.exports = {
'lang': 'zh-cn',
'resetSettings': '还原设置',
'include': '包含',
'exclusive': '不包含',
'equal': '等于',
'unequal': '不等于',
'begin': '以开始',
'end': '以结尾',
'greater_than': '大于',
'great_than_equal_to': '大于等于',
'less_than': '小于',
'less_than_equal_to': '小于等于',
'be_equal_to': '等于',
'not_equal_to': '不等于',
'en-us': {
'resetSettings': 'reset settings',
'include': 'include',
'exclusive': 'exclusive',
'equal': 'equal',
'unequal': 'unequal',
'begin': 'begin',
'end': 'end',
'greater_than': 'greater than',
'great_than_equal_to': 'great than equal to',
'less_than': 'less than',
'less_than_equal_to': 'less than equal to',
'be_equal_to': 'be equal to',
'not_equal_to': 'not equal to'
},
'zh-tw': {
'resetSettings': '還原設置',
'include': '包含',
'exclusive': '不包含',
'equal': '等於',
'unequal': '不等於',
'begin': '以開始',
'end': '以結尾',
'greater_than': '大於',
'great_than_equal_to': '大於等於',
'less_than': '小於',
'less_than_equal to': '小於等於',
'be_equal_to': '等於',
'not_equal_to': '不等於'
}
};

247
build/lib/multiSelect.js Normal file
View File

@ -0,0 +1,247 @@
'use strict';
Object.defineProperty(exports, "__esModule", {
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; };
exports["default"] = multiSelect;
var _react = require('react');
var _react2 = _interopRequireDefault(_react);
var _beeCheckbox = require('bee-checkbox');
var _beeCheckbox2 = _interopRequireDefault(_beeCheckbox);
var _util = require('./util');
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; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : _defaults(subClass, superClass); }
/**
* 参数: 过滤表头
* @param {*} Table
* @param {*} Checkbox
* @param {*} Popover
* @param {*} Icon
*/
function multiSelect(Table, Checkbox) {
var _class, _temp, _initialiseProps;
return _temp = _class = function (_Component) {
_inherits(NewMultiSelect, _Component);
function NewMultiSelect(props) {
_classCallCheck(this, NewMultiSelect);
var _this = _possibleConstructorReturn(this, _Component.call(this, props));
_initialiseProps.call(_this);
var obj = _this.getCheckedOrIndeter(props.data);
_this.state = _extends({}, obj, {
data: (0, _util.ObjectAssign)(props.data)
});
return _this;
}
NewMultiSelect.prototype.componentWillReceiveProps = function componentWillReceiveProps(nextProps) {
if (this.props.data != nextProps.data) {
var obj = this.getCheckedOrIndeter(nextProps.data);
this.setState(_extends({}, obj, {
data: (0, _util.ObjectAssign)(nextProps.data)
}));
}
};
/**
* @param {*} data
*/
NewMultiSelect.prototype.getCheckedOrIndeter = function getCheckedOrIndeter(data) {
var obj = {};
var checkStatus = this.setChecked(data);
if (!checkStatus) {
obj.checkedAll = false;
obj.indeterminate = false;
return obj;
}
if (checkStatus == 'indeter') {
obj.indeterminate = true;
obj.checkedAll = false;
} else if (checkStatus == 'all') {
obj.checkedAll = true;
obj.indeterminate = false;
}
return obj;
};
/**
* 判断数据是否全部选中
* @param {*} data
* reutnr string all(全选)、indeter(半选)
*/
NewMultiSelect.prototype.setChecked = function setChecked(data) {
if (!this.isArray(data)) return false;
if (data.length == 0) return false;
var count = 0;
var disabledCount = 0;
data.forEach(function (da) {
if (da._checked) {
count++;
}
if (da._disabled) {
disabledCount++;
}
});
if (data.length == count + disabledCount) {
return "all";
}
return count == 0 ? false : "indeter";
};
/**
* 判断是否是数组
* @param {*} o
*/
NewMultiSelect.prototype.isArray = function isArray(o) {
return Object.prototype.toString.call(o) == '[object Array]';
};
NewMultiSelect.prototype.render = function render() {
var columns = this.props.columns;
var data = this.state.data;
return _react2["default"].createElement(Table, _extends({}, this.props, { columns: this.getDefaultColumns(columns), data: data }));
};
return NewMultiSelect;
}(_react.Component), _class.defaultProps = {
prefixCls: "u-table-mult-select"
}, _initialiseProps = function _initialiseProps() {
var _this2 = this;
this.onAllCheckChange = function () {
var _state = _this2.state,
data = _state.data,
checkedAll = _state.checkedAll,
indeterminate = _state.indeterminate;
var check = false;
if (checkedAll) {
check = false;
} else {
// if(indeterminate){
// check = true;
// }else{
// check = true;
// }
check = true;
}
var selectList = [];
data.forEach(function (item) {
if (!item._disabled) {
item._checked = check;
}
if (item._checked) {
selectList.push(item);
}
});
if (selectList.length > 0) {
indeterminate = true;
} else {
indeterminate = false;
}
_this2.setState({
indeterminate: indeterminate,
checkedAll: check
});
_this2.props.getSelectedDataFunc(selectList);
};
this.handleClick = function () {};
this.onCheckboxChange = function (text, record, index) {
return function () {
var data = _this2.state.data;
var selectList = [];
record._checked = record._checked ? false : true;
var obj = _this2.getCheckedOrIndeter(data);
_this2.setState(_extends({
data: data
}, obj));
data.forEach(function (da) {
if (da._checked) {
selectList.push(da);
}
});
_this2.props.getSelectedDataFunc(selectList, record, index);
};
};
this.getDefaultColumns = function (columns) {
var _state2 = _this2.state,
checkedAll = _state2.checkedAll,
indeterminate = _state2.indeterminate;
var checkAttr = { checked: checkedAll ? true : false };
var data = _this2.props.data;
var dataLength = data.length;
var disabledCount = 0;
indeterminate ? checkAttr.indeterminate = true : "";
//设置表头Checkbox是否可以点击
data.forEach(function (item, index, arr) {
if (item._disabled) {
disabledCount++;
}
});
var _defaultColumns = [{
title: _react2["default"].createElement(Checkbox, _extends({
className: 'table-checkbox'
}, checkAttr, {
disabled: disabledCount == dataLength ? true : false,
onChange: _this2.onAllCheckChange
})),
key: "checkbox",
dataIndex: "checkbox",
fixed: "left",
width: 50,
render: function render(text, record, index) {
var attr = {};
record._disabled ? attr.disabled = record._disabled : "";
return _react2["default"].createElement(Checkbox, _extends({
key: index,
className: 'table-checkbox'
}, attr, {
checked: record._checked,
onClick: _this2.handleClick,
onChange: _this2.onCheckboxChange(text, record, index)
}));
}
}];
return _defaultColumns.concat(columns);
};
}, _temp;
}
module.exports = exports['default'];

195
build/lib/newMultiSelect.js Normal file
View File

@ -0,0 +1,195 @@
'use strict';
Object.defineProperty(exports, "__esModule", {
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; };
exports["default"] = newMultiSelect;
var _react = require('react');
var _react2 = _interopRequireDefault(_react);
var _beeCheckbox = require('bee-checkbox');
var _beeCheckbox2 = _interopRequireDefault(_beeCheckbox);
var _util = require('./util');
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; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : _defaults(subClass, superClass); }
/**
* 参数: 过滤表头
* @param {*} Table
* @param {*} Checkbox
* @param {*} Popover
* @param {*} Icon
*/
function newMultiSelect(Table, Checkbox) {
var _class, _temp, _initialiseProps;
return _temp = _class = function (_Component) {
_inherits(NewMultiSelect, _Component);
function NewMultiSelect(props) {
_classCallCheck(this, NewMultiSelect);
var _this = _possibleConstructorReturn(this, _Component.call(this, props));
_initialiseProps.call(_this);
var checkedAll = _this.setChecked(props.data);
_this.state = {
checkedAll: checkedAll,
data: (0, _util.ObjectAssign)(props.data)
};
return _this;
}
NewMultiSelect.prototype.componentWillReceiveProps = function componentWillReceiveProps(nextProps) {
if (this.props.data != nextProps.data) {
this.setState({
data: (0, _util.ObjectAssign)(nextProps.data),
checkedAll: this.setChecked(nextProps.data)
});
}
};
NewMultiSelect.prototype.setChecked = function setChecked(data) {
var allCheck = true;
if (data) {
var _iteratorNormalCompletion = true;
var _didIteratorError = false;
var _iteratorError = undefined;
try {
for (var _iterator = data[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = true) {
var da = _step.value;
if (!da._checked) {
allCheck = false;
break;
}
}
} catch (err) {
_didIteratorError = true;
_iteratorError = err;
} finally {
try {
if (!_iteratorNormalCompletion && _iterator["return"]) {
_iterator["return"]();
}
} finally {
if (_didIteratorError) {
throw _iteratorError;
}
}
}
}
return allCheck;
};
NewMultiSelect.prototype.render = function render() {
var columns = this.props.columns;
var data = this.state.data;
return _react2["default"].createElement(Table, _extends({}, this.props, { columns: this.getDefaultColumns(columns), data: data }));
};
return NewMultiSelect;
}(_react.Component), _class.defaultProps = {
prefixCls: "u-table-mult-select"
}, _initialiseProps = function _initialiseProps() {
var _this2 = this;
this.onAllCheckChange = function () {
var _state = _this2.state,
data = _state.data,
checkedAll = _state.checkedAll;
var selectList = [];
var check = checkedAll ? false : true;
data.forEach(function (item) {
item._checked = check;
if (item._checked) {
selectList.push(item);
}
});
_this2.setState({
checkedAll: check
});
_this2.props.getSelectedDataFunc(selectList);
};
this.handleClick = function () {};
this.onCheckboxChange = function (text, record, index) {
return function () {
var data = _this2.state.data;
var selectList = [];
record._checked = record._checked ? false : true;
var checkedAll = true;
for (var i = 0; i < data.length; i++) {
var item = data[i];
if (!item._checked || item._checked == false) {
checkedAll = false;
break;
}
}
_this2.setState(_extends({}, _this2.state, {
checkedAll: checkedAll
}));
data.forEach(function (da) {
if (da._checked) {
selectList.push(da);
}
});
_this2.props.getSelectedDataFunc(selectList, record, index);
};
};
this.getDefaultColumns = function (columns) {
// let checkedAll = init?false:this.state.checkedAll;
var checkedAll = _this2.state.checkedAll;
var _defaultColumns = [{
title: _react2["default"].createElement(Checkbox, {
className: 'table-checkbox',
checked: checkedAll
// indeterminate={indeterminate_bool && !this.state.checkedAll}
, onChange: _this2.onAllCheckChange
}),
key: "checkbox",
dataIndex: "checkbox",
fixed: "left",
width: 50,
render: function render(text, record, index) {
var attr = {};
record._disabled ? attr.disabled = record._disabled : "";
return _react2["default"].createElement(Checkbox, _extends({
key: index,
className: 'table-checkbox'
}, attr, {
checked: record._checked,
onClick: _this2.handleClick,
onChange: _this2.onCheckboxChange(text, record, index)
}));
}
}];
return _defaultColumns.concat(columns);
};
}, _temp;
}
module.exports = exports['default'];

367
build/lib/sort.js Normal file
View File

@ -0,0 +1,367 @@
'use strict';
Object.defineProperty(exports, "__esModule", {
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; };
exports["default"] = sort;
var _react = require('react');
var _react2 = _interopRequireDefault(_react);
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; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : _defaults(subClass, superClass); }
/**
* 参数：prefixCls，默认bee-table,用于设置图标的样式
* @param {*} Table
* @param {*} Icon
*/
function sort(Table, Icon) {
var _class, _temp, _initialiseProps;
var IconType = [{
'type': 'flat',
'icon': 'uf-symlist',
'order': 'flatscend'
}, {
'type': 'up',
'icon': 'uf-sortup',
'order': 'ascend'
}, {
'type': 'down',
'icon': 'uf-sortdown',
'order': 'descend'
}];
return _temp = _class = function (_Component) {
_inherits(SortTable, _Component);
function SortTable(props) {
_classCallCheck(this, SortTable);
var _this2 = _possibleConstructorReturn(this, _Component.call(this, props));
_initialiseProps.call(_this2);
var flatColumns = [];
_this2._toFlatColumn(props.columns, -1, flatColumns);
_this2.state = { data: _this2.props.data, columns: props.columns, flatColumns: flatColumns };
return _this2;
}
//默认是前端排序，值为true为后端排序
SortTable.prototype.componentWillReceiveProps = function componentWillReceiveProps(nextProps) {
if (nextProps.data !== this.props.data) {
this.setState({
data: nextProps.data,
oldData: nextProps.data.concat()
});
}
if (nextProps.columns !== this.props.columns) {
var flatColumns = [];
this._toFlatColumn(nextProps.columns, -1, flatColumns);
this.setState({ columns: nextProps.columns, flatColumns: flatColumns });
}
};
/**
*column扁平化处理，适应多表头避免递归操作
*
*/
SortTable.prototype._toFlatColumn = function _toFlatColumn(columns) {
var parentIndex = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : -1;
var flatColumns = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : [];
var _this = this;
var children = [];
// const flatColumns = _this.state;
columns.forEach(function (item, index) {
item.parentIndex = parentIndex;
children = item.children;
flatColumns.push(item);
if (children) {
item.children = [];
_this._toFlatColumn(children, flatColumns.length - 1, flatColumns);
}
});
};
/**
* column 当前的排序的列
* 当有的列不排序时，将该列的orderNum置为‘’，并动态的修改其他列的orderNum。
*/
/**
* 获取排序字段
*/
/**
* pre：前一条数据
* after:后一条数据
* orderType:升序、降序
*/
/**
* 多列排序 先排order为1的，其他的基于已排序的数据排
*/
//每个column上添加orderNum属性，不排序时为“”。
//点击时orderNum有值则不重新赋值，如果没有值，则取当前column下的有oderNum的length值。并排序
//点击置为“”时，动态的设置相关column的orderNum值。并排序
SortTable.prototype._flatToColumn = function _flatToColumn(flatColumns) {
var colLen = flatColumns.length;
var parentIndex = void 0,
rsColumns = [];
//每次渲染需要将父类的children置空，避免重复
flatColumns.forEach(function (item) {
if (item.children) {
item.children = [];
}
});
for (var i = colLen - 1; i >= 0; i--) {
parentIndex = flatColumns[i].parentIndex;
if (parentIndex >= 0) {
flatColumns[parentIndex].children.unshift(flatColumns[i]);
}
}
rsColumns = flatColumns.filter(function (item) {
return item.parentIndex == -1;
});
return rsColumns;
};
SortTable.prototype.render = function render() {
var columns = this.renderColumnsDropdown(this.state.flatColumns.concat());
return _react2["default"].createElement(Table, _extends({}, this.props, { columns: columns, data: this.state.data }));
};
return SortTable;
}(_react.Component), _class.defaultProps = { sort: { mode: "single", backSource: false } }, _initialiseProps = function _initialiseProps() {
var _this3 = this;
this.getOrderNum = function () {
var orderNum = 0;
//todo 1
_this3.state.flatColumns.forEach(function (item, index) {
if (item.order == "ascend" || item.order == "descend") {
orderNum++;
}
});
return orderNum ? orderNum : 1;
};
this.changeOrderNum = function (column) {
var flatColumns = _this3.state.flatColumns;
//todo 2
flatColumns.forEach(function (col) {
if (col.orderNum > column.orderNum) {
col.orderNum--;
}
if (column.key == col.key) {
col.orderNum = "";
}
});
_this3.setState({ flatColumns: flatColumns });
};
this.getOrderCols = function (columns) {
var orderCols = [];
//todo 3
columns.forEach(function (item) {
if (item.order == "ascend" || item.order == "descend") {
orderCols.push({
order: item.order,
field: item.dataIndex,
orderNum: item.orderNum
});
}
});
return orderCols;
};
this._sortBy = function (pre, after, orderCols, orderColslen, currentIndex) {
var preKey = pre[orderCols[currentIndex].key];
var afterKey = after[orderCols[currentIndex].key];
if (preKey == afterKey && currentIndex + 1 <= orderColslen) {
return _this3._sortBy(pre, after, orderCols, orderColslen, currentIndex + 1);
}
if (orderCols[currentIndex].order == "ascend") {
return preKey - afterKey;
} else {
return afterKey - preKey;
}
};
this.multiSort = function (columns) {
var _state = _this3.state,
data = _state.data,
oldData = _state.oldData;
var self = _this3;
var orderCols = {},
orderColslen = 0;
//todo 4
columns.forEach(function (item) {
if (item.orderNum) {
orderColslen++;
orderCols[item.orderNum] = item;
}
});
if (orderColslen > 0) {
data = data.sort(function (a, b) {
return self._sortBy(a, b, orderCols, orderColslen, 1);
});
} else {
data = oldData.concat();
}
return data;
};
this.toggleSortOrder = function (order, column) {
var _state2 = _this3.state,
data = _state2.data,
oldData = _state2.oldData,
flatColumns = _state2.flatColumns;
var sort = _this3.props.sort;
var seleObj = void 0;
if (!oldData) {
oldData = data.concat();
}
var sortCol = void 0;
//单列排序，清空其他列的排序
if (sort.mode == "single") {
//todo 5
flatColumns.forEach(function (da) {
if (da.key == column.key) {
seleObj = da;
} else {
if (da.order) {
da.order = "flatscend";
}
}
});
seleObj.order = order;
sortCol = [{ order: order, field: seleObj.dataIndex }];
//通过后端请求
if (sort.backSource && typeof sort.sortFun === "function") {
//获取排序的字段和方式
sort.sortFun(sortCol);
} else {
if (order === "ascend") {
data = data.sort(function (a, b) {
return column.sorter(a, b);
});
} else if (order === "descend") {
data = data.sort(function (a, b) {
return column.sorter(b, a);
});
} else {
data = oldData.concat();
}
typeof sort.sortFun === "function" && sort.sortFun(sortCol, data);
}
} else {
seleObj = flatColumns.find(function (da) {
return da.key == column.key;
});
seleObj.order = order;
if (order === "flatscend") {
_this3.changeOrderNum(column);
}
if (!seleObj.orderNum && (order == "ascend" || order == "descend")) {
seleObj.orderNum = _this3.getOrderNum();
}
sortCol = _this3.getOrderCols(flatColumns);
if (sort.backSource && typeof sort.sortFun === "function") {
sort.sortFun(sortCol);
} else {
data = _this3.multiSort(flatColumns);
typeof sort.sortFun === "function" && sort.sortFun(sortCol, data);
}
}
_this3.setState({ data: data, oldData: oldData, flatColumns: flatColumns });
};
this.renderColumnsDropdown = function (columns) {
var tempColumns = [],
rsColumns = [];
tempColumns = columns.map(function (originColumn) {
var column = _extends({}, originColumn);
return _this3.sortColumn(column);
});
rsColumns = _this3._flatToColumn(tempColumns);
return rsColumns;
};
this.sortColumn = function (column) {
var mode = _this3.props.sort.mode;
var prefixCls = "bee-table";
var iconTypeIndex = 0;
var sorterClass = "flat";
if (column.order === "ascend") {
iconTypeIndex = 1;
sorterClass = "up";
} else if (column.order === "descend") {
iconTypeIndex = 2;
sorterClass = "down";
}
var sortButton = void 0;
if (column.sorter) {
//大于0说明不是升序就是降序，判断orderNum有没有值，没有值赋值
if (iconTypeIndex > 0 && !column.orderNum && mode == "multiple") {
column.orderNum = _this3.getOrderNum();
}
sortButton = _react2["default"].createElement(
'div',
{ className: prefixCls + '-column-sorter' },
_react2["default"].createElement(
'span',
{ className: prefixCls + '-column-sorter-' + sorterClass, onClick: function onClick() {
_this3.toggleSortOrder(IconType[iconTypeIndex == 2 ? 0 : iconTypeIndex + 1].order, column);
if (column.sorterClick) {
column.sorterClick(column, IconType[iconTypeIndex].type);
}
} },
_react2["default"].createElement('i', { className: 'uf ' + IconType[iconTypeIndex].icon }),
_react2["default"].createElement(
'span',
null,
column.orderNum
)
)
);
}
column.title = _react2["default"].createElement(
'span',
null,
column.title,
sortButton
);
return column;
};
}, _temp;
}
module.exports = exports['default'];

126
build/lib/sum.js Normal file
View File

@ -0,0 +1,126 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
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; };
exports["default"] = sum;
var _react = require("react");
var _react2 = _interopRequireDefault(_react);
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; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : _defaults(subClass, superClass); }
function sum(Table) {
return function (_React$Component) {
_inherits(SumTable, _React$Component);
//无状态
function SumTable(props) {
_classCallCheck(this, SumTable);
//array , tree
var _this = _possibleConstructorReturn(this, _React$Component.call(this, props));
_this.getNodeItem = function (array, newArray) {
array.forEach(function (da, i) {
if (da.children) {
_this.getNodeItem(da.children, newArray);
} else {
newArray.push(da);
}
});
};
_this.getTableType = function () {
var columns = _this.props.columns;
var type = "array";
columns.find(function (da, i) {
if (da.children) {
type = "tree";
return type;
}
});
return type;
};
_this.addSumData = function () {
var _this$props = _this.props,
_this$props$data = _this$props.data,
data = _this$props$data === undefined ? [] : _this$props$data,
_this$props$columns = _this$props.columns,
columns = _this$props$columns === undefined ? [] : _this$props$columns;
var sumdata = {},
newColumns = [],
newData = [];
if (!Array.isArray(columns)) {
console.log("columns type is error !");return;
}
var type = _this.getTableType();
if (type == 'tree') {
_this.getNodeItem(columns, newColumns);
} else {
newColumns = columns;
}
//返回一个新的数据
newData = data.slice();
newColumns.forEach(function (column, index) {
sumdata[column.dataIndex] = "";
if (column.sumCol) {
var count = 0;
data.forEach(function (da, i) {
var _num = parseFloat(da[column.key]);
//排查字段值为NAN情况
if (_num == _num) {
count += _num;
}
});
sumdata[column.dataIndex] = (0, _utils.DicimalFormater)(count, 2);
}
if (index == 0) {
sumdata[column.dataIndex] = "合计 " + sumdata[column.dataIndex];
}
});
newData.push(sumdata);
return newData;
};
_this.tableType = "array";
return _this;
}
/**
* 获取当前的表格类型。
*
*/
SumTable.prototype.render = function render() {
return _react2["default"].createElement(Table, _extends({}, this.props, {
columns: this.props.columns,
showSum: true,
data: this.addSumData()
}));
};
return SumTable;
}(_react2["default"].Component);
}
module.exports = exports["default"];

79
build/lib/util.js Normal file
View File

@ -0,0 +1,79 @@
'use strict';
Object.defineProperty(exports, "__esModule", {
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; };
exports.sortBy = sortBy;
exports.compare = compare;
exports.ObjectAssign = ObjectAssign;
/*
* 快速排序，按某个属性，或按“获取排序依据的函数”，来排序.
* @method soryBy
* @static
* @param {array} arr 待处理数组
* @param {string|function} prop 排序依据属性，获取
* @param {boolean} desc 降序
* @return {array} 返回排序后的新数组
*/
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 '参数类型错误';
}
props.sort();
for (i = 0; i < len; i++) {
ret[i] = props[i]._obj;
}
if (desc) ret.reverse();
return ret;
};
/**
* 数组对象排序
* console.log(arr.sort(compare('age')))
* @param {} property
*/
function compare(property) {
return function (a, b) {
var value1 = a[property];
var value2 = b[property];
return value1 - value2;
};
}
/**
* 简单数组数据对象拷贝
* @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;
}

101
build/render/CheckboxRender.js Normal file
View File

@ -0,0 +1,101 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports["default"] = renderCheckbox;
var _react = require("react");
var _react2 = _interopRequireDefault(_react);
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; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : _defaults(subClass, superClass); }
/**
* 渲染checkbox
* @param Checkbox
* @param Icon
* @returns {CheckboxRender}
*/
function renderCheckbox(Checkbox, Icon) {
return function (_Component) {
_inherits(CheckboxRender, _Component);
function CheckboxRender() {
var _temp, _this, _ret;
_classCallCheck(this, CheckboxRender);
for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
return _ret = (_temp = (_this = _possibleConstructorReturn(this, _Component.call.apply(_Component, [this].concat(args))), _this), _this.state = {
value: _this.props.value,
editable: false
}, _this.handleChange = function (e) {
var value = e.target.value;
_this.setState({ value: value });
}, _this.check = function () {
_this.setState({ editable: false });
if (_this.props.onChange) {
_this.props.onChange(_this.state.value);
}
}, _this.edit = function () {
_this.setState({ editable: true });
}, _this.handleKeydown = function (event) {
if (event.keyCode == 13) {
_this.check();
}
}, _temp), _possibleConstructorReturn(_this, _ret);
}
CheckboxRender.prototype.render = function render() {
var _state = this.state,
value = _state.value,
editable = _state.editable;
var cellContent = "";
if (editable) {
cellContent = _react2["default"].createElement(
"div",
{ className: "editable-cell-input-wrapper" },
_react2["default"].createElement(Checkbox, {
onChange: this.handleChange,
onKeyDown: this.handleKeydown,
onBlur: this.check,
autoFocus: true,
value: value
})
);
} else {
cellContent = _react2["default"].createElement(
"div",
{ className: "editable-cell-text-wrapper" },
value || " ",
_react2["default"].createElement(Icon, {
type: "uf-pencil",
className: "editable-cell-icon",
onClick: this.edit
})
);
}
return _react2["default"].createElement(
"div",
{ className: "editable-cell" },
cellContent
);
};
return CheckboxRender;
}(_react.Component);
}
module.exports = exports["default"];

154
build/render/DateRender.js Normal file
View File

@ -0,0 +1,154 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
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; };
exports["default"] = renderDate;
var _react = require("react");
var _react2 = _interopRequireDefault(_react);
var _moment = require("moment");
var _moment2 = _interopRequireDefault(_moment);
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; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : _defaults(subClass, superClass); }
function renderDate(DatePicker, Icon) {
var _class, _temp2;
var MonthPicker = DatePicker.MonthPicker,
RangePicker = DatePicker.RangePicker,
WeekPicker = DatePicker.WeekPicker;
return _temp2 = _class = function (_Component) {
_inherits(DateRender, _Component);
function DateRender() {
var _temp, _this, _ret;
_classCallCheck(this, DateRender);
for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
return _ret = (_temp = (_this = _possibleConstructorReturn(this, _Component.call.apply(_Component, [this].concat(args))), _this), _this.state = {
value: _this.props.value,
editable: false
}, _this.handleChange = function (e) {
var _ref = _this.props || "YYYY-MM-DD",
format = _ref.format;
var value = e ? e.format(format) : "";
_this.setState({ value: value, editable: false });
if (_this.props.onChange) {
_this.props.onChange(value);
}
}, _this.check = function () {
_this.setState({ editable: false });
if (_this.props.onChange) {
_this.props.onChange(_this.state.value);
}
}, _this.edit = function () {
_this.setState({ editable: true });
}, _this.handleKeydown = function (event) {
if (event.keyCode == 13) {
_this.check();
}
}, _temp), _possibleConstructorReturn(_this, _ret);
}
DateRender.prototype.render = function render() {
var _state = this.state,
value = _state.value,
editable = _state.editable;
var _props = this.props,
isclickTrigger = _props.isclickTrigger,
type = _props.type;
var cellContent = "";
var TComponent = void 0;
switch (type.toLowerCase()) {
case "monthpicker":
TComponent = MonthPicker;
break;
// case "rangepicker":
// TComponent = RangePicker;
// break;
case "weekpicker":
TComponent = WeekPicker;
break;
default:
TComponent = DatePicker;
break;
}
var date_value = value ? (0, _moment2["default"])(value) : value;
if (editable) {
cellContent = isclickTrigger ? _react2["default"].createElement(
"div",
{ className: "editable-cell-input-wrapper" },
_react2["default"].createElement(TComponent, _extends({}, this.props, {
value: date_value,
onChange: this.handleChange
})),
_react2["default"].createElement(Icon, {
type: "uf-correct",
className: "editable-cell-icon-check",
onClick: this.check
})
) : _react2["default"].createElement(
"div",
{ className: "editable-cell-input-wrapper" },
_react2["default"].createElement(TComponent, _extends({}, this.props, {
value: date_value,
onChange: this.handleChange
})),
_react2["default"].createElement(Icon, {
type: "uf-correct",
className: "editable-cell-icon-check",
onClick: this.check
})
);
} else {
cellContent = isclickTrigger ? _react2["default"].createElement(
"div",
{ className: "editable-cell-text-wrapper", onClick: this.edit },
value || " "
) : _react2["default"].createElement(
"div",
{ className: "editable-cell-text-wrapper" },
value || " ",
_react2["default"].createElement(Icon, {
type: "uf-pencil",
className: "editable-cell-icon",
onClick: this.edit
})
);
}
return _react2["default"].createElement(
"div",
{ className: "editable-cell" },
cellContent
);
};
return DateRender;
}(_react.Component), _class.defaultProps = {
type: "DatePicker"
}, _temp2;
}
module.exports = exports["default"];

194
build/render/InputRender.js Normal file
View File

@ -0,0 +1,194 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
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; };
exports["default"] = renderInput;
var _react = require("react");
var _react2 = _interopRequireDefault(_react);
var _propTypes = require("prop-types");
var _propTypes2 = _interopRequireDefault(_propTypes);
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; }
function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : _defaults(subClass, superClass); }
/**
* 渲染输入框
* @param Form
* @param Input
* @param Icon
* @returns {InputRender}
*/
function renderInput(Form, Input, Icon) {
var _class, _temp2;
return _temp2 = _class = function (_Component) {
_inherits(InputRender, _Component);
function InputRender() {
var _temp, _this, _ret;
_classCallCheck(this, InputRender);
for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
return _ret = (_temp = (_this = _possibleConstructorReturn(this, _Component.call.apply(_Component, [this].concat(args))), _this), _this.state = {
value: _this.props.value,
editable: false
}, _this.handleChange = function (e) {
var value = e;
_this.setState({ value: value });
}, _this.check = function () {
if (typeof _this.flag === "undefined" || _this.flag) {
_this.props.check(_this.flag, _this.obj);
_this.setState({ editable: false });
if (_this.props.onChange) {
_this.props.onChange(_this.state.value);
}
_this.flag = undefined;
}
}, _this.checkValidate = function (flag, obj) {
_this.flag = flag;
_this.obj = obj;
}, _this.edit = function () {
_this.setState({ editable: true });
}, _this.handleKeydown = function (event) {
if (event.keyCode == 13) {
_this.check();
} else if (event.keyCode == 9) {}
}, _this.formatCurrency = function (money) {
if (money && money != null && !!Number(money)) {
money = String(money);
var left = money.split(".")[0],
right = money.split(".")[1];
right = right ? right.length >= 2 ? "." + right.substr(0, 2) : "." + right + "0" : ".00";
var temp = left.split("").reverse().join("").match(/(\d{1,3})/g);
return (Number(money) < 0 ? "-" : "") + temp.join(",").split("").reverse().join("") + right;
} else if (money === 0) {
//注意===在这里的使用，如果传入的money为0,if中会将其判定为boolean类型，故而要另外做===判断
return "0.00";
} else {
return "";
}
}, _temp), _possibleConstructorReturn(_this, _ret);
}
//货币的格式化方法
InputRender.prototype.render = function render() {
var _state = this.state,
value = _state.value,
editable = _state.editable;
var _props = this.props,
name = _props.name,
placeholder = _props.placeholder,
isclickTrigger = _props.isclickTrigger,
format = _props.format,
formItemClassName = _props.formItemClassName,
mesClassName = _props.mesClassName,
check = _props.check,
other = _objectWithoutProperties(_props, ["name", "placeholder", "isclickTrigger", "format", "formItemClassName", "mesClassName", "check"]);
var cellContent = "";
if (editable) {
cellContent = isclickTrigger ? _react2["default"].createElement(
"div",
{ className: "editable-cell-input-wrapper" },
_react2["default"].createElement(
Form.FormItem,
_extends({
className: "formItem-style " + formItemClassName,
mesClassName: "errMessage-style " + mesClassName,
change: this.handleChange,
blur: this.check,
check: this.checkValidate
}, other),
_react2["default"].createElement(Input, {
name: name,
placeholder: placeholder,
onKeyDown: this.handleKeydown,
autoFocus: true,
value: value
})
)
) : _react2["default"].createElement(
"div",
{ className: "editable-cell-input-wrapper" },
_react2["default"].createElement(
Form.FormItem,
_extends({
className: "formItem-style " + formItemClassName,
mesClassName: "errMessage-style " + mesClassName,
change: this.handleChange,
blur: this.check,
check: this.checkValidate
}, other),
_react2["default"].createElement(Input, {
name: name,
placeholder: placeholder,
onKeyDown: this.handleKeydown,
autoFocus: true,
value: value
})
),
_react2["default"].createElement(Icon, {
type: "uf-correct",
className: "editable-cell-icon-check",
onClick: this.check
})
);
} else {
if (format && format === "Currency") {
value = this.formatCurrency(value);
}
cellContent = isclickTrigger ? _react2["default"].createElement(
"div",
{ className: "editable-cell-text-wrapper", onClick: this.edit },
value || " "
) : _react2["default"].createElement(
"div",
{ className: "editable-cell-text-wrapper" },
value || " ",
_react2["default"].createElement(Icon, {
type: "uf-pencil",
className: "editable-cell-icon",
onClick: this.edit
})
);
}
return _react2["default"].createElement(
"div",
{ className: "editable-cell" },
cellContent
);
};
return InputRender;
}(_react.Component), _class.propTypes = {
check: _propTypes2["default"].func
}, _class.defaultProps = {
check: function check() {
return "";
}
}, _temp2;
}
module.exports = exports["default"];

1
build/render/RadioRender.js Normal file
View File

@ -0,0 +1 @@
"use strict";

170
build/render/SelectRender.js Normal file
View File

@ -0,0 +1,170 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
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; };
exports["default"] = renderSelect;
var _react = require("react");
var _react2 = _interopRequireDefault(_react);
var _propTypes = require("prop-types");
var _propTypes2 = _interopRequireDefault(_propTypes);
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; }
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : _defaults(subClass, superClass); }
/**
* 渲染下拉框
* @param Select
* @param Icon
* @returns {SelectRender}
*/
function renderSelect(Select, Icon) {
var _class, _temp2;
return _temp2 = _class = function (_Component) {
_inherits(SelectRender, _Component);
function SelectRender() {
var _temp, _this, _ret;
_classCallCheck(this, SelectRender);
for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
args[_key] = arguments[_key];
}
return _ret = (_temp = (_this = _possibleConstructorReturn(this, _Component.call.apply(_Component, [this].concat(args))), _this), _this.state = {
value: _this.props.value,
editable: false
}, _this.handleChange = function (e) {
var value = e;
if (_this.props.onChange) {
_this.props.onChange(value);
}
_this.setState({ value: value });
setTimeout(function () {
_this.setState({ editable: false });
}, 0);
}, _this.check = function () {
_this.setState({ editable: false });
if (_this.props.onChange) {
_this.props.onChange(_this.state.value);
}
}, _this.edit = function () {
_this.setState({ editable: true });
}, _temp), _possibleConstructorReturn(_this, _ret);
}
SelectRender.prototype.render = function render() {
var _this2 = this;
var _state = this.state,
value = _state.value,
editable = _state.editable;
var _props = this.props,
isclickTrigger = _props.isclickTrigger,
dataSource = _props.dataSource;
var cellContent = "";
if (editable) {
cellContent = isclickTrigger ? _react2["default"].createElement(
"div",
{ className: "editable-cell-input-wrapper" },
_react2["default"].createElement(
Select,
_extends({}, this.props, {
value: this.state.value,
onBlur: function onBlur(value) {
console.log(value);
// this.props.onBlur();
},
onFocus: function onFocus(value) {
console.log(value);
// this.props.onBlur();
},
onChange: this.handleChange
}),
this.props.children
),
_react2["default"].createElement(Icon, {
type: "uf-correct",
className: "editable-cell-icon-check",
onClick: this.check
})
) : _react2["default"].createElement(
"div",
{ className: "editable-cell-input-wrapper" },
_react2["default"].createElement(
Select,
_extends({}, this.props, {
value: this.state.value,
onBlur: function onBlur() {
_this2.setState({
editable: true
});
_this2.props.onBlur();
},
onChange: this.handleChange
}),
this.props.children
),
_react2["default"].createElement(Icon, {
type: "uf-correct",
className: "editable-cell-icon-check",
onClick: this.check
})
);
} else {
if (dataSource && dataSource.length > 0) {
for (var index = 0; index < dataSource.length; index++) {
var element = dataSource[index];
if (element.value === value) {
value = element.key;
break;
}
}
}
cellContent = isclickTrigger ? _react2["default"].createElement(
"div",
{ className: "editable-cell-text-wrapper", onClick: this.edit },
value || " "
) : _react2["default"].createElement(
"div",
{ className: "editable-cell-text-wrapper" },
value || " ",
_react2["default"].createElement(Icon, {
type: "uf-pencil",
className: "editable-cell-icon",
onClick: this.edit
})
);
}
return _react2["default"].createElement(
"div",
{ className: "editable-cell" },
cellContent
);
};
return SelectRender;
}(_react.Component), _class.propTypes = {
dataSource: _propTypes2["default"].array
}, _temp2;
}
module.exports = exports["default"];

313
build/utils.js Normal file
View File

@ -0,0 +1,313 @@
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.Event = exports.EventUtil = exports.tryParseInt = undefined;
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; };
exports.measureScrollbar = measureScrollbar;
exports.debounce = debounce;
exports.warningOnce = warningOnce;
exports.getOffset = getOffset;
exports.addClass = addClass;
exports.removeClass = removeClass;
exports.ObjectAssign = ObjectAssign;
exports.closest = closest;
exports.getMaxColChildrenLength = getMaxColChildrenLength;
exports.getColChildrenLength = getColChildrenLength;
exports.DicimalFormater = DicimalFormater;
exports.checkDicimalInvalid = checkDicimalInvalid;
var _warning = require('warning');
var _warning2 = _interopRequireDefault(_warning);
var _parseInt = require('lodash/parseInt');
var _parseInt2 = _interopRequireDefault(_parseInt);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
var scrollbarSize = void 0;
// Measure scrollbar width for padding body during modal show/hide
var scrollbarMeasure = {
position: 'absolute',
top: '-9999px',
width: '50px',
height: '50px',
overflow: 'scroll'
};
function measureScrollbar() {
var direction = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 'vertical';
if (typeof document === 'undefined' || typeof window === 'undefined') {
return 0;
}
if (scrollbarSize) {
return scrollbarSize;
}
var scrollDiv = document.createElement('div');
Object.keys(scrollbarMeasure).forEach(function (scrollProp) {
scrollDiv.style[scrollProp] = scrollbarMeasure[scrollProp];
});
document.body.appendChild(scrollDiv);
var size = 0;
if (direction === 'vertical') {
size = scrollDiv.offsetWidth - scrollDiv.clientWidth;
} else if (direction === 'horizontal') {
size = scrollDiv.offsetHeight - scrollDiv.clientHeight;
}
document.body.removeChild(scrollDiv);
scrollbarSize = size;
return scrollbarSize;
}
function debounce(func, wait, immediate) {
var timeout = void 0;
return function debounceFunc() {
var context = this;
var args = arguments;
// https://fb.me/react-event-pooling
if (args[0] && args[0].persist) {
args[0].persist();
}
var later = function later() {
timeout = null;
if (!immediate) {
func.apply(context, args);
}
};
var callNow = immediate && !timeout;
clearTimeout(timeout);
timeout = setTimeout(later, wait);
if (callNow) {
func.apply(context, args);
}
};
}
var warned = {};
function warningOnce(condition, format, args) {
if (!warned[format]) {
(0, _warning2["default"])(condition, format, args);
warned[format] = true;
}
}
function getOffset(Node, offset) {
if (!offset) {
offset = {};
offset.top = 0;
offset.left = 0;
}
if (Node == document.body) {
return offset;
}
offset.top += Node.offsetTop;
offset.left += Node.offsetLeft;
if (Node.offsetParent) return getOffset(Node.offsetParent, offset);else return offset;
};
var tryParseInt = exports.tryParseInt = function tryParseInt(value) {
var defaultValue = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
var resultValue = (0, _parseInt2["default"])(value);
if (isNaN(resultValue)) {
return defaultValue;
}
return resultValue;
};
function addClass(elm, className) {
if (!className) return;
var els = Array.isArray(elm) ? elm : [elm];
els.forEach(function (el) {
if (el.classList) {
el.classList.add(className.split(' '));
} else {
el.className += ' ' + className;
}
});
}
function removeClass(elm, className) {
if (!className) return;
var els = Array.isArray(elm) ? elm : [elm];
els.forEach(function (el) {
if (el.classList) {
el.classList.remove(className.split(' '));
} else {
el.className = el.className.replace(new RegExp('(^|\\b)' + className.split(' ').join('|') + '(\\b|$)', 'gi'), ' ');
}
});
}
/**
* 简单数组数据对象拷贝
* @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;
}
/**
* 获取某个父元素
* */
function closest(ele, selector) {
var matches = ele.matches || ele.webkitMatchesSelector || ele.mozMatchesSelector || ele.msMatchesSelector;
if (matches) {
while (ele) {
if (matches.call(ele, selector)) {
return ele;
} else {
ele = ele.parentElement;
}
}
}
return null;
}
function getMaxColChildrenLength(columns) {
var arr = [];
arr = columns.map(function (item, index) {
var chilrenLen = 0;
if (item.children) {
chilrenLen = getColChildrenLength(item.children, chilrenLen + 1);
}
return chilrenLen;
});
var max = Math.max.apply(null, arr);
return max;
}
function getColChildrenLength(columns, chilrenLen) {
columns.forEach(function (item, index) {
if (item.children) {
chilrenLen = getColChildrenLength(item.children, chilrenLen + 1);
}
});
return chilrenLen;
}
function addHandler(element, type, handler) {
var event = null;
if (element.addEventListener) {
//检测是否为DOM2级方法
event = element.addEventListener(type, handler, false);
} else if (element.attachEvent) {
//检测是否为IE级方法
event = element.attachEvent("on" + type, handler);
} else {
//检测是否为DOM0级方法
event = element["on" + type] = handler;
}
return event;
}
function removeHandler(element, type, handler) {
if (element.removeEventListener) {
element.removeEventListener(type, handler, false);
} else if (element.detachEvent) {
element.detachEvent("on" + type, handler);
} else {
element["on" + type] = null;
}
}
//获取事件对象的兼容性写法
function getEvent(event) {
return event ? event : window.event;
}
//获取事件对象目标的兼容性写法
function getTarget(event) {
return event.target || event.srcElement;
}
function preventDefault(event) {
if (event.preventDefault) {
event.preventDefault();
} else {
event.returnValue = false;
}
}
function stopPropagation(event) {
if (event.stopPropagation) {
event.stopPropagation();
} else {
event.cancelBubble = true;
}
}
//用事件冒泡方式，如果想兼容事件捕获只需要添加个bool参数
var EventUtil = exports.EventUtil = {
addHandler: function addHandler(element, type, handler) {
if (element.addEventListener) {
element.addEventListener(type, handler, false);
} else if (element.attachEvent) {
element.attachEvent('on' + type, handler);
} else {
element['on' + type] = handler;
}
},
removeHandler: function removeHandler(element, type, handler) {
if (element.removeEventListener) {
element.removeEventListener(type, handler, false);
} else if (element.detachEvent) {
element.detachEvent('on' + type, handler);
} else {
element['on' + type] = null;
}
}
/*
* 处理精度
*/
};function DicimalFormater(value, precision) {
var value = value + '',
precision = precision ? precision : 0;
for (var i = 0; i < value.length; i++) {
if ("-0123456789.".indexOf(value.charAt(i)) == -1) return "";
}
return checkDicimalInvalid(value, precision);
};
function checkDicimalInvalid(value, precision) {
if (value == null || isNaN(value)) return "";
// 浮点数总位数不能超过10位
var digit = parseFloat(value);
var result = (digit * Math.pow(10, precision) / Math.pow(10, precision)).toFixed(precision);
if (result == "NaN") return "";
return result;
};
var Event = exports.Event = {
addHandler: addHandler,
removeHandler: removeHandler,
getEvent: getEvent,
getTarget: getTarget,
preventDefault: preventDefault,
stopPropagation: stopPropagation
};

2
package.json
View File

@ -1,6 +1,6 @@
{
"name": "bee-table",
"version": "1.6.44",
"version": "2.0.0",
"description": "Table ui component for react",
"keywords": [
"react",