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

树表、行拖拽组合场景，图标重叠问题

This commit is contained in:
yangchch6 2019-08-29 20:43:47 +08:00
parent b6c43b0414
commit 8991080cde
13 changed files with 9305 additions and 9955 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

28
build/ColumnManager.js
View File

@ -341,12 +341,32 @@ var _initialiseProps = function _initialiseProps() {
if (!showRowNum) {
return columns;
}
var key = showRowNum.key,
fixed = showRowNum.fixed,
width = showRowNum.width,
name = showRowNum.name,
type = showRowNum.type,
base = showRowNum.base;
var order = {
dataIndex: showRowNum.key || '_index',
dataIndex: key || '_index',
key: '_index',
fixed: showRowNum.fixed || 'left',
width: showRowNum.width || 50,
title: showRowNum.name || '序号'
fixed: fixed || 'left',
width: width || 50,
title: name || '序号',
render: function render(text, record, index) {
switch (type) {
case 'ascii':
{
return String.fromCharCode((base || 'a').charCodeAt() + index);
}
case 'number':
default:
{
return (base || 0) + index;
}
}
}
};
if (columns.length > 0 && columns[0].dataIndex !== 'checkbox' && columns[0].dataIndex !== 'radio') {
// 多选表格/单选表格时放在第二列,其他情况放到第一列

7
build/Table.css
View File

@ -246,6 +246,9 @@
.u-table td.drag-handle-column .uf {
font-size: 12px;
line-height: 12px; }
.u-table th.drag-handle-column.u-table-row-has-expandIcon .uf,
.u-table td.drag-handle-column.u-table-row-has-expandIcon .uf {
padding: 0; }
.u-table th.text-center,
.u-table td.text-center {
text-align: center; }
@ -438,8 +441,8 @@
-moz-user-select: -moz-none;
-khtml-user-select: none;
-webkit-user-select: none;
/*
Introduced in IE 10.
/*
Introduced in IE 10.
*/
-ms-user-select: none;
user-select: none; }

38
build/Table.js
View File

@ -118,7 +118,7 @@ var propTypes = {
onBodyScroll: _propTypes2["default"].func,
bodyDisplayInRow: _propTypes2["default"].bool, // 表格内容超出列宽度时进行换行 or 以...形式展现
headerDisplayInRow: _propTypes2["default"].bool, // 表头内容超出列宽度时进行换行 or 以...形式展现
showRowNum: _propTypes2["default"].object // 表格是否自动生成序号,格式为{base:number || 0,defaultKey:string || '_index',defaultName:string || '序号'}
showRowNum: _propTypes2["default"].oneOfType([_propTypes2["default"].bool, _propTypes2["default"].object]) // 表格是否自动生成序号,格式为{base:number || 0,defaultKey:string || '_index',defaultName:string || '序号'}
};
var defaultProps = {
@ -848,25 +848,23 @@ var Table = function (_Component) {
var lazyEndIndex = props.lazyLoad && props.lazyLoad.endIndex ? props.lazyLoad.endIndex : -1;
for (var i = 0; i < data.length; i++) {
var isHiddenExpandIcon = void 0;
if (props.showRowNum) {
switch (props.showRowNum.type) {
case 'number':
{
data[i][props.showRowNum.key || '_index'] = (props.showRowNum.base || 0) + i;
break;
}
case 'ascii':
{
data[i][props.showRowNum.key || '_index'] = String.fromCharCode(i + (props.showRowNum.base || '0').charCodeAt());
break;
}
default:
{
data[i][props.showRowNum.key || '_index'] = (props.showRowNum.base || 0) + i;
break;
}
}
}
// if ( props.showRowNum ){
// switch(props.showRowNum.type){
// case 'number':{
// data[i][props.showRowNum.key || '_index'] = (props.showRowNum.base || 0) + i;
// break;
// }
// case 'ascii': {
// data[i][props.showRowNum.key || '_index'] = String.fromCharCode(i + (props.showRowNum.base || '0').charCodeAt());
// break;
// }
// default: {
// data[i][props.showRowNum.key || '_index'] = (props.showRowNum.base || 0) + i;
// break;
// }
// }
// }
var record = data[i];
var key = this.getRowKey(record, i);
var childrenColumn = record[childrenColumnName];

208
build/lib/dragColumn.js
View File

@ -1,7 +1,7 @@
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
value: true
});
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; };
@ -35,115 +35,115 @@ function _inherits(subClass, superClass) { if (typeof superClass !== "function"
function dragColumn(Table) {
return function (_Component) {
_inherits(DragColumn, _Component);
return function (_Component) {
_inherits(DragColumn, _Component);
function DragColumn(props) {
_classCallCheck(this, DragColumn);
function DragColumn(props) {
_classCallCheck(this, DragColumn);
var _this = _possibleConstructorReturn(this, _Component.call(this, props));
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.onDragEnd = 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;
});
// 向前移动
if (targetIndex < sourceIndex) {
targetIndex = targetIndex + 1;
}
columns.splice(targetIndex, 0, columns.splice(sourceIndex, 1)[0]);
var _newColumns = [];
columns.forEach(function (da, i) {
var newDate = _extends(da, {});
newDate.title = da.title;
_newColumns.push(newDate);
});
_this.setState({
columns: _newColumns //cloneDeep(columns)
});
if (_this.props.onDragEnd) {
_this.props.onDragEnd(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.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;
_this.setColumOrderByIndex = function (_column) {
_column.forEach(function (da, i) {
da.dragIndex = i;
da.drgHover = false;
});
return _column;
};
DragColumn.prototype.render = function render() {
var _props = this.props,
data = _props.data,
dragborder = _props.dragborder,
draggable = _props.draggable,
className = _props.className,
others = _objectWithoutProperties(_props, ['data', 'dragborder', 'draggable', 'className']);
_this.onDragEnd = function (event, data) {
var dragSource = data.dragSource,
dragTarg = data.dragTarg;
var columns = _this.state.columns;
return _react2["default"].createElement(Table, _extends({}, others, {
columns: this.state.columns,
data: data,
className: className + ' u-table-drag-border',
onDragEnd: this.onDragEnd,
draggable: draggable,
dragborder: dragborder
}));
};
var sourceIndex = -1,
targetIndex = -1;
return DragColumn;
}(_react.Component);
sourceIndex = columns.findIndex(function (da, i) {
return da.key == dragSource.key;
});
targetIndex = columns.findIndex(function (da, i) {
return da.key == dragTarg.key;
});
// 向前移动
if (targetIndex < sourceIndex) {
targetIndex = targetIndex + 1;
}
columns.splice(targetIndex, 0, columns.splice(sourceIndex, 1)[0]);
var _newColumns = [];
columns.forEach(function (da, i) {
var newDate = _extends(da, {});
newDate.title = da.title;
_newColumns.push(newDate);
});
_this.setState({
columns: _newColumns //cloneDeep(columns)
});
if (_this.props.onDragEnd) {
_this.props.onDragEnd(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.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,
others = _objectWithoutProperties(_props, ['data', 'dragborder', 'draggable', 'className']);
return _react2["default"].createElement(Table, _extends({}, others, {
columns: this.state.columns,
data: data,
className: className + ' u-table-drag-border',
onDragEnd: this.onDragEnd,
draggable: draggable,
dragborder: dragborder
}));
};
return DragColumn;
}(_react.Component);
}
module.exports = exports['default'];

27
build/lib/sort.js
View File

@ -130,6 +130,9 @@ function sort(Table, Icon) {
// 数值比较函数
// 中文比较函数，按拼音排序
SortTable.prototype._flatToColumn = function _flatToColumn(flatColumns) {
var colLen = flatColumns.length;
var parentIndex = void 0,
@ -345,7 +348,23 @@ function sort(Table, Icon) {
if (column.sorter || column.sortEnable) {
//大于0说明不是升序就是降序，判断orderNum有没有值，没有值赋值
if (column.sortEnable && !column.sorter) {
column.sorter = column.fieldType === 'number' ? _this3.numberSortFn(column.dataIndex) : _this3.defaultSortFn(column.dataIndex);
switch (column.fieldType) {
case 'number':
{
column.sorter = _this3.numberSortFn(column.dataIndex);
break;
}
case 'stringChinese':
{
column.sorter = _this3.chineseSortFn(column.dataIndex);
break;
}
default:
{
column.sorter = _this3.defaultSortFn(column.dataIndex);
break;
}
}
}
if (iconTypeIndex > 0 && !column.orderNum && mode == "multiple") {
column.orderNum = _this3.getOrderNum();
@ -393,6 +412,12 @@ function sort(Table, Icon) {
return numberA >= numberB ? 1 : -1;
};
};
this.chineseSortFn = function (key) {
return function (a, b) {
return a[key].localeCompare(b[key], 'zh-Hans-CN', { sensitivity: 'accent' });
};
};
}, _temp;
}
module.exports = exports['default'];

80
build/lib/util.js
View File

@ -1,7 +1,7 @@
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
value: true
});
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
@ -20,29 +20,29 @@ exports.ObjectAssign = ObjectAssign;
*/
function sortBy(arr, prop, desc) {
var props = [],
ret = [],
i = 0,
len = arr.length;
if (typeof prop == 'string') {
for (; i < len; i++) {
var oI = arr[i];
(props[i] = new String(oI && oI[prop] || ''))._obj = oI;
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 '参数类型错误';
}
} else if (typeof prop == 'function') {
for (; i < len; i++) {
var _oI = arr[i];
(props[i] = new String(_oI && prop(_oI) || ''))._obj = _oI;
props.sort();
for (i = 0; i < len; i++) {
ret[i] = props[i]._obj;
}
} else {
throw '参数类型错误';
}
props.sort();
for (i = 0; i < len; i++) {
ret[i] = props[i]._obj;
}
if (desc) ret.reverse();
return ret;
if (desc) ret.reverse();
return ret;
};
/**
@ -51,11 +51,11 @@ function sortBy(arr, prop, desc) {
* @param {} property
*/
function compare(property) {
return function (a, b) {
var value1 = a[property];
var value2 = b[property];
return value1 - value2;
};
return function (a, b) {
var value1 = a[property];
var value2 = b[property];
return value1 - value2;
};
}
/**
@ -63,17 +63,17 @@ function compare(property) {
* @param {*} obj 要拷贝的对象
*/
function ObjectAssign(obj) {
var b = obj instanceof Array;
var tagObj = b ? [] : {};
if (b) {
//数组
obj.forEach(function (da) {
var _da = {};
_extends(_da, da);
tagObj.push(_da);
});
} else {
_extends(tagObj, obj);
}
return tagObj;
var b = obj instanceof Array;
var tagObj = b ? [] : {};
if (b) {
//数组
obj.forEach(function (da) {
var _da = {};
_extends(_da, da);
tagObj.push(_da);
});
} else {
_extends(tagObj, obj);
}
return tagObj;
}

2
demo/index.js
View File

File diff suppressed because one or more lines are too long

7
dist/demo.css vendored
View File

@ -233,6 +233,9 @@
.u-table td.drag-handle-column .uf {
font-size: 12px;
line-height: 12px; }
.u-table th.drag-handle-column.u-table-row-has-expandIcon .uf,
.u-table td.drag-handle-column.u-table-row-has-expandIcon .uf {
padding: 0; }
.u-table th.text-center,
.u-table td.text-center {
text-align: center; }
@ -430,8 +433,8 @@
background-clip: padding-box;
-moz-user-select: -moz-none;
-webkit-user-select: none;
/*
Introduced in IE 10.
/*
Introduced in IE 10.
*/
-ms-user-select: none;
user-select: none; }

2
dist/demo.css.map vendored
View File

File diff suppressed because one or more lines are too long

18854
dist/demo.js vendored
View File

File diff suppressed because one or more lines are too long

2
dist/demo.js.map vendored
View File

File diff suppressed because one or more lines are too long

2
src/Table.js
View File

@ -62,7 +62,7 @@ const propTypes = {
onBodyScroll: PropTypes.func,
bodyDisplayInRow: PropTypes.bool, // 表格内容超出列宽度时进行换行 or 以...形式展现
headerDisplayInRow: PropTypes.bool, // 表头内容超出列宽度时进行换行 or 以...形式展现
showRowNum: PropTypes.object, // 表格是否自动生成序号,格式为{base:number || 0,defaultKey:string || '_index',defaultName:string || '序号'}
showRowNum: PropTypes.oneOfType([PropTypes.bool, PropTypes.object]), // 表格是否自动生成序号,格式为{base:number || 0,defaultKey:string || '_index',defaultName:string || '序号'}
};
const defaultProps = {

3
src/Table.scss
View File

@ -142,6 +142,9 @@ $icon-color:#505F79;
font-size: 12px;
line-height: 12px;
}
&.u-table-row-has-expandIcon .uf {
padding: 0;
}
}
&.text-center{
text-align: center;