jordium-gantt-vue3
Version:
A Vue 3 Gantt chart component for project management, task scheduling, resource planning, calendar, resource usage and timeline visualization.
223 lines (222 loc) • 9.13 kB
TypeScript
import { Task } from '../models/classes/Task';
interface DragState {
isDragging: boolean;
isPreparing: boolean;
draggedTask: Task | null;
draggedElement: HTMLElement | null;
ghostElement: HTMLElement | null;
dropTargetTask: Task | null;
dropPosition: 'after' | 'child' | null;
startX: number;
startY: number;
}
interface UseDragOptions {
enabled: boolean;
dragThreshold?: number;
onDragStart?: (task: Task) => void;
onDragOver?: (task: Task, position: 'after' | 'child') => void;
onDrop?: (draggedTask: Task, targetTask: Task, position: 'after' | 'child') => void;
}
export declare function useTaskRowDrag(options: UseDragOptions): {
dragState: import('vue').Ref<{
isDragging: boolean;
isPreparing: boolean;
draggedTask: {
[x: string]: unknown;
id: number;
name: string;
predecessor?: number[] | undefined;
assignee?: string | string[] | undefined;
assigneeName?: string | undefined;
avatar?: string | string[] | undefined;
startDate?: string | undefined;
endDate?: string | undefined;
actualStartDate?: string | undefined;
actualEndDate?: string | undefined;
progress?: number | undefined;
estimatedHours?: number | undefined;
actualHours?: number | undefined;
parentId?: number | undefined;
children?: /*elided*/ any[] | undefined;
collapsed?: boolean | undefined;
isParent?: boolean | undefined;
type?: string | undefined;
description?: string | undefined;
icon?: string | undefined;
level?: number | undefined;
isTimerRunning?: boolean | undefined;
timerStartTime?: number | undefined;
timerEndTime?: number | undefined;
timerStartDesc?: string | undefined;
timerElapsedTime?: number | undefined;
isEditable?: boolean | undefined;
barColor?: string | undefined;
resources?: {
[x: string]: unknown;
id: string | number;
name: string;
title?: string | undefined;
type?: import('..').ResourceType | undefined;
avatar?: string | undefined;
description?: string | undefined;
department?: string | undefined;
skills?: string[] | undefined;
capacity?: number | undefined;
color?: string | undefined;
tasks: /*elided*/ any[];
}[] | undefined;
} | null;
draggedElement: HTMLElement | null;
ghostElement: HTMLElement | null;
dropTargetTask: {
[x: string]: unknown;
id: number;
name: string;
predecessor?: number[] | undefined;
assignee?: string | string[] | undefined;
assigneeName?: string | undefined;
avatar?: string | string[] | undefined;
startDate?: string | undefined;
endDate?: string | undefined;
actualStartDate?: string | undefined;
actualEndDate?: string | undefined;
progress?: number | undefined;
estimatedHours?: number | undefined;
actualHours?: number | undefined;
parentId?: number | undefined;
children?: /*elided*/ any[] | undefined;
collapsed?: boolean | undefined;
isParent?: boolean | undefined;
type?: string | undefined;
description?: string | undefined;
icon?: string | undefined;
level?: number | undefined;
isTimerRunning?: boolean | undefined;
timerStartTime?: number | undefined;
timerEndTime?: number | undefined;
timerStartDesc?: string | undefined;
timerElapsedTime?: number | undefined;
isEditable?: boolean | undefined;
barColor?: string | undefined;
resources?: {
[x: string]: unknown;
id: string | number;
name: string;
title?: string | undefined;
type?: import('..').ResourceType | undefined;
avatar?: string | undefined;
description?: string | undefined;
department?: string | undefined;
skills?: string[] | undefined;
capacity?: number | undefined;
color?: string | undefined;
tasks: /*elided*/ any[];
}[] | undefined;
} | null;
dropPosition: "after" | "child" | null;
startX: number;
startY: number;
}, DragState | {
isDragging: boolean;
isPreparing: boolean;
draggedTask: {
[x: string]: unknown;
id: number;
name: string;
predecessor?: number[] | undefined;
assignee?: string | string[] | undefined;
assigneeName?: string | undefined;
avatar?: string | string[] | undefined;
startDate?: string | undefined;
endDate?: string | undefined;
actualStartDate?: string | undefined;
actualEndDate?: string | undefined;
progress?: number | undefined;
estimatedHours?: number | undefined;
actualHours?: number | undefined;
parentId?: number | undefined;
children?: /*elided*/ any[] | undefined;
collapsed?: boolean | undefined;
isParent?: boolean | undefined;
type?: string | undefined;
description?: string | undefined;
icon?: string | undefined;
level?: number | undefined;
isTimerRunning?: boolean | undefined;
timerStartTime?: number | undefined;
timerEndTime?: number | undefined;
timerStartDesc?: string | undefined;
timerElapsedTime?: number | undefined;
isEditable?: boolean | undefined;
barColor?: string | undefined;
resources?: {
[x: string]: unknown;
id: string | number;
name: string;
title?: string | undefined;
type?: import('..').ResourceType | undefined;
avatar?: string | undefined;
description?: string | undefined;
department?: string | undefined;
skills?: string[] | undefined;
capacity?: number | undefined;
color?: string | undefined;
tasks: /*elided*/ any[];
}[] | undefined;
} | null;
draggedElement: HTMLElement | null;
ghostElement: HTMLElement | null;
dropTargetTask: {
[x: string]: unknown;
id: number;
name: string;
predecessor?: number[] | undefined;
assignee?: string | string[] | undefined;
assigneeName?: string | undefined;
avatar?: string | string[] | undefined;
startDate?: string | undefined;
endDate?: string | undefined;
actualStartDate?: string | undefined;
actualEndDate?: string | undefined;
progress?: number | undefined;
estimatedHours?: number | undefined;
actualHours?: number | undefined;
parentId?: number | undefined;
children?: /*elided*/ any[] | undefined;
collapsed?: boolean | undefined;
isParent?: boolean | undefined;
type?: string | undefined;
description?: string | undefined;
icon?: string | undefined;
level?: number | undefined;
isTimerRunning?: boolean | undefined;
timerStartTime?: number | undefined;
timerEndTime?: number | undefined;
timerStartDesc?: string | undefined;
timerElapsedTime?: number | undefined;
isEditable?: boolean | undefined;
barColor?: string | undefined;
resources?: {
[x: string]: unknown;
id: string | number;
name: string;
title?: string | undefined;
type?: import('..').ResourceType | undefined;
avatar?: string | undefined;
description?: string | undefined;
department?: string | undefined;
skills?: string[] | undefined;
capacity?: number | undefined;
color?: string | undefined;
tasks: /*elided*/ any[];
}[] | undefined;
} | null;
dropPosition: "after" | "child" | null;
startX: number;
startY: number;
}>;
startDrag: (task: Task, element: HTMLElement, event: MouseEvent) => void;
handleDragOver: (task: Task, element: HTMLElement, event: MouseEvent) => void;
endDrag: () => void;
};
export {};