diff --git a/service-web/client/src/components/flow/node/AmisNode.tsx b/service-web/client/src/components/flow/node/AmisNode.tsx index 0567eb7..e5d7b0d 100644 --- a/service-web/client/src/components/flow/node/AmisNode.tsx +++ b/service-web/client/src/components/flow/node/AmisNode.tsx @@ -104,14 +104,13 @@ export function inputsFormColumns( ] } -export function outputsFormColumns(editable: boolean = false, required: boolean = false, preload?: any): Schema[] { +export function outputsFormColumns(editable: boolean = false, required: boolean = false): Schema[] { return [ { disabled: !editable, type: 'input-kvs', name: 'outputs', label: '输出变量', - value: preload, addButtonText: '新增输出', draggable: false, keyItem: { @@ -155,7 +154,7 @@ type AmisNodeProps = { nodeProps: NodeProps defaultNodeName: String defaultNodeDescription?: String - extraNodeDescription?: (nodeData: any) => JSX.Element + extraNodeDescription?: JSX.Element handler: JSX.Element columnSchema?: () => Schema[] } @@ -338,7 +337,7 @@ const AmisNode: (props: AmisNodeProps) => JSX.Element = ({ >
{nodeDescription} - {extraNodeDescription?.(nodeData)} + {extraNodeDescription}
{handler} diff --git a/service-web/client/src/components/flow/node/CodeNode.tsx b/service-web/client/src/components/flow/node/CodeNode.tsx index 01f9124..3b8cd23 100644 --- a/service-web/client/src/components/flow/node/CodeNode.tsx +++ b/service-web/client/src/components/flow/node/CodeNode.tsx @@ -1,5 +1,5 @@ import type {NodeProps} from '@xyflow/react' -import React from 'react' +import React, {useCallback, useEffect} from 'react' import {useContextStore} from '../store/ContextStore.ts' import {useDataStore} from '../store/DataStore.ts' import {useFlowStore} from '../store/FlowStore.ts' @@ -7,53 +7,68 @@ import AmisNode, {inputsFormColumns, NormalNodeHandler, outputsFormColumns} from const CodeNode = (props: NodeProps) => { const {getNodes, getEdges} = useFlowStore() - const {getData} = useDataStore() + const {getData, mergeDataById} = useDataStore() const {getInputSchema} = useContextStore() + + useEffect(() => { + mergeDataById( + props.id, + { + outputs: { + result: { + type: 'string', + }, + }, + }, + ) + }, [props.id]) + + const columnsSchema = useCallback(() => [ + ...inputsFormColumns(props.id, getInputSchema(), getNodes(), getEdges(), getData()), + { + type: 'divider', + }, + { + type: 'select', + name: 'type', + label: '代码类型', + required: true, + options: [ + { + value: 'javascript', + label: 'JavaScript', + }, + { + value: 'python', + label: 'Python', + }, + { + value: 'lua', + label: 'Lua', + }, + ], + }, + { + type: 'editor', + required: true, + label: '代码内容', + name: 'content', + language: '${type}', + options: { + wordWrap: 'bounded', + }, + }, + { + type: 'divider', + }, + ...outputsFormColumns(true, true), + ], [props.id]) return ( [ - ...inputsFormColumns(props.id, getInputSchema(), getNodes(), getEdges(), getData()), - { - type: 'divider', - }, - { - type: 'select', - name: 'type', - label: '代码类型', - required: true, - options: [ - { - value: 'javascript', - label: 'JavaScript', - }, - { - value: 'python', - label: 'Python', - }, - { - value: 'lua', - label: 'Lua', - }, - ], - }, - { - type: 'editor', - required: true, - label: '代码内容', - name: 'content', - language: '${type}', - options: { - wordWrap: 'bounded', - }, - }, - { - type: 'divider', - }, - ...outputsFormColumns(true, true, {result: {type: 'string'}}), - ]} + columnSchema={columnsSchema} handler={} /> ) diff --git a/service-web/client/src/components/flow/node/KnowledgeNode.tsx b/service-web/client/src/components/flow/node/KnowledgeNode.tsx index cdfed5e..7afef4b 100644 --- a/service-web/client/src/components/flow/node/KnowledgeNode.tsx +++ b/service-web/client/src/components/flow/node/KnowledgeNode.tsx @@ -1,5 +1,5 @@ import type {NodeProps} from '@xyflow/react' -import React from 'react' +import React, {useCallback, useEffect} from 'react' import {commonInfo} from '../../../util/amis.tsx' import {useContextStore} from '../store/ContextStore.ts' import {useDataStore} from '../store/DataStore.ts' @@ -8,66 +8,81 @@ import AmisNode, {inputsFormColumns, NormalNodeHandler, outputsFormColumns} from const KnowledgeNode = (props: NodeProps) => { const {getNodes, getEdges} = useFlowStore() - const {getData} = useDataStore() + const {getData, mergeDataById} = useDataStore() const {getInputSchema} = useContextStore() + + useEffect(() => { + mergeDataById( + props.id, + { + outputs: { + result: { + type: 'array-string', + }, + }, + }, + ) + }, [props.id]) + + const columnsSchema = useCallback(() => [ + ...inputsFormColumns(props.id, getInputSchema(), getNodes(), getEdges(), getData()), + { + type: 'divider', + }, + { + type: 'select', + name: 'knowledgeId', + label: '知识库', + required: true, + options: [], + source: { + method: 'get', + url: `${commonInfo.baseAiUrl}/knowledge/list`, + // @ts-ignore + adaptor: (payload, response, api, context) => { + return { + ...payload, + data: { + items: payload.data.items.map((item: any) => ({value: item['id'], label: item['name']})), + }, + } + }, + }, + }, + { + type: 'input-text', + name: 'query', + label: '查询文本', + required: true, + }, + { + type: 'input-range', + name: 'count', + label: '返回数量', + required: true, + value: 3, + max: 10, + }, + { + type: 'input-range', + name: 'score', + label: '匹配阀值', + required: true, + value: 0.6, + max: 1, + step: 0.05, + }, + { + type: 'divider', + }, + ...outputsFormColumns(false, true), + ], [props.id]) return ( [ - ...inputsFormColumns(props.id, getInputSchema(), getNodes(), getEdges(), getData()), - { - type: 'divider', - }, - { - type: 'select', - name: 'knowledgeId', - label: '知识库', - required: true, - options: [], - source: { - method: 'get', - url: `${commonInfo.baseAiUrl}/knowledge/list`, - // @ts-ignore - adaptor: (payload, response, api, context) => { - return { - ...payload, - data: { - items: payload.data.items.map((item: any) => ({value: item['id'], label: item['name']})), - }, - } - }, - }, - }, - { - type: 'input-text', - name: 'query', - label: '查询文本', - required: true, - }, - { - type: 'input-range', - name: 'count', - label: '返回数量', - required: true, - value: 3, - max: 10, - }, - { - type: 'input-range', - name: 'score', - label: '匹配阀值', - required: true, - value: 0.6, - max: 1, - step: 0.05, - }, - { - type: 'divider', - }, - ...outputsFormColumns(false, true, {result: {type: 'array-string'}}), - ]} + columnSchema={columnsSchema} handler={} /> ) diff --git a/service-web/client/src/components/flow/node/LlmNode.tsx b/service-web/client/src/components/flow/node/LlmNode.tsx index 29994a4..57beb38 100644 --- a/service-web/client/src/components/flow/node/LlmNode.tsx +++ b/service-web/client/src/components/flow/node/LlmNode.tsx @@ -1,6 +1,6 @@ import type {NodeProps} from '@xyflow/react' import {Tag} from 'antd' -import React from 'react' +import React, {useCallback, useEffect, useState} from 'react' import {useContextStore} from '../store/ContextStore.ts' import {useDataStore} from '../store/DataStore.ts' import {useFlowStore} from '../store/FlowStore.ts' @@ -13,46 +13,63 @@ const modelMap: Record = { const LlmNode = (props: NodeProps) => { const {getNodes, getEdges} = useFlowStore() - const {getData} = useDataStore() + const {getData, mergeDataById, getDataById} = useDataStore() const {getInputSchema} = useContextStore() + + const [nodeData, setNodeData] = useState() + + useEffect(() => { + mergeDataById( + props.id, + { + outputs: { + text: { + type: 'string', + }, + }, + }, + ) + setNodeData(getDataById(props.id)) + }, [props.id]) + + const columnsSchema = useCallback(() => [ + ...inputsFormColumns(props.id, getInputSchema(), getNodes(), getEdges(), getData()), + { + type: 'divider', + }, + { + type: 'select', + name: 'model', + label: '大模型', + required: true, + selectFirst: true, + options: Object.keys(modelMap).map(key => ({label: modelMap[key], value: key})), + }, + { + type: 'textarea', + name: 'systemPrompt', + label: '系统提示词', + required: true, + }, + { + type: 'divider', + }, + ...outputsFormColumns(false, true), + ], [props.id]) return ( { - const model = nodeData?.model as string | undefined - return model + extraNodeDescription={ + nodeData?.model ?
大模型 - {modelMap[model]} + {modelMap[nodeData.model]}
: <> - }} - columnSchema={() => [ - ...inputsFormColumns(props.id, getInputSchema(), getNodes(), getEdges(), getData()), - { - type: 'divider', - }, - { - type: 'select', - name: 'model', - label: '大模型', - required: true, - selectFirst: true, - options: Object.keys(modelMap).map(key => ({label: modelMap[key], value: key})), - }, - { - type: 'textarea', - name: 'systemPrompt', - label: '系统提示词', - required: true, - }, - { - type: 'divider', - }, - ...outputsFormColumns(false, true, {text: {type: 'string'}}), - ]} + } + columnSchema={columnsSchema} handler={} /> ) diff --git a/service-web/client/src/components/flow/node/OutputNode.tsx b/service-web/client/src/components/flow/node/OutputNode.tsx index c8f37fc..f58d9f0 100644 --- a/service-web/client/src/components/flow/node/OutputNode.tsx +++ b/service-web/client/src/components/flow/node/OutputNode.tsx @@ -1,14 +1,16 @@ import type {NodeProps} from '@xyflow/react' -import React from 'react' +import React, {useCallback} from 'react' import AmisNode, {EndNodeHandler, outputsFormColumns} from './AmisNode.tsx' const OutputNode = (props: NodeProps) => { + const columnsSchema = useCallback(() => outputsFormColumns(true), [props.id]) + return ( outputsFormColumns(true)} + columnSchema={columnsSchema} handler={} /> ) diff --git a/service-web/client/src/components/flow/node/SwitchNode.tsx b/service-web/client/src/components/flow/node/SwitchNode.tsx index f5be15a..80aa404 100644 --- a/service-web/client/src/components/flow/node/SwitchNode.tsx +++ b/service-web/client/src/components/flow/node/SwitchNode.tsx @@ -21,17 +21,15 @@ const SwitchNode = (props: NodeProps) => { nodeProps={props} defaultNodeName="分支节点" defaultNodeDescription="根据不同的情况前往不同的分支" - extraNodeDescription={() => { - return ( -
- {cases.map(item => ( -
- 分支 {item.index} -
- ))} -
- ) - }} + extraNodeDescription={ +
+ {cases.map(item => ( +
+ 分支 {item.index} +
+ ))} +
+ } handler={ <> diff --git a/service-web/client/src/components/flow/store/DataStore.ts b/service-web/client/src/components/flow/store/DataStore.ts index 4603947..3fc26fc 100644 --- a/service-web/client/src/components/flow/store/DataStore.ts +++ b/service-web/client/src/components/flow/store/DataStore.ts @@ -6,6 +6,7 @@ export type DataStoreState = { setData: (data: Record) => void, getDataById: (id: string) => any, setDataById: (id: string, data: any) => void, + mergeDataById: (id: string, data: any) => void, } export const useDataStore = create((set, get) => ({ @@ -22,4 +23,14 @@ export const useDataStore = create((set, get) => ({ data: updateData, }) }, + mergeDataById: (id, data) => { + let updateData = get().data + updateData[id] = { + ...(updateData[id] ?? {}), + ...data, + } + set({ + data: updateData, + }) + }, })) \ No newline at end of file