torsten/yourpart3
1
0
Fork 0
Code Issues 1 Pull Requests Actions Packages Projects Releases Wiki Activity

Refine drag-and-drop behavior in LoggedInView: Update drop event handling to prevent event propagation and improve widget insertion logic. Adjust drop target determination to enhance user experience during widget rearrangement.

Browse Source
This commit is contained in:
Torsten Schulz (local)
2026-01-30 12:03:12 +01:00
parent 0f78c624b1
commit d5c089e07e
1 changed files with 5 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
frontend/src/views/home/LoggedInView.vue
View File

@@ -68,7 +68,7 @@
v-if="dragOverIndex === index && draggedIndex !== null && draggedIndex !== index" v-if="dragOverIndex === index && draggedIndex !== null && draggedIndex !== index"
class="dashboard-grid-cell dashboard-drop-indicator" class="dashboard-grid-cell dashboard-drop-indicator"
@dragover.prevent="setDropTarget(index)" @dragover.prevent="setDropTarget(index)"
@drop.prevent="onDrop(index)" @drop.prevent.stop="onDrop(index)"
> >
<div class="drop-indicator-line"></div> <div class="drop-indicator-line"></div>
</div> </div>
@@ -115,7 +115,7 @@
v-if="dragOverIndex === widgets.length && draggedIndex !== null" v-if="dragOverIndex === widgets.length && draggedIndex !== null"
class="dashboard-grid-cell dashboard-drop-indicator" class="dashboard-grid-cell dashboard-drop-indicator"
@dragover.prevent="onGridDragover" @dragover.prevent="onGridDragover"
@drop.prevent="onGridDrop" @drop.prevent.stop="onGridDrop"
> >
<div class="drop-indicator-line"></div> <div class="drop-indicator-line"></div>
</div> </div>
@@ -277,8 +277,9 @@ export default {
async onGridDrop() { async onGridDrop() {
if (this.draggedIndex == null) return; if (this.draggedIndex == null) return;
const from = this.draggedIndex; const from = this.draggedIndex;
const to = this.widgets.length; // Wenn Drop auf Grid landet: zuletzt angezeigte Einfügeposition nutzen (sonst ans Ende)
if (from === to || from === to - 1) { const to = this.dragOverIndex != null ? this.dragOverIndex : this.widgets.length;
if (from === to || to < 0 || to > this.widgets.length) {
this.draggedIndex = null; this.draggedIndex = null;
this.dragOverIndex = null; this.dragOverIndex = null;
return; return;