datasync-dynamic-form 1.1.6 → 1.1.8

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 (2) hide show
  1. package/package.json +8 -10
  2. package/dist/components/DsDynamicForm.js +0 -745
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "datasync-dynamic-form",
3
- "version": "1.1.6",
3
+ "version": "1.1.8",
4
4
  "description": "Datasync Dynamic Form component",
5
5
  "main": "./dist/components/DsDynamicForm",
6
6
  "types": "./dist/components/DsDynamicForm",
@@ -25,12 +25,12 @@
25
25
  "jest-environment-jsdom": "^29.7.0",
26
26
  "jest-transform-css": "^6.0.1",
27
27
  "multiselect-react-dropdown": "^2.0.25",
28
- "react": "^18.2.0",
29
- "reactstrap": "^9.2.3"
28
+ "react": ">=18.2.0",
29
+ "reactstrap": ">=8.4.1"
30
30
  },
31
31
  "peerDependencies": {
32
32
  "multiselect-react-dropdown": "^2.0.25",
33
- "react": "^ 18.2.0"
33
+ "react": ">=18.2.0"
34
34
  },
35
35
  "scripts": {
36
36
  "build": "rm -r dist && babel src -d dist --ignore src/**/*.test.jsx && npm run copy-files",
@@ -42,11 +42,9 @@
42
42
  "license": "ISC",
43
43
  "dependencies": {
44
44
  "axios": "^1.7.2",
45
- "datasync-blob": "^1.1.0",
46
- "datasync-common-library": "^1.0.10",
47
- "datasync-core": "^1.0.36",
48
- "datasync-dynamic-form": "^1.0.27",
49
- "react-datepicker": "@^4.11.0",
50
- "universal-cookie": "^7.2.2"
45
+ "datasync-blob": ">=1.1.0",
46
+ "datasync-common-library": "^1.2.2",
47
+ "datasync-core": ">=1.0.36",
48
+ "datasync-dynamic-form": ">=1.0.27"
51
49
  }
52
50
  }
package/dist/components/DsDynamicForm.js DELETED
@@ -1,745 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- Object.defineProperty(exports, "CGUID", {
7
- enumerable: true,
8
- get: function () {
9
- return _datasyncCommonLibrary.CGUID;
10
- }
11
- });
12
- exports.DsDynamicForm = void 0;
13
- var _react = _interopRequireWildcard(require("react"));
14
- var _multiselectReactDropdown = _interopRequireDefault(require("multiselect-react-dropdown"));
15
- var _datasyncCore = require("datasync-core");
16
- var _datasyncCommonLibrary = require("datasync-common-library");
17
- var _datasyncBlob = require("datasync-blob");
18
- var _reactDatepicker = _interopRequireWildcard(require("react-datepicker"));
19
- var _reactstrap = require("reactstrap");
20
- function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
21
- function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
22
- function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
23
- // react plugin that creates an input with badges
24
- {/** Blob must be defined as npm component
25
- <Blob
26
- import Blob from "components/Blob/Blob";*/}
27
-
28
- // reactstrap components
29
-
30
- const debugging = false;
31
- const local = true;
32
- const production = !local;
33
- const globals = {
34
- parameters: {
35
- debugging: debugging,
36
- local: true,
37
- production: false,
38
- use_navigate: false,
39
- save_failed_alert: false,
40
- form_version: "1.0",
41
- form_modified_version: 2
42
- }
43
- };
44
- class DsDynamicForm extends _react.Component {
45
- constructor(props) {
46
- super(props);
47
- if (globals.parameters.debugging) {
48
- console.log("30:DynamicForm3Tiers2::this.props.data_blob", this.props.data_blob);
49
- console.log("30DynamicForm3Tiers::this.props.form", this.props.form);
50
- }
51
- this.state = {
52
- form: {}
53
- };
54
- }
55
- componentDidMount = () => {
56
- //Component initialization in edit mode
57
- if (this.props.form) {
58
- this.clearForm();
59
- }
60
- };
61
- componentDidUpdate(prevProps) {
62
- // Typical usage (don't forget to compare props):
63
- if (this.props.form !== prevProps.form) {
64
- //Lookup field props has changed
65
- this.clearForm();
66
- }
67
- if (this.props.data_blob !== prevProps.data_blob) {
68
- //Lookup field props has changed
69
- this.clearForm();
70
- }
71
- }
72
-
73
- /**
74
- * Prototype : clearForm
75
- */
76
- clearForm = () => {
77
- this.setState({
78
- fieldError: [],
79
- form: {},
80
- captcha1: (0, _datasyncCommonLibrary.Randomize)(0, 5),
81
- captcha2: (0, _datasyncCommonLibrary.Randomize)(0, 5)
82
- },
83
- //Clear forced
84
- () => {
85
- this.setState({
86
- form: this.props.form,
87
- fieldError: []
88
- }); //No need to override form property with clearObject2 anymore because data are written outside form.
89
- });
90
-
91
- //Real efficient fix
92
- let duplicate_data_tier = this.props.data_blob && this.props.data_blob.data_tier ? JSON.parse(JSON.stringify(this.props.data_blob.data_tier)) : {};
93
-
94
- //duplicate_data_tier = Object.assign(duplicate_data_tier, (this.props.data_blob && this.props.data_blob.data_tier)?this.props.data_blob.data_tier:{})
95
- this.local_data_blob = {
96
- data_tier: {}
97
- };
98
- //this.local_data_blob.data_tier = Object.assign({}, duplicate_data_tier);
99
-
100
- //Ensure props.foreign_keys is a json object - PMAB on 2025-04-10
101
- if (this.props.foreign_keys && typeof this.props.foreign_keys !== "object") throw new Error("foreign_keys must be a json object !");
102
- this.local_data_blob.data_tier = Object.assign(this.props.foreign_keys ? this.props.foreign_keys : {}, duplicate_data_tier);
103
- };
104
- getFieldData = fieldName => {
105
- /** Return data value form field object */
106
- let nextFieldData = this.local_data_blob.data_tier[fieldName] ? this.local_data_blob.data_tier[fieldName] : "";
107
- return nextFieldData;
108
- };
109
- setFieldData = (fieldName, value) => {
110
- this.local_data_blob.data_tier[fieldName] = value;
111
-
112
- //onFormChange handler return current form value to caller - PMAB on 2025-02-03
113
- if (this.props.onFormChange) this.props.onFormChange(this.local_data_blob.data_tier);
114
- };
115
- getSelectedFieldValues_V1 = pFieldObject => {
116
- return pFieldObject.selected_values ? pFieldObject.selected_values : "";
117
- };
118
- setFieldError = (pFieldObject, value) => {
119
- try {
120
- pFieldObject.err = value;
121
- let nextFieldError = this.state.fieldError;
122
- nextFieldError[pFieldObject.name] = value;
123
- this.setState({
124
- fieldError: nextFieldError
125
- });
126
- //Scroll form to first erroneous field
127
- (0, _datasyncCommonLibrary.WScrollTo)(pFieldObject.name);
128
- } catch (e) {
129
- console.error(`Error caught on ${e}`);
130
- }
131
- };
132
- getFieldError = pFieldObject => {
133
- /** Return data value form field object */
134
- try {
135
- return pFieldObject.err ? pFieldObject.err : "";
136
- } catch (e) {
137
- return "";
138
- }
139
- };
140
- _error_label = field => {
141
- return /*#__PURE__*/_react.default.createElement("label", {
142
- className: "dynamic-form-error"
143
- }, this.getfieldErrorLabel(field));
144
- };
145
- getfieldErrorLabel = pFieldObject => {
146
- return this.getFieldError(pFieldObject);
147
- };
148
- getFieldLabelTitle = pFieldObject => {
149
- return /*#__PURE__*/_react.default.createElement("h6", {
150
- id: pFieldObject.name
151
- }, pFieldObject.title ? pFieldObject.title : pFieldObject.placeholder, pFieldObject.required && !this.props.read_only && /*#__PURE__*/_react.default.createElement("span", {
152
- className: "icon-danger"
153
- }, "*"));
154
- };
155
- getCaptchaFieldLabelTitle = pFieldObject => {
156
- return /*#__PURE__*/_react.default.createElement("h6", {
157
- id: pFieldObject.name
158
- }, `${this.state.captcha1} + ${this.state.captcha2}`, pFieldObject.required && /*#__PURE__*/_react.default.createElement("span", {
159
- className: "icon-danger"
160
- }, "*"));
161
- };
162
- getFieldData_V1 = pFieldObject => {
163
- return pFieldObject.value ? pFieldObject.value : pFieldObject.default_value ? pFieldObject.default_value : "";
164
- };
165
- getFieldPrompt = pFieldObject => {
166
- return pFieldObject.placeholder ? pFieldObject.placeholder : pFieldObject.title;
167
- };
168
- _numeric_field_with_add_on = (field, fa_symbol) => {
169
- return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, this.getFieldLabelTitle(field), /*#__PURE__*/_react.default.createElement(_reactstrap.InputGroup, {
170
- className: "border-input"
171
- }, /*#__PURE__*/_react.default.createElement(_reactstrap.Input, {
172
- readOnly: this.props.read_only ? this.props.read_only : false,
173
- type: field.input_type,
174
- value: this.getFieldData(field.name),
175
- placeholder: field.placeholder,
176
- autocomplete: "on",
177
- id: field.name,
178
- name: field.name,
179
- err: "",
180
- onChange: e => {
181
- e.preventDefault();
182
- this.dynamicInputNumericChangeHandler({
183
- event: e,
184
- fieldObject: field
185
- });
186
- }
187
- }), fa_symbol && /*#__PURE__*/_react.default.createElement("div", {
188
- className: "input-group-append"
189
- }, /*#__PURE__*/_react.default.createElement(_reactstrap.InputGroupText, null, /*#__PURE__*/_react.default.createElement("i", {
190
- className: `fa ${fa_symbol}`
191
- })))), this._error_label(field));
192
- };
193
- _captcha_field = (field, fa_symbol) => {
194
- return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, this.getCaptchaFieldLabelTitle(field), /*#__PURE__*/_react.default.createElement(_reactstrap.InputGroup, {
195
- className: "border-input"
196
- }, /*#__PURE__*/_react.default.createElement(_reactstrap.Input, {
197
- readOnly: this.props.read_only ? this.props.read_only : false,
198
- type: field.input_type,
199
- value: this.getFieldData(field.name),
200
- placeholder: field.placeholder,
201
- autocomplete: "on",
202
- id: field.name,
203
- name: field.name,
204
- onChange: e => {
205
- e.preventDefault();
206
- this.dynamicInputNumericChangeHandler({
207
- event: e,
208
- fieldObject: field
209
- });
210
- }
211
- })), this._error_label(field));
212
- };
213
- _text_field = field => {
214
- return /*#__PURE__*/_react.default.createElement("div", null, this.getFieldLabelTitle(field), /*#__PURE__*/_react.default.createElement(_reactstrap.Input, {
215
- readOnly: this.props.read_only ? this.props.read_only : false,
216
- type: field.input_type,
217
- value: this.getFieldData(field.name),
218
- placeholder: field.placeholder,
219
- autocomplete: "off",
220
- onChange: e => {
221
- e.preventDefault();
222
- this.dynamicInputTextChangeHandler({
223
- event: e,
224
- fieldObject: field
225
- });
226
- }
227
- }), this._error_label(field));
228
- };
229
- _email_field = field => {
230
- return /*#__PURE__*/_react.default.createElement("div", null, this.getFieldLabelTitle(field), /*#__PURE__*/_react.default.createElement(_reactstrap.Input, {
231
- readOnly: this.props.read_only ? this.props.read_only : false,
232
- type: field.input_type,
233
- value: this.getFieldData(field.name),
234
- placeholder: field.placeholder,
235
- pattern: "[a-z0-9._%+-]+@[a-z0-9.-]+\\.[a-z]{2,4}$",
236
- autocomplete: "on",
237
- id: field.name,
238
- name: field.name,
239
- onChange: e => {
240
- e.preventDefault();
241
- this.dynamicInputTextChangeHandler({
242
- event: e,
243
- fieldObject: field
244
- });
245
- }
246
- }), this._error_label(field));
247
- };
248
- _memo_field = field => {
249
- return /*#__PURE__*/_react.default.createElement("div", null, this.getFieldLabelTitle(field), /*#__PURE__*/_react.default.createElement("textarea", {
250
- className: "form-control",
251
- readOnly: this.props.read_only ? this.props.read_only : false,
252
- type: field.input_type,
253
- value: this.getFieldData(field.name),
254
- placeholder: field.placeholder,
255
- rows: field.rows,
256
- onChange: e => {
257
- e.preventDefault();
258
- this.dynamicInputTextChangeHandler({
259
- event: e,
260
- fieldObject: field
261
- });
262
- }
263
- }), this._error_label(field));
264
- };
265
- _combo_field = field => {
266
- return /*#__PURE__*/_react.default.createElement("div", null, this.getFieldLabelTitle(field), /*#__PURE__*/_react.default.createElement(_multiselectReactDropdown.default, {
267
- showArrow: true,
268
- options: field.combo_list,
269
- isObject: false,
270
- displayValue: "key",
271
- selectedValues: this.getFieldData(field.name) ? this.getFieldData(field.name.name).split(";") : [],
272
- placeholder: field.placeholder,
273
- emptyRecordMsg: "",
274
- onSelect: (selectedList, selectedItem) => {
275
- this.setFieldData(field.name, selectedList.join(";"));
276
- },
277
- onRemove: (selectedList, selectedItem) => {
278
- this.setFieldData(field.name, selectedList.join(";"));
279
- },
280
- disable: this.props.read_only,
281
- singleSelect: true
282
- }), this._error_label(field));
283
- };
284
- _multi_field = field => {
285
- return /*#__PURE__*/_react.default.createElement("div", null, this.getFieldLabelTitle(field), /*#__PURE__*/_react.default.createElement(_multiselectReactDropdown.default, {
286
- showArrow: true,
287
- options: field.combo_list,
288
- isObject: false,
289
- displayValue: "key",
290
- selectedValues: this.getFieldData(field.name) ? this.getFieldData(field.name).split(";") : [],
291
- placeholder: field.placeholder,
292
- emptyRecordMsg: "",
293
- onSelect: (selectedList, selectedItem) => {
294
- this.setFieldData(field.name, selectedList.join(";"));
295
- },
296
- onRemove: (selectedList, selectedItem) => {
297
- this.setFieldData(field.name, selectedList.join(";"));
298
- },
299
- disable: this.props.read_only,
300
- singleSelect: false
301
- }), this._error_label(field));
302
- };
303
- _date_field = field => {
304
- return /*#__PURE__*/_react.default.createElement("div", null, this.getFieldLabelTitle(field), /*#__PURE__*/_react.default.createElement(_reactDatepicker.default
305
- //locale="fr"
306
- , {
307
- value: this.getFieldData(field.name),
308
- placeholder: "dd-mm-yyyy",
309
- onChange: p_oDate => {
310
- this.handle_date_picker({
311
- selection: p_oDate,
312
- fieldObject: field
313
- });
314
- }
315
- }), this._error_label(field));
316
- };
317
- _time_field = field => {
318
- return /*#__PURE__*/_react.default.createElement("div", {
319
- className: "time-div"
320
- }, this.getFieldLabelTitle(field), /*#__PURE__*/_react.default.createElement("div", {
321
- className: "time-hour-and-min-container-div"
322
- }, /*#__PURE__*/_react.default.createElement("div", {
323
- className: "time-hour-div"
324
- }, /*#__PURE__*/_react.default.createElement(_multiselectReactDropdown.default, {
325
- showArrow: true,
326
- options: ["07", "08", "09", "10", "11", "12", "13", "14", "15", "16", "17", "18", "19", "20", "21", "22"],
327
- isObject: false,
328
- displayValue: "key",
329
- selectedValues: this.getFieldData(field.name_hour) ? this.getFieldData(field.name_hour).split(";") : [],
330
- placeholder: field.placeholder,
331
- emptyRecordMsg: "",
332
- onSelect: (selectedList, selectedItem) => {
333
- this.handle_time_picker({
334
- fieldObject: field,
335
- sub_field_name: field.name_hour,
336
- value: selectedList.join(";")
337
- });
338
- },
339
- onRemove: (selectedList, selectedItem) => {
340
- this.handle_time_picker({
341
- fieldObject: field,
342
- sub_field_name: field.name_hour,
343
- value: selectedList.join(";")
344
- });
345
- },
346
- disable: this.props.read_only,
347
- singleSelect: true
348
- })), /*#__PURE__*/_react.default.createElement("div", {
349
- className: "time-min-div"
350
- }, /*#__PURE__*/_react.default.createElement(_multiselectReactDropdown.default, {
351
- showArrow: false,
352
- options: ["00", "15", "20", "25", "30", "35", "40", "45", "50", "55"],
353
- isObject: false,
354
- displayValue: "key",
355
- selectedValues: this.getFieldData(field.name_min) ? this.getFieldData(field.name_min).split(";") : [],
356
- placeholder: field.placeholder,
357
- emptyRecordMsg: "",
358
- onSelect: (selectedList, selectedItem) => {
359
- this.handle_time_picker({
360
- fieldObject: field,
361
- sub_field_name: field.name_min,
362
- value: selectedList.join(";")
363
- });
364
- },
365
- onRemove: (selectedList, selectedItem) => {
366
- this.handle_time_picker({
367
- fieldObject: field,
368
- sub_field_name: field.name_min,
369
- value: selectedList.join(";")
370
- });
371
- },
372
- disable: this.props.read_only,
373
- singleSelect: true
374
- }))), this._error_label(field));
375
- };
376
- _time_field_DISABLED = field => {
377
- return /*#__PURE__*/_react.default.createElement("div", null, this.getFieldLabelTitle(field), /*#__PURE__*/_react.default.createElement(TimePickerPackage, {
378
- hour_title: "heure",
379
- hour_placeholder: "heure",
380
- minutes_title: "minutes",
381
- minutes_placeholder: "minutes",
382
- required: false,
383
- onChange: timeValuePack => {
384
- this.setState({
385
- hour: timeValuePack.hour,
386
- minutes: timeValuePack.minutes
387
- });
388
- }
389
- }), this._error_label(field));
390
- };
391
- saveFormToDatasyncProcess = () => {
392
- //Everything sounds ok in Form, Go ahead
393
- let hasDataGuid = this.props.datasync_object && this.props.datasync_object.data_guid;
394
- (0, _datasyncCore.SaveDataTierToDatasync)(this.props.datasync_url, hasDataGuid ? this.props.datasync_object.data_guid : null,
395
- //data_guid
396
- this.local_data_blob,
397
- //p_o_data_blob,
398
- this.props.company_guid,
399
- //p_s_company_guid,
400
- this.props.table_guid,
401
- //p_s_table_guid,
402
- hasDataGuid ? this.props.datasync_object.createstamp : (0, _datasyncCommonLibrary.CTimeStamp)(),
403
- //p_dt_createstamp,
404
- hasDataGuid ? (0, _datasyncCommonLibrary.CTimeStamp)() : null,
405
- //p_dt_updatestamp,
406
- null,
407
- //p_dt_deletestamp,
408
- this.onFormSavedLocalHandler, this.onFormUpdatedLocalHandler, this.onFormFailedLocalHandler, null);
409
- };
410
-
411
- /** Form Handlers */
412
- onClickSubmitFormHandler = async event => {
413
- try {
414
- if (event) event.preventDefault();
415
-
416
- //Force all fields check
417
- let canSubmit = true;
418
- let iRow = 0;
419
- while (iRow < this.state.form.Rows.length && canSubmit) {
420
- let iCol = 0;
421
- while (iCol < this.state.form.Rows[iRow].Cols.length && canSubmit) {
422
- let ii = 0;
423
- while (ii < this.state.form.Rows[iRow].Cols[iCol].Fields.length && (canSubmit &= this.checkValidation(this.state.form.Rows[iRow].Cols[iCol].Fields[ii]))) {
424
- ii++;
425
- }
426
- iCol++;
427
- }
428
- iRow++;
429
- }
430
- if (!canSubmit) {
431
- let err_message = "Le formulaire comporte des erreurs !";
432
- if (this.props.onFormFailed) this.props.onFormFailed(err_message);else alert(`${err_message}`);
433
- return false;
434
- }
435
-
436
- //Invoke onFormSubmit props
437
-
438
- if (this.props.onFormSubmit) {
439
- if (globals.parameters.debugging) alert("onFormSubmit => filter log with AsyncDebug:: prefixe");
440
- //If props function return false then cancel form submit and do not save !
441
- this.props.onFormSubmit(this.local_data_blob);
442
- } else {
443
- //Call save anyway
444
- this.saveFormToDatasyncProcess();
445
- }
446
- } catch (error) {
447
- console.error(`onClickSubmitFormHandler raises "${error}"`);
448
- }
449
- };
450
- onFormSavedLocalHandler = blob => {
451
- if (this.props.onFormSaved) this.props.onFormSaved(blob);else console.error("DynamicForm3Tiers2.onFormSaved props is not defined !");
452
- //clear form
453
- if (this.props.clearOnSave) this.clearForm();
454
- //Call onTerminated if set by user
455
- if (this.props.onTerminated) this.props.onTerminated();
456
- };
457
- onFormUpdatedLocalHandler = blob => {
458
- try {
459
- if (this.props.onFormUpdated) this.props.onFormUpdated(blob);else console.error("DynamicForm3Tiers2.onFormUpdated props is not defined !");
460
- //clear form
461
- if (this.props.clearOnUpdate) this.clearForm();
462
- //Call onTerminated if set by user
463
- if (this.props.onTerminated) this.props.onTerminated();
464
- } catch (error) {
465
- console.error(`onFormUpdatedLocalHandler raises "${error}"`);
466
- }
467
- };
468
- onFormFailedLocalHandler = err => {
469
- if (this.props.onFormFailed) this.props.onFormFailed(err);else {
470
- console.error("DynamicForm3Tiers2.onFormFailed props is not defined !");
471
- alert("Erreur de sauvegarde !!!");
472
- }
473
- };
474
- checkValidation = pFieldObject => {
475
- let fieldName = pFieldObject.name;
476
-
477
- /** Get field properties */
478
- let min = pFieldObject.min_length;
479
- let max = pFieldObject.max_length;
480
- let fieldValue = this.getFieldData(pFieldObject.name);
481
- let errorsFieldName = `err_${fieldName}`; /** Error data displayed in dedicated error label, beside input field in Form */
482
- let nextErrors = [];
483
-
484
- /** Check basic field validity except combo and radio */
485
- if (pFieldObject.required && fieldValue.trim().length <= 0) nextErrors.push(`obligatoire`);
486
- if (min > 0 && pFieldObject.required && fieldValue.trim().length < min) nextErrors.push(`trop court.`);
487
-
488
- //Captcha check
489
- if (pFieldObject.input_type.toLowerCase() == "captcha") {
490
- if (parseInt(fieldValue) !== this.state.captcha1 + this.state.captcha2) nextErrors.push(`calcul faux !`);
491
- }
492
-
493
- //Email check
494
- if (pFieldObject.input_type.toLowerCase() == "email") {
495
- if (!fieldValue.match(/^([\w.%+-]+)@([\w-]+\.)+([\w]{2,})$/i)) nextErrors.push(`Format de mail incorrect !`);
496
- }
497
-
498
- //Date check
499
- if (pFieldObject.input_type.toLowerCase() == "date") {
500
- if (!fieldValue.match(/^(\d{2}\/\d{2}\/\d{4})$/i)) nextErrors.push(`Format de date incorrect !`);
501
- }
502
- if (max > 0 && fieldValue.trim().length > max) nextErrors.push(`trop long, ${fieldValue.trim().length - max} caractères en trop.`);
503
-
504
- //update error field
505
- this.setFieldError(pFieldObject, nextErrors.join("/"));
506
-
507
- //Return validation predicate
508
- return nextErrors.length === 0; //returns true if no error occurs
509
- };
510
- dynamicInputTextChangeHandler = eventObject => {
511
- if (eventObject && eventObject.event) eventObject.event.preventDefault();
512
- this.setFieldData(eventObject.fieldObject.name, eventObject.event.target.value);
513
-
514
- //Validate field
515
- this.checkValidation(eventObject.fieldObject);
516
- };
517
- dynamicInputNumericChangeHandler = eventObject => {
518
- if (eventObject && eventObject.event) eventObject.event.preventDefault();
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 {
520
- if (globals.parameters.debugging) console.error(`Value rejected -> ${eventObject.event.target.value}`);
521
- }
522
- this.checkValidation(eventObject.fieldObject);
523
- };
524
- convertDate = p_o_day_month_year => {
525
- function pad(s) {
526
- return s < 10 ? '0' + s : s;
527
- }
528
- return {
529
- asString: [pad(p_o_day_month_year.day), pad(p_o_day_month_year.month), p_o_day_month_year.year].join('/'),
530
- asDate: {
531
- day: p_o_day_month_year.day,
532
- month: p_o_day_month_year.month,
533
- year: p_o_day_month_year.year
534
- }
535
- };
536
- };
537
- handle_date_picker = eventObject => {
538
- let p_oDate = eventObject.selection;
539
- //Convert date picker string as day month year object
540
- let dateConvertedObject = this.convertDate({
541
- day: p_oDate.getDate(),
542
- month: 1 + p_oDate.getMonth(),
543
- year: p_oDate.getFullYear()
544
- });
545
- this.setFieldData(eventObject.fieldObject.name, dateConvertedObject.asString);
546
- this.setFieldData(eventObject.fieldObject.name_day, dateConvertedObject.asDate.day);
547
- this.setFieldData(eventObject.fieldObject.name_month, dateConvertedObject.asDate.month);
548
- this.setFieldData(eventObject.fieldObject.name_year, dateConvertedObject.asDate.year);
549
-
550
- //Validate field
551
- this.checkValidation(eventObject.fieldObject);
552
- };
553
- handle_time_picker = eventObject => {
554
- //Set hour or min
555
- this.setFieldData(eventObject.sub_field_name, eventObject.value);
556
- //update fulll time field
557
- this.setFieldData(eventObject.fieldObject.name, this.getFieldData(eventObject.fieldObject.name_hour) + ":" + this.getFieldData(eventObject.fieldObject.name_min));
558
-
559
- //Validate field
560
- this.checkValidation(eventObject.fieldObject);
561
- };
562
- _colRendering = col => {
563
- try {
564
- return /*#__PURE__*/_react.default.createElement(_reactstrap.Col, null, col.Fields.map((field, ii) => {
565
- return this._fieldRendering(field, ii);
566
- }));
567
- } catch (err) {
568
- return /*#__PURE__*/_react.default.createElement(_reactstrap.Col, null, "Error ", err.message);
569
- }
570
- };
571
- _rowRendering = row => {
572
- try {
573
- return /*#__PURE__*/_react.default.createElement(_reactstrap.Row, null, row.Cols.map((col, ii) => {
574
- return this._colRendering(col);
575
- }));
576
- } catch (err) {
577
- return /*#__PURE__*/_react.default.createElement(_reactstrap.Col, null, "Error ", err.message);
578
- }
579
- };
580
- _fieldRendering = (field, ii) => {
581
- try {
582
- //Do not display field if empty in read only mode
583
- 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);
584
-
585
- //Do not display hidden field
586
- if (field.hidden && !this.props.show_hidden) return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null);
587
- switch (field.input_type.toLowerCase()) {
588
- /** Dynamic fields */
589
- case "checkbox-DISABLED":
590
- return /*#__PURE__*/_react.default.createElement(_reactstrap.FormGroup, {
591
- check: true
592
- }, /*#__PURE__*/_react.default.createElement(_reactstrap.Label, {
593
- check: true
594
- }, /*#__PURE__*/_react.default.createElement(_reactstrap.Input, {
595
- defaultValue: "",
596
- type: "checkbox",
597
- readOnly: this.props.read_only ? this.props.read_only : false
598
- }), field.placeholder, /*#__PURE__*/_react.default.createElement("span", {
599
- className: "form-check-sign"
600
- })));
601
- case "checkbox":
602
- /* Checkbox is override with combobox */
603
- return /*#__PURE__*/_react.default.createElement("div", null, this.getFieldLabelTitle(field), /*#__PURE__*/_react.default.createElement(_multiselectReactDropdown.default, {
604
- showArrow: true,
605
- options: ["Oui", "Non"],
606
- isObject: false,
607
- displayValue: "key",
608
- selectedValues: this.getFieldData(field.name) ? this.getFieldData(field.name).split(";") : [],
609
- placeholder: field.placeholder,
610
- emptyRecordMsg: "",
611
- onSelect: (selectedList, selectedItem) => {
612
- this.setFieldData(field.name, selectedList.join(";"));
613
- },
614
- onRemove: (selectedList, selectedItem) => {
615
- this.setFieldData(field.name, selectedList.join(";"));
616
- },
617
- disable: this.props.read_only,
618
- singleSelect: true
619
- }), this._error_label(field));
620
- case "blob":
621
- return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, this.getFieldLabelTitle(field), /*#__PURE__*/_react.default.createElement("div", {
622
- className: "col-md-10"
623
- }, /*#__PURE__*/_react.default.createElement(_datasyncBlob.DsBlob, {
624
- readOnly: this.props.read_only ? this.props.read_only : false,
625
- Caption: `${this.getFieldPrompt(field)} ...`,
626
- data: this.getFieldData(field.name),
627
- uploadPicture: UploadFile => {
628
- this.setFieldData(field.name, UploadFile.data);
629
- this.checkValidation(field);
630
- },
631
- pictureStyle: "pic",
632
- buttonStyle: "btn btn-secondary",
633
- width: field.width ? field.width : null,
634
- height: field.height ? field.height : null,
635
- maxWidth: field.maxWidth ? field.maxWidth : null,
636
- maxHeight: field.maxHeight ? field.maxHeight : null,
637
- reduceImage: field.reduceImage ? field.reduceImage : null
638
- }), this._error_label(field)));
639
- case "email":
640
- return this._email_field(field);
641
- case "text":
642
- return this._text_field(field);
643
- case "memo":
644
- return this._memo_field(field);
645
- case "combo":
646
- case "radio":
647
- return this._combo_field(field);
648
- case "multi":
649
- return this._multi_field(field);
650
- case "date":
651
- //set day month and year fields
652
- if (!field.name_day) field.name_day = "__day";
653
- if (!field.name_month) field.name_month = "__month";
654
- if (!field.name_year) field.name_year = "__year";
655
- return this._date_field(field);
656
- case "time":
657
- //set day month and year fields
658
- if (!field.name_hour) field.name_hour = "__hour";
659
- if (!field.name_min) field.name_min = "__min";
660
- return this._time_field(field);
661
- case "numeric":
662
- return this._numeric_field_with_add_on(field, "*");
663
- case "amount":
664
- return this._numeric_field_with_add_on(field, "fa-euro");
665
- case "percent":
666
- return this._numeric_field_with_add_on(field, "%");
667
- case "captcha":
668
- return this._captcha_field(field);
669
- default:
670
- console.error("alert incorrect field type");
671
- }
672
- } catch (error) {
673
- console.error(`_fieldRendering raises "${error}"`);
674
- }
675
- };
676
- _cancelButton = () => {
677
- let buttonIsHidden = this.props.read_only || this.props.buttons_options && this.props.buttons_options.cancel_button_hidden;
678
- let buttonCaption = this.props.buttons_options && this.props.buttons_options.cancel_button_caption ? this.props.buttons_options.cancel_button_caption : "Annuler";
679
- if (buttonIsHidden) return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null);else {
680
- return /*#__PURE__*/_react.default.createElement(_reactstrap.Col, {
681
- md: "4",
682
- sm: "4"
683
- }, /*#__PURE__*/_react.default.createElement(_reactstrap.Button, {
684
- block: true,
685
- className: "btn-round",
686
- color: "danger",
687
- outline: true,
688
- type: "reset",
689
- onClick: () => {
690
- this.clearForm();
691
- }
692
- }, buttonCaption));
693
- }
694
- };
695
- _submitButton = () => {
696
- let buttonIsHidden = this.props.read_only || this.props.buttons_options && this.props.buttons_options.submit_button_hidden;
697
- let buttonCaption = this.props.buttons_options && this.props.buttons_options.submit_button_caption ? this.props.buttons_options.submit_button_caption : "Soumettre";
698
- if (buttonIsHidden) return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null);else {
699
- return /*#__PURE__*/_react.default.createElement(_reactstrap.Col, {
700
- md: "4",
701
- sm: "4"
702
- }, /*#__PURE__*/_react.default.createElement(_reactstrap.Button, {
703
- block: true,
704
- className: "btn-round",
705
- color: "danger",
706
- outline: true,
707
- type: "submit",
708
- onClick: () => {
709
- this.onClickSubmitFormHandler();
710
- }
711
- }, buttonCaption));
712
- }
713
- };
714
- render = () => {
715
- return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, !this.state.form && /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement("h1", null, "Form loading...")), /*#__PURE__*/_react.default.createElement("form", null, this.state.form && this.state.form.Rows && this.state.form.Rows.map(row => {
716
- return this._rowRendering(row);
717
- })), /*#__PURE__*/_react.default.createElement(_reactstrap.Row, {
718
- className: "buttons-row"
719
- }, this._cancelButton(), this._submitButton(), this.props.custom_button_caption && /*#__PURE__*/_react.default.createElement(_reactstrap.Col, {
720
- md: "4",
721
- sm: "4"
722
- }, /*#__PURE__*/_react.default.createElement(_reactstrap.Button, {
723
- block: true,
724
- className: "btn-round",
725
- color: "primary",
726
- type: "submit",
727
- onClick: e => {
728
- if (this.props.custom_button_handler) this.props.custom_button_handler(this.state.form);else console.error("custom_button_handler unset !");
729
- }
730
- }, this.props.custom_button_caption)), this.props.custom_button_caption2 && /*#__PURE__*/_react.default.createElement(_reactstrap.Col, {
731
- md: "4",
732
- sm: "4"
733
- }, /*#__PURE__*/_react.default.createElement(_reactstrap.Button, {
734
- block: true,
735
- className: "btn-round",
736
- color: "primary",
737
- type: "submit",
738
- onClick: e => {
739
- if (this.props.custom_button_handler2) this.props.custom_button_handler2(this.state.form);else console.error("custom_button_handler2 unset !");
740
- }
741
- }, this.props.custom_button_caption2))));
742
- };
743
- }
744
- exports.DsDynamicForm = DsDynamicForm;
745
- ;