Fixes drag and drop to header issues
Addresses two key issues related to dragging events to the header: the premature removal of the original event element and the creation of duplicate all-day events. The original event is no longer removed when dragging to the header; it is now only removed upon a successful drop. Also, it prevents the creation of duplicate all-day events by checking for existing all-day events before creating new ones, using DOM queries to ensure accurate state.
This commit is contained in:
parent
b4af5a9211
commit
46b8bf9fb5
10 changed files with 684 additions and 61 deletions
114
docs/drag-drop-header-bug-analysis-corrected.md
Normal file
114
docs/drag-drop-header-bug-analysis-corrected.md
Normal file
|
|
@ -0,0 +1,114 @@
|
|||
# Korrigeret Analyse: Day Event Drag til Header og Tilbage
|
||||
|
||||
## Korrekt Flow Design
|
||||
|
||||
### Elementer i Spil
|
||||
1. **Original Event**: Skal forblive i DOM uændret indtil drag:end
|
||||
2. **Clone Event**: Det visuelle element der dragges rundt
|
||||
3. **All-Day Event**: Midlertidig repræsentation i header
|
||||
|
||||
## Nuværende Problem
|
||||
|
||||
### AllDayManager.handleConvertToAllDay() (linje 274)
|
||||
```typescript
|
||||
// PROBLEM: Fjerner original for tidligt!
|
||||
originalElement.remove(); // ❌ FORKERT
|
||||
```
|
||||
Original element fjernes når man hover over header, men det skal først fjernes ved faktisk drop.
|
||||
|
||||
### Korrekt Flow
|
||||
|
||||
```mermaid
|
||||
sequenceDiagram
|
||||
participant User
|
||||
participant Original as Original Event
|
||||
participant Clone as Clone Event
|
||||
participant AllDay as All-Day Event
|
||||
|
||||
Note over Original: Start: Original synlig
|
||||
User->>Clone: Drag start
|
||||
Note over Clone: Clone oprettes og vises
|
||||
Note over Original: Original bliver semi-transparent
|
||||
|
||||
User->>AllDay: Enter header
|
||||
Note over Clone: Clone skjules (display:none)
|
||||
Note over AllDay: All-day event oprettes
|
||||
Note over Original: Original forbliver (semi-transparent)
|
||||
|
||||
User->>Clone: Leave header (tilbage til grid)
|
||||
Note over AllDay: All-day event fjernes
|
||||
Note over Clone: Clone vises igen
|
||||
Note over Original: Original stadig der
|
||||
|
||||
User->>Original: Drop
|
||||
Note over Original: NU fjernes original
|
||||
Note over Clone: Clone bliver til ny position
|
||||
```
|
||||
|
||||
## Nødvendige Ændringer
|
||||
|
||||
### 1. AllDayManager.handleConvertToAllDay() (linje 232-285)
|
||||
```typescript
|
||||
// FØR (linje 274):
|
||||
originalElement.remove(); // ❌
|
||||
|
||||
// EFTER:
|
||||
// originalElement.remove(); // Kommenteret ud - skal IKKE fjernes her
|
||||
// Original forbliver i DOM med opacity 0.3 fra drag start
|
||||
```
|
||||
|
||||
### 2. AllDayManager.handleConvertFromAllDay() (linje 290-311)
|
||||
```typescript
|
||||
// Nuværende kode er faktisk korrekt - den:
|
||||
// 1. Fjerner all-day event
|
||||
// 2. Viser clone igen
|
||||
// Original er stadig der (blev aldrig fjernet)
|
||||
```
|
||||
|
||||
### 3. EventRenderer - handleDragEnd()
|
||||
```typescript
|
||||
// Her skal original FAKTISK fjernes
|
||||
// Efter successful drop:
|
||||
if (this.originalEvent) {
|
||||
this.originalEvent.remove(); // ✅ Korrekt tidspunkt
|
||||
}
|
||||
```
|
||||
|
||||
## Problem Opsummering
|
||||
|
||||
**Hovedproblem**: `originalElement.remove()` på linje 274 i AllDayManager sker for tidligt.
|
||||
|
||||
**Løsning**:
|
||||
1. Fjern/kommenter linje 274 i AllDayManager.handleConvertToAllDay()
|
||||
2. Original element skal kun fjernes i EventRenderer ved faktisk drop (drag:end)
|
||||
3. Clone håndterer al visuel feedback under drag
|
||||
|
||||
## Test Scenarios
|
||||
|
||||
1. **Drag → Header → Grid → Drop**
|
||||
- Original forbliver hele tiden
|
||||
- Clone skjules/vises korrekt
|
||||
- Original fjernes kun ved drop
|
||||
|
||||
2. **Drag → Header → Drop i Header**
|
||||
- Original forbliver indtil drop
|
||||
- All-day event bliver permanent
|
||||
- Original fjernes ved drop
|
||||
|
||||
3. **Drag → Header → ESC**
|
||||
- Original forbliver
|
||||
- Drag cancelled, alt tilbage til start
|
||||
|
||||
## Affected Code
|
||||
|
||||
### AllDayManager.ts
|
||||
- **Linje 274**: Skal fjernes/kommenteres
|
||||
- Original element må IKKE fjernes her
|
||||
|
||||
### EventRenderer.ts
|
||||
- **handleDragEnd()**: Skal sikre original fjernes her
|
||||
- Dette er det ENESTE sted original må fjernes
|
||||
|
||||
### DragDropManager.ts
|
||||
- Koden ser faktisk korrekt ud
|
||||
- Holder styr på både original og clone
|
||||
Loading…
Add table
Add a link
Reference in a new issue