datasync-dynamic-form 1.1.2 → 1.1.3
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/dist/components/DsDynamicForm.js +3 -64
- package/package.json +1 -1
- package/dist/index.css +0 -23
|
@@ -63,12 +63,10 @@ class DsDynamicForm extends _react.Component {
|
|
|
63
63
|
// Typical usage (don't forget to compare props):
|
|
64
64
|
if (this.props.form !== prevProps.form) {
|
|
65
65
|
//Lookup field props has changed
|
|
66
|
-
if (globals.parameters.debugging) console.log("09/07:componentDidUpdate -> props.form:has changed", this.props.form);
|
|
67
66
|
this.clearForm();
|
|
68
67
|
}
|
|
69
68
|
if (this.props.data_blob !== prevProps.data_blob) {
|
|
70
69
|
//Lookup field props has changed
|
|
71
|
-
if (globals.parameters.debugging) console.log("09/07:componentDidUpdate -> props.data_blob.data_tier:has changed", this.props.data_blob.data_tier);
|
|
72
70
|
this.clearForm();
|
|
73
71
|
}
|
|
74
72
|
}
|
|
@@ -77,9 +75,6 @@ class DsDynamicForm extends _react.Component {
|
|
|
77
75
|
* Prototype : clearForm
|
|
78
76
|
*/
|
|
79
77
|
clearForm = () => {
|
|
80
|
-
console.log("28:ClearForm");
|
|
81
|
-
console.log("28:this.local_data_blob.data_tier INITIAL ->", this.local_data_blob && this.local_data_blob.data_tier ? this.local_data_blob.data_tier : "this.local_data_blob.data_tier not defined");
|
|
82
|
-
console.log("28:this.props.data_blob.data_tier ->", this.props.data_blob && this.props.data_blob.data_tier ? this.props.data_blob.data_tier : "props data_blob not set");
|
|
83
78
|
this.setState({
|
|
84
79
|
fieldError: [],
|
|
85
80
|
form: {},
|
|
@@ -88,7 +83,6 @@ class DsDynamicForm extends _react.Component {
|
|
|
88
83
|
},
|
|
89
84
|
//Clear forced
|
|
90
85
|
() => {
|
|
91
|
-
if (globals.parameters.debugging) console.log("27:DynamicForm3Tiers2 state cleansed 2:", this.state);
|
|
92
86
|
this.setState({
|
|
93
87
|
form: this.props.form,
|
|
94
88
|
fieldError: []
|
|
@@ -107,13 +101,10 @@ class DsDynamicForm extends _react.Component {
|
|
|
107
101
|
//Ensure props.foreign_keys is a json object - PMAB on 2025-04-10
|
|
108
102
|
if (this.props.foreign_keys && typeof this.props.foreign_keys !== "object") throw new Error("foreign_keys must be a json object !");
|
|
109
103
|
this.local_data_blob.data_tier = Object.assign(this.props.foreign_keys ? this.props.foreign_keys : {}, duplicate_data_tier);
|
|
110
|
-
console.log("this.local_data_blob.data_tier ->", this.local_data_blob.data_tier);
|
|
111
|
-
console.log("this.props.data_blob.data_tier ->", this.props.data_blob && this.props.data_blob.data_tier ? this.props.data_blob.data_tier : "props data_blob not set");
|
|
112
104
|
};
|
|
113
105
|
getFieldData = fieldName => {
|
|
114
106
|
/** Return data value form field object */
|
|
115
107
|
let nextFieldData = this.local_data_blob.data_tier[fieldName] ? this.local_data_blob.data_tier[fieldName] : "";
|
|
116
|
-
if (globals.parameters.debugging) console.log("getFieldData[", fieldName, "] nextFieldData->", nextFieldData);
|
|
117
108
|
return nextFieldData;
|
|
118
109
|
};
|
|
119
110
|
setFieldData = (fieldName, value) => {
|
|
@@ -121,11 +112,6 @@ class DsDynamicForm extends _react.Component {
|
|
|
121
112
|
|
|
122
113
|
//onFormChange handler return current form value to caller - PMAB on 2025-02-03
|
|
123
114
|
if (this.props.onFormChange) this.props.onFormChange(this.local_data_blob.data_tier);
|
|
124
|
-
if (globals.parameters.debugging) {
|
|
125
|
-
console.log("setFieldData[", fieldName, "] value->", value);
|
|
126
|
-
console.log("setFieldData[", fieldName, "] this.local_data_blob.data_tier ->", this.local_data_blob.data_tier);
|
|
127
|
-
console.log("setFieldData[", fieldName, "] this.data_blob ->", this.local_data_blob);
|
|
128
|
-
}
|
|
129
115
|
};
|
|
130
116
|
getSelectedFieldValues_V1 = pFieldObject => {
|
|
131
117
|
return pFieldObject.selected_values ? pFieldObject.selected_values : "";
|
|
@@ -141,7 +127,7 @@ class DsDynamicForm extends _react.Component {
|
|
|
141
127
|
//Scroll form to first erroneous field
|
|
142
128
|
(0, _datasyncCommonLibrary.WScrollTo)(pFieldObject.name);
|
|
143
129
|
} catch (e) {
|
|
144
|
-
console.
|
|
130
|
+
console.error(`Error caught on ${e}`);
|
|
145
131
|
}
|
|
146
132
|
};
|
|
147
133
|
getFieldError = pFieldObject => {
|
|
@@ -395,7 +381,6 @@ class DsDynamicForm extends _react.Component {
|
|
|
395
381
|
minutes_placeholder: "minutes",
|
|
396
382
|
required: false,
|
|
397
383
|
onChange: timeValuePack => {
|
|
398
|
-
console.log("valuepack in EventForm ==>", timeValuePack);
|
|
399
384
|
this.setState({
|
|
400
385
|
hour: timeValuePack.hour,
|
|
401
386
|
minutes: timeValuePack.minutes
|
|
@@ -436,14 +421,12 @@ class DsDynamicForm extends _react.Component {
|
|
|
436
421
|
while (iCol < this.state.form.Rows[iRow].Cols.length && canSubmit) {
|
|
437
422
|
let ii = 0;
|
|
438
423
|
while (ii < this.state.form.Rows[iRow].Cols[iCol].Fields.length && (canSubmit &= this.checkValidation(this.state.form.Rows[iRow].Cols[iCol].Fields[ii]))) {
|
|
439
|
-
if (globals.parameters.debugging) console.log(`Fields[${ii}]|${this.state.form.Rows[iRow].Cols[iCol].Fields[ii].name}| canSubmit=${canSubmit}`);
|
|
440
424
|
ii++;
|
|
441
425
|
}
|
|
442
426
|
iCol++;
|
|
443
427
|
}
|
|
444
428
|
iRow++;
|
|
445
429
|
}
|
|
446
|
-
if (globals.parameters.debugging) console.log("canSubmit:", canSubmit);
|
|
447
430
|
if (!canSubmit) {
|
|
448
431
|
let err_message = "Le formulaire comporte des erreurs !";
|
|
449
432
|
if (this.props.onFormFailed) this.props.onFormFailed(err_message);else alert(`${err_message}`);
|
|
@@ -495,10 +478,8 @@ class DsDynamicForm extends _react.Component {
|
|
|
495
478
|
let min = pFieldObject.min_length;
|
|
496
479
|
let max = pFieldObject.max_length;
|
|
497
480
|
let fieldValue = this.getFieldData(pFieldObject.name);
|
|
498
|
-
console.log("d3t3:checkValidation fieldValue->", fieldValue);
|
|
499
481
|
let errorsFieldName = `err_${fieldName}`; /** Error data displayed in dedicated error label, beside input field in Form */
|
|
500
482
|
let nextErrors = [];
|
|
501
|
-
if (globals.parameters.debugging) console.log(`d3t:min:${min} - max:${max}`);
|
|
502
483
|
|
|
503
484
|
/** Check basic field validity except combo and radio */
|
|
504
485
|
if (pFieldObject.required && fieldValue.trim().length <= 0) nextErrors.push(`obligatoire`);
|
|
@@ -519,37 +500,15 @@ class DsDynamicForm extends _react.Component {
|
|
|
519
500
|
if (!fieldValue.match(/^(\d{2}\/\d{2}\/\d{4})$/i)) nextErrors.push(`Format de date incorrect !`);
|
|
520
501
|
}
|
|
521
502
|
if (max > 0 && fieldValue.trim().length > max) nextErrors.push(`trop long, ${fieldValue.trim().length - max} caractères en trop.`);
|
|
522
|
-
/* Special validation handlers
|
|
523
|
-
if (parseInt(this.state[fieldName]) !== (this.state.v1 + this.state.v2))
|
|
524
|
-
nextErrors.push(`calcul faux !`)*/
|
|
525
|
-
|
|
526
|
-
if (globals.parameters.debugging) {
|
|
527
|
-
console.log(`d3t:-----------------`);
|
|
528
|
-
console.log(`d3t:fieldName => ${fieldName}`);
|
|
529
|
-
console.log(`d3t:value => ${fieldValue}`);
|
|
530
|
-
console.log(`errorsFieldName => ${errorsFieldName}`);
|
|
531
|
-
console.log(`nextErrors => ${nextErrors}`);
|
|
532
|
-
console.log(`nextErrors.length => ${nextErrors.length}`);
|
|
533
|
-
}
|
|
534
503
|
|
|
535
504
|
//update error field
|
|
536
|
-
if (globals.parameters.debugging) {
|
|
537
|
-
console.log("nextFieldsErrorsArray=>", nextErrors);
|
|
538
|
-
}
|
|
539
505
|
this.setFieldError(pFieldObject, nextErrors.join("/"));
|
|
540
|
-
if (globals.parameters.debugging) {
|
|
541
|
-
console.log(`new fieldError : ${this.getFieldError(pFieldObject)}`);
|
|
542
|
-
}
|
|
543
|
-
|
|
544
|
-
//set change flag
|
|
545
|
-
//nextState.has_changed = true
|
|
546
506
|
|
|
547
507
|
//Return validation predicate
|
|
548
508
|
return nextErrors.length === 0; //returns true if no error occurs
|
|
549
509
|
};
|
|
550
510
|
dynamicInputTextChangeHandler = eventObject => {
|
|
551
511
|
if (eventObject && eventObject.event) eventObject.event.preventDefault();
|
|
552
|
-
if (globals.parameters.debugging) console.log(`d3t:dynamicInputTextChangeHandler eventObject -> `, eventObject);
|
|
553
512
|
this.setFieldData(eventObject.fieldObject.name, eventObject.event.target.value);
|
|
554
513
|
|
|
555
514
|
//Validate field
|
|
@@ -557,13 +516,9 @@ class DsDynamicForm extends _react.Component {
|
|
|
557
516
|
};
|
|
558
517
|
dynamicInputNumericChangeHandler = eventObject => {
|
|
559
518
|
if (eventObject && eventObject.event) eventObject.event.preventDefault();
|
|
560
|
-
if (globals.parameters.debugging) console.log(`d3t:dynamicInputNumericChangeHandler ${eventObject.fieldObject.name} Input field has changed`);
|
|
561
519
|
if (eventObject.event.target.value.length == 0 || !isNaN(eventObject.event.target.value) && !isNaN(parseFloat(eventObject.event.target.value))) this.setFieldData(eventObject.fieldObject.name, eventObject.event.target.value);else {
|
|
562
|
-
if (globals.parameters.debugging) console.
|
|
520
|
+
if (globals.parameters.debugging) console.error(`Value rejected -> ${eventObject.event.target.value}`);
|
|
563
521
|
}
|
|
564
|
-
|
|
565
|
-
//Validate field
|
|
566
|
-
if (globals.parameters.debugging) console.log(`#${eventObject.fieldObject.name} => ${this.getFieldData(eventObject.fieldObject.name)}`);
|
|
567
522
|
this.checkValidation(eventObject.fieldObject);
|
|
568
523
|
};
|
|
569
524
|
convertDate = p_o_day_month_year => {
|
|
@@ -587,11 +542,6 @@ class DsDynamicForm extends _react.Component {
|
|
|
587
542
|
month: 1 + p_oDate.getMonth(),
|
|
588
543
|
year: p_oDate.getFullYear()
|
|
589
544
|
});
|
|
590
|
-
if (globals.parameters.debugging) {
|
|
591
|
-
console.log("p_oDate =>", p_oDate);
|
|
592
|
-
console.log("dateConvertedObject =>", dateConvertedObject);
|
|
593
|
-
console.log("dateConvertedObject.asString =>", dateConvertedObject.asString);
|
|
594
|
-
}
|
|
595
545
|
this.setFieldData(eventObject.fieldObject.name, dateConvertedObject.asString);
|
|
596
546
|
this.setFieldData(eventObject.fieldObject.name_day, dateConvertedObject.asDate.day);
|
|
597
547
|
this.setFieldData(eventObject.fieldObject.name_month, dateConvertedObject.asDate.month);
|
|
@@ -605,12 +555,6 @@ class DsDynamicForm extends _react.Component {
|
|
|
605
555
|
this.setFieldData(eventObject.sub_field_name, eventObject.value);
|
|
606
556
|
//update fulll time field
|
|
607
557
|
this.setFieldData(eventObject.fieldObject.name, this.getFieldData(eventObject.fieldObject.name_hour) + ":" + this.getFieldData(eventObject.fieldObject.name_min));
|
|
608
|
-
if (true) {
|
|
609
|
-
console.clear();
|
|
610
|
-
console.log(eventObject.fieldObject.name_hour, " ->", this.getFieldData(eventObject.fieldObject.name_hour));
|
|
611
|
-
console.log(eventObject.fieldObject.name_min, "->", this.getFieldData(eventObject.fieldObject.name_min));
|
|
612
|
-
console.log(eventObject.fieldObject.name, " ->", this.getFieldData(eventObject.fieldObject.name));
|
|
613
|
-
}
|
|
614
558
|
|
|
615
559
|
//Validate field
|
|
616
560
|
this.checkValidation(eventObject.fieldObject);
|
|
@@ -633,11 +577,6 @@ class DsDynamicForm extends _react.Component {
|
|
|
633
577
|
return /*#__PURE__*/_react.default.createElement(_reactstrap.Col, null, "Error ", err.message);
|
|
634
578
|
}
|
|
635
579
|
};
|
|
636
|
-
migrate_field = (pFieldObject, migrated_value) => {
|
|
637
|
-
//Set data_tier property with former form value
|
|
638
|
-
this.local_data_blob.data_tier[pFieldObject.name] = migrated_value;
|
|
639
|
-
if (globals.parameters.debugging) console.log("09/07:migrate_field -> pFieldObject.name=", pFieldObject.name);
|
|
640
|
-
};
|
|
641
580
|
_fieldRendering = (field, ii) => {
|
|
642
581
|
try {
|
|
643
582
|
//Do not display field if empty in read only mode
|
|
@@ -728,7 +667,7 @@ class DsDynamicForm extends _react.Component {
|
|
|
728
667
|
case "captcha":
|
|
729
668
|
return this._captcha_field(field);
|
|
730
669
|
default:
|
|
731
|
-
console.
|
|
670
|
+
console.error("alert incorrect field type");
|
|
732
671
|
}
|
|
733
672
|
} catch (error) {
|
|
734
673
|
console.error(`_fieldRendering raises "${error}"`);
|
package/package.json
CHANGED
package/dist/index.css
DELETED
|
@@ -1,23 +0,0 @@
|
|
|
1
|
-
.tweet-btn-container{
|
|
2
|
-
margin-top: 30px;
|
|
3
|
-
}
|
|
4
|
-
|
|
5
|
-
.tweet-button{
|
|
6
|
-
display: inline-block;
|
|
7
|
-
text-decoration: none;
|
|
8
|
-
font-size: 0.97rem;
|
|
9
|
-
font-weight: bold;
|
|
10
|
-
color: #333;
|
|
11
|
-
background-color: #eee;
|
|
12
|
-
padding: 17px 35px;
|
|
13
|
-
border-radius: 7px;
|
|
14
|
-
border-block: 1px solid #ccc;
|
|
15
|
-
border-inline: 1px solid #333;
|
|
16
|
-
}
|
|
17
|
-
|
|
18
|
-
.tweet-button:hover{
|
|
19
|
-
text-decoration: none;
|
|
20
|
-
color: #fff;
|
|
21
|
-
background-color: #1a8cd8;
|
|
22
|
-
border-block-color: #1a8cd8;
|
|
23
|
-
}
|