feat: gant block init fix

This commit is contained in:
katherinehhh 2023-01-29 17:29:33 +08:00
parent 0ca3e79099
commit 402c63f307
3 changed files with 116 additions and 27 deletions

View File

@ -19,21 +19,8 @@ import { GanttToolbarContext } from '../../context';
import { useDesignable } from '../../../../../schema-component';
import { TableBlockProvider, useGanttBlockContext, useBlockRequestContext } from '../../../../../block-provider';
import { useProps } from '../../../../hooks/useProps';
import { formatData, mockTasks } from './utils';
const formatData = (data = [], fieldNames) => {
const tasks: any[] = [];
data.forEach((v) => {
tasks.push({
start: new Date(v[fieldNames.start]),
end: new Date(v[fieldNames.end]),
name: v[fieldNames.title],
id: v.id + '',
type: 'task',
progress: v[fieldNames.progress],
});
});
return tasks;
};
function Toolbar(props) {
const fieldSchema = useFieldSchema();
const toolBarSchema: Schema = useMemo(
@ -57,6 +44,7 @@ const getColumnWidth = (dataSetLength, clientWidth) => {
const columnWidth = clientWidth / dataSetLength > 50 ? Math.floor(clientWidth / dataSetLength) + 20 : 50;
return columnWidth;
};
export const Gantt: any = (props) => {
const { designable } = useDesignable();
@ -99,7 +87,7 @@ export const Gantt: any = (props) => {
const { resource } = useBlockRequestContext();
const fieldSchema = useFieldSchema();
const { fieldNames, dataSource } = useProps(props);
const { range: viewMode } = fieldNames || { range: 'day' };
const viewMode = fieldNames.range || 'day';
const tasks = formatData(dataSource, fieldNames) || [];
const wrapperRef = useRef<HTMLDivElement>(null);
const taskListRef = useRef<HTMLDivElement>(null);

View File

@ -0,0 +1,112 @@
export function mockTasks() {
const currentDate = new Date();
const tasks: any[] = [
{
start: new Date(currentDate.getFullYear(), currentDate.getMonth(), 1),
end: new Date(currentDate.getFullYear(), currentDate.getMonth(), 15),
name: "Some Project",
id: "ProjectSample",
progress: 25,
type: "project",
hideChildren: false,
displayOrder: 1,
},
{
start: new Date(currentDate.getFullYear(), currentDate.getMonth(), 1),
end: new Date(
currentDate.getFullYear(),
currentDate.getMonth(),
2,
12,
28
),
name: "Idea",
id: "Task 0",
progress: 45,
type: "task",
project: "ProjectSample",
displayOrder: 2,
},
{
start: new Date(currentDate.getFullYear(), currentDate.getMonth(), 2),
end: new Date(currentDate.getFullYear(), currentDate.getMonth(), 4, 0, 0),
name: "Research",
id: "Task 1",
progress: 25,
dependencies: ["Task 0"],
type: "task",
project: "ProjectSample",
displayOrder: 3,
},
{
start: new Date(currentDate.getFullYear(), currentDate.getMonth(), 4),
end: new Date(currentDate.getFullYear(), currentDate.getMonth(), 8, 0, 0),
name: "Discussion with team",
id: "Task 2",
progress: 10,
dependencies: ["Task 1"],
type: "task",
project: "ProjectSample",
displayOrder: 4,
},
{
start: new Date(currentDate.getFullYear(), currentDate.getMonth(), 8),
end: new Date(currentDate.getFullYear(), currentDate.getMonth(), 9, 0, 0),
name: "Developing",
id: "Task 3",
progress: 2,
dependencies: ["Task 2"],
type: "task",
project: "ProjectSample",
displayOrder: 5,
},
{
start: new Date(currentDate.getFullYear(), currentDate.getMonth(), 8),
end: new Date(currentDate.getFullYear(), currentDate.getMonth(), 10),
name: "Review",
id: "Task 4",
type: "task",
progress: 70,
dependencies: ["Task 2"],
project: "ProjectSample",
displayOrder: 6,
},
{
start: new Date(currentDate.getFullYear(), currentDate.getMonth(), 15),
end: new Date(currentDate.getFullYear(), currentDate.getMonth(), 15),
name: "Release",
id: "Task 6",
progress: currentDate.getMonth(),
type: "milestone",
dependencies: ["Task 4"],
project: "ProjectSample",
displayOrder: 7,
},
{
start: new Date(currentDate.getFullYear(), currentDate.getMonth(), 18),
end: new Date(currentDate.getFullYear(), currentDate.getMonth(), 19),
name: "Party Time",
id: "Task 9",
progress: 0,
isDisabled: true,
type: "task",
},
];
return tasks;
}
export const formatData = (data = [], fieldNames) => {
const tasks: any[] = [];
data.forEach((v) => {
tasks.push({
start: new Date(v[fieldNames.start]),
end: new Date(v[fieldNames.end]),
name: v[fieldNames.title],
id: v.id + '',
type: 'task',
progress: v[fieldNames.progress],
});
});
return tasks;
};

View File

@ -1,23 +1,12 @@
// import DeleteEvent from './DeleteEvent';
import { ActionBar } from '../action';
import { Gantt } from './components/gantt/gantt';
import { GanttDesigner } from './Gantt.Designer';
// import { Event } from './Event';
// import { Nav } from './Nav';
// import './style.less';
// import { Title } from './Title';
// import { Today } from './Today';
// import { ViewSelect } from './ViewSelect';
import { ViewMode } from './types/public-types';
Gantt.ActionBar = ActionBar;
// Calendar.Event = Event;
// Calendar.DeleteEvent = DeleteEvent;
// Calendar.Title = Title;
// Calendar.Today = Today;
Gantt.ViewMode = ViewMode;
// Gantt.ViewSelect = ViewSelect;
Gantt.Designer = GanttDesigner;
// const GanttV2 = Gantt;