feat:经过后展示

alibaba · Jan 8, 2025 · dcf808e · dcf808e
1 parent a8ad4f3
commit dcf808e
Show file tree

Hide file tree

Showing 5 changed files with 54 additions and 32 deletions.
diff --git a/packages/x-flow/src/components/CustomNode/index.less b/packages/x-flow/src/components/CustomNode/index.less
@@ -17,6 +17,13 @@
     padding: 0 2px;
     border-radius: 4px;
     box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, .05);
+    opacity: 0;
+    transition: all .5s;
+  }
+  &:hover{
+    .xflow-node-actions-container{
+      opacity: 1;
+    }
   }
   .react-flow__handle {
     width: 30px;

diff --git a/packages/x-flow/src/components/CustomNode/index.tsx b/packages/x-flow/src/components/CustomNode/index.tsx
@@ -19,8 +19,9 @@ export default memo((props: any) => {
   const { widgets, settingMap, globalConfig, onMenuItemClick, antdVersion,readOnly } =
     useContext(ConfigContext);
   const deletable = globalConfig?.edge?.deletable ?? true;
-  const disabledCopy = settingMap[type]?.disabledCopy ?? false
-  const disabledDelete = settingMap[type]?.disabledDelete ?? false
+  const disabledCopy = settingMap[type]?.disabledCopy ?? false;
+  const disabledDelete = settingMap[type]?.disabledDelete ?? false;
+  const switchExtra = settingMap[type]?.switchExtra || {};
   // const isConnectableStart = globalConfig?.handle?.isConnectableStart ?? true;
   // const isConnectableEnd = globalConfig?.handle?.isConnectableEnd ?? true;
 
@@ -160,36 +161,46 @@ export default memo((props: any) => {
           }
         });
       }
-      return [
-        ...list,
-        {
-          label: `粘贴到第${list.length + 1}个出口`,
-          key: 'paste-' + (list.length + 1),
-          id: id,
-          index: list.length + 1,
-          sourcehandle: 'id_else',
-        },
-      ];
+      const defaultElse = switchExtra?.hideElse
+        ? []
+        : [
+            {
+              label: `粘贴到第${list.length + 1}个出口`,
+              key: 'paste-' + (list.length + 1),
+              id: id,
+              index: list.length + 1,
+              sourcehandle: 'id_else',
+            },
+          ];
+      return [...list, ...defaultElse];
     }
     return [
       {
         label: '粘贴',
         key: 'paste',
       },
     ];
-  }, [type,data]);
+  }, [type, data]);
 
   // 节点状态处理
   const statusObj = transformNodeStatus(globalConfig?.nodeView?.status || []);
   const nodeBorderColor = statusObj[status]?.color;
 
   const menu = (
     <Menu onClick={itemClick}>
-      <Menu.Item key={'copy'} disabled={disabledCopy}>复制</Menu.Item>
+      <Menu.Item key={'copy'} disabled={disabledCopy}>
+        复制
+      </Menu.Item>
       {menuItem.map((r: any) => {
-        return <Menu.Item {...r} key={r.key}>{r.label}</Menu.Item>;
+        return (
+          <Menu.Item {...r} key={r.key}>
+            {r.label}
+          </Menu.Item>
+        );
       })}
-      <Menu.Item key={'delete'} danger={true} disabled={disabledDelete}>删除</Menu.Item>
+      <Menu.Item key={'delete'} danger={true} disabled={disabledDelete}>
+        删除
+      </Menu.Item>
     </Menu>
   );
 
@@ -201,14 +212,14 @@ export default memo((props: any) => {
             {
               label: '复制',
               key: 'copy',
-              disabled:disabledCopy
+              disabled: disabledCopy,
             },
             ...menuItem,
             {
               label: '删除',
               key: 'delete',
               danger: true,
-              disabled:disabledDelete
+              disabled: disabledDelete,
             },
           ],
           onClick: itemClick,
@@ -240,15 +251,17 @@ export default memo((props: any) => {
           // isConnectableEnd={isConnectableEnd}
         />
       )}
-      {selected && (
-        <Dropdown disabled={readOnly} {...dropdownVersionProps} trigger={['click', 'contextMenu']}>
-          <div className="xflow-node-actions-container">
-            <MoreOutlined
-              style={{ transform: 'rotateZ(90deg)', fontSize: '20px' }}
-            ></MoreOutlined>
-          </div>
-        </Dropdown>
-      )}
+      <Dropdown
+        disabled={readOnly}
+        {...dropdownVersionProps}
+        //trigger={['click', 'contextMenu']}
+      >
+        <div className="xflow-node-actions-container">
+          <MoreOutlined
+            style={{ transform: 'rotateZ(90deg)', fontSize: '20px' }}
+          ></MoreOutlined>
+        </div>
+      </Dropdown>
       <NodeWidget
         id={id}
         type={type}
@@ -276,3 +289,4 @@ export default memo((props: any) => {
     </div>
   );
 });
+
diff --git a/packages/x-flow/src/components/PanelContainer/index.tsx b/packages/x-flow/src/components/PanelContainer/index.tsx
@@ -109,6 +109,7 @@ const Panel: FC<IPanelProps> = (props: IPanelProps) => {
     <Drawer
       {...drawerVersionProps}
       getContainer={false}
+      key={id}
       width={nodePanel?.width || globalConfig?.nodePanel?.width || 400} // 改为配置的width 节点的width > 全局的width>  默认 400
       mask={false}
       onClose={onClose}
@@ -135,7 +136,7 @@ const Panel: FC<IPanelProps> = (props: IPanelProps) => {
                 )}
               </span>
               {isDisabled ? (
-                <span style={{ marginLeft: '11px' }}>{nodeSetting?.title}</span>
+                <span style={{ marginLeft: '11px' }}>{titleVal}</span>
               ) : (
                 <Input
                   style={{ width: '100%' }}

diff --git a/packages/x-flow/src/nodes/node-switch/SwitchBuildInNodeWidget.tsx b/packages/x-flow/src/nodes/node-switch/SwitchBuildInNodeWidget.tsx
@@ -35,8 +35,8 @@ export default memo((props: any) => {
     <div className="item-header">
       <div className="item-title">
         {switchExtra?.titleKey
-          ? item[switchExtra?.titleKey]
-          : item?.title || `条件${index}`}
+          ? item[switchExtra?.titleKey] || `条件${index}`
+          : item?.title}
       </div>
       <SourceHandle
         position={position}

diff --git a/packages/x-flow/src/types.ts b/packages/x-flow/src/types.ts
@@ -28,8 +28,8 @@ export interface TNodeItem {
     valueKey: string;
     titleKey: string;
   }
-  disabledCopy:boolean
-  disabledDelete:boolean
+  disabledCopy?:boolean
+  disabledDelete?:boolean
 }
 
 export interface TNodeGroup {