import React from 'react';
import CheckList from '../CheckList';
import { RenderItem } from './renderItem';
import './index.less';

class DragList extends React.Component {
  onItemDrag = (event, index) => {
    event.dataTransfer.setData('dragIndex', index);
  };
  onItemDrop = (event, index) => {
    const drapIndex = event.dataTransfer.getData('dragIndex');
    this.props.dragOver && this.props.dragOver({ dragIndex: +drapIndex, dropIndex: index });
  };
  render() {
    return <CheckList {...this.props} CustomRender={<RenderItem onItemDrag={this.onItemDrag} onItemDrop={this.onItemDrop} />} />;
  }
}

export default DragList;
