|
|
@@ -214,7 +214,35 @@ this.props.tree.onDragOver(this);
|
|
|
e.stopPropagation();
|
|
|
console.log('drop on ', this.props.item.title);
|
|
|
|
|
|
+ // 4 cas:
|
|
|
+ // a. move dans même parent (drop sur sibling)
|
|
|
+ // b. move dans même parent MAIS à index 0 (drop sur le parent)
|
|
|
+ // c. move vers parent différent (drop sur futur sibling)
|
|
|
+ // d. move vers parent différent (drop sur parent différent)
|
|
|
+ const draggedItemLevel = this.props.tree.state.draggedItem.props.level;
|
|
|
+ const targetLevel = this.props.level;
|
|
|
+ if(targetLevel === draggedItemLevel) {
|
|
|
+ console.log(this.props.tree.state.draggedItem.props.parent, this.props.parent)
|
|
|
+ if(this.props.tree.state.draggedItem.props.parent === this.props.parent) {
|
|
|
+ console.log('drop on sibling');
|
|
|
+ }
|
|
|
+ else {
|
|
|
+ console.log('drop on other')
|
|
|
+ }
|
|
|
+ }
|
|
|
+ else if(targetLevel === draggedItemLevel - 1) {
|
|
|
+ console.log('drop on a parent', this, this.props.item.title);
|
|
|
+ if(this.props.tree.state.draggedItem.props.parent === this) {
|
|
|
+ console.log('dropped on same parent');
|
|
|
+ }
|
|
|
+ else {
|
|
|
+ console.log('dropped on other parent')
|
|
|
+ }
|
|
|
+ }
|
|
|
|
|
|
+ this.setState({
|
|
|
+ dragOver: false
|
|
|
+ });
|
|
|
}
|
|
|
|
|
|
onDragOver(e) {
|
|
|
@@ -247,7 +275,7 @@ this.props.tree.onDragOver(this);
|
|
|
<h5><i id={ this.hid } className="material-icons drag-handle">drag_handle</i><span>{ title }</span></h5>
|
|
|
{(this.state.dragOver && this.state.boxPositionAbove) ? <div style={dragPlaceholderStyles}></div> : ''}
|
|
|
{(items || []).map((item, i) =>
|
|
|
- <TreeNode tree={tree} item={item} index={i} key={item.title} path={ path + '.' + i} level={level + 1} />
|
|
|
+ <TreeNode parent={this} tree={tree} item={item} index={i} key={item.title} path={ path + '.' + i} level={level + 1} />
|
|
|
)}
|
|
|
{(this.state.dragOver && ! this.state.boxPositionAbove) ? <div style={dragPlaceholderStyles}></div> : ''}
|
|
|
</div>
|