diff --git a/src/components/FlowEditor/nodeEditors/components/CodeEditor.tsx b/src/components/FlowEditor/nodeEditors/components/CodeEditor.tsx index bd7ef9b..af1f1d3 100644 --- a/src/components/FlowEditor/nodeEditors/components/CodeEditor.tsx +++ b/src/components/FlowEditor/nodeEditors/components/CodeEditor.tsx @@ -11,6 +11,7 @@ const CodeEditor: React.FC = ({ nodeData, updateNodeData }) => // 当组件加载时,主动触发 CodeMirror 的 onUpdateData 方法 useEffect(() => { + console.log('nodeData:', nodeData); // 如果是新创建的节点,没有默认的 component 数据,则设置默认值 if (!nodeData.component || Object.keys(nodeData.component).length === 0) { const defaultData = { @@ -28,6 +29,22 @@ const CodeEditor: React.FC = ({ nodeData, updateNodeData }) => ' }\n' + '}' }, + extra: { + java: '/**\n' + + 'ExecClass类main 方法是固定的启动函数,参数个数、类型、返回类型不可更改\n' + + '当前版本gson-2.10.1.jar的文档地址:\n' + + 'https://www.javadoc.io/doc/com.google.code.gson/gson/2.10.1/index.html\n' + + '*/\n' + + 'import com.google.gson.JsonObject;\n' + + 'class ExecClass{ \n' + + ' public JsonObject main(JsonObject args){\n' + + ' return args;\n' + + ' }\n' + + '}', + python: '# main函数是启动函数,参数类型、个数、返回类型不可更改\n' + + 'def main(a:dict)->dict:\n' + + ' return {\'b\': a.get(\'a\')+[4,5]}' + }, type: 'CODE' }; diff --git a/src/components/FlowEditor/nodeEditors/components/CodeMirror.tsx b/src/components/FlowEditor/nodeEditors/components/CodeMirror.tsx index 4d9056f..6b50ccb 100644 --- a/src/components/FlowEditor/nodeEditors/components/CodeMirror.tsx +++ b/src/components/FlowEditor/nodeEditors/components/CodeMirror.tsx @@ -1,25 +1,22 @@ -import React, { useCallback, useEffect, useState } from 'react'; +import React, { useCallback, useState, useEffect } from 'react'; import { Select } from '@arco-design/web-react'; import CodeMirror from '@uiw/react-codemirror'; import { java } from '@codemirror/lang-java'; import { python } from '@codemirror/lang-python'; import { githubLight } from '@uiw/codemirror-theme-github'; +import { isJSON } from '@/utils/common'; const Option = Select.Option; -interface TableDataItem { - key: number | string; - id: string; - dataType: string; - arrayType: string; - desc: string; - defaultValue: string; +interface initData { + customDef?: string | Record; + type: string; [key: string]: any; // 允许其他自定义字段 } interface CodeMirrorProps { - initialData: TableDataItem[], + initialData: initData, onUpdateData: (data) => void, } @@ -45,40 +42,82 @@ const nameToCode = { 'java': '63', 'python': '70' }; +const codeToName = { + '63': 'java', + '70': 'python' +}; const CodeMirrorComp: React.FC = ({ initialData, onUpdateData }) => { - const [value, setValue] = useState('console.log(\'hello world!\');'); const [language, setLanguage] = useState('java'); + const [codeMap, setCodeMap] = useState>({ + java: defaultCode.java, + python: defaultCode.python + }); + + const onChange = useCallback((val) => { + // 更新当前语言的代码 + const newCodeMap = { + ...codeMap, + [language]: val + }; + setCodeMap(newCodeMap); - const onChange = useCallback((val, viewUpdate) => { - setValue(val); const data = { customDef: { languageId: nameToCode[language], sourceCode: val - } + }, + extra: newCodeMap, // 前端存储所有语言的代码 + type: 'CODE' }; - console.log('data:', data); onUpdateData(data); - }, []); + }, [language, codeMap, onUpdateData]); + + const handleLanguageChange = useCallback((newLanguage: string) => { + setLanguage(newLanguage); + + // 切换语言时也要更新数据 + const data = { + customDef: { + languageId: nameToCode[newLanguage], + sourceCode: codeMap[newLanguage] + }, + extra: codeMap, // 前端存储所有语言的代码 + type: 'CODE' + }; + onUpdateData(data); + }, [codeMap, onUpdateData]); useEffect(() => { - setValue(defaultCode[language]); + const parseData = isJSON(initialData.customDef) ? JSON.parse(initialData.customDef as string) : initialData.customDef; + const currentLanguage = codeToName[parseData?.languageId] || 'java'; + + // 如果有 extra,优先使用它来恢复所有语言的代码 + if (initialData.extra && typeof initialData.extra === 'object') { + setCodeMap(initialData.extra as Record); + } + else if (parseData?.sourceCode) { + // 否则只恢复当前语言的代码 + setCodeMap(prev => ({ + ...prev, + [currentLanguage]: parseData.sourceCode + })); + } + + setLanguage(currentLanguage); }, []); + return ( <>