style(flowEditor):优化节点内容渲染逻辑

master
钟良源 3 months ago
parent 7237faaebd
commit 797487aaea

@ -2,7 +2,6 @@ import React, { useMemo } from 'react';
import styles from '@/components/FlowEditor/node/style/baseOther.module.less';
import { Handle, Position, useStore } from '@xyflow/react';
import { deserializeValue, isJSON } from '@/utils/common';
import cronstrue from 'cronstrue/i18n';
interface NodeContentData {
parameters?: {
@ -224,25 +223,25 @@ const NodeContent = ({ data }: { data: NodeContentData }) => {
<div className={styles['node-api-box']}>
<div className={styles['node-content-api']}>
{apiIns.length > 0 && (
<div className={styles['node-inputs']}>
{apiIns.map((input, index) => {
// 查找关联的事件分组
const group = findApiGroupByTopic(input, eventGroups);
return (
<div
key={input.eventId || `input-${index}`}
className={styles['node-input-label']}
style={{
color: group ? group.color : '#000'
}}
>
{isValidApi(input) ? input.name : ''}
</div>
);
})}
</div>
)}
{/*{apiIns.length > 0 && (*/}
<div className={styles['node-inputs']}>
{apiIns.map((input, index) => {
// 查找关联的事件分组
const group = findApiGroupByTopic(input, eventGroups);
return (
<div
key={input.eventId || `input-${index}`}
className={styles['node-input-label']}
style={{
color: group ? group.color : '#000'
}}
>
{isValidApi(input) ? input.name : ''}
</div>
);
})}
</div>
{/*)}*/}
{apiOuts.length > 0 && (
<div className={styles['node-outputs']}>
@ -273,25 +272,25 @@ const NodeContent = ({ data }: { data: NodeContentData }) => {
{/*content栏-data部分*/}
<div className={styles['node-data-box']}>
<div className={styles['node-content']}>
{dataIns.length > 0 && (
<div className={styles['node-inputs']}>
{dataIns.map((input, index) => {
// 查找关联的事件分组
const group = findRelatedEventGroup(input, eventGroups, 'eventSends');
return (
<div
key={input.id || `input-${index}`}
className={styles['node-input-label']}
style={{
color: group ? group.color : '#000'
}}
>
{isValidData(input) ? `${input.name || input.id} ${input?.dataType}` : ''}
</div>
);
})}
</div>
)}
{/*{dataIns.length > 0 && (*/}
<div className={styles['node-inputs']}>
{dataIns.map((input, index) => {
// 查找关联的事件分组
const group = findRelatedEventGroup(input, eventGroups, 'eventSends');
return (
<div
key={input.id || `input-${index}`}
className={styles['node-input-label']}
style={{
color: group ? group.color : '#000'
}}
>
{isValidData(input) ? `${input.name || input.id} ${input?.dataType}` : ''}
</div>
);
})}
</div>
{/*)}*/}
{dataOuts.length > 0 && (
<div className={styles['node-outputs']}>

Loading…
Cancel
Save