Skip to content

Commit a005d3e

Browse files
xlornexlorne
committed
add Groovy Script 脚本设计规范
1 parent b6e45ae commit a005d3e

17 files changed

Lines changed: 275 additions & 157 deletions

File tree

‎frontend/packages/flow-pc/flow-pc-design/src/components/design-editor/node-components/strategy/node-title.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ import {Field, FieldRenderProps} from '@flowgram.ai/fixed-layout-editor';
55
import {useDesignContext} from '@/components/design-panel/hooks/use-design-context';
66
import {NodeTitleVariableAdapter} from "@/components/script/services/variable/node-title";
77
import {GroovyScriptPreview} from "@/components/script/components/groovy-script-preview";
8-
import {NodeTitleConfigModal} from "@/components/script/node-title-config-modal";
8+
import {NodeTitleConfigModal} from "@/components/script/modal/node-title-config-modal";
99

1010
/**
1111
* 节点标题策略配置

‎frontend/packages/flow-pc/flow-pc-design/src/components/design-editor/node-components/strategy/operator-load.tsx‎

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,7 @@ import {Button, Form, Space} from "antd";
33
import {Field, FieldRenderProps} from "@flowgram.ai/fixed-layout-editor";
44
import {EditOutlined} from "@ant-design/icons";
55
import {GroovyScriptPreview} from "@/components/script/components/groovy-script-preview";
6+
import {OperatorLoadConfigModal} from "@/components/script/modal/operator-load-config-modal";
67

78
/**
89
* 操作人配置策略
@@ -11,6 +12,7 @@ import {GroovyScriptPreview} from "@/components/script/components/groovy-script-
1112
export const OperatorLoadStrategy:React.FC = () => {
1213

1314
const [form] = Form.useForm();
15+
const [visible,setVisible] = React.useState(false);
1416

1517
return (
1618
<Form
@@ -36,11 +38,22 @@ export const OperatorLoadStrategy:React.FC = () => {
3638
<Button
3739
icon={<EditOutlined/>}
3840
onClick={() => {
41+
setVisible(true);
3942
}}
4043
style={{borderRadius: '0 6px 6px 0'}}
4144
>
4245
编辑
4346
</Button>
47+
48+
<OperatorLoadConfigModal
49+
script={value}
50+
open={visible}
51+
onCancel={()=>{setVisible(false);}}
52+
onConfirm={(value)=>{
53+
onChange(value);
54+
}}
55+
/>
56+
4457
</Space.Compact>
4558
)}
4659
/>

‎frontend/packages/flow-pc/flow-pc-design/src/components/design-panel/tabs/base.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ import {CardForm, Panel} from "@flow-engine/flow-pc-ui";
44
import {useDesignContext} from "../hooks/use-design-context";
55
import {GroovyScriptPreview} from "@/components/script/components/groovy-script-preview";
66
import {EditOutlined} from "@ant-design/icons";
7-
import {OperatorCreateConfigModal} from "@/components/script/operator-create-config-modal";
7+
import {OperatorCreateConfigModal} from "@/components/script/modal/operator-create-config-modal";
88

99

1010
interface FlowCreateOperatorEditorProps {

‎frontend/packages/flow-pc/flow-pc-design/src/components/script/components/advanced-script-editor.tsx‎

Lines changed: 63 additions & 41 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,10 @@
1-
import {Button, Input, Space} from 'antd';
1+
import {Button, Space} from 'antd';
22
import React from "react";
33
import {GroovyScriptContent} from "@/components/script/components/groovy-script-modal";
4-
import {DeleteOutlined} from "@ant-design/icons";
4+
import {MenuUnfoldOutlined, ReloadOutlined} from "@ant-design/icons";
55
import {GroovyVariableMapping, ScriptType} from "@/components/script/typings";
6-
import {
7-
GroovyScriptConverterContext
8-
} from "@/components/script/context/groovy-script-convertor-context";
9-
10-
const {TextArea} = Input;
6+
import {PythonCodeEditor} from "@flowgram.ai/form-materials";
7+
import {GroovyScriptConvertorUtil} from "@/components/script/utils/convertor";
118

129
interface ScriptEditorProps {
1310
/** 脚本类型 */
@@ -22,11 +19,16 @@ interface ScriptEditorProps {
2219
readonly?: boolean;
2320
}
2421

22+
const hintStyle: React.CSSProperties = {
23+
fontSize: 12,
24+
color: 'rgba(0, 0, 0, 0.25)',
25+
};
26+
2527
/**
2628
* 高级脚本编辑器组件
2729
* 支持自由编辑 Groovy 脚本
2830
*/
29-
export const ScriptEditor:React.FC<ScriptEditorProps> = (props: ScriptEditorProps)=> {
31+
export const ScriptEditor: React.FC<ScriptEditorProps> = (props: ScriptEditorProps) => {
3032
const {script, onChange, readonly = false, variables} = props;
3133

3234
const handleChange = (value: string) => {
@@ -36,49 +38,69 @@ export const ScriptEditor:React.FC<ScriptEditorProps> = (props: ScriptEditorProp
3638
};
3739

3840
return (
39-
<TextArea
41+
<PythonCodeEditor
4042
value={script}
41-
onChange={(e) => handleChange(e.target.value)}
42-
readOnly={readonly}
43-
style={{ fontFamily: 'Courier New, monospace' }}
44-
placeholder="请输入 Groovy 脚本..."
45-
autoSize={{ minRows: 6, maxRows: 10 }}
43+
readonly={readonly}
44+
onChange={handleChange}
45+
placeholder={"请输入 Groovy 脚本..."}
46+
theme={'dark'}
47+
options={{
48+
fontSize: 14,
49+
minHeight: 300,
50+
maxHeight: 300,
51+
}}
4652
/>
4753
);
4854
}
4955

5056

51-
export const AdvancedScriptEditor: React.FC<GroovyScriptContent> = (props) => {
57+
interface AdvancedScriptEditorProps extends GroovyScriptContent {
58+
//重置脚本
59+
resetScript(): string;
60+
}
5261

53-
const groovyScriptConvertor = GroovyScriptConverterContext.getInstance().createConverter(props.type, props.script, props.variables);
62+
export const AdvancedScriptEditor: React.FC<AdvancedScriptEditorProps> = (props) => {
5463

55-
if(groovyScriptConvertor) {
64+
return (
65+
<div>
66+
<ScriptEditor
67+
type={props.type}
68+
script={props.script}
69+
variables={props.variables || []}
70+
onChange={props.onChange}
71+
/>
72+
<Space
73+
style={{
74+
marginTop: 8
75+
}}
76+
>
77+
<Button
78+
icon={<MenuUnfoldOutlined/>}
79+
onClick={() => {
80+
props.onChange(GroovyScriptConvertorUtil.formatScript(props.script));
81+
}}
82+
>
83+
格式化代码
84+
</Button>
5685

57-
return (
58-
<div>
59-
自定义脚本
60-
<ScriptEditor
61-
type={props.type}
62-
script={props.script}
63-
variables={props.variables}
64-
onChange={props.onChange}
65-
/>
66-
<Space
67-
style={{
68-
marginTop: 8
86+
<Button
87+
icon={<ReloadOutlined/>}
88+
danger={true}
89+
onClick={() => {
90+
props.onChange(props.resetScript());
6991
}}
7092
>
71-
<Button
72-
icon={<DeleteOutlined/>}
73-
danger={true}
74-
onClick={() => {
75-
props.onChange(groovyScriptConvertor.getDefaultScript());
76-
}}
77-
>
78-
重置配置
79-
</Button>
80-
</Space>
93+
重置脚本
94+
</Button>
95+
</Space>
96+
<div style={{marginTop: 8}}>
97+
<div style={hintStyle}>
98+
{'// @CUSTOM_SCRIPT 是自定义脚本的标识'}
99+
</div>
100+
<div style={hintStyle}>
101+
{'// @SCRIPT_TITLE 是脚本的展示内容'}
102+
</div>
81103
</div>
82-
)
83-
}
104+
</div>
105+
)
84106
}

‎frontend/packages/flow-pc/flow-pc-design/src/components/script/context/groovy-script-convertor-context.ts‎

Lines changed: 0 additions & 53 deletions
This file was deleted.

‎frontend/packages/flow-pc/flow-pc-design/src/components/script/default-script.ts‎

Lines changed: 12 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,9 +7,20 @@ export const DEFAULT_OPERATOR_CREATE_SCRIPT = `
77
}
88
`;
99

10+
11+
// 默认操作人配置脚本，流程创建者
12+
export const DEFAULT_OPERATOR_LOAD_SCRIPT = `
13+
// @SCRIPT_TITLE 流程创建者
14+
def run(request){
15+
return [request.getCreatedOperator()]
16+
}
17+
`;
18+
1019
// 默认节点标题配置脚本，您有一条待办消息
1120
export const DEFAULT_NODE_TITLE_SCRIPT = `
1221
// @SCRIPT_TITLE 您有一条待办消息
13-
def run(request){\nreturn \"您有一条待办消息\"\n}
22+
def run(request){
23+
return "您有一条待办消息"
24+
}
1425
`
1526

frontend/packages/flow-pc/flow-pc-design/src/components/script/node-title-config-modal.tsx renamed to frontend/packages/flow-pc/flow-pc-design/src/components/script/modal/node-title-config-modal.tsx

Lines changed: 8 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,10 @@
11
import React from 'react';
2-
import {GroovyScriptContent, GroovyScriptModal} from "./components/groovy-script-modal";
2+
import {GroovyScriptContent, GroovyScriptModal} from "../components/groovy-script-modal";
33
import {AdvancedScriptEditor} from "@/components/script/components/advanced-script-editor";
44
import {GroovyVariableMapping, ScriptType} from "@/components/script/typings";
55
import {GroovyScriptConvertorUtil} from "@/components/script/utils/convertor";
66
import {NodeTitlePluginView} from "@/components/script/plugins/view/node-title-view";
7+
import {DEFAULT_NODE_TITLE_SCRIPT} from "@/components/script/default-script";
78

89
export interface NodeTitleConfigModalProps {
910
/** 是否展示 **/
@@ -24,7 +25,12 @@ const NodeTitleConfigContent: React.FC<GroovyScriptContent> = (props) => {
2425
return (
2526
<>
2627
{isAdvance && (
27-
<AdvancedScriptEditor {...props} />
28+
<AdvancedScriptEditor
29+
{...props}
30+
resetScript={()=>{
31+
return DEFAULT_NODE_TITLE_SCRIPT;
32+
}}
33+
/>
2834
)}
2935
{!isAdvance && (
3036
<NodeTitlePluginView {...props} />

frontend/packages/flow-pc/flow-pc-design/src/components/script/operator-create-config-modal.tsx renamed to frontend/packages/flow-pc/flow-pc-design/src/components/script/modal/operator-create-config-modal.tsx

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@ import {ScriptType} from "@/components/script/typings";
44
import {GroovyScriptConvertorUtil} from "@/components/script/utils/convertor";
55
import {AdvancedScriptEditor} from "@/components/script/components/advanced-script-editor";
66
import {OperatorCreatePluginView} from "@/components/script/plugins/view/operator-create-view";
7+
import {DEFAULT_OPERATOR_CREATE_SCRIPT} from "@/components/script/default-script";
78

89

910
interface OperatorCreateConfigModalProps{
@@ -25,7 +26,12 @@ const OperatorCreateConfigContent :React.FC<GroovyScriptContent> = (props)=>{
2526
return (
2627
<>
2728
{isAdvance && (
28-
<AdvancedScriptEditor {...props} />
29+
<AdvancedScriptEditor
30+
{...props}
31+
resetScript={()=>{
32+
return DEFAULT_OPERATOR_CREATE_SCRIPT;
33+
}}
34+
/>
2935
)}
3036
{!isAdvance && (
3137
<OperatorCreatePluginView script={props.script} onChange={props.onChange} />

‎frontend/packages/flow-pc/flow-pc-design/src/components/script/modal/operator-load-config-modal.tsx‎

Lines changed: 57 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,57 @@
1+
import React from "react";
2+
import {GroovyScriptContent, GroovyScriptModal} from "@/components/script/components/groovy-script-modal";
3+
import {ScriptType} from "@/components/script/typings";
4+
import {GroovyScriptConvertorUtil} from "@/components/script/utils/convertor";
5+
import {AdvancedScriptEditor} from "@/components/script/components/advanced-script-editor";
6+
import {OperatorLoadPluginView} from "@/components/script/plugins/view/operator-load-view";
7+
import {DEFAULT_OPERATOR_LOAD_SCRIPT} from "@/components/script/default-script";
8+
9+
interface OperatorLoadConfigModalProps{
10+
/** 是否展示 **/
11+
open: boolean;
12+
/** 当前脚本 */
13+
script: string;
14+
/** 取消回调 */
15+
onCancel: () => void;
16+
/** 确认回调 */
17+
onConfirm: (script: string) => void;
18+
}
19+
20+
21+
const OperatorLoadConfigContent:React.FC<GroovyScriptContent> = (props)=>{
22+
const isAdvance = GroovyScriptConvertorUtil.isCustomScript(props.script);
23+
24+
return (
25+
<>
26+
{isAdvance && (
27+
<AdvancedScriptEditor
28+
{...props}
29+
resetScript={()=>{
30+
return DEFAULT_OPERATOR_LOAD_SCRIPT;
31+
}}
32+
/>
33+
)}
34+
{!isAdvance && (
35+
<OperatorLoadPluginView script={props.script} onChange={props.onChange} />
36+
)}
37+
</>
38+
);
39+
}
40+
41+
42+
export const OperatorLoadConfigModal:React.FC<OperatorLoadConfigModalProps> = (props)=>{
43+
44+
return (
45+
<GroovyScriptModal
46+
title={"操作人配置"}
47+
type={ScriptType.OPERATOR_LOAD}
48+
variables={[]}
49+
script={props.script}
50+
content={OperatorLoadConfigContent}
51+
open={props.open}
52+
onCancel={props.onCancel}
53+
onConfirm={props.onConfirm}
54+
/>
55+
)
56+
57+
}

‎frontend/packages/flow-pc/flow-pc-design/src/components/script/plugins/operator-load-view-type.ts‎

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
export const VIEW_KEY = 'OperatorLoadViewPlugin';
2+
3+
export interface OperatorLoadViewPlugin {
4+
/** 当前脚本 */
5+
script: string;
6+
/** 确认回调 */
7+
onChange: (script: string) => void;
8+
}

0 commit comments

Comments
 (0)