feat: gantt添加双击任务事件

mousheng · Nov 24, 2023 · f70b2a9 · f70b2a9
1 parent cf8e42d
commit f70b2a9
Show file tree

Hide file tree

Showing 4 changed files with 35 additions and 2 deletions.
diff --git a/client/packages/lowcoder/src/comps/comps/gantee/ganttComp.tsx b/client/packages/lowcoder/src/comps/comps/gantee/ganttComp.tsx
@@ -10,7 +10,7 @@ import { Section, sectionNames } from "lowcoder-design";
 import { hiddenPropertyView } from "comps/utils/propertyUtils";
 import { trans } from "i18n";
 import ReactResizeDetector from "react-resize-detector";
-import { changeEvent, addedLinkEvent, eventHandlerControl, deletedLinkEvent, ProgressDragEvent, selectedChangeEvent, addTaskEvent } from "../../controls/eventHandlerControl";
+import { changeEvent, addedLinkEvent, eventHandlerControl, deletedLinkEvent, ProgressDragEvent, selectedChangeEvent, addTaskEvent, TaskChangeEvent } from "../../controls/eventHandlerControl";
 import styled from "styled-components";
 import { useEffect, useRef, useState } from "react";
 import { gantt } from 'dhtmlx-gantt';
@@ -51,6 +51,8 @@ const childrenMap = {
   onAddedLinkEvent: eventHandlerControl([addedLinkEvent]),
   allowProgressDrag: BoolControl,
   onProgressDragEvent: eventHandlerControl([ProgressDragEvent]),
+  allowTaskChange: BoolControl,
+  onTaskChangeEvent: eventHandlerControl([TaskChangeEvent]),
   showToday: BoolControl.DEFAULT_TRUE,
   style: styleControl(GanttStyle),
   currentId: StringOrNumberControl,
@@ -68,6 +70,7 @@ const GanttView = (props: RecordConstructorToView<typeof childrenMap> & {
   const [width, setWidth] = useState(0);
   const [height, setHeight] = useState(0);
   const [handleDBClickLinkRef, sethandleDBClickLinkRef] = useState('')
+  const [handleDBClickTaskRef, sethandleDBClickTaskRef] = useState('')
   const [handleParseRef, sethandleParseRef] = useState('')
   const [handleAfterTaskUpdateRef, sethandleAfterTaskUpdateRef] = useState('')
   const [handleTaskDragRef, sethandleTaskDragRef] = useState('')
@@ -267,6 +270,17 @@ const GanttView = (props: RecordConstructorToView<typeof childrenMap> & {
     }))
   }, [props.allowLinkDelete])
 
+  // 设置是否允许修改任务
+  useEffect(() => {
+    handleDBClickTaskRef && gantt.detachEvent(handleDBClickTaskRef)
+    sethandleDBClickTaskRef(
+      gantt.attachEvent("onTaskDblClick", function (id, e) {
+        props.allowTaskChange && props.onTaskChangeEvent('TaskChange')
+        return true;
+      })
+    )
+  }, [props.allowTaskChange])
+
   // 设置允许添加链接
   useEffect(() => {
     gantt.config.drag_links = props.allowAddLink;
@@ -382,6 +396,12 @@ let GanttBasicComp = (function () {
           })}
         </Section>
         <Section name={sectionNames.interaction}>
+          {children.allowTaskChange.propertyView({
+            label: trans("gantt.allowChangeTask"),
+          })}
+          {children.allowTaskChange.getView() && children.onTaskChangeEvent.propertyView({
+            title: trans("gantt.handleTaskChange"),
+          })}
           {children.allowTaskDrag.propertyView({
             label: trans("gantt.allowTaskDrag"),
           })}

diff --git a/client/packages/lowcoder/src/comps/controls/eventHandlerControl.tsx b/client/packages/lowcoder/src/comps/controls/eventHandlerControl.tsx
@@ -403,6 +403,11 @@ export const ProgressDragEvent: EventConfigType = {
   value: "progressDrag",
   description: trans("event.progressDragDesc"),
 };
+export const TaskChangeEvent: EventConfigType = {
+  label: trans("event.TaskChange"),
+  value: "TaskChange",
+  description: trans("event.TaskChangeDesc"),
+};
 export const delteMarkerEvent: EventConfigType = {
   label: trans("event.delteMarker"),
   value: "delteMarker",

diff --git a/client/packages/lowcoder/src/i18n/locales/en.ts b/client/packages/lowcoder/src/i18n/locales/en.ts
@@ -295,6 +295,8 @@ export const en = {
     addedLinkDesc: "Triggers on Add Link",
     deletedLink: "Deleted Link",
     deletedLinkDesc: "Triggers on Delete Link",
+    TaskChange: "Task Change",
+    TaskChangeDesc: "Triggers on Task Change",
     progressDrag: "Progress Drag",
     progressDragDesc: "Triggers on Progress Drag",
     addTask: "Add Task",
@@ -3045,13 +3047,15 @@ export const en = {
     monthScalesFormat2: 'Week #%W',
     tree: "tree",
     ColumnsData: 'Columns Data',
+    allowChangeTask: 'DbClick Task',
     allowAddLink: 'Add Link',
     allowLinkDelete: 'Link Delete',
     allowProgressDrag: 'Progress Drag',
     allowTaskDrag: 'Task Drag',
     links: 'Links Data',
     dataFormat: 'Data parse Format',
     handleDateChange: 'Handle Task Change',
+    handleTaskChange: 'Handle Task Change',
     handleAddedLink: 'Handle Added Link',
     handleDeletedLink: 'Handle Deleted Link',
     handleProgressDrag: 'Handle Progress Drag',

diff --git a/client/packages/lowcoder/src/i18n/locales/zh.ts b/client/packages/lowcoder/src/i18n/locales/zh.ts
@@ -282,6 +282,8 @@ export const zh = {
         addedLinkDesc: "在添加连接时触发",
         deletedLink: "删除连接时",
         deletedLinkDesc: "在删除连接时触发",
+        TaskChange: "修改任务",
+        TaskChangeDesc: "在修改任务时触发",
         progressDrag: "拖动进度条时",
         progressDragDesc: "在拖动进度条时触发",
         addTask: "添加任务时",
@@ -2899,14 +2901,16 @@ export const zh = {
         monthScalesFormat2: '第%W周',
         tree: '可展开',
         ColumnsData: '列数据',
+        allowChangeTask: '双击任务',
         allowAddLink: '添加链接',
         allowLinkDelete: '删除链接',
         allowProgressDrag: '拖动进度条',
         allowTaskDrag: '拖动任务',
         links: '连接数据',
         dataFormat: '日期解析格式',
         showTodayMark: '显示当日线',
-        handleDateChange: '处理任务修改',
+        handleDateChange: '处理任务拖动',
+        handleTaskChange: '处理任务修改',
         handleAddedLink: '处理连接添加事件',
         handleDeletedLink: '处理连接删除事件',
         handleProgressDrag: '处理进度条拖动事件',