@esfaenza/forms-and-validations 11.2.148 → 11.2.149-beta1
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/bundles/esfaenza-forms-and-validations.umd.js +99 -16
- package/bundles/esfaenza-forms-and-validations.umd.js.map +1 -1
- package/esfaenza-forms-and-validations.metadata.json +1 -1
- package/esm2015/lib/forms/base-form-control.js +78 -11
- package/esm2015/lib/forms/form-input/form-input.component.js +8 -2
- package/esm2015/lib/forms/form-select/form-select.component.js +2 -2
- package/esm2015/lib/validations/validation-select/validation-select.component.js +3 -3
- package/fesm2015/esfaenza-forms-and-validations.js +87 -14
- package/fesm2015/esfaenza-forms-and-validations.js.map +1 -1
- package/lib/forms/base-form-control.d.ts +46 -8
- package/lib/forms/form-input/form-input.component.d.ts +2 -0
- package/package.json +1 -1
|
@@ -827,11 +827,11 @@
|
|
|
827
827
|
/**
|
|
828
828
|
* valore del campo vuoto della select
|
|
829
829
|
*/
|
|
830
|
-
_this.emptyFieldValue = "-
|
|
830
|
+
_this.emptyFieldValue = "-2000";
|
|
831
831
|
/**
|
|
832
832
|
* Valore del placeholder
|
|
833
833
|
*/
|
|
834
|
-
_this.placeHolderValue = "-
|
|
834
|
+
_this.placeHolderValue = "-1000";
|
|
835
835
|
/**
|
|
836
836
|
* Per i componenti non obbligatori indica se fornire un "valore vuoto"
|
|
837
837
|
*/
|
|
@@ -2083,6 +2083,10 @@
|
|
|
2083
2083
|
/** Cache delle proprietà scritte tipo --> {prop} */
|
|
2084
2084
|
this.BindProperties = [];
|
|
2085
2085
|
this.destroyed$ = new rxjs.Subject();
|
|
2086
|
+
/**
|
|
2087
|
+
* Variabile per tenere in memoria il fatto che il componente è forzato a invalido o no
|
|
2088
|
+
*/
|
|
2089
|
+
this._forceInvalid = false;
|
|
2086
2090
|
if (ngControl == null) {
|
|
2087
2091
|
if (!this.handleNullNgControl())
|
|
2088
2092
|
console.error("ngControl nullo per qualche motivo! Il 90% delle funzionalità di questo input saranno disabilitate");
|
|
@@ -2149,23 +2153,23 @@
|
|
|
2149
2153
|
enumerable: false,
|
|
2150
2154
|
configurable: true
|
|
2151
2155
|
});
|
|
2152
|
-
Object.defineProperty(BaseFormControl.prototype, "
|
|
2156
|
+
Object.defineProperty(BaseFormControl.prototype, "baseInput", {
|
|
2153
2157
|
/**
|
|
2154
|
-
* Query sull'elemento '
|
|
2158
|
+
* Query sull'elemento 'baseInput' che funziona in ambiente statico
|
|
2155
2159
|
*
|
|
2156
|
-
* @param {NgModel} comp Elemento HTML marcato con "#
|
|
2160
|
+
* @param {NgModel} comp Elemento HTML marcato con "#baseInput"
|
|
2157
2161
|
*/
|
|
2158
|
-
set: function (comp) { this.
|
|
2162
|
+
set: function (comp) { this.registerBaseInput(comp); },
|
|
2159
2163
|
enumerable: false,
|
|
2160
2164
|
configurable: true
|
|
2161
2165
|
});
|
|
2162
|
-
Object.defineProperty(BaseFormControl.prototype, "
|
|
2166
|
+
Object.defineProperty(BaseFormControl.prototype, "baseInput_static", {
|
|
2163
2167
|
/**
|
|
2164
|
-
* Query sull'elemento '
|
|
2168
|
+
* Query sull'elemento 'baseInput' che funziona in ambiente dinamico
|
|
2165
2169
|
*
|
|
2166
|
-
* @param {NgModel} comp Elemento HTML marcato con "#
|
|
2170
|
+
* @param {NgModel} comp Elemento HTML marcato con "#baseInput"
|
|
2167
2171
|
*/
|
|
2168
|
-
set: function (comp) { this.
|
|
2172
|
+
set: function (comp) { this.registerBaseInput(comp); },
|
|
2169
2173
|
enumerable: false,
|
|
2170
2174
|
configurable: true
|
|
2171
2175
|
});
|
|
@@ -2283,11 +2287,14 @@
|
|
|
2283
2287
|
if (this.SetValidationSubject) {
|
|
2284
2288
|
this.SetValidationSubject.pipe(operators.takeUntil(this.destroyed$)).subscribe(function (v) {
|
|
2285
2289
|
if (v.fieldName + "_internal" == _this.GeneratedName) {
|
|
2290
|
+
// Bisogna farlo su entrambi i Control per portare il ".valid" nel punto giusto
|
|
2291
|
+
// e per avere gli stili sull'input
|
|
2286
2292
|
var control = _this.Form.getControl(_this.validationControl);
|
|
2287
2293
|
control.setErrors({ forcedtoinvalid: true });
|
|
2288
2294
|
control.markAsTouched();
|
|
2289
2295
|
_this.ngControl.control.setErrors({ forcedtoinvalid: true });
|
|
2290
2296
|
_this.ngControl.control.markAsTouched();
|
|
2297
|
+
_this.cdr.markForCheck();
|
|
2291
2298
|
}
|
|
2292
2299
|
});
|
|
2293
2300
|
}
|
|
@@ -2357,7 +2364,7 @@
|
|
|
2357
2364
|
*
|
|
2358
2365
|
* @param {NgModel} comp Elemento HTML marcato con "#validationControl"
|
|
2359
2366
|
*/
|
|
2360
|
-
BaseFormControl.prototype.
|
|
2367
|
+
BaseFormControl.prototype.registerBaseInput = function (comp) {
|
|
2361
2368
|
if (comp) {
|
|
2362
2369
|
// È arrivato un nuovo validationContorl (succede solo nel form-select quando cambia la source da 0 elementi / null ad N elementi, quindi al massimo una volta)
|
|
2363
2370
|
if (this.validationControl && this.Form)
|
|
@@ -2442,6 +2449,73 @@
|
|
|
2442
2449
|
if (this.FAV_DEBUG_MODE)
|
|
2443
2450
|
console.log("@forms-and-validations: " + message);
|
|
2444
2451
|
};
|
|
2452
|
+
Object.defineProperty(BaseFormControl.prototype, "submitted", {
|
|
2453
|
+
/**
|
|
2454
|
+
* Imposta il componente come "submitted" scatenandone le validazioni ed eventualmente la visualizzazione del tooltip di errore
|
|
2455
|
+
*
|
|
2456
|
+
* @param {boolean} val **true** se si vuole impostare questo controllo come submitted, **false** altrimenti
|
|
2457
|
+
*/
|
|
2458
|
+
set: function (val) {
|
|
2459
|
+
this._submitted = val;
|
|
2460
|
+
if (!this.baseInput)
|
|
2461
|
+
return;
|
|
2462
|
+
if (val) {
|
|
2463
|
+
this.baseInput.control.markAsTouched();
|
|
2464
|
+
}
|
|
2465
|
+
if (this.baseInput.control.status === "INVALID" && val) { /*this.showTooltipWithMessage();*/ }
|
|
2466
|
+
else { /*this.tooltip.hide();*/ }
|
|
2467
|
+
},
|
|
2468
|
+
enumerable: false,
|
|
2469
|
+
configurable: true
|
|
2470
|
+
});
|
|
2471
|
+
Object.defineProperty(BaseFormControl.prototype, "forceInvalid", {
|
|
2472
|
+
/**
|
|
2473
|
+
* Imposta il componente come "invalid" a prescindere dai validatori
|
|
2474
|
+
*/
|
|
2475
|
+
set: function (val) {
|
|
2476
|
+
var _this = this;
|
|
2477
|
+
this._forceInvalid = val;
|
|
2478
|
+
if (val)
|
|
2479
|
+
setTimeout(function () {
|
|
2480
|
+
_this.baseInput.control.setErrors({ forcedtoinvalid: true });
|
|
2481
|
+
_this.baseInput.control.markAsTouched();
|
|
2482
|
+
_this.baseInput.control.markAsDirty();
|
|
2483
|
+
_this.cdr.detectChanges();
|
|
2484
|
+
});
|
|
2485
|
+
else
|
|
2486
|
+
setTimeout(function () {
|
|
2487
|
+
_this.baseInput.control.setErrors({ forcedtoinvalid: null });
|
|
2488
|
+
_this.baseInput.control.updateValueAndValidity();
|
|
2489
|
+
});
|
|
2490
|
+
},
|
|
2491
|
+
enumerable: false,
|
|
2492
|
+
configurable: true
|
|
2493
|
+
});
|
|
2494
|
+
/**
|
|
2495
|
+
* @ignore
|
|
2496
|
+
*/
|
|
2497
|
+
BaseFormControl.prototype.setDisabledState = function (isDisabled) {
|
|
2498
|
+
isDisabled ? this.baseInput.control.disable() : this.baseInput.control.enable();
|
|
2499
|
+
this.Readonly = isDisabled;
|
|
2500
|
+
};
|
|
2501
|
+
/**
|
|
2502
|
+
* Registra il Subject per ricevere le richieste di Focus dall'esterno
|
|
2503
|
+
*/
|
|
2504
|
+
BaseFormControl.prototype.registerFocusRequest = function () {
|
|
2505
|
+
var _this = this;
|
|
2506
|
+
if (!this.FocusSubject)
|
|
2507
|
+
return;
|
|
2508
|
+
this.observable = this.FocusSubject.subscribe(function (t) {
|
|
2509
|
+
_this.htmlInput.nativeElement.focus();
|
|
2510
|
+
});
|
|
2511
|
+
};
|
|
2512
|
+
/**
|
|
2513
|
+
* Deregistra il Subject delle richieste di focus
|
|
2514
|
+
*/
|
|
2515
|
+
BaseFormControl.prototype.deregisterFocusRequest = function () {
|
|
2516
|
+
if (this.observable)
|
|
2517
|
+
this.observable.unsubscribe();
|
|
2518
|
+
};
|
|
2445
2519
|
return BaseFormControl;
|
|
2446
2520
|
}());
|
|
2447
2521
|
BaseFormControl.decorators = [
|
|
@@ -2485,11 +2559,14 @@
|
|
|
2485
2559
|
Display: [{ type: core.Input }],
|
|
2486
2560
|
Readonly: [{ type: core.Input }],
|
|
2487
2561
|
LabelInputRatio: [{ type: core.Input }],
|
|
2488
|
-
|
|
2489
|
-
|
|
2562
|
+
htmlInput: [{ type: core.ViewChild, args: ['htmlInput', { static: false },] }],
|
|
2563
|
+
baseInput: [{ type: core.ViewChild, args: ["baseInput", { static: false },] }],
|
|
2564
|
+
baseInput_static: [{ type: core.ViewChild, args: ["baseInput", { static: true },] }],
|
|
2490
2565
|
inputChange: [{ type: core.Output }],
|
|
2491
2566
|
inputFocus: [{ type: core.Output }],
|
|
2492
|
-
inputFinalized: [{ type: core.Output }]
|
|
2567
|
+
inputFinalized: [{ type: core.Output }],
|
|
2568
|
+
submitted: [{ type: core.Input, args: ["submitted",] }],
|
|
2569
|
+
forceInvalid: [{ type: core.Input }]
|
|
2493
2570
|
};
|
|
2494
2571
|
|
|
2495
2572
|
/**
|
|
@@ -3359,6 +3436,7 @@
|
|
|
3359
3436
|
_this.HasSuffix = false;
|
|
3360
3437
|
/** Indica la presenza o meno di un prefisso, si basa sulla "truthiness" della proiezione **prefix** */
|
|
3361
3438
|
_this.HasPrefix = false;
|
|
3439
|
+
_this.ShowPassword = false;
|
|
3362
3440
|
return _this;
|
|
3363
3441
|
}
|
|
3364
3442
|
/** @ignore */
|
|
@@ -3373,12 +3451,17 @@
|
|
|
3373
3451
|
};
|
|
3374
3452
|
/** @ignore */
|
|
3375
3453
|
FormInputComponent.prototype.onNotNullValueSet = function () { };
|
|
3454
|
+
FormInputComponent.prototype.onShowHidePassword = function (event) {
|
|
3455
|
+
this.Password = !this.Password;
|
|
3456
|
+
this.ShowPassword = !this.ShowPassword;
|
|
3457
|
+
event.preventDefault();
|
|
3458
|
+
};
|
|
3376
3459
|
return FormInputComponent;
|
|
3377
3460
|
}(BaseFormControl));
|
|
3378
3461
|
FormInputComponent.decorators = [
|
|
3379
3462
|
{ type: core.Component, args: [{
|
|
3380
3463
|
selector: "form-input",
|
|
3381
|
-
template: "<!-- Uguale in tutti i componenti --------------------------------------------------------------------------->\r\n<ng-container *ngIf=\"!FormLayout && (!DisplayMode || (DisplayLayout != 'hidden' && DisplayCondition))\">\r\n <ng-container *ngIf=\"DisplayMode && !DisplayModeTemplate\">\r\n <ng-container *ngIf=\"DisplayLayout == 'form'\">{{ EvaluatedModel }}</ng-container>\r\n <div *ngIf=\"DisplayLayout == 'inline'\" class=\"app-inline\">{{ EvaluatedModel }}</div>\r\n </ng-container>\r\n <ng-container *ngIf=\"DisplayMode && DisplayModeTemplate\"><ng-container *ngTemplateOutlet=\"DisplayModeTemplate, context: { $implicit: EvaluatedModel }\"></ng-container></ng-container>\r\n <div [hidden]=\"DisplayMode\"><ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container></div>\r\n</ng-container>\r\n\r\n<div *ngIf=\"FormLayout && (!DisplayMode || (DisplayLayout != 'hidden' && DisplayCondition))\" class=\"{{FormGroupClass + (Last ? ' app-margin-bottom-0 app-margin-right-0 ' : '') + (DisplayLayout == 'inline' && DisplayMode ? (' app-inline-block ' + (!Last ? 'app-margin-right-10' : '')) : ' form-group row')}}\">\r\n
|
|
3464
|
+
template: "<!-- Uguale in tutti i componenti --------------------------------------------------------------------------->\r\n<ng-container *ngIf=\"!FormLayout && (!DisplayMode || (DisplayLayout != 'hidden' && DisplayCondition))\">\r\n <ng-container *ngIf=\"DisplayMode && !DisplayModeTemplate\">\r\n <ng-container *ngIf=\"DisplayLayout == 'form'\">{{ EvaluatedModel }}</ng-container>\r\n <div *ngIf=\"DisplayLayout == 'inline'\" class=\"app-inline\">{{ EvaluatedModel }}</div>\r\n </ng-container>\r\n <ng-container *ngIf=\"DisplayMode && DisplayModeTemplate\"><ng-container *ngTemplateOutlet=\"DisplayModeTemplate, context: { $implicit: EvaluatedModel }\"></ng-container></ng-container>\r\n <div [hidden]=\"DisplayMode\"><ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container></div>\r\n</ng-container>\r\n\r\n<div *ngIf=\"FormLayout && (!DisplayMode || (DisplayLayout != 'hidden' && DisplayCondition))\" class=\"{{FormGroupClass + (Last ? ' app-margin-bottom-0 app-margin-right-0 ' : '') + (DisplayLayout == 'inline' && DisplayMode ? (' app-inline-block ' + (!Last ? 'app-margin-right-10' : '')) : ' form-group row')}}\">\r\n <label class=\"col-md-{{(DisplayMode && DisplayLayout == 'inline' ? 'none app-bold app-margin-bottom-0' : LabelColWidth) + (DisplayMode ? ' app-bold' : ' m-t-5') }}\">{{Label}}{{Required && !DisplayMode ? '*' : ''}}{{Label ? \":\" : \"\"}}</label>\r\n <span *ngIf=\"DisplayMode && DisplayLayout == 'inline' && InlineSeparator != ''\">{{InlineSeparator}}</span>\r\n <div class=\"col-md-{{DisplayMode && DisplayLayout == 'inline' ? 'none app-inline-block' : InputColWidth}}\">\r\n <ng-container *ngIf=\"DisplayMode && !DisplayModeTemplate\">{{ EvaluatedModel }}</ng-container>\r\n <ng-container *ngIf=\"DisplayMode && DisplayModeTemplate\"><ng-container *ngTemplateOutlet=\"DisplayModeTemplate, context: { $implicit: EvaluatedModel }\"></ng-container></ng-container>\r\n <div [hidden]=\"DisplayMode\"><ng-container *ngTemplateOutlet=\"controlTemplate\"></ng-container></div>\r\n </div>\r\n <div class=\"clearfix\"></div>\r\n</div>\r\n<!----------------------------------------------------------------------------------------------------------->\r\n\r\n<ng-template #controlTemplate>\r\n <mat-form-field floatLabel=\"never\" appearance=\"{{FieldAppearence}}\" class=\"mat-full-width mat-no-border-top mat-height-fixed\">\r\n <mat-label [class.app-margin-left-25]=\"HasPrefix\" *ngIf=\"Placeholder && FloatingLabel\">{{Placeholder}}</mat-label>\r\n <!--Prefisso-->\r\n <ng-container *ngIf=\"HasPrefix\">\r\n <button type=\"button\"\r\n class=\"mat-button mat-icon-button mat-button-base mat-icon-button-override mat-icon-button-override-prefix\"\r\n matPrefix (click)=\"onPrefixAction.emit(); $event.stopPropagation(); $event.preventDefault();\">\r\n <ng-container *ngTemplateOutlet=\"prefix\"></ng-container>\r\n </button>\r\n </ng-container>\r\n <!--Input-->\r\n <input matInput\r\n #baseInput=\"ngModel\"\r\n #htmlInput\r\n [type]=\"Password ? 'password' : 'text'\"\r\n triggers=\"\"\r\n placement=\"top\"\r\n autocomplete=\"off\"\r\n name=\"base-input\"\r\n class=\"form-control\"\r\n id=\"{{GeneratedName}}\"\r\n [class.app-margin-left-25]=\"HasPrefix\"\r\n [class.mat-input-with-suffix]=\"HasSuffix || Password\"\r\n [(ngModel)]=\"Model\"\r\n [class.checking-field]=\"!Validation\"\r\n [readonly]=\"Frozen\"\r\n [disabled]=\"Readonly\"\r\n [placeholder]=\"FloatingLabel ? undefined : Placeholder\"\r\n (focus)=\"focused($event);\"\r\n (ngModelChange)=\"changed()\"\r\n (keyup)=\"($event.keyCode == 13 || $event.keyCode == 27) && finalized();\"\r\n (blur)=\"finalized();\"\r\n >\r\n <ng-container *ngIf=\"HasSuffix || Password\">\r\n <ng-container *ngIf=\"!Password\">\r\n <button type=\"button\"\r\n class=\"mat-button mat-icon-button mat-button-base mat-icon-button-override mat-icon-button-override-suffix\"\r\n matSuffix (click)=\"onSuffixAction.emit(); $event.stopPropagation(); $event.preventDefault();\">\r\n <ng-container *ngTemplateOutlet=\"suffix\"></ng-container>\r\n </button>\r\n </ng-container>\r\n <!--Password-->\r\n <span class=\"form-input-suffix\" *ngIf=\"Password\">\r\n <ng-container *ngIf=\"Password\" matSuffix>\r\n <a *ngIf=\"ShowPassword\" class=\"fa fa-eye-slash app-fs-16 app-pointer\" (click)=\"onShowHidePassword($event)\"></a>\r\n <a *ngIf=\"!ShowPassword\" class=\"fa fa-eye app-fs-16 app-pointer\" (click)=\"onShowHidePassword($event)\"></a>\r\n </ng-container>\r\n </span>\r\n </ng-container>\r\n </mat-form-field>\r\n</ng-template>",
|
|
3382
3465
|
changeDetection: core.ChangeDetectionStrategy.OnPush
|
|
3383
3466
|
},] }
|
|
3384
3467
|
];
|
|
@@ -3441,7 +3524,7 @@
|
|
|
3441
3524
|
*
|
|
3442
3525
|
* Si consiglia di mantenere il default
|
|
3443
3526
|
*/
|
|
3444
|
-
_this.EmptyFieldValue = '-
|
|
3527
|
+
_this.EmptyFieldValue = '-2000';
|
|
3445
3528
|
/** Se **true** rimuove il simbolino di validazione (croce rossa o tick verde) */
|
|
3446
3529
|
_this.ShowValidationSymbol = true;
|
|
3447
3530
|
/** Template per la visualizzazione delle opzioni */
|