datasync-dynamic-form 1.0.28 → 1.1.0

package/dist/components/DsDynamicForm.js

@@ -338,22 +338,20 @@ class DsDynamicForm extends _react.Component {
       options: ["07", "08", "09", "10", "11", "12", "13", "14", "15", "16", "17", "18", "19", "20", "21", "22"],
       isObject: false,
       displayValue: "key",
-      selectedValues: this.getFieldData(field.name + "__hour") ? this.getFieldData(field.name + "__hour").split(";") : [],
+      selectedValues: this.getFieldData(field.name_hour) ? this.getFieldData(field.name_hour).split(";") : [],
       placeholder: field.placeholder,
       emptyRecordMsg: "",
       onSelect: (selectedList, selectedItem) => {
         this.handle_time_picker({
           fieldObject: field,
-          name: field.name,
-          sub_name: "__hour",
+          sub_field_name: field.name_hour,
           value: selectedList.join(";")
         });
       },
       onRemove: (selectedList, selectedItem) => {
         this.handle_time_picker({
           fieldObject: field,
-          name: field.name,
-          sub_name: "__hour",
+          sub_field_name: field.name_hour,
           value: selectedList.join(";")
         });
       },
@@ -366,22 +364,20 @@ class DsDynamicForm extends _react.Component {
       options: ["00", "15", "20", "25", "30", "35", "40", "45", "50", "55"],
       isObject: false,
       displayValue: "key",
-      selectedValues: this.getFieldData(field.name + "__min") ? this.getFieldData(field.name + "__min").split(";") : [],
+      selectedValues: this.getFieldData(field.name_min) ? this.getFieldData(field.name_min).split(";") : [],
       placeholder: field.placeholder,
       emptyRecordMsg: "",
       onSelect: (selectedList, selectedItem) => {
         this.handle_time_picker({
           fieldObject: field,
-          name: field.name,
-          sub_name: "__min",
+          sub_field_name: field.name_min,
           value: selectedList.join(";")
         });
       },
       onRemove: (selectedList, selectedItem) => {
         this.handle_time_picker({
           fieldObject: field,
-          name: field.name,
-          sub_name: "__min",
+          sub_field_name: field.name_min,
           value: selectedList.join(";")
         });
       },
@@ -427,39 +423,43 @@ class DsDynamicForm extends _react.Component {
 
   /** Form Handlers */
   onClickSubmitFormHandler = async event => {
-    if (event) event.preventDefault();
+    try {
+      if (event) event.preventDefault();
 
-    //Force all fields check    
-    let canSubmit = true;
-    let iRow = 0;
-    while (iRow < this.state.form.Rows.length && canSubmit) {
-      let iCol = 0;
-      while (iCol < this.state.form.Rows[iRow].Cols.length && canSubmit) {
-        let ii = 0;
-        while (ii < this.state.form.Rows[iRow].Cols[iCol].Fields.length && (canSubmit &= this.checkValidation(this.state.form.Rows[iRow].Cols[iCol].Fields[ii]))) {
-          if (globals.parameters.debugging) console.log(`Fields[${ii}]|${this.state.form.Rows[iRow].Cols[iCol].Fields[ii].name}| canSubmit=${canSubmit}`);
-          ii++;
+      //Force all fields check    
+      let canSubmit = true;
+      let iRow = 0;
+      while (iRow < this.state.form.Rows.length && canSubmit) {
+        let iCol = 0;
+        while (iCol < this.state.form.Rows[iRow].Cols.length && canSubmit) {
+          let ii = 0;
+          while (ii < this.state.form.Rows[iRow].Cols[iCol].Fields.length && (canSubmit &= this.checkValidation(this.state.form.Rows[iRow].Cols[iCol].Fields[ii]))) {
+            if (globals.parameters.debugging) console.log(`Fields[${ii}]|${this.state.form.Rows[iRow].Cols[iCol].Fields[ii].name}| canSubmit=${canSubmit}`);
+            ii++;
+          }
+          iCol++;
         }
-        iCol++;
+        iRow++;
+      }
+      if (globals.parameters.debugging) console.log("canSubmit:", canSubmit);
+      if (!canSubmit) {
+        let err_message = "Le formulaire comporte des erreurs !";
+        if (this.props.onFormFailed) this.props.onFormFailed(err_message);else alert(`${err_message}`);
+        return false;
       }
-      iRow++;
-    }
-    if (globals.parameters.debugging) console.log("canSubmit:", canSubmit);
-    if (!canSubmit) {
-      let err_message = "Le formulaire comporte des erreurs !";
-      if (this.props.onFormFailed) this.props.onFormFailed(err_message);else alert(`${err_message}`);
-      return false;
-    }
 
-    //Invoke onFormSubmit props
+      //Invoke onFormSubmit props
 
-    if (this.props.onFormSubmit) {
-      if (globals.parameters.debugging) alert("onFormSubmit => filter log with AsyncDebug:: prefixe");
-      //If props function return false then cancel form submit and do not save !
-      this.props.onFormSubmit(this.local_data_blob);
-    } else {
-      //Call save anyway
-      this.saveFormToDatasyncProcess();
+      if (this.props.onFormSubmit) {
+        if (globals.parameters.debugging) alert("onFormSubmit => filter log with AsyncDebug:: prefixe");
+        //If props function return false then cancel form submit and do not save !
+        this.props.onFormSubmit(this.local_data_blob);
+      } else {
+        //Call save anyway
+        this.saveFormToDatasyncProcess();
+      }
+    } catch (error) {
+      console.error(`onClickSubmitFormHandler raises "${error}"`);
     }
   };
   onFormSavedLocalHandler = blob => {
@@ -470,11 +470,15 @@ class DsDynamicForm extends _react.Component {
     if (this.props.onTerminated) this.props.onTerminated();
   };
   onFormUpdatedLocalHandler = blob => {
-    if (this.props.onFormUpdated) this.props.onFormUpdated(blob);else console.error("DynamicForm3Tiers2.onFormUpdated props is not defined !");
-    //clear form
-    if (this.props.clearOnUpdate) this.clearForm();
-    //Call onTerminated if set by user
-    if (this.props.onTerminated) this.props.onTerminated();
+    try {
+      if (this.props.onFormUpdated) this.props.onFormUpdated(blob);else console.error("DynamicForm3Tiers2.onFormUpdated props is not defined !");
+      //clear form
+      if (this.props.clearOnUpdate) this.clearForm();
+      //Call onTerminated if set by user
+      if (this.props.onTerminated) this.props.onTerminated();
+    } catch (error) {
+      console.error(`onFormUpdatedLocalHandler raises "${error}"`);
+    }
   };
   onFormFailedLocalHandler = err => {
     if (this.props.onFormFailed) this.props.onFormFailed(err);else {
@@ -587,23 +591,23 @@ class DsDynamicForm extends _react.Component {
       console.log("dateConvertedObject.asString =>", dateConvertedObject.asString);
     }
     this.setFieldData(eventObject.fieldObject.name, dateConvertedObject.asString);
-    this.setFieldData(eventObject.fieldObject.name + "__day", dateConvertedObject.asDate.day);
-    this.setFieldData(eventObject.fieldObject.name + "__month", dateConvertedObject.asDate.month);
-    this.setFieldData(eventObject.fieldObject.name + "__year", dateConvertedObject.asDate.year);
+    this.setFieldData(eventObject.fieldObject.name_day, dateConvertedObject.asDate.day);
+    this.setFieldData(eventObject.fieldObject.name_month, dateConvertedObject.asDate.month);
+    this.setFieldData(eventObject.fieldObject.name_year, dateConvertedObject.asDate.year);
 
     //Validate field
     this.checkValidation(eventObject.fieldObject);
   };
   handle_time_picker = eventObject => {
     //Set hour or min
-    this.setFieldData(eventObject.name + eventObject.sub_name, eventObject.value);
+    this.setFieldData(eventObject.sub_field_name, eventObject.value);
     //update fulll time field
-    this.setFieldData(eventObject.name, this.getFieldData(eventObject.name + "__hour") + ":" + this.getFieldData(eventObject.name + "__min"));
+    this.setFieldData(eventObject.fieldObject.name, this.getFieldData(eventObject.fieldObject.name_hour) + ":" + this.getFieldData(eventObject.fieldObject.name_min));
     if (true) {
       console.clear();
-      console.log("__hour ->", this.getFieldData(eventObject.name + "__hour"));
-      console.log("__min ->", this.getFieldData(eventObject.name + "__min"));
-      console.log(eventObject.name, " ->", this.getFieldData(eventObject.name));
+      console.log(eventObject.fieldObject.name_hour, " ->", this.getFieldData(eventObject.fieldObject.name_hour));
+      console.log(eventObject.fieldObject.name_min, "->", this.getFieldData(eventObject.fieldObject.name_min));
+      console.log(eventObject.fieldObject.name, " ->", this.getFieldData(eventObject.fieldObject.name));
     }
 
     //Validate field
@@ -632,138 +636,100 @@ class DsDynamicForm extends _react.Component {
     this.local_data_blob.data_tier[pFieldObject.name] = migrated_value;
     if (globals.parameters.debugging) console.log("09/07:migrate_field -> pFieldObject.name=", pFieldObject.name);
   };
-  data_tier_migration = (field, ii) => {
-    if (!this.props.data_blob) return; //Discard migration 
-    return;
-    //data_tier_migration disabled
-    console.log("09/07:data_tier_migration ### Migration check  !!!");
-    console.log("09/07:this.data_blob.modified ->", this.local_data_blob && this.local_data_blob.modified ? this.local_data_blob.modified : "null");
-    //Check if migration required
-    if (this.local_data_blob && this.local_data_blob.modified && this.local_data_blob.modified < globals.parameters.form_modified_version) if (globals.parameters.debugging) console.log("09/07:field needs migration from version 1 to version 2");else {
-      if (globals.parameters.debugging) console.log("09/07:Field is up to date");
-      //Don't care migration process
-      return;
-    }
-    if (globals.parameters.debugging) {
-      console.log("09/07:data_tier_migration ->", field.input_type);
-    }
-    switch (field.input_type.toLowerCase()) {
-      /** Dynamic fields */
-      case "checkbox-DISABLED":
-      case "checkbox":
-      case "blob":
-      case "email":
-      case "text":
-      case "memo":
-      case "multi":
-      case "numeric":
-      case "amount":
-      case "percent":
-      case "captcha":
-      case "textarea":
-        //Migrate single field
-        if (globals.parameters.debugging) {
-          console.log("09/07:data_tier_migration single field ->", field.name);
-        }
-        this.migrate_field(field, this.getFieldData_V1(field));
-        break;
-      case "combo":
-      case "radio":
-        //Migrate selected field
-        if (globals.parameters.debugging) {
-          console.log("09/07:data_tier_migration selected field ->", field.name);
-        }
-        this.migrate_field(field, this.getSelectedFieldValues_V1(field));
-        break;
-      default:
-        alert("data_tier_migration --> Field type not supported ->" + field.input_type);
-    }
-  };
   _fieldRendering = (field, ii) => {
-    console.log("09/07:_fieldRendering -> data_tier_migration call");
-    this.data_tier_migration(field, ii);
-    //Do not display field if empty in read only mode
-    if (this.props.read_only && (this.getFieldData(field.name) == null || !this.getFieldData(field.name) || this.getFieldData(field.name).trim().length == 0)) return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null);
+    try {
+      //Do not display field if empty in read only mode
+      if (this.props.read_only && (this.getFieldData(field.name) == null || !this.getFieldData(field.name) || this.getFieldData(field.name).trim().length == 0)) return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null);
 
-    //Do not display hidden field
-    if (field.hidden && !this.props.show_hidden) return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null);
-    switch (field.input_type.toLowerCase()) {
-      /** Dynamic fields */
-      case "checkbox-DISABLED":
-        return /*#__PURE__*/_react.default.createElement(_reactstrap.FormGroup, {
-          check: true
-        }, /*#__PURE__*/_react.default.createElement(_reactstrap.Label, {
-          check: true
-        }, /*#__PURE__*/_react.default.createElement(_reactstrap.Input, {
-          defaultValue: "",
-          type: "checkbox",
-          readOnly: this.props.read_only ? this.props.read_only : false
-        }), field.placeholder, /*#__PURE__*/_react.default.createElement("span", {
-          className: "form-check-sign"
-        })));
-      case "checkbox":
-        /* Checkbox is override with combobox */
-        return /*#__PURE__*/_react.default.createElement("div", null, this.getFieldLabelTitle(field), /*#__PURE__*/_react.default.createElement(_multiselectReactDropdown.default, {
-          showArrow: true,
-          options: ["Oui", "Non"],
-          isObject: false,
-          displayValue: "key",
-          selectedValues: this.getFieldData(field.name) ? this.getFieldData(field.name).split(";") : [],
-          placeholder: field.placeholder,
-          emptyRecordMsg: "",
-          onSelect: (selectedList, selectedItem) => {
-            this.setFieldData(field.name, selectedList.join(";"));
-          },
-          onRemove: (selectedList, selectedItem) => {
-            this.setFieldData(field.name, selectedList.join(";"));
-          },
-          disable: this.props.read_only,
-          singleSelect: true
-        }), this._error_label(field));
-      case "blob":
-        return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, this.getFieldLabelTitle(field), /*#__PURE__*/_react.default.createElement("div", {
-          className: "col-md-10"
-        }, /*#__PURE__*/_react.default.createElement(_datasyncBlob.DsBlob, {
-          readOnly: this.props.read_only ? this.props.read_only : false,
-          Caption: `${this.getFieldPrompt(field)} ...`,
-          data: this.getFieldData(field.name),
-          uploadPicture: UploadFile => {
-            this.setFieldData(field.name, UploadFile.data);
-            this.checkValidation(field);
-          },
-          pictureStyle: "pic",
-          buttonStyle: "btn btn-secondary",
-          width: field.width ? field.width : null,
-          height: field.height ? field.height : null,
-          maxWidth: field.maxWidth ? field.maxWidth : null,
-          maxHeight: field.maxHeight ? field.maxHeight : null,
-          reduceImage: field.reduceImage ? field.reduceImage : null
-        }), this._error_label(field)));
-      case "email":
-        return this._email_field(field);
-      case "text":
-        return this._text_field(field);
-      case "memo":
-        return this._memo_field(field);
-      case "combo":
-      case "radio":
-        return this._combo_field(field);
-      case "multi":
-        return this._multi_field(field);
-      case "date":
-        return this._date_field(field);
-      case "time":
-        return this._time_field(field);
-      case "numeric":
-        return this._numeric_field_with_add_on(field, "*");
-      case "amount":
-        return this._numeric_field_with_add_on(field, "fa-euro");
-      case "percent":
-        return this._numeric_field_with_add_on(field, "%");
-      case "captcha":
-        return this._captcha_field(field);
-      default:
-        console.log("alert à Malibu");
+      //Do not display hidden field
+      if (field.hidden && !this.props.show_hidden) return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null);
+      switch (field.input_type.toLowerCase()) {
+        /** Dynamic fields */
+        case "checkbox-DISABLED":
+          return /*#__PURE__*/_react.default.createElement(_reactstrap.FormGroup, {
+            check: true
+          }, /*#__PURE__*/_react.default.createElement(_reactstrap.Label, {
+            check: true
+          }, /*#__PURE__*/_react.default.createElement(_reactstrap.Input, {
+            defaultValue: "",
+            type: "checkbox",
+            readOnly: this.props.read_only ? this.props.read_only : false
+          }), field.placeholder, /*#__PURE__*/_react.default.createElement("span", {
+            className: "form-check-sign"
+          })));
+        case "checkbox":
+          /* Checkbox is override with combobox */
+          return /*#__PURE__*/_react.default.createElement("div", null, this.getFieldLabelTitle(field), /*#__PURE__*/_react.default.createElement(_multiselectReactDropdown.default, {
+            showArrow: true,
+            options: ["Oui", "Non"],
+            isObject: false,
+            displayValue: "key",
+            selectedValues: this.getFieldData(field.name) ? this.getFieldData(field.name).split(";") : [],
+            placeholder: field.placeholder,
+            emptyRecordMsg: "",
+            onSelect: (selectedList, selectedItem) => {
+              this.setFieldData(field.name, selectedList.join(";"));
+            },
+            onRemove: (selectedList, selectedItem) => {
+              this.setFieldData(field.name, selectedList.join(";"));
+            },
+            disable: this.props.read_only,
+            singleSelect: true
+          }), this._error_label(field));
+        case "blob":
+          return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, this.getFieldLabelTitle(field), /*#__PURE__*/_react.default.createElement("div", {
+            className: "col-md-10"
+          }, /*#__PURE__*/_react.default.createElement(_datasyncBlob.DsBlob, {
+            readOnly: this.props.read_only ? this.props.read_only : false,
+            Caption: `${this.getFieldPrompt(field)} ...`,
+            data: this.getFieldData(field.name),
+            uploadPicture: UploadFile => {
+              this.setFieldData(field.name, UploadFile.data);
+              this.checkValidation(field);
+            },
+            pictureStyle: "pic",
+            buttonStyle: "btn btn-secondary",
+            width: field.width ? field.width : null,
+            height: field.height ? field.height : null,
+            maxWidth: field.maxWidth ? field.maxWidth : null,
+            maxHeight: field.maxHeight ? field.maxHeight : null,
+            reduceImage: field.reduceImage ? field.reduceImage : null
+          }), this._error_label(field)));
+        case "email":
+          return this._email_field(field);
+        case "text":
+          return this._text_field(field);
+        case "memo":
+          return this._memo_field(field);
+        case "combo":
+        case "radio":
+          return this._combo_field(field);
+        case "multi":
+          return this._multi_field(field);
+        case "date":
+          //set day month and year fields
+          if (!field.name_day) field.name_day = "__day";
+          if (!field.name_month) field.name_month = "__month";
+          if (!field.name_year) field.name_year = "__year";
+          return this._date_field(field);
+        case "time":
+          //set day month and year fields
+          if (!field.name_hour) field.name_hour = "__hour";
+          if (!field.name_min) field.name_min = "__min";
+          return this._time_field(field);
+        case "numeric":
+          return this._numeric_field_with_add_on(field, "*");
+        case "amount":
+          return this._numeric_field_with_add_on(field, "fa-euro");
+        case "percent":
+          return this._numeric_field_with_add_on(field, "%");
+        case "captcha":
+          return this._captcha_field(field);
+        default:
+          console.log("alert incorrect field type");
+      }
+    } catch (error) {
+      console.error(`_fieldRendering raises "${error}"`);
     }
   };
   _cancelButton = () => {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "datasync-dynamic-form",
-  "version": "1.0.28",
+  "version": "1.1.0",
   "description": "Datasync Dynamic Form component",
   "main": "./dist/components/DsDynamicForm",
   "types": "./dist/components/DsDynamicForm",
@@ -46,7 +46,7 @@
     "datasync-common-library": "^1.0.5",
     "datasync-core": "^1.0.28",
     "datasync-dynamic-form": "^1.0.27",
-    "react-datepicker": "^8.3.0",
+    "react-datepicker": "@^4.11.0",
     "universal-cookie": "^7.2.2"
   }
 }