From b2bf6a375597f424662b96e6e7c223a671ae9e55 Mon Sep 17 00:00:00 2001
From: smallstonesk <575913857@qq.com>
Date: Sun, 3 Jan 2021 00:17:39 +0800
Subject: [PATCH] feat: completes editint code item of node's context menu
---
.../mods/flowChart/contextMenu/menuConfig/node.tsx | 12 ++++++++++--
packages/core/src/mods/flowChart/createFlowChart.ts | 3 +++
.../src/mods/settingBar/components/code/index.tsx | 7 ++++---
3 files changed, 17 insertions(+), 5 deletions(-)
diff --git a/packages/core/src/mods/flowChart/contextMenu/menuConfig/node.tsx b/packages/core/src/mods/flowChart/contextMenu/menuConfig/node.tsx
index 0b04ec3..6623066 100644
--- a/packages/core/src/mods/flowChart/contextMenu/menuConfig/node.tsx
+++ b/packages/core/src/mods/flowChart/contextMenu/menuConfig/node.tsx
@@ -9,6 +9,8 @@ import {
} from '@ant-design/icons';
import XIcon from '../../../../components/xIcon';
import shortcuts from '../../../../common/shortcuts';
+import { Graph } from '@antv/x6';
+import { getSelectedNodes } from '../../../../utils/flowChartUtils';
const nodeMenuConfig = [
{
@@ -49,14 +51,20 @@ const nodeMenuConfig = [
key: 'editCode',
title: '编辑代码',
icon: ,
- handler() {
- // TODO
+ disabled(flowChart: Graph) {
+ return getSelectedNodes(flowChart).length !== 1;
+ },
+ handler(flowChart: Graph) {
+ flowChart.trigger('settingBar:clickEditCode');
}
},
{
key: 'executeCode',
title: '执行代码',
icon: ,
+ disabled(flowChart: Graph) {
+ return getSelectedNodes(flowChart).length !== 1;
+ },
handler() {
// TODO
}
diff --git a/packages/core/src/mods/flowChart/createFlowChart.ts b/packages/core/src/mods/flowChart/createFlowChart.ts
index b611ad9..ca02c80 100644
--- a/packages/core/src/mods/flowChart/createFlowChart.ts
+++ b/packages/core/src/mods/flowChart/createFlowChart.ts
@@ -55,6 +55,9 @@ const registerEvents = (flowChart: Graph): void => {
args.edge.attr('line/strokeWidth', '2px');
}
});
+ flowChart.on('node:dblclick', () => {
+ flowChart.trigger('settingBar:clickEditCode');
+ });
flowChart.on('blank:contextmenu', (args) => {
const { e: { clientX, clientY } } = args;
flowChart.cleanSelection();
diff --git a/packages/core/src/mods/settingBar/components/code/index.tsx b/packages/core/src/mods/settingBar/components/code/index.tsx
index 13f0aaf..6dac600 100644
--- a/packages/core/src/mods/settingBar/components/code/index.tsx
+++ b/packages/core/src/mods/settingBar/components/code/index.tsx
@@ -21,9 +21,10 @@ const Code: React.FC = (props) => {
const [visible, setVisible] = useState(false);
useEffect(() => {
- flowChart.on('node:dblclick', () => {
- onClickEdit();
- });
+ flowChart.on('settingBar:clickEditCode', onClickEdit);
+ return () => {
+ flowChart.off('settingBar:clickEditCode', onClickEdit);
+ };
}, []);
// events