@visns-studio/visns-components 1.7.6 → 1.8.1

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 +22 -24
  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 +348 -440
  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,7 +312,7 @@ 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
318
  if (formData[item.id] === "") {
@@ -339,7 +331,6 @@ function Form(props) {
339
331
  item.label +
340
332
  " is a required field.<br/>";
341
333
  }
342
-
343
334
  _inputClass[item.id] = "inputError";
344
335
  }
345
336
  } else {
@@ -360,7 +351,6 @@ function Form(props) {
360
351
  ) {
361
352
  _inputClass[item.required_check] = "";
362
353
  }
363
-
364
354
  _inputClass[item.id] = "";
365
355
  }
366
356
  } else {
@@ -378,11 +368,11 @@ function Form(props) {
378
368
  " is a required field.<br/>"
379
369
  )
380
370
  ) {
371
+ console.info(item.label, item.id, formData);
381
372
  validation +=
382
373
  item.label +
383
374
  " is a required field.<br/>";
384
375
  }
385
-
386
376
  _inputClass[item.id] = "inputError";
387
377
  } else {
388
378
  _inputClass[item.id] = "";
@@ -400,8 +390,8 @@ function Form(props) {
400
390
  if (validation !== "") {
401
391
  toast.error(<div>{parse(validation)}</div>);
402
392
  } else {
403
- let url;
404
- let method;
393
+ let url = "";
394
+ let method = "";
405
395
  let fileUpload = false;
406
396
  let fileKey = "";
407
397
 
@@ -425,36 +415,23 @@ function Form(props) {
425
415
  method = "DELETE";
426
416
  break;
427
417
  default:
428
- url = "";
429
- method = "";
430
418
  break;
431
419
  }
432
420
 
433
421
  if (!_.isEmpty(formData)) {
434
422
  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
- }
423
+ if (
424
+ formData[item] !== undefined &&
425
+ (item === "file" ||
426
+ (formData[item] instanceof File &&
427
+ formData[item] !== null))
428
+ ) {
429
+ fileUpload = true;
430
+ fileKey = item;
448
431
  }
449
432
  });
450
433
  }
451
434
 
452
- console.info(
453
- fileUpload,
454
- formData[fileKey],
455
- formData[fileKey] instanceof File
456
- );
457
-
458
435
  if (
459
436
  fileUpload === true &&
460
437
  formData[fileKey] !== null &&
@@ -476,37 +453,9 @@ function Form(props) {
476
453
  if (result.error === "") {
477
454
  fetchTable();
478
455
  closeModal();
479
-
480
456
  toast.success(
481
457
  "Entry successfully saved into the system."
482
458
  );
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
459
  } else {
511
460
  toast.error(
512
461
  result.error !== undefined ? result.error : ""
@@ -519,37 +468,9 @@ function Form(props) {
519
468
  if (result.error === "") {
520
469
  fetchTable();
521
470
  closeModal();
522
-
523
471
  toast.success(
524
472
  "Entry successfully saved into the system."
525
473
  );
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
474
  } else {
554
475
  toast.error(
555
476
  result.error !== undefined ? result.error : ""
@@ -561,101 +482,189 @@ function Form(props) {
561
482
  };
562
483
 
563
484
  useEffect(() => {
564
- let _formData = formData;
565
- let _date = false;
485
+ let _formData = { ...formData }; // Create a new object instead of assigning a reference
566
486
 
567
487
  if (formSettings.fields.length > 0) {
568
488
  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();
489
+ const { id, value, type } = item;
490
+ if (value !== "") {
491
+ if (["date", "datetime", "time"].includes(type)) {
492
+ _formData[id] =
493
+ value instanceof Date
494
+ ? value
495
+ : moment(value).toDate();
579
496
  } else {
580
- _formData[item.id] = item.value;
497
+ _formData[id] = value;
581
498
  }
582
499
  } else {
583
- _formData[item.id] = "";
500
+ _formData[id] = "";
584
501
  }
585
502
  });
586
503
  }
587
504
 
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
- }
505
+ const fetchData = async () => {
506
+ if (formType !== "create" && columnId > 0) {
507
+ try {
508
+ const result = await CustomFetch(
509
+ `${formSettings.url}/${columnId}`,
510
+ "GET",
511
+ {}
512
+ );
513
+ const data = result.hasOwnProperty("data")
514
+ ? result.data
515
+ : result;
516
+
517
+ const updatedFormData = { ..._formData }; // Create a new object to update properties
518
+
519
+ Object.keys(updatedFormData).forEach((item) => {
520
+ let tempRes = "";
521
+ let tempResKey = "";
522
+ let field = formSettings.fields.find(
523
+ (f) => f.id === item
524
+ );
638
525
 
639
- _formData[item] = tempRes;
640
- }
526
+ if (data[item] === undefined) {
527
+ if (field && field.hasOwnProperty("relation")) {
528
+ let tempRes = data[field.relation];
641
529
 
642
530
  if (
643
- field &&
644
- field.hasOwnProperty("relation") &&
645
531
  [
646
532
  "multi-dropdown",
647
533
  "multi-dropdown-ajax",
648
534
  "async-dropdown-ajax",
649
- ].includes(field.type)
535
+ ].includes(field.type) &&
536
+ Array.isArray(tempRes)
650
537
  ) {
651
- let tempObj = result;
652
- let tempRes = {};
538
+ tempRes = tempRes.map((a) => ({
539
+ value: a.name,
540
+ label: a.name,
541
+ }));
542
+ }
543
+
544
+ if (tempRes) {
545
+ const relationFrom = field.hasOwnProperty(
546
+ "relation_from"
547
+ )
548
+ ? field.relation_from
549
+ : field.id;
550
+ tempRes = Array.isArray(tempRes)
551
+ ? tempRes[0][relationFrom]
552
+ : tempRes[relationFrom];
553
+ } else {
554
+ tempRes = "";
555
+ }
556
+
557
+ updatedFormData[item] = tempRes;
558
+ }
559
+
560
+ if (
561
+ field &&
562
+ field.hasOwnProperty("relation") &&
563
+ [
564
+ "multi-dropdown",
565
+ "multi-dropdown-ajax",
566
+ "async-dropdown-ajax",
567
+ ].includes(field.type)
568
+ ) {
569
+ let tempObj = data;
570
+ let tempRes = {};
653
571
 
654
- const relationLength = Array.isArray(
572
+ const relationLength = Array.isArray(
573
+ field.relation
574
+ )
575
+ ? field.relation.length
576
+ : 1;
577
+ for (let i = 0; i < relationLength; i++) {
578
+ tempObj = tempObj[field.relation[i]];
579
+ }
580
+
581
+ if (tempObj !== undefined && tempObj !== null) {
582
+ let labelValue;
583
+
584
+ if (Array.isArray(field.relationName)) {
585
+ labelValue = field.relationName.map(
586
+ (name) => `${tempObj[name]} `
587
+ );
588
+ } else {
589
+ labelValue =
590
+ tempObj[field.relationName];
591
+ }
592
+
593
+ tempRes = {
594
+ value: tempObj.id,
595
+ label: labelValue,
596
+ };
597
+ }
598
+
599
+ updatedFormData[field.id] = tempRes;
600
+ }
601
+
602
+ if (
603
+ field &&
604
+ field.hasOwnProperty("relation") &&
605
+ ["address", "text"].includes(field.type)
606
+ ) {
607
+ let tempObj = data;
608
+ let tempRes = "";
609
+
610
+ const relationLength = Array.isArray(
611
+ field.relation
612
+ )
613
+ ? field.relation.length
614
+ : 1;
615
+ for (let i = 0; i < relationLength; i++) {
616
+ tempObj = tempObj[field.relation[i]];
617
+ }
618
+
619
+ if (tempObj !== undefined && tempObj !== null) {
620
+ let labelValue;
621
+
622
+ if (Array.isArray(field.relationName)) {
623
+ labelValue = field.relationName.map(
624
+ (name) => `${tempObj[name]} `
625
+ );
626
+ } else {
627
+ labelValue =
628
+ tempObj[field.relationName];
629
+ }
630
+
631
+ tempRes = labelValue;
632
+ }
633
+
634
+ updatedFormData[field.id] = tempRes;
635
+ }
636
+ } else {
637
+ if (
638
+ field &&
639
+ ["date", "datetime", "time"].includes(
640
+ field.type
641
+ )
642
+ ) {
643
+ if (data[item] === null || data[item] === "") {
644
+ updatedFormData[item] = "";
645
+ } else {
646
+ const momentDate = moment(data[item]);
647
+ updatedFormData[item] = momentDate.isValid()
648
+ ? momentDate.toDate()
649
+ : null;
650
+ }
651
+ } else if (
652
+ field &&
653
+ field.hasOwnProperty("relation")
654
+ ) {
655
+ const relationTypes = [
656
+ "multi-dropdown",
657
+ "multi-dropdown-ajax",
658
+ "async-dropdown-ajax",
659
+ ];
660
+ if (relationTypes.includes(field.type)) {
661
+ let relationLength = Array.isArray(
655
662
  field.relation
656
663
  )
657
664
  ? field.relation.length
658
665
  : 1;
666
+ let tempObj = data;
667
+
659
668
  for (let i = 0; i < relationLength; i++) {
660
669
  if (tempObj[field.relation[i]]) {
661
670
  tempObj =
@@ -663,127 +672,56 @@ function Form(props) {
663
672
  }
664
673
  }
665
674
 
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
- }
675
+ let labelValue;
686
676
 
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] = "";
677
+ if (Array.isArray(field.relationName)) {
678
+ labelValue = field.relationName.map(
679
+ (name) => `${tempObj[name]} `
680
+ );
701
681
  } else {
702
- const momentDate = moment(result[item]);
703
- _formData[item] = momentDate.isValid()
704
- ? momentDate.toDate()
705
- : null;
682
+ labelValue =
683
+ tempObj[field.relationName];
706
684
  }
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
685
 
746
- tempRes =
747
- tempObj !== undefined &&
748
- tempObj !== null
749
- ? {
750
- value: tempObj.id,
751
- label: labelValue,
752
- }
753
- : {};
686
+ tempRes =
687
+ tempObj !== undefined &&
688
+ tempObj !== null
689
+ ? {
690
+ value: tempObj.id,
691
+ label: labelValue,
692
+ }
693
+ : {};
754
694
 
755
- tempResKey = field.id;
756
- }
757
- } else {
758
- _formData[item] = result[item];
695
+ tempResKey = field.id;
759
696
  }
697
+ } else {
698
+ updatedFormData[item] = data[item];
760
699
  }
700
+ }
761
701
 
762
- if (
763
- item === tempResKey &&
764
- tempRes &&
765
- tempRes.hasOwnProperty("value") &&
766
- tempRes.hasOwnProperty("label")
767
- ) {
768
- _formData[item] = tempRes;
769
- }
770
- });
702
+ if (
703
+ item === tempResKey &&
704
+ tempRes &&
705
+ tempRes.hasOwnProperty("value") &&
706
+ tempRes.hasOwnProperty("label")
707
+ ) {
708
+ updatedFormData[item] = tempRes;
709
+ }
710
+ });
771
711
 
772
- setFormData((prevState) => ({
773
- ...prevState,
774
- ..._formData,
775
- }));
712
+ setFormData(updatedFormData);
776
713
 
777
- setFetchTrigger(!fetchTrigger);
778
- }
779
- );
714
+ setFetchTrigger(!fetchTrigger);
715
+ } catch (error) {
716
+ // Handle error here
717
+ toast.error("Failed to fetch data:", error);
718
+ }
719
+ } else {
720
+ setFormData(_formData);
780
721
  }
781
- } else {
782
- setFormData((prevState) => ({
783
- ...prevState,
784
- ..._formData,
785
- }));
786
- }
722
+ };
723
+
724
+ fetchData();
787
725
  }, []);
788
726
 
789
727
  useEffect(() => {
@@ -846,88 +784,58 @@ function Form(props) {
846
784
  <div className="modal__content">
847
785
  <div className="formcontainer">
848
786
  <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 ? (
787
+ {formSettings.fields.map((item, index) => {
788
+ if (
789
+ item.hasOwnProperty("hide") &&
790
+ item.hide === true
791
+ ) {
792
+ return null;
793
+ }
794
+ if (
890
795
  item.hasOwnProperty("createOnly") &&
891
796
  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
- )}
797
+ formType === "update"
798
+ ) {
799
+ return null;
800
+ }
801
+ return (
802
+ <Field
803
+ settings={item}
804
+ key={
805
+ index +
806
+ "-fields-" +
807
+ (item.hasOwnProperty("key")
808
+ ? item.id + "-" + item.key
809
+ : item.id)
810
+ }
811
+ inputValue={
812
+ item.hasOwnProperty("key")
813
+ ? formData[item.key]
814
+ : formData[item.id]
815
+ }
816
+ inputClass={inputClass}
817
+ onChange={handleChange}
818
+ onChangeDate={handleChangeDate}
819
+ onChangeSelect={handleChangeSelect}
820
+ onChangeRicheditor={
821
+ handleChangeRicheditor
822
+ }
823
+ onChangeToggle={handleChangeToggle}
824
+ onChangeNumberFormat={
825
+ handleChangeNumberFormat
826
+ }
827
+ autocompleteCallback={
828
+ autocompleteSelect
829
+ }
830
+ childDropdownCallback={
831
+ childDropdownCallback
832
+ }
833
+ uploadProgress={uploadProgress}
834
+ setFormData={setFormData}
835
+ style={style}
836
+ />
837
+ );
838
+ })}
931
839
  <div className="formItem fwItem">
932
840
  <motion.div
933
841
  className="progress__bar"