Skip to content

Commit 407ab11

Browse files
xlornexlorne
committed
fix flow
1 parent 3a9807d commit 407ab11

File tree

9 files changed

+154
-148
lines changed

9 files changed

+154
-148
lines changed

‎admin-pro-ui/src/components/flow/nodes/panel/ButtonPanel.tsx

Lines changed: 92 additions & 86 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,10 @@
11
import React from "react";
2-
import {ActionType, ProColumns, ProForm, ProTable} from "@ant-design/pro-components";
3-
import {Button, ColorPicker, Modal, Popconfirm, Space} from "antd";
2+
import {ActionType, ModalForm, ProColumns, ProForm, ProFormText, ProTable} from "@ant-design/pro-components";
3+
import {Button, ColorPicker, Popconfirm, Space} from "antd";
44
import FlowUtils from "@/components/flow/utils";
55
import ScriptModal from "@/components/flow/nodes/panel/ScriptModal";
66
import {EyeOutlined} from "@ant-design/icons";
77
import FlowContext from "@/components/flow/domain/FlowContext";
8-
import Form, {FormAction} from "@/components/form";
98
import FormInput from "@/components/form/input";
109
import ValidateUtils from "@/components/form/utils";
1110
import FormSelect from "@/components/form/select";
@@ -19,9 +18,9 @@ const ButtonPanel: React.FC<ButtonPanelProps> = (props) => {
1918

2019
const actionRef = React.useRef<ActionType>();
2120

22-
const formAction = React.useRef<FormAction>(null);
21+
const [form] = ProForm.useForm();
22+
const [groovyForm] = ProForm.useForm();
2323

24-
const groovyFormAction = React.useRef<FormAction>(null);
2524

2625
const [visible, setVisible] = React.useState(false);
2726

@@ -72,8 +71,8 @@ const ButtonPanel: React.FC<ButtonPanelProps> = (props) => {
7271
<a
7372
key={"edit"}
7473
onClick={() => {
75-
groovyFormAction.current?.reset();
76-
groovyFormAction.current?.setFieldsValue(record);
74+
groovyForm.resetFields();
75+
form.setFieldsValue(record);
7776
setType(record.type);
7877
setVisible(true);
7978
}}
@@ -115,113 +114,120 @@ const ButtonPanel: React.FC<ButtonPanelProps> = (props) => {
115114
<Button
116115
type={"primary"}
117116
onClick={() => {
118-
groovyFormAction.current?.reset();
117+
groovyForm.resetFields();
119118
setVisible(true);
120119
}}
121120
>添加按钮</Button>
122121
]
123122
}}
124123
/>
125124

126-
<Modal
125+
<ModalForm
127126
title={"添加节点按钮"}
128127
open={visible}
129-
onCancel={()=>{setVisible(false)}}
130-
onOk={()=>{
131-
const values = formAction.current?.getFieldsValue();
132-
flowContext.getFlowPanelContext()?.updateButton(props.id, values);
128+
form={form}
129+
onFinish={async (values) => {
130+
flowContext.getFlowPanelContext()?.updateButton(props.id, values as any);
133131
setVisible(false);
134132
actionRef.current?.reload();
135133
}}
136-
destroyOnClose={true}
134+
modalProps={{
135+
onCancel: () => {
136+
setVisible(false);
137+
},
138+
onClose:()=>{
139+
setVisible(false);
140+
},
141+
destroyOnClose:true
142+
}}
137143
>
138-
<Form
139-
actionRef={formAction}
140-
layout={"vertical"}
141-
>
142-
<FormInput
143-
name={"id"}
144-
hidden={true}
145-
/>
146-
147-
<FormInput
148-
name={"name"}
149-
label={"按钮名称"}
150-
placeholder={"请输入按钮名称"}
151-
required={true}
152-
validateFunction={ValidateUtils.validateNotEmpty}
153-
/>
154-
155-
<FormColor
156-
name={["style","background"]}
157-
label={"按钮颜色"}
158-
placeholder={"请输入按钮颜色"}
159-
required={true}
160-
validateFunction={ValidateUtils.validateNotEmpty}
161-
/>
162-
163-
<FormSelect
164-
name={"type"}
165-
label={(
166-
<Space>
167-
按钮类型
168-
169-
{type === 'CUSTOM' && (
170-
<EyeOutlined
171-
onClick={() => {
172-
groovyFormAction.current?.reset();
173-
const script = groovyFormAction.current?.getFieldValue('groovy') || 'def run(content){\n //你的代码 \n return content.createMessageResult(\'我是自定义标题\');\n}';
174-
groovyFormAction.current?.setFieldsValue({
175-
'script': script
176-
});
177-
setScriptVisible(!scriptVisible);
178-
}}/>
179-
)}
180-
181-
</Space>
182-
)}
183-
placeholder={"请输入按钮类型"}
184-
required={true}
185-
options={flowContext.getFlowPanelContext()?.getButtonEventOptions()}
186-
onChange={(value: string) => {
187-
setType(value);
188-
}}
189-
/>
190-
191-
{type === 'VIEW' && (
192-
<FormInput
193-
name={"eventKey"}
194-
label={"事件Key"}
195-
help={"事件Key用于流程Form的事件触发"}
196-
required={true}
197-
/>
144+
<FormInput
145+
name={"id"}
146+
hidden={true}
147+
/>
148+
149+
<ProFormText
150+
name={"name"}
151+
label={"按钮名称"}
152+
placeholder={"请输入按钮名称"}
153+
required={true}
154+
rules={[
155+
{
156+
required: true,
157+
message: '请输入按钮名称',
158+
},
159+
]}
160+
/>
161+
162+
<FormColor
163+
name={["style","background"]}
164+
label={"按钮颜色"}
165+
placeholder={"请输入按钮颜色"}
166+
required={true}
167+
validateFunction={ValidateUtils.validateNotEmpty}
168+
/>
169+
170+
<FormSelect
171+
name={"type"}
172+
label={(
173+
<Space>
174+
按钮类型
175+
176+
{type === 'CUSTOM' && (
177+
<EyeOutlined
178+
onClick={() => {
179+
groovyForm.resetFields();
180+
const script = form.getFieldValue('groovy') || 'def run(content){\n //你的代码 \n return content.createMessageResult(\'我是自定义标题\');\n}';
181+
groovyForm.setFieldsValue({
182+
'script': script
183+
});
184+
setScriptVisible(!scriptVisible);
185+
}}/>
186+
)}
187+
188+
</Space>
198189
)}
190+
placeholder={"请输入按钮类型"}
191+
required={true}
192+
options={flowContext.getFlowPanelContext()?.getButtonEventOptions()}
193+
onChange={(value: string) => {
194+
setType(value);
195+
}}
196+
/>
199197

198+
{type === 'VIEW' && (
200199
<FormInput
201-
name={"groovy"}
202-
hidden={true}
200+
name={"eventKey"}
201+
label={"事件Key"}
202+
help={"事件Key用于流程Form的事件触发"}
203+
required={true}
203204
/>
205+
)}
204206

205-
<FormInput
206-
name={"order"}
207-
label={"排序"}
208-
inputType={"number"}
209-
placeholder={"请输入排序"}
210-
/>
207+
<FormInput
208+
name={"groovy"}
209+
hidden={true}
210+
/>
211211

212-
</Form>
212+
<FormInput
213+
name={"order"}
214+
label={"排序"}
215+
inputType={"number"}
216+
placeholder={"请输入排序"}
217+
/>
213218

214219
<ScriptModal
215220
onFinish={(values) => {
216-
groovyFormAction.current?.setFieldsValue({
221+
console.log('values', values);
222+
form.setFieldsValue({
217223
'groovy': values.script
218224
});
219225
}}
220-
formAction={groovyFormAction}
226+
form={groovyForm}
221227
setVisible={setScriptVisible}
222228
visible={scriptVisible}/>
223229

224-
</Modal>
230+
</ModalForm>
225231
</>
226232
)
227233
}

‎admin-pro-ui/src/components/flow/nodes/panel/EdgePanel.tsx

Lines changed: 5 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,9 @@
11
import React from "react";
2-
import {ActionType, ProTable} from "@ant-design/pro-components";
2+
import {ActionType, ProForm, ProTable} from "@ant-design/pro-components";
33
import {Input, InputNumber, Popconfirm, Space} from "antd";
44
import {CheckOutlined, EditOutlined, SettingOutlined} from "@ant-design/icons";
55
import FlowUtils from "@/components/flow/utils";
66
import ScriptModal from "@/components/flow/nodes/panel/ScriptModal";
7-
import {FormAction} from "@/components/form";
87

98
interface EdgePanelProps {
109
id?: string;
@@ -18,7 +17,7 @@ const EdgePanel: React.FC<EdgePanelProps> = (props) => {
1817
const [name, setName] = React.useState("");
1918
const [order, setOrder] = React.useState(0);
2019

21-
const groovyFormAction = React.useRef<FormAction>(null);
20+
const [groovyForm] = ProForm.useForm();
2221
const actionRef = React.useRef<ActionType>();
2322

2423
const handlerChangeName = (id: any) => {
@@ -95,8 +94,8 @@ const EdgePanel: React.FC<EdgePanelProps> = (props) => {
9594
<Space>
9695
<SettingOutlined
9796
onClick={() => {
98-
groovyFormAction.current?.setFieldValue("script", record.outTrigger);
99-
groovyFormAction.current?.setFieldValue("type", record.id);
97+
groovyForm.setFieldValue("script", record.outTrigger);
98+
groovyForm.setFieldValue("type", record.id);
10099
setVisible(true);
101100
}}/>
102101
{record.outTrigger ? (<CheckOutlined/>) : null}
@@ -184,7 +183,7 @@ const EdgePanel: React.FC<EdgePanelProps> = (props) => {
184183
onFinish={(values) => {
185184
handlerChangeOutTrigger(values.type, values.script);
186185
}}
187-
formAction={groovyFormAction}
186+
form={groovyForm}
188187
setVisible={setVisible}
189188
visible={visible}/>
190189
</>

0 commit comments

Comments
 (0)