From 5e2995939567efd74e566f1e2fd55ec081b0c194 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E6=98=94=E6=A2=A6?= Date: Mon, 30 Dec 2024 16:55:47 +0800 Subject: [PATCH] =?UTF-8?q?fix:antdVersion=E9=85=8D=E7=BD=AE=E5=8C=96?= =?UTF-8?q?=E6=98=BE=E7=A4=BA=E4=BC=A0=E9=80=92?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- docs/xflow/api.md | 1 + .../components/CustomNode/sourceHandle.tsx | 10 ++++---- .../src/components/NodesPopover/index.tsx | 7 +++--- .../src/components/PanelContainer/index.tsx | 7 +++--- .../PanelStatusLogContainer/index.tsx | 6 ++--- packages/x-flow/src/utils/index.ts | 23 +++++++++---------- packages/x-flow/src/withProvider.tsx | 2 ++ 7 files changed, 28 insertions(+), 28 deletions(-) diff --git a/docs/xflow/api.md b/docs/xflow/api.md index 3990ef54b..e7fbe0b13 100644 --- a/docs/xflow/api.md +++ b/docs/xflow/api.md @@ -18,6 +18,7 @@ title: API | globalConfig | 全局的面板和节点配置 | {nodePanel:[TNodePanel](#tnodepanel),nodeView:[TNodeView](#tnodeview),edge:[TEdge](#tedge)} | | | logPanel | 日志面板配置 | [TLogPanel](#tlogpanel) | | | onNodeClick | 节点点击事件 | `NodeMouseHandler` | | +| antdVersion | antd 的版本 | `V4 \| V5` | `V4` | ## TNodePanel diff --git a/packages/x-flow/src/components/CustomNode/sourceHandle.tsx b/packages/x-flow/src/components/CustomNode/sourceHandle.tsx index 1131a6905..a0421dd90 100644 --- a/packages/x-flow/src/components/CustomNode/sourceHandle.tsx +++ b/packages/x-flow/src/components/CustomNode/sourceHandle.tsx @@ -1,9 +1,10 @@ import { PlusOutlined } from '@ant-design/icons'; import { Handle } from '@xyflow/react'; import { Tooltip } from 'antd'; -import React, { memo, useMemo, useRef, useState } from 'react'; -import { getAntdVersion } from '../../utils'; +import React, { memo, useContext, useMemo, useRef, useState } from 'react'; import NodeSelectPopover from '../NodesPopover'; +import { ConfigContext } from '../../models/context'; + export default memo((props: any) => { const { @@ -18,10 +19,11 @@ export default memo((props: any) => { const [isShowTooltip, setIsShowTooltip] = useState(false); const [openNodeSelectPopover, setOpenNodeSelectPopover] = useState(false); const popoverRef = useRef(null); + const { antdVersion }: any = useContext(ConfigContext); + const toolTipVersionProps = useMemo(() => { - const version = getAntdVersion(); - if (version === 'V5') { + if (antdVersion === 'V5') { return { open: isShowTooltip, }; diff --git a/packages/x-flow/src/components/NodesPopover/index.tsx b/packages/x-flow/src/components/NodesPopover/index.tsx index 647abe905..4c6ce12a6 100644 --- a/packages/x-flow/src/components/NodesPopover/index.tsx +++ b/packages/x-flow/src/components/NodesPopover/index.tsx @@ -11,7 +11,7 @@ import React, { } from 'react'; import { useStore } from '../../hooks/useStore'; import { ConfigContext } from '../../models/context'; -import { getAntdVersion, uuid } from '../../utils'; +import { uuid } from '../../utils'; import NodesMenu from '../NodesMenu'; import './index.less'; @@ -24,7 +24,7 @@ export default forwardRef((props: any, popoverRef) => { const closeRef: any = useRef(null); const [open, setOpen] = useState(false); - const { settings, nodeSelector }: any = useContext(ConfigContext); + const { settings, nodeSelector, antdVersion }: any = useContext(ConfigContext); const { showSearch, popoverProps = { placement: 'top' } } = nodeSelector || {}; @@ -61,8 +61,7 @@ export default forwardRef((props: any, popoverRef) => { }; const popoverVersionProps = useMemo(() => { - const version = getAntdVersion(); - if (version === 'V5') { + if (antdVersion === 'V5') { return { open, onOpenChange: openChange, diff --git a/packages/x-flow/src/components/PanelContainer/index.tsx b/packages/x-flow/src/components/PanelContainer/index.tsx index 05331771f..abd5b3c22 100644 --- a/packages/x-flow/src/components/PanelContainer/index.tsx +++ b/packages/x-flow/src/components/PanelContainer/index.tsx @@ -5,7 +5,7 @@ import React, { FC, useContext, useEffect, useMemo, useState } from 'react'; import { shallow } from 'zustand/shallow'; import { useStore } from '../../hooks/useStore'; import { ConfigContext } from '../../models/context'; -import { getAntdVersion, safeJsonStringify } from '../../utils'; +import { safeJsonStringify } from '../../utils'; import createIconFont from '../../utils/createIconFont'; import IconView from '../IconView'; import './index.less'; @@ -41,7 +41,7 @@ const Panel: FC = (props: IPanelProps) => { openLogPanel, } = props; // 1.获取节点配置信息 - const { settingMap, iconFontUrl, globalConfig }: any = + const { settingMap, iconFontUrl, globalConfig, antdVersion }: any = useContext(ConfigContext); const nodeSetting = settingMap[nodeType] || {}; const { nodes, setNodes } = useStore( @@ -86,8 +86,7 @@ const Panel: FC = (props: IPanelProps) => { const Icon = useMemo(() => createIconFont(iconFontUrl), [iconFontUrl]); const drawerVersionProps = useMemo(() => { - const version = getAntdVersion(); - if (version === 'V5') { + if (antdVersion === 'V5') { return { rootClassName: 'custom-node-panel', open: true, diff --git a/packages/x-flow/src/components/PanelStatusLogContainer/index.tsx b/packages/x-flow/src/components/PanelStatusLogContainer/index.tsx index 5d51aba09..1087b2451 100644 --- a/packages/x-flow/src/components/PanelStatusLogContainer/index.tsx +++ b/packages/x-flow/src/components/PanelStatusLogContainer/index.tsx @@ -2,7 +2,6 @@ import { Drawer, Popover } from 'antd'; import classNames from 'classnames'; import React, { FC, useContext, useMemo } from 'react'; import { ConfigContext } from '../../models/context'; -import { getAntdVersion } from '../../utils'; import createIconFont from '../../utils/createIconFont'; import IconView from '../IconView'; import TitleMenuTooltip from '../NodeContainer/TitleMenuTooltip'; @@ -19,7 +18,7 @@ interface IPanelProps { const PanelStatusLogContainer: FC = (props: IPanelProps) => { const { onClose, children, nodeType } = props; // 1.获取节点配置信息 - const { settingMap, iconFontUrl, globalConfig, logPanel, widgets }: any = + const { settingMap, iconFontUrl, globalConfig, logPanel, widgets, antdVersion }: any = useContext(ConfigContext); const nodeSetting = settingMap[nodeType] || {}; const { nodePanel, iconSvg } = nodeSetting; @@ -29,8 +28,7 @@ const PanelStatusLogContainer: FC = (props: IPanelProps) => { const isCustomWidget = !Boolean(logPanel?.logWidget && CustomWidget); const drawerVersionProps = useMemo(() => { - const version = getAntdVersion(); - if (version === 'V5') { + if (antdVersion === 'V5') { return { rootClassName: classNames('node-log-panel', { 'no-header-line': isCustomWidget, diff --git a/packages/x-flow/src/utils/index.ts b/packages/x-flow/src/utils/index.ts index 956ff9b38..ead26ec47 100644 --- a/packages/x-flow/src/utils/index.ts +++ b/packages/x-flow/src/utils/index.ts @@ -1,4 +1,3 @@ -// import { version as antdVersion } from 'antd'; import { customAlphabet } from 'nanoid'; import tinycolor from 'tinycolor2'; export const uuid = customAlphabet('0123456789abcdefghijklmnopqrstuvwxyz', 16); @@ -6,7 +5,6 @@ export const uuid4 = customAlphabet('0123456789abcdefghijklmnopqrstuvwxyz', 4); import { isMatch, some, set, get, cloneDeep, has as _has, merge, mergeWith, isUndefined, omitBy } from 'lodash-es'; -const antdVersion = "5.22.6" export const _set = set; export const _get = get; export const _cloneDeep = cloneDeep; @@ -173,16 +171,17 @@ export const transformNodes = (nodes: any[]) => { }); }; -export const getAntdVersion = () => { - const majorVersion = parseInt(antdVersion?.split('.')?.[0], 10); - if (majorVersion >= 5) { - return 'V5'; - } else if (majorVersion === 4) { - return 'V4'; - } else { - return 'V4'; - } -}; +// 废弃： +// export const getAntdVersion = () => { +// const majorVersion = parseInt(antdVersion?.split('.')?.[0], 10); +// if (majorVersion >= 5) { +// return 'V5'; +// } else if (majorVersion === 4) { +// return 'V4'; +// } else { +// return 'V4'; +// } +// }; // 安全的JSON.stringify export function safeJsonStringify(obj: Object) { diff --git a/packages/x-flow/src/withProvider.tsx b/packages/x-flow/src/withProvider.tsx index 2c58971d9..09c71112c 100644 --- a/packages/x-flow/src/withProvider.tsx +++ b/packages/x-flow/src/withProvider.tsx @@ -28,6 +28,7 @@ export default function withProvider( iconFontUrl, globalConfig, logPanel, + antdVersion='V4', ...restProps } = props; const settingMap = useMemo(() => { @@ -52,6 +53,7 @@ export default function withProvider( iconFontUrl, globalConfig, logPanel, + antdVersion, widgets: { ...defaultWidgets, ...widgets,