table theader 交换列重构

This commit is contained in:
“jonyshi” 2018-12-01 13:45:28 +08:00
parent 568e5fa96b
commit 580ff2415d
1 changed files with 50 additions and 28 deletions

View File

@ -33,43 +33,65 @@ export default function dragColumn(Table) {
} }
onDragStart=(event,data)=>{ // onDragStart=(event,data)=>{
if(this.props.onDragStart){ // if(this.props.onDragStart){
this.props.onDragStart(event,data) // this.props.onDragStart(event,data)
} // }
} // }
onDragOver=(event,data)=>{ // onDragOver=(event,data)=>{
if(this.props.onDragOver){ // if(this.props.onDragOver){
this.props.onDragOver(event,data) // this.props.onDragOver(event,data)
} // }
} // }
onDragEnter=(event,data)=>{ // onDragEnter=(event,data)=>{
if(data.key == "checkbox")return; // console.log('--------onDragEnter------------',data);
const {columns:_columns} = this.state;
let columns = []; // if(data.key == "checkbox")return;
Object.assign(columns,_columns); // const {columns:_columns} = this.state;
columns.forEach((da)=>da.drgHover = false) // let columns = [];
let current = columns.find((da)=>da.key == data.key); // Object.assign(columns,_columns);
if(current.fixed)return; // columns.forEach((da)=>da.drgHover = false)
current.drgHover = true; // let current = columns.find((da)=>da.key == data.key);
this.setState({ // if(current.fixed)return;
columns // current.drgHover = true;
}); // this.setState({
if(this.props.onDragEnter){ // columns
this.props.onDragEnter(event,data); // });
} // if(this.props.onDragEnter){
} // this.props.onDragEnter(event,data);
// }
// }
onDrop=(event,data)=>{ onDrop=(event,data)=>{
let {dragSource,dragTarg} = data;
let {columns} = this.state;
let dragSourceColum = columns.find((da,i)=>da.key == dragSource.key);
let dragTargColum = columns.find((da,i)=>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;
}
}
this.setState({
columns:JSON.parse(JSON.stringify(columns))
});
}
onDrop_bak=(event,data)=>{
if(data.key == "checkbox")return; if(data.key == "checkbox")return;
let {columns} = this.state; let {columns} = this.state;
const id = event.dataTransfer.getData("Text"); const id = event.dataTransfer.getData("Text");
let objIndex = columns.findIndex((_da,i)=>_da.key == id); let objIndex = columns.findIndex((_da,i)=>_da.key == id);
let targetIndex = columns.findIndex((_da,i)=>_da.key == data.key); let targetIndex = columns.findIndex((_da,i)=>_da.key == data.key);
if(columns[objIndex].fixed)return;//固定列不让拖拽 // if(columns[objIndex].fixed)return;//固定列不让拖拽
if(columns[targetIndex].fixed)return;//固定列不让拖拽 // if(columns[targetIndex].fixed)return;//固定列不让拖拽
columns.forEach((da,i)=>{ columns.forEach((da,i)=>{
da.drgHover = false; da.drgHover = false;
if(da.key == id){//obj if(da.key == id){//obj