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
|
|
@ -1,7 +1,6 @@
|
|||
import { calendarConfig } from '../core/CalendarConfig';
|
||||
import { ResourceCalendarData, CalendarView } from '../types/CalendarTypes';
|
||||
import { CalendarTypeFactory } from '../factories/CalendarTypeFactory';
|
||||
import { HeaderRenderContext } from './HeaderRenderer';
|
||||
import { ColumnRenderContext } from './ColumnRenderer';
|
||||
import { eventBus } from '../core/EventBus';
|
||||
import { DateCalculator } from '../utils/DateCalculator';
|
||||
|
|
@ -12,7 +11,6 @@ import { DateCalculator } from '../utils/DateCalculator';
|
|||
*/
|
||||
export class GridRenderer {
|
||||
private cachedGridContainer: HTMLElement | null = null;
|
||||
private cachedCalendarHeader: HTMLElement | null = null;
|
||||
private cachedTimeAxis: HTMLElement | null = null;
|
||||
|
||||
constructor() {
|
||||
|
|
@ -38,6 +36,8 @@ export class GridRenderer {
|
|||
// Only clear and rebuild if grid is empty (first render)
|
||||
if (grid.children.length === 0) {
|
||||
this.createCompleteGridStructure(grid, currentDate, resourceData, view);
|
||||
// Setup grid-related event listeners on first render
|
||||
this.setupGridEventListeners();
|
||||
} else {
|
||||
// Optimized update - only refresh dynamic content
|
||||
this.updateGridContent(grid, currentDate, resourceData, view);
|
||||
|
|
@ -109,12 +109,6 @@ export class GridRenderer {
|
|||
): HTMLElement {
|
||||
const gridContainer = document.createElement('swp-grid-container');
|
||||
|
||||
// Create calendar header with caching
|
||||
const calendarHeader = document.createElement('swp-calendar-header');
|
||||
this.renderCalendarHeader(calendarHeader, currentDate, resourceData, view);
|
||||
this.cachedCalendarHeader = calendarHeader;
|
||||
gridContainer.appendChild(calendarHeader);
|
||||
|
||||
// Create scrollable content structure
|
||||
const scrollableContent = document.createElement('swp-scrollable-content');
|
||||
const timeGrid = document.createElement('swp-time-grid');
|
||||
|
|
@ -134,30 +128,6 @@ export class GridRenderer {
|
|||
return gridContainer;
|
||||
}
|
||||
|
||||
/**
|
||||
* Render calendar header with view awareness
|
||||
*/
|
||||
private renderCalendarHeader(
|
||||
calendarHeader: HTMLElement,
|
||||
currentDate: Date,
|
||||
resourceData: ResourceCalendarData | null,
|
||||
view: CalendarView
|
||||
): void {
|
||||
const calendarType = calendarConfig.getCalendarMode();
|
||||
const headerRenderer = CalendarTypeFactory.getHeaderRenderer(calendarType);
|
||||
|
||||
const context: HeaderRenderContext = {
|
||||
currentWeek: currentDate, // HeaderRenderer expects currentWeek property
|
||||
config: calendarConfig,
|
||||
resourceData: resourceData
|
||||
};
|
||||
|
||||
headerRenderer.render(calendarHeader, context);
|
||||
|
||||
|
||||
// Setup only grid-related event listeners
|
||||
this.setupGridEventListeners();
|
||||
}
|
||||
|
||||
/**
|
||||
* Render column container with view awareness
|
||||
|
|
@ -189,14 +159,6 @@ export class GridRenderer {
|
|||
resourceData: ResourceCalendarData | null,
|
||||
view: CalendarView
|
||||
): void {
|
||||
// Use cached elements if available
|
||||
const calendarHeader = this.cachedCalendarHeader || grid.querySelector('swp-calendar-header');
|
||||
if (calendarHeader) {
|
||||
// Clear and re-render header content
|
||||
calendarHeader.innerHTML = '';
|
||||
this.renderCalendarHeader(calendarHeader as HTMLElement, currentDate, resourceData, view);
|
||||
}
|
||||
|
||||
// Update column container if needed
|
||||
const columnContainer = grid.querySelector('swp-day-columns');
|
||||
if (columnContainer) {
|
||||
|
|
@ -271,7 +233,6 @@ export class GridRenderer {
|
|||
|
||||
// Clear cached references
|
||||
this.cachedGridContainer = null;
|
||||
this.cachedCalendarHeader = null;
|
||||
this.cachedTimeAxis = null;
|
||||
(this as any).gridBodyEventListener = null;
|
||||
(this as any).cachedColumnContainer = null;
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue