datastake-daf 0.6.262 → 0.6.263

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.
@@ -1,13 +1,9 @@
1
1
  import React, { useState, useEffect } from "react";
2
- import PropTypes from 'prop-types'
2
+ import PropTypes from "prop-types";
3
3
  import { Form, Button, Alert, Space } from "antd";
4
- import dot from 'dot-object';
4
+ import dot from "dot-object";
5
5
  import { renderNestedInputs } from "./RenderForm";
6
- import {
7
- GetFormItem,
8
- getFormTitles,
9
- showHideInput
10
- } from "./helper";
6
+ import { GetFormItem, getFormTitles, showHideInput } from "./helper";
11
7
  // import dayjs from "dayjs";
12
8
  import AjaxSubGroup from "./components/AjaxSubGroup";
13
9
  import { propHasValue } from "../../../../helpers/deepFind";
@@ -17,573 +13,647 @@ import { convertToDayJs } from "../../../utils/date";
17
13
  import { convertUndefinedToNull } from "../../../utils/object";
18
14
 
19
15
  export const EditForm = ({
20
- isReview,
21
- highlightMandatory,
22
- onValuesChange = () => { },
23
- form,
24
- data,
25
- allData = {},
26
- excludedKeys: defaultExcludedKeys = [],
27
- disabledInputs = [],
28
- checkDuplicates = true,
29
- plainForms = {},
30
- linkingForms = {},
31
- onSubmit = () => { },
32
- onCancel = () => { },
33
- isModal = false,
34
- breadcrumb = null,
35
- definition = null,
36
- subGroupTitle,
37
- MainForm,
38
- template = null,
39
- loading = false,
40
- setLoading = () => { },
41
- inputsMeta = {},
42
- changeInputMeta = () => { },
43
- changeLinking = () => { },
44
- // TODO: add this
45
- t = (s) => s,
46
- user,
47
- ajaxForms,
48
- ajaxOptions,
49
- getMainApiUrl,
50
- getAppHeader,
51
- getApiBaseUrl,
52
- changeAjaxOptions,
53
- app,
54
- query,
55
- goTo,
56
- changeAjaxForms,
57
- errors = {},
58
- changeErrors = () => { },
59
- evaluationConfig = [],
60
- staticWidth = '614px',
16
+ isReview,
17
+ highlightMandatory,
18
+ onValuesChange = () => {},
19
+ form,
20
+ data,
21
+ allData = {},
22
+ excludedKeys: defaultExcludedKeys = [],
23
+ disabledInputs = [],
24
+ checkDuplicates = true,
25
+ plainForms = {},
26
+ linkingForms = {},
27
+ onSubmit = () => {},
28
+ onCancel = () => {},
29
+ isModal = false,
30
+ breadcrumb = null,
31
+ definition = null,
32
+ subGroupTitle,
33
+ MainForm,
34
+ template = null,
35
+ loading = false,
36
+ setLoading = () => {},
37
+ inputsMeta = {},
38
+ changeInputMeta = () => {},
39
+ changeLinking = () => {},
40
+ // TODO: add this
41
+ t = (s) => s,
42
+ user,
43
+ ajaxForms,
44
+ ajaxOptions,
45
+ getMainApiUrl,
46
+ getAppHeader,
47
+ getApiBaseUrl,
48
+ changeAjaxOptions,
49
+ app,
50
+ query,
51
+ goTo,
52
+ changeAjaxForms,
53
+ errors = {},
54
+ changeErrors = () => {},
55
+ evaluationConfig = [],
56
+ staticWidth = "614px",
61
57
  }) => {
62
- const [isSubmitting] = useState(false);
63
- const formData = JSON.parse(JSON.stringify(convertUndefinedToNull(data) || {}))
64
- const allFormData = JSON.parse(JSON.stringify(allData || {}))
65
- // const [MainForm] = Form.useForm();
66
- const [values, setValues] = useState(formData || {});
67
- const [addressData, setAddress] = useState({});
68
- const { id, options = {}, introText, formTitles, formClass = '' } = form || {};
69
- const excludedKeys = [
70
- ...defaultExcludedKeys,
71
- 'icon', 'label', 'description', 'showFormIf', 'sectionLabel', 'formDescription', 'introText', 'formClass', 'alertConf', 'formTitles', 'position', 'id'
72
- ]
73
- const [initialValues, setInitialValues] = useState(undefined);
58
+ const [isSubmitting] = useState(false);
59
+ const formData = JSON.parse(JSON.stringify(convertUndefinedToNull(data) || {}));
60
+ const allFormData = JSON.parse(JSON.stringify(allData || {}));
61
+ // const [MainForm] = Form.useForm();
62
+ const [values, setValues] = useState(formData || {});
63
+ const [addressData, setAddress] = useState({});
64
+ const { id, options = {}, introText, formTitles, formClass = "" } = form || {};
65
+ const excludedKeys = [
66
+ ...defaultExcludedKeys,
67
+ "icon",
68
+ "label",
69
+ "description",
70
+ "showFormIf",
71
+ "sectionLabel",
72
+ "formDescription",
73
+ "introText",
74
+ "formClass",
75
+ "alertConf",
76
+ "formTitles",
77
+ "position",
78
+ "id",
79
+ ];
80
+ const [initialValues, setInitialValues] = useState(undefined);
74
81
 
75
- const getData = (name, input, value, commentValue, path, disabledPath) => {
76
- const props = {
77
- // placeholder: input.placeholder ? input.placeholder : getInputLabel(input, values, true),
78
- placeholder: input.placeholder,
79
- valueplaceholder: input.valueLabel || null,
80
- disabled: input.disabled || false,
81
- accept: input.accept || undefined,
82
- }
83
- const shouldForceEnable = initialValues?.[name] === null; //MIGHT_CHANGE_LATER TESTING
82
+ const getData = (name, input, value, commentValue, path, disabledPath) => {
83
+ const props = {
84
+ // placeholder: input.placeholder ? input.placeholder : getInputLabel(input, values, true),
85
+ placeholder: input.placeholder,
86
+ valueplaceholder: input.valueLabel || null,
87
+ disabled: input.disabled || false,
88
+ accept: input.accept || undefined,
89
+ };
90
+ const shouldForceEnable = initialValues?.[name] === null; //MIGHT_CHANGE_LATER TESTING
84
91
 
85
- const isDisabled = shouldForceEnable
86
- ? false
87
- : typeof input?.meta?.disableEdit === "object"
88
- ? input.meta.disableEdit.edit
89
- : input?.meta?.disableEdit;
92
+ const isDisabled = shouldForceEnable
93
+ ? false
94
+ : typeof input?.meta?.disableEdit === "object"
95
+ ? input.meta.disableEdit.edit
96
+ : input?.meta?.disableEdit;
90
97
 
91
- if (disabledInputs.includes(disabledPath) || isDisabled) {
92
- props.disabled = true;
93
- }
94
- if (input.type === 'total100' && !value) {
95
- value = [{
96
- type: null,
97
- value: null
98
- }];
99
- } else if (input.type === 'date') {
100
- // value = value ? typeof value === 'string' ? value : value.format('YYYY-MM-DD') : undefined;
101
- value = convertToDayJs(value)
102
- } else if (input.type === 'year') {
103
- // value = value ? dayjs(value) : undefined;
104
- value = convertToDayJs(value)
105
- }
106
- else if (input.type === 'switch') {
107
- if (!propHasValue(value)) {
108
- value = value || false;
109
- if (typeof path === 'string') {
110
- dot.str(path, value, values);
111
- }
112
- }
113
- } else if (input.type === 'upload' || input.type === 'imageUpload' || input.type === 'videoUpload') {
114
- const fileList = (
115
- Array.isArray(value) ? value :
116
- (
117
- value &&
118
- typeof value === 'object' &&
119
- value.fileList &&
120
- Array.isArray(value.fileList) ?
121
- value.fileList.map(f => f.response).filter(f => f) : []
122
- )
123
- ) || [];
124
- if (!Array.isArray(value) && value &&
125
- typeof value === 'object' &&
126
- value.fileList &&
127
- Array.isArray(value.fileList)) {
128
- if (typeof path === 'string') {
129
- dot.set(path, fileList, values);
130
- }
131
- }
132
- value = fileList;
133
- } else if (input.type === "text" ){
134
- if(values[name] === null || values[name] === undefined && input.meta?.defaultValue){
135
- value = input.meta?.defaultValue;
136
- }
137
- }
138
- else if (input.type === "select" ){
139
- if(values[name] === null || values[name] === undefined && input.meta?.defaultValue){
140
- value = input.meta?.defaultValue;
141
- setValues({
142
- ...values,
143
- [name]: input.meta?.defaultValue
144
- })
145
- }
146
- if(data[name] === null || data[name] === undefined && input.meta?.defaultValue){
147
- MainForm.setFieldsValue({
148
- [name]: input.meta?.defaultValue
149
- })
150
- }
151
- }
98
+ if (disabledInputs.includes(disabledPath) || isDisabled) {
99
+ props.disabled = true;
100
+ }
101
+ if (input.type === "total100" && !value) {
102
+ value = [
103
+ {
104
+ type: null,
105
+ value: null,
106
+ },
107
+ ];
108
+ } else if (input.type === "date") {
109
+ // value = value ? typeof value === 'string' ? value : value.format('YYYY-MM-DD') : undefined;
110
+ value = convertToDayJs(value);
111
+ } else if (input.type === "year") {
112
+ // value = value ? dayjs(value) : undefined;
113
+ value = convertToDayJs(value);
114
+ } else if (input.type === "switch") {
115
+ if (!propHasValue(value)) {
116
+ value = value || false;
117
+ if (typeof path === "string") {
118
+ dot.str(path, value, values);
119
+ }
120
+ }
121
+ } else if (
122
+ input.type === "upload" ||
123
+ input.type === "imageUpload" ||
124
+ input.type === "videoUpload"
125
+ ) {
126
+ const fileList =
127
+ (Array.isArray(value)
128
+ ? value
129
+ : value &&
130
+ typeof value === "object" &&
131
+ value.fileList &&
132
+ Array.isArray(value.fileList)
133
+ ? value.fileList.map((f) => f.response).filter((f) => f)
134
+ : []) || [];
135
+ if (
136
+ !Array.isArray(value) &&
137
+ value &&
138
+ typeof value === "object" &&
139
+ value.fileList &&
140
+ Array.isArray(value.fileList)
141
+ ) {
142
+ if (typeof path === "string") {
143
+ dot.set(path, fileList, values);
144
+ }
145
+ }
146
+ value = fileList;
147
+ } else if (input.type === "text") {
148
+ if (values[name] === null || (values[name] === undefined && input.meta?.defaultValue)) {
149
+ value = input.meta?.defaultValue;
150
+ }
151
+ } else if (input.type === "select") {
152
+ if (values[name] === null || (values[name] === undefined && input.meta?.defaultValue)) {
153
+ value = input.meta?.defaultValue;
154
+ setValues({
155
+ ...values,
156
+ [name]: input.meta?.defaultValue,
157
+ });
158
+ }
159
+ if (data[name] === null || (data[name] === undefined && input.meta?.defaultValue)) {
160
+ MainForm.setFieldsValue({
161
+ [name]: input.meta?.defaultValue,
162
+ });
163
+ }
164
+ }
152
165
 
153
- if (input.type === 'modal') {
154
- props.linkingform = {};
155
- props.datalink = input.dataLink;
156
- if (linkingForms[name]) {
157
- props.linkingform = linkingForms[name];
158
- }
159
- }
166
+ if (input.type === "modal") {
167
+ props.linkingform = {};
168
+ props.datalink = input.dataLink;
169
+ if (linkingForms[name]) {
170
+ props.linkingform = linkingForms[name];
171
+ }
172
+ }
160
173
 
174
+ const config = {
175
+ name,
176
+ input,
177
+ call: input?.meta?.call,
178
+ getFromLinking: input?.meta?.getFromLinking,
179
+ automaticallyLink: input.automaticallyLink,
180
+ props,
181
+ formsValue: values,
182
+ allFormsValue: allFormData,
183
+ onNewSetValue: input.onNewSetValue,
184
+ setValues,
185
+ onValuesChange,
186
+ changeLinking,
187
+ multiple: input?.meta?.multiple,
188
+ updateOptions: input.updateOptions || false,
189
+ options: input.options,
190
+ optionGroup: input.optionGroup,
191
+ optionsFilter: input?.meta?.optionsFilter,
192
+ filterCond: input?.meta?.filterCond,
193
+ disableOtherFields: input.disableOtherFields,
194
+ updateOtherFields: input.updateOtherFields,
195
+ repeatLabel: input.repeatLabel,
196
+ unique: checkDuplicates ? input.unique : undefined,
197
+ modalTitle: input.modalTitle,
198
+ buttonText: input.buttonText,
199
+ restricted: input.restricted || false,
200
+ totalMax: input.totalMax,
201
+ country: input.country || undefined,
202
+ address: input?.meta?.address || undefined,
203
+ addressData,
204
+ value,
205
+ allowDupplicates: input.allowDupplicates,
206
+ commentValue,
207
+ commentHint: input.commentHint ? input.commentHint : t("Please specify"),
208
+ rules: (input.rules || []).map((r) => {
209
+ if (r.message && r.message.indexOf("errors::") >= 0) {
210
+ r.message = t(r.message);
211
+ }
212
+ return r;
213
+ }),
214
+ template: input.template,
215
+ };
161
216
 
162
- const config = {
163
- name,
164
- input,
165
- call: input?.meta?.call,
166
- getFromLinking: input?.meta?.getFromLinking,
167
- automaticallyLink: input.automaticallyLink,
168
- props,
169
- formsValue: values,
170
- allFormsValue: allFormData,
171
- onNewSetValue: input.onNewSetValue,
172
- setValues,
173
- onValuesChange,
174
- changeLinking,
175
- multiple: input?.meta?.multiple,
176
- updateOptions: input.updateOptions || false,
177
- options: input.options,
178
- optionGroup: input.optionGroup,
179
- optionsFilter: input?.meta?.optionsFilter,
180
- filterCond: input?.meta?.filterCond,
181
- disableOtherFields: input.disableOtherFields,
182
- updateOtherFields: input.updateOtherFields,
183
- repeatLabel: input.repeatLabel,
184
- unique: checkDuplicates ? input.unique : undefined,
185
- modalTitle: input.modalTitle,
186
- buttonText: input.buttonText,
187
- restricted: input.restricted || false,
188
- totalMax: input.totalMax,
189
- country: input.country || undefined,
190
- address: input?.meta?.address || undefined,
191
- addressData,
192
- value,
193
- allowDupplicates: input.allowDupplicates,
194
- commentValue,
195
- commentHint: input.commentHint ? input.commentHint : t('Please specify'),
196
- rules: (input.rules || []).map(r => {
197
- if (r.message && r.message.indexOf('errors::') >= 0) {
198
- r.message = t(r.message);
199
- }
200
- return r;
201
- }),
202
- template: input.template,
203
- };
217
+ if (input.type === "switch" && input.autocomplete) {
218
+ Object.assign(config, { autocomplete: input.autocomplete });
219
+ }
204
220
 
205
- if (input.type === 'switch' && input.autocomplete) {
206
- Object.assign(config, { autocomplete: input.autocomplete });
207
- }
221
+ if (input.type === "switch") {
222
+ if (input.replace) {
223
+ Object.assign(config, { replace: input.replace });
224
+ }
225
+ if (input.unique) {
226
+ Object.assign(config, { unique: input.unique });
227
+ }
228
+ }
208
229
 
209
- if (input.type === 'switch') {
210
- if (input.replace) {
211
- Object.assign(config, { replace: input.replace });
212
- }
213
- if (input.unique) {
214
- Object.assign(config, { unique: input.unique });
215
- }
216
- }
230
+ if (input.type === "linkingModal") {
231
+ Object.assign(config, {
232
+ content: input.inputs,
233
+ });
234
+ }
217
235
 
218
- if (input.type === 'linkingModal') {
219
- Object.assign(config, {
220
- content: input.inputs
221
- });
222
- }
236
+ if (input.type === "group") {
237
+ Object.assign(config, {
238
+ groupInputs: Object.keys(input.groupInputs || {}).map((key) => {
239
+ const isRep = path.split(".")[0].match(/\[/);
240
+ const newPath =
241
+ path.split(".").length === 1
242
+ ? key
243
+ : isRep && isRep.length
244
+ ? path.split(".")[0] + `.${key}`
245
+ : path.split(".")[0] + `.${key}`;
246
+ const groupInp = input.groupInputs[key];
247
+ const inputData = getData(
248
+ groupInp.dataId || key,
249
+ input.groupInputs[key],
250
+ dot.pick(newPath, values),
251
+ null,
252
+ newPath,
253
+ );
254
+ return {
255
+ path: newPath,
256
+ type: input.groupInputs[key].type,
257
+ data: inputData,
258
+ input,
259
+ forms: {
260
+ form: MainForm,
261
+ allForms: plainForms,
262
+ values,
263
+ setFormValues: setValues,
264
+ setAddress,
265
+ },
266
+ };
267
+ }),
268
+ });
269
+ }
223
270
 
224
- if (input.type === 'group') {
225
- Object.assign(config, {
226
- groupInputs: Object.keys(input.groupInputs || {}).map(key => {
227
- const isRep = path.split('.')[0].match(/\[/);
228
- const newPath = path.split('.').length === 1
229
- ? key
230
- : (isRep && isRep.length ? path.split('.')[0] + `.${key}` : path.split('.')[0] + `.${key}`);
231
- const groupInp = input.groupInputs[key];
232
- const inputData = getData(
233
- groupInp.dataId || key,
234
- input.groupInputs[key],
235
- dot.pick(newPath, values),
236
- null,
237
- newPath
238
- );
239
- return {
240
- path: newPath,
241
- type: input.groupInputs[key].type,
242
- data: inputData,
243
- input,
244
- forms: {
245
- form: MainForm,
246
- allForms: plainForms,
247
- values,
248
- setFormValues: setValues,
249
- setAddress
250
- },
251
- }
252
- }),
253
- });
254
- }
271
+ if (input.type === "groupInputs") {
272
+ Object.assign(config, {
273
+ groupInputs: Object.keys(input.inputs || {}).map((key) => {
274
+ const isRep = path.split(".")[0].match(/\[/);
275
+ const newPath =
276
+ path.split(".").length === 1
277
+ ? key
278
+ : isRep && isRep.length
279
+ ? path.split(".")[0] + `.${key}`
280
+ : path.split(".")[0] + `.${key}`;
281
+ const groupInp = input.inputs[key];
282
+ const inputData = getData(
283
+ groupInp.dataId || key,
284
+ input.inputs[key],
285
+ dot.pick(newPath, values),
286
+ null,
287
+ newPath,
288
+ );
289
+ return {
290
+ path: newPath,
291
+ type: input.inputs[key].type,
292
+ input,
293
+ data: inputData,
294
+ forms: {
295
+ form: MainForm,
296
+ allForms: plainForms,
297
+ values,
298
+ setFormValues: setValues,
299
+ setAddress,
300
+ },
301
+ };
302
+ }),
303
+ });
304
+ }
255
305
 
256
- if (input.type === 'groupInputs') {
257
- Object.assign(config, {
258
- groupInputs: Object.keys(input.inputs || {}).map(key => {
259
- const isRep = path.split('.')[0].match(/\[/);
260
- const newPath = path.split('.').length === 1
261
- ? key
262
- : (isRep && isRep.length ? path.split('.')[0] + `.${key}` : path.split('.')[0] + `.${key}`);
263
- const groupInp = input.inputs[key];
264
- const inputData = getData(
265
- groupInp.dataId || key,
266
- input.inputs[key],
267
- dot.pick(newPath, values),
268
- null,
269
- newPath
270
- );
271
- return {
272
- path: newPath,
273
- type: input.inputs[key].type,
274
- input,
275
- data: inputData,
276
- forms: {
277
- form: MainForm,
278
- allForms: plainForms,
279
- values,
280
- setFormValues: setValues,
281
- setAddress
282
- },
283
- }
284
- }),
285
- });
286
- }
306
+ return config;
307
+ };
287
308
 
288
- return config;
289
- }
309
+ useEffect(() => {
310
+ setValues({
311
+ ...values,
312
+ ...formData,
313
+ });
290
314
 
315
+ setInitialValues((prev) => {
316
+ if (prev === undefined) {
317
+ return {
318
+ ...values,
319
+ ...formData,
320
+ };
321
+ }
322
+ return prev;
323
+ });
291
324
 
292
- useEffect(() => {
293
- setValues({
294
- ...values,
295
- ...formData,
296
- });
297
-
298
- setInitialValues((prev) => {
299
- if(prev === undefined) {
300
- return {
301
- ...values,
302
- ...formData,
303
- }
304
- }
305
- return prev;
306
- })
325
+ if (MainForm.setFieldsValue && isModal) {
326
+ // TODO: Need to check this one the error of date was here;
327
+ // MainForm.resetFields();
328
+ // MainForm.setFieldsValue({
329
+ // ...values,
330
+ // ...formData
331
+ // });
332
+ }
333
+ }, [data]);
307
334
 
308
- if (MainForm.setFieldsValue && isModal) {
309
- // TODO: Need to check this one the error of date was here;
310
- // MainForm.resetFields();
311
- // MainForm.setFieldsValue({
312
- // ...values,
313
- // ...formData
314
- // });
315
- }
316
- }, [data]);
317
-
335
+ const renderForm = () => {
336
+ switch (template) {
337
+ default:
338
+ return (
339
+ <Form
340
+ form={MainForm}
341
+ autoComplete="new-password"
342
+ key={id}
343
+ name={id}
344
+ layout="vertical"
345
+ style={{ maxWidth: 700 }}
346
+ className={`main-form${formClass ? ` ${formClass}` : ""}`}
347
+ onValuesChange={(_changedValue, _allValues) => {
348
+ const changedValue = { ..._changedValue };
349
+ const allValues = { ..._allValues };
318
350
 
319
- const renderForm = () => {
320
- switch (template) {
321
- default:
322
- return (
323
- <Form
324
- form={MainForm}
325
- autoComplete="new-password"
326
- key={id}
327
- name={id}
328
- layout="vertical"
329
- style={{ maxWidth: 700 }}
330
- className={`main-form${formClass ? ` ${formClass}` : ''}`}
331
- onValuesChange={(_changedValue, _allValues) => {
332
- const changedValue = { ..._changedValue };
333
- const allValues = { ..._allValues };
334
-
335
- // AjaxSubGroup fix, so meta dont get lost
336
- Object.keys(_allValues || {}).forEach(key => {
337
- if (key && values[key] && values[key].meta && typeof values[key] === 'object') {
338
- changedValue[key] = {
339
- ...values[key],
340
- ..._changedValue[key],
341
- };
342
- allValues[key] = {
343
- ...values[key],
344
- ..._allValues[key],
345
- };
346
- }
347
- })
351
+ // AjaxSubGroup fix, so meta dont get lost
352
+ Object.keys(_allValues || {}).forEach((key) => {
353
+ if (
354
+ key &&
355
+ values[key] &&
356
+ values[key].meta &&
357
+ typeof values[key] === "object"
358
+ ) {
359
+ changedValue[key] = {
360
+ ...values[key],
361
+ ..._changedValue[key],
362
+ };
363
+ allValues[key] = {
364
+ ...values[key],
365
+ ..._allValues[key],
366
+ };
367
+ }
368
+ });
348
369
 
349
- const cleanedChangeValue = convertUndefinedToNull(changedValue);
350
- const cleanedAllValues = convertUndefinedToNull({
351
- ...values,
352
- ...allValues
353
- });
370
+ const cleanedChangeValue = convertUndefinedToNull(changedValue);
371
+ const cleanedAllValues = convertUndefinedToNull({
372
+ ...values,
373
+ ...allValues,
374
+ });
354
375
 
355
- if (
356
- 'associatedMine' in cleanedChangeValue &&
357
- cleanedChangeValue.associatedMine === null &&
358
- values.associatedMine != null
359
- ) {
360
- cleanedChangeValue.associatedMine = values.associatedMine;
361
- cleanedAllValues.associatedMine = values.associatedMine;
362
- }
363
-
376
+ if (
377
+ "associatedMine" in cleanedChangeValue &&
378
+ cleanedChangeValue.associatedMine === null &&
379
+ values.associatedMine != null
380
+ ) {
381
+ cleanedChangeValue.associatedMine = values.associatedMine;
382
+ cleanedAllValues.associatedMine = values.associatedMine;
383
+ }
364
384
 
365
- // onValuesChange(changedValue, {
366
- // ...values,
367
- // ...allValues
368
- // });
369
- onValuesChange(cleanedChangeValue, cleanedAllValues);
385
+ // onValuesChange(changedValue, {
386
+ // ...values,
387
+ // ...allValues
388
+ // });
389
+ onValuesChange(cleanedChangeValue, cleanedAllValues);
370
390
 
371
- setValues(cleanedAllValues);
372
- // setValues({
373
- // ...values,
374
- // ...allValues
375
- // });
376
- }}
377
- >
378
- {definition}
379
- {introText && introText !== '' ? <p className="repeatable">{introText}</p> : null}
380
- {options.alertConf && typeof options.alertConf === "object" ? (
381
- <Alert
382
- message={options.alertConf.text}
383
- type={options.alertConf.type}
384
- closable={options.alertConf.closable} />
385
- ) : null}
386
- {Object.keys(options || {})
387
- .filter(k => !excludedKeys.includes(k) &&
388
- showHideInput(options[k], values, undefined, undefined, setValues, k)
389
- )
390
- .sort((a, b) => (options[a].position || 0) - (options[b].position || 0))
391
- .map((k, i) => {
392
- const input = options[k];
393
-
394
- // Apply styling based on individual input type
395
- const inputStyles = input.type === 'groupInputs' || input.type === 'phoneNumber' ? {} : { '--static-width': (input.type === 'group' && data[k]?.noPlanningRequired) ? '586px' :staticWidth };
396
-
397
- if (input.type === 'ajaxSubGroup') {
398
- return (
399
- <div key={i} style={inputStyles}>
400
- <AjaxSubGroup
401
- highlightMandatory={highlightMandatory}
402
- form={input}
403
- options={options}
404
- k={k}
405
- setValues={setValues}
406
- values={values}
407
- excludedKeys={excludedKeys}
408
- i={i}
409
- formTitles={formTitles}
410
- getData={getData}
411
- MainForm={MainForm}
412
- plainForms={plainForms}
413
- setAddress={setAddress}
414
- onValuesChange={onValuesChange}
415
- data={data}
416
- allData={{ ...allData, subGroupTitle }}
417
- changeLinking={changeLinking}
418
- changeInputMeta={changeInputMeta}
419
- user={user}
420
- />
421
- </div>
422
- );
423
- } else if (input.inputs && input.type !== 'groupInputs' && input.type !== 'groupCheckbox' && input.type !== 'dataLinkGroup') {
424
- return (
425
- <div
426
- className={formatClassname(['group', !input.repeatable && 'sub-group'])}
427
- key={i}
428
- style={inputStyles}
429
- >
430
- {renderNestedInputs(
431
- options,
432
- k,
433
- setValues,
434
- values,
435
- excludedKeys,
436
- i,
437
- formTitles,
438
- getData,
439
- MainForm,
440
- plainForms,
441
- setAddress,
442
- onValuesChange,
443
- data,
444
- { ...allData, subGroupTitle },
445
- changeLinking,
446
- changeInputMeta,
447
- t,
448
- highlightMandatory,
449
- )}
450
- </div>
451
- );
452
- } else {
453
- const inputId = input.dataId || k;
454
- const value = values[inputId];
455
- const commentValue = (inputsMeta[k] || {}).comment;
456
- const inputData = getData(inputId, input, value, commentValue, inputId, inputId);
391
+ setValues(cleanedAllValues);
392
+ // setValues({
393
+ // ...values,
394
+ // ...allValues
395
+ // });
396
+ }}
397
+ >
398
+ {definition}
399
+ {introText && introText !== "" ? (
400
+ <p className="repeatable">{introText}</p>
401
+ ) : null}
402
+ {options.alertConf && typeof options.alertConf === "object" ? (
403
+ <Alert
404
+ message={options.alertConf.text}
405
+ type={options.alertConf.type}
406
+ closable={options.alertConf.closable}
407
+ />
408
+ ) : null}
409
+ {Object.keys(options || {})
410
+ .filter(
411
+ (k) =>
412
+ !excludedKeys.includes(k) &&
413
+ showHideInput(
414
+ options[k],
415
+ values,
416
+ undefined,
417
+ undefined,
418
+ setValues,
419
+ k,
420
+ ),
421
+ )
422
+ .sort((a, b) => (options[a].position || 0) - (options[b].position || 0))
423
+ .map((k, i) => {
424
+ const input = options[k];
457
425
 
458
- if (!input.type) {
459
- return null;
460
- }
426
+ // Apply styling based on individual input type
427
+ const inputStyles =
428
+ input.type === "groupInputs" || input.type === "phoneNumber"
429
+ ? {}
430
+ : {
431
+ "--static-width":
432
+ input.type === "group" &&
433
+ data[k]?.noPlanningRequired
434
+ ? "586px"
435
+ : staticWidth,
436
+ };
461
437
 
462
- return showHideInput(input, values, undefined, undefined, setValues, inputId) ?
463
- <div className="group" key={i} style={inputStyles}>
464
- {getFormTitles(formTitles, inputData.name, i)}
465
- <GetFormItem
466
- inputKey={k}
467
- inputData={inputData}
468
- inputId={inputId}
469
- input={input}
470
- highlightMandatory={highlightMandatory}
471
- changeInputMeta={changeInputMeta}
472
- changeLinking={changeLinking}
473
- inputMeta={inputsMeta[k]}
474
- values={values}
475
- MainForm={MainForm}
476
- options={options}
477
- plainForms={plainForms}
478
- setValues={setValues}
479
- setAddress={setAddress}
480
- onValuesChange={onValuesChange}
481
- i={i}
482
- setLoading={setLoading}
483
- />
484
- </div> : null
485
- }
486
- })}
487
- <Space size="large" className="w-100 mb-3">&nbsp;</Space>
488
- </Form>
489
- )
490
- }
491
- };
438
+ if (input.type === "ajaxSubGroup") {
439
+ return (
440
+ <div key={i} style={inputStyles}>
441
+ <AjaxSubGroup
442
+ highlightMandatory={highlightMandatory}
443
+ form={input}
444
+ options={options}
445
+ k={k}
446
+ setValues={setValues}
447
+ values={values}
448
+ excludedKeys={excludedKeys}
449
+ i={i}
450
+ formTitles={formTitles}
451
+ getData={getData}
452
+ MainForm={MainForm}
453
+ plainForms={plainForms}
454
+ setAddress={setAddress}
455
+ onValuesChange={onValuesChange}
456
+ data={data}
457
+ allData={{ ...allData, subGroupTitle }}
458
+ changeLinking={changeLinking}
459
+ changeInputMeta={changeInputMeta}
460
+ user={user}
461
+ />
462
+ </div>
463
+ );
464
+ } else if (
465
+ input.inputs &&
466
+ input.type !== "groupInputs" &&
467
+ input.type !== "groupCheckbox" &&
468
+ input.type !== "dataLinkGroup"
469
+ ) {
470
+ return (
471
+ <div
472
+ className={formatClassname([
473
+ "group",
474
+ !input.repeatable && "sub-group",
475
+ ])}
476
+ key={i}
477
+ style={inputStyles}
478
+ >
479
+ {renderNestedInputs(
480
+ options,
481
+ k,
482
+ setValues,
483
+ values,
484
+ excludedKeys,
485
+ i,
486
+ formTitles,
487
+ getData,
488
+ MainForm,
489
+ plainForms,
490
+ setAddress,
491
+ onValuesChange,
492
+ data,
493
+ { ...allData, subGroupTitle },
494
+ changeLinking,
495
+ changeInputMeta,
496
+ t,
497
+ highlightMandatory,
498
+ )}
499
+ </div>
500
+ );
501
+ } else {
502
+ const inputId = input.dataId || k;
503
+ const value = values[inputId];
504
+ const commentValue = (inputsMeta[k] || {}).comment;
505
+ const inputData = getData(
506
+ inputId,
507
+ input,
508
+ value,
509
+ commentValue,
510
+ inputId,
511
+ inputId,
512
+ );
492
513
 
493
- return (
494
- <EditProvider
495
- t={t}
496
- isReview={isReview}
497
- user={user}
498
- getMainApiUrl={getMainApiUrl}
499
- getAppHeader={getAppHeader}
500
- highlightMandatory={highlightMandatory}
501
- errors={errors}
502
- changeErrors={changeErrors}
503
- getApiBaseUrl={getApiBaseUrl}
504
- ajaxForms={ajaxForms}
505
- ajaxOptions={ajaxOptions}
506
- changeAjaxOptions={changeAjaxOptions}
507
- app={app}
508
- query={query}
509
- goTo={goTo}
510
- changeAjaxForms={changeAjaxForms}
511
- evaluationConfig={evaluationConfig}
512
- >
513
- {breadcrumb}
514
- {renderForm()}
515
- {isModal && (
516
- <div className="form-botom text-center">
517
- <Button
518
- type="primary"
519
- className="mr-2"
520
- loading={(isSubmitting || loading)}
521
- disabled={(isSubmitting || loading)}
522
- onClick={async (ev) => {
523
- if (!loading) {
524
- ev.stopPropagation();
525
- MainForm.validateFields().then(() => {
526
- const formV = MainForm.getFieldsValue();
527
- onSubmit({
528
- ...values,
529
- ...formV
530
- });
531
- }).catch(e => {
532
- console.log(e);
533
- });
534
- }
535
- }}>
536
- {t('Save')}
537
- </Button>
538
- <Button
539
- loading={isSubmitting}
540
- disabled={isSubmitting}
541
- onClick={() => onCancel()}>
542
- {t('Cancel')}
543
- </Button>
544
- </div>
545
- )}
546
- </EditProvider>
547
- );
548
- }
514
+ if (!input.type) {
515
+ return null;
516
+ }
517
+
518
+ return showHideInput(
519
+ input,
520
+ values,
521
+ undefined,
522
+ undefined,
523
+ setValues,
524
+ inputId,
525
+ ) ? (
526
+ <div className="group" key={i} style={inputStyles}>
527
+ {getFormTitles(formTitles, inputData.name, i)}
528
+ <GetFormItem
529
+ inputKey={k}
530
+ inputData={inputData}
531
+ inputId={inputId}
532
+ input={input}
533
+ highlightMandatory={highlightMandatory}
534
+ changeInputMeta={changeInputMeta}
535
+ changeLinking={changeLinking}
536
+ inputMeta={inputsMeta[k] || {}}
537
+ values={values}
538
+ MainForm={MainForm}
539
+ options={options}
540
+ plainForms={plainForms}
541
+ setValues={setValues}
542
+ setAddress={setAddress}
543
+ onValuesChange={onValuesChange}
544
+ i={i}
545
+ setLoading={setLoading}
546
+ />
547
+ </div>
548
+ ) : null;
549
+ }
550
+ })}
551
+ <Space size="large" className="w-100 mb-3">
552
+ &nbsp;
553
+ </Space>
554
+ </Form>
555
+ );
556
+ }
557
+ };
558
+
559
+ return (
560
+ <EditProvider
561
+ t={t}
562
+ isReview={isReview}
563
+ user={user}
564
+ getMainApiUrl={getMainApiUrl}
565
+ getAppHeader={getAppHeader}
566
+ highlightMandatory={highlightMandatory}
567
+ errors={errors}
568
+ changeErrors={changeErrors}
569
+ getApiBaseUrl={getApiBaseUrl}
570
+ ajaxForms={ajaxForms}
571
+ ajaxOptions={ajaxOptions}
572
+ changeAjaxOptions={changeAjaxOptions}
573
+ app={app}
574
+ query={query}
575
+ goTo={goTo}
576
+ changeAjaxForms={changeAjaxForms}
577
+ evaluationConfig={evaluationConfig}
578
+ >
579
+ {breadcrumb}
580
+ {renderForm()}
581
+ {isModal && (
582
+ <div className="form-botom text-center">
583
+ <Button
584
+ type="primary"
585
+ className="mr-2"
586
+ loading={isSubmitting || loading}
587
+ disabled={isSubmitting || loading}
588
+ onClick={async (ev) => {
589
+ if (!loading) {
590
+ ev.stopPropagation();
591
+ MainForm.validateFields()
592
+ .then(() => {
593
+ const formV = MainForm.getFieldsValue();
594
+ onSubmit({
595
+ ...values,
596
+ ...formV,
597
+ });
598
+ })
599
+ .catch((e) => {
600
+ console.log(e);
601
+ });
602
+ }
603
+ }}
604
+ >
605
+ {t("Save")}
606
+ </Button>
607
+ <Button
608
+ loading={isSubmitting}
609
+ disabled={isSubmitting}
610
+ onClick={() => onCancel()}
611
+ >
612
+ {t("Cancel")}
613
+ </Button>
614
+ </div>
615
+ )}
616
+ </EditProvider>
617
+ );
618
+ };
549
619
 
550
620
  EditForm.propTypes = {
551
- highlightMandatory: PropTypes.any,
552
- onValuesChange: PropTypes.func,
553
- form: PropTypes.object,
554
- data: PropTypes.object,
555
- allData: PropTypes.object,
556
- excludedKeys: PropTypes.any,
557
- disabledInputs: PropTypes.any,
558
- checkDuplicates: PropTypes.any,
559
- plainForms: PropTypes.any,
560
- linkingForms: PropTypes.any,
561
- onSubmit: PropTypes.func,
562
- onCancel: PropTypes.func,
563
- isModal: PropTypes.any,
564
- breadcrumb: PropTypes.any,
565
- definition: PropTypes.any,
566
- subGroupTitle: PropTypes.any,
567
- MainForm: PropTypes.any,
568
- template: PropTypes.any,
569
- loading: PropTypes.any,
570
- setLoading: PropTypes.func,
571
- inputsMeta: PropTypes.any,
572
- changeInputMeta: PropTypes.func,
573
- changeLinking: PropTypes.func,
574
- t: PropTypes.any,
575
- user: PropTypes.any,
576
- ajaxForms: PropTypes.any,
577
- ajaxOptions: PropTypes.any,
578
- getMainApiUrl: PropTypes.any,
579
- getAppHeader: PropTypes.any,
580
- getApiBaseUrl: PropTypes.any,
581
- changeAjaxOptions: PropTypes.any,
582
- app: PropTypes.any,
583
- query: PropTypes.any,
584
- goTo: PropTypes.any,
585
- changeAjaxForms: PropTypes.any,
586
- errors: PropTypes.any,
587
- changeErrors: PropTypes.func,
588
- staticWidth: PropTypes.string,
589
- }
621
+ highlightMandatory: PropTypes.any,
622
+ onValuesChange: PropTypes.func,
623
+ form: PropTypes.object,
624
+ data: PropTypes.object,
625
+ allData: PropTypes.object,
626
+ excludedKeys: PropTypes.any,
627
+ disabledInputs: PropTypes.any,
628
+ checkDuplicates: PropTypes.any,
629
+ plainForms: PropTypes.any,
630
+ linkingForms: PropTypes.any,
631
+ onSubmit: PropTypes.func,
632
+ onCancel: PropTypes.func,
633
+ isModal: PropTypes.any,
634
+ breadcrumb: PropTypes.any,
635
+ definition: PropTypes.any,
636
+ subGroupTitle: PropTypes.any,
637
+ MainForm: PropTypes.any,
638
+ template: PropTypes.any,
639
+ loading: PropTypes.any,
640
+ setLoading: PropTypes.func,
641
+ inputsMeta: PropTypes.any,
642
+ changeInputMeta: PropTypes.func,
643
+ changeLinking: PropTypes.func,
644
+ t: PropTypes.any,
645
+ user: PropTypes.any,
646
+ ajaxForms: PropTypes.any,
647
+ ajaxOptions: PropTypes.any,
648
+ getMainApiUrl: PropTypes.any,
649
+ getAppHeader: PropTypes.any,
650
+ getApiBaseUrl: PropTypes.any,
651
+ changeAjaxOptions: PropTypes.any,
652
+ app: PropTypes.any,
653
+ query: PropTypes.any,
654
+ goTo: PropTypes.any,
655
+ changeAjaxForms: PropTypes.any,
656
+ errors: PropTypes.any,
657
+ changeErrors: PropTypes.func,
658
+ staticWidth: PropTypes.string,
659
+ };