@visns-studio/visns-components 1.7.7 → 1.8.2

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.
Files changed (5) hide show
  1. package/components/crm/visns-data-grid.jsx +6 -1
  2. package/components/crm/visns-fetch.jsx +70 -62
  3. package/components/crm/visns-field.jsx +462 -690
  4. package/components/crm/visns-form.jsx +351 -441
  5. package/package.json +1 -1
package/components/crm/visns-form.jsx CHANGED
@@ -26,11 +26,9 @@ function Form(props) {
26
26
  const [uploadProgress, setUploadProgress] = useState(0);
27
27
 
28
28
  const handleChange = (e) => {
29
- let id = e.target.dataset.hasOwnProperty("jsonkey")
30
- ? e.target.dataset.jsonkey
31
- : e.target.dataset.name;
32
- let value = e.target.value;
33
- let _dataset;
29
+ const id = e.target.dataset.jsonkey || e.target.dataset.name;
30
+ const value = e.target.value;
31
+ let _dataset = {};
34
32
 
35
33
  if (e.target[e.target.selectedIndex]) {
36
34
  _dataset = e.target[e.target.selectedIndex].dataset;
@@ -49,7 +47,7 @@ function Form(props) {
49
47
  }
50
48
 
51
49
  if (!_.isEmpty(_dataset)) {
52
- Object.keys(_dataset).forEach(function (c) {
50
+ Object.keys(_dataset).forEach((c) => {
53
51
  if (formData.hasOwnProperty(c)) {
54
52
  setFormData((prevState) => ({
55
53
  ...prevState,
@@ -60,7 +58,7 @@ function Form(props) {
60
58
  }
61
59
 
62
60
  if (e.target.dataset.hasOwnProperty("show")) {
63
- let _show =
61
+ const _show =
64
62
  e.target.dataset.show !== ""
65
63
  ? JSON.parse(e.target.dataset.show)
66
64
  : [];
@@ -75,7 +73,7 @@ function Form(props) {
75
73
  showObject.id !== "" &&
76
74
  showObject.value.length > 0
77
75
  ) {
78
- let _fields = formSettings.fields;
76
+ const _fields = formSettings.fields;
79
77
  let _counter;
80
78
  _fields.forEach((a, b) => {
81
79
  if (a.id === showObject.id) {
@@ -83,17 +81,12 @@ function Form(props) {
83
81
  }
84
82
  });
85
83
 
86
- let _valueChecker = parseInt(e.target.value);
84
+ const _valueChecker = parseInt(e.target.value);
87
85
 
88
- if (
86
+ _fields[_counter].hide = !(
89
87
  _counter >= 0 &&
90
- showObject.value.includes(_valueChecker) ===
91
- true
92
- ) {
93
- _fields[_counter].hide = false;
94
- } else {
95
- _fields[_counter].hide = true;
96
- }
88
+ showObject.value.includes(_valueChecker)
89
+ );
97
90
 
98
91
  if (updateForm) {
99
92
  updateForm((prevState) => ({
@@ -132,70 +125,69 @@ function Form(props) {
132
125
  };
133
126
 
134
127
  const handleChangeSelect = (inputValue, action, id) => {
128
+ const updateFormData = (update) => {
129
+ setFormData((prevState) => ({
130
+ ...prevState,
131
+ ...update,
132
+ }));
133
+ };
134
+
135
135
  switch (action.action) {
136
136
  case "select-option":
137
- setFormData((prevState) => ({
138
- ...prevState,
139
- [id]: inputValue,
140
- }));
137
+ updateFormData({ [id]: inputValue });
141
138
 
142
- Object.keys(inputValue).forEach(function (a) {
139
+ Object.keys(inputValue).forEach((a) => {
143
140
  if (formData.hasOwnProperty(a)) {
144
- setFormData((prevState) => ({
145
- ...prevState,
141
+ updateFormData({
146
142
  [a]:
147
143
  prevState[a] !== ""
148
144
  ? prevState[a]
149
145
  : inputValue[a],
150
- }));
146
+ });
151
147
  }
152
148
  });
153
149
 
154
150
  formSettings.fields.forEach((f) => {
155
- if (f.id === id) {
156
- if (f.trigger && f.trigger.type) {
157
- if (f.trigger.type === "addDays") {
158
- let newDate = moment();
159
- let add = false;
151
+ if (
152
+ f.id === id &&
153
+ f.trigger &&
154
+ f.trigger.type === "addDays"
155
+ ) {
156
+ let newDate = moment();
157
+ let add = false;
160
158
 
161
- if (
162
- inputValue.no_of_days &&
163
- parseFloat(inputValue.no_of_days) > 0
164
- ) {
165
- newDate.add(
166
- parseFloat(inputValue.no_of_days),
167
- "days"
168
- );
169
- add = true;
170
- }
159
+ if (
160
+ inputValue.no_of_days &&
161
+ parseFloat(inputValue.no_of_days) > 0
162
+ ) {
163
+ newDate.add(
164
+ parseFloat(inputValue.no_of_days),
165
+ "days"
166
+ );
167
+ add = true;
168
+ }
171
169
 
172
- if (
173
- inputValue.no_of_hours &&
174
- parseFloat(inputValue.no_of_hours) > 0
175
- ) {
176
- newDate.add(
177
- parseFloat(inputValue.no_of_hours),
178
- "hours"
179
- );
180
- add = true;
181
- }
170
+ if (
171
+ inputValue.no_of_hours &&
172
+ parseFloat(inputValue.no_of_hours) > 0
173
+ ) {
174
+ newDate.add(
175
+ parseFloat(inputValue.no_of_hours),
176
+ "hours"
177
+ );
178
+ add = true;
179
+ }
182
180
 
183
- if (add === true) {
184
- setFormData((prevState) => ({
185
- ...prevState,
186
- [f.trigger.id]: newDate.toDate(),
187
- }));
188
- }
189
- }
181
+ if (add) {
182
+ updateFormData({
183
+ [f.trigger.id]: newDate.toDate(),
184
+ });
190
185
  }
191
186
  }
192
187
  });
193
188
  break;
194
189
  case "clear":
195
- setFormData((prevState) => ({
196
- ...prevState,
197
- [id]: "",
198
- }));
190
+ updateFormData({ [id]: "" });
199
191
  break;
200
192
  }
201
193
  };
@@ -213,27 +205,28 @@ function Form(props) {
213
205
  }));
214
206
 
215
207
  if (id === "same_address") {
216
- if (e.target.checked) {
217
- setFormData((prevState) => ({
218
- ...prevState,
219
- postal_address1: prevState.address1,
220
- postal_address2: prevState.address2,
221
- postal_suburb: prevState.suburb,
222
- postal_postcode: prevState.postcode,
223
- postal_state: prevState.state,
224
- postal_country: prevState.country,
225
- }));
226
- } else {
227
- setFormData((prevState) => ({
228
- ...prevState,
229
- postal_address1: "",
230
- postal_address2: "",
231
- postal_suburb: "",
232
- postal_postcode: "",
233
- postal_state: "",
234
- postal_country: "",
235
- }));
236
- }
208
+ const postalData = e.target.checked
209
+ ? {
210
+ postal_address1: prevState.address1,
211
+ postal_address2: prevState.address2,
212
+ postal_suburb: prevState.suburb,
213
+ postal_postcode: prevState.postcode,
214
+ postal_state: prevState.state,
215
+ postal_country: prevState.country,
216
+ }
217
+ : {
218
+ postal_address1: "",
219
+ postal_address2: "",
220
+ postal_suburb: "",
221
+ postal_postcode: "",
222
+ postal_state: "",
223
+ postal_country: "",
224
+ };
225
+
226
+ setFormData((prevState) => ({
227
+ ...prevState,
228
+ ...postalData,
229
+ }));
237
230
  }
238
231
 
239
232
  if (e.target.dataset.show) {
@@ -282,13 +275,10 @@ function Form(props) {
282
275
  const suburb = context[1]?.text || "";
283
276
  const postcode = context[0]?.text || "";
284
277
 
285
- let state = "";
286
- let country = "";
287
- if (context.length === 5) {
288
- [state, country] = [context[3]?.text, context[4]?.text];
289
- } else {
290
- [state, country] = [context[2]?.text, context[3]?.text];
291
- }
278
+ const [state, country] =
279
+ context.length === 5
280
+ ? [context[3]?.text, context[4]?.text]
281
+ : [context[2]?.text, context[3]?.text];
292
282
 
293
283
  const formDataUpdate = {
294
284
  address1,
@@ -300,12 +290,14 @@ function Form(props) {
300
290
  };
301
291
 
302
292
  if (formData.same_address === true || id !== "address1") {
303
- formDataUpdate.postal_address1 = address1;
304
- formDataUpdate.postal_address2 = address2;
305
- formDataUpdate.postal_suburb = suburb;
306
- formDataUpdate.postal_postcode = postcode;
307
- formDataUpdate.postal_state = state;
308
- formDataUpdate.postal_country = country;
293
+ Object.assign(formDataUpdate, {
294
+ postal_address1: address1,
295
+ postal_address2: address2,
296
+ postal_suburb: suburb,
297
+ postal_postcode: postcode,
298
+ postal_state: state,
299
+ postal_country: country,
300
+ });
309
301
  }
310
302
 
311
303
  setFormData((prevState) => ({
@@ -320,10 +312,13 @@ function Form(props) {
320
312
  let _inputClass = inputClass;
321
313
  let validation = "";
322
314
 
323
- if (formType === "create" || formType === "update") {
315
+ if (["create", "update"].includes(formType)) {
324
316
  fields.forEach((item) => {
325
317
  if (item.required === true) {
326
- if (formData[item.id] === "") {
318
+ if (
319
+ formData[item.id] === "" ||
320
+ formData[item.id] === undefined
321
+ ) {
327
322
  if (
328
323
  item.hasOwnProperty("required_check") &&
329
324
  item.required_check !== ""
@@ -339,7 +334,6 @@ function Form(props) {
339
334
  item.label +
340
335
  " is a required field.<br/>";
341
336
  }
342
-
343
337
  _inputClass[item.id] = "inputError";
344
338
  }
345
339
  } else {
@@ -360,7 +354,6 @@ function Form(props) {
360
354
  ) {
361
355
  _inputClass[item.required_check] = "";
362
356
  }
363
-
364
357
  _inputClass[item.id] = "";
365
358
  }
366
359
  } else {
@@ -382,7 +375,6 @@ function Form(props) {
382
375
  item.label +
383
376
  " is a required field.<br/>";
384
377
  }
385
-
386
378
  _inputClass[item.id] = "inputError";
387
379
  } else {
388
380
  _inputClass[item.id] = "";
@@ -400,8 +392,8 @@ function Form(props) {
400
392
  if (validation !== "") {
401
393
  toast.error(<div>{parse(validation)}</div>);
402
394
  } else {
403
- let url;
404
- let method;
395
+ let url = "";
396
+ let method = "";
405
397
  let fileUpload = false;
406
398
  let fileKey = "";
407
399
 
@@ -425,36 +417,23 @@ function Form(props) {
425
417
  method = "DELETE";
426
418
  break;
427
419
  default:
428
- url = "";
429
- method = "";
430
420
  break;
431
421
  }
432
422
 
433
423
  if (!_.isEmpty(formData)) {
434
424
  Object.keys(formData).forEach((item) => {
435
- if (formData[item] !== undefined) {
436
- if (item === "file") {
437
- fileUpload = true;
438
- fileKey = item;
439
- }
440
-
441
- if (
442
- formData[item] instanceof File &&
443
- formData[item] !== null
444
- ) {
445
- fileUpload = true;
446
- fileKey = item;
447
- }
425
+ if (
426
+ formData[item] !== undefined &&
427
+ (item === "file" ||
428
+ (formData[item] instanceof File &&
429
+ formData[item] !== null))
430
+ ) {
431
+ fileUpload = true;
432
+ fileKey = item;
448
433
  }
449
434
  });
450
435
  }
451
436
 
452
- console.info(
453
- fileUpload,
454
- formData[fileKey],
455
- formData[fileKey] instanceof File
456
- );
457
-
458
437
  if (
459
438
  fileUpload === true &&
460
439
  formData[fileKey] !== null &&
@@ -476,37 +455,9 @@ function Form(props) {
476
455
  if (result.error === "") {
477
456
  fetchTable();
478
457
  closeModal();
479
-
480
458
  toast.success(
481
459
  "Entry successfully saved into the system."
482
460
  );
483
-
484
- if (
485
- result.hasOwnProperty("myob") &&
486
- result.myob.hasOwnProperty("id") &&
487
- result.myob.hasOwnProperty("url")
488
- ) {
489
- CustomFetch(
490
- "/ajax" + result.myob.url,
491
- "POST",
492
- {
493
- id: result.myob.id,
494
- },
495
- function (result) {
496
- if (result.error === "") {
497
- toast.success(
498
- "Entry successfully saved into MYOB."
499
- );
500
- } else {
501
- toast.error(
502
- result.error !== undefined
503
- ? result.error
504
- : ""
505
- );
506
- }
507
- }
508
- );
509
- }
510
461
  } else {
511
462
  toast.error(
512
463
  result.error !== undefined ? result.error : ""
@@ -519,37 +470,9 @@ function Form(props) {
519
470
  if (result.error === "") {
520
471
  fetchTable();
521
472
  closeModal();
522
-
523
473
  toast.success(
524
474
  "Entry successfully saved into the system."
525
475
  );
526
-
527
- if (
528
- result.hasOwnProperty("myob") &&
529
- result.myob.hasOwnProperty("id") &&
530
- result.myob.hasOwnProperty("url")
531
- ) {
532
- CustomFetch(
533
- "/ajax" + result.myob.url,
534
- "POST",
535
- {
536
- id: result.myob.id,
537
- },
538
- function (result) {
539
- if (result.error === "") {
540
- toast.success(
541
- "Entry successfully saved into MYOB."
542
- );
543
- } else {
544
- toast.error(
545
- result.error !== undefined
546
- ? result.error
547
- : ""
548
- );
549
- }
550
- }
551
- );
552
- }
553
476
  } else {
554
477
  toast.error(
555
478
  result.error !== undefined ? result.error : ""
@@ -561,101 +484,189 @@ function Form(props) {
561
484
  };
562
485
 
563
486
  useEffect(() => {
564
- let _formData = formData;
565
- let _date = false;
487
+ let _formData = { ...formData }; // Create a new object instead of assigning a reference
566
488
 
567
489
  if (formSettings.fields.length > 0) {
568
490
  formSettings.fields.forEach((item) => {
569
- if (item.hasOwnProperty("value") && item.value !== "") {
570
- if (
571
- item.type === "date" ||
572
- item.type === "datetime" ||
573
- item.type === "time"
574
- ) {
575
- _formData[item.id] =
576
- item.value instanceof Date
577
- ? item.value
578
- : moment(item.value).toDate();
491
+ const { id, value, type } = item;
492
+ if (value !== "") {
493
+ if (["date", "datetime", "time"].includes(type)) {
494
+ _formData[id] =
495
+ value instanceof Date
496
+ ? value
497
+ : moment(value).toDate();
579
498
  } else {
580
- _formData[item.id] = item.value;
499
+ _formData[id] = value;
581
500
  }
582
501
  } else {
583
- _formData[item.id] = "";
502
+ _formData[id] = "";
584
503
  }
585
504
  });
586
505
  }
587
506
 
588
- if (formType !== "create") {
589
- if (columnId > 0) {
590
- CustomFetch(
591
- formSettings.url + "/" + columnId,
592
- "GET",
593
- {},
594
- function (result) {
595
- result = result.hasOwnProperty("data")
596
- ? result.data
597
- : result;
598
-
599
- Object.keys(formData).forEach((item) => {
600
- let tempRes = "";
601
- let tempResKey = "";
602
- let field = formSettings.fields.find(
603
- (f) => f.id === item
604
- );
605
-
606
- if (result[item] === undefined) {
607
- if (field && field.hasOwnProperty("relation")) {
608
- let tempRes = result[field.relation];
609
-
610
- if (
611
- [
612
- "multi-dropdown",
613
- "multi-dropdown-ajax",
614
- "async-dropdown-ajax",
615
- ].includes(field.type)
616
- ) {
617
- if (Array.isArray(tempRes)) {
618
- tempRes = tempRes.map((a) => ({
619
- value: a.name,
620
- label: a.name,
621
- }));
622
- }
623
- }
624
-
625
- if (tempRes) {
626
- const relationFrom =
627
- field.hasOwnProperty(
628
- "relation_from"
629
- )
630
- ? field.relation_from
631
- : field.id;
632
- tempRes = Array.isArray(tempRes)
633
- ? tempRes[0][relationFrom]
634
- : tempRes[relationFrom];
635
- } else {
636
- tempRes = "";
637
- }
507
+ const fetchData = async () => {
508
+ if (formType !== "create" && columnId > 0) {
509
+ try {
510
+ const result = await CustomFetch(
511
+ `${formSettings.url}/${columnId}`,
512
+ "GET",
513
+ {}
514
+ );
515
+ const data = result.hasOwnProperty("data")
516
+ ? result.data
517
+ : result;
518
+
519
+ const updatedFormData = { ..._formData }; // Create a new object to update properties
520
+
521
+ Object.keys(updatedFormData).forEach((item) => {
522
+ let tempRes = "";
523
+ let tempResKey = "";
524
+ let field = formSettings.fields.find(
525
+ (f) => f.id === item
526
+ );
638
527
 
639
- _formData[item] = tempRes;
640
- }
528
+ if (data[item] === undefined) {
529
+ if (field && field.hasOwnProperty("relation")) {
530
+ let tempRes = data[field.relation];
641
531
 
642
532
  if (
643
- field &&
644
- field.hasOwnProperty("relation") &&
645
533
  [
646
534
  "multi-dropdown",
647
535
  "multi-dropdown-ajax",
648
536
  "async-dropdown-ajax",
649
- ].includes(field.type)
537
+ ].includes(field.type) &&
538
+ Array.isArray(tempRes)
650
539
  ) {
651
- let tempObj = result;
652
- let tempRes = {};
540
+ tempRes = tempRes.map((a) => ({
541
+ value: a.name,
542
+ label: a.name,
543
+ }));
544
+ }
545
+
546
+ if (tempRes) {
547
+ const relationFrom = field.hasOwnProperty(
548
+ "relation_from"
549
+ )
550
+ ? field.relation_from
551
+ : field.id;
552
+ tempRes = Array.isArray(tempRes)
553
+ ? tempRes[0][relationFrom]
554
+ : tempRes[relationFrom];
555
+ } else {
556
+ tempRes = "";
557
+ }
558
+
559
+ updatedFormData[item] = tempRes;
560
+ }
653
561
 
654
- const relationLength = Array.isArray(
562
+ if (
563
+ field &&
564
+ field.hasOwnProperty("relation") &&
565
+ [
566
+ "multi-dropdown",
567
+ "multi-dropdown-ajax",
568
+ "async-dropdown-ajax",
569
+ ].includes(field.type)
570
+ ) {
571
+ let tempObj = data;
572
+ let tempRes = {};
573
+
574
+ const relationLength = Array.isArray(
575
+ field.relation
576
+ )
577
+ ? field.relation.length
578
+ : 1;
579
+ for (let i = 0; i < relationLength; i++) {
580
+ tempObj = tempObj[field.relation[i]];
581
+ }
582
+
583
+ if (tempObj !== undefined && tempObj !== null) {
584
+ let labelValue;
585
+
586
+ if (Array.isArray(field.relationName)) {
587
+ labelValue = field.relationName.map(
588
+ (name) => `${tempObj[name]} `
589
+ );
590
+ } else {
591
+ labelValue =
592
+ tempObj[field.relationName];
593
+ }
594
+
595
+ tempRes = {
596
+ value: tempObj.id,
597
+ label: labelValue,
598
+ };
599
+ }
600
+
601
+ updatedFormData[field.id] = tempRes;
602
+ }
603
+
604
+ if (
605
+ field &&
606
+ field.hasOwnProperty("relation") &&
607
+ ["address", "text"].includes(field.type)
608
+ ) {
609
+ let tempObj = data;
610
+ let tempRes = "";
611
+
612
+ const relationLength = Array.isArray(
613
+ field.relation
614
+ )
615
+ ? field.relation.length
616
+ : 1;
617
+ for (let i = 0; i < relationLength; i++) {
618
+ tempObj = tempObj[field.relation[i]];
619
+ }
620
+
621
+ if (tempObj !== undefined && tempObj !== null) {
622
+ let labelValue;
623
+
624
+ if (Array.isArray(field.relationName)) {
625
+ labelValue = field.relationName.map(
626
+ (name) => `${tempObj[name]} `
627
+ );
628
+ } else {
629
+ labelValue =
630
+ tempObj[field.relationName];
631
+ }
632
+
633
+ tempRes = labelValue;
634
+ }
635
+
636
+ updatedFormData[field.id] = tempRes;
637
+ }
638
+ } else {
639
+ if (
640
+ field &&
641
+ ["date", "datetime", "time"].includes(
642
+ field.type
643
+ )
644
+ ) {
645
+ if (data[item] === null || data[item] === "") {
646
+ updatedFormData[item] = "";
647
+ } else {
648
+ const momentDate = moment(data[item]);
649
+ updatedFormData[item] = momentDate.isValid()
650
+ ? momentDate.toDate()
651
+ : null;
652
+ }
653
+ } else if (
654
+ field &&
655
+ field.hasOwnProperty("relation")
656
+ ) {
657
+ const relationTypes = [
658
+ "multi-dropdown",
659
+ "multi-dropdown-ajax",
660
+ "async-dropdown-ajax",
661
+ ];
662
+ if (relationTypes.includes(field.type)) {
663
+ let relationLength = Array.isArray(
655
664
  field.relation
656
665
  )
657
666
  ? field.relation.length
658
667
  : 1;
668
+ let tempObj = data;
669
+
659
670
  for (let i = 0; i < relationLength; i++) {
660
671
  if (tempObj[field.relation[i]]) {
661
672
  tempObj =
@@ -663,127 +674,56 @@ function Form(props) {
663
674
  }
664
675
  }
665
676
 
666
- if (
667
- tempObj !== undefined &&
668
- tempObj !== null
669
- ) {
670
- let labelValue;
671
-
672
- if (Array.isArray(field.relationName)) {
673
- labelValue = field.relationName.map(
674
- (name) => `${tempObj[name]} `
675
- );
676
- } else {
677
- labelValue =
678
- tempObj[field.relationName];
679
- }
680
-
681
- tempRes = {
682
- value: tempObj.id,
683
- label: labelValue,
684
- };
685
- }
677
+ let labelValue;
686
678
 
687
- _formData[field.id] = tempRes;
688
- }
689
- } else {
690
- if (
691
- field &&
692
- ["date", "datetime", "time"].includes(
693
- field.type
694
- )
695
- ) {
696
- if (
697
- result[item] === null ||
698
- result[item] === ""
699
- ) {
700
- _formData[item] = "";
679
+ if (Array.isArray(field.relationName)) {
680
+ labelValue = field.relationName.map(
681
+ (name) => `${tempObj[name]} `
682
+ );
701
683
  } else {
702
- const momentDate = moment(result[item]);
703
- _formData[item] = momentDate.isValid()
704
- ? momentDate.toDate()
705
- : null;
684
+ labelValue =
685
+ tempObj[field.relationName];
706
686
  }
707
- } else if (
708
- field &&
709
- field.hasOwnProperty("relation")
710
- ) {
711
- const relationTypes = [
712
- "multi-dropdown",
713
- "multi-dropdown-ajax",
714
- "async-dropdown-ajax",
715
- ];
716
- if (relationTypes.includes(field.type)) {
717
- let relationLength = Array.isArray(
718
- field.relation
719
- )
720
- ? field.relation.length
721
- : 1;
722
- let tempObj = result;
723
-
724
- for (
725
- let i = 0;
726
- i < relationLength;
727
- i++
728
- ) {
729
- if (tempObj[field.relation[i]]) {
730
- tempObj =
731
- tempObj[field.relation[i]];
732
- }
733
- }
734
-
735
- let labelValue;
736
-
737
- if (Array.isArray(field.relationName)) {
738
- labelValue = field.relationName.map(
739
- (name) => `${tempObj[name]} `
740
- );
741
- } else {
742
- labelValue =
743
- tempObj[field.relationName];
744
- }
745
687
 
746
- tempRes =
747
- tempObj !== undefined &&
748
- tempObj !== null
749
- ? {
750
- value: tempObj.id,
751
- label: labelValue,
752
- }
753
- : {};
688
+ tempRes =
689
+ tempObj !== undefined &&
690
+ tempObj !== null
691
+ ? {
692
+ value: tempObj.id,
693
+ label: labelValue,
694
+ }
695
+ : {};
754
696
 
755
- tempResKey = field.id;
756
- }
757
- } else {
758
- _formData[item] = result[item];
697
+ tempResKey = field.id;
759
698
  }
699
+ } else {
700
+ updatedFormData[item] = data[item];
760
701
  }
702
+ }
761
703
 
762
- if (
763
- item === tempResKey &&
764
- tempRes &&
765
- tempRes.hasOwnProperty("value") &&
766
- tempRes.hasOwnProperty("label")
767
- ) {
768
- _formData[item] = tempRes;
769
- }
770
- });
704
+ if (
705
+ item === tempResKey &&
706
+ tempRes &&
707
+ tempRes.hasOwnProperty("value") &&
708
+ tempRes.hasOwnProperty("label")
709
+ ) {
710
+ updatedFormData[item] = tempRes;
711
+ }
712
+ });
771
713
 
772
- setFormData((prevState) => ({
773
- ...prevState,
774
- ..._formData,
775
- }));
714
+ setFormData(updatedFormData);
776
715
 
777
- setFetchTrigger(!fetchTrigger);
778
- }
779
- );
716
+ setFetchTrigger(!fetchTrigger);
717
+ } catch (error) {
718
+ // Handle error here
719
+ toast.error("Failed to fetch data:", error);
720
+ }
721
+ } else {
722
+ setFormData(_formData);
780
723
  }
781
- } else {
782
- setFormData((prevState) => ({
783
- ...prevState,
784
- ..._formData,
785
- }));
786
- }
724
+ };
725
+
726
+ fetchData();
787
727
  }, []);
788
728
 
789
729
  useEffect(() => {
@@ -846,88 +786,58 @@ function Form(props) {
846
786
  <div className="modal__content">
847
787
  <div className="formcontainer">
848
788
  <form className="modalForm" onSubmit={handleSubmit}>
849
- {formSettings.fields.map((item, index) =>
850
- item.hasOwnProperty("hide") === false ? (
851
- item.hasOwnProperty("createOnly") &&
852
- item.createOnly === true &&
853
- formType === "update" ? null : (
854
- <Field
855
- settings={item}
856
- key={
857
- index +
858
- "-fields-" +
859
- (item.hasOwnProperty("key")
860
- ? item.id + "-" + item.key
861
- : item.id)
862
- }
863
- inputValue={
864
- item.hasOwnProperty("key")
865
- ? formData[item.key]
866
- : formData[item.id]
867
- }
868
- inputClass={inputClass}
869
- onChange={handleChange}
870
- onChangeDate={handleChangeDate}
871
- onChangeSelect={handleChangeSelect}
872
- onChangeRicheditor={
873
- handleChangeRicheditor
874
- }
875
- onChangeToggle={handleChangeToggle}
876
- onChangeNumberFormat={
877
- handleChangeNumberFormat
878
- }
879
- autocompleteCallback={
880
- autocompleteSelect
881
- }
882
- childDropdownCallback={
883
- childDropdownCallback
884
- }
885
- setFormData={setFormData}
886
- style={style}
887
- />
888
- )
889
- ) : item.hide === false ? (
789
+ {formSettings.fields.map((item, index) => {
790
+ if (
791
+ item.hasOwnProperty("hide") &&
792
+ item.hide === true
793
+ ) {
794
+ return null;
795
+ }
796
+ if (
890
797
  item.hasOwnProperty("createOnly") &&
891
798
  item.createOnly === true &&
892
- formType === "update" ? null : (
893
- <Field
894
- settings={item}
895
- key={
896
- index +
897
- "-fields-" +
898
- (item.hasOwnProperty("key")
899
- ? item.id + "-" + item.key
900
- : item.id)
901
- }
902
- inputValue={
903
- item.hasOwnProperty("key")
904
- ? formData[item.key]
905
- : formData[item.id]
906
- }
907
- inputClass={inputClass}
908
- onChange={handleChange}
909
- onChangeDate={handleChangeDate}
910
- onChangeSelect={handleChangeSelect}
911
- onChangeRicheditor={
912
- handleChangeRicheditor
913
- }
914
- onChangeToggle={handleChangeToggle}
915
- onChangeNumberFormat={
916
- handleChangeNumberFormat
917
- }
918
- autocompleteCallback={
919
- autocompleteSelect
920
- }
921
- childDropdownCallback={
922
- childDropdownCallback
923
- }
924
- uploadProgress={uploadProgress}
925
- setFormData={setFormData}
926
- style={style}
927
- />
928
- )
929
- ) : null
930
- )}
799
+ formType === "update"
800
+ ) {
801
+ return null;
802
+ }
803
+ return (
804
+ <Field
805
+ settings={item}
806
+ key={
807
+ index +
808
+ "-fields-" +
809
+ (item.hasOwnProperty("key")
810
+ ? item.id + "-" + item.key
811
+ : item.id)
812
+ }
813
+ inputValue={
814
+ item.hasOwnProperty("key")
815
+ ? formData[item.key]
816
+ : formData[item.id]
817
+ }
818
+ inputClass={inputClass}
819
+ onChange={handleChange}
820
+ onChangeDate={handleChangeDate}
821
+ onChangeSelect={handleChangeSelect}
822
+ onChangeRicheditor={
823
+ handleChangeRicheditor
824
+ }
825
+ onChangeToggle={handleChangeToggle}
826
+ onChangeNumberFormat={
827
+ handleChangeNumberFormat
828
+ }
829
+ autocompleteCallback={
830
+ autocompleteSelect
831
+ }
832
+ childDropdownCallback={
833
+ childDropdownCallback
834
+ }
835
+ uploadProgress={uploadProgress}
836
+ setFormData={setFormData}
837
+ style={style}
838
+ />
839
+ );
840
+ })}
931
841
  <div className="formItem fwItem">
932
842
  <motion.div
933
843
  className="progress__bar"