diff --git a/frontend/src/components/DashboardWidget.vue b/frontend/src/components/DashboardWidget.vue
index 66e2129..11dcb36 100644
--- a/frontend/src/components/DashboardWidget.vue
+++ b/frontend/src/components/DashboardWidget.vue
@@ -127,11 +127,7 @@ export default {
const numAge = Number(ageValue);
// Backend gibt Tage zurück (calcAge verwendet differenceInDays)
// Wenn < 365 Tage: Tage anzeigen, sonst Jahre
- if (numAge < 365) {
- return `${numAge} ${this.$t('falukant.overview.metadata.days')}`;
- } else {
- return `${numAge} ${this.$t('falukant.overview.metadata.years')}`;
- }
+ return `${numAge} ${this.$t('falukant.overview.metadata.years')}`;
},
dataList() {
if (!Array.isArray(this.data) || this.data.length === 0) return [];
diff --git a/frontend/src/views/home/LoggedInView.vue b/frontend/src/views/home/LoggedInView.vue
index aec6088..aa2da1d 100644
--- a/frontend/src/views/home/LoggedInView.vue
+++ b/frontend/src/views/home/LoggedInView.vue
@@ -58,29 +58,30 @@
-
+
setDropTarget(index)"
@dragleave="clearDropTarget"
- @drop="onDrop(index, $event)"
>
-
+
setDropTarget(widgets.length)"
- @drop.prevent.stop="onGridDrop"
>
@@ -275,40 +276,40 @@ export default {
this.dragOverIndex = this.widgets.length;
}
},
- async onGridDrop(e) {
- console.log('[Dashboard Drag] onGridDrop — target:', e?.target?.className, 'dragOverIndex:', this.dragOverIndex, 'draggedIndex:', this.draggedIndex);
- if (this.draggedIndex == null) return;
+ /** Ein zentraler Drop-Handler: Ziel-Index wird aus der Mausposition ermittelt (nicht aus Event-Target). */
+ async onAnyDrop(e) {
+ if (this.draggedIndex == null) {
+ this.dragOverIndex = null;
+ return;
+ }
+ const gridEl = this.$refs.dashboardGridRef;
+ const x = e.clientX;
+ const y = e.clientY;
+ let to = null;
+ if (gridEl) {
+ let el = document.elementFromPoint(x, y);
+ while (el && el !== document.body) {
+ if (el === gridEl) break;
+ const idx = el.getAttribute?.('data-drop-index');
+ if (idx != null && idx !== '') {
+ to = parseInt(idx, 10);
+ if (!Number.isNaN(to)) break;
+ }
+ el = el.parentElement;
+ }
+ }
+ if (to == null) to = this.dragOverIndex != null ? this.dragOverIndex : this.widgets.length;
const from = this.draggedIndex;
- const to = this.dragOverIndex != null ? this.dragOverIndex : this.widgets.length;
- console.log('[Dashboard Drag] onGridDrop → from:', from, 'to:', to, 'widgets.length:', this.widgets.length);
+ console.log('[Dashboard Drag] onAnyDrop — Maus:', x, y, '→ to:', to, 'from:', from, 'event.target:', e?.target?.className);
if (from === to || to < 0 || to > this.widgets.length) {
- console.log('[Dashboard Drag] onGridDrop — abgebrochen (ungültig)');
+ console.log('[Dashboard Drag] onAnyDrop — abgebrochen');
this.draggedIndex = null;
this.dragOverIndex = null;
return;
}
const item = this.widgets.splice(from, 1)[0];
this.widgets.splice(to, 0, item);
- console.log('[Dashboard Drag] onGridDrop — erledigt. Neue Reihenfolge (titles):', this.widgets.map(w => w.title));
- this.draggedIndex = null;
- this.dragOverIndex = null;
- await this.saveConfig();
- },
- async onDrop(toIndex, e) {
- console.log('[Dashboard Drag] onDrop — target:', e?.target?.className, 'toIndex:', toIndex, 'draggedIndex:', this.draggedIndex);
- if (this.draggedIndex == null) return;
- const from = this.draggedIndex;
- const to = toIndex;
- console.log('[Dashboard Drag] onDrop → from:', from, 'to:', to);
- if (from === to) {
- console.log('[Dashboard Drag] onDrop — abgebrochen (from === to)');
- this.draggedIndex = null;
- this.dragOverIndex = null;
- return;
- }
- const item = this.widgets.splice(from, 1)[0];
- this.widgets.splice(to, 0, item);
- console.log('[Dashboard Drag] onDrop — erledigt. Neue Reihenfolge (titles):', this.widgets.map(w => w.title));
+ console.log('[Dashboard Drag] onAnyDrop — erledigt. Neue Reihenfolge:', this.widgets.map(w => w.title));
this.draggedIndex = null;
this.dragOverIndex = null;
await this.saveConfig();