|
|
|
|
|
|
|
|
|
|
|
|
|
|
import { CodeTemplateStrMap, ProgrammingLanguage } from '@/constants/agent'; |
|
|
import { CodeTemplateStrMap, ProgrammingLanguage } from '@/constants/agent'; |
|
|
import { ICodeForm } from '@/interfaces/database/flow'; |
|
|
import { ICodeForm } from '@/interfaces/database/flow'; |
|
|
import { useEffect } from 'react'; |
|
|
|
|
|
|
|
|
import { useCallback } from 'react'; |
|
|
|
|
|
import useGraphStore from '../../store'; |
|
|
import styles from './index.less'; |
|
|
import styles from './index.less'; |
|
|
|
|
|
|
|
|
loader.config({ paths: { vs: '/vs' } }); |
|
|
loader.config({ paths: { vs: '/vs' } }); |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
const CodeForm = ({ onValuesChange, form, node }: IOperatorForm) => { |
|
|
const CodeForm = ({ onValuesChange, form, node }: IOperatorForm) => { |
|
|
const formData = node?.data.form as ICodeForm; |
|
|
const formData = node?.data.form as ICodeForm; |
|
|
|
|
|
const updateNodeForm = useGraphStore((state) => state.updateNodeForm); |
|
|
|
|
|
|
|
|
useEffect(() => { |
|
|
|
|
|
setTimeout(() => { |
|
|
|
|
|
// TODO: Direct operation zustand is more elegant |
|
|
|
|
|
form?.setFieldValue( |
|
|
|
|
|
'script', |
|
|
|
|
|
CodeTemplateStrMap[formData.lang as ProgrammingLanguage], |
|
|
|
|
|
); |
|
|
|
|
|
}, 0); |
|
|
|
|
|
}, [form, formData.lang]); |
|
|
|
|
|
|
|
|
const handleChange = useCallback( |
|
|
|
|
|
(value: ProgrammingLanguage) => { |
|
|
|
|
|
if (node?.id) { |
|
|
|
|
|
updateNodeForm( |
|
|
|
|
|
node?.id, |
|
|
|
|
|
CodeTemplateStrMap[value as ProgrammingLanguage], |
|
|
|
|
|
['script'], |
|
|
|
|
|
); |
|
|
|
|
|
} |
|
|
|
|
|
}, |
|
|
|
|
|
[node?.id, updateNodeForm], |
|
|
|
|
|
); |
|
|
|
|
|
|
|
|
return ( |
|
|
return ( |
|
|
<Form |
|
|
<Form |
|
|
|
|
|
|
|
|
label={ |
|
|
label={ |
|
|
<Form.Item name={'lang'} className={styles.languageItem}> |
|
|
<Form.Item name={'lang'} className={styles.languageItem}> |
|
|
<Select |
|
|
<Select |
|
|
defaultValue={'python'} |
|
|
|
|
|
|
|
|
defaultValue={ProgrammingLanguage.Python} |
|
|
popupMatchSelectWidth={false} |
|
|
popupMatchSelectWidth={false} |
|
|
options={options} |
|
|
options={options} |
|
|
|
|
|
onChange={handleChange} |
|
|
/> |
|
|
/> |
|
|
</Form.Item> |
|
|
</Form.Item> |
|
|
} |
|
|
} |