Merge pull request #1708 from alibaba/xlfow-log-enable

fix:xflow,log增加全局禁用参数logPanel.enable

Author: lhbxs

docs/xflow/api.md

@@ -117,6 +117,7 @@ Handle 配置继承自 React Flow 的 Handle 配置，用于控制节点连接
 
 | 属性      | 描述                | 类型                          | 默认值 |
 | --------- | ------------------- | ----------------------------- | ------ |
+| enable | 是否启用日志面板，设置为`false`时全局禁用日志面板 | `boolean` | true |
 | logList   | 日志面板数据        |  Array<[TLogListItem](#tloglistitem)>|        |
 | loading   | 日志面板loading效果 | `boolean`                     | false  |
 | logWidget | 自定义日志面板展示  | `string`                      |        |

docs/xflow/log.md

@@ -59,7 +59,7 @@ group:
 
 ## 节点日志面板
 
-点击有状态的节点，会出现两个面板，左边为节点配置面板，右边为节点日志面板。
+点击有状态的节点，会出现两个面板，左边为节点配置面板，右边为节点日志面板。如果不想使用日志面板，可以设置`logPanel.enable`属性为`false`关闭全局日志面板，默认会开启日志面板。
 
 日志面板全局配置参数如下：
 ```js
@@ -70,6 +70,7 @@ group:
           loading, // 日志面板loading
           logWidget:'CustomLogPanel'// 自定义日志面板
           tabsProps,// 日志面板，详情和追踪选项卡切换组件,antd的tabs配置透传
+          enable: true, // 是否启用日志面板，默认为true，设置为false时全局禁用日志面板
         }}
 ```
 ### 内置节点日志面板

packages/x-flow/src/XFlow.tsx

@@ -87,7 +87,7 @@ const XFlow: FC<FlowProps> = memo(props => {
   );
   const { record } = useTemporalStore();
   const [activeNode, setActiveNode] = useState<any>(null);
-  const { settingMap, globalConfig, readOnly } = useContext(ConfigContext);
+  const { settingMap, globalConfig, readOnly, logPanel } = useContext(ConfigContext);
   const [openPanel, setOpenPanel] = useState<boolean>(true);
   const [openLogPanel, setOpenLogPanel] = useState<boolean>(true);
   const {
@@ -520,7 +520,7 @@ const XFlow: FC<FlowProps> = memo(props => {
             {NodeEditorWrap}
           </PanelContainer>
         )}
-        {isTruthy(activeNode?._status) && openLogPanel && (
+        {isTruthy(activeNode?._status) && openLogPanel && Boolean(logPanel?.enable ?? true) && (
           <PanelStatusLogContainer
             id={activeNode?.id}
             nodeType={activeNode?._nodeType}

packages/x-flow/src/components/PanelContainer/index.tsx

@@ -67,13 +67,14 @@ const Panel: FC<IPanelProps> = (props: IPanelProps) => {
 
   const titleText = activeNode.data?.title;
   const descText = activeNode.data?.desc;
-  
+
   const { nodePanel, iconSvg, showTestingBtn } = nodeSetting;
   const SVGWidget = widgets[nodeSetting?.iconSvg]
   const hideDesc = nodePanel?.hideDesc ?? globalConfig?.nodePanel?.hideDesc ?? false;
-  const isShowStatusPanel = Boolean(isTruthy(node?._status) && openLogPanel);
+  const isEnableLogPanel = Boolean(logPanel?.enable ?? true);
+  const isShowStatusPanel = isEnableLogPanel && Boolean(isTruthy(node?._status) && openLogPanel);
   const offsetRightStatus = isNumber(logPanel?.width) ? Number(logPanel?.width + 10) : 410;
-  
+
   const handleTitleChange = (e: React.ChangeEvent<HTMLInputElement>) => {
     handleNodeValueChange({ title: e.target.value });
   };

packages/x-flow/src/types.ts

@@ -108,6 +108,7 @@ export interface TLogPanel {
   width?: number;// 日志面板宽度
   tabsProps?: TabPaneProps;// 内置日志面板,详情和追踪选项卡切换组件,antd的tabs配置透传
   detailLogWidget?: string;// 自定义详情日志面板组件
+  enable?: boolean;// 是否启用日志面板，默认为true
 }
 
 export interface TNodeView {