2 Commits

Author SHA1 Message Date
267eecbf45 refactor(ai-web): 使用输入节点代替inputSchema
将输入表单放在流程图中一起定义,方便统一参数的处理,不需要单独为输入表单的变量进行合并和操作
2025-07-20 19:27:09 +08:00
a5282762ed refractor(web): 增加输入节点 2025-07-20 17:17:22 +08:00
28 changed files with 563 additions and 449 deletions

View File

@@ -89,7 +89,10 @@
<dependency>
<groupId>com.yomahub</groupId>
<artifactId>liteflow-script-graaljs</artifactId>
<version>${liteflow.version}</version>
</dependency>
<dependency>
<groupId>com.yomahub</groupId>
<artifactId>liteflow-script-python</artifactId>
</dependency>
<dependency>

View File

@@ -1,5 +1,6 @@
package com.lanyuanxiaoyao.service.ai.web.controller.task;
import cn.hutool.core.util.ObjectUtil;
import com.fasterxml.jackson.core.JsonProcessingException;
import com.fasterxml.jackson.core.type.TypeReference;
import com.fasterxml.jackson.databind.ObjectMapper;
@@ -41,6 +42,12 @@ public class TaskTemplateController extends SimpleControllerSupport<FlowTaskTemp
return AmisResponse.responseSuccess(mapper.readValue(template.getInputSchema(), Map.class));
}
@GetMapping("flow_graph/{id}")
public AmisResponse<?> getFlowGraph(@PathVariable("id") Long id) throws JsonProcessingException {
var template = flowTaskTemplateService.detailOrThrow(id);
return AmisResponse.responseSuccess(mapper.readValue(template.getFlowGraph(), Map.class));
}
@PostMapping("update_flow_graph")
public AmisResponse<?> updateFlowGraph(@RequestBody UpdateGraphItem item) throws JsonProcessingException {
flowTaskTemplateService.updateFlowGraph(item.getId(), mapper.writeValueAsString(item.getGraph()));
@@ -49,8 +56,7 @@ public class TaskTemplateController extends SimpleControllerSupport<FlowTaskTemp
@Override
protected SaveItemMapper<FlowTaskTemplate, SaveItem> saveItemMapper() {
var map = Mappers.getMapper(SaveItem.Mapper.class);
return item -> map.from(item, mapper);
return Mappers.getMapper(SaveItem.Mapper.class);
}
@Override
@@ -69,15 +75,9 @@ public class TaskTemplateController extends SimpleControllerSupport<FlowTaskTemp
private Long id;
private String name;
private String description;
private Map<String, Object> inputSchema;
@org.mapstruct.Mapper
public static abstract class Mapper {
public abstract FlowTaskTemplate from(SaveItem saveItem, @Context ObjectMapper mapper) throws Exception;
protected String mapInputSchema(Map<String, Object> inputSchema, @Context ObjectMapper mapper) throws JsonProcessingException {
return mapper.writeValueAsString(inputSchema);
}
public interface Mapper extends SaveItemMapper<FlowTaskTemplate, SaveItem> {
}
}
@@ -105,6 +105,9 @@ public class TaskTemplateController extends SimpleControllerSupport<FlowTaskTemp
public abstract DetailItem from(FlowTaskTemplate template, @Context ObjectMapper mapper) throws Exception;
public Map<String, Object> mapJson(String source, @Context ObjectMapper mapper) throws Exception {
if (ObjectUtil.isNull(source)) {
return null;
}
return mapper.readValue(source, new TypeReference<>() {
});
}

View File

@@ -47,11 +47,6 @@ public class FlowHelper {
throw new RuntimeException(StrUtil.format("Target node variable not found: {}.{}", targetNodeId, targetVariableName));
}
return targetNodeData.get(targetVariableName);
} else if (context.getInput().containsKey(expression)) {
if (!context.getInput().containsKey(expression)) {
throw new RuntimeException(StrUtil.format("Target variable not found in input {}", expression));
}
return context.getInput().get(expression);
}
return null;
}

View File

@@ -2,12 +2,10 @@ package com.lanyuanxiaoyao.service.ai.web.engine.entity;
import lombok.Data;
import org.eclipse.collections.api.factory.Maps;
import org.eclipse.collections.api.map.ImmutableMap;
import org.eclipse.collections.api.map.MutableMap;
@Data
public class FlowContext {
private ImmutableMap<String, Object> input = Maps.immutable.empty();
private MutableMap<String, MutableMap<String, Object>> data = Maps.mutable.<String, MutableMap<String, Object>>empty().asSynchronized();
public MutableMap<String, Object> get(String key) {

View File

@@ -0,0 +1,16 @@
package com.lanyuanxiaoyao.service.ai.web.engine.node;
import com.lanyuanxiaoyao.service.ai.web.engine.FlowNodeRunner;
import lombok.extern.slf4j.Slf4j;
/**
* @author lanyuanxiaoyao
* @version 20250711
*/
@Slf4j
public class InputNode extends FlowNodeRunner {
@Override
public void run() {
// 入参相关的内容在启动流程的时候已经注入了
}
}

View File

@@ -0,0 +1,14 @@
package com.lanyuanxiaoyao.service.ai.web.entity.vo;
import com.lanyuanxiaoyao.service.ai.web.engine.entity.FlowEdge;
import com.lanyuanxiaoyao.service.ai.web.engine.entity.FlowNode;
import lombok.Data;
import org.eclipse.collections.api.map.MutableMap;
import org.eclipse.collections.api.set.ImmutableSet;
@Data
public class FlowGraphVo {
private ImmutableSet<FlowNode> nodes;
private ImmutableSet<FlowEdge> edges;
private MutableMap<String, MutableMap<String, Object>> data;
}

View File

@@ -7,9 +7,7 @@ import com.lanyuanxiaoyao.service.ai.web.entity.context.FeedbackContext;
import com.lanyuanxiaoyao.service.ai.web.repository.FeedbackRepository;
import com.yomahub.liteflow.core.FlowExecutor;
import java.util.List;
import java.util.concurrent.TimeUnit;
import lombok.extern.slf4j.Slf4j;
import org.springframework.scheduling.annotation.Scheduled;
import org.springframework.stereotype.Service;
import org.springframework.transaction.annotation.Transactional;
@@ -24,7 +22,7 @@ import org.springframework.transaction.annotation.Transactional;
this.executor = executor;
}
@Scheduled(initialDelay = 1, fixedDelay = 1, timeUnit = TimeUnit.MINUTES)
// @Scheduled(initialDelay = 1, fixedDelay = 1, timeUnit = TimeUnit.MINUTES)
public void analysis() {
List<Feedback> feedbacks = repository.findAll(
builder -> builder

View File

@@ -1,30 +1,29 @@
package com.lanyuanxiaoyao.service.ai.web.service.task;
import cn.hutool.core.util.IdUtil;
import cn.hutool.core.util.ObjectUtil;
import cn.hutool.core.util.StrUtil;
import com.fasterxml.jackson.core.JsonProcessingException;
import com.fasterxml.jackson.core.type.TypeReference;
import com.fasterxml.jackson.databind.ObjectMapper;
import com.lanyuanxiaoyao.service.ai.web.base.service.SimpleServiceSupport;
import com.lanyuanxiaoyao.service.ai.web.engine.FlowExecutor;
import com.lanyuanxiaoyao.service.ai.web.engine.entity.FlowContext;
import com.lanyuanxiaoyao.service.ai.web.engine.entity.FlowEdge;
import com.lanyuanxiaoyao.service.ai.web.engine.entity.FlowGraph;
import com.lanyuanxiaoyao.service.ai.web.engine.entity.FlowNode;
import com.lanyuanxiaoyao.service.ai.web.engine.node.CodeNode;
import com.lanyuanxiaoyao.service.ai.web.engine.node.InputNode;
import com.lanyuanxiaoyao.service.ai.web.engine.node.LlmNode;
import com.lanyuanxiaoyao.service.ai.web.engine.node.LoopNode;
import com.lanyuanxiaoyao.service.ai.web.engine.node.OutputNode;
import com.lanyuanxiaoyao.service.ai.web.engine.node.SwitchNode;
import com.lanyuanxiaoyao.service.ai.web.engine.store.InMemoryFlowStore;
import com.lanyuanxiaoyao.service.ai.web.entity.FlowTask;
import com.lanyuanxiaoyao.service.ai.web.entity.vo.FlowGraphVo;
import com.lanyuanxiaoyao.service.ai.web.repository.FlowTaskRepository;
import java.lang.reflect.InvocationTargetException;
import java.util.Map;
import lombok.Data;
import lombok.extern.slf4j.Slf4j;
import org.eclipse.collections.api.factory.Maps;
import org.eclipse.collections.api.map.MutableMap;
import org.eclipse.collections.api.set.ImmutableSet;
import org.springframework.http.converter.json.Jackson2ObjectMapperBuilder;
import org.springframework.stereotype.Service;
@@ -42,7 +41,6 @@ public class FlowTaskService extends SimpleServiceSupport<FlowTask> {
var flowTask = detailOrThrow(id);
var graphVo = mapper.readValue(flowTask.getTemplateFlowGraph(), FlowGraphVo.class);
var flowGraph = new FlowGraph(IdUtil.fastUUID(), graphVo.getNodes(), graphVo.getEdges());
log.info("Graph: {}", flowGraph);
var store = new InMemoryFlowStore();
var executor = new FlowExecutor(
@@ -52,19 +50,25 @@ public class FlowTaskService extends SimpleServiceSupport<FlowTask> {
"switch-node", SwitchNode.class,
"code-node", CodeNode.class,
"llm-node", LlmNode.class,
"input-node", InputNode.class,
"output-node", OutputNode.class
))
);
FlowContext context = new FlowContext();
context.setInput(mapper.readValue(flowTask.getInput(), new TypeReference<>() {}));
context.setData(graphVo.getData());
// 如果发现输入节点,将相关数据注入到对应节点的上下文中
var inputNode = flowGraph.nodes()
.detectOptional(node -> StrUtil.equals(node.type(), "input-node") && ObjectUtil.isEmpty(node.parentId()))
.orElse(null);
if (ObjectUtil.isNotNull(inputNode)) {
if (!context.getData().containsKey(inputNode.id())) {
context.getData().put(inputNode.id(), Maps.mutable.empty());
}
context.getData().get(inputNode.id()).putAll(mapper.readValue(flowTask.getInput(), new TypeReference<>() {
}));
}
executor.execute(flowGraph, context);
}
@Data
public static final class FlowGraphVo {
private ImmutableSet<FlowNode> nodes;
private ImmutableSet<FlowEdge> edges;
private MutableMap<String, MutableMap<String, Object>> data;
}
}

View File

@@ -1,22 +1,47 @@
package com.lanyuanxiaoyao.service.ai.web.service.task;
import cn.hutool.core.util.ObjectUtil;
import cn.hutool.core.util.StrUtil;
import com.fasterxml.jackson.core.JsonProcessingException;
import com.fasterxml.jackson.databind.ObjectMapper;
import com.lanyuanxiaoyao.service.ai.web.base.service.SimpleServiceSupport;
import com.lanyuanxiaoyao.service.ai.web.entity.FlowTaskTemplate;
import com.lanyuanxiaoyao.service.ai.web.entity.vo.FlowGraphVo;
import com.lanyuanxiaoyao.service.ai.web.repository.FlowTaskTemplateRepository;
import lombok.extern.slf4j.Slf4j;
import org.springframework.http.converter.json.Jackson2ObjectMapperBuilder;
import org.springframework.stereotype.Service;
import org.springframework.transaction.annotation.Transactional;
@Slf4j
@Service
public class FlowTaskTemplateService extends SimpleServiceSupport<FlowTaskTemplate> {
public FlowTaskTemplateService(FlowTaskTemplateRepository flowTaskTemplateRepository) {
private final ObjectMapper mapper;
public FlowTaskTemplateService(FlowTaskTemplateRepository flowTaskTemplateRepository, Jackson2ObjectMapperBuilder builder) {
super(flowTaskTemplateRepository);
this.mapper = builder.build();
}
@Transactional(rollbackFor = Exception.class)
public void updateFlowGraph(Long id, String flowGraph) {
public void updateFlowGraph(Long id, String flowGraph) throws JsonProcessingException {
var template = detailOrThrow(id);
var graph = mapper.readValue(flowGraph, FlowGraphVo.class);
// 如果发现输入节点,就单独提取出来
var inputNode = graph.getNodes()
.detectOptional(node -> StrUtil.equals(node.type(), "input-node") && ObjectUtil.isEmpty(node.parentId()))
.orElse(null);
if (ObjectUtil.isNotNull(inputNode)) {
var nodeId = inputNode.id();
var nodeData = graph.getData().getOrDefault(nodeId, null);
if (ObjectUtil.isNotNull(nodeData) && nodeData.containsKey("inputs")) {
template.setInputSchema(mapper.writeValueAsString(nodeData.get("inputs")));
}
} else {
template.setInputSchema("{}");
}
template.setFlowGraph(flowGraph);
save(template);
}

View File

@@ -20,8 +20,21 @@ export class CheckError extends Error {
const getNodeById = (id: string, nodes: Node[]) => find(nodes, (n: Node) => isEqual(n.id, id))
export const typeNotFound = (type: string) => new CheckError(100, `类型 ${type} 不存在`)
export const addNodeError = (message?: string) => new CheckError(101, message ?? '无法添加节点')
// @ts-ignore
export const checkAddNode: (type: string, nodes: Node[], edges: Edge[]) => void = (type, nodes, edges) => {
export const checkAddNode: (type: string, parentId: string | undefined, nodes: Node[], edges: Edge[]) => void = (type, parentId, nodes, edges) => {
let nodeDefine = NodeRegistryMap[type]
if (!nodeDefine) {
throw typeNotFound(type)
}
for (const checker of nodeDefine.checkers.add) {
let checkResult = checker(type, parentId, nodes, edges, undefined)
if (checkResult.error) {
throw addNodeError(checkResult.message)
}
}
}
export const sourceNodeNotFoundError = () => new CheckError(200, '连线起始节点未找到')
@@ -70,18 +83,17 @@ export const checkAddConnection: (connection: Connection, nodes: Node[], edges:
export const atLeastOneNode = () => new CheckError(300, '至少包含一个节点')
export const hasUnfinishedNode = (nodeId: string) => new CheckError(301, `存在尚未配置完成的节点: ${nodeId}`)
export const nodeTypeNotFound = () => new CheckError(302, '节点类型不存在')
export const nodeError = (nodeId: string, reason?: string) => new CheckError(303, reason ?? `节点配置存在错误:${nodeId}`)
export const saveNodeError = (nodeId: string, reason?: string) => new CheckError(303, reason ?? `节点配置存在错误:${nodeId}`)
// @ts-ignore
export const checkSave: (inputSchema: Record<string, Record<string, any>>, nodes: Node[], edges: Edge[], data: any) => void = (inputSchema, nodes, edges, data) => {
export const checkSave: (nodes: Node[], edges: Edge[], data: any) => void = (nodes, edges, data) => {
if (isEmpty(nodes)) {
throw atLeastOneNode()
}
for (let node of nodes) {
let nodeId = node.id
if (!has(data, nodeId) || !data[nodeId]?.finished) {
throw hasUnfinishedNode(nodeId)
if (!has(data, node.id) || !data[node.id]?.finished) {
throw hasUnfinishedNode(node.id)
}
if (!has(node, 'type')) {
@@ -89,10 +101,10 @@ export const checkSave: (inputSchema: Record<string, Record<string, any>>, nodes
}
let nodeType = node.type!
let nodeDefine = NodeRegistryMap[nodeType]
for (let checker of nodeDefine.checkers) {
let checkResult = checker(nodeId, inputSchema, nodes, edges, data)
for (let checker of nodeDefine.checkers.save) {
let checkResult = checker(node.id, node.parentId, nodes, edges, data)
if (checkResult.error) {
throw nodeError(nodeId, checkResult.message)
throw saveNodeError(node.id, checkResult.message)
}
}
}

View File

@@ -11,7 +11,6 @@ import AddNodeButton from './component/AddNodeButton.tsx'
import {checkAddConnection, checkSave} from './FlowChecker.tsx'
import {useNodeDrag} from './Helper.tsx'
import {NodeRegistryMap} from './NodeRegistry.tsx'
import {useContextStore} from './store/ContextStore.ts'
import {useDataStore} from './store/DataStore.ts'
import {useFlowStore} from './store/FlowStore.ts'
import {flowDotColor, type FlowEditorProps} from './types.ts'
@@ -46,7 +45,6 @@ const FlowableDiv = styled.div`
function FlowEditor(props: FlowEditorProps) {
const navigate = useNavigate()
const [messageApi, contextHolder] = message.useMessage()
const {data, setData} = useDataStore()
const {
@@ -59,8 +57,6 @@ function FlowEditor(props: FlowEditorProps) {
onConnect,
} = useFlowStore()
const {inputSchema, setInputSchema} = useContextStore()
useEffect(() => {
// language=JSON
// let initialData = JSON.parse('{"nodes":[{"id":"TCxPixrdkI","type":"start-node","position":{"x":-256,"y":109.5},"data":{},"measured":{"width":256,"height":83},"selected":false,"dragging":false},{"id":"tGs78_ietp","type":"llm-node","position":{"x":108,"y":-2.5},"data":{},"measured":{"width":256,"height":105},"selected":false,"dragging":false},{"id":"OeZdaU7LpY","type":"llm-node","position":{"x":111,"y":196},"data":{},"measured":{"width":256,"height":105},"selected":false,"dragging":false},{"id":"LjfoCYZo-E","type":"knowledge-node","position":{"x":497.62196259607214,"y":-10.792497317791003},"data":{},"measured":{"width":256,"height":75},"selected":false,"dragging":false},{"id":"sQM_22GYB5","type":"end-node","position":{"x":874.3164534765615,"y":151.70316541496913},"data":{},"measured":{"width":256,"height":75},"selected":false,"dragging":false},{"id":"KpMH_xc3ZZ","type":"llm-node","position":{"x":529.6286840434341,"y":150.4721376669937},"data":{},"measured":{"width":256,"height":75},"selected":false,"dragging":false},{"id":"pOrR6EMVbe","type":"switch-node","position":{"x":110.33793030183864,"y":373.9551529987239},"data":{},"measured":{"width":256,"height":157},"selected":false,"dragging":false}],"edges":[{"source":"TCxPixrdkI","sourceHandle":"source","target":"tGs78_ietp","targetHandle":"target","id":"xy-edge__TCxPixrdkIsource-tGs78_ietptarget"},{"source":"TCxPixrdkI","sourceHandle":"source","target":"OeZdaU7LpY","targetHandle":"target","id":"xy-edge__TCxPixrdkIsource-OeZdaU7LpYtarget"},{"source":"tGs78_ietp","sourceHandle":"source","target":"LjfoCYZo-E","targetHandle":"target","id":"xy-edge__tGs78_ietpsource-LjfoCYZo-Etarget"},{"source":"LjfoCYZo-E","sourceHandle":"source","target":"KpMH_xc3ZZ","targetHandle":"target","id":"xy-edge__LjfoCYZo-Esource-KpMH_xc3ZZtarget"},{"source":"OeZdaU7LpY","sourceHandle":"source","target":"KpMH_xc3ZZ","targetHandle":"target","id":"xy-edge__OeZdaU7LpYsource-KpMH_xc3ZZtarget"},{"source":"KpMH_xc3ZZ","sourceHandle":"source","target":"sQM_22GYB5","targetHandle":"target","id":"xy-edge__KpMH_xc3ZZsource-sQM_22GYB5target"},{"source":"TCxPixrdkI","sourceHandle":"source","target":"pOrR6EMVbe","id":"xy-edge__TCxPixrdkIsource-pOrR6EMVbe"},{"source":"pOrR6EMVbe","sourceHandle":"3","target":"sQM_22GYB5","targetHandle":"target","id":"xy-edge__pOrR6EMVbe3-sQM_22GYB5target"},{"source":"pOrR6EMVbe","sourceHandle":"1","target":"KpMH_xc3ZZ","targetHandle":"target","id":"xy-edge__pOrR6EMVbe1-KpMH_xc3ZZtarget"}],"data":{"tGs78_ietp":{"model":"qwen3","outputs":{"text":{"type":"string"}},"systemPrompt":"你是个聪明人"},"OeZdaU7LpY":{"model":"qwen3","outputs":{"text":{"type":"string"}},"systemPrompt":"你也是个聪明人"}}}')
@@ -73,7 +69,6 @@ function FlowEditor(props: FlowEditorProps) {
setNodes(initialNodes)
setEdges(initialEdges)
setInputSchema(props.inputSchema)
}, [props.graphData])
const {
@@ -84,7 +79,6 @@ function FlowEditor(props: FlowEditorProps) {
return (
<FlowableDiv className="h-full w-full">
{contextHolder}
<ReactFlow
className="rounded-xl"
nodes={nodes}
@@ -129,11 +123,11 @@ function FlowEditor(props: FlowEditorProps) {
if (commonInfo.debug) {
console.info('Save', JSON.stringify({nodes, edges, data}))
}
checkSave(inputSchema, nodes, edges, data)
checkSave(nodes, edges, data)
props.onGraphDataChange({nodes, edges, data})
} catch (e) {
// @ts-ignore
messageApi.error(e.toString())
message.error(e.toString())
}
}}>
<SaveFilled/>

View File

@@ -3,7 +3,6 @@ import type {Option} from 'amis/lib/Schema'
import {contain, find, has, isEqual, max, min, unique} from 'licia'
import {type DependencyList, type MouseEvent as ReactMouseEvent, useCallback, useRef} from 'react'
import Queue from 'yocto-queue'
import {originTypeMap} from '../../pages/ai/task/InputSchema.tsx'
import {useFlowStore} from './store/FlowStore.ts'
import {type OutputVariable, type OutputVariableType} from './types.ts'
@@ -21,17 +20,10 @@ export const getAllIncomerNodeById: (id: string, nodes: Node[], edges: Edge[]) =
return unique(result, (a, b) => isEqual(a, b))
}
export const getAllIncomerNodeOutputVariables: (id: string, inputSchema: Record<string, Record<string, any>>, nodes: Node[], edges: Edge[], data: any) => OutputVariable[] = (id, inputSchema, nodes, edges, data) => {
let inputSchemaVariables: OutputVariable[] = Object.keys(inputSchema).map(key => ({
group: '流程入参',
name: `${key}${inputSchema[key]?.label ? ` (${inputSchema[key].label})` : ''}`,
type: originTypeMap[inputSchema[key]?.type ?? ''],
variable: key,
}))
export const getAllIncomerNodeOutputVariables: (id: string, nodes: Node[], edges: Edge[], data: any) => OutputVariable[] = (id, nodes, edges, data) => {
let currentNode = find(nodes, n => isEqual(id, n.id))
if (!currentNode) {
return inputSchemaVariables
return []
}
let incomerIds = getAllIncomerNodeById(id, nodes, edges)
@@ -63,7 +55,6 @@ export const getAllIncomerNodeOutputVariables: (id: string, inputSchema: Record<
}
return [
...inputSchemaVariables,
...(currentNode.parentId ? [
{
group: '循环入参',
@@ -82,9 +73,9 @@ export const getAllIncomerNodeOutputVariables: (id: string, inputSchema: Record<
]
}
export const generateAllIncomerOutputVariablesFormOptions: (id: string, inputSchema: Record<string, Record<string, any>>, nodes: Node[], edges: Edge[], data: any, targetTypes?: OutputVariableType[]) => Option[] = (id, inputSchema, nodes, edges, data, targetTypes) => {
export const generateAllIncomerOutputVariablesFormOptions: (id: string, nodes: Node[], edges: Edge[], data: any, targetTypes?: OutputVariableType[]) => Option[] = (id, nodes, edges, data, targetTypes) => {
let optionMap: Record<string, Option[]> = {}
for (const item of getAllIncomerNodeOutputVariables(id, inputSchema, nodes, edges, data)) {
for (const item of getAllIncomerNodeOutputVariables(id, nodes, edges, data)) {
if (targetTypes && !contain(targetTypes, item.type)) {
continue
}
@@ -120,9 +111,9 @@ const numberDefaultOperator: string = 'equal'
const arrayOperators: ConditionOperator[] = ['is_empty', 'is_not_empty']
const arrayDefaultOperator: string = 'is_empty'
export const generateAllIncomerOutputVariablesConditions: (id: string, inputSchema: Record<string, Record<string, any>>, nodes: Node[], edges: Edge[], data: any) => Option[] = (id, inputSchema, nodes, edges, data) => {
export const generateAllIncomerOutputVariablesConditions: (id: string, nodes: Node[], edges: Edge[], data: any) => Option[] = (id, nodes, edges, data) => {
let optionMap: Record<string, Option[]> = {}
for (const item of getAllIncomerNodeOutputVariables(id, inputSchema, nodes, edges, data)) {
for (const item of getAllIncomerNodeOutputVariables(id, nodes, edges, data)) {
if (!optionMap[item.group]) {
optionMap[item.group] = []
}

View File

@@ -1,4 +1,4 @@
import {has, isEmpty} from 'licia'
import {has, isEmpty, isEqual} from 'licia'
import {getAllIncomerNodeOutputVariables} from './Helper.tsx'
import CodeNode from './node/CodeNode.tsx'
import KnowledgeNode from './node/KnowledgeNode.tsx'
@@ -7,15 +7,16 @@ import LoopNode from './node/LoopNode.tsx'
import OutputNode from './node/OutputNode.tsx'
import SwitchNode from './node/SwitchNode.tsx'
import TemplateNode from './node/TemplateNode.tsx'
import type {NodeChecker, NodeDefine} from './types.ts'
import type {AddNodeChecker, NodeDefine, SaveNodeChecker} from './types.ts'
import InputNode from './node/InputNode.tsx'
const inputSingleVariableChecker: (field: string) => NodeChecker = field => {
return (id, inputSchema, nodes, edges, data) => {
const inputSingleVariableChecker: (field: string) => SaveNodeChecker = field => {
return (id, _parentId, nodes, edges, data) => {
let nodeData = data[id] ?? {}
if (has(nodeData, field)) {
let expression = nodeData?.[field] ?? ''
if (!isEmpty(expression)) {
let outputVariables = new Set(getAllIncomerNodeOutputVariables(id, inputSchema, nodes, edges, data).map(i => i.variable))
let outputVariables = new Set(getAllIncomerNodeOutputVariables(id, nodes, edges, data).map(i => i.variable))
if (!outputVariables.has(expression)) {
return {
error: true,
@@ -28,12 +29,12 @@ const inputSingleVariableChecker: (field: string) => NodeChecker = field => {
}
}
const inputMultiVariableChecker: NodeChecker = (id, inputSchema, nodes, edges, data) => {
const inputMultiVariableChecker: SaveNodeChecker = (id, _parentId, nodes, edges, data) => {
let nodeData = data[id] ?? {}
if (has(nodeData, 'inputs')) {
let inputs = nodeData?.inputs ?? {}
if (!isEmpty(inputs)) {
let outputVariables = new Set(getAllIncomerNodeOutputVariables(id, inputSchema, nodes, edges, data).map(i => i.variable))
let outputVariables = new Set(getAllIncomerNodeOutputVariables(id, nodes, edges, data).map(i => i.variable))
for (const key of Object.keys(inputs)) {
let variable = inputs[key]?.variable ?? ''
if (!outputVariables.has(variable)) {
@@ -48,6 +49,13 @@ const inputMultiVariableChecker: NodeChecker = (id, inputSchema, nodes, edges, d
return {error: false}
}
const noMoreThanOneNodeType: AddNodeChecker = (type, parentId, nodes) => {
return {
error: nodes.filter(n => isEqual(n.parentId, parentId) && isEqual(n.type, type)).length > 0,
message: `同一个流程(子流程)中类型为 ${type} 的节点至多有一个`
}
}
export const NodeRegistry: NodeDefine[] = [
{
key: 'llm-node',
@@ -56,7 +64,10 @@ export const NodeRegistry: NodeDefine[] = [
icon: <i className="fa fa-message"/>,
description: '使用大模型对话',
component: LlmNode,
checkers: [inputMultiVariableChecker],
checkers: {
add: [],
save: [inputMultiVariableChecker]
},
},
{
key: 'knowledge-node',
@@ -65,7 +76,10 @@ export const NodeRegistry: NodeDefine[] = [
icon: <i className="fa fa-book-bookmark"/>,
description: '',
component: KnowledgeNode,
checkers: [inputMultiVariableChecker],
checkers: {
add: [],
save: [inputMultiVariableChecker]
},
},
{
key: 'code-node',
@@ -74,7 +88,10 @@ export const NodeRegistry: NodeDefine[] = [
icon: <i className="fa fa-code"/>,
description: '执行自定义的处理代码',
component: CodeNode,
checkers: [inputMultiVariableChecker],
checkers: {
add: [],
save: [inputMultiVariableChecker]
},
},
{
key: 'template-node',
@@ -83,7 +100,10 @@ export const NodeRegistry: NodeDefine[] = [
icon: <i className="fa fa-pen-nib"/>,
description: '使用模板聚合转换变量表示',
component: TemplateNode,
checkers: [inputMultiVariableChecker],
checkers: {
add: [],
save: [inputMultiVariableChecker]
},
},
{
key: 'switch-node',
@@ -92,7 +112,10 @@ export const NodeRegistry: NodeDefine[] = [
icon: <i className="fa fa-code-fork"/>,
description: '根据不同的情况前往不同的分支',
component: SwitchNode,
checkers: [],
checkers: {
add: [],
save: [],
},
},
{
key: 'loop-node',
@@ -101,16 +124,35 @@ export const NodeRegistry: NodeDefine[] = [
icon: <i className="fa fa-repeat"/>,
description: '实现循环执行流程',
component: LoopNode,
checkers: [],
checkers: {
add: [],
save: [],
},
},
// 特殊节点特殊判断
{
key: 'input-node',
group: '数据节点',
name: '输入',
icon: <i className="fa fa-file"/>,
description: '定义流程输入变量',
component: InputNode,
checkers: {
add: [noMoreThanOneNodeType],
save: [],
},
},
{
key: 'output-node',
group: '输出节点',
group: '数据节点',
name: '输出',
icon: <i className="fa fa-file"/>,
description: '定义输出变量',
description: '定义流程输出变量',
component: OutputNode,
checkers: [inputSingleVariableChecker('output')],
checkers: {
add: [noMoreThanOneNodeType],
save: [inputSingleVariableChecker('output')]
},
},
]

View File

@@ -1,5 +1,5 @@
import {PlusCircleFilled} from '@ant-design/icons'
import {Button, Dropdown} from 'antd'
import {Button, Dropdown, message} from 'antd'
import type {ButtonProps} from 'antd/lib'
import {isEqual, randomId, unique} from 'licia'
import {commonInfo} from '../../../util/amis.tsx'
@@ -34,7 +34,7 @@ const AddNodeButton = (props: AddNodeButtonProps) => {
if (commonInfo.debug) {
console.info('Add', key, JSON.stringify({nodes, edges, data}))
}
checkAddNode(key, nodes, edges)
checkAddNode(key, props.parent, nodes, edges)
let nodeId = randomId(10, 'qwertyuiopasdfghjklzxcvbnmQWERTYUIOPASDFGHJKLZXCVBNM')
let define = NodeRegistryMap[key]
@@ -62,7 +62,7 @@ const AddNodeButton = (props: AddNodeButtonProps) => {
})
} catch (e) {
// @ts-ignore
messageApi.error(e.toString())
message.error(e.toString())
}
},
}}

View File

@@ -8,11 +8,10 @@ import {amisRender, commonInfo, horizontalFormOptions} from '../../../util/amis.
import {generateAllIncomerOutputVariablesFormOptions} from '../Helper.tsx'
import {useDataStore} from '../store/DataStore.ts'
import {useFlowStore} from '../store/FlowStore.ts'
import {OutputVariableTypeMap} from '../types.ts'
import {type FormSchema, OutputVariableTypeMap} from '../types.ts'
export function inputsFormColumns(
nodeId: string,
inputSchema: Record<string, Record<string, any>>,
nodes: Node[],
edges: Edge[],
data: any,
@@ -38,7 +37,6 @@ export function inputsFormColumns(
selectMode: 'group',
options: generateAllIncomerOutputVariablesFormOptions(
nodeId,
inputSchema,
nodes,
edges,
data,
@@ -88,7 +86,7 @@ type AmisNodeProps = {
nodeProps: NodeProps
extraNodeDescription?: JSX.Element
handler: JSX.Element
columnSchema?: () => Schema[]
formSchema?: () => FormSchema,
resize?: { minWidth: number, minHeight: number }
}
@@ -122,7 +120,7 @@ const AmisNode: (props: AmisNodeProps) => JSX.Element = ({
nodeProps,
extraNodeDescription,
handler,
columnSchema,
formSchema,
resize,
}) => {
const {removeNode} = useFlowStore()
@@ -136,6 +134,7 @@ const AmisNode: (props: AmisNodeProps) => JSX.Element = ({
const [editDrawerOpen, setEditDrawerOpen] = useState(false)
const [editDrawerForm, setEditDrawerForm] = useState<JSX.Element>(<></>)
const onOpenEditDrawerClick = useCallback(() => {
const schema = formSchema?.()
setEditDrawerForm(
amisRender(
{
@@ -166,6 +165,7 @@ const AmisNode: (props: AmisNodeProps) => JSX.Element = ({
},
],
},
...(schema?.events ?? {})
},
body: [
{
@@ -183,7 +183,7 @@ const AmisNode: (props: AmisNodeProps) => JSX.Element = ({
{
type: 'divider',
},
...(columnSchema?.() ?? []),
...(schema?.columns ?? []),
{
type: 'wrapper',
size: 'none',

View File

@@ -1,10 +1,10 @@
import type {NodeProps} from '@xyflow/react'
import {Tag} from 'antd'
import React, {useCallback, useMemo} from 'react'
import {useContextStore} from '../store/ContextStore.ts'
import {useDataStore} from '../store/DataStore.ts'
import {useFlowStore} from '../store/FlowStore.ts'
import AmisNode, {inputsFormColumns, nodeClassName, NormalNodeHandler, outputsFormColumns} from './AmisNode.tsx'
import type {FormSchema} from '../types.ts'
const languageMap: Record<string, string> = {
'javascript': 'Javascript',
@@ -15,38 +15,39 @@ const languageMap: Record<string, string> = {
const CodeNode = (props: NodeProps) => {
const {getNodes, getEdges} = useFlowStore()
const {getData, getDataById} = useDataStore()
const {getInputSchema} = useContextStore()
const nodeData = getDataById(props.id)
const columnsSchema = useCallback(() => [
...inputsFormColumns(props.id, getInputSchema(), getNodes(), getEdges(), getData()),
{
type: 'divider',
},
{
type: 'select',
name: 'type',
label: '代码类型',
required: true,
selectFirst: true,
options: Object.keys(languageMap).map(key => ({label: languageMap[key], value: key})),
},
{
type: 'editor',
required: true,
label: '代码内容',
name: 'content',
language: '${type}',
options: {
wordWrap: 'bounded',
const formSchema: () => FormSchema = useCallback(() => ({
columns: [
...inputsFormColumns(props.id, getNodes(), getEdges(), getData()),
{
type: 'divider',
},
},
{
type: 'divider',
},
...outputsFormColumns(true, false),
], [props.id])
{
type: 'select',
name: 'type',
label: '代码类型',
required: true,
selectFirst: true,
options: Object.keys(languageMap).map(key => ({label: languageMap[key], value: key})),
},
{
type: 'editor',
required: true,
label: '代码内容',
name: 'content',
language: '${type}',
options: {
wordWrap: 'bounded',
},
},
{
type: 'divider',
},
...outputsFormColumns(true, false),
]
}), [props.id])
const extraNodeDescription = useMemo(() => {
return nodeData?.type
@@ -62,7 +63,7 @@ const CodeNode = (props: NodeProps) => {
className={nodeClassName('code')}
nodeProps={props}
extraNodeDescription={extraNodeDescription}
columnSchema={columnsSchema}
formSchema={formSchema}
handler={<NormalNodeHandler/>}
/>
)

View File

@@ -0,0 +1,123 @@
import type {NodeProps} from '@xyflow/react'
import React, {useCallback} from 'react'
import AmisNode, {nodeClassName, outputsFormColumns, StartNodeHandler} from './AmisNode.tsx'
import {horizontalFormOptions} from '../../../util/amis.tsx'
import {typeMap} from '../../../pages/ai/task/InputSchema.tsx'
import type {FormSchema, OutputVariableType} from '../types.ts'
import {isEmpty} from 'licia'
const originTypeMap: Record<string, OutputVariableType> = {
text: 'text',
textarea: 'text',
number: 'number',
files: 'array-text',
}
const InputNode = (props: NodeProps) => {
const formSchema: () => FormSchema = useCallback(() => ({
events: {
change: {
actions: [
{
actionType: 'validate',
},
{
actionType: 'custom',
// @ts-ignore
script: (context, doAction, event) => {
let data = event?.data
console.log(data)
if (data && isEmpty(data?.validateResult?.error ?? undefined)) {
let inputs = data.validateResult?.payload?.inputs ?? {}
if (inputs) {
let outputs: Record<string, { type: OutputVariableType }> = {}
for (let key of Object.keys(inputs)) {
outputs[key] = {
type: originTypeMap[inputs[key].type],
}
}
doAction({
actionType: 'setValue',
args: {
value: {
outputs
},
},
})
}
}
},
},
]
}
},
columns: [
{
type: 'input-kvs',
name: 'inputs',
label: '输入变量',
required: true,
addButtonText: '新增入参',
draggable: false,
keyItem: {
label: '参数名称',
...horizontalFormOptions(),
validations: {
isAlphanumeric: true,
},
},
valueItems: [
{
...horizontalFormOptions(),
type: 'input-text',
name: 'label',
required: true,
label: '中文名称',
clearValueOnEmpty: true,
clearable: true,
},
{
...horizontalFormOptions(),
type: 'input-text',
name: 'description',
label: '参数描述',
clearValueOnEmpty: true,
clearable: true,
},
{
...horizontalFormOptions(),
type: 'select',
name: 'type',
label: '参数类型',
required: true,
selectFirst: true,
options: Object.keys(typeMap).map(key => ({label: typeMap[key], value: key})),
},
{
...horizontalFormOptions(),
type: 'switch',
name: 'required',
label: '是否必填',
required: true,
value: true,
},
],
},
{
type: 'divider',
},
...outputsFormColumns(false, false),
]
}), [props.id])
return (
<AmisNode
className={nodeClassName('input')}
nodeProps={props}
formSchema={formSchema}
handler={<StartNodeHandler/>}
/>
)
}
export default React.memo(InputNode)

View File

@@ -1,15 +1,14 @@
import type {NodeProps} from '@xyflow/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'
import {useFlowStore} from '../store/FlowStore.ts'
import AmisNode, {inputsFormColumns, nodeClassName, NormalNodeHandler, outputsFormColumns} from './AmisNode.tsx'
import type {FormSchema} from '../types.ts'
const KnowledgeNode = (props: NodeProps) => {
const {getNodes, getEdges} = useFlowStore()
const {getData, mergeDataById} = useDataStore()
const {getInputSchema} = useContextStore()
useEffect(() => {
mergeDataById(
@@ -24,64 +23,66 @@ const KnowledgeNode = (props: NodeProps) => {
)
}, [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']})),
},
}
const formSchema: () => FormSchema = useCallback(() => ({
columns: [
...inputsFormColumns(props.id, 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])
{
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 (
<AmisNode
className={nodeClassName('knowledge')}
nodeProps={props}
columnSchema={columnsSchema}
formSchema={formSchema}
handler={<NormalNodeHandler/>}
/>
)

View File

@@ -1,10 +1,10 @@
import type {NodeProps} from '@xyflow/react'
import {Tag} from 'antd'
import React, {useCallback, useEffect, useMemo} from 'react'
import {useContextStore} from '../store/ContextStore.ts'
import {useDataStore} from '../store/DataStore.ts'
import {useFlowStore} from '../store/FlowStore.ts'
import AmisNode, {inputsFormColumns, nodeClassName, NormalNodeHandler, outputsFormColumns} from './AmisNode.tsx'
import type {FormSchema} from '../types.ts'
const modelMap: Record<string, string> = {
qwen3: 'Qwen3',
@@ -14,7 +14,6 @@ const modelMap: Record<string, string> = {
const LlmNode = (props: NodeProps) => {
const {getNodes, getEdges} = useFlowStore()
const {getData, mergeDataById, getDataById} = useDataStore()
const {getInputSchema} = useContextStore()
const nodeData = getDataById(props.id)
@@ -31,30 +30,32 @@ const LlmNode = (props: NodeProps) => {
)
}, [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])
const formSchema: () => FormSchema = useCallback(() => ({
columns: [
...inputsFormColumns(props.id, 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])
const extraNodeDescription = useMemo(() => {
return nodeData?.model
@@ -70,7 +71,7 @@ const LlmNode = (props: NodeProps) => {
className={nodeClassName('llm')}
nodeProps={props}
extraNodeDescription={extraNodeDescription}
columnSchema={columnsSchema}
formSchema={formSchema}
handler={<NormalNodeHandler/>}
/>
)

View File

@@ -3,16 +3,14 @@ import {classnames} from 'amis'
import React, {useCallback, useEffect, useMemo} from 'react'
import AddNodeButton from '../component/AddNodeButton.tsx'
import {generateAllIncomerOutputVariablesFormOptions} from '../Helper.tsx'
import {useContextStore} from '../store/ContextStore.ts'
import {useDataStore} from '../store/DataStore.ts'
import {useFlowStore} from '../store/FlowStore.ts'
import {flowBackgroundColor, flowDotColor} from '../types.ts'
import {flowBackgroundColor, flowDotColor, type FormSchema} from '../types.ts'
import AmisNode, {nodeClassName, NormalNodeHandler, outputsFormColumns} from './AmisNode.tsx'
const LoopNode = (props: NodeProps) => {
const {getNodes, getEdges} = useFlowStore()
const {getData, mergeDataById} = useDataStore()
const {getInputSchema} = useContextStore()
useEffect(() => {
mergeDataById(
@@ -31,87 +29,87 @@ const LoopNode = (props: NodeProps) => {
)
}, [props.id])
const columnsSchema = useCallback(() => [
{
type: 'switch',
name: 'failFast',
label: '快速失败',
required: true,
description: '执行过程中一旦出现错误,及时中断循环任务的执行',
},
{
disabled: true,
type: 'switch',
name: 'parallel',
label: '并行执行',
required: true,
},
{
type: 'select',
name: 'type',
label: '循环模式',
required: true,
options: [
{
label: '次数循环',
value: 'for',
},
{
label: '次数循环 (引用变量)',
value: 'for-variable',
},
{
label: '对象循环',
value: 'for-object',
},
],
},
{
visibleOn: '${type === \'for\'}',
type: 'input-number',
name: 'count',
label: '循环次数',
required: true,
min: 1,
precision: 0,
},
{
visibleOn: '${type === \'for-variable\'}',
type: 'select',
name: 'countVariable',
label: '循环次数',
required: true,
selectMode: 'group',
options: generateAllIncomerOutputVariablesFormOptions(
props.id,
getInputSchema(),
getNodes(),
getEdges(),
getData(),
['number'],
),
},
{
visibleOn: '${type === \'for-object\'}',
type: 'select',
name: 'countObject',
label: '循环对象',
required: true,
selectMode: 'group',
options: generateAllIncomerOutputVariablesFormOptions(
props.id,
getInputSchema(),
getNodes(),
getEdges(),
getData(),
['array-text', 'array-object'],
),
},
{
type: 'divider',
},
...outputsFormColumns(false, true),
], [props.id])
const formSchema: () => FormSchema = useCallback(() => ({
columns: [
{
type: 'switch',
name: 'failFast',
label: '快速失败',
required: true,
description: '执行过程中一旦出现错误,及时中断循环任务的执行',
},
{
disabled: true,
type: 'switch',
name: 'parallel',
label: '并行执行',
required: true,
},
{
type: 'select',
name: 'type',
label: '循环模式',
required: true,
options: [
{
label: '次数循环',
value: 'for',
},
{
label: '次数循环 (引用变量)',
value: 'for-variable',
},
{
label: '对象循环',
value: 'for-object',
},
],
},
{
visibleOn: '${type === \'for\'}',
type: 'input-number',
name: 'count',
label: '循环次数',
required: true,
min: 1,
precision: 0,
},
{
visibleOn: '${type === \'for-variable\'}',
type: 'select',
name: 'countVariable',
label: '循环次数',
required: true,
selectMode: 'group',
options: generateAllIncomerOutputVariablesFormOptions(
props.id,
getNodes(),
getEdges(),
getData(),
['number'],
),
},
{
visibleOn: '${type === \'for-object\'}',
type: 'select',
name: 'countObject',
label: '循环对象',
required: true,
selectMode: 'group',
options: generateAllIncomerOutputVariablesFormOptions(
props.id,
getNodes(),
getEdges(),
getData(),
['array-text', 'array-object'],
),
},
{
type: 'divider',
},
...outputsFormColumns(false, true),
]
}), [props.id])
const extraNodeDescription = useMemo(() => {
return (
@@ -142,7 +140,7 @@ const LoopNode = (props: NodeProps) => {
}}
nodeProps={props}
extraNodeDescription={extraNodeDescription}
columnSchema={columnsSchema}
formSchema={formSchema}
handler={<NormalNodeHandler/>}
resize={{
minWidth: 350,

View File

@@ -1,18 +1,17 @@
import type {NodeProps} from '@xyflow/react'
import React, {useCallback} from 'react'
import {generateAllIncomerOutputVariablesFormOptions} from '../Helper.tsx'
import {useContextStore} from '../store/ContextStore.ts'
import {useDataStore} from '../store/DataStore.ts'
import {useFlowStore} from '../store/FlowStore.ts'
import AmisNode, {EndNodeHandler, nodeClassName} from './AmisNode.tsx'
import type {FormSchema} from '../types.ts'
const OutputNode = (props: NodeProps) => {
const {getNodes, getEdges} = useFlowStore()
const {getData} = useDataStore()
const {getInputSchema} = useContextStore()
const columnsSchema = useCallback(
() => [
const formSchema: () => FormSchema = useCallback(() => ({
columns: [
{
type: 'select',
name: 'output',
@@ -21,19 +20,19 @@ const OutputNode = (props: NodeProps) => {
selectMode: 'group',
options: generateAllIncomerOutputVariablesFormOptions(
props.id,
getInputSchema(),
getNodes(),
getEdges(),
getData(),
),
},
], [props.id])
]
}), [props.id])
return (
<AmisNode
className={nodeClassName('output')}
nodeProps={props}
columnSchema={columnsSchema}
formSchema={formSchema}
handler={<EndNodeHandler/>}
/>
)

View File

@@ -4,46 +4,46 @@ import {Tag} from 'antd'
import {contain, isEqual} from 'licia'
import React, {useCallback, useMemo} from 'react'
import {generateAllIncomerOutputVariablesConditions} from '../Helper.tsx'
import {useContextStore} from '../store/ContextStore.ts'
import {useDataStore} from '../store/DataStore.ts'
import {useFlowStore} from '../store/FlowStore.ts'
import AmisNode, {nodeClassName} from './AmisNode.tsx'
import type {FormSchema} from '../types.ts'
const SwitchNode = (props: NodeProps) => {
const {getNodes, getEdges, removeEdges} = useFlowStore()
const {getData, getDataById} = useDataStore()
const {getInputSchema} = useContextStore()
const nodeData = getDataById(props.id)
// @ts-ignore
const conditions: ConditionValue[] = nodeData?.conditions?.map(c => c.condition) ?? []
const columnsSchema = useCallback(() => [
{
type: 'combo',
name: 'conditions',
label: '分支',
multiple: true,
required: true,
items: [
{
type: 'condition-builder',
name: 'condition',
label: '条件',
required: true,
builderMode: 'simple',
showANDOR: true,
fields: generateAllIncomerOutputVariablesConditions(
props.id,
getInputSchema(),
getNodes(),
getEdges(),
getData(),
),
},
],
},
], [props.id])
const formSchema: () => FormSchema = useCallback(() => ({
columns: [
{
type: 'combo',
name: 'conditions',
label: '分支',
multiple: true,
required: true,
items: [
{
type: 'condition-builder',
name: 'condition',
label: '条件',
required: true,
builderMode: 'simple',
showANDOR: true,
fields: generateAllIncomerOutputVariablesConditions(
props.id,
getNodes(),
getEdges(),
getData(),
),
},
],
},
]
}), [props.id])
const extraNodeDescription = useMemo(() => {
return (
@@ -88,7 +88,7 @@ const SwitchNode = (props: NodeProps) => {
className={nodeClassName('switch')}
nodeProps={props}
extraNodeDescription={extraNodeDescription}
columnSchema={columnsSchema}
formSchema={formSchema}
handler={handler}
/>
)

View File

@@ -1,10 +1,10 @@
import type {NodeProps} from '@xyflow/react'
import {Tag} from 'antd'
import React, {useCallback, useEffect, useMemo} from 'react'
import {useContextStore} from '../store/ContextStore.ts'
import {useDataStore} from '../store/DataStore.ts'
import {useFlowStore} from '../store/FlowStore.ts'
import AmisNode, {inputsFormColumns, nodeClassName, NormalNodeHandler, outputsFormColumns} from './AmisNode.tsx'
import type {FormSchema} from '../types.ts'
const typeMap: Record<string, string> = {
default: '默认',
@@ -16,7 +16,6 @@ const typeMap: Record<string, string> = {
const TemplateNode = (props: NodeProps) => {
const {getNodes, getEdges} = useFlowStore()
const {getData, getDataById, mergeDataById} = useDataStore()
const {getInputSchema} = useContextStore()
const nodeData = getDataById(props.id)
@@ -33,9 +32,9 @@ const TemplateNode = (props: NodeProps) => {
)
}, [props.id])
const columnsSchema = useCallback(
() => [
...inputsFormColumns(props.id, getInputSchema(), getNodes(), getEdges(), getData()),
const formSchema: () => FormSchema = useCallback(() => ({
columns: [
...inputsFormColumns(props.id, getNodes(), getEdges(), getData()),
{
type: 'divider',
},
@@ -69,7 +68,8 @@ const TemplateNode = (props: NodeProps) => {
},
},
...outputsFormColumns(false, true),
], [props.id])
]
}), [props.id])
const extraNodeDescription = useMemo(() => {
return nodeData?.type
@@ -85,7 +85,7 @@ const TemplateNode = (props: NodeProps) => {
className={nodeClassName('template')}
nodeProps={props}
extraNodeDescription={extraNodeDescription}
columnSchema={columnsSchema}
formSchema={formSchema}
handler={<NormalNodeHandler/>}
/>
)

View File

@@ -1,11 +0,0 @@
import {create} from 'zustand/react'
export const useContextStore = create<{
inputSchema: Record<string, Record<string, any>>,
getInputSchema: () => Record<string, Record<string, any>>,
setInputSchema: (inputSchema: Record<string, Record<string, any>>) => void,
}>((set, get) => ({
inputSchema: {},
getInputSchema: () => get().inputSchema,
setInputSchema: (inputSchema: Record<string, Record<string, any>>) => set({inputSchema}),
}))

View File

@@ -1,5 +1,6 @@
import type {Edge, Node} from '@xyflow/react'
import type {JSX} from 'react'
import type {ListenerAction, Schema} from 'amis'
export const flowBackgroundColor = '#fafafa'
export const flowDotColor = '#dedede'
@@ -19,12 +20,12 @@ export type NodeError = {
message?: string,
}
export type NodeChecker = (id: string, inputSchema: Record<string, Record<string, any>>, nodes: Node[], edges: Edge[], data: any) => NodeError
export type AddNodeChecker = (type: string, parentId: string | undefined, nodes: Node[], edges: Edge[], data: any) => NodeError
export type SaveNodeChecker = (id: string, parentId: string | undefined, nodes: Node[], edges: Edge[], data: any) => NodeError
export type GraphData = { nodes: Node[], edges: Edge[], data: any }
export type FlowEditorProps = {
inputSchema: Record<string, Record<string, any>>,
graphData: GraphData,
onGraphDataChange: (graphData: GraphData) => void,
}
@@ -47,7 +48,10 @@ export type NodeDefine = {
icon: JSX.Element,
description: string,
component: any,
checkers: NodeChecker[],
checkers: {
add: AddNodeChecker[],
save: SaveNodeChecker[],
},
}
export type OutputVariable = {
@@ -56,3 +60,8 @@ export type OutputVariable = {
type: OutputVariableType,
variable: string,
}
export type FormSchema = {
events?: Record<string, { actions: ListenerAction[] }>
columns: Schema[]
}

View File

@@ -1,5 +1,4 @@
import type {Schema} from 'amis'
import type {OutputVariableType} from '../../../components/flow/types.ts'
import {commonInfo, formInputFileStaticColumns} from '../../../util/amis.tsx'
export const typeMap: Record<string, string> = {
@@ -9,13 +8,6 @@ export const typeMap: Record<string, string> = {
files: '文件',
}
export const originTypeMap: Record<string, OutputVariableType> = {
text: 'text',
textarea: 'text',
number: 'number',
files: 'array-text',
}
export type InputField = {
type: string
label: string

View File

@@ -1,9 +1,8 @@
import {isEmpty, isEqual} from 'licia'
import {isEqual} from 'licia'
import React from 'react'
import {useNavigate, useParams} from 'react-router'
import styled from 'styled-components'
import {amisRender, commonInfo, horizontalFormOptions} from '../../../../util/amis.tsx'
import {generateInputForm, typeMap} from '../InputSchema.tsx'
const TemplateEditDiv = styled.div`
.antd-EditorControl {
@@ -39,31 +38,6 @@ const FlowTaskTemplateEdit: React.FC = () => {
wrapWithPanel: false,
...horizontalFormOptions(),
onEvent: {
change: {
actions: [
{
actionType: 'validate',
},
{
actionType: 'custom',
// @ts-ignore
script: (context, doAction, event) => {
let data = event?.data ?? {}
let inputSchema = data.inputSchema ?? []
if (!isEmpty(inputSchema) && isEmpty(data?.validateResult?.error ?? undefined)) {
doAction({
actionType: 'setValue',
args: {
value: {
inputPreview: generateInputForm(inputSchema, '入参表单预览'),
},
},
})
}
},
},
],
},
submitSucc: {
actions: [
{
@@ -99,71 +73,6 @@ const FlowTaskTemplateEdit: React.FC = () => {
maxLength: 500,
showCounter: true,
},
{
type: 'group',
body: [
{
type: 'wrapper',
size: 'none',
body: [
{
type: 'input-kvs',
name: 'inputSchema',
label: '输入变量',
addButtonText: '新增入参',
draggable: false,
keyItem: {
label: '参数名称',
...horizontalFormOptions(),
validations: {
isAlphanumeric: true,
},
},
valueItems: [
{
...horizontalFormOptions(),
type: 'input-text',
name: 'label',
required: true,
label: '中文名称',
clearValueOnEmpty: true,
clearable: true,
},
{
...horizontalFormOptions(),
type: 'input-text',
name: 'description',
label: '参数描述',
clearValueOnEmpty: true,
clearable: true,
},
{
...horizontalFormOptions(),
type: 'select',
name: 'type',
label: '参数类型',
required: true,
selectFirst: true,
options: Object.keys(typeMap).map(key => ({label: typeMap[key], value: key})),
},
{
...horizontalFormOptions(),
type: 'switch',
name: 'required',
label: '是否必填',
required: true,
value: true,
},
],
},
],
},
{
type: 'amis',
name: 'inputPreview',
},
],
},
{
type: 'button-toolbar',
buttons: [

View File

@@ -13,7 +13,6 @@ const FlowTaskTemplateFlowEditDiv = styled.div`
const FlowTaskTemplateFlowEdit: React.FC = () => {
const navigate = useNavigate()
const {template_id} = useParams()
const [inputSchema, setInputSchema] = useState<Record<string, Record<string, any>>>({})
const [graphData, setGraphData] = useState<GraphData>({nodes: [], edges: [], data: {}})
useMount(async () => {
@@ -23,14 +22,12 @@ const FlowTaskTemplateFlowEdit: React.FC = () => {
headers: commonInfo.authorizationHeaders,
},
)
setInputSchema(data?.data?.inputSchema)
setGraphData(data?.data?.flowGraph)
})
return (
<FlowTaskTemplateFlowEditDiv className="h-full w-full">
<FlowEditor
inputSchema={inputSchema}
graphData={graphData}
onGraphDataChange={async data => {
await axios.post(