tuain-ng-forms-lib 14.1.2 → 14.2.14

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 (35) hide show
  1. package/esm2020/lib/classes/forms/element.mjs +9 -3
  2. package/esm2020/lib/classes/forms/field.mjs +325 -243
  3. package/esm2020/lib/classes/forms/form.mjs +26 -26
  4. package/esm2020/lib/classes/forms/subsection.mjs +2 -2
  5. package/esm2020/lib/components/elements/action.component.mjs +3 -3
  6. package/esm2020/lib/components/elements/field.component.mjs +20 -15
  7. package/esm2020/lib/components/elements/layout/element.component.mjs +3 -3
  8. package/esm2020/lib/components/elements/layout/form-error.component.mjs +3 -3
  9. package/esm2020/lib/components/elements/layout/form-header.component.mjs +3 -3
  10. package/esm2020/lib/components/elements/layout/section.component.mjs +3 -3
  11. package/esm2020/lib/components/elements/layout/sub-section.component.mjs +3 -3
  12. package/esm2020/lib/components/elements/tables/table-record-action.component.mjs +3 -3
  13. package/esm2020/lib/components/elements/tables/table-record-field.component.mjs +3 -3
  14. package/esm2020/lib/components/elements/tables/table.component.mjs +3 -3
  15. package/esm2020/lib/components/forms/basic-form.mjs +65 -37
  16. package/esm2020/lib/tuain-ng-forms-lib.module.mjs +7 -9
  17. package/fesm2015/tuain-ng-forms-lib.mjs +479 -357
  18. package/fesm2015/tuain-ng-forms-lib.mjs.map +1 -1
  19. package/fesm2020/tuain-ng-forms-lib.mjs +474 -354
  20. package/fesm2020/tuain-ng-forms-lib.mjs.map +1 -1
  21. package/lib/classes/forms/element.d.ts +7 -6
  22. package/lib/classes/forms/field.d.ts +168 -72
  23. package/lib/classes/forms/form.d.ts +1 -1
  24. package/lib/components/elements/action.component.d.ts +1 -1
  25. package/lib/components/elements/field.component.d.ts +5 -5
  26. package/lib/components/elements/layout/element.component.d.ts +1 -1
  27. package/lib/components/elements/layout/form-error.component.d.ts +1 -1
  28. package/lib/components/elements/layout/form-header.component.d.ts +1 -1
  29. package/lib/components/elements/layout/section.component.d.ts +1 -1
  30. package/lib/components/elements/layout/sub-section.component.d.ts +1 -1
  31. package/lib/components/elements/tables/table-record-action.component.d.ts +1 -1
  32. package/lib/components/elements/tables/table-record-field.component.d.ts +1 -1
  33. package/lib/components/elements/tables/table.component.d.ts +1 -1
  34. package/lib/components/forms/basic-form.d.ts +8 -5
  35. package/package.json +1 -1
@@ -41,9 +41,9 @@ class ActionComponent {
41
41
  return !(this.action?.enabledOn(this.state));
42
42
  }
43
43
  }
44
- ActionComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: ActionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
45
- ActionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.1", type: ActionComponent, selector: "lib-action", inputs: { action: "action", busy: "busy", relatedField: "relatedField", state: "state", style: "style", showLabel: "showLabel" }, ngImport: i0, template: `<ng-content></ng-content>`, isInline: true });
46
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: ActionComponent, decorators: [{
44
+ ActionComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.6", ngImport: i0, type: ActionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
45
+ ActionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.6", type: ActionComponent, selector: "lib-action", inputs: { action: "action", busy: "busy", relatedField: "relatedField", state: "state", style: "style", showLabel: "showLabel" }, ngImport: i0, template: `<ng-content></ng-content>`, isInline: true });
46
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.6", ngImport: i0, type: ActionComponent, decorators: [{
47
47
  type: Component,
48
48
  args: [{
49
49
  selector: 'lib-action',
@@ -66,25 +66,30 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.1", ngImpor
66
66
  const VALUE = 'value';
67
67
  const FOCUS = 'focus';
68
68
  class FieldComponent {
69
+ constructor() {
70
+ // Atributos obtenidos estáticamente
71
+ this.code = '';
72
+ this.info = '';
73
+ this.alignment = '';
74
+ this.tooltip = '';
75
+ this.field = null;
76
+ }
69
77
  ngOnInit() {
70
78
  if (this.field) {
71
79
  this.formConfig = this.field?._formConfig;
72
80
  // Inicialización
73
- const mapping = Object.entries(this.formConfig.componentFieldAttrMap);
81
+ const mapping = this.formConfig.fieldPropagateAttributes;
74
82
  for (let index = 0; index < mapping.length; index++) {
75
- const [fieldAttr1, compAttr1] = mapping[index];
76
- const compAttr = compAttr1.toString();
77
- const fieldAttr = fieldAttr1.toString();
78
- const attributeValue = this.field?.[fieldAttr];
79
- this.dafaultProcessFieldChange(compAttr, attributeValue);
80
- this.processFieldChange(compAttr, attributeValue);
83
+ const attrName = mapping[index].toString();
84
+ const attributeValue = this.field?.[attrName];
85
+ this.dafaultProcessFieldChange(attrName, attributeValue);
86
+ this.processFieldChange(attrName, attributeValue);
81
87
  }
82
88
  // Subscripción a cambios en atributos
83
89
  this.field.attributeChange.subscribe(event => {
84
- const { name: fieldAttr, value } = event;
85
- const compAttr = this.formConfig.componentFieldAttrMap[fieldAttr];
86
- this.dafaultProcessFieldChange(compAttr, value);
87
- this.processFieldChange(compAttr, value);
90
+ const { name: attrName, value } = event;
91
+ this.dafaultProcessFieldChange(attrName, value);
92
+ this.processFieldChange(attrName, value);
88
93
  });
89
94
  }
90
95
  this.start();
@@ -137,9 +142,9 @@ class FieldComponent {
137
142
  return !this.field?.enabledOn(this.state);
138
143
  }
139
144
  }
140
- FieldComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: FieldComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
141
- FieldComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.1", type: FieldComponent, selector: "lib-field", inputs: { field: "field", state: "state" }, ngImport: i0, template: `<ng-content></ng-content>`, isInline: true });
142
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: FieldComponent, decorators: [{
145
+ FieldComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.6", ngImport: i0, type: FieldComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
146
+ FieldComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.6", type: FieldComponent, selector: "lib-field", inputs: { field: "field", state: "state" }, ngImport: i0, template: `<ng-content></ng-content>`, isInline: true });
147
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.6", ngImport: i0, type: FieldComponent, decorators: [{
143
148
  type: Component,
144
149
  args: [{
145
150
  selector: 'lib-field',
@@ -164,9 +169,9 @@ class ElementComponent {
164
169
  return !this.element?.enabledOn(this.state);
165
170
  }
166
171
  }
167
- ElementComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: ElementComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
168
- ElementComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.1", type: ElementComponent, selector: "lib-element", inputs: { element: "element", form: "form", state: "state" }, ngImport: i0, template: `<ng-content></ng-content>`, isInline: true });
169
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: ElementComponent, decorators: [{
172
+ ElementComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.6", ngImport: i0, type: ElementComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
173
+ ElementComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.6", type: ElementComponent, selector: "lib-element", inputs: { element: "element", form: "form", state: "state" }, ngImport: i0, template: `<ng-content></ng-content>`, isInline: true });
174
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.6", ngImport: i0, type: ElementComponent, decorators: [{
170
175
  type: Component,
171
176
  args: [{
172
177
  selector: 'lib-element',
@@ -182,9 +187,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.1", ngImpor
182
187
 
183
188
  class FormErrorComponent {
184
189
  }
185
- FormErrorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: FormErrorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
186
- FormErrorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.1", type: FormErrorComponent, selector: "lib-form-error", inputs: { errorTitle: "errorTitle", errorMessage: "errorMessage", errorType: "errorType" }, ngImport: i0, template: `<ng-content></ng-content>`, isInline: true });
187
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: FormErrorComponent, decorators: [{
190
+ FormErrorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.6", ngImport: i0, type: FormErrorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
191
+ FormErrorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.6", type: FormErrorComponent, selector: "lib-form-error", inputs: { errorTitle: "errorTitle", errorMessage: "errorMessage", errorType: "errorType" }, ngImport: i0, template: `<ng-content></ng-content>`, isInline: true });
192
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.6", ngImport: i0, type: FormErrorComponent, decorators: [{
188
193
  type: Component,
189
194
  args: [{
190
195
  selector: 'lib-form-error',
@@ -207,9 +212,9 @@ class FormHeaderComponent {
207
212
  this.goBackEvent.emit();
208
213
  }
209
214
  }
210
- FormHeaderComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: FormHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
211
- FormHeaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.1", type: FormHeaderComponent, selector: "lib-form-header", inputs: { formManager: "formManager", goBackAction: "goBackAction", showTitle: "showTitle", headerActions: "headerActions" }, outputs: { goBackEvent: "goBackEvent" }, ngImport: i0, template: `<ng-content></ng-content>`, isInline: true });
212
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: FormHeaderComponent, decorators: [{
215
+ FormHeaderComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.6", ngImport: i0, type: FormHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
216
+ FormHeaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.6", type: FormHeaderComponent, selector: "lib-form-header", inputs: { formManager: "formManager", goBackAction: "goBackAction", showTitle: "showTitle", headerActions: "headerActions" }, outputs: { goBackEvent: "goBackEvent" }, ngImport: i0, template: `<ng-content></ng-content>`, isInline: true });
217
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.6", ngImport: i0, type: FormHeaderComponent, decorators: [{
213
218
  type: Component,
214
219
  args: [{
215
220
  selector: 'lib-form-header',
@@ -233,9 +238,9 @@ class SectionComponent {
233
238
  }
234
239
  start() { }
235
240
  }
236
- SectionComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: SectionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
237
- SectionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.1", type: SectionComponent, selector: "lib-section", inputs: { section: "section", formManager: "formManager" }, ngImport: i0, template: `<ng-content></ng-content>`, isInline: true });
238
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: SectionComponent, decorators: [{
241
+ SectionComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.6", ngImport: i0, type: SectionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
242
+ SectionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.6", type: SectionComponent, selector: "lib-section", inputs: { section: "section", formManager: "formManager" }, ngImport: i0, template: `<ng-content></ng-content>`, isInline: true });
243
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.6", ngImport: i0, type: SectionComponent, decorators: [{
239
244
  type: Component,
240
245
  args: [{
241
246
  selector: 'lib-section',
@@ -253,9 +258,9 @@ class SubSectionComponent {
253
258
  }
254
259
  start() { }
255
260
  }
256
- SubSectionComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: SubSectionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
257
- SubSectionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.1", type: SubSectionComponent, selector: "lib-subsection", inputs: { subSection: "subSection", showHeader: "showHeader", formManager: "formManager" }, ngImport: i0, template: `<ng-content></ng-content>`, isInline: true });
258
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: SubSectionComponent, decorators: [{
261
+ SubSectionComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.6", ngImport: i0, type: SubSectionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
262
+ SubSectionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.6", type: SubSectionComponent, selector: "lib-subsection", inputs: { subSection: "subSection", showHeader: "showHeader", formManager: "formManager" }, ngImport: i0, template: `<ng-content></ng-content>`, isInline: true });
263
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.6", ngImport: i0, type: SubSectionComponent, decorators: [{
259
264
  type: Component,
260
265
  args: [{
261
266
  selector: 'lib-subsection',
@@ -288,9 +293,9 @@ class LibTableRecordActionComponent {
288
293
  }
289
294
  class() { }
290
295
  }
291
- LibTableRecordActionComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: LibTableRecordActionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
292
- LibTableRecordActionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.1", type: LibTableRecordActionComponent, selector: "lib-table-record-action", inputs: { recordId: "recordId", recordData: "recordData", action: "action" }, outputs: { actionSelected: "actionSelected" }, ngImport: i0, template: `<ng-content></ng-content>`, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
293
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: LibTableRecordActionComponent, decorators: [{
296
+ LibTableRecordActionComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.6", ngImport: i0, type: LibTableRecordActionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
297
+ LibTableRecordActionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.6", type: LibTableRecordActionComponent, selector: "lib-table-record-action", inputs: { recordId: "recordId", recordData: "recordData", action: "action" }, outputs: { actionSelected: "actionSelected" }, ngImport: i0, template: `<ng-content></ng-content>`, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
298
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.6", ngImport: i0, type: LibTableRecordActionComponent, decorators: [{
294
299
  type: Component,
295
300
  args: [{
296
301
  selector: 'lib-table-record-action',
@@ -313,9 +318,9 @@ class LibTableRecordFieldComponent {
313
318
  }
314
319
  start() { }
315
320
  }
316
- LibTableRecordFieldComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: LibTableRecordFieldComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
317
- LibTableRecordFieldComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.1", type: LibTableRecordFieldComponent, selector: "lib-table-record-field", inputs: { fieldCode: "fieldCode", fieldType: "fieldType", fieldValue: "fieldValue" }, ngImport: i0, template: `<ng-content></ng-content>`, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
318
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: LibTableRecordFieldComponent, decorators: [{
321
+ LibTableRecordFieldComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.6", ngImport: i0, type: LibTableRecordFieldComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
322
+ LibTableRecordFieldComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.6", type: LibTableRecordFieldComponent, selector: "lib-table-record-field", inputs: { fieldCode: "fieldCode", fieldType: "fieldType", fieldValue: "fieldValue" }, ngImport: i0, template: `<ng-content></ng-content>`, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
323
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.6", ngImport: i0, type: LibTableRecordFieldComponent, decorators: [{
319
324
  type: Component,
320
325
  args: [{
321
326
  selector: 'lib-table-record-field',
@@ -404,9 +409,9 @@ class LibTableComponent {
404
409
  }
405
410
  }
406
411
  }
407
- LibTableComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: LibTableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
408
- LibTableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.1", type: LibTableComponent, selector: "lib-table", inputs: { table: "table", tableRecords: "tableRecords", disabled: "disabled", state: "state", waiting: "waiting" }, ngImport: i0, template: `<ng-content></ng-content>`, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
409
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: LibTableComponent, decorators: [{
412
+ LibTableComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.6", ngImport: i0, type: LibTableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
413
+ LibTableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.6", type: LibTableComponent, selector: "lib-table", inputs: { table: "table", tableRecords: "tableRecords", disabled: "disabled", state: "state", waiting: "waiting" }, ngImport: i0, template: `<ng-content></ng-content>`, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
414
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.6", ngImport: i0, type: LibTableComponent, decorators: [{
410
415
  type: Component,
411
416
  args: [{
412
417
  selector: 'lib-table',
@@ -453,6 +458,10 @@ const operators = {
453
458
 
454
459
  class FormElement {
455
460
  constructor(elementDefinition, formConfig) {
461
+ this._visible = true;
462
+ this.visibleStates = null;
463
+ this.enabledStates = null;
464
+ this.elementType = null;
456
465
  this._formConfig = formConfig;
457
466
  this._isForced = false;
458
467
  this.setVisibleStates(elementDefinition.visibleStates);
@@ -462,6 +471,7 @@ class FormElement {
462
471
  this.setVisibility(elementDefinition?.visible ?? true);
463
472
  this.customAttributes = elementDefinition?.customAttributes ?? {};
464
473
  }
474
+ ;
465
475
  getCustomAttribute(name) { return this.customAttributes?.[name] ?? null; }
466
476
  setCustomAttribute(name, value) { if (name) {
467
477
  this.customAttributes[name] = value;
@@ -506,14 +516,14 @@ class FormElement {
506
516
  this._isForced = forced;
507
517
  }
508
518
  }
509
- show(forced) {
519
+ show(forced = null) {
510
520
  this._visible = true;
511
521
  if (forced !== null) {
512
522
  this._isForced = forced;
513
523
  this._visibleForced = true;
514
524
  }
515
525
  }
516
- hide(forced) {
526
+ hide(forced = null) {
517
527
  this._visible = false;
518
528
  if (forced !== null) {
519
529
  this._isForced = forced;
@@ -524,6 +534,7 @@ class FormElement {
524
534
  disable() { this.disabled = true; }
525
535
  get enabled() { return !this.disabled; }
526
536
  get editable() { return !this.disabled; }
537
+ set editable(editable) { this.disabled = !editable; }
527
538
  }
528
539
 
529
540
  const HEADER = 'HEADER';
@@ -564,35 +575,40 @@ const DEFAULT_CAPTURE_TYPE = 'INPUT';
564
575
  const DEFAULT_ALIGNMENT = 'left';
565
576
  const STD_MAX_LENGTH = 50;
566
577
  const BIG_MAX_LENGTH = 500;
567
- const fldAttr = {
568
- validateOnServer: 'validateOnServer',
569
- value: '_value',
570
- minValue: '_minValue',
571
- maxValue: '_maxValue',
572
- maxLength: '_maxLength',
573
- minLength: '_minLength',
574
- onValidation: '_onValidation',
575
- focus: 'focus',
576
- intrinsicErrorMessage: '_intrinsicErrorMessage',
577
- code: 'fieldCode',
578
- info: 'fieldInfo',
579
- defaultValue: 'defaultValue',
580
- defaultEditable: 'defaultEditable',
581
- visibleLabel: 'visibleLabel',
582
- required: 'fieldRequired',
583
- hasChanged: 'hasChanged',
584
- outputOnly: 'outputOnly',
585
- captureType: 'captureType',
586
- title: 'fieldTitle',
587
- type: 'fieldType',
588
- alignment: 'fieldAlignment',
589
- format: 'fieldFormat',
590
- externalValue: 'externalValue',
591
- tooltipText: 'tooltipText',
592
- errorType: 'errorType',
593
- errorCode: 'errorCode',
594
- errorMessage: 'errorMessage',
595
- options: 'fieldOptions',
578
+ const directChanges = [
579
+ 'defaultEditable', 'defaultValue', 'alignment', 'required', 'errorCode', 'errorMessage', 'errorType',
580
+ 'tooltip', 'info', 'format', 'intrinsicErrorMessage', 'outputOnly', 'captureType', 'title', 'type',
581
+ 'maxLength', 'maxValue', 'minLength', 'minValue', 'validateOnServer', 'serverAction', 'visibleLabel',
582
+ 'options',
583
+ ];
584
+ const attrs = {
585
+ _captureType: { name: '_captureType', propagate: 'captureType' },
586
+ _errorCode: { name: '_errorCode', propagate: 'errorCode' },
587
+ _errorMessage: { name: '_errorMessage', propagate: 'errorMessage' },
588
+ _errorType: { name: '_errorType', propagate: 'errorType' },
589
+ _defaultValue: { name: '_defaultValue', propagate: 'defaultValue' },
590
+ _defaultEditable: { name: '_defaultEditable', propagate: 'defaultEditable' },
591
+ _fieldAlignment: { name: '_fieldAlignment', propagate: 'alignment' },
592
+ _fieldCode: { name: '_fieldCode', propagate: 'code' },
593
+ _fieldInfo: { name: '_fieldInfo', propagate: 'info' },
594
+ _fieldRequired: { name: '_fieldRequired', propagate: 'required' },
595
+ _fieldTitle: { name: '_fieldTitle', propagate: 'title' },
596
+ _fieldType: { name: '_fieldType', propagate: 'type' },
597
+ _fieldFormat: { name: '_fieldFormat', propagate: 'format' },
598
+ _fieldOptions: { name: '_fieldOptions', propagate: 'options' },
599
+ _focus: { name: '_focus', propagate: 'focus' },
600
+ _hasChanged: { name: '_hasChanged', propagate: 'hasChanged' },
601
+ _intrinsicErrorMessage: { name: '_intrinsicErrorMessage', propagate: null },
602
+ _maxLength: { name: '_maxLength', propagate: 'maxLength' },
603
+ _maxValue: { name: '_maxValue', propagate: 'maxValue' },
604
+ _minLength: { name: '_minLength', propagate: 'minLength' },
605
+ _minValue: { name: '_minValue', propagate: 'minValue' },
606
+ _onValidation: { name: '_onValidation', propagate: 'onValidation' },
607
+ _outputOnly: { name: '_outputOnly', propagate: 'outputOnly' },
608
+ _tooltipText: { name: '_tooltipText', propagate: 'tooltip' },
609
+ _validateOnServer: { name: '_validateOnServer', propagate: 'validateOnServer' },
610
+ _value: { name: '_value', propagate: 'value' },
611
+ _visibleLabel: { name: '_visibleLabel', propagate: 'visibleLabel' },
596
612
  };
597
613
  class FieldDescriptor extends FormElement {
598
614
  constructor(inputFieldReceived, formConfig) {
@@ -601,48 +617,48 @@ class FieldDescriptor extends FormElement {
601
617
  this._editionPartial = new Subject();
602
618
  this._detailRequest = new Subject();
603
619
  this._attributeChange = new Subject();
604
- this.validateOnServer = false;
605
- this._focus = false;
620
+ this._errorType = '';
621
+ this._errorCode = '';
622
+ this._errorMessage = '';
623
+ this._fieldCode = '';
624
+ this._intrinsicErrorMessage = '';
606
625
  this._maxLength = 0;
607
626
  this._minLength = 0;
627
+ this._focus = false;
608
628
  this._onValidation = false;
609
- this._intrinsicErrorMessage = '';
610
- this.fieldCode = '';
611
- this.fieldInfo = '';
612
- this.defaultValue = '';
613
- this.defaultEditable = false;
614
- this.visibleLabel = false;
615
- this.fieldRequired = false;
616
- this.hasChanged = false;
617
- this.outputOnly = false;
618
- this.captureType = '';
619
- this.fieldTitle = '';
620
- this.fieldType = '';
621
- this.fieldAlignment = '';
622
- this.fieldFormat = null;
623
- this.tooltipText = '';
624
- this.errorType = '';
625
- this.errorCode = '';
626
- this.errorMessage = '';
627
- this.fieldOptions = null;
629
+ this._validateOnServer = false;
630
+ this._visibleLabel = false;
631
+ this._captureType = '';
632
+ this._defaultValue = '';
633
+ this._defaultEditable = false;
634
+ this._fieldAlignment = '';
635
+ this._fieldInfo = '';
636
+ this._fieldRequired = false;
637
+ this._fieldTitle = '';
638
+ this._fieldType = '';
639
+ this._fieldFormat = null;
640
+ this._fieldOptions = null;
641
+ this._hasChanged = false;
642
+ this._outputOnly = false;
643
+ this._tooltipText = '';
628
644
  this.elementType = elementTypes.field;
629
645
  const fld = (inputFieldReceived) ? inputFieldReceived : {};
630
- this.setAttr(fldAttr.code, fld.fieldCode);
631
- this.setAttr(fldAttr.title, fld.fieldTitle ?? this.fieldCode);
632
- this.setAttr(fldAttr.type, fld.fieldTypeCode);
633
- this.setAttr(fldAttr.captureType, fld.captureType ?? DEFAULT_CAPTURE_TYPE);
646
+ this.setAttr(attrs._fieldCode, fld.fieldCode);
647
+ this.title = fld.fieldTitle ?? this._fieldCode;
648
+ this.type = fld.fieldTypeCode;
649
+ this.captureType = fld.captureType ?? DEFAULT_CAPTURE_TYPE;
634
650
  const defaultValue = fld.defaultValue ?? null;
635
- if (this.fieldType === this._formConfig.fieldTypes.boolean) {
636
- this.setAttr(fldAttr.defaultValue, defaultValue ?? false);
651
+ if (this._fieldType === this._formConfig.fieldTypes.boolean) {
652
+ this.defaultValue = defaultValue ?? false;
637
653
  }
638
654
  else {
639
- this.setAttr(fldAttr.defaultValue, defaultValue);
655
+ this.defaultValue = defaultValue;
640
656
  }
641
- const defaultTypeAlignment = (this._formConfig.tableFieldStyles[this.fieldType] != null)
642
- ? this._formConfig.tableFieldStyles[this.fieldType]['text-align'] : DEFAULT_ALIGNMENT;
657
+ const defaultTypeAlignment = (this._formConfig.tableFieldStyles[this._fieldType] != null)
658
+ ? this._formConfig.tableFieldStyles[this._fieldType]['text-align'] : DEFAULT_ALIGNMENT;
643
659
  const fieldAlignment = (fld.alignment != null) ? fld.alignment.toLowerCase() : defaultTypeAlignment;
644
- this.setAttr(fldAttr.alignment, fieldAlignment);
645
- this.setAttr(fldAttr.info, fld.info || '');
660
+ this.alignment = fieldAlignment;
661
+ this.info = fld.info || '';
646
662
  let fieldFormat;
647
663
  try {
648
664
  fieldFormat = (fld.format) ? new RegExp(fld.format) : null;
@@ -650,70 +666,254 @@ class FieldDescriptor extends FormElement {
650
666
  catch (e) {
651
667
  fieldFormat = null;
652
668
  }
653
- this.setAttr(fldAttr.format, fieldFormat);
654
- this.setAttr(fldAttr.validateOnServer, fld.serverAction ?? false);
655
- this.setAttr(fldAttr.tooltipText, fld.tooltip || '');
656
- this.setAttr(fldAttr.defaultEditable, this.enabled);
657
- this.setAttr(fldAttr.required, fld.required ?? false);
658
- this.setError(fld.errorCode, fld.errorMessage, fld.errorType ?? DEFAULT_ERROR_TYPE);
659
- this.setAttr(fldAttr.outputOnly, fld.outputOnly ?? false);
660
- const maxLength = fld.maxLength ?? (this.captureType === 'TEXTAREA' ? BIG_MAX_LENGTH : STD_MAX_LENGTH);
661
- this.setAttr(fldAttr.maxLength, maxLength);
662
- const intrinsicErrorMessage = this._formConfig?.fieldValidations?.[this.fieldType]?.message
669
+ this.format = fieldFormat;
670
+ this.validateOnServer = fld.serverAction ?? false;
671
+ this.tooltip = fld.tooltip || '';
672
+ this.defaultEditable = this.enabled;
673
+ this.required = fld.required ?? false;
674
+ this.outputOnly = fld.outputOnly ?? false;
675
+ this.maxLength = fld.maxLength ?? (this._captureType === 'TEXTAREA' ? BIG_MAX_LENGTH : STD_MAX_LENGTH);
676
+ this.intrinsicErrorMessage = this._formConfig?.fieldValidations?.[this._fieldType]?.message
663
677
  ?? this._formConfig?.fieldValidations?.DEFAULT?.message ?? '';
664
- this.setAttr(fldAttr.intrinsicErrorMessage, intrinsicErrorMessage);
678
+ this.setError(fld.errorCode, fld.errorMessage, fld.errorType ?? DEFAULT_ERROR_TYPE);
665
679
  this.setEditable(fld.editable ?? true);
666
- this.setVisibleLabel(fld.visibleLabel ?? true);
680
+ this.visibleLabel = fld.visibleLabel ?? true;
667
681
  this.setVisibility(fld.visible);
668
- this.setFieldOptions(fld.fieldOptions);
669
- this.setValue(fld.fieldValue ?? this.defaultValue ?? '');
682
+ this.options = fld.fieldOptions;
683
+ this._setValue(fld.fieldValue ?? this._defaultValue ?? '');
670
684
  }
671
- get name() { return this.fieldCode; }
672
- get editionFinish() { return this._editionFinish; }
685
+ get alignment() { return this._fieldAlignment; }
686
+ set alignment(alignment) { this.setAttr(attrs._fieldAlignment, alignment); }
673
687
  get attributeChange() { return this._attributeChange; }
674
- get editionPartial() { return this._editionPartial; }
688
+ get backend() { return this._validateOnServer; }
689
+ get captureType() { return this._captureType; }
690
+ set captureType(captureType) { this.setAttr(attrs._captureType, captureType); }
691
+ get code() { return this._fieldCode; }
692
+ get fieldCode() { return this._fieldCode; }
693
+ get defaultValue() { return this._defaultValue; }
694
+ set defaultValue(defaultValue) { this.setAttr(attrs._defaultValue, defaultValue); }
695
+ get defaultEditable() { return this._defaultEditable; }
696
+ set defaultEditable(editable) { this.setAttr(attrs._defaultEditable, editable); }
675
697
  get detailRequest() { return this._detailRequest; }
676
- get info() { return this.fieldInfo; }
677
- get validating() { return this._onValidation; }
678
- set validating(isValidating) { this.setAttr(fldAttr.onValidation, isValidating); }
679
- focus() { this.setAttr(fldAttr.focus, true); }
680
- setIntrinsicErrorMessage(message) { this.setAttr(fldAttr.intrinsicErrorMessage, message); }
681
- set intrinsicErrorMessage(message) { this.setIntrinsicErrorMessage(message); }
682
- get fieldValue() { return this.getValue(); }
683
- getRequired() { return this.required; }
684
- setRequired(required) { this.required = required; }
685
- get required() { return this.fieldRequired; }
686
- set required(required) { this.setAttr(fldAttr.required, required ?? false); }
687
- get minLength() { return this._minLength; }
688
- set minLength(requiredMinLength) {
689
- this.setAttr(fldAttr.minLength, requiredMinLength);
698
+ get editionFinish() { return this._editionFinish; }
699
+ get editionPartial() { return this._editionPartial; }
700
+ get empty() {
701
+ const fieldCurrentValue = this.value;
702
+ if (fieldCurrentValue === undefined || fieldCurrentValue === null) {
703
+ return true;
704
+ }
705
+ if (this._fieldType === this._formConfig.fieldTypes.array
706
+ && Array.isArray(fieldCurrentValue) && fieldCurrentValue.length === 0) {
707
+ return true;
708
+ }
709
+ ;
710
+ if (this._fieldType === this._formConfig.fieldTypes.phone) {
711
+ if (!Array.isArray(fieldCurrentValue)) {
712
+ return true;
713
+ }
714
+ if (fieldCurrentValue.length !== 2 || !fieldCurrentValue[0] || !fieldCurrentValue[1]) {
715
+ return true;
716
+ }
717
+ return false;
718
+ }
719
+ ;
720
+ return fieldCurrentValue === '';
690
721
  }
722
+ get error() { return { type: this._errorType, code: this._errorCode, message: this._errorMessage }; }
723
+ set error(errorObj) { this.setError(errorObj.code, errorObj.message, errorObj.type ?? DEFAULT_ERROR_TYPE); }
724
+ get errorCode() { return this._errorCode; }
725
+ set errorCode(code) { this.setError(code, this._errorMessage); }
726
+ get errorMessage() { return this._errorMessage; }
727
+ set errorMessage(msg) { this.setError(this._errorCode, msg); }
728
+ get errorType() { return this._errorType; }
729
+ get externalValue() { return this._externalValue; }
730
+ get format() { return this._fieldFormat; }
731
+ set format(format) { this.setAttr(attrs._fieldFormat, format); }
732
+ get hasChanged() { return this._hasChanged; }
733
+ set hasChanged(hasChanged) { this.setAttr(attrs._hasChanged, hasChanged); }
734
+ get info() { return this._fieldInfo; }
735
+ set info(newInfo) { this.setAttr(attrs._fieldInfo, newInfo); }
736
+ set intrinsicErrorMessage(message) { this.setAttr(attrs._intrinsicErrorMessage, message); }
691
737
  get maxLength() { return (this._maxLength > 0) ? this._maxLength.toString() : ''; }
692
- set maxLength(requiredMaxLength) {
693
- if (typeof requiredMaxLength === 'string') {
694
- this.setAttr(fldAttr.maxLength, parseInt(requiredMaxLength, 10));
738
+ set maxLength(requiredMaxLength) { this.setAttr(attrs._maxLength, +requiredMaxLength); }
739
+ get maxValue() { return this._maxValue; }
740
+ set maxValue(inputMaxValue) {
741
+ let maxValue = inputMaxValue;
742
+ if (this._fieldType === this._formConfig.fieldTypes.date) {
743
+ maxValue = new Date(maxValue);
744
+ }
745
+ this.setAttr(attrs._maxValue, maxValue);
746
+ }
747
+ get minLength() { return this._minLength; }
748
+ set minLength(requiredMinLength) { this.setAttr(attrs._minLength, +requiredMinLength); }
749
+ get minValue() { return this._minValue; }
750
+ set minValue(inputMinValue) {
751
+ let minValue = inputMinValue;
752
+ if (this._fieldType === this._formConfig.fieldTypes.date) {
753
+ minValue = new Date(minValue);
754
+ }
755
+ this.setAttr(attrs._minValue, minValue);
756
+ }
757
+ get name() { return this._fieldCode; }
758
+ get options() {
759
+ return this._fieldOptions?.map(option => {
760
+ const optionCopy = { ...option };
761
+ return optionCopy;
762
+ }) ?? null;
763
+ }
764
+ set options(newOptions) {
765
+ if ((!this._formConfig.captureTypesWithOptions.includes(this._captureType))
766
+ || typeof newOptions === UNDEFINED || !newOptions
767
+ || !Array.isArray(newOptions)) {
768
+ return;
769
+ }
770
+ let fieldOptions = newOptions.map((option) => {
771
+ if (option.text !== undefined && option.text !== null
772
+ && option.value !== undefined && option.value !== null) {
773
+ return { fieldOptionValue: option.text, fieldOptionId: option.value };
774
+ }
775
+ return option;
776
+ });
777
+ fieldOptions = (fieldOptions && Array.isArray(fieldOptions)
778
+ && fieldOptions.length > 0) ? fieldOptions : [];
779
+ this.setAttr(attrs._fieldOptions, fieldOptions);
780
+ if (this._value) {
781
+ if (this._fieldType === this._formConfig.fieldTypes.array && Array.isArray(this._value)) {
782
+ const fieldValue = this._value?.filter(item => this._fieldOptions?.find(opt => opt.fieldOptionId === item));
783
+ this.setAttr(attrs._value, fieldValue);
784
+ }
785
+ else {
786
+ const valInOptions = this._fieldOptions?.find(item => item.fieldOptionId === this._value);
787
+ if (!valInOptions) {
788
+ this._setValue('');
789
+ }
790
+ }
695
791
  }
696
- else if (typeof requiredMaxLength === 'number') {
697
- this.setAttr(fldAttr.maxLength, requiredMaxLength);
792
+ if (this._fieldRequired && this._fieldOptions?.length === 1) {
793
+ this._setValue(this._fieldOptions?.[0].fieldOptionId);
794
+ this.notifyEditionFinish();
698
795
  }
699
796
  }
700
- get value() { return this.getValue(); }
701
- set value(newValue) { this.setValue(newValue); }
797
+ get optionText() { return this._fieldOptions?.find(item => item.fieldOptionId === this._value)?.fieldOptionValue ?? null; }
798
+ get outputOnly() { return this._outputOnly; }
799
+ set outputOnly(outputOnly) { this.setAttr(attrs._outputOnly, outputOnly); }
800
+ get required() { return this._fieldRequired; }
801
+ set required(required) { this.setAttr(attrs._fieldRequired, required ?? false); }
802
+ get title() { return this._fieldTitle; }
803
+ set title(title) { this.setAttr(attrs._fieldTitle, title.toString()); }
804
+ get tooltip() { return this._tooltipText; }
805
+ set tooltip(tooltip) { this.setAttr(attrs._tooltipText, tooltip); }
806
+ get type() { return this._fieldType; }
807
+ set type(fieldType) { this.setAttr(attrs._fieldType, fieldType); }
808
+ get validating() { return this._onValidation; }
809
+ set validating(isValidating) { this.setAttr(attrs._onValidation, isValidating); }
810
+ get value() {
811
+ return (this._fieldType === this._formConfig.fieldTypes.boolean
812
+ || this._fieldType === this._formConfig.fieldTypes.check) ? yn(this._value) : this._value;
813
+ }
814
+ get validateOnServer() { return this._validateOnServer; }
815
+ set validateOnServer(validateOnServer) { this.setAttr(attrs._validateOnServer, validateOnServer); }
816
+ get serverAction() { return this._validateOnServer; }
817
+ set serverAction(validateOnServer) { this.validateOnServer = validateOnServer; }
818
+ set value(newValue) { this._setValue(newValue); }
819
+ get visibleLabel() { return this._visibleLabel; }
820
+ set visibleLabel(visibleLabel) { this.setAttr(attrs._visibleLabel, visibleLabel); }
821
+ /**
822
+ * @deprecated Use options
823
+ */
824
+ get fieldOptions() { return this._fieldOptions; }
825
+ /**
826
+ * @deprecated Use options
827
+ */
828
+ set fieldOptions(options) { this.options = options; }
829
+ /**
830
+ * @deprecated Use value
831
+ */
832
+ get fieldValue() { return this.value; }
833
+ /**
834
+ * @deprecated Use hasChanged
835
+ */
836
+ changed(hasChanged = true) { this.hasChanged = hasChanged; }
837
+ clean() { this._setValue(this._defaultValue || ''); this.resetError(); }
838
+ focus() { this.setAttr(attrs._focus, true); }
839
+ getErrorCode() { return this.error.code; }
840
+ setErrorCode(code) { this.setError(code, this._errorMessage); }
841
+ getErrorMessage() { return this.error.message; }
842
+ setErrorMessage(msg) { this.setError(this._errorCode, msg); }
843
+ getRequired() { return this.required; }
844
+ hasError() { return this._errorCode !== NO_ERROR; }
845
+ hideLabel() { this.visibleLabel = false; }
846
+ resetError() { (this._errorCode !== NO_ERROR) && this.setError(NO_ERROR, null); }
847
+ setEditable(editable = true) { (editable) ? this.enable() : this.disable(); }
848
+ setValue(newValue, widgetUpdate = true) { this._setValue(newValue, widgetUpdate); }
849
+ showLabel() { this.visibleLabel = true; }
850
+ /**
851
+ * @deprecated Use title
852
+ */
853
+ setLabel(label) { this.title = label; }
854
+ /**
855
+ * @deprecated Use required
856
+ */
857
+ setRequired(required) { this.required = required; }
858
+ /**
859
+ * @deprecated Use changed
860
+ */
861
+ setChanged(hasChanged) { this.changed(hasChanged); }
862
+ /**
863
+ * @deprecated Use value
864
+ */
865
+ getValue() { return this.value; }
866
+ /**
867
+ * @deprecated Use empty
868
+ */
869
+ isEmpty() { return this.empty; }
870
+ /**
871
+ * @deprecated Use error
872
+ */
873
+ getError() { return this.error; }
874
+ /**
875
+ * @deprecated Use optionText
876
+ */
877
+ getOptionText() { return this.optionText; }
878
+ /**
879
+ * @deprecated Use options
880
+ */
881
+ getFieldOptions() { return this.options; }
882
+ /**
883
+ * @deprecated Use options
884
+ */
885
+ setFieldOptions(newOptions) { return this.options = newOptions; }
886
+ /**
887
+ * @deprecated Use intrinsicErrorMessage
888
+ */
889
+ setIntrinsicErrorMessage(message) { this.intrinsicErrorMessage = message; }
890
+ /**
891
+ * @deprecated Use maxValue
892
+ */
893
+ setMaxValue(inputMaxValue) { this.maxValue = inputMaxValue; }
894
+ /**
895
+ * @deprecated Use minValue
896
+ */
897
+ setMinValue(inputMinValue) { this.minValue = inputMinValue; }
898
+ /**
899
+ * @deprecated Use showLabel
900
+ */
901
+ setVisibleLabel(visibleLabel) { this.visibleLabel = visibleLabel; }
702
902
  notifyEditionPartial() {
703
903
  this.resetError();
704
- this._editionPartial.next({ code: this.fieldCode, intrinsicValidation: true });
904
+ this._editionPartial.next({ code: this._fieldCode, intrinsicValidation: true });
705
905
  }
706
906
  notifyEditionFinish() {
707
- const fieldValue = this.getValue();
907
+ const fieldValue = this.value;
708
908
  this.resetError();
709
- const validationConfig = this._formConfig.fieldValidations?.[this.fieldType] ?? {};
909
+ const validationConfig = this._formConfig.fieldValidations?.[this._fieldType] ?? {};
710
910
  const { type, validation } = validationConfig;
711
911
  let message = validationConfig?.message;
712
912
  let intrinsicValidation = true;
713
- if (fieldValue && (validation || this.fieldFormat)) {
913
+ if (fieldValue && (validation || this._fieldFormat)) {
714
914
  if (type === 'regexp') {
715
915
  intrinsicValidation = (validation?.test(fieldValue) ?? true)
716
- && (this.fieldFormat?.test(fieldValue) ?? true);
916
+ && (this._fieldFormat?.test(fieldValue) ?? true);
717
917
  }
718
918
  else if (type === 'function' && typeof validation === 'function') {
719
919
  const { valid, message: customMessage } = validation(fieldValue, this);
@@ -735,155 +935,48 @@ class FieldDescriptor extends FormElement {
735
935
  if (intrinsicValidation && fieldValue && typeof fieldValue === 'string'
736
936
  && this._minLength && fieldValue?.length < this._minLength) {
737
937
  intrinsicValidation = false;
738
- this.setError('99', `Longitud de ${this.fieldTitle} debe ser de al menos ${this._minLength}`);
739
- }
740
- this._editionFinish.next({ code: this.fieldCode, intrinsicValidation });
741
- }
742
- setAttr(name, value) {
743
- this[name] = value;
744
- if (this._formConfig.monitoredFieldAttributes.includes(name)) {
745
- this._attributeChange.next({ name, value });
938
+ this.setError('99', `Longitud de ${this._fieldTitle} debe ser de al menos ${this._minLength}`);
746
939
  }
940
+ this._editionFinish.next({ code: this._fieldCode, intrinsicValidation });
747
941
  }
748
942
  notifyEditionDetailRequest(detail) {
749
- const detailEvent = {
750
- code: this.fieldCode,
751
- detail,
752
- };
943
+ const detailEvent = { code: this._fieldCode, detail };
753
944
  this._detailRequest.next(detailEvent);
754
945
  }
755
- setVisibleLabel(visibleLabel) { this.setAttr(fldAttr.visibleLabel, visibleLabel); }
756
- showLabel() { this.setVisibleLabel(true); }
757
- hideLabel() { this.setVisibleLabel(false); }
758
- setChanged(hasChanged) { this.setAttr(fldAttr.hasChanged, hasChanged); }
759
- changed() { this.setChanged(true); }
760
- setLabel(label) { this.setAttr(fldAttr.title, label); }
761
- clean() { this.setValue(this.defaultValue || ''); this.resetError(); }
762
- get backend() { return this.validateOnServer; }
763
- setEditable(editable = true) { (editable) ? this.enable() : this.disable(); }
764
- hasError() { return this.errorCode !== NO_ERROR; }
765
- resetError() { (this.errorCode !== NO_ERROR) && this.setError(NO_ERROR, null); }
766
- setError(code, message, type = DEFAULT_ERROR_TYPE) {
767
- this.setAttr(fldAttr.errorCode, code ?? NO_ERROR);
768
- this.setAttr(fldAttr.errorType, (this.errorCode === NO_ERROR) ? '' : type);
769
- this.setAttr(fldAttr.errorMessage, message ?? '');
946
+ setAttr(attr, value) {
947
+ const { name: attrName, propagate: name } = attr;
948
+ this[attrName] = value;
949
+ name && this._attributeChange.next({ name, value });
770
950
  }
771
- getError() { return { type: this.errorType, code: this.errorCode, message: this.errorMessage }; }
772
- get error() { return this.getError(); }
773
- set error(errorObj) { this.setError(errorObj.code, errorObj.message, errorObj.type ?? DEFAULT_ERROR_TYPE); }
774
- getErrorCode() { return this.getError().code; }
775
- setErrorCode(code) { this.setError(code, this.errorMessage); }
776
- getErrorMessage() { return this.getError().message; }
777
- setErrorMessage(msg) { this.setError(this.errorCode, msg); }
778
- get empty() { return this.isEmpty(); }
779
- isEmpty() {
780
- const fieldCurrentValue = this.getValue();
781
- if (fieldCurrentValue === undefined || fieldCurrentValue === null) {
782
- return true;
783
- }
784
- if (this.fieldType === this._formConfig.fieldTypes.array
785
- && Array.isArray(fieldCurrentValue) && fieldCurrentValue.length === 0) {
786
- return true;
787
- }
788
- ;
789
- if (this.fieldType === this._formConfig.fieldTypes.phone) {
790
- if (!Array.isArray(fieldCurrentValue)) {
791
- return true;
792
- }
793
- if (fieldCurrentValue.length !== 2 || !fieldCurrentValue[0] || !fieldCurrentValue[1]) {
794
- return true;
795
- }
796
- return false;
797
- }
798
- ;
799
- return fieldCurrentValue === '';
800
- }
801
- getValue() {
802
- if (this.fieldType === this._formConfig.fieldTypes.boolean
803
- || this.fieldType === this._formConfig.fieldTypes.check) {
804
- return yn(this._value);
805
- }
806
- return this._value;
807
- }
808
- getOptionText() {
809
- return this.fieldOptions?.find(item => item.fieldOptionId === this._value)?.fieldOptionValue ?? null;
951
+ setError(code, message, type = DEFAULT_ERROR_TYPE) {
952
+ this.setAttr(attrs._errorCode, code ?? NO_ERROR);
953
+ this.setAttr(attrs._errorType, (this._errorCode === NO_ERROR) ? '' : type);
954
+ this.setAttr(attrs._errorMessage, message ?? '');
810
955
  }
811
956
  updateFromServer(fld) {
812
957
  const fieldKeys = Object.keys(fld);
813
958
  for (let index = 0; index < fieldKeys.length; index++) {
814
959
  const attrName = fieldKeys[index];
815
960
  const attrValue = fld[attrName];
816
- (attrName === this._formConfig.apiFieldAttrs.visible) && this.setVisibility(attrValue);
817
- (attrName === this._formConfig.apiFieldAttrs.labelVisible) && this.setVisibleLabel(fld.visibleLabel);
818
- (attrName === this._formConfig.apiFieldAttrs.required) && this.setAttr(fldAttr.required, fld.required ?? false);
819
- (attrName === this._formConfig.apiFieldAttrs.errorCode) && this.setAttr(fldAttr.errorCode, fld.errorCode);
820
- (attrName === this._formConfig.apiFieldAttrs.errorMessage) && this.setAttr(fldAttr.errorMessage, fld.errorMessage);
821
- (attrName === this._formConfig.apiFieldAttrs.tooltip) && this.setAttr(fldAttr.tooltipText, fld.tooltip);
822
- (attrName === this._formConfig.apiFieldAttrs.info) && this.setAttr(fldAttr.info, fld.info);
823
- (attrName === this._formConfig.apiFieldAttrs.editable) && this.setEditable(fld.editable);
824
- (attrName === this._formConfig.apiFieldAttrs.title) && this.setLabel(fld.fieldTitle.toString());
825
- (attrName === this._formConfig.apiFieldAttrs.value) && (this.setValue(fld.fieldValue) && this.setChanged(false));
826
- (attrName === this._formConfig.apiFieldAttrs.options) && this.setFieldOptions(fld.fieldOptions);
827
- (attrName === this._formConfig.apiFieldAttrs.captureType) && this.setAttr(fldAttr.captureType, fld.captureType || 'INPUT');
828
- (attrName === this._formConfig.apiFieldAttrs.type) && this.setAttr(fldAttr.type, fld.fieldTypeCode);
829
- (attrName === this._formConfig.apiFieldAttrs.maxLength) && this.setAttr(fldAttr.maxLength, fld.maxLength);
830
- }
831
- }
832
- setMinValue(inputMinValue) {
833
- let minValue = inputMinValue;
834
- if (this.fieldType === this._formConfig.fieldTypes.date) {
835
- minValue = new Date(minValue);
836
- }
837
- this.setAttr(fldAttr.minValue, minValue);
838
- }
839
- setMaxValue(inputMaxValue) {
840
- let maxValue = inputMaxValue;
841
- if (this.fieldType === this._formConfig.fieldTypes.date) {
842
- maxValue = new Date(maxValue);
843
- }
844
- this.setAttr(fldAttr.maxValue, maxValue);
845
- }
846
- getFieldOptions() {
847
- return this.fieldOptions.map(option => {
848
- const optionCopy = { ...option };
849
- return optionCopy;
850
- });
851
- }
852
- setFieldOptions(newOptions) {
853
- if ((!this._formConfig.captureTypesWithOptions.includes(this.captureType))
854
- || typeof newOptions === UNDEFINED || !newOptions
855
- || !Array.isArray(newOptions)) {
856
- return;
857
- }
858
- let fieldOptions = newOptions.map(option => {
859
- if (option.text !== undefined && option.text !== null
860
- && option.value !== undefined && option.value !== null) {
861
- return { fieldOptionValue: option.text, fieldOptionId: option.value };
862
- }
863
- return { ...option };
864
- });
865
- fieldOptions = (fieldOptions && Array.isArray(fieldOptions)
866
- && fieldOptions.length > 0) ? fieldOptions : [];
867
- this.setAttr(fldAttr.options, fieldOptions);
868
- if (this._value) {
869
- if (this.fieldType === this._formConfig.fieldTypes.array && Array.isArray(this._value)) {
870
- const fieldValue = this._value?.filter(item => this.fieldOptions.find(opt => opt.fieldOptionId === item));
871
- this.setAttr(fldAttr.value, fieldValue);
961
+ if (directChanges.includes(attrName)) {
962
+ this[attrName] = attrValue;
872
963
  }
873
964
  else {
874
- const valInOptions = this.fieldOptions
875
- .find(item => item.fieldOptionId === this._value);
876
- if (!valInOptions) {
877
- this.setValue('');
878
- }
965
+ (attrName === 'label') && (this.title = attrValue);
966
+ (attrName === 'labelVisible') && (this.visibleLabel = attrValue);
967
+ (attrName === 'editable') && this.setEditable(attrValue);
968
+ (attrName === 'visible') && this.setVisibility(attrValue);
969
+ (attrName === 'value') && (this._setValue(attrValue) && (this.hasChanged = false));
970
+ (attrName === 'fieldValue') && (this._setValue(attrValue) && (this.hasChanged = false));
971
+ (attrName === 'fieldOptions') && (this.options = attrValue);
972
+ (attrName === 'fieldTitle') && (this.title = attrValue);
973
+ (attrName === 'fieldTypeCode') && (this.type = attrValue);
974
+ (attrName === 'fieldType') && (this.type = attrValue);
975
+ (attrName === 'tooltipText') && (this.tooltip = attrValue);
879
976
  }
880
977
  }
881
- if (this.fieldRequired && this.fieldOptions.length === 1) {
882
- this.setValue(this.fieldOptions[0].fieldOptionId);
883
- this.notifyEditionFinish();
884
- }
885
978
  }
886
- setValue(newValue, widgetUpdate = true) {
979
+ _setValue(newValue, widgetUpdate = true) {
887
980
  if (typeof newValue === UNDEFINED) {
888
981
  return true;
889
982
  }
@@ -891,12 +984,12 @@ class FieldDescriptor extends FormElement {
891
984
  return true;
892
985
  }
893
986
  let newFinalValue;
894
- if (this.fieldType === this._formConfig.fieldTypes.boolean
895
- || this.fieldType === this._formConfig.fieldTypes.check) {
987
+ if (this._fieldType === this._formConfig.fieldTypes.boolean
988
+ || this._fieldType === this._formConfig.fieldTypes.check) {
896
989
  newFinalValue = yn(newValue) ?? false;
897
990
  }
898
- else if (this.fieldType === this._formConfig.fieldTypes.array
899
- || this.fieldType === this._formConfig.fieldTypes.map) {
991
+ else if (this._fieldType === this._formConfig.fieldTypes.array
992
+ || this._fieldType === this._formConfig.fieldTypes.map) {
900
993
  if (newValue === null || newValue === '') {
901
994
  newFinalValue = [];
902
995
  }
@@ -911,9 +1004,9 @@ class FieldDescriptor extends FormElement {
911
1004
  newFinalValue = newValue;
912
1005
  }
913
1006
  if (this._value !== newFinalValue) {
914
- this.setChanged(true);
1007
+ this.hasChanged = true;
915
1008
  if (widgetUpdate) {
916
- this.setAttr(fldAttr.value, newFinalValue);
1009
+ this.setAttr(attrs._value, newFinalValue);
917
1010
  }
918
1011
  else {
919
1012
  this._value = newFinalValue;
@@ -1553,7 +1646,7 @@ class RecordFormSubSection {
1553
1646
  return this.subSectionFields;
1554
1647
  }
1555
1648
  getFieldNames() {
1556
- return this.subSectionFields.map(field => field.fieldCode);
1649
+ return this.subSectionFields.map(field => field.code);
1557
1650
  }
1558
1651
  getActions() {
1559
1652
  return this.subSectionActions;
@@ -1770,7 +1863,7 @@ class FormStructureAndData {
1770
1863
  });
1771
1864
  for (const fieldReceived of formFields) {
1772
1865
  const fieldToAdd = new FieldDescriptor(fieldReceived, this._formConfig);
1773
- const fieldCode = fieldToAdd.fieldCode;
1866
+ const fieldCode = fieldToAdd.code;
1774
1867
  if (fieldCode) {
1775
1868
  this._fieldArray.push(fieldToAdd);
1776
1869
  this._fields[fieldCode] = fieldToAdd;
@@ -1865,13 +1958,13 @@ class FormStructureAndData {
1865
1958
  get fields() { return this._fields; }
1866
1959
  get fieldNames() { return this.getFieldNames(); }
1867
1960
  getFields() { return this._fieldArray; }
1868
- getFieldNames() { return this._fieldArray.map(field => field.fieldCode); }
1961
+ getFieldNames() { return this._fieldArray.map(field => field.code); }
1869
1962
  getField(code) { return (code && this._fields?.[code]) ? this._fields[code] : null; }
1870
1963
  enableField(code) { this.getField(code)?.enable(); }
1871
1964
  disableField(code) { this.getField(code)?.disable(); }
1872
- getFieldValue(code) { return this.getField(code)?.getValue(); }
1873
- getFieldOptionText(code) { return this.getField(code)?.getOptionText(); }
1874
- getFieldOptions(code) { return this.getField(code)?.getFieldOptions() ?? null; }
1965
+ getFieldValue(code) { return this.getField(code)?.value; }
1966
+ getFieldOptionText(code) { return this.getField(code)?.optionText; }
1967
+ getFieldOptions(code) { return this.getField(code)?.options ?? null; }
1875
1968
  setFieldValue(code, value) { this.getField(code)?.setValue(value); }
1876
1969
  setFieldError(code, errorCode, message, type = 'error') { this.getField(code)?.setError(errorCode, message, type); }
1877
1970
  setFieldIntrinsicErrorMessage(code, message) { this.getField(code)?.setIntrinsicErrorMessage(message); }
@@ -1879,7 +1972,8 @@ class FormStructureAndData {
1879
1972
  const codes = this.getFieldSet(null, inputCodes ?? null);
1880
1973
  for (const code of codes) {
1881
1974
  try {
1882
- this.getField(code)?.setRequired(required);
1975
+ const field = this.getField(code) ?? null;
1976
+ field && (field.required = required);
1883
1977
  }
1884
1978
  catch (e) {
1885
1979
  console.log(`Error modificando campo ${code}: ${e}`);
@@ -1939,28 +2033,28 @@ class FormStructureAndData {
1939
2033
  return processedFields;
1940
2034
  }
1941
2035
  enableFields(codes, secCode, subCode) {
1942
- return this.applyOnFields(fld => fld.enable(), codes, secCode, subCode);
2036
+ return this.applyOnFields(fld => fld?.enable(), codes, secCode, subCode);
1943
2037
  }
1944
2038
  showFields(codes, secCode, subCode) {
1945
- return this.applyOnFields(fld => fld.show(), codes, secCode, subCode);
2039
+ return this.applyOnFields(fld => fld?.show(), codes, secCode, subCode);
1946
2040
  }
1947
2041
  hideFields(codes, secCode, subCode) {
1948
- return this.applyOnFields(fld => fld.hide(), codes, secCode, subCode);
2042
+ return this.applyOnFields(fld => fld?.hide(), codes, secCode, subCode);
1949
2043
  }
1950
2044
  showLabelFields(codes, secCode, subCode) {
1951
- return this.applyOnFields(fld => fld.showLablel(), codes, secCode, subCode);
2045
+ return this.applyOnFields(fld => fld?.showLablel(), codes, secCode, subCode);
1952
2046
  }
1953
2047
  hideLabelFields(codes, secCode, subCode) {
1954
- return this.applyOnFields(fld => fld.hideLabel(), codes, secCode, subCode);
2048
+ return this.applyOnFields(fld => fld?.hideLabel(), codes, secCode, subCode);
1955
2049
  }
1956
2050
  disableFields(codes, secCode, subCode) {
1957
- return this.applyOnFields(fld => fld.disable(), codes, secCode, subCode);
2051
+ return this.applyOnFields(fld => fld?.disable(), codes, secCode, subCode);
1958
2052
  }
1959
2053
  cleanFields(codes, secCode, subCode) {
1960
- return this.applyOnFields(fld => fld.clean(), codes, secCode, subCode);
2054
+ return this.applyOnFields(fld => fld?.clean(), codes, secCode, subCode);
1961
2055
  }
1962
2056
  tagFieldsWithError(message, codes, secCode, subCode) {
1963
- return this.applyOnFields(fld => fld.setErrorMessage(message), codes, secCode, subCode);
2057
+ return this.applyOnFields(fld => fld?.setErrorMessage(message), codes, secCode, subCode);
1964
2058
  }
1965
2059
  cleanErrorFields(codes, secCode, subCode) {
1966
2060
  return this.tagFieldsWithError('', codes, secCode, subCode);
@@ -1969,16 +2063,16 @@ class FormStructureAndData {
1969
2063
  return this.tagFieldsWithError(message, this.getRequiredEmptyFields(codes, secCode, subCode)) > 0;
1970
2064
  }
1971
2065
  getRequiredFields(codes, secCode, subCode) {
1972
- return this.getFieldSet(fld => fld.required, codes ?? null, secCode, subCode);
2066
+ return this.getFieldSet(fld => fld?.required, codes ?? null, secCode, subCode);
1973
2067
  }
1974
2068
  getRequiredEmptyFields(codes, secCode, subCode) {
1975
- return this.getFieldSet(fld => fld.required && fld.empty, codes ?? null, secCode, subCode);
2069
+ return this.getFieldSet(fld => fld?.required && fld?.empty, codes ?? null, secCode, subCode);
1976
2070
  }
1977
2071
  getChangedFields(codes, secCode, subCode) {
1978
- return this.getFieldSet(fld => !fld.outputOnly && fld.hasChanged(), codes ?? null, secCode, subCode);
2072
+ return this.getFieldSet(fld => !fld?.outputOnly && fld?.hasChanged(), codes ?? null, secCode, subCode);
1979
2073
  }
1980
2074
  getFieldsWithValidationIssues(codes, secCode, subCode) {
1981
- return this.getFieldSet(fld => fld.errorCode !== NO_ERROR, codes ?? null, secCode, subCode);
2075
+ return this.getFieldSet(fld => fld?.hasError(), codes ?? null, secCode, subCode);
1982
2076
  }
1983
2077
  getFieldsValues(inputCodes, secCode, subCode) {
1984
2078
  const codes = this.getFieldSet(null, inputCodes ?? null, secCode, subCode);
@@ -2090,14 +2184,14 @@ class FormStructureAndData {
2090
2184
  fields: [],
2091
2185
  tables: [],
2092
2186
  };
2093
- formData.fields = this.getFields().filter(fld => !fld.outputOnly)
2187
+ formData.fields = this.getFields().filter(fld => !fld?.outputOnly)
2094
2188
  .map(fld => {
2095
2189
  const fieldPayload = {
2096
- fieldCode: fld.fieldCode,
2097
- fieldValue: fld.getValue(),
2098
- editable: !fld.disabled,
2099
- visible: fld.visible,
2100
- required: fld.required,
2190
+ fieldCode: fld?.code,
2191
+ fieldValue: fld?.value,
2192
+ editable: !fld?.disabled,
2193
+ visible: fld?.visible,
2194
+ required: fld?.required,
2101
2195
  fieldOptions: '',
2102
2196
  };
2103
2197
  return fieldPayload;
@@ -2238,6 +2332,7 @@ class BasicFormComponent {
2238
2332
  this._formRoute = null;
2239
2333
  this._definitionObtained = false;
2240
2334
  // Eventos de acciones y campos
2335
+ this._formSectionsCanDeactivate = {};
2241
2336
  this._formSectionsActivate = {};
2242
2337
  this._formSectionsInactivate = {};
2243
2338
  this._formActionsStart = {};
@@ -2485,6 +2580,7 @@ class BasicFormComponent {
2485
2580
  // Se limpian los manejadores de eventos
2486
2581
  this.visible = false;
2487
2582
  this.busy = false;
2583
+ this._formSectionsCanDeactivate = {};
2488
2584
  this._formSectionsActivate = {};
2489
2585
  this._formSectionsInactivate = {};
2490
2586
  this._formActionsStart = {};
@@ -2527,7 +2623,7 @@ class BasicFormComponent {
2527
2623
  displayActionServerError() { }
2528
2624
  displayValidationServerError() { }
2529
2625
  displayTableServerError() { }
2530
- showFieldInfo(fieldCode, detail) { }
2626
+ showFieldInfo(code, detail) { }
2531
2627
  showModalDialog(title, body, options, callback, params) { }
2532
2628
  openUploadDialog(title, body, options, callback, params) { }
2533
2629
  /**
@@ -2695,9 +2791,9 @@ class BasicFormComponent {
2695
2791
  this._formStructure?.changeState(initialState || this._formStructure?.defaultState);
2696
2792
  const inputFieldNames = Object.keys(this.inputDataFields);
2697
2793
  for (let index = 0; index < inputFieldNames.length; index++) {
2698
- const fieldCode = inputFieldNames[index];
2699
- const fieldValue = this.inputDataFields[fieldCode];
2700
- this.setFieldValue(fieldCode, fieldValue);
2794
+ const code = inputFieldNames[index];
2795
+ const fieldValue = this.inputDataFields[code];
2796
+ this.setFieldValue(code, fieldValue);
2701
2797
  }
2702
2798
  const recordResponse = await this.requestFormAction(formActions.getData);
2703
2799
  this.checkErrorRecordReceived(recordResponse);
@@ -2821,6 +2917,15 @@ class BasicFormComponent {
2821
2917
  /**
2822
2918
  * Manejo de event handlers para acciones sobre el formulario
2823
2919
  */
2920
+ onSectionCanDeactivate(codes, callback, properties = null) {
2921
+ const sectionSet = (Array.isArray(codes)) ? codes : (codes ? [codes] : []);
2922
+ sectionSet.forEach((sectionName) => {
2923
+ if (!this._formSectionsCanDeactivate[sectionName]) {
2924
+ this._formSectionsCanDeactivate[sectionName] = [];
2925
+ }
2926
+ this._formSectionsCanDeactivate[sectionName].push({ callback, properties });
2927
+ });
2928
+ }
2824
2929
  onSectionActivation(codes, callback, properties = null) {
2825
2930
  const sectionSet = (Array.isArray(codes)) ? codes : (codes ? [codes] : []);
2826
2931
  sectionSet.forEach((sectionName) => {
@@ -2857,6 +2962,23 @@ class BasicFormComponent {
2857
2962
  this._formActionsFinish[actionName].push({ callback, properties });
2858
2963
  });
2859
2964
  }
2965
+ async verifySectionActivation(code) {
2966
+ const sectionObject = this._formStructure?.getSection(code);
2967
+ if (!sectionObject) {
2968
+ return false;
2969
+ }
2970
+ const clientSectionMethods = this._formSectionsCanDeactivate[code];
2971
+ if (clientSectionMethods) {
2972
+ for (const clientSectionMethod of clientSectionMethods) {
2973
+ const { callback, properties } = clientSectionMethod;
2974
+ const canActivate = callback(sectionObject);
2975
+ if (canActivate === false) {
2976
+ return false;
2977
+ }
2978
+ }
2979
+ }
2980
+ return true;
2981
+ }
2860
2982
  async launchSectionActivation(code) {
2861
2983
  const sectionObject = this._formStructure?.getSection(code);
2862
2984
  if (!sectionObject) {
@@ -2950,37 +3072,37 @@ class BasicFormComponent {
2950
3072
  */
2951
3073
  onFieldInput(codes, callback, properties = null) {
2952
3074
  const fieldSet = (Array.isArray(codes)) ? codes : (codes ? [codes] : []);
2953
- fieldSet.forEach((fieldCode) => {
2954
- if (!this._fieldInputValidation[fieldCode]) {
2955
- this._fieldInputValidation[fieldCode] = [];
3075
+ fieldSet.forEach((code) => {
3076
+ if (!this._fieldInputValidation[code]) {
3077
+ this._fieldInputValidation[code] = [];
2956
3078
  }
2957
- this._fieldInputValidation[fieldCode].push({ callback, properties });
3079
+ this._fieldInputValidation[code].push({ callback, properties });
2958
3080
  });
2959
3081
  }
2960
3082
  onFieldValidationStart(codes, callback, properties = null) {
2961
3083
  const fieldSet = (Array.isArray(codes)) ? codes : (codes ? [codes] : []);
2962
- fieldSet.forEach((fieldCode) => {
2963
- if (!this._fieldValidationsStart[fieldCode]) {
2964
- this._fieldValidationsStart[fieldCode] = [];
3084
+ fieldSet.forEach((code) => {
3085
+ if (!this._fieldValidationsStart[code]) {
3086
+ this._fieldValidationsStart[code] = [];
2965
3087
  }
2966
- this._fieldValidationsStart[fieldCode].push({ callback, properties });
3088
+ this._fieldValidationsStart[code].push({ callback, properties });
2967
3089
  });
2968
3090
  }
2969
3091
  onFieldValidationFinish(codes, callback, properties = null) {
2970
3092
  const fieldSet = (Array.isArray(codes)) ? codes : (codes ? [codes] : []);
2971
- fieldSet.forEach((fieldCode) => {
2972
- if (!this._fieldValidationsFinish[fieldCode]) {
2973
- this._fieldValidationsFinish[fieldCode] = [];
3093
+ fieldSet.forEach((code) => {
3094
+ if (!this._fieldValidationsFinish[code]) {
3095
+ this._fieldValidationsFinish[code] = [];
2974
3096
  }
2975
- this._fieldValidationsFinish[fieldCode].push({ callback, properties });
3097
+ this._fieldValidationsFinish[code].push({ callback, properties });
2976
3098
  });
2977
3099
  }
2978
- async startFieldInputValidation(fieldCode, intrinsicValidation = true) {
2979
- const fieldToValidate = this.getField(fieldCode);
3100
+ async startFieldInputValidation(code, intrinsicValidation = true) {
3101
+ const fieldToValidate = this.getField(code);
2980
3102
  if (!fieldToValidate) {
2981
3103
  return false;
2982
3104
  }
2983
- const validationCallbacks = this._fieldInputValidation[fieldCode];
3105
+ const validationCallbacks = this._fieldInputValidation[code];
2984
3106
  if (validationCallbacks) {
2985
3107
  const clientValidationPromises = [];
2986
3108
  for (const validationMethod of validationCallbacks) {
@@ -2992,12 +3114,12 @@ class BasicFormComponent {
2992
3114
  }
2993
3115
  return true;
2994
3116
  }
2995
- async startFieldValidation(fieldCode, intrinsicValidation = true) {
2996
- const fieldToValidate = this.getField(fieldCode);
3117
+ async startFieldValidation(code, intrinsicValidation = true) {
3118
+ const fieldToValidate = this.getField(code);
2997
3119
  if (!fieldToValidate) {
2998
3120
  return;
2999
3121
  }
3000
- const validationCallbacks = this._fieldValidationsStart[fieldCode];
3122
+ const validationCallbacks = this._fieldValidationsStart[code];
3001
3123
  if (validationCallbacks) {
3002
3124
  const clientValidationPromises = [];
3003
3125
  for (const validationMethod of validationCallbacks) {
@@ -3026,10 +3148,9 @@ class BasicFormComponent {
3026
3148
  if (fieldObj.backend) {
3027
3149
  fieldObj.validating = true;
3028
3150
  validationResult = await this
3029
- .requestFormAction(formActions.validate, fieldObj.fieldCode);
3151
+ .requestFormAction(formActions.validate, fieldObj.code);
3030
3152
  serverError = !!this.errorOccured();
3031
3153
  }
3032
- await this.finishFieldValidation(fieldObj, validationResult, serverError);
3033
3154
  if (serverError) {
3034
3155
  fieldObj?.setErrorCode(this.errorCode);
3035
3156
  fieldObj?.setErrorMessage(this.errorMessage);
@@ -3038,10 +3159,11 @@ class BasicFormComponent {
3038
3159
  callback(fieldObj);
3039
3160
  }
3040
3161
  }
3162
+ await this.finishFieldValidation(fieldObj, validationResult, serverError);
3041
3163
  fieldObj.validating = false;
3042
3164
  }
3043
3165
  async finishFieldValidation(fieldObject, validationResult, serverError = false) {
3044
- const validationCallbacks = this._fieldValidationsFinish[fieldObject.fieldCode];
3166
+ const validationCallbacks = this._fieldValidationsFinish[fieldObject.code];
3045
3167
  if (validationCallbacks) {
3046
3168
  const clientActionPromises = [];
3047
3169
  for (const validationMethod of validationCallbacks) {
@@ -3054,8 +3176,8 @@ class BasicFormComponent {
3054
3176
  await Promise.all(clientActionPromises);
3055
3177
  }
3056
3178
  }
3057
- async continueFieldValidation(fieldCode) {
3058
- return this.startServerFieldValidation(fieldCode);
3179
+ async continueFieldValidation(code) {
3180
+ return this.startServerFieldValidation(code);
3059
3181
  }
3060
3182
  /**
3061
3183
  * Manejadores de eventos para acciones sobre Tablas
@@ -3553,8 +3675,8 @@ class BasicFormComponent {
3553
3675
  validationError = true;
3554
3676
  this.setError(this.formConfig.formStandardErrors.typeWarning, this.formConfig.formStandardErrors.validationTitle, this.formConfig.formStandardErrors.requiredFields);
3555
3677
  this.tagFieldsWithError(this.formConfig.formStandardErrors.requiredField, requiredEmptyFields);
3556
- for (const fieldCode of requiredEmptyFields) {
3557
- const requiredEmptyField = this.getField(fieldCode);
3678
+ for (const code of requiredEmptyFields) {
3679
+ const requiredEmptyField = this.getField(code);
3558
3680
  requiredEmptyField?.focus();
3559
3681
  break;
3560
3682
  }
@@ -3563,8 +3685,8 @@ class BasicFormComponent {
3563
3685
  if (!validationError && validationIssueFields.length > 0) {
3564
3686
  validationError = true;
3565
3687
  this.setError(this.formConfig.formStandardErrors.typeWarning, this.formConfig.formStandardErrors.validationTitle, this.formConfig.formStandardErrors.validationFields);
3566
- for (const fieldCode of validationIssueFields) {
3567
- const validationIssueField = this.getField(fieldCode);
3688
+ for (const code of validationIssueFields) {
3689
+ const validationIssueField = this.getField(code);
3568
3690
  if (validationIssueField) {
3569
3691
  validationIssueField.focus();
3570
3692
  }
@@ -3580,8 +3702,8 @@ class BasicFormComponent {
3580
3702
  if (tableRecord && columnNames) {
3581
3703
  for (const columnName of columnNames) {
3582
3704
  const columnValue = tableRecord.getFieldValue(columnName) ?? '';
3583
- const fieldCode = mappingTable?.[columnName] ?? columnName;
3584
- this.setFieldValue(fieldCode, columnValue);
3705
+ const code = mappingTable?.[columnName] ?? columnName;
3706
+ this.setFieldValue(code, columnValue);
3585
3707
  }
3586
3708
  return true;
3587
3709
  }
@@ -3669,9 +3791,9 @@ class BasicFormComponent {
3669
3791
  return this.onTableGetDataFinish(code, callback, properties);
3670
3792
  }
3671
3793
  }
3672
- BasicFormComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: BasicFormComponent, deps: [{ token: LibFormManagerService }, { token: LibEventManagerService }, { token: LibFileManagementService }], target: i0.ɵɵFactoryTarget.Component });
3673
- BasicFormComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.1", type: BasicFormComponent, selector: "ng-component", ngImport: i0, template: `<ng-content></ng-content>`, isInline: true });
3674
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: BasicFormComponent, decorators: [{
3794
+ BasicFormComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.6", ngImport: i0, type: BasicFormComponent, deps: [{ token: LibFormManagerService }, { token: LibEventManagerService }, { token: LibFileManagementService }], target: i0.ɵɵFactoryTarget.Component });
3795
+ BasicFormComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.6", type: BasicFormComponent, selector: "ng-component", ngImport: i0, template: `<ng-content></ng-content>`, isInline: true });
3796
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.6", ngImport: i0, type: BasicFormComponent, decorators: [{
3675
3797
  type: Component,
3676
3798
  args: [{
3677
3799
  template: `<ng-content></ng-content>`
@@ -3693,8 +3815,8 @@ const COMPONENTS = [
3693
3815
  ];
3694
3816
  class TuainNgFormsLibModule {
3695
3817
  }
3696
- TuainNgFormsLibModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: TuainNgFormsLibModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
3697
- TuainNgFormsLibModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: TuainNgFormsLibModule, declarations: [BasicFormComponent,
3818
+ TuainNgFormsLibModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.6", ngImport: i0, type: TuainNgFormsLibModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
3819
+ TuainNgFormsLibModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.2.6", ngImport: i0, type: TuainNgFormsLibModule, declarations: [BasicFormComponent,
3698
3820
  ActionComponent,
3699
3821
  FieldComponent,
3700
3822
  ElementComponent,
@@ -3717,12 +3839,10 @@ TuainNgFormsLibModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", v
3717
3839
  LibTableRecordActionComponent,
3718
3840
  LibTableRecordFieldComponent,
3719
3841
  LibTableComponent] });
3720
- TuainNgFormsLibModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: TuainNgFormsLibModule, imports: [[
3721
- CommonModule,
3722
- RouterModule,
3723
- FormsModule,
3724
- ]] });
3725
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.1", ngImport: i0, type: TuainNgFormsLibModule, decorators: [{
3842
+ TuainNgFormsLibModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.2.6", ngImport: i0, type: TuainNgFormsLibModule, imports: [CommonModule,
3843
+ RouterModule,
3844
+ FormsModule] });
3845
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.6", ngImport: i0, type: TuainNgFormsLibModule, decorators: [{
3726
3846
  type: NgModule,
3727
3847
  args: [{
3728
3848
  declarations: COMPONENTS,