Skip to content

Commit 30fd641

Browse files
committed
fix flow
1 parent 815a02f commit 30fd641

File tree

5 files changed

+59
-73
lines changed

5 files changed

+59
-73
lines changed

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

Lines changed: 43 additions & 58 deletions
Original file line numberDiff line numberDiff line change
@@ -1,17 +1,22 @@
11
import React from "react";
22
import {Button, Divider, Space} from "antd";
3-
import {ProForm, ProFormDigit, ProFormSelect, ProFormSwitch, ProFormText} from "@ant-design/pro-components";
3+
import {ProForm} from "@ant-design/pro-components";
44
import {EyeOutlined, SettingOutlined} from "@ant-design/icons";
55
import GroovyScript from "@/components/flow/utils/script";
66
import ScriptModal from "@/components/flow/nodes/panel/ScriptModal";
77
import {getComponent} from "@/framework/ComponentBus";
88
import {UserSelectProps, UserSelectViewKey} from "@/components/flow/flow/types";
9+
import Form, {FormAction} from "@/components/form";
10+
import FormInput from "@/components/form/input";
11+
import ValidateUtils from "@/components/form/utils";
12+
import FormSelect from "@/components/form/select";
13+
import FormSwitch from "@/components/form/switch";
914

1015
interface NodePanelProps {
1116
id?: string,
1217
data?: any,
1318
onFinish: (values: any) => void,
14-
form: any,
19+
formAction: React.RefObject<FormAction>,
1520
type: string,
1621
}
1722

@@ -31,69 +36,54 @@ const NodePanel: React.FC<NodePanelProps> = (props) => {
3136

3237
return (
3338
<>
34-
<ProForm
39+
<Form
3540
initialValues={{
3641
...props.data,
3742
operatorMatcherType: GroovyScript.operatorMatcherType(props.data?.operatorMatcher),
3843
errTriggerType: GroovyScript.errTriggerType(props.data?.errTrigger),
3944
titleGeneratorType: GroovyScript.titleGeneratorType(props.data?.titleGenerator),
4045
}}
41-
form={props.form}
46+
actionRef={props.formAction}
4247
layout={"vertical"}
43-
onFinish={props.onFinish}
44-
submitter={false}
48+
onFinish={async (values)=>{
49+
props.onFinish(values);
50+
}}
4551
>
4652
<Divider>
4753
基本信息
4854
</Divider>
49-
<ProFormText
55+
<FormInput
5056
name={"name"}
5157
label={"节点名称"}
52-
rules={[
53-
{
54-
required: true,
55-
message: "请输入节点名称"
56-
}
57-
]}
58+
required={true}
59+
validateFunction={ValidateUtils.validateNotEmpty}
5860
/>
59-
<ProFormText
61+
<FormInput
6062
name={"code"}
6163
disabled={props.type === 'start' || props.type === 'over'}
6264
label={"节点编码"}
63-
rules={[
64-
{
65-
required: true,
66-
message: "请输入节点编码"
67-
}
68-
]}
65+
required={true}
66+
validateFunction={ValidateUtils.validateNotEmpty}
6967
/>
70-
<ProFormText
68+
<FormInput
7169
name={"view"}
7270
label={"视图名称"}
7371
tooltip={"界面渲染视图的名称"}
74-
rules={[
75-
{
76-
required: true,
77-
message: "请输入视图名称"
78-
}
79-
]}
72+
required={true}
73+
validateFunction={ValidateUtils.validateNotEmpty}
8074
/>
8175

8276
<Divider>
8377
节点配置
8478
</Divider>
8579

86-
<ProFormSelect
80+
<FormSelect
8781
name={"approvalType"}
8882
label={"节点类型"}
8983
hidden={props.type !== 'node'}
9084
tooltip={"会签即多人审批以后再处理,非会签则是一个人处理以后即可响应"}
91-
rules={[
92-
{
93-
required: true,
94-
message: "请输入节点类型"
95-
}
96-
]}
85+
required={true}
86+
validateFunction={ValidateUtils.validateNotEmpty}
9787
options={[
9888
{
9989
label: "会签",
@@ -106,18 +96,17 @@ const NodePanel: React.FC<NodePanelProps> = (props) => {
10696
]}
10797
/>
10898

109-
<ProFormText
99+
<FormInput
110100
tooltip={"操作人匹配脚本"}
111101
name={"operatorMatcher"}
112102
label={"操作人"}
113103
hidden={true}
114104
/>
115105

116-
<ProFormSelect
106+
<FormSelect
117107
tooltip={"操作人匹配脚本"}
118108
name={"operatorMatcherType"}
119109
label={"操作人"}
120-
width={"lg"}
121110
options={[
122111
{
123112
label: "任意人",
@@ -134,7 +123,7 @@ const NodePanel: React.FC<NodePanelProps> = (props) => {
134123
]}
135124
onChange={(value) => {
136125
setOperatorMatcherType(value as string);
137-
props.form.setFieldsValue({
126+
props.formAction.current?.setFieldsValue({
138127
operatorMatcher: GroovyScript.operatorMatcher(value as string)
139128
})
140129
}}
@@ -153,7 +142,7 @@ const NodePanel: React.FC<NodePanelProps> = (props) => {
153142

154143
<EyeOutlined
155144
onClick={() => {
156-
const value = props.form.getFieldValue("operatorMatcher");
145+
const value = props.formAction.current?.getFieldValue("operatorMatcher");
157146
form.setFieldValue("type", "operatorMatcher");
158147
form.setFieldValue("script", value);
159148
setVisible(true);
@@ -163,33 +152,30 @@ const NodePanel: React.FC<NodePanelProps> = (props) => {
163152
)}
164153
/>
165154

166-
<ProFormDigit
155+
<FormInput
156+
inputType={"number"}
167157
tooltip={"超时提醒时间,单位毫米。为0时则为无超时设置"}
168-
fieldProps={{
169-
step: 1
170-
}}
171158
name={"timeout"}
172159
hidden={props.type === 'circulate'}
173160
label={"超时时间"}
174161
/>
175162

176-
<ProFormSwitch
163+
<FormSwitch
177164
tooltip={"关闭编辑以后在当前节点下的流程表单无法修改数据"}
178165
name={"editable"}
179166
label={"是否编辑"}
180167
/>
181168

182-
<ProFormText
169+
<FormInput
183170
name={"titleGenerator"}
184171
label={"自定义标题"}
185172
hidden={true}
186173
/>
187174

188-
<ProFormSelect
175+
<FormSelect
189176
tooltip={"待办记录中的标题生成器脚本"}
190177
name={"titleGeneratorType"}
191178
label={"自定义标题"}
192-
width={"lg"}
193179
options={[
194180
{
195181
label: "默认",
@@ -202,15 +188,15 @@ const NodePanel: React.FC<NodePanelProps> = (props) => {
202188
]}
203189
onChange={(value) => {
204190
if (value === "default") {
205-
props.form.setFieldsValue({
191+
props.formAction.current?.setFieldsValue({
206192
titleGenerator: GroovyScript.defaultTitleGenerator
207193
})
208194
}
209195
}}
210196
addonAfter={(
211197
<EyeOutlined
212198
onClick={() => {
213-
const value = props.form.getFieldValue("titleGenerator");
199+
const value = props.formAction.current?.getFieldValue("titleGenerator");
214200
form.setFieldValue("type", "titleGenerator");
215201
form.setFieldValue("script", value);
216202
setVisible(true);
@@ -222,17 +208,16 @@ const NodePanel: React.FC<NodePanelProps> = (props) => {
222208
异常配置
223209
</Divider>
224210

225-
<ProFormText
211+
<FormInput
226212
name={"errTrigger"}
227213
label={"异常配置"}
228214
hidden={true}
229215
/>
230216

231-
<ProFormSelect
217+
<FormSelect
232218
tooltip={"当节点无人员匹配时的异常补偿脚本,可以指定人员或节点处理"}
233219
name={"errTriggerType"}
234220
label={"异常配置"}
235-
width={"lg"}
236221
options={[
237222
{
238223
label: "默认",
@@ -245,28 +230,28 @@ const NodePanel: React.FC<NodePanelProps> = (props) => {
245230
]}
246231
onChange={(value) => {
247232
if (value === "default") {
248-
props.form.setFieldsValue({
233+
props.formAction.current?.setFieldsValue({
249234
errTrigger: GroovyScript.defaultOutTrigger
250235
})
251236
}
252237
}}
253238
addonAfter={(
254239
<EyeOutlined
255240
onClick={() => {
256-
const value = props.form.getFieldValue("errTrigger");
241+
const value = props.formAction.current?.getFieldValue("errTrigger");
257242
form.setFieldValue("type", "errTrigger");
258243
form.setFieldValue("script", value);
259244
setVisible(true);
260245
}}/>
261246
)}
262247
/>
263248

264-
</ProForm>
249+
</Form>
265250

266251
<ScriptModal
267252
onFinish={(values) => {
268253
const type = values.type;
269-
props.form.setFieldsValue({
254+
props.formAction.current?.setFieldsValue({
270255
[type]: values.script
271256
});
272257
}}
@@ -279,12 +264,12 @@ const NodePanel: React.FC<NodePanelProps> = (props) => {
279264
visible={userSelectVisible}
280265
setVisible={setUserSelectVisible}
281266
userSelectType={"users"}
282-
specifyUserIds={GroovyScript.getOperatorUsers(props.form.getFieldValue("operatorMatcher"))}
267+
specifyUserIds={GroovyScript.getOperatorUsers(props.formAction.current?.getFieldValue("operatorMatcher"))}
283268
mode={"multiple"}
284269
onFinish={(values) => {
285270
setUserSelectVisible(false);
286271
const script = GroovyScript.specifyOperatorMatcher.replaceAll("%s", values.map((item: any) => item.id).join(","));
287-
props.form.setFieldsValue({
272+
props.formAction.current?.setFieldsValue({
288273
operatorMatcher: script
289274
});
290275
}}

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

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,13 @@
11
import React from "react";
2-
import {ProForm} from "@ant-design/pro-components";
32
import {Button, Drawer, Space, Tabs} from "antd";
43
import NodePanel from "@/components/flow/nodes/panel/NodePanel";
54
import EdgePanel from "@/components/flow/nodes/panel/EdgePanel";
65
import {SettingPanelProps} from "@/components/flow/types";
6+
import {FormAction} from "@/components/form";
77

88
const CirculateSettingPanel: React.FC<SettingPanelProps> = (props) => {
99

10-
const [form] = ProForm.useForm();
10+
const formAction = React.useRef<FormAction>(null);
1111

1212
return (
1313
<Drawer
@@ -23,7 +23,7 @@ const CirculateSettingPanel: React.FC<SettingPanelProps> = (props) => {
2323
<Button
2424
type={"primary"}
2525
onClick={() => {
26-
form.submit();
26+
formAction.current?.submit();
2727
props.setVisible(false);
2828
}}
2929
>确认</Button>
@@ -44,7 +44,7 @@ const CirculateSettingPanel: React.FC<SettingPanelProps> = (props) => {
4444
children: (
4545
<NodePanel
4646
type={"circulate"}
47-
form={form}
47+
formAction={formAction}
4848
id={props.properties?.id}
4949
data={props.properties}
5050
onFinish={props.onSettingChange}

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

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,15 @@
11
import React from "react";
2-
import {ProForm} from "@ant-design/pro-components";
32
import {Button, Drawer, Space, Tabs} from "antd";
43
import NodePanel from "@/components/flow/nodes/panel/NodePanel";
54
import EdgePanel from "@/components/flow/nodes/panel/EdgePanel";
65
import ButtonPanel from "@/components/flow/nodes/panel/ButtonPanel";
76
import {SettingPanelProps} from "@/components/flow/types";
7+
import {FormAction} from "@/components/form";
88

99

1010
const NodeSettingPanel: React.FC<SettingPanelProps> = (props) => {
1111

12-
const [form] = ProForm.useForm();
12+
const formAction = React.useRef<FormAction>(null);
1313

1414
return (
1515
<Drawer
@@ -25,7 +25,7 @@ const NodeSettingPanel: React.FC<SettingPanelProps> = (props) => {
2525
<Button
2626
type={"primary"}
2727
onClick={() => {
28-
form.submit();
28+
formAction.current?.submit();
2929
props.setVisible(false);
3030
}}
3131
>确认</Button>
@@ -46,7 +46,7 @@ const NodeSettingPanel: React.FC<SettingPanelProps> = (props) => {
4646
children: (
4747
<NodePanel
4848
type={"node"}
49-
form={form}
49+
formAction={formAction}
5050
id={props.properties?.id}
5151
data={props.properties}
5252
onFinish={props.onSettingChange}

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

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,12 @@
11
import React from "react";
2-
import {ProForm} from "@ant-design/pro-components";
32
import {Button, Drawer, Space} from "antd";
43
import NodePanel from "@/components/flow/nodes/panel/NodePanel";
54
import {SettingPanelProps} from "@/components/flow/types";
5+
import {FormAction} from "@/components/form";
66

77
const OverSettingPanel: React.FC<SettingPanelProps> = (props) => {
88

9-
const [form] = ProForm.useForm();
9+
const formAction = React.useRef<FormAction>(null);
1010

1111
return (
1212
<Drawer
@@ -22,7 +22,7 @@ const OverSettingPanel: React.FC<SettingPanelProps> = (props) => {
2222
<Button
2323
type={"primary"}
2424
onClick={() => {
25-
form.submit();
25+
formAction.current?.submit();
2626
props.setVisible(false);
2727
}}
2828
>确认</Button>
@@ -36,7 +36,7 @@ const OverSettingPanel: React.FC<SettingPanelProps> = (props) => {
3636
)}
3737
>
3838
<NodePanel
39-
form={form}
39+
formAction={formAction}
4040
type={"over"}
4141
id={props.properties?.id}
4242
data={props.properties}

0 commit comments

Comments
 (0)