mirror of
https://github.com/infiniflow/ragflow.git
synced 2025-12-08 20:42:30 +08:00
### What problem does this PR solve? feat: display the debugging results of each operator in a pop-up window #918 ### Type of change - [x] New Feature (non-breaking change which adds functionality)
This commit is contained in:
@ -9,6 +9,7 @@ import { NodeData } from '../../interface';
|
||||
import OperatorIcon from '../../operator-icon';
|
||||
import NodeDropdown from './dropdown';
|
||||
import styles from './index.less';
|
||||
import NodePopover from './popover';
|
||||
|
||||
export function RagNode({
|
||||
id,
|
||||
@ -18,53 +19,54 @@ export function RagNode({
|
||||
}: NodeProps<NodeData>) {
|
||||
const style = operatorMap[data.label as Operator];
|
||||
const { t } = useTranslate('flow');
|
||||
return (
|
||||
<section
|
||||
className={classNames(styles.ragNode, {
|
||||
[styles.selectedNode]: selected,
|
||||
})}
|
||||
style={pick(style, ['backgroundColor', 'width', 'height', 'color'])}
|
||||
>
|
||||
<Handle
|
||||
id="c"
|
||||
type="source"
|
||||
position={Position.Left}
|
||||
isConnectable={isConnectable}
|
||||
className={styles.handle}
|
||||
></Handle>
|
||||
<Handle type="source" position={Position.Top} id="d" isConnectable />
|
||||
<Handle
|
||||
type="source"
|
||||
position={Position.Right}
|
||||
isConnectable={isConnectable}
|
||||
className={styles.handle}
|
||||
id="b"
|
||||
></Handle>
|
||||
<Handle type="source" position={Position.Bottom} id="a" isConnectable />
|
||||
<Flex
|
||||
vertical
|
||||
align="center"
|
||||
justify={'center'}
|
||||
gap={data.label === Operator.RewriteQuestion ? 0 : 6}
|
||||
>
|
||||
<OperatorIcon
|
||||
name={data.label as Operator}
|
||||
fontSize={style['iconFontSize'] ?? 24}
|
||||
></OperatorIcon>
|
||||
<span
|
||||
className={styles.type}
|
||||
style={{ fontSize: style.fontSize ?? 14 }}
|
||||
>
|
||||
{data.label === Operator.RewriteQuestion
|
||||
? t(lowerFirst('Rewrite'))
|
||||
: t(lowerFirst(data.label))}
|
||||
</span>
|
||||
<NodeDropdown id={id}></NodeDropdown>
|
||||
</Flex>
|
||||
|
||||
<section className={styles.bottomBox}>
|
||||
<div className={styles.nodeName}>{data.name}</div>
|
||||
return (
|
||||
<NodePopover nodeId={id}>
|
||||
<section
|
||||
className={classNames(styles.ragNode, {
|
||||
[styles.selectedNode]: selected,
|
||||
})}
|
||||
style={pick(style, ['backgroundColor', 'width', 'height', 'color'])}
|
||||
>
|
||||
<Handle
|
||||
id="c"
|
||||
type="source"
|
||||
position={Position.Left}
|
||||
isConnectable={isConnectable}
|
||||
className={styles.handle}
|
||||
></Handle>
|
||||
<Handle type="source" position={Position.Top} id="d" isConnectable />
|
||||
<Handle
|
||||
type="source"
|
||||
position={Position.Right}
|
||||
isConnectable={isConnectable}
|
||||
className={styles.handle}
|
||||
id="b"
|
||||
></Handle>
|
||||
<Handle type="source" position={Position.Bottom} id="a" isConnectable />
|
||||
<Flex
|
||||
vertical
|
||||
align="center"
|
||||
justify={'center'}
|
||||
gap={data.label === Operator.RewriteQuestion ? 0 : 6}
|
||||
>
|
||||
<OperatorIcon
|
||||
name={data.label as Operator}
|
||||
fontSize={style['iconFontSize'] ?? 24}
|
||||
></OperatorIcon>
|
||||
<span
|
||||
className={styles.type}
|
||||
style={{ fontSize: style.fontSize ?? 14 }}
|
||||
>
|
||||
{t(lowerFirst(data.label))}
|
||||
</span>
|
||||
<NodeDropdown id={id}></NodeDropdown>
|
||||
</Flex>
|
||||
|
||||
<section className={styles.bottomBox}>
|
||||
<div className={styles.nodeName}>{data.name}</div>
|
||||
</section>
|
||||
</section>
|
||||
</section>
|
||||
</NodePopover>
|
||||
);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user