css fixes
gitea/salix/1757-drag_and_drop_department This commit looks good Details

This commit is contained in:
Joan Sanchez 2019-10-16 09:52:46 +02:00
parent dadfc92ebd
commit 6d159c50a0
4 changed files with 27 additions and 36 deletions

View File

@ -47,25 +47,25 @@ export default class Treeview extends Component {
}
dragOver(event) {
let scrollY = this.$window.scrollY;
if (event.clientY < this.draggingY)
scrollY -= 2;
else scrollY += 2;
this.draggingY = event.clientY;
this.$window.scrollTo(0, scrollY);
this.dragClientY = event.clientY;
// Prevents page reload
event.preventDefault();
}
onDragInterval() {
if (this.dragClientY > 0 && this.dragClientY < 75)
this.$window.scrollTo(0, this.$window.scrollY - 25);
}
dragStart(event) {
event.target.classList.add('dragging');
event.dataTransfer.setData('text', event.target.id);
const element = this.findDroppable(event);
this.dragging = element;
this.interval = setInterval(() => this.onDragInterval(), 100);
}
dragEnd(event) {
@ -73,6 +73,7 @@ export default class Treeview extends Component {
this.undrop();
this.dropCount = 0;
this.dragging = null;
clearInterval(this.interval);
}
dragEnter(event) {
@ -102,12 +103,7 @@ export default class Treeview extends Component {
const $dropped = this.dropping.$ctrl.item;
const $dragged = this.dragging.$ctrl.item;
if (!$dropped.active && $dropped.sons) {
this.unfold($dropped).then(() => {
this.emit('drop', {$dropped, $dragged});
});
} else
this.emit('drop', {$dropped, $dragged});
this.emit('drop', {$dropped, $dragged});
}
get data() {
@ -195,14 +191,8 @@ export default class Treeview extends Component {
}
onCreate(parent) {
if (this.createFunc) {
if (!parent.active && parent.sons) {
this.unfold(parent).then(() => {
this.createFunc({$parent: parent});
});
} else
this.createFunc({$parent: parent});
}
if (this.createFunc)
this.createFunc({$parent: parent});
}
create(item) {
@ -210,7 +200,10 @@ export default class Treeview extends Component {
let childs = parent.childs;
if (!childs) childs = [];
childs.push(item);
if (!parent.active)
this.unfold(parent);
else
childs.push(item);
if (this.sortFunc) {
childs = childs.sort((a, b) =>
@ -234,7 +227,13 @@ export default class Treeview extends Component {
}
item.parent = newParent;
this.create(item);
if (!newParent.active) {
this.unfold(newParent).then(() => {
item.parent.sons++;
});
} else
this.create(item);
}
}

View File

@ -36,6 +36,7 @@ vn-treeview-childs {
}
vn-treeview-child {
font-size: 16px;
display: block;
.node {

View File

@ -1,14 +1,14 @@
@import "variables";
vn-treeview-content {
& > vn-check:not(.indeterminate) {
vn-treeview-child {
.content > vn-check:not(.indeterminate) {
color: $color-main;
& > .btn {
border-color: $color-main;
}
}
& > vn-check.checked {
.content > vn-check.checked {
color: $color-main;
}
}

View File

@ -24,14 +24,6 @@ class Controller {
}
onDrop(dropped, dragged) {
if (!dropped.active) {
this.$.treeview.unfold(dropped).then(() =>
this.move(dropped, dragged));
} else
this.move(dropped, dragged);
}
move(dropped, dragged) {
const params = dropped ? {parentId: dropped.id} : null;
const query = `/api/departments/${dragged.id}/moveChild`;
this.$http.post(query, params).then(() => {
@ -66,7 +58,6 @@ class Controller {
const query = `/api/departments/createChild`;
this.$http.post(query, params).then(res => {
const parent = this.newChild.parent;
const item = res.data;
item.parent = parent;