@coding-flow/flow-design 0.0.26 → 0.0.29
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.
|
@@ -83,40 +83,6 @@ const TabBase = ()=>{
|
|
|
83
83
|
children: /*#__PURE__*/ jsx(Input, {
|
|
84
84
|
placeholder: "请输入流程编码"
|
|
85
85
|
})
|
|
86
|
-
}),
|
|
87
|
-
/*#__PURE__*/ jsx(CardForm.Item, {
|
|
88
|
-
name: [
|
|
89
|
-
"form",
|
|
90
|
-
"name"
|
|
91
|
-
],
|
|
92
|
-
label: "表单名称",
|
|
93
|
-
tooltip: "表单名称是主表的名称",
|
|
94
|
-
rules: [
|
|
95
|
-
{
|
|
96
|
-
required: true,
|
|
97
|
-
message: '请输入表单名称'
|
|
98
|
-
}
|
|
99
|
-
],
|
|
100
|
-
children: /*#__PURE__*/ jsx(Input, {
|
|
101
|
-
placeholder: "请输入表单名称"
|
|
102
|
-
})
|
|
103
|
-
}),
|
|
104
|
-
/*#__PURE__*/ jsx(CardForm.Item, {
|
|
105
|
-
name: [
|
|
106
|
-
"form",
|
|
107
|
-
"code"
|
|
108
|
-
],
|
|
109
|
-
label: "表单编码",
|
|
110
|
-
tooltip: "表单编码是主表的编码",
|
|
111
|
-
rules: [
|
|
112
|
-
{
|
|
113
|
-
required: true,
|
|
114
|
-
message: '请输入表单编码'
|
|
115
|
-
}
|
|
116
|
-
],
|
|
117
|
-
children: /*#__PURE__*/ jsx(Input, {
|
|
118
|
-
placeholder: "请输入表单编码"
|
|
119
|
-
})
|
|
120
86
|
})
|
|
121
87
|
]
|
|
122
88
|
}),
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
2
|
-
import { useState } from "react";
|
|
3
|
-
import {
|
|
4
|
-
import {
|
|
2
|
+
import react, { useState } from "react";
|
|
3
|
+
import { Input, Tabs } from "antd";
|
|
4
|
+
import { CardForm, Panel } from "@coding-flow/flow-pc-ui";
|
|
5
5
|
import { ViewBindPlugin } from "@coding-flow/flow-core";
|
|
6
6
|
import { IMPORT_FORM_VIEW_KEY } from "../../../../plugins/import-form-view-type.js";
|
|
7
7
|
import { useDesignContext } from "../../hooks/use-design-context.js";
|
|
@@ -11,6 +11,8 @@ const TabForm = ()=>{
|
|
|
11
11
|
const { state, context } = useDesignContext();
|
|
12
12
|
const presenter = context.getPresenter();
|
|
13
13
|
const [importFormOpen, setImportFormOpen] = useState(false);
|
|
14
|
+
const [formForm] = CardForm.useForm();
|
|
15
|
+
const formActionContext = presenter.getFormActionContext();
|
|
14
16
|
const mainCode = state.workflow.form.code;
|
|
15
17
|
const mainName = state.workflow.form.name;
|
|
16
18
|
const subForms = state.workflow.form.subForms || [];
|
|
@@ -27,27 +29,103 @@ const TabForm = ()=>{
|
|
|
27
29
|
})
|
|
28
30
|
};
|
|
29
31
|
});
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
32
|
+
react.useEffect(()=>{
|
|
33
|
+
formForm.resetFields();
|
|
34
|
+
formForm.setFieldsValue({
|
|
35
|
+
form: state.workflow.form
|
|
36
|
+
});
|
|
37
|
+
}, []);
|
|
38
|
+
react.useEffect(()=>{
|
|
39
|
+
formActionContext.addAction({
|
|
40
|
+
save: ()=>formForm.getFieldsValue(),
|
|
41
|
+
key: ()=>'form',
|
|
42
|
+
validate: ()=>new Promise((resolve, reject)=>{
|
|
43
|
+
formForm.validateFields().then((values)=>{
|
|
44
|
+
resolve(values);
|
|
45
|
+
}).catch(reject);
|
|
46
|
+
})
|
|
47
|
+
});
|
|
48
|
+
return ()=>{
|
|
49
|
+
formActionContext.removeAction('form');
|
|
50
|
+
};
|
|
51
|
+
}, []);
|
|
52
|
+
react.useEffect(()=>{
|
|
53
|
+
formForm.setFieldsValue({
|
|
54
|
+
form: state.workflow.form
|
|
55
|
+
});
|
|
56
|
+
}, [
|
|
57
|
+
state.workflow
|
|
58
|
+
]);
|
|
59
|
+
const handleFormValuesChange = ()=>{
|
|
60
|
+
const values = formForm.getFieldsValue();
|
|
61
|
+
presenter.updateWorkflow(values);
|
|
62
|
+
};
|
|
33
63
|
const handleImportForm = (form)=>{
|
|
34
64
|
presenter.importWorkflowForm(form);
|
|
35
65
|
setImportFormOpen(false);
|
|
36
66
|
};
|
|
37
67
|
return /*#__PURE__*/ jsxs(Panel, {
|
|
38
68
|
children: [
|
|
39
|
-
/*#__PURE__*/
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
69
|
+
/*#__PURE__*/ jsxs(CardForm, {
|
|
70
|
+
form: formForm,
|
|
71
|
+
title: "表单信息",
|
|
72
|
+
onChange: handleFormValuesChange,
|
|
73
|
+
children: [
|
|
74
|
+
/*#__PURE__*/ jsx(CardForm.Item, {
|
|
75
|
+
name: [
|
|
76
|
+
"form",
|
|
77
|
+
"name"
|
|
78
|
+
],
|
|
79
|
+
label: "表单名称",
|
|
80
|
+
tooltip: "表单名称是主表的名称",
|
|
81
|
+
rules: [
|
|
82
|
+
{
|
|
83
|
+
required: true,
|
|
84
|
+
message: '请输入表单名称'
|
|
85
|
+
}
|
|
86
|
+
],
|
|
87
|
+
children: /*#__PURE__*/ jsx(Input, {
|
|
88
|
+
placeholder: "请输入表单名称"
|
|
89
|
+
})
|
|
90
|
+
}),
|
|
91
|
+
/*#__PURE__*/ jsx(CardForm.Item, {
|
|
92
|
+
name: [
|
|
93
|
+
"form",
|
|
94
|
+
"code"
|
|
95
|
+
],
|
|
96
|
+
label: "表单编码",
|
|
97
|
+
tooltip: "表单编码是主表的编码",
|
|
98
|
+
rules: [
|
|
99
|
+
{
|
|
100
|
+
required: true,
|
|
101
|
+
message: '请输入表单编码'
|
|
102
|
+
}
|
|
103
|
+
],
|
|
104
|
+
children: /*#__PURE__*/ jsx(Input, {
|
|
105
|
+
placeholder: "请输入表单编码"
|
|
106
|
+
})
|
|
107
|
+
})
|
|
108
|
+
]
|
|
45
109
|
}),
|
|
46
|
-
/*#__PURE__*/
|
|
110
|
+
mainCode && /*#__PURE__*/ jsxs("div", {
|
|
47
111
|
style: {
|
|
48
|
-
marginTop:
|
|
112
|
+
marginTop: 10
|
|
49
113
|
},
|
|
50
|
-
|
|
114
|
+
children: [
|
|
115
|
+
/*#__PURE__*/ jsx(FormTable, {
|
|
116
|
+
name: `主表:${mainName}`,
|
|
117
|
+
code: mainCode,
|
|
118
|
+
mainForm: true,
|
|
119
|
+
hasImportForm: hasImportFormView,
|
|
120
|
+
onImportClick: ()=>setImportFormOpen(true)
|
|
121
|
+
}),
|
|
122
|
+
/*#__PURE__*/ jsx(Tabs, {
|
|
123
|
+
style: {
|
|
124
|
+
marginTop: 20
|
|
125
|
+
},
|
|
126
|
+
items: items
|
|
127
|
+
})
|
|
128
|
+
]
|
|
51
129
|
}),
|
|
52
130
|
/*#__PURE__*/ jsx(ImportFormPluginView, {
|
|
53
131
|
open: importFormOpen,
|
|
@@ -1,13 +1,14 @@
|
|
|
1
1
|
import { Fragment, jsx, jsxs } from "react/jsx-runtime";
|
|
2
2
|
import { useState } from "react";
|
|
3
3
|
import { Table } from "@coding-flow/flow-pc-ui";
|
|
4
|
-
import { Button, Flex, Form, Popconfirm, Space } from "antd";
|
|
4
|
+
import { Button, Flex, Form, Popconfirm, Space, Typography } from "antd";
|
|
5
5
|
import { FormTypeContext, dataTypeOptions } from "@coding-flow/flow-types";
|
|
6
6
|
import { useDesignContext } from "../../hooks/use-design-context.js";
|
|
7
7
|
import { WorkflowFormManager } from "../../manager/form.js";
|
|
8
8
|
import { CloudUploadOutlined, DeleteOutlined, FolderAddOutlined, PlusOutlined } from "@ant-design/icons";
|
|
9
9
|
import { FormFieldModal } from "./model.js";
|
|
10
10
|
import { SubFormModal } from "./sub-form.js";
|
|
11
|
+
const { Title } = Typography;
|
|
11
12
|
const FormTable = (props)=>{
|
|
12
13
|
const name = props.name;
|
|
13
14
|
const { state, context } = useDesignContext();
|
|
@@ -105,7 +106,10 @@ const FormTable = (props)=>{
|
|
|
105
106
|
align: 'center',
|
|
106
107
|
children: [
|
|
107
108
|
/*#__PURE__*/ jsx(Space, {
|
|
108
|
-
children:
|
|
109
|
+
children: /*#__PURE__*/ jsx(Title, {
|
|
110
|
+
level: 5,
|
|
111
|
+
children: name
|
|
112
|
+
})
|
|
109
113
|
}),
|
|
110
114
|
/*#__PURE__*/ jsxs(Space, {
|
|
111
115
|
children: [
|
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.29",
|
|
4
4
|
"description": "flow-engine design components ",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"keywords": [
|
|
@@ -54,16 +54,16 @@
|
|
|
54
54
|
"nanoid": "^5.1.6",
|
|
55
55
|
"react-redux": "^9.2.0",
|
|
56
56
|
"styled-components": "^5.3.11",
|
|
57
|
-
"@coding-flow/flow-core": "0.0.
|
|
58
|
-
"@coding-flow/flow-
|
|
59
|
-
"@coding-flow/flow-types": "0.0.
|
|
60
|
-
"@coding-flow/flow-
|
|
57
|
+
"@coding-flow/flow-core": "0.0.29",
|
|
58
|
+
"@coding-flow/flow-pc-ui": "0.0.29",
|
|
59
|
+
"@coding-flow/flow-types": "0.0.29",
|
|
60
|
+
"@coding-flow/flow-icons": "0.0.29"
|
|
61
61
|
},
|
|
62
62
|
"devDependencies": {
|
|
63
63
|
"@types/lodash-es": "^4.17.12",
|
|
64
64
|
"@types/styled-components": "^5.1.36",
|
|
65
|
-
"@coding-flow/flow-core": "0.0.
|
|
66
|
-
"@coding-flow/flow-types": "0.0.
|
|
65
|
+
"@coding-flow/flow-core": "0.0.29",
|
|
66
|
+
"@coding-flow/flow-types": "0.0.29"
|
|
67
67
|
},
|
|
68
68
|
"scripts": {
|
|
69
69
|
"build": "rslib build",
|