jordium-gantt-vue3
Version:
A Vue 3 Gantt chart component for project management, task scheduling, resource planning, calendar, resource usage and timeline visualization.
56 lines (55 loc) • 2 kB
TypeScript
import { VNode, Slots, VNodeChild, ComputedRef } from 'vue';
import { Task } from '../../../../models/classes/Task';
import { TaskListColumnConfig } from '../../../../models/configs/TaskListConfig';
/**
* 声明式列配置接口
* 从 task-list-column 组件解析出的列配置
*/
export interface DeclarativeColumnConfig {
prop?: string;
label?: string;
width?: number | string;
align?: 'left' | 'center' | 'right';
cssClass?: string;
/** 列固定位置 */
fixed?: 'left' | 'right' | boolean;
headerSlot?: () => VNodeChild;
defaultSlot?: (scope: {
row: Task;
$index: number;
}) => VNodeChild;
}
/**
* 从 VNode 中提取 task-list-column 的配置
*/
export declare function extractColumnConfig(vnode: VNode): DeclarativeColumnConfig | null;
/**
* 解析声明式列配置
* 从默认 slot 的 VNode 中提取所有 task-list-column 的配置
*/
export declare function parseDeclarativeColumns(slots: Slots): DeclarativeColumnConfig[]; /**
* Task List Columns Composable
* 用于管理任务列表的列配置（支持声明式和配置式）
*/
export declare function useTaskListColumns(renderMode: ComputedRef<'default' | 'declarative'> | 'default' | 'declarative', slots: Slots, defaultColumns?: TaskListColumnConfig[]): {
declarativeColumns: import('vue').ShallowRef<DeclarativeColumnConfig[], DeclarativeColumnConfig[]>;
finalColumns: ComputedRef<TaskListColumnConfig[] | DeclarativeColumnConfig[]>;
getColumnWidthStyle: (column: {
width?: number | string;
}, containerWidth?: number) => {
flex?: undefined;
minWidth?: undefined;
maxWidth?: undefined;
} | {
flex: string;
minWidth: string;
maxWidth: string;
};
getColumnAlignStyle: (align?: "left" | "center" | "right") => {
justifyContent?: undefined;
textAlign?: undefined;
} | {
justifyContent: string;
textAlign: "right" | "center";
};
};