@5minds/node-red-dashboard-2-processcube-dynamic-form 1.0.25-feature-1a3e84-m2en1jfr → 1.0.25-poc-for-using-dynamic-ui-from-app-sdk-4a73f4-m2ok3vom
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.
|
@@ -0,0 +1,195 @@
|
|
|
1
|
+
import { DynamicUi } from '@5minds/processcube_app_sdk/client';
|
|
2
|
+
import '@5minds/processcube_app_sdk/client/components/DynamicUi/DynamicUi.css';
|
|
3
|
+
import React from 'react';
|
|
4
|
+
|
|
5
|
+
export default function UIDynamicForm() {
|
|
6
|
+
const usertask = {
|
|
7
|
+
actualOwnerId: null,
|
|
8
|
+
finishedByUserId: null,
|
|
9
|
+
userTaskConfig: {
|
|
10
|
+
formFields: [
|
|
11
|
+
{
|
|
12
|
+
id: 'checkbox',
|
|
13
|
+
label: 'Checkbox',
|
|
14
|
+
type: 'checkbox',
|
|
15
|
+
customForm: '{"entries":[{"key":"key","value":"value"}],"hint":"hint"}',
|
|
16
|
+
},
|
|
17
|
+
{
|
|
18
|
+
id: 'colorpicker',
|
|
19
|
+
label: 'Colorpicker',
|
|
20
|
+
type: 'color',
|
|
21
|
+
defaultValue: '#e32626',
|
|
22
|
+
customForm: '{"hint":"hint"}',
|
|
23
|
+
},
|
|
24
|
+
{
|
|
25
|
+
id: 'date',
|
|
26
|
+
label: 'Date',
|
|
27
|
+
type: 'date',
|
|
28
|
+
defaultValue: '2024-10-18',
|
|
29
|
+
customForm: '{"hint":"hint"}',
|
|
30
|
+
},
|
|
31
|
+
{
|
|
32
|
+
id: 'datetime',
|
|
33
|
+
label: 'Datetime',
|
|
34
|
+
type: 'datetime-local',
|
|
35
|
+
defaultValue: '2024-10-19T12:41',
|
|
36
|
+
customForm: '{"hint":"hint"}',
|
|
37
|
+
},
|
|
38
|
+
{ id: 'email', label: 'Email', type: 'email', customForm: '{"hint":"hint"}' },
|
|
39
|
+
{ id: 'header', type: 'header', defaultValue: 'Header' },
|
|
40
|
+
{ id: 'hidden', type: 'hidden', defaultValue: 'hidden' },
|
|
41
|
+
{ id: 'number', label: 'Number', type: 'number', customForm: '{"step":1.5,"hint":"hint"}' },
|
|
42
|
+
{
|
|
43
|
+
id: 'month',
|
|
44
|
+
label: 'Month',
|
|
45
|
+
type: 'month',
|
|
46
|
+
defaultValue: '2024-07',
|
|
47
|
+
customForm: '{"hint":"hint"}',
|
|
48
|
+
},
|
|
49
|
+
{ id: 'paragraph', type: 'paragraph', defaultValue: 'A lot of words...' },
|
|
50
|
+
{ id: 'password', label: 'Pasword', type: 'password', customForm: '{"hint":"hint"}' },
|
|
51
|
+
{
|
|
52
|
+
id: 'radio',
|
|
53
|
+
label: 'Radio',
|
|
54
|
+
type: 'radio',
|
|
55
|
+
customForm: '{"entries":[{"key":"key","value":"value"}],"hint":"hint"}',
|
|
56
|
+
},
|
|
57
|
+
{
|
|
58
|
+
id: 'range',
|
|
59
|
+
label: 'Range',
|
|
60
|
+
type: 'range',
|
|
61
|
+
defaultValue: '30',
|
|
62
|
+
customForm: '{"step":0.4,"min":3,"hint":"hint"}',
|
|
63
|
+
},
|
|
64
|
+
{
|
|
65
|
+
id: 'select',
|
|
66
|
+
label: 'Select',
|
|
67
|
+
type: 'select',
|
|
68
|
+
customForm: '{"entries":[{"key":"key","value":"value"}],"hint":"hint"}',
|
|
69
|
+
},
|
|
70
|
+
{ id: 'tel', label: 'Tel.', type: 'tel', customForm: '{"hint":"hint"}' },
|
|
71
|
+
{ id: 'text', label: 'Text', type: 'string', customForm: '{"hint":"hint"}' },
|
|
72
|
+
{
|
|
73
|
+
id: 'textarea',
|
|
74
|
+
label: 'Textarea',
|
|
75
|
+
type: 'textarea',
|
|
76
|
+
defaultValue: 'more words...',
|
|
77
|
+
customForm: '{"rows":14,"hint":"hint"}',
|
|
78
|
+
},
|
|
79
|
+
{ id: 'time', label: 'Time', type: 'time', defaultValue: '11:54', customForm: '{"hint":"hint"}' },
|
|
80
|
+
{ id: 'url', label: 'URL', type: 'url', customForm: '{"hint":"hint"}' },
|
|
81
|
+
{
|
|
82
|
+
id: 'week',
|
|
83
|
+
label: 'Week',
|
|
84
|
+
type: 'week',
|
|
85
|
+
defaultValue: '2024-W37',
|
|
86
|
+
customForm: '{"hint":"hint"}',
|
|
87
|
+
},
|
|
88
|
+
],
|
|
89
|
+
},
|
|
90
|
+
userTaskConfigModel: {
|
|
91
|
+
formFields: [
|
|
92
|
+
{
|
|
93
|
+
id: 'checkbox',
|
|
94
|
+
label: 'Checkbox',
|
|
95
|
+
type: 'checkbox',
|
|
96
|
+
customForm: '{"entries":[{"key":"key","value":"value"}],"hint":"hint"}',
|
|
97
|
+
},
|
|
98
|
+
{
|
|
99
|
+
id: 'colorpicker',
|
|
100
|
+
label: 'Colorpicker',
|
|
101
|
+
type: 'color',
|
|
102
|
+
defaultValue: '#e32626',
|
|
103
|
+
customForm: '{"hint":"hint"}',
|
|
104
|
+
},
|
|
105
|
+
{
|
|
106
|
+
id: 'date',
|
|
107
|
+
label: 'Date',
|
|
108
|
+
type: 'date',
|
|
109
|
+
defaultValue: '2024-10-18',
|
|
110
|
+
customForm: '{"hint":"hint"}',
|
|
111
|
+
},
|
|
112
|
+
{
|
|
113
|
+
id: 'datetime',
|
|
114
|
+
label: 'Datetime',
|
|
115
|
+
type: 'datetime-local',
|
|
116
|
+
defaultValue: '2024-10-19T12:41',
|
|
117
|
+
customForm: '{"hint":"hint"}',
|
|
118
|
+
},
|
|
119
|
+
{ id: 'email', label: 'Email', type: 'email', customForm: '{"hint":"hint"}' },
|
|
120
|
+
{ id: 'header', type: 'header', defaultValue: 'Header' },
|
|
121
|
+
{ id: 'hidden', type: 'hidden', defaultValue: 'hidden' },
|
|
122
|
+
{ id: 'number', label: 'Number', type: 'number', customForm: '{"step":1.5,"hint":"hint"}' },
|
|
123
|
+
{
|
|
124
|
+
id: 'month',
|
|
125
|
+
label: 'Month',
|
|
126
|
+
type: 'month',
|
|
127
|
+
defaultValue: '2024-07',
|
|
128
|
+
customForm: '{"hint":"hint"}',
|
|
129
|
+
},
|
|
130
|
+
{ id: 'paragraph', type: 'paragraph', defaultValue: 'A lot of words...' },
|
|
131
|
+
{ id: 'password', label: 'Pasword', type: 'password', customForm: '{"hint":"hint"}' },
|
|
132
|
+
{
|
|
133
|
+
id: 'radio',
|
|
134
|
+
label: 'Radio',
|
|
135
|
+
type: 'radio',
|
|
136
|
+
customForm: '{"entries":[{"key":"key","value":"value"}],"hint":"hint"}',
|
|
137
|
+
},
|
|
138
|
+
{
|
|
139
|
+
id: 'range',
|
|
140
|
+
label: 'Range',
|
|
141
|
+
type: 'range',
|
|
142
|
+
defaultValue: '30',
|
|
143
|
+
customForm: '{"step":0.4,"min":3,"hint":"hint"}',
|
|
144
|
+
},
|
|
145
|
+
{
|
|
146
|
+
id: 'select',
|
|
147
|
+
label: 'Select',
|
|
148
|
+
type: 'select',
|
|
149
|
+
customForm: '{"entries":[{"key":"key","value":"value"}],"hint":"hint"}',
|
|
150
|
+
},
|
|
151
|
+
{ id: 'tel', label: 'Tel.', type: 'tel', customForm: '{"hint":"hint"}' },
|
|
152
|
+
{ id: 'text', label: 'Text', type: 'string', customForm: '{"hint":"hint"}' },
|
|
153
|
+
{
|
|
154
|
+
id: 'textarea',
|
|
155
|
+
label: 'Textarea',
|
|
156
|
+
type: 'textarea',
|
|
157
|
+
defaultValue: 'more words...',
|
|
158
|
+
customForm: '{"rows":14,"hint":"hint"}',
|
|
159
|
+
},
|
|
160
|
+
{ id: 'time', label: 'Time', type: 'time', defaultValue: '11:54', customForm: '{"hint":"hint"}' },
|
|
161
|
+
{ id: 'url', label: 'URL', type: 'url', customForm: '{"hint":"hint"}' },
|
|
162
|
+
{
|
|
163
|
+
id: 'week',
|
|
164
|
+
label: 'Week',
|
|
165
|
+
type: 'week',
|
|
166
|
+
defaultValue: '2024-W37',
|
|
167
|
+
customForm: '{"hint":"hint"}',
|
|
168
|
+
},
|
|
169
|
+
],
|
|
170
|
+
},
|
|
171
|
+
assignedUserIds: null,
|
|
172
|
+
multiInstanceMetadataId: '1f5a946e-5349-46f7-8914-0e25096b5f20',
|
|
173
|
+
multiInstanceStartToken: {},
|
|
174
|
+
multiInstanceEndToken: {},
|
|
175
|
+
flowNodeInstanceId: '129bb9ec-7660-4dbc-a11e-ca174a701ebc',
|
|
176
|
+
flowNodeId: 'user_task',
|
|
177
|
+
flowNodeName: 'User Task',
|
|
178
|
+
flowNodeLane: '',
|
|
179
|
+
flowNodeType: 'bpmn:UserTask',
|
|
180
|
+
eventType: null,
|
|
181
|
+
state: 'suspended',
|
|
182
|
+
previousFlowNodeInstanceId: '0076eaee-4f97-4f6d-b4ad-a066877b6aa4',
|
|
183
|
+
parentProcessInstanceId: null,
|
|
184
|
+
processDefinitionId: 'User-Task-Sample_Definition',
|
|
185
|
+
processModelId: 'User-Task-Sample_Process',
|
|
186
|
+
processInstanceId: '23d53ef8-f28c-4b47-9a70-d8b37d293a27',
|
|
187
|
+
correlationId: '8a0bc873-568d-49dc-b304-41efb5b92ec2',
|
|
188
|
+
ownerId: 'dummy_token',
|
|
189
|
+
startToken: {},
|
|
190
|
+
endToken: {},
|
|
191
|
+
startedAt: '2024-10-23T09:40:22.755Z',
|
|
192
|
+
};
|
|
193
|
+
return <DynamicUi task={usertask as any} onSubmit={() => console.log("amk") as any} />;
|
|
194
|
+
}
|
|
195
|
+
|