@visns-studio/visns-components 3.7.4 → 3.7.5
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.
package/components/crm/Field.jsx
CHANGED
|
@@ -397,7 +397,6 @@ function Field({
|
|
|
397
397
|
</div>
|
|
398
398
|
) : null;
|
|
399
399
|
case 'text':
|
|
400
|
-
case 'json':
|
|
401
400
|
case 'password':
|
|
402
401
|
return (
|
|
403
402
|
<input
|
|
@@ -414,6 +413,23 @@ function Field({
|
|
|
414
413
|
autoComplete="off"
|
|
415
414
|
/>
|
|
416
415
|
);
|
|
416
|
+
case 'json':
|
|
417
|
+
return (
|
|
418
|
+
<input
|
|
419
|
+
type={settings.type}
|
|
420
|
+
data-name={settings.id}
|
|
421
|
+
data-parent={settings.parent}
|
|
422
|
+
className={inputClass[settings.id]}
|
|
423
|
+
placeholder=" "
|
|
424
|
+
onChange={onChange}
|
|
425
|
+
value={
|
|
426
|
+
inputValue && inputValue !== 'null'
|
|
427
|
+
? inputValue
|
|
428
|
+
: ''
|
|
429
|
+
}
|
|
430
|
+
autoComplete="off"
|
|
431
|
+
/>
|
|
432
|
+
);
|
|
417
433
|
case 'html5_date':
|
|
418
434
|
return (
|
|
419
435
|
<input
|
package/components/crm/Form.jsx
CHANGED
|
@@ -56,6 +56,7 @@ function Form({
|
|
|
56
56
|
const handleChange = (e) => {
|
|
57
57
|
const id = e.target.dataset.jsonkey || e.target.dataset.name;
|
|
58
58
|
const value = e.target.value;
|
|
59
|
+
const parent = e.target.dataset.parent ? e.target.dataset.parent : '';
|
|
59
60
|
let _dataset = {};
|
|
60
61
|
|
|
61
62
|
if (e.target[e.target.selectedIndex]) {
|
|
@@ -71,10 +72,20 @@ function Form({
|
|
|
71
72
|
: e.target.files[0],
|
|
72
73
|
}));
|
|
73
74
|
} else {
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
75
|
+
if (parent) {
|
|
76
|
+
setFormData((prevState) => ({
|
|
77
|
+
...prevState,
|
|
78
|
+
[parent]: {
|
|
79
|
+
...prevState[parent],
|
|
80
|
+
[id]: value,
|
|
81
|
+
},
|
|
82
|
+
}));
|
|
83
|
+
} else {
|
|
84
|
+
setFormData((prevState) => ({
|
|
85
|
+
...prevState,
|
|
86
|
+
[id]: value,
|
|
87
|
+
}));
|
|
88
|
+
}
|
|
78
89
|
}
|
|
79
90
|
|
|
80
91
|
if (!_.isEmpty(_dataset)) {
|
|
@@ -132,6 +143,10 @@ function Form({
|
|
|
132
143
|
}
|
|
133
144
|
};
|
|
134
145
|
|
|
146
|
+
useEffect(() => {
|
|
147
|
+
console.info(formData);
|
|
148
|
+
}, [formData]);
|
|
149
|
+
|
|
135
150
|
const handleChangeCheckbox = (e) => {
|
|
136
151
|
const { checked, name, value } = e.target;
|
|
137
152
|
|
|
@@ -388,6 +403,22 @@ function Form({
|
|
|
388
403
|
return { columns, dataSource };
|
|
389
404
|
};
|
|
390
405
|
|
|
406
|
+
const renderInputValue = (i, f) => {
|
|
407
|
+
let value = '';
|
|
408
|
+
|
|
409
|
+
if (i.hasOwnProperty('parent') && i.parent) {
|
|
410
|
+
if (f[i.parent]) {
|
|
411
|
+
value = i.hasOwnProperty('key')
|
|
412
|
+
? f[i.parent][i.key]
|
|
413
|
+
: f[i.parent][i.id];
|
|
414
|
+
}
|
|
415
|
+
} else {
|
|
416
|
+
value = i.hasOwnProperty('key') ? f[i.key] : f[i.id];
|
|
417
|
+
}
|
|
418
|
+
|
|
419
|
+
return value;
|
|
420
|
+
};
|
|
421
|
+
|
|
391
422
|
// Helper function to transform snake_case to Title Case
|
|
392
423
|
const transformKey = (key) => {
|
|
393
424
|
return (
|
|
@@ -731,18 +762,26 @@ function Form({
|
|
|
731
762
|
|
|
732
763
|
if (formSettings.fields.length > 0) {
|
|
733
764
|
formSettings.fields.forEach((item) => {
|
|
734
|
-
const { id, value, type } = item;
|
|
735
|
-
|
|
736
|
-
|
|
737
|
-
|
|
738
|
-
|
|
739
|
-
|
|
740
|
-
|
|
765
|
+
const { id, value, type, parent } = item;
|
|
766
|
+
|
|
767
|
+
if (parent) {
|
|
768
|
+
_formData[parent] = {
|
|
769
|
+
..._formData[parent],
|
|
770
|
+
[id]: value ? value : '',
|
|
771
|
+
};
|
|
772
|
+
} else {
|
|
773
|
+
if (value !== '') {
|
|
774
|
+
if (['date', 'datetime', 'time'].includes(type)) {
|
|
775
|
+
_formData[id] =
|
|
776
|
+
value instanceof Date
|
|
777
|
+
? value
|
|
778
|
+
: moment(value).toDate();
|
|
779
|
+
} else {
|
|
780
|
+
_formData[id] = value;
|
|
781
|
+
}
|
|
741
782
|
} else {
|
|
742
|
-
_formData[id] =
|
|
783
|
+
_formData[id] = '';
|
|
743
784
|
}
|
|
744
|
-
} else {
|
|
745
|
-
_formData[id] = '';
|
|
746
785
|
}
|
|
747
786
|
});
|
|
748
787
|
}
|
|
@@ -899,6 +938,15 @@ function Form({
|
|
|
899
938
|
updatedFormData[field.id] = tempRes;
|
|
900
939
|
}
|
|
901
940
|
|
|
941
|
+
if (field && field.hasOwnProperty('parent')) {
|
|
942
|
+
let tempObj = data;
|
|
943
|
+
let tempRes = '';
|
|
944
|
+
|
|
945
|
+
tempRes = tempObj[field.parent][field.id];
|
|
946
|
+
|
|
947
|
+
updatedFormData[field.parent][field.id] = tempRes;
|
|
948
|
+
}
|
|
949
|
+
|
|
902
950
|
if (item.includes('.')) {
|
|
903
951
|
// Split the item string by the dot
|
|
904
952
|
let keys = item.split('.');
|
|
@@ -1106,11 +1154,10 @@ function Form({
|
|
|
1106
1154
|
fetchData={fetchData}
|
|
1107
1155
|
formData={formData}
|
|
1108
1156
|
inputClass={inputClass}
|
|
1109
|
-
inputValue={
|
|
1110
|
-
item
|
|
1111
|
-
|
|
1112
|
-
|
|
1113
|
-
}
|
|
1157
|
+
inputValue={renderInputValue(
|
|
1158
|
+
item,
|
|
1159
|
+
formData
|
|
1160
|
+
)}
|
|
1114
1161
|
key={
|
|
1115
1162
|
index +
|
|
1116
1163
|
'-fields-' +
|
|
@@ -1226,11 +1273,10 @@ function Form({
|
|
|
1226
1273
|
fetchData={fetchData}
|
|
1227
1274
|
formData={formData}
|
|
1228
1275
|
inputClass={inputClass}
|
|
1229
|
-
inputValue={
|
|
1230
|
-
item
|
|
1231
|
-
|
|
1232
|
-
|
|
1233
|
-
}
|
|
1276
|
+
inputValue={renderInputValue(
|
|
1277
|
+
item,
|
|
1278
|
+
formData
|
|
1279
|
+
)}
|
|
1234
1280
|
key={
|
|
1235
1281
|
index +
|
|
1236
1282
|
'-fields-' +
|
|
@@ -34,7 +34,13 @@ const updateField = (fields, name, value) => {
|
|
|
34
34
|
const renderValue = (field, data) => {
|
|
35
35
|
switch (field.type) {
|
|
36
36
|
case 'datetime':
|
|
37
|
+
return field.value && moment(field.value).isValid()
|
|
38
|
+
? moment(field.value).toDate()
|
|
39
|
+
: '';
|
|
37
40
|
case 'date':
|
|
41
|
+
return field.value && moment(field.value).isValid()
|
|
42
|
+
? moment(field.value).toDate()
|
|
43
|
+
: '';
|
|
38
44
|
case 'dynamicdata':
|
|
39
45
|
if (field.dynamicfield && typeof field.dynamicfield === 'string') {
|
|
40
46
|
// Split the dynamicfield string into table and key parts using the "::" delimiter
|
|
@@ -62,6 +68,7 @@ const renderValue = (field, data) => {
|
|
|
62
68
|
? moment(field.value).toDate()
|
|
63
69
|
: '';
|
|
64
70
|
default:
|
|
71
|
+
console.info(field, data);
|
|
65
72
|
return field.value || '';
|
|
66
73
|
}
|
|
67
74
|
};
|
|
@@ -194,6 +201,16 @@ const GenericDynamic = ({
|
|
|
194
201
|
setActiveForm((prevState) => updateField(prevState, id, value));
|
|
195
202
|
};
|
|
196
203
|
|
|
204
|
+
const handleChangeToggle = (e) => {
|
|
205
|
+
if (!e) {
|
|
206
|
+
return;
|
|
207
|
+
}
|
|
208
|
+
|
|
209
|
+
const { name, checked } = e.target;
|
|
210
|
+
|
|
211
|
+
setActiveForm((prevState) => updateField(prevState, name, checked));
|
|
212
|
+
};
|
|
213
|
+
|
|
197
214
|
const handleFileDownload = async (d) => {
|
|
198
215
|
const toastId = toast.loading('Downloading file...'); // Show loading toast
|
|
199
216
|
try {
|
|
@@ -423,7 +440,9 @@ const GenericDynamic = ({
|
|
|
423
440
|
}
|
|
424
441
|
} else {
|
|
425
442
|
setActiveForm([]);
|
|
426
|
-
|
|
443
|
+
if (multiple && templateStatus) {
|
|
444
|
+
handleAddNewForm();
|
|
445
|
+
}
|
|
427
446
|
}
|
|
428
447
|
}, [data, type]);
|
|
429
448
|
|
|
@@ -602,10 +621,12 @@ const GenericDynamic = ({
|
|
|
602
621
|
onChangeDate={
|
|
603
622
|
handleChangeDate
|
|
604
623
|
}
|
|
624
|
+
onChangeToggle={
|
|
625
|
+
handleChangeToggle
|
|
626
|
+
}
|
|
605
627
|
onFileDownload={
|
|
606
628
|
handleFileDownload
|
|
607
629
|
}
|
|
608
|
-
// Omitted other props for brevity
|
|
609
630
|
style={{}}
|
|
610
631
|
/>
|
|
611
632
|
)
|
|
@@ -634,10 +655,12 @@ const GenericDynamic = ({
|
|
|
634
655
|
onChangeDate={
|
|
635
656
|
handleChangeDate
|
|
636
657
|
}
|
|
658
|
+
onChangeToggle={
|
|
659
|
+
handleChangeToggle
|
|
660
|
+
}
|
|
637
661
|
onFileDownload={
|
|
638
662
|
handleFileDownload
|
|
639
663
|
}
|
|
640
|
-
// Omitted other props for brevity
|
|
641
664
|
style={{}}
|
|
642
665
|
/>
|
|
643
666
|
)
|
|
@@ -245,7 +245,7 @@ function GenericFormBuilder({ setting, urlParam, userProfile }) {
|
|
|
245
245
|
}
|
|
246
246
|
|
|
247
247
|
// Modify Validation for Label and Description based on Type
|
|
248
|
-
if (field.type === 'plaintext'
|
|
248
|
+
if (field.type === 'plaintext') {
|
|
249
249
|
// For plaintext or plaintextheading, description is required
|
|
250
250
|
if (!field.description || field.description === '') {
|
|
251
251
|
errors.push('Please enter a description for the field.');
|
package/package.json
CHANGED