feat：弹窗的描述内容改为可配置

昔梦 · 昔梦 · commit 7799ad922e5b · 2024-12-13T15:19:08.000+08:00
diff --git a/docs/xflow/api.md b/docs/xflow/api.md
@@ -37,6 +37,7 @@ title: API
 | title                | 节点名称                                                                                                                                         | `string`                                                                                                                                                        |        |
 | type                 | 节点类型                                                                                                                                         | `string`                                                                                                                                                        |        |
 | hidden               | 是否在配置面板中显示节点                                                                                                                         | `boolean`                                                                                                                                                       | false  |
+| hideDesc               | 是否在配置面板中显示节点的描述信息                                                                                                                | `boolean`                                                                                                                                                       | false  |
 | targetHandleHidden   | 是否隐藏左侧输入连接头                                                                                                                           | `boolean`                                                                                                                                                       | false  |
 | sourceHandleHidden   | 是否隐藏右侧输出连接头                                                                                                                           | `boolean`                                                                                                                                                       | false  |
 | icon                 | 节点的图标配置                                                                                                                                   | `{type:string;bgColor:string}`                                                                                                                                  |        |
diff --git a/docs/xflow/schema/custom-settings.ts b/docs/xflow/schema/custom-settings.ts
@@ -59,6 +59,7 @@ export default [
       type: 'icon-model',
       bgColor: '#6172F3',
     },
+    hideDesc:true // 隐藏配置面板描述信息
   },
   {
     title: 'Prompt',
diff --git a/packages/x-flow/src/components/PanelContainer/index.less b/packages/x-flow/src/components/PanelContainer/index.less
@@ -56,7 +56,7 @@
       border-color: #fff;
     }
     textarea {
-      margin: 12px 0;
+      margin-top: 12px;
     }
   }
 
@@ -122,4 +122,4 @@
       font-size: 12px;
     }
   }
-}
+}
diff --git a/packages/x-flow/src/components/PanelContainer/index.tsx b/packages/x-flow/src/components/PanelContainer/index.tsx
@@ -39,9 +39,9 @@ const Panel: FC<IPanelProps> = (props: IPanelProps) => {
   const isDisabled = ['Input', 'Output'].includes(nodeType) || disabled;
   const [descVal, setDescVal] = useState(data?.desc);
   const [titleVal, setTitleVal] = useState(data?.title || nodeSetting?.title);
+  const { hideDesc, nodeConfigPanelWidth } = nodeSetting;
 
   // const description = getDescription(nodeType, props.description);
-
   const handleNodeValueChange = debounce((data: any) => {
     const newNodes = produce(nodes, draft => {
       let node = null;
@@ -72,9 +72,10 @@ const Panel: FC<IPanelProps> = (props: IPanelProps) => {
       getContainer={false}
       rootClassName="custom-node-panel"
       open={true}
-      width={nodeSetting?.nodeConfigPanelWidth || configPanelWidth || 400} // 改为配置的width 节点的width > 全局的width>  默认 400
+      width={nodeConfigPanelWidth || configPanelWidth || 400} // 改为配置的width 节点的width > 全局的width>  默认 400
       mask={false}
       onClose={onClose}
+      headerStyle={{ paddingBottom: '12px' }}
       title={
         <>
           <div className="title-box">
@@ -93,8 +94,7 @@ const Panel: FC<IPanelProps> = (props: IPanelProps) => {
               ) : (
                 <Input
                   style={{ width: '100%' }}
-                  // defaultValue={data?.title || nodeSetting?.title}
-                  value={titleVal} //  || nodeSetting?.title
+                  value={titleVal}
                   onChange={e => {
                     setTitleVal(e.target.value);
                     handleNodeValueChange({ title: e.target.value });
@@ -119,23 +119,23 @@ const Panel: FC<IPanelProps> = (props: IPanelProps) => {
               </Space>
             </div>
           </div>
-          <div className="desc-box">
-            {isDisabled ? (
-              description
-            ) : (
-              <Input.TextArea
-                placeholder="添加描述..."
-                autoSize={{ minRows: 1 }}
-                value={descVal}
-                // value={data?.desc}
-                // defaultValue={description}
-                onChange={e => {
-                  setDescVal(e.target.value);
-                  handleNodeValueChange({ desc: e.target.value });
-                }}
-              />
-            )}
-          </div>
+          {!hideDesc && (
+            <div className="desc-box">
+              {isDisabled ? (
+                description
+              ) : (
+                <Input.TextArea
+                  placeholder="添加描述..."
+                  autoSize={{ minRows: 1 }}
+                  value={descVal}
+                  onChange={e => {
+                    setDescVal(e.target.value);
+                    handleNodeValueChange({ desc: e.target.value });
+                  }}
+                />
+              )}
+            </div>
+          )}
         </>
       }
     >
diff --git a/packages/x-flow/src/nodes/node-switch/SwitchBuildInNodeWidget.tsx b/packages/x-flow/src/nodes/node-switch/SwitchBuildInNodeWidget.tsx
@@ -1,4 +1,4 @@
-import { Flex, Typography } from 'antd';
+import { Space, Typography } from 'antd';
 import React, { memo } from 'react';
 import SourceHandle from '../../components/CustomNode/sourceHandle';
 import './index.less';
@@ -17,7 +17,7 @@ export default memo((props: any) => {
   } = props;
 
   return (
-    <Flex vertical className="node-switch-widget" gap={5}>
+    <Space direction='vertical' className="node-switch-widget" size={5}>
       {(data?.list || [{}])?.map((item, index) => (
         <div className="node-switch-widget-item" key={index}>
           <div className="item-header">
@@ -75,6 +75,6 @@ export default memo((props: any) => {
           />
         </div>
       </div>
-    </Flex>
+    </Space>
   );
 });
diff --git a/packages/x-flow/src/nodes/node-switch/index.less b/packages/x-flow/src/nodes/node-switch/index.less
@@ -27,6 +27,7 @@
 }
 
 .node-switch-widget {
+  width: 100%;
 
   .item-header {
     position: relative;

Original file line number	Diff line number	Diff line change
`@@ -59,6 +59,7 @@ export default [`
`59`	`59`	`type: 'icon-model',`
`60`	`60`	`bgColor: '#6172F3',`
`61`	`61`	`},`
	`62`	`+ hideDesc:true // 隐藏配置面板描述信息`
`62`	`63`	`},`
`63`	`64`	`{`
`64`	`65`	`title: 'Prompt',`
Original file line number	Diff line number	Diff line change
`@@ -56,7 +56,7 @@`
`56`	`56`	`border-color: #fff;`
`57`	`57`	`}`
`58`	`58`	`textarea {`
`59`		`- margin: 12px 0;`
	`59`	`+ margin-top: 12px;`
`60`	`60`	`}`
`61`	`61`	`}`
`62`	`62`
`@@ -122,4 +122,4 @@`
`122`	`122`	`font-size: 12px;`
`123`	`123`	`}`
`124`	`124`	`}`
`125`		`-}`
	`125`	`+}`
Original file line number	Diff line number	Diff line change
`@@ -27,6 +27,7 @@`
`27`	`27`	`}`
`28`	`28`
`29`	`29`	`.node-switch-widget {`
	`30`	`+ width: 100%;`
`30`	`31`
`31`	`32`	`.item-header {`
`32`	`33`	`position: relative;`