@coding-flow/flow-design 0.0.47 → 0.0.48
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/api/workflow.d.ts +1 -0
- package/dist/api/workflow.js +2 -1
- package/dist/components/design-editor/node-components/action/index.js +20 -7
- package/dist/components/design-editor/node-components/action/presenter.d.ts +3 -2
- package/dist/components/design-editor/node-components/action/presenter.js +26 -27
- package/dist/components/design-panel/manager/form.d.ts +1 -0
- package/dist/components/design-panel/manager/form.js +28 -0
- package/dist/components/design-panel/presenters/index.d.ts +1 -0
- package/dist/components/design-panel/presenters/index.js +6 -0
- package/dist/components/design-panel/tabs/form/table.js +12 -0
- package/dist/plugins/action-custom-view-type.d.ts +1 -2
- package/dist/plugins/view/action-custom-view.js +41 -45
- package/dist/script-components/components/action/components/custom.js +80 -19
- package/dist/script-components/components/action/index.js +11 -1
- package/dist/script-components/components/action/style.d.ts +2 -2
- package/dist/script-components/components/action/style.js +70 -6
- package/dist/script-components/components/advanced-script-editor.js +1 -0
- package/dist/script-components/components/groovy-script-loader.d.ts +2 -2
- package/dist/script-components/components/groovy-script-modal.d.ts +2 -0
- package/dist/script-components/default-script.d.ts +1 -1
- package/dist/script-components/default-script.js +1 -1
- package/dist/script-components/typings/script.d.ts +5 -1
- package/dist/script-components/typings/script.js +2 -0
- package/package.json +8 -8
- package/dist/script-components/components/action/script.d.ts +0 -8
- package/dist/script-components/components/action/script.js +0 -68
package/dist/api/workflow.d.ts
CHANGED
|
@@ -9,6 +9,7 @@ export declare const deleteVersion: (id: any) => Promise<import("@coding-flow/fl
|
|
|
9
9
|
export declare const changeState: (id: string) => Promise<import("@coding-flow/flow-core").Response>;
|
|
10
10
|
export declare const create: () => Promise<import("@coding-flow/flow-core").Response>;
|
|
11
11
|
export declare const createNode: (type: string) => Promise<import("@coding-flow/flow-core").Response>;
|
|
12
|
+
export declare const createCustomAction: () => Promise<import("@coding-flow/flow-core").Response>;
|
|
12
13
|
export declare const save: (body: any) => Promise<import("@coding-flow/flow-core").Response>;
|
|
13
14
|
export declare const load: (id: string) => Promise<import("@coding-flow/flow-core").Response>;
|
|
14
15
|
export declare const exportWorkflow: (id: string) => Promise<void>;
|
package/dist/api/workflow.js
CHANGED
|
@@ -24,6 +24,7 @@ const create = ()=>httpClient.post('/api/cmd/workflow/create', {});
|
|
|
24
24
|
const createNode = (type)=>httpClient.post('/api/cmd/workflow/create-node', {
|
|
25
25
|
type
|
|
26
26
|
});
|
|
27
|
+
const createCustomAction = ()=>httpClient.post('/api/cmd/workflow/create-custom-action', {});
|
|
27
28
|
const save = (body)=>httpClient.post('/api/cmd/workflow/save', body);
|
|
28
29
|
const load = (id)=>httpClient.get('/api/cmd/workflow/load', {
|
|
29
30
|
id
|
|
@@ -33,4 +34,4 @@ const exportWorkflow = (id)=>{
|
|
|
33
34
|
return httpClient.download('/api/cmd/workflow/export?id=' + id, filename);
|
|
34
35
|
};
|
|
35
36
|
const importWorkflow = (file)=>httpClient.post('/api/cmd/workflow/import', file);
|
|
36
|
-
export { changeState, changeVersion, create, createNode, deleteVersion, exportWorkflow, importWorkflow, list, load, meta, options, remove, save, updateVersionName, versions };
|
|
37
|
+
export { changeState, changeVersion, create, createCustomAction, createNode, deleteVersion, exportWorkflow, importWorkflow, list, load, meta, options, remove, save, updateVersionName, versions };
|
|
@@ -7,12 +7,11 @@ import { PlusOutlined } from "@ant-design/icons";
|
|
|
7
7
|
import { actionOptions } from "@coding-flow/flow-types";
|
|
8
8
|
import { ActionConfigModal } from "../../../../script-components/modal/action-config-modal.js";
|
|
9
9
|
import { FlowActionListPresenter } from "./presenter.js";
|
|
10
|
-
import {
|
|
10
|
+
import { createCustomAction } from "../../../../api/workflow.js";
|
|
11
11
|
const ActionTable = (props)=>{
|
|
12
12
|
const { node } = useNodeRenderContext();
|
|
13
|
-
const actions = node.getNodeRegistry()?.meta.actions || [];
|
|
14
13
|
const presenter = new FlowActionListPresenter(props.value, props.onChange);
|
|
15
|
-
const datasource = presenter.getDatasource(
|
|
14
|
+
const datasource = presenter.getDatasource();
|
|
16
15
|
const [visible, setVisible] = react.useState(false);
|
|
17
16
|
const [form] = Form.useForm();
|
|
18
17
|
const columns = react.useCallback(()=>[
|
|
@@ -63,6 +62,18 @@ const ActionTable = (props)=>{
|
|
|
63
62
|
},
|
|
64
63
|
children: "编辑"
|
|
65
64
|
}),
|
|
65
|
+
/*#__PURE__*/ jsx("a", {
|
|
66
|
+
onClick: ()=>{
|
|
67
|
+
presenter.sort(record.id, -1);
|
|
68
|
+
},
|
|
69
|
+
children: "↑"
|
|
70
|
+
}),
|
|
71
|
+
/*#__PURE__*/ jsx("a", {
|
|
72
|
+
onClick: ()=>{
|
|
73
|
+
presenter.sort(record.id, 1);
|
|
74
|
+
},
|
|
75
|
+
children: "↓"
|
|
76
|
+
}),
|
|
66
77
|
'CUSTOM' === record.type && /*#__PURE__*/ jsx(Popconfirm, {
|
|
67
78
|
title: "确认删除吗?",
|
|
68
79
|
onConfirm: ()=>{
|
|
@@ -87,11 +98,13 @@ const ActionTable = (props)=>{
|
|
|
87
98
|
icon: /*#__PURE__*/ jsx(PlusOutlined, {}),
|
|
88
99
|
onClick: ()=>{
|
|
89
100
|
form.resetFields();
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
101
|
+
createCustomAction().then((res)=>{
|
|
102
|
+
if (res.success) {
|
|
103
|
+
const data = res.data;
|
|
104
|
+
form.setFieldsValue(data);
|
|
105
|
+
setVisible(true);
|
|
106
|
+
}
|
|
93
107
|
});
|
|
94
|
-
setVisible(true);
|
|
95
108
|
},
|
|
96
109
|
children: "自定义按钮"
|
|
97
110
|
})
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { FlowAction } from "@coding-flow/flow-types";
|
|
2
2
|
import { FlowActionManager } from "./manager";
|
|
3
3
|
export declare class FlowActionListPresenter {
|
|
4
4
|
private readonly data;
|
|
@@ -7,7 +7,8 @@ export declare class FlowActionListPresenter {
|
|
|
7
7
|
constructor(data: FlowAction[], onChange: (data: FlowAction[]) => void);
|
|
8
8
|
getFlowActionManager(): FlowActionManager;
|
|
9
9
|
enable(id: any, value: boolean): void;
|
|
10
|
+
sort(id: string, order: number): void;
|
|
10
11
|
delete(id: string): void;
|
|
11
12
|
update(action: any): void;
|
|
12
|
-
getDatasource(
|
|
13
|
+
getDatasource(): any[];
|
|
13
14
|
}
|
|
@@ -1,6 +1,3 @@
|
|
|
1
|
-
import { actionOptions } from "@coding-flow/flow-types";
|
|
2
|
-
import { nanoid } from "nanoid";
|
|
3
|
-
import { IdUtils } from "../../../../utils/index.js";
|
|
4
1
|
import { FlowActionManager } from "./manager.js";
|
|
5
2
|
class FlowActionListPresenter {
|
|
6
3
|
data;
|
|
@@ -24,13 +21,30 @@ class FlowActionListPresenter {
|
|
|
24
21
|
});
|
|
25
22
|
this.onChange(data);
|
|
26
23
|
}
|
|
24
|
+
sort(id, order) {
|
|
25
|
+
const index = this.data.findIndex((item)=>item.id === id);
|
|
26
|
+
if (-1 === index) return;
|
|
27
|
+
const targetIndex = index + order;
|
|
28
|
+
if (targetIndex < 0 || targetIndex >= this.data.length) return;
|
|
29
|
+
const data = [
|
|
30
|
+
...this.data
|
|
31
|
+
];
|
|
32
|
+
[data[index], data[targetIndex]] = [
|
|
33
|
+
data[targetIndex],
|
|
34
|
+
data[index]
|
|
35
|
+
];
|
|
36
|
+
this.onChange(data);
|
|
37
|
+
}
|
|
27
38
|
delete(id) {
|
|
28
39
|
const data = this.data.filter((item)=>item.id !== id);
|
|
29
40
|
this.onChange(data);
|
|
30
41
|
}
|
|
31
42
|
update(action) {
|
|
32
43
|
const actionId = action.id;
|
|
33
|
-
|
|
44
|
+
const actionIdList = this.data.map((action)=>action.id);
|
|
45
|
+
console.log('actionIdList:', actionIdList);
|
|
46
|
+
console.log('action:', action);
|
|
47
|
+
if (actionIdList.indexOf(actionId) > 0) {
|
|
34
48
|
const data = this.data.map((item)=>{
|
|
35
49
|
if (item.id === actionId) return {
|
|
36
50
|
...item,
|
|
@@ -43,20 +57,15 @@ class FlowActionListPresenter {
|
|
|
43
57
|
return item;
|
|
44
58
|
});
|
|
45
59
|
this.onChange(data);
|
|
46
|
-
} else
|
|
47
|
-
|
|
60
|
+
} else this.onChange([
|
|
61
|
+
...this.data,
|
|
62
|
+
{
|
|
48
63
|
...action,
|
|
49
|
-
type:
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
};
|
|
53
|
-
this.onChange([
|
|
54
|
-
...this.data,
|
|
55
|
-
custom
|
|
56
|
-
]);
|
|
57
|
-
}
|
|
64
|
+
type: "CUSTOM"
|
|
65
|
+
}
|
|
66
|
+
]);
|
|
58
67
|
}
|
|
59
|
-
getDatasource(
|
|
68
|
+
getDatasource() {
|
|
60
69
|
if (this.data) return this.data.map((item)=>{
|
|
61
70
|
const enable = item.enable;
|
|
62
71
|
return {
|
|
@@ -64,17 +73,7 @@ class FlowActionListPresenter {
|
|
|
64
73
|
enable: void 0 === enable ? true : enable
|
|
65
74
|
};
|
|
66
75
|
});
|
|
67
|
-
|
|
68
|
-
const title = actionOptions.filter((value)=>value.value === type)[0]?.label || '未命名操作';
|
|
69
|
-
return {
|
|
70
|
-
id: nanoid(),
|
|
71
|
-
enable: true,
|
|
72
|
-
title: title,
|
|
73
|
-
type: type
|
|
74
|
-
};
|
|
75
|
-
});
|
|
76
|
-
this.onChange(list);
|
|
77
|
-
return list;
|
|
76
|
+
return [];
|
|
78
77
|
}
|
|
79
78
|
}
|
|
80
79
|
export { FlowActionListPresenter };
|
|
@@ -18,6 +18,7 @@ export declare class WorkflowFormManager {
|
|
|
18
18
|
fields: FormField[];
|
|
19
19
|
};
|
|
20
20
|
updateFieldValue(code: string, values: any): FlowForm;
|
|
21
|
+
sortField(formCode: string, fieldCode: string, order: number): FlowForm;
|
|
21
22
|
removeField(formCode: string, fieldCode: string): {
|
|
22
23
|
fields: FormField[];
|
|
23
24
|
name: string;
|
|
@@ -13,6 +13,7 @@ class WorkflowFormManager {
|
|
|
13
13
|
getFormFields(code) {
|
|
14
14
|
let result = [];
|
|
15
15
|
for (const subForm of this.formList)if (subForm.code == code) result = subForm.fields || [];
|
|
16
|
+
console.log(result);
|
|
16
17
|
return result;
|
|
17
18
|
}
|
|
18
19
|
removeSubForm(code) {
|
|
@@ -62,6 +63,33 @@ class WorkflowFormManager {
|
|
|
62
63
|
})
|
|
63
64
|
};
|
|
64
65
|
}
|
|
66
|
+
sortField(formCode, fieldCode, order) {
|
|
67
|
+
const currentFields = this.getFormFields(formCode) || [];
|
|
68
|
+
const fields = [
|
|
69
|
+
...currentFields
|
|
70
|
+
];
|
|
71
|
+
const index = fields.findIndex((item)=>item.code === fieldCode);
|
|
72
|
+
if (-1 === index) return this.form;
|
|
73
|
+
const targetIndex = index + order;
|
|
74
|
+
if (targetIndex < 0 || targetIndex >= fields.length) return this.form;
|
|
75
|
+
const [field] = fields.splice(index, 1);
|
|
76
|
+
fields.splice(targetIndex, 0, field);
|
|
77
|
+
const mainCode = this.form.code;
|
|
78
|
+
if (formCode === mainCode) return {
|
|
79
|
+
...this.form,
|
|
80
|
+
fields
|
|
81
|
+
};
|
|
82
|
+
return {
|
|
83
|
+
...this.form,
|
|
84
|
+
subForms: (this.form.subForms || []).map((item)=>{
|
|
85
|
+
if (item.code === formCode) return {
|
|
86
|
+
...item,
|
|
87
|
+
fields
|
|
88
|
+
};
|
|
89
|
+
return item;
|
|
90
|
+
})
|
|
91
|
+
};
|
|
92
|
+
}
|
|
65
93
|
removeField(formCode, fieldCode) {
|
|
66
94
|
const currentFields = this.getFormFields(formCode) || [];
|
|
67
95
|
const fields = [
|
|
@@ -19,6 +19,7 @@ export declare class Presenter {
|
|
|
19
19
|
updateViewPanelTab(tab: TabPanelType): void;
|
|
20
20
|
private updateWorkflowForm;
|
|
21
21
|
updateWorkflow(data: any): void;
|
|
22
|
+
sort(formCode: string, fieldCode: string, order: number): void;
|
|
22
23
|
removeWorkflowFormField(formCode: string, fieldCode: string): void;
|
|
23
24
|
removeWorkflowSubForm(code: string): void;
|
|
24
25
|
addWorkflowSubForm(values: any): void;
|
|
@@ -74,6 +74,12 @@ class Presenter {
|
|
|
74
74
|
workflow: this.mergeWorkflow(prevState.workflow, data)
|
|
75
75
|
}));
|
|
76
76
|
}
|
|
77
|
+
sort(formCode, fieldCode, order) {
|
|
78
|
+
const workflowFormManager = new WorkflowFormManager(this.state.workflow.form);
|
|
79
|
+
const form = workflowFormManager.sortField(formCode, fieldCode, order);
|
|
80
|
+
console.log('sort:', form);
|
|
81
|
+
this.updateWorkflowForm(form);
|
|
82
|
+
}
|
|
77
83
|
removeWorkflowFormField(formCode, fieldCode) {
|
|
78
84
|
const workflowFormManager = new WorkflowFormManager(this.state.workflow.form);
|
|
79
85
|
const form = workflowFormManager.removeField(formCode, fieldCode);
|
|
@@ -82,6 +82,18 @@ const FormTable = (props)=>{
|
|
|
82
82
|
},
|
|
83
83
|
children: "编辑"
|
|
84
84
|
}),
|
|
85
|
+
/*#__PURE__*/ jsx("a", {
|
|
86
|
+
onClick: ()=>{
|
|
87
|
+
presenter.sort(props.code, record.code, -1);
|
|
88
|
+
},
|
|
89
|
+
children: "↑"
|
|
90
|
+
}),
|
|
91
|
+
/*#__PURE__*/ jsx("a", {
|
|
92
|
+
onClick: ()=>{
|
|
93
|
+
presenter.sort(props.code, record.code, 1);
|
|
94
|
+
},
|
|
95
|
+
children: "↓"
|
|
96
|
+
}),
|
|
85
97
|
/*#__PURE__*/ jsx(Popconfirm, {
|
|
86
98
|
title: "确认要删除该字段吗?",
|
|
87
99
|
onConfirm: ()=>{
|
|
@@ -1,11 +1,10 @@
|
|
|
1
|
-
import { ActionSelectOption } from "../script-components/typings";
|
|
2
1
|
import React from "react";
|
|
3
2
|
import { DesignViewPluginAction } from "./design-view-plugin-action";
|
|
4
3
|
export declare const VIEW_KEY = "ActionCustomViewPlugin";
|
|
5
4
|
export interface ActionCustomViewPlugin {
|
|
5
|
+
scriptKey: string;
|
|
6
6
|
value?: string;
|
|
7
7
|
onChange?: (value: string) => void;
|
|
8
|
-
options: ActionSelectOption[];
|
|
9
8
|
/** 动作控制 **/
|
|
10
9
|
action?: React.Ref<DesignViewPluginAction>;
|
|
11
10
|
}
|
|
@@ -1,64 +1,60 @@
|
|
|
1
|
-
import { jsx, jsxs } from "react/jsx-runtime";
|
|
1
|
+
import { Fragment, jsx, jsxs } from "react/jsx-runtime";
|
|
2
2
|
import react from "react";
|
|
3
|
-
import {
|
|
4
|
-
import { GroovyCodeEditor } from "../../components/groovy-code/index.js";
|
|
5
|
-
import { Select } from "antd";
|
|
3
|
+
import { Button, Input, Space } from "antd";
|
|
6
4
|
import { VIEW_KEY } from "../action-custom-view-type.js";
|
|
7
5
|
import { ViewBindPlugin } from "@coding-flow/flow-core";
|
|
6
|
+
import { GroovyScriptModal } from "../../script-components/components/groovy-script-modal.js";
|
|
7
|
+
import { AdvancedScriptEditor } from "../../script-components/components/advanced-script-editor.js";
|
|
8
|
+
import { ScriptType } from "../../script-components/typings/index.js";
|
|
9
|
+
import { EditOutlined } from "@ant-design/icons";
|
|
10
|
+
import { GroovyScriptConvertorUtil } from "@coding-script/script-engine";
|
|
11
|
+
import { SCRIPT_DEFAULT_CUSTOM } from "../../script-components/default-script.js";
|
|
8
12
|
const ActionCustomView = (props)=>{
|
|
9
13
|
const ActionCustomViewComponent = ViewBindPlugin.getInstance().get(VIEW_KEY);
|
|
14
|
+
const [visible, setVisible] = react.useState(false);
|
|
10
15
|
if (ActionCustomViewComponent) return /*#__PURE__*/ jsx(ActionCustomViewComponent, {
|
|
11
16
|
...props
|
|
12
17
|
});
|
|
13
|
-
|
|
14
|
-
if (props.value) return ActionCustomScriptUtils.getTrigger(props.value);
|
|
15
|
-
}, [
|
|
16
|
-
props.value
|
|
17
|
-
]);
|
|
18
|
-
const handleChangeNodeType = (value)=>{
|
|
19
|
-
const script = props.value;
|
|
20
|
-
if (script) {
|
|
21
|
-
const groovy = ActionCustomScriptUtils.update(value, script);
|
|
22
|
-
props.onChange?.(groovy);
|
|
23
|
-
}
|
|
24
|
-
};
|
|
25
|
-
return /*#__PURE__*/ jsxs("div", {
|
|
26
|
-
style: {
|
|
27
|
-
marginTop: "8px",
|
|
28
|
-
padding: "8px"
|
|
29
|
-
},
|
|
18
|
+
return /*#__PURE__*/ jsxs(Fragment, {
|
|
30
19
|
children: [
|
|
31
|
-
/*#__PURE__*/ jsxs(
|
|
32
|
-
style: {
|
|
33
|
-
display: "flex",
|
|
34
|
-
justifyContent: "start",
|
|
35
|
-
alignItems: "center",
|
|
36
|
-
marginBottom: "8px"
|
|
37
|
-
},
|
|
20
|
+
/*#__PURE__*/ jsxs(Space.Compact, {
|
|
38
21
|
children: [
|
|
39
|
-
/*#__PURE__*/ jsx(
|
|
40
|
-
|
|
22
|
+
/*#__PURE__*/ jsx(Space.Addon, {
|
|
23
|
+
style: {
|
|
24
|
+
width: '150px'
|
|
25
|
+
},
|
|
26
|
+
children: "触发动作"
|
|
41
27
|
}),
|
|
42
|
-
/*#__PURE__*/ jsx(
|
|
43
|
-
size: "small",
|
|
28
|
+
/*#__PURE__*/ jsx(Input, {
|
|
44
29
|
style: {
|
|
45
|
-
width: '
|
|
46
|
-
marginLeft: "10px"
|
|
30
|
+
width: '150px'
|
|
47
31
|
},
|
|
48
|
-
value:
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
32
|
+
value: GroovyScriptConvertorUtil.getScriptTitle(props.value || ''),
|
|
33
|
+
readOnly: true
|
|
34
|
+
}),
|
|
35
|
+
/*#__PURE__*/ jsx(Button, {
|
|
36
|
+
icon: /*#__PURE__*/ jsx(EditOutlined, {}),
|
|
37
|
+
onClick: ()=>{
|
|
38
|
+
setVisible(true);
|
|
39
|
+
},
|
|
40
|
+
children: "编辑"
|
|
52
41
|
})
|
|
53
42
|
]
|
|
54
43
|
}),
|
|
55
|
-
/*#__PURE__*/ jsx(
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
}
|
|
44
|
+
/*#__PURE__*/ jsx(GroovyScriptModal, {
|
|
45
|
+
type: ScriptType.CUSTOM_ACTION,
|
|
46
|
+
variables: [],
|
|
47
|
+
open: visible,
|
|
48
|
+
onCancel: ()=>{
|
|
49
|
+
setVisible(false);
|
|
50
|
+
},
|
|
51
|
+
resetScript: ()=>SCRIPT_DEFAULT_CUSTOM,
|
|
52
|
+
scriptKey: props.scriptKey,
|
|
53
|
+
script: props.value || "",
|
|
54
|
+
onConfirm: (script)=>{
|
|
55
|
+
props.onChange?.(script);
|
|
56
|
+
},
|
|
57
|
+
content: AdvancedScriptEditor
|
|
62
58
|
})
|
|
63
59
|
]
|
|
64
60
|
});
|
|
@@ -1,27 +1,88 @@
|
|
|
1
|
-
import { jsx } from "react/jsx-runtime";
|
|
2
|
-
import "react";
|
|
3
|
-
import { Col, Form, Row } from "antd";
|
|
1
|
+
import { Fragment, jsx, jsxs } from "react/jsx-runtime";
|
|
2
|
+
import react from "react";
|
|
3
|
+
import { Col, Form, Input, Radio, Row } from "antd";
|
|
4
4
|
import { ActionCustomView } from "../../../../plugins/view/action-custom-view.js";
|
|
5
|
+
import { GroovyScriptLoader } from "../../groovy-script-loader.js";
|
|
6
|
+
const ScriptEditorContent = (props)=>/*#__PURE__*/ jsx(Fragment, {
|
|
7
|
+
children: /*#__PURE__*/ jsx(ActionCustomView, {
|
|
8
|
+
scriptKey: props.scriptKey,
|
|
9
|
+
value: props.value
|
|
10
|
+
})
|
|
11
|
+
});
|
|
5
12
|
const CustomActionForm = (props)=>{
|
|
6
|
-
const
|
|
13
|
+
const [customType, setCustomType] = react.useState("0");
|
|
14
|
+
react.useEffect(()=>{
|
|
15
|
+
const customType = props.form.getFieldValue('customType');
|
|
16
|
+
if (customType) return void setCustomType(customType);
|
|
17
|
+
const triggerFrontEvent = props.form.getFieldValue('triggerFrontEvent');
|
|
18
|
+
if (triggerFrontEvent) {
|
|
19
|
+
setCustomType("-1");
|
|
20
|
+
props.form.setFieldValue('customType', "-1");
|
|
21
|
+
return;
|
|
22
|
+
}
|
|
23
|
+
const script = props.form.getFieldValue("script");
|
|
24
|
+
if (script) {
|
|
25
|
+
setCustomType("1");
|
|
26
|
+
props.form.setFieldValue('customType', "1");
|
|
27
|
+
return;
|
|
28
|
+
}
|
|
29
|
+
setCustomType("0");
|
|
30
|
+
}, [
|
|
31
|
+
props,
|
|
32
|
+
customType
|
|
33
|
+
]);
|
|
7
34
|
return /*#__PURE__*/ jsx(Row, {
|
|
8
|
-
children: /*#__PURE__*/
|
|
35
|
+
children: /*#__PURE__*/ jsxs(Col, {
|
|
9
36
|
span: 24,
|
|
10
|
-
children:
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
37
|
+
children: [
|
|
38
|
+
/*#__PURE__*/ jsx(Form.Item, {
|
|
39
|
+
name: "customType",
|
|
40
|
+
label: "脚本类型",
|
|
41
|
+
children: /*#__PURE__*/ jsxs(Radio.Group, {
|
|
42
|
+
value: customType,
|
|
43
|
+
onChange: (e)=>{
|
|
44
|
+
setCustomType(e.target.value);
|
|
45
|
+
},
|
|
46
|
+
children: [
|
|
47
|
+
/*#__PURE__*/ jsx(Radio, {
|
|
48
|
+
value: "-1",
|
|
49
|
+
children: "前端模式"
|
|
50
|
+
}),
|
|
51
|
+
/*#__PURE__*/ jsx(Radio, {
|
|
52
|
+
value: "1",
|
|
53
|
+
children: "后端模式"
|
|
54
|
+
})
|
|
55
|
+
]
|
|
56
|
+
})
|
|
57
|
+
}),
|
|
58
|
+
"-1" === customType && /*#__PURE__*/ jsx(Form.Item, {
|
|
59
|
+
name: "triggerFrontEvent",
|
|
60
|
+
label: "前端触发事件",
|
|
61
|
+
required: true,
|
|
62
|
+
rules: [
|
|
63
|
+
{
|
|
64
|
+
required: true,
|
|
65
|
+
message: '前端触发事件不能为空'
|
|
66
|
+
}
|
|
67
|
+
],
|
|
68
|
+
children: /*#__PURE__*/ jsx(Input, {
|
|
69
|
+
placeholder: "请输入前端触发事件"
|
|
70
|
+
})
|
|
71
|
+
}),
|
|
72
|
+
"1" === customType && /*#__PURE__*/ jsx(Form.Item, {
|
|
73
|
+
name: "script",
|
|
74
|
+
label: "后端执行脚本",
|
|
75
|
+
rules: [
|
|
76
|
+
{
|
|
77
|
+
required: true,
|
|
78
|
+
message: '自定义脚本不能为空'
|
|
79
|
+
}
|
|
80
|
+
],
|
|
81
|
+
children: /*#__PURE__*/ jsx(GroovyScriptLoader, {
|
|
82
|
+
content: ScriptEditorContent
|
|
83
|
+
})
|
|
23
84
|
})
|
|
24
|
-
|
|
85
|
+
]
|
|
25
86
|
})
|
|
26
87
|
});
|
|
27
88
|
};
|
|
@@ -19,6 +19,16 @@ const ActionForm = (props)=>{
|
|
|
19
19
|
hidden: true,
|
|
20
20
|
children: /*#__PURE__*/ jsx(Input, {})
|
|
21
21
|
}),
|
|
22
|
+
/*#__PURE__*/ jsx(Form.Item, {
|
|
23
|
+
name: "type",
|
|
24
|
+
hidden: true,
|
|
25
|
+
children: /*#__PURE__*/ jsx(Input, {})
|
|
26
|
+
}),
|
|
27
|
+
/*#__PURE__*/ jsx(Form.Item, {
|
|
28
|
+
name: "enable",
|
|
29
|
+
hidden: true,
|
|
30
|
+
children: /*#__PURE__*/ jsx(Input, {})
|
|
31
|
+
}),
|
|
22
32
|
/*#__PURE__*/ jsxs(Row, {
|
|
23
33
|
gutter: [
|
|
24
34
|
8,
|
|
@@ -53,7 +63,7 @@ const ActionForm = (props)=>{
|
|
|
53
63
|
/*#__PURE__*/ jsx(Col, {
|
|
54
64
|
span: 24,
|
|
55
65
|
children: /*#__PURE__*/ jsx(Form.Item, {
|
|
56
|
-
name: "
|
|
66
|
+
name: "display",
|
|
57
67
|
label: "按钮样式",
|
|
58
68
|
children: /*#__PURE__*/ jsx(ActionStyle, {})
|
|
59
69
|
})
|
|
@@ -1,10 +1,67 @@
|
|
|
1
|
-
import { jsx, jsxs } from "react/jsx-runtime";
|
|
2
|
-
import { Col, ColorPicker, Input, Row, Space } from "antd";
|
|
1
|
+
import { Fragment, jsx, jsxs } from "react/jsx-runtime";
|
|
2
|
+
import { Button, Col, ColorPicker, Input, Row, Space } from "antd";
|
|
3
3
|
import react from "react";
|
|
4
|
+
import { GroovyScriptLoader } from "../groovy-script-loader.js";
|
|
5
|
+
import { AdvancedScriptEditor } from "../advanced-script-editor.js";
|
|
6
|
+
import { ScriptType } from "../../typings/index.js";
|
|
7
|
+
import { GroovyScriptConvertorUtil } from "@coding-script/script-engine";
|
|
8
|
+
import { GroovyScriptModal } from "../groovy-script-modal.js";
|
|
9
|
+
import { EditOutlined } from "@ant-design/icons";
|
|
10
|
+
const ActionScriptContent = (props)=>/*#__PURE__*/ jsx(AdvancedScriptEditor, {
|
|
11
|
+
...props
|
|
12
|
+
});
|
|
13
|
+
const ActionScript = (props)=>{
|
|
14
|
+
const [visible, setVisible] = react.useState(false);
|
|
15
|
+
return /*#__PURE__*/ jsxs(Fragment, {
|
|
16
|
+
children: [
|
|
17
|
+
/*#__PURE__*/ jsxs(Space.Compact, {
|
|
18
|
+
children: [
|
|
19
|
+
/*#__PURE__*/ jsx(Space.Addon, {
|
|
20
|
+
style: {
|
|
21
|
+
width: '150px'
|
|
22
|
+
},
|
|
23
|
+
children: /*#__PURE__*/ jsx("span", {
|
|
24
|
+
children: "显示条件"
|
|
25
|
+
})
|
|
26
|
+
}),
|
|
27
|
+
/*#__PURE__*/ jsx(Input, {
|
|
28
|
+
readOnly: true,
|
|
29
|
+
style: {
|
|
30
|
+
width: '150px'
|
|
31
|
+
},
|
|
32
|
+
value: GroovyScriptConvertorUtil.getScriptTitle(props.value || '')
|
|
33
|
+
}),
|
|
34
|
+
/*#__PURE__*/ jsx(Button, {
|
|
35
|
+
icon: /*#__PURE__*/ jsx(EditOutlined, {}),
|
|
36
|
+
onClick: ()=>{
|
|
37
|
+
setVisible(true);
|
|
38
|
+
},
|
|
39
|
+
children: "修改"
|
|
40
|
+
})
|
|
41
|
+
]
|
|
42
|
+
}),
|
|
43
|
+
/*#__PURE__*/ jsx(GroovyScriptModal, {
|
|
44
|
+
type: ScriptType.ACTION_DISPLAY,
|
|
45
|
+
variables: [],
|
|
46
|
+
scriptKey: props.scriptKey,
|
|
47
|
+
script: props.value || '',
|
|
48
|
+
open: visible,
|
|
49
|
+
onCancel: ()=>{
|
|
50
|
+
setVisible(false);
|
|
51
|
+
},
|
|
52
|
+
onConfirm: (value)=>{
|
|
53
|
+
props.onChange?.(value);
|
|
54
|
+
setVisible(false);
|
|
55
|
+
},
|
|
56
|
+
content: ActionScriptContent
|
|
57
|
+
})
|
|
58
|
+
]
|
|
59
|
+
});
|
|
60
|
+
};
|
|
4
61
|
const ActionStyle = (props)=>{
|
|
5
|
-
const [style, setStyle] = react.useState(props.value
|
|
62
|
+
const [style, setStyle] = react.useState(props.value || {});
|
|
6
63
|
react.useEffect(()=>{
|
|
7
|
-
props.onChange && props.onChange(
|
|
64
|
+
props.onChange && props.onChange(style);
|
|
8
65
|
}, [
|
|
9
66
|
style
|
|
10
67
|
]);
|
|
@@ -28,7 +85,7 @@ const ActionStyle = (props)=>{
|
|
|
28
85
|
})
|
|
29
86
|
}),
|
|
30
87
|
/*#__PURE__*/ jsx(ColorPicker, {
|
|
31
|
-
value: style.backgroundColor,
|
|
88
|
+
value: style.backgroundColor || '',
|
|
32
89
|
onChange: (value)=>{
|
|
33
90
|
if (value) setStyle((prevState)=>({
|
|
34
91
|
...prevState,
|
|
@@ -52,7 +109,7 @@ const ActionStyle = (props)=>{
|
|
|
52
109
|
})
|
|
53
110
|
}),
|
|
54
111
|
/*#__PURE__*/ jsx(ColorPicker, {
|
|
55
|
-
value: style.borderColor,
|
|
112
|
+
value: style.borderColor || '',
|
|
56
113
|
onChange: (value)=>{
|
|
57
114
|
if (value) setStyle((prevState)=>({
|
|
58
115
|
...prevState,
|
|
@@ -120,6 +177,13 @@ const ActionStyle = (props)=>{
|
|
|
120
177
|
})
|
|
121
178
|
]
|
|
122
179
|
})
|
|
180
|
+
}),
|
|
181
|
+
/*#__PURE__*/ jsx(Col, {
|
|
182
|
+
span: 24,
|
|
183
|
+
children: /*#__PURE__*/ jsx(GroovyScriptLoader, {
|
|
184
|
+
content: ActionScript,
|
|
185
|
+
value: style.script
|
|
186
|
+
})
|
|
123
187
|
})
|
|
124
188
|
]
|
|
125
189
|
})
|
|
@@ -2,9 +2,9 @@ import React from 'react';
|
|
|
2
2
|
export interface GroovyScriptLoaderProps {
|
|
3
3
|
value?: string;
|
|
4
4
|
onChange?: (value: string) => void;
|
|
5
|
-
content: React.ComponentType<
|
|
5
|
+
content: React.ComponentType<GroovyScriptLoaderContent>;
|
|
6
6
|
}
|
|
7
|
-
export interface
|
|
7
|
+
export interface GroovyScriptLoaderContent {
|
|
8
8
|
scriptKey: string;
|
|
9
9
|
value?: string;
|
|
10
10
|
onChange?: (value: string) => void;
|
|
@@ -7,5 +7,5 @@ export declare const SCRIPT_DEFAULT_ERROR_TRIGGER = "// @SCRIPT_TITLE \u56DE\u90
|
|
|
7
7
|
export declare const SCRIPT_DEFAULT_CONDITION = "// @SCRIPT_TITLE \u9ED8\u8BA4\u6761\u4EF6\uFF08\u5141\u8BB8\u6267\u884C\uFF09\ndef run(request){\n return true;\n}\n";
|
|
8
8
|
export declare const SCRIPT_DEFAULT_ROUTER = "// @SCRIPT_TITLE \u53D1\u8D77\u8282\u70B9\n// @SCRIPT_META {\"node\":\"START\"}\ndef run(request){\n return request.getStartNode().getId();\n}\n";
|
|
9
9
|
export declare const SCRIPT_DEFAULT_TRIGGER = "// @SCRIPT_TITLE \u793A\u4F8B\u89E6\u53D1\u8282\u70B9\uFF08\u6253\u5370\u89E6\u53D1\u65E5\u5FD7\uFF09 \ndef run(request){ \n print('hello trigger node.\\n'); \n}\n";
|
|
10
|
-
export declare const SCRIPT_DEFAULT_CUSTOM = "// @SCRIPT_TITLE \
|
|
10
|
+
export declare const SCRIPT_DEFAULT_CUSTOM = "// @SCRIPT_TITLE \u89E6\u53D1\u901A\u8FC7\n// @SCRIPT_META {\"trigger\":\"PASS\"}\ndef run(request){ \n return 'PASS'; \n}\n";
|
|
11
11
|
export declare const SCRIPT_DEFAULT_SUB_PROCESS = "// @SCRIPT_TITLE \u521B\u5EFA\u5F53\u524D\u6D41\u7A0B \ndef run(request){ \n return request.toCreateRequest() \n}\n";
|
|
@@ -18,7 +18,11 @@ export declare enum ScriptType {
|
|
|
18
18
|
/** 路由节点脚本 */
|
|
19
19
|
ROUTER = "ROUTER",
|
|
20
20
|
/** 子流程节点脚本 */
|
|
21
|
-
SUB_PROCESS = "SUB_PROCESS"
|
|
21
|
+
SUB_PROCESS = "SUB_PROCESS",
|
|
22
|
+
/** 自定义操作 */
|
|
23
|
+
CUSTOM_ACTION = "CUSTOM_ACTION",
|
|
24
|
+
/** 按钮展示条件 */
|
|
25
|
+
ACTION_DISPLAY = "ACTION_DISPLAY"
|
|
22
26
|
}
|
|
23
27
|
/**
|
|
24
28
|
* Groovy变量映射接口
|
|
@@ -7,6 +7,8 @@ var script_ScriptType = /*#__PURE__*/ function(ScriptType) {
|
|
|
7
7
|
ScriptType["TRIGGER"] = "TRIGGER";
|
|
8
8
|
ScriptType["ROUTER"] = "ROUTER";
|
|
9
9
|
ScriptType["SUB_PROCESS"] = "SUB_PROCESS";
|
|
10
|
+
ScriptType["CUSTOM_ACTION"] = "CUSTOM_ACTION";
|
|
11
|
+
ScriptType["ACTION_DISPLAY"] = "ACTION_DISPLAY";
|
|
10
12
|
return ScriptType;
|
|
11
13
|
}({});
|
|
12
14
|
var script_VariableTag = /*#__PURE__*/ function(VariableTag) {
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@coding-flow/flow-design",
|
|
3
|
-
"version": "0.0.
|
|
3
|
+
"version": "0.0.48",
|
|
4
4
|
"description": "flow-engine design components ",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"keywords": [
|
|
@@ -33,7 +33,7 @@
|
|
|
33
33
|
},
|
|
34
34
|
"dependencies": {
|
|
35
35
|
"@ant-design/icons": "~6.1.0",
|
|
36
|
-
"@coding-script/script-engine": "^0.0.
|
|
36
|
+
"@coding-script/script-engine": "^0.0.9",
|
|
37
37
|
"@flowgram.ai/export-plugin": "1.0.8",
|
|
38
38
|
"@flowgram.ai/fixed-layout-editor": "1.0.8",
|
|
39
39
|
"@flowgram.ai/fixed-semi-materials": "1.0.8",
|
|
@@ -49,16 +49,16 @@
|
|
|
49
49
|
"nanoid": "^5.1.6",
|
|
50
50
|
"react-redux": "^9.2.0",
|
|
51
51
|
"styled-components": "^5.3.11",
|
|
52
|
-
"@coding-flow/flow-core": "0.0.
|
|
53
|
-
"@coding-flow/flow-
|
|
54
|
-
"@coding-flow/flow-
|
|
55
|
-
"@coding-flow/flow-
|
|
52
|
+
"@coding-flow/flow-core": "0.0.48",
|
|
53
|
+
"@coding-flow/flow-icons": "0.0.48",
|
|
54
|
+
"@coding-flow/flow-types": "0.0.48",
|
|
55
|
+
"@coding-flow/flow-pc-ui": "0.0.48"
|
|
56
56
|
},
|
|
57
57
|
"devDependencies": {
|
|
58
58
|
"@types/lodash-es": "^4.17.12",
|
|
59
59
|
"@types/styled-components": "^5.1.36",
|
|
60
|
-
"@coding-flow/flow-core": "0.0.
|
|
61
|
-
"@coding-flow/flow-types": "0.0.
|
|
60
|
+
"@coding-flow/flow-core": "0.0.48",
|
|
61
|
+
"@coding-flow/flow-types": "0.0.48"
|
|
62
62
|
},
|
|
63
63
|
"scripts": {
|
|
64
64
|
"build": "rslib build",
|
|
@@ -1,68 +0,0 @@
|
|
|
1
|
-
import { jsx, jsxs } from "react/jsx-runtime";
|
|
2
|
-
import react from "react";
|
|
3
|
-
import { GroovyCodeEditor } from "../../../components/groovy-code/index.js";
|
|
4
|
-
import { Col, Form, Select, Space } from "antd";
|
|
5
|
-
import { GroovyScriptConvertorUtil } from "@coding-flow/flow-core";
|
|
6
|
-
const CustomScriptView = (props)=>{
|
|
7
|
-
const trigger = props.form.getFieldValue("trigger");
|
|
8
|
-
const [currentTrigger, setCurrentTrigger] = react.useState(trigger);
|
|
9
|
-
const handleChangeNodeType = (value)=>{
|
|
10
|
-
const script = props.form.getFieldValue("script");
|
|
11
|
-
let groovy;
|
|
12
|
-
if (script) {
|
|
13
|
-
const returnData = GroovyScriptConvertorUtil.getReturnScript(script).trim();
|
|
14
|
-
groovy = script.replace(returnData, `'${value}'`);
|
|
15
|
-
groovy = GroovyScriptConvertorUtil.updateScriptMeta(groovy, `{"trigger":"${value}"}`);
|
|
16
|
-
} else groovy = `// @CUSTOM_SCRIPT 自定义脚本,返回的数据为动作类型
|
|
17
|
-
// @SCRIPT_META {"trigger":"${value}"}
|
|
18
|
-
def run(request){
|
|
19
|
-
return '${value}';
|
|
20
|
-
}
|
|
21
|
-
`;
|
|
22
|
-
props.form.setFieldValue("script", GroovyScriptConvertorUtil.formatScript(groovy));
|
|
23
|
-
setCurrentTrigger(value);
|
|
24
|
-
};
|
|
25
|
-
return /*#__PURE__*/ jsx(Col, {
|
|
26
|
-
span: 24,
|
|
27
|
-
children: /*#__PURE__*/ jsx(Form.Item, {
|
|
28
|
-
name: "script",
|
|
29
|
-
label: /*#__PURE__*/ jsxs(Space, {
|
|
30
|
-
children: [
|
|
31
|
-
"自定义脚本",
|
|
32
|
-
/*#__PURE__*/ jsxs(Space.Compact, {
|
|
33
|
-
size: "small",
|
|
34
|
-
children: [
|
|
35
|
-
/*#__PURE__*/ jsx(Space.Addon, {
|
|
36
|
-
children: "触发动作:"
|
|
37
|
-
}),
|
|
38
|
-
/*#__PURE__*/ jsx(Select, {
|
|
39
|
-
style: {
|
|
40
|
-
width: '100px'
|
|
41
|
-
},
|
|
42
|
-
value: currentTrigger,
|
|
43
|
-
placeholder: "请选择触发动作类型",
|
|
44
|
-
options: props.options,
|
|
45
|
-
onChange: handleChangeNodeType
|
|
46
|
-
})
|
|
47
|
-
]
|
|
48
|
-
})
|
|
49
|
-
]
|
|
50
|
-
}),
|
|
51
|
-
required: true,
|
|
52
|
-
help: "请先设置触发动作类型",
|
|
53
|
-
rules: [
|
|
54
|
-
{
|
|
55
|
-
required: true,
|
|
56
|
-
message: '自定义脚本不能为空'
|
|
57
|
-
}
|
|
58
|
-
],
|
|
59
|
-
children: /*#__PURE__*/ jsx(GroovyCodeEditor, {
|
|
60
|
-
placeholder: "请输入自定义脚本",
|
|
61
|
-
options: {
|
|
62
|
-
minHeight: 200
|
|
63
|
-
}
|
|
64
|
-
})
|
|
65
|
-
})
|
|
66
|
-
});
|
|
67
|
-
};
|
|
68
|
-
export { CustomScriptView };
|