tuain-ng-forms-lib 14.4.96 → 14.5.10

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/action.mjs +23 -4
  2. package/esm2020/lib/classes/forms/element.mjs +1 -9
  3. package/esm2020/lib/classes/forms/field.mjs +19 -28
  4. package/esm2020/lib/classes/forms/form.mjs +2 -2
  5. package/esm2020/lib/classes/forms/piece.mjs +6 -4
  6. package/esm2020/lib/classes/forms/section.mjs +3 -3
  7. package/esm2020/lib/classes/forms/table/action.mjs +28 -4
  8. package/esm2020/lib/classes/forms/table/table.mjs +4 -4
  9. package/esm2020/lib/components/elements/action.component.mjs +2 -24
  10. package/esm2020/lib/components/elements/layout/element.component.mjs +5 -5
  11. package/esm2020/lib/components/elements/layout/form-header.component.mjs +2 -9
  12. package/esm2020/lib/components/elements/layout/piece.component.mjs +2 -1
  13. package/esm2020/lib/components/elements/layout/section.component.mjs +5 -5
  14. package/esm2020/lib/components/elements/layout/sub-section.component.mjs +5 -5
  15. package/esm2020/lib/components/elements/tables/table-record-action.component.mjs +4 -2
  16. package/esm2020/lib/components/forms/basic-form.mjs +12 -8
  17. package/fesm2015/tuain-ng-forms-lib.mjs +115 -104
  18. package/fesm2015/tuain-ng-forms-lib.mjs.map +1 -1
  19. package/fesm2020/tuain-ng-forms-lib.mjs +107 -101
  20. package/fesm2020/tuain-ng-forms-lib.mjs.map +1 -1
  21. package/lib/classes/forms/action.d.ts +7 -6
  22. package/lib/classes/forms/element.d.ts +0 -8
  23. package/lib/classes/forms/field.d.ts +2 -11
  24. package/lib/classes/forms/piece.d.ts +3 -2
  25. package/lib/classes/forms/section.d.ts +1 -1
  26. package/lib/classes/forms/table/action.d.ts +7 -4
  27. package/lib/classes/forms/table/table.d.ts +1 -1
  28. package/lib/components/elements/action.component.d.ts +1 -6
  29. package/lib/components/elements/layout/element.component.d.ts +1 -2
  30. package/lib/components/elements/layout/form-header.component.d.ts +1 -4
  31. package/lib/components/elements/layout/piece.component.d.ts +2 -0
  32. package/lib/components/elements/layout/section.component.d.ts +1 -2
  33. package/lib/components/elements/layout/sub-section.component.d.ts +1 -2
  34. package/lib/components/forms/basic-form.d.ts +2 -2
  35. package/package.json +1 -1
@@ -14,6 +14,7 @@ class PieceComponent {
14
14
  this.disabled = false;
15
15
  this.customAttributes = {};
16
16
  }
17
+ setForm(form) { this.form = form; }
17
18
  defaultProcessAttributeChange(attribute, value) {
18
19
  if (!attribute || attribute.trim() === '') {
19
20
  return false;
@@ -45,10 +46,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.6", ngImpor
45
46
  }] });
46
47
 
47
48
  class ElementComponent extends PieceComponent {
48
- start() { }
49
+ start() {
50
+ this.setForm(this.element?._form);
51
+ }
49
52
  }
50
53
  ElementComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.6", ngImport: i0, type: ElementComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
51
- ElementComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.6", type: ElementComponent, selector: "lib-element", inputs: { element: "element", form: "form" }, usesInheritance: true, ngImport: i0, template: `<ng-content></ng-content>`, isInline: true });
54
+ ElementComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.6", type: ElementComponent, selector: "lib-element", inputs: { element: "element" }, usesInheritance: true, ngImport: i0, template: `<ng-content></ng-content>`, isInline: true });
52
55
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.6", ngImport: i0, type: ElementComponent, decorators: [{
53
56
  type: Component,
54
57
  args: [{
@@ -57,8 +60,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.6", ngImpor
57
60
  }]
58
61
  }], propDecorators: { element: [{
59
62
  type: Input
60
- }], form: [{
61
- type: Input
62
63
  }] } });
63
64
 
64
65
  class ActionComponent extends ElementComponent {
@@ -66,8 +67,6 @@ class ActionComponent extends ElementComponent {
66
67
  super(...arguments);
67
68
  this.inProgress = false;
68
69
  this.action = null;
69
- this.style = 'primary';
70
- this.showLabel = true;
71
70
  }
72
71
  ngOnInit() {
73
72
  if (!this.action) {
@@ -96,21 +95,9 @@ class ActionComponent extends ElementComponent {
96
95
  this.action.notifyActivation();
97
96
  }
98
97
  }
99
- visibleOnRestriction() {
100
- if (!this.action?.restrictedOnField) {
101
- return true;
102
- }
103
- if ((this.action?.restrictedOnOperator === '=='
104
- && this.relatedField === this.action?.restrictedOnValue)
105
- || (this.action?.restrictedOnOperator === '!='
106
- && this.relatedField !== this.action?.restrictedOnValue)) {
107
- return true;
108
- }
109
- return false;
110
- }
111
98
  }
112
99
  ActionComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.6", ngImport: i0, type: ActionComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
113
- ActionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.6", type: ActionComponent, selector: "lib-action", inputs: { action: "action", busy: "busy", relatedField: "relatedField", style: "style", showLabel: "showLabel" }, usesInheritance: true, ngImport: i0, template: `<ng-content></ng-content>`, isInline: true });
100
+ ActionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.6", type: ActionComponent, selector: "lib-action", inputs: { action: "action" }, usesInheritance: true, ngImport: i0, template: `<ng-content></ng-content>`, isInline: true });
114
101
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.6", ngImport: i0, type: ActionComponent, decorators: [{
115
102
  type: Component,
116
103
  args: [{
@@ -119,14 +106,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.6", ngImpor
119
106
  }]
120
107
  }], propDecorators: { action: [{
121
108
  type: Input
122
- }], busy: [{
123
- type: Input
124
- }], relatedField: [{
125
- type: Input
126
- }], style: [{
127
- type: Input
128
- }], showLabel: [{
129
- type: Input
130
109
  }] } });
131
110
 
132
111
  const VALUE = 'value';
@@ -227,7 +206,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.6", ngImpor
227
206
 
228
207
  class FormHeaderComponent {
229
208
  constructor() {
230
- this.canGoBack = false;
231
209
  this.goBackEvent = new EventEmitter();
232
210
  }
233
211
  goBackForm() {
@@ -235,7 +213,7 @@ class FormHeaderComponent {
235
213
  }
236
214
  }
237
215
  FormHeaderComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.6", ngImport: i0, type: FormHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
238
- FormHeaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.6", type: FormHeaderComponent, selector: "lib-form-header", inputs: { form: "form", canGoBack: "canGoBack", showTitle: "showTitle", headerActions: "headerActions" }, outputs: { goBackEvent: "goBackEvent" }, ngImport: i0, template: `<ng-content></ng-content>`, isInline: true });
216
+ FormHeaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.6", type: FormHeaderComponent, selector: "lib-form-header", inputs: { form: "form" }, outputs: { goBackEvent: "goBackEvent" }, ngImport: i0, template: `<ng-content></ng-content>`, isInline: true });
239
217
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.6", ngImport: i0, type: FormHeaderComponent, decorators: [{
240
218
  type: Component,
241
219
  args: [{
@@ -244,12 +222,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.6", ngImpor
244
222
  }]
245
223
  }], propDecorators: { form: [{
246
224
  type: Input
247
- }], canGoBack: [{
248
- type: Input
249
- }], showTitle: [{
250
- type: Input
251
- }], headerActions: [{
252
- type: Input
253
225
  }], goBackEvent: [{
254
226
  type: Output
255
227
  }] } });
@@ -272,10 +244,12 @@ class SectionComponent extends PieceComponent {
272
244
  });
273
245
  this.start();
274
246
  }
275
- start() { }
247
+ start() {
248
+ this.setForm(this.section?._form);
249
+ }
276
250
  }
277
251
  SectionComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.6", ngImport: i0, type: SectionComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
278
- SectionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.6", type: SectionComponent, selector: "lib-section", inputs: { section: "section", form: "form" }, usesInheritance: true, ngImport: i0, template: `<ng-content></ng-content>`, isInline: true });
252
+ SectionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.6", type: SectionComponent, selector: "lib-section", inputs: { section: "section" }, usesInheritance: true, ngImport: i0, template: `<ng-content></ng-content>`, isInline: true });
279
253
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.6", ngImport: i0, type: SectionComponent, decorators: [{
280
254
  type: Component,
281
255
  args: [{
@@ -284,8 +258,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.6", ngImpor
284
258
  }]
285
259
  }], propDecorators: { section: [{
286
260
  type: Input
287
- }], form: [{
288
- type: Input
289
261
  }] } });
290
262
 
291
263
  class SubSectionComponent extends PieceComponent {
@@ -306,10 +278,12 @@ class SubSectionComponent extends PieceComponent {
306
278
  });
307
279
  this.start();
308
280
  }
309
- start() { }
281
+ start() {
282
+ this.setForm(this.subSection?._form);
283
+ }
310
284
  }
311
285
  SubSectionComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.6", ngImport: i0, type: SubSectionComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
312
- SubSectionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.6", type: SubSectionComponent, selector: "lib-subsection", inputs: { subSection: "subSection", form: "form" }, usesInheritance: true, ngImport: i0, template: `<ng-content></ng-content>`, isInline: true });
286
+ SubSectionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.6", type: SubSectionComponent, selector: "lib-subsection", inputs: { subSection: "subSection" }, usesInheritance: true, ngImport: i0, template: `<ng-content></ng-content>`, isInline: true });
313
287
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.6", ngImport: i0, type: SubSectionComponent, decorators: [{
314
288
  type: Component,
315
289
  args: [{
@@ -318,8 +292,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.6", ngImpor
318
292
  }]
319
293
  }], propDecorators: { subSection: [{
320
294
  type: Input
321
- }], form: [{
322
- type: Input
323
295
  }] } });
324
296
 
325
297
  const INLINE_ACTION$1 = 'INLINE';
@@ -345,7 +317,9 @@ class LibTableRecordActionComponent extends PieceComponent {
345
317
  });
346
318
  this.start();
347
319
  }
348
- start() { }
320
+ start() {
321
+ this.action?.setRecodData(this.recordData);
322
+ }
349
323
  onActivate() {
350
324
  const tableEvent = {
351
325
  actionCode: this.action.actionCode,
@@ -522,6 +496,7 @@ class FormPiece {
522
496
  this._absoluteDisabled = false;
523
497
  this.visibleStates = null;
524
498
  this.enabledStates = null;
499
+ this._form = null;
525
500
  this._visible = true;
526
501
  this._disabled = false;
527
502
  this.customAttributes = {};
@@ -596,7 +571,7 @@ class FormPiece {
596
571
  set disabled(disabled) { this.enabled = !disabled; }
597
572
  enable() { this.enabled = true; }
598
573
  disable() { this.enabled = false; }
599
- formStateChangeCustomSubscribe(formChangeSubject) { }
574
+ formStateChangeCustomSubscribe(form, formChangeSubject) { }
600
575
  formStateChange(state) {
601
576
  if (state) {
602
577
  this._formState = state;
@@ -604,8 +579,9 @@ class FormPiece {
604
579
  this._disabled = this._absoluteDisabled || !this.enabledOnState(state);
605
580
  }
606
581
  }
607
- subscribeFormStateChange(formChangeSubject) {
608
- this.formStateChangeCustomSubscribe(formChangeSubject);
582
+ connectWithParentForm(form, formChangeSubject) {
583
+ this._form = form;
584
+ this.formStateChangeCustomSubscribe(form, formChangeSubject);
609
585
  formChangeSubject.subscribe(event => this.formStateChange(event?.state));
610
586
  }
611
587
  }
@@ -659,14 +635,6 @@ class FormElement extends FormPiecePropagate {
659
635
  isField() { return this.elementType === elementTypes.field; }
660
636
  isAction() { return this.elementType === elementTypes.action; }
661
637
  isTable() { return this.elementType === elementTypes.table; }
662
- /**
663
- * @deprecated Utilizar viewOnState
664
- */
665
- supportState(state) { return this.viewOnState(state); }
666
- /**
667
- * @deprecated Utilizar viewOnState
668
- */
669
- supportMode(state) { return this.viewOnState(state); }
670
638
  }
671
639
 
672
640
  const HEADER = 'HEADER';
@@ -675,6 +643,9 @@ class FormAction extends FormElement {
675
643
  super(actionDefinition, formConfig);
676
644
  this._actionActivated = new Subject();
677
645
  this.inProgress = false;
646
+ this.restrictedOnField = null;
647
+ this.restrictedOnOperator = null;
648
+ this.restrictedOnValue = null;
678
649
  this.propagationCustomAttributes = this._formConfig?.propagationCustomAttributes?.actions ?? [];
679
650
  this.elementType = elementTypes.action;
680
651
  this.actionCode = actionDefinition.actionCode ? actionDefinition.actionCode.toString() : '';
@@ -683,11 +654,27 @@ class FormAction extends FormElement {
683
654
  this.setCustomAttribute('location', actionDefinition.position || HEADER);
684
655
  this.backend = actionDefinition?.serverAction ?? false;
685
656
  this.newState = actionDefinition?.newState;
686
- this.restrictedOnField = actionDefinition.fieldRestrictedCode ? actionDefinition.fieldRestrictedCode.toString() : '';
687
- this.restrictedOnOperator = actionDefinition.operatorRestricted || '';
688
- this.restrictedOnValue = actionDefinition.valueRestricted ?? '';
657
+ this.restrictedOnField = actionDefinition.fieldRestrictedCode?.toString() ?? null;
658
+ if (this.restrictedOnField) {
659
+ this.restrictedOnOperator = actionDefinition.operatorRestricted || '';
660
+ this.restrictedOnValue = actionDefinition.valueRestricted ?? '';
661
+ }
689
662
  this.customValidation = () => true;
690
663
  }
664
+ viewOnState(state) {
665
+ const actionVisible = (this.visibleStates && state) ? this.visibleStates.includes(state) : false;
666
+ if (actionVisible && this._form && this.restrictedOnField) {
667
+ const relatedField = this._form.fields?.[this.restrictedOnField];
668
+ if (relatedField) {
669
+ const fieldValue = relatedField.value;
670
+ if ((this.restrictedOnOperator === '==' && fieldValue !== this.restrictedOnValue)
671
+ || (this.restrictedOnOperator === '!=' && fieldValue === this.restrictedOnValue)) {
672
+ return false;
673
+ }
674
+ }
675
+ }
676
+ return actionVisible;
677
+ }
691
678
  get actionActivated() { return this._actionActivated; }
692
679
  start() { this.inProgress = true; }
693
680
  stop() { this.inProgress = false; }
@@ -722,13 +709,13 @@ const attrs$1 = {
722
709
  _defaultValue: { name: '_defaultValue', propagate: 'defaultValue' },
723
710
  _defaultEditable: { name: '_defaultEditable', propagate: 'defaultEditable' },
724
711
  _fieldAlignment: { name: '_fieldAlignment', propagate: 'alignment' },
725
- _fieldCode: { name: '_fieldCode', propagate: 'code' },
712
+ fieldCode: { name: 'fieldCode', propagate: 'code' },
726
713
  _fieldInfo: { name: '_fieldInfo', propagate: 'info' },
727
714
  _fieldRequired: { name: '_fieldRequired', propagate: 'required' },
728
715
  _fieldTitle: { name: '_fieldTitle', propagate: 'title' },
729
716
  _fieldType: { name: '_fieldType', propagate: 'type' },
730
717
  _fieldFormat: { name: '_fieldFormat', propagate: 'format' },
731
- _fieldOptions: { name: '_fieldOptions', propagate: 'options' },
718
+ fieldOptions: { name: 'fieldOptions', propagate: 'options' },
732
719
  _focus: { name: '_focus', propagate: 'focus' },
733
720
  _hasChanged: { name: '_hasChanged', propagate: 'hasChanged' },
734
721
  _intrinsicErrorMessage: { name: '_intrinsicErrorMessage', propagate: null },
@@ -752,7 +739,6 @@ class FieldDescriptor extends FormElement {
752
739
  this._errorType = '';
753
740
  this._errorCode = '';
754
741
  this._errorMessage = '';
755
- this._fieldCode = '';
756
742
  this._intrinsicErrorMessage = '';
757
743
  this._maxLength = 0;
758
744
  this._minLength = 0;
@@ -769,15 +755,16 @@ class FieldDescriptor extends FormElement {
769
755
  this._fieldTitle = '';
770
756
  this._fieldType = '';
771
757
  this._fieldFormat = null;
772
- this._fieldOptions = null;
773
758
  this._hasChanged = false;
774
759
  this._outputOnly = false;
775
760
  this._tooltipText = '';
761
+ this.fieldCode = '';
762
+ this.fieldOptions = null;
776
763
  this.propagationCustomAttributes = this._formConfig?.propagationCustomAttributes?.fields ?? [];
777
764
  this.elementType = elementTypes.field;
778
765
  const fld = (inputFieldReceived) ? inputFieldReceived : {};
779
- this.setAttr(attrs$1._fieldCode, fld.fieldCode);
780
- this.title = fld.fieldTitle ?? this._fieldCode;
766
+ this.setAttr(attrs$1.fieldCode, fld.fieldCode);
767
+ this.title = fld.fieldTitle ?? this.fieldCode;
781
768
  this.type = fld.fieldTypeCode;
782
769
  this.captureType = fld.captureType ?? DEFAULT_CAPTURE_TYPE;
783
770
  const defaultValue = fld.defaultValue ?? null;
@@ -820,8 +807,7 @@ class FieldDescriptor extends FormElement {
820
807
  get backend() { return this._validateOnServer; }
821
808
  get captureType() { return this._captureType; }
822
809
  set captureType(captureType) { this.setAttr(attrs$1._captureType, captureType); }
823
- get code() { return this._fieldCode; }
824
- get fieldCode() { return this._fieldCode; }
810
+ get code() { return this.fieldCode; }
825
811
  get defaultValue() { return this._defaultValue; }
826
812
  set defaultValue(defaultValue) { this.setAttr(attrs$1._defaultValue, defaultValue); }
827
813
  get defaultEditable() { return this._defaultEditable; }
@@ -886,9 +872,9 @@ class FieldDescriptor extends FormElement {
886
872
  }
887
873
  this.setAttr(attrs$1._minValue, minValue);
888
874
  }
889
- get name() { return this._fieldCode; }
875
+ get name() { return this.fieldCode; }
890
876
  get options() {
891
- return this._fieldOptions?.map(option => {
877
+ return this.fieldOptions?.map(option => {
892
878
  const optionCopy = { ...option };
893
879
  return optionCopy;
894
880
  }) ?? null;
@@ -908,25 +894,25 @@ class FieldDescriptor extends FormElement {
908
894
  });
909
895
  fieldOptions = (fieldOptions && Array.isArray(fieldOptions)
910
896
  && fieldOptions.length > 0) ? fieldOptions : [];
911
- this.setAttr(attrs$1._fieldOptions, fieldOptions);
897
+ this.setAttr(attrs$1.fieldOptions, fieldOptions);
912
898
  if (this._value) {
913
899
  if (this._fieldType === this._formConfig.fieldTypes.array && Array.isArray(this._value)) {
914
- const fieldValue = this._value?.filter(item => this._fieldOptions?.find(opt => opt.fieldOptionId === item));
900
+ const fieldValue = this._value?.filter(item => this.fieldOptions?.find(opt => opt.fieldOptionId === item));
915
901
  this.setAttr(attrs$1._value, fieldValue);
916
902
  }
917
903
  else {
918
- const valInOptions = this._fieldOptions?.find(item => item.fieldOptionId === this._value);
904
+ const valInOptions = this.fieldOptions?.find(item => item.fieldOptionId === this._value);
919
905
  if (!valInOptions) {
920
906
  this._setValue('');
921
907
  }
922
908
  }
923
909
  }
924
- if (this._fieldRequired && this._fieldOptions?.length === 1 && this._value !== this._fieldOptions?.[0].fieldOptionId) {
925
- this._setValue(this._fieldOptions?.[0].fieldOptionId);
910
+ if (this._fieldRequired && this.fieldOptions?.length === 1 && this._value !== this.fieldOptions?.[0].fieldOptionId) {
911
+ this._setValue(this.fieldOptions?.[0].fieldOptionId);
926
912
  this.notifyEditionFinish();
927
913
  }
928
914
  }
929
- get optionText() { return this._fieldOptions?.find(item => item.fieldOptionId === this._value)?.fieldOptionValue ?? null; }
915
+ get optionText() { return this.fieldOptions?.find(item => item.fieldOptionId === this._value)?.fieldOptionValue ?? null; }
930
916
  get outputOnly() { return this._outputOnly; }
931
917
  set outputOnly(outputOnly) { this.setAttr(attrs$1._outputOnly, outputOnly); }
932
918
  get required() { return this._fieldRequired; }
@@ -950,14 +936,6 @@ class FieldDescriptor extends FormElement {
950
936
  set value(newValue) { this._setValue(newValue); }
951
937
  get visibleLabel() { return this._visibleLabel; }
952
938
  set visibleLabel(visibleLabel) { this.setAttr(attrs$1._visibleLabel, visibleLabel); }
953
- /**
954
- * @deprecated Use options
955
- */
956
- get fieldOptions() { return this._fieldOptions; }
957
- /**
958
- * @deprecated Use options
959
- */
960
- set fieldOptions(options) { this.options = options; }
961
939
  /**
962
940
  * @deprecated Use value
963
941
  */
@@ -1033,7 +1011,7 @@ class FieldDescriptor extends FormElement {
1033
1011
  setVisibleLabel(visibleLabel) { this.visibleLabel = visibleLabel; }
1034
1012
  notifyEditionPartial() {
1035
1013
  this.resetError();
1036
- this._editionPartial.next({ code: this._fieldCode, intrinsicValidation: true });
1014
+ this._editionPartial.next({ code: this.fieldCode, intrinsicValidation: true });
1037
1015
  }
1038
1016
  notifyEditionFinish() {
1039
1017
  const fieldValue = this.value;
@@ -1069,10 +1047,10 @@ class FieldDescriptor extends FormElement {
1069
1047
  intrinsicValidation = false;
1070
1048
  this.setError('99', `Longitud de ${this._fieldTitle} debe ser de al menos ${this._minLength}`);
1071
1049
  }
1072
- this._editionFinish.next({ code: this._fieldCode, intrinsicValidation });
1050
+ this._editionFinish.next({ code: this.fieldCode, intrinsicValidation });
1073
1051
  }
1074
1052
  notifyEditionDetailRequest(detail) {
1075
- const detailEvent = { code: this._fieldCode, detail };
1053
+ const detailEvent = { code: this.fieldCode, detail };
1076
1054
  this._detailRequest.next(detailEvent);
1077
1055
  }
1078
1056
  setError(code, message, type = DEFAULT_ERROR_TYPE) {
@@ -1219,6 +1197,9 @@ class RecordTableColumn extends FormPiece {
1219
1197
  class TableAction extends FormPiece {
1220
1198
  constructor(actionDefinition, formConfig) {
1221
1199
  super(actionDefinition, formConfig);
1200
+ this.restrictedOnField = null;
1201
+ this.restrictedOnValue = null;
1202
+ this.restrictedOnOperator = null;
1222
1203
  this.actionCode = actionDefinition.actionCode;
1223
1204
  this.actionTitle = actionDefinition.actionTitle;
1224
1205
  this.iconName = actionDefinition.iconName || this.actionCode;
@@ -1227,9 +1208,30 @@ class TableAction extends FormPiece {
1227
1208
  this.newState = actionDefinition.newState;
1228
1209
  this.stateField = actionDefinition.stateField || '';
1229
1210
  this.backend = actionDefinition?.serverAction ?? false;
1230
- this.restrictedOnField = actionDefinition.fieldRestrictedCode || '';
1231
- this.restrictedOnValue = actionDefinition.valueRestricted ?? '';
1232
- this.restrictedOnOperator = actionDefinition.operatorRestricted || '';
1211
+ this.restrictedOnField = actionDefinition.fieldRestrictedCode ?? null;
1212
+ if (this.restrictedOnField) {
1213
+ this.restrictedOnValue = actionDefinition.valueRestricted ?? null;
1214
+ this.restrictedOnOperator = actionDefinition.operatorRestricted || null;
1215
+ }
1216
+ }
1217
+ viewOnState(state) {
1218
+ const actionVisible = (this.visibleStates && state) ? this.visibleStates.includes(state) : false;
1219
+ if (actionVisible && this._form && this.restrictedOnField) {
1220
+ // Aqui se debe cambiar el campo por la columna del registro!!!!!
1221
+ // const relatedField = this._form.fields?.[this.restrictedOnField];
1222
+ const relatedField = this.recordData?.[this.restrictedOnField];
1223
+ if (relatedField) {
1224
+ const fieldValue = relatedField.value;
1225
+ if ((this.restrictedOnOperator === '==' && fieldValue !== this.restrictedOnValue)
1226
+ || (this.restrictedOnOperator === '!=' && fieldValue === this.restrictedOnValue)) {
1227
+ return false;
1228
+ }
1229
+ }
1230
+ }
1231
+ return actionVisible;
1232
+ }
1233
+ setRecodData(recordData) {
1234
+ this.recordData = recordData;
1233
1235
  }
1234
1236
  }
1235
1237
 
@@ -1748,12 +1750,12 @@ class RecordTable extends FormElement {
1748
1750
  }
1749
1751
  return direction === TABLE_SORT_ASCENDING ? result : -result;
1750
1752
  }
1751
- formStateChangeCustomSubscribe(formChangeSubject) {
1753
+ formStateChangeCustomSubscribe(form, formChangeSubject) {
1752
1754
  this.columns?.forEach(column => {
1753
- column?.subscribeFormStateChange(formChangeSubject);
1755
+ column?.connectWithParentForm(form, formChangeSubject);
1754
1756
  });
1755
1757
  this._actions?.forEach(action => {
1756
- action?.subscribeFormStateChange(formChangeSubject);
1758
+ action?.connectWithParentForm(form, formChangeSubject);
1757
1759
  });
1758
1760
  }
1759
1761
  }
@@ -1965,9 +1967,9 @@ class RecordFormSection extends FormPiecePropagate {
1965
1967
  }
1966
1968
  return null;
1967
1969
  }
1968
- formStateChangeCustomSubscribe(formChangeSubject) {
1970
+ formStateChangeCustomSubscribe(form, formChangeSubject) {
1969
1971
  this.subSections?.forEach(subsection => {
1970
- subsection?.subscribeFormStateChange(formChangeSubject);
1972
+ subsection?.connectWithParentForm(form, formChangeSubject);
1971
1973
  });
1972
1974
  }
1973
1975
  }
@@ -2254,7 +2256,7 @@ class FormStructureAndData {
2254
2256
  return this.getFieldSet(fld => fld?.required && fld?.empty, codes ?? null, secCode, subCode);
2255
2257
  }
2256
2258
  getChangedFields(codes, secCode, subCode) {
2257
- return this.getFieldSet(fld => !fld?.outputOnly && fld?.hasChanged(), codes ?? null, secCode, subCode);
2259
+ return this.getFieldSet(fld => !fld?.outputOnly && fld?.hasChanged, codes ?? null, secCode, subCode);
2258
2260
  }
2259
2261
  getFieldsWithValidationIssues(codes, secCode, subCode) {
2260
2262
  return this.getFieldSet(fld => fld?.hasError(), codes ?? null, secCode, subCode);
@@ -2790,11 +2792,11 @@ class BasicFormComponent {
2790
2792
  this.onTableServerError(() => this.displayTableServerError());
2791
2793
  }
2792
2794
  get formVisible() { return this.visible; }
2793
- get formManager() { return this; }
2795
+ get form() { return this; }
2794
2796
  get formCode() { return this.name ?? ''; }
2795
2797
  set formCode(name) { this.name = name; }
2796
2798
  get inServerProcess() { return this.busy; }
2797
- get form() { return this._formStructure; }
2799
+ get formStructure() { return this._formStructure; }
2798
2800
  get state() { return this._formStructure?.state ?? null; }
2799
2801
  get currentState() { return this._formStructure?.state ?? ''; }
2800
2802
  set currentState(state) { this?.changeState(state); }
@@ -2918,7 +2920,7 @@ class BasicFormComponent {
2918
2920
  section.activation.subscribe((code) => this.launchSectionActivation(code));
2919
2921
  section.inactivation.subscribe((code) => this.launchSectionInactivation(code));
2920
2922
  // Adicionalmente se le pide a la sección se subscriba al cambio de estado del formulario
2921
- section.subscribeFormStateChange(this._formStructure?.stateChange);
2923
+ section.connectWithParentForm(this, this._formStructure?.stateChange);
2922
2924
  }
2923
2925
  }
2924
2926
  subscribeFieldsSubjects() {
@@ -2935,7 +2937,7 @@ class BasicFormComponent {
2935
2937
  });
2936
2938
  field.detailRequest.subscribe(event => this.showFieldInfo(event.code, event.detail));
2937
2939
  // Adicionalmente se le pide al campo se subscriba al cambio de estado del formulario
2938
- field.subscribeFormStateChange(this._formStructure?.stateChange);
2940
+ field.connectWithParentForm(this, this._formStructure?.stateChange);
2939
2941
  });
2940
2942
  }
2941
2943
  }
@@ -2945,7 +2947,7 @@ class BasicFormComponent {
2945
2947
  formActions.forEach(action => {
2946
2948
  action.actionActivated.subscribe(code => this.startAction(code));
2947
2949
  // Adicionalmente se le pide a la acción se subscriba al cambio de estado del formulario
2948
- action.subscribeFormStateChange(this._formStructure?.stateChange);
2950
+ action.connectWithParentForm(this, this._formStructure?.stateChange);
2949
2951
  });
2950
2952
  }
2951
2953
  }
@@ -2959,7 +2961,7 @@ class BasicFormComponent {
2959
2961
  table.selectionActionTrigger.subscribe(event => this.startTableSelectionAction(event));
2960
2962
  table.getDataTrigger.subscribe(event => this.startTableGetData(event));
2961
2963
  // Adicionalmente se le pide a la tabla se subscriba al cambio de estado del formulario
2962
- table.subscribeFormStateChange(this._formStructure?.stateChange);
2964
+ table.connectWithParentForm(this, this._formStructure?.stateChange);
2963
2965
  });
2964
2966
  }
2965
2967
  }
@@ -3925,7 +3927,11 @@ class BasicFormComponent {
3925
3927
  for (const columnName of columnNames) {
3926
3928
  const columnValue = tableRecord.getFieldValue(columnName) ?? '';
3927
3929
  const code = mappingTable?.[columnName] ?? columnName;
3928
- this.setFieldValue(code, columnValue);
3930
+ const field = code ? this.getField(code) : null;
3931
+ if (field) {
3932
+ field.setValue(columnValue);
3933
+ field.hasChanged = false;
3934
+ }
3929
3935
  }
3930
3936
  return true;
3931
3937
  }