jordium-gantt-vue3
Version:
A Vue 3 Gantt chart component for project management, task scheduling, resource planning, calendar, resource usage and timeline visualization.
44 lines (43 loc) • 1.68 kB
TypeScript
/**
* CalendarSelectionLayer - 拖拽选区高亮渲染层
* 无状态展示组件,不含任何业务判定逻辑,坐标与状态完全由父级(CalendarDayView 等)计算传入
*
* 两种渲染模式:
* - rect:整块高亮矩形(月视图等天粒度选区使用)
* - segments:Outlook 风格分段渲染(日/周视图使用),每个槽位渲染"整槽浅色底 + 左侧比例指示条"
*/
interface SelectionRect {
top: number;
left: number;
width: number;
height: number;
}
/** 分段渲染的单个槽位数据(仅含纵向坐标,横向 left/width 由 props 统一提供) */
interface SelectionSegment {
top: number;
height: number;
indicatorTop: number;
indicatorHeight: number;
}
interface Props {
rect?: SelectionRect | null;
segments?: SelectionSegment[];
/** segments 模式下的统一横向偏移 */
left?: number;
/** segments 模式下槽位底色的统一宽度 */
width?: number;
/** segments 模式下左侧比例指示条的宽度 */
indicatorWidth?: number;
state?: 'active' | 'rejected' | 'pending';
rejectedText?: string;
}
declare const _default: import('vue').DefineComponent<Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<Props> & Readonly<{}>, {
left: number;
width: number;
rect: SelectionRect | null;
segments: SelectionSegment[];
indicatorWidth: number;
state: "active" | "rejected" | "pending";
rejectedText: string;
}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
export default _default;