feat:新增onPaste粘贴回调

This commit is contained in:
liushaozhen 2020-07-09 10:42:37 +08:00
parent 7bbf5e3f6b
commit b9fff29c57
6 changed files with 38815 additions and 31605 deletions

70389
dist/demo.js vendored

File diff suppressed because one or more lines are too long

2
dist/demo.js.map vendored

File diff suppressed because one or more lines are too long

View File

@ -84,6 +84,7 @@ import 'bee-table/build/Table.css';
| [v2.2.2新增]showRowNum | 展示序号功能false时不展示true时展示默认情况可传入自定义配置信息 | bool / obj:{name: '序号', key: '_index', // 在数据中存储的key值width: 50,base: 0,// 排序的基准值,为数字或者字母type:'number', // 排序类型,默认为number类型,支持单字母排序(type='ascii')} | false | | [v2.2.2新增]showRowNum | 展示序号功能false时不展示true时展示默认情况可传入自定义配置信息 | bool / obj:{name: '序号', key: '_index', // 在数据中存储的key值width: 50,base: 0,// 排序的基准值,为数字或者字母type:'number', // 排序类型,默认为number类型,支持单字母排序(type='ascii')} | false |
| [v2.2.8新增]autoCheckedByClickRows | 设置为 false 时,表格行点击事件,不会自动勾选复选框 | bool | true | | [v2.2.8新增]autoCheckedByClickRows | 设置为 false 时,表格行点击事件,不会自动勾选复选框 | bool | true |
| [v2.2.8新增]autoSelect | 树型表格勾选时,是否开启子节点的联动 | bool | false | | [v2.2.8新增]autoSelect | 树型表格勾选时,是否开启子节点的联动 | bool | false |
| onPaste | 粘贴的回调函数 | func(event,positon) | - |
> 快捷键部分参考示例 (快捷键在table中的简单使用应用) > 快捷键部分参考示例 (快捷键在table中的简单使用应用)

View File

@ -65,6 +65,7 @@ const propTypes = {
bodyDisplayInRow: PropTypes.bool, // 表格内容超出列宽度时进行换行 or 以...形式展现 bodyDisplayInRow: PropTypes.bool, // 表格内容超出列宽度时进行换行 or 以...形式展现
headerDisplayInRow: PropTypes.bool, // 表头内容超出列宽度时进行换行 or 以...形式展现 headerDisplayInRow: PropTypes.bool, // 表头内容超出列宽度时进行换行 or 以...形式展现
showRowNum: PropTypes.oneOfType([PropTypes.bool, 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 || '序号'}
onPaste:PropTypes.func,
}; };
const defaultProps = { const defaultProps = {
@ -108,6 +109,7 @@ const defaultProps = {
bodyDisplayInRow: true, bodyDisplayInRow: true,
headerDisplayInRow: true, headerDisplayInRow: true,
showRowNum: false, showRowNum: false,
onPaste:()=>{}
}; };
const expandIconCellWidth = Number(43); const expandIconCellWidth = Number(43);
@ -567,7 +569,7 @@ class Table extends Component {
} }
getExpandedRow(key, content, visible, className, fixed) { getExpandedRow(key, content, visible, className, fixed) {
const { clsPrefix, expandIconAsCell } = this.props; const { clsPrefix, expandIconAsCell,onPaste } = this.props;
let colCount; let colCount;
if (fixed === 'left') { if (fixed === 'left') {
colCount = this.columnManager.leftLeafColumns().length; colCount = this.columnManager.leftLeafColumns().length;
@ -605,6 +607,7 @@ class Table extends Component {
} }
return ( return (
<TableRow <TableRow
onPaste={onPaste}
columns={columns} columns={columns}
visible={visible} visible={visible}
className={className} className={className}
@ -699,6 +702,7 @@ class Table extends Component {
const childrenColumnName = props.childrenColumnName; const childrenColumnName = props.childrenColumnName;
const expandedRowRender = props.expandedRowRender; const expandedRowRender = props.expandedRowRender;
const expandRowByClick = props.expandRowByClick; const expandRowByClick = props.expandRowByClick;
const onPaste = props.onPaste;
const { fixedColumnsBodyRowsHeight } = this.state; const { fixedColumnsBodyRowsHeight } = this.state;
let rst = []; let rst = [];
let height; let height;
@ -713,7 +717,7 @@ class Table extends Component {
const expandIconColumnIndex = props.expandIconColumnIndex const expandIconColumnIndex = props.expandIconColumnIndex
if(props.lazyLoad && props.lazyLoad.preHeight && indent == 0){ if(props.lazyLoad && props.lazyLoad.preHeight && indent == 0){
rst.push( rst.push(
<TableRow height={props.lazyLoad.preHeight} columns={[]} className='' key={'table_row_first'} store={this.store} visible = {true}/> <TableRow onPaste={onPaste} height={props.lazyLoad.preHeight} columns={[]} className='' key={'table_row_first'} store={this.store} visible = {true}/>
) )
} }
const lazyCurrentIndex = props.lazyLoad && props.lazyLoad.startIndex ?props.lazyLoad.startIndex :0; const lazyCurrentIndex = props.lazyLoad && props.lazyLoad.startIndex ?props.lazyLoad.startIndex :0;
@ -785,6 +789,7 @@ class Table extends Component {
} }
rst.push( rst.push(
<TableRow <TableRow
onPaste={onPaste}
indent={indent} indent={indent}
indentSize={props.indentSize} indentSize={props.indentSize}
needIndentSpaced={needIndentSpaced} needIndentSpaced={needIndentSpaced}
@ -853,7 +858,7 @@ class Table extends Component {
if(props.lazyLoad && props.lazyLoad.sufHeight && indent == 0){ if(props.lazyLoad && props.lazyLoad.sufHeight && indent == 0){
rst.push( rst.push(
<TableRow height={props.lazyLoad.sufHeight} key={'table_row_end'} columns={[]} className='' store={this.store} visible = {true}/> <TableRow onPaste={onPaste} height={props.lazyLoad.sufHeight} key={'table_row_end'} columns={[]} className='' store={this.store} visible = {true}/>
) )
} }
if (!this.isTreeType) { if (!this.isTreeType) {

View File

@ -14,7 +14,8 @@ const propTypes = {
indent: PropTypes.number, indent: PropTypes.number,
indentSize: PropTypes.number, indentSize: PropTypes.number,
column: PropTypes.object, column: PropTypes.object,
expandIcon: PropTypes.node expandIcon: PropTypes.node,
onPaste:PropTypes.func
}; };
class TableCell extends Component{ class TableCell extends Component{
@ -173,6 +174,16 @@ class TableCell extends Component{
showDropdowm: false, showDropdowm: false,
}) })
} }
onPaste=(e)=>{
let { index:row,onPaste,fixed } = this.props
let col = e.target.cellIndex;
let position = {
row,
col,
fixed:!!fixed
}
onPaste(e,position)
}
render() { render() {
const { record, indentSize, clsPrefix, indent, const { record, indentSize, clsPrefix, indent,
@ -289,6 +300,7 @@ class TableCell extends Component{
className={className} className={className}
onClick={this.handleClick} onClick={this.handleClick}
title={title} title={title}
onPaste={this.onPaste}
style={{maxWidth:column.width, color:fontColor, backgroundColor:bgColor, ...column.style}}> style={{maxWidth:column.width, color:fontColor, backgroundColor:bgColor, ...column.style}}>
{indentText} {indentText}
{expandIcon} {expandIcon}

View File

@ -451,7 +451,7 @@ class TableRow extends Component{
render() { render() {
const { const {
clsPrefix, columns, record, height, visible, index, clsPrefix, columns, record, height, visible, index,onPaste,
expandIconColumnIndex, expandIconAsCell, expanded, expandRowByClick,rowDraggAble, expandIconColumnIndex, expandIconAsCell, expanded, expandRowByClick,rowDraggAble,
expandable, onExpand, needIndentSpaced, indent, indentSize,isHiddenExpandIcon,fixed,bodyDisplayInRow expandable, onExpand, needIndentSpaced, indent, indentSize,isHiddenExpandIcon,fixed,bodyDisplayInRow
,expandedIcon,collapsedIcon, hoverKey,lazyStartIndex,lazyEndIndex, expandIconCellWidth ,expandedIcon,collapsedIcon, hoverKey,lazyStartIndex,lazyEndIndex, expandIconCellWidth
@ -517,6 +517,7 @@ class TableRow extends Component{
bodyDisplayInRow = {bodyDisplayInRow} bodyDisplayInRow = {bodyDisplayInRow}
lazyStartIndex={lazyStartIndex} lazyStartIndex={lazyStartIndex}
lazyEndIndex={lazyEndIndex} lazyEndIndex={lazyEndIndex}
onPaste={onPaste}
/> />
); );
} }