feat: gant block init fix

packages/core/client/src/schema-component/antd/gantt/components/gantt/gantt.tsx

@@ -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);

packages/core/client/src/schema-component/antd/gantt/components/gantt/utils.tsx

@@ -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;
+  };

packages/core/client/src/schema-component/antd/gantt/index.ts

@@ -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;