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.
- package/esm2020/lib/classes/forms/action.mjs +23 -4
- package/esm2020/lib/classes/forms/element.mjs +1 -9
- package/esm2020/lib/classes/forms/field.mjs +19 -28
- package/esm2020/lib/classes/forms/form.mjs +2 -2
- package/esm2020/lib/classes/forms/piece.mjs +6 -4
- package/esm2020/lib/classes/forms/section.mjs +3 -3
- package/esm2020/lib/classes/forms/table/action.mjs +28 -4
- package/esm2020/lib/classes/forms/table/table.mjs +4 -4
- package/esm2020/lib/components/elements/action.component.mjs +2 -24
- package/esm2020/lib/components/elements/layout/element.component.mjs +5 -5
- package/esm2020/lib/components/elements/layout/form-header.component.mjs +2 -9
- package/esm2020/lib/components/elements/layout/piece.component.mjs +2 -1
- package/esm2020/lib/components/elements/layout/section.component.mjs +5 -5
- package/esm2020/lib/components/elements/layout/sub-section.component.mjs +5 -5
- package/esm2020/lib/components/elements/tables/table-record-action.component.mjs +4 -2
- package/esm2020/lib/components/forms/basic-form.mjs +12 -8
- package/fesm2015/tuain-ng-forms-lib.mjs +115 -104
- package/fesm2015/tuain-ng-forms-lib.mjs.map +1 -1
- package/fesm2020/tuain-ng-forms-lib.mjs +107 -101
- package/fesm2020/tuain-ng-forms-lib.mjs.map +1 -1
- package/lib/classes/forms/action.d.ts +7 -6
- package/lib/classes/forms/element.d.ts +0 -8
- package/lib/classes/forms/field.d.ts +2 -11
- package/lib/classes/forms/piece.d.ts +3 -2
- package/lib/classes/forms/section.d.ts +1 -1
- package/lib/classes/forms/table/action.d.ts +7 -4
- package/lib/classes/forms/table/table.d.ts +1 -1
- package/lib/components/elements/action.component.d.ts +1 -6
- package/lib/components/elements/layout/element.component.d.ts +1 -2
- package/lib/components/elements/layout/form-header.component.d.ts +1 -4
- package/lib/components/elements/layout/piece.component.d.ts +2 -0
- package/lib/components/elements/layout/section.component.d.ts +1 -2
- package/lib/components/elements/layout/sub-section.component.d.ts +1 -2
- package/lib/components/forms/basic-form.d.ts +2 -2
- 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"
|
|
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"
|
|
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"
|
|
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"
|
|
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"
|
|
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
|
-
|
|
608
|
-
this.
|
|
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
|
|
687
|
-
this.
|
|
688
|
-
|
|
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
|
-
|
|
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
|
-
|
|
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.
|
|
780
|
-
this.title = fld.fieldTitle ?? this.
|
|
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.
|
|
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.
|
|
875
|
+
get name() { return this.fieldCode; }
|
|
890
876
|
get options() {
|
|
891
|
-
return this.
|
|
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.
|
|
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.
|
|
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.
|
|
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.
|
|
925
|
-
this._setValue(this.
|
|
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.
|
|
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.
|
|
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.
|
|
1050
|
+
this._editionFinish.next({ code: this.fieldCode, intrinsicValidation });
|
|
1073
1051
|
}
|
|
1074
1052
|
notifyEditionDetailRequest(detail) {
|
|
1075
|
-
const detailEvent = { code: this.
|
|
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.
|
|
1232
|
-
|
|
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?.
|
|
1755
|
+
column?.connectWithParentForm(form, formChangeSubject);
|
|
1754
1756
|
});
|
|
1755
1757
|
this._actions?.forEach(action => {
|
|
1756
|
-
action?.
|
|
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?.
|
|
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
|
|
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
|
|
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
|
|
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.
|
|
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.
|
|
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.
|
|
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.
|
|
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.
|
|
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
|
}
|