ng-components-tsi 0.0.58 → 0.0.60
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.
|
@@ -141,6 +141,7 @@ class ButtonComponent {
|
|
|
141
141
|
isFullWidth = input(false);
|
|
142
142
|
paddingX = input('px-3');
|
|
143
143
|
paddingY = input('');
|
|
144
|
+
minWidth = input(null);
|
|
144
145
|
hasFocus = signal(false);
|
|
145
146
|
onFocus() {
|
|
146
147
|
this.hasFocus.set(true);
|
|
@@ -253,11 +254,11 @@ class ButtonComponent {
|
|
|
253
254
|
return `assets/images/${imageIcon[this.icon()]}`;
|
|
254
255
|
};
|
|
255
256
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: ButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
256
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.15", type: ButtonComponent, isStandalone: true, selector: "app-button", inputs: { autoFocus: { classPropertyName: "autoFocus", publicName: "autoFocus", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, outline: { classPropertyName: "outline", publicName: "outline", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, tooltip: { classPropertyName: "tooltip", publicName: "tooltip", isSignal: true, isRequired: false, transformFunction: null }, texto: { classPropertyName: "texto", publicName: "texto", isSignal: true, isRequired: false, transformFunction: null }, isHtml: { classPropertyName: "isHtml", publicName: "isHtml", isSignal: true, isRequired: false, transformFunction: null }, closeButton: { classPropertyName: "closeButton", publicName: "closeButton", isSignal: true, isRequired: false, transformFunction: null }, sunatButton: { classPropertyName: "sunatButton", publicName: "sunatButton", isSignal: true, isRequired: false, transformFunction: null }, inputButton: { classPropertyName: "inputButton", publicName: "inputButton", isSignal: true, isRequired: false, transformFunction: null }, buttonDeshabilitado: { classPropertyName: "buttonDeshabilitado", publicName: "buttonDeshabilitado", isSignal: true, isRequired: false, transformFunction: null }, atajo: { classPropertyName: "atajo", publicName: "atajo", isSignal: true, isRequired: false, transformFunction: null }, dropdownButton: { classPropertyName: "dropdownButton", publicName: "dropdownButton", isSignal: true, isRequired: false, transformFunction: null }, extraClass: { classPropertyName: "extraClass", publicName: "extraClass", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, uploadButton: { classPropertyName: "uploadButton", publicName: "uploadButton", isSignal: true, isRequired: false, transformFunction: null }, accept: { classPropertyName: "accept", publicName: "accept", isSignal: true, isRequired: false, transformFunction: null }, isRounded: { classPropertyName: "isRounded", publicName: "isRounded", isSignal: true, isRequired: false, transformFunction: null }, isNotStyle: { classPropertyName: "isNotStyle", publicName: "isNotStyle", isSignal: true, isRequired: false, transformFunction: null }, isFullWidth: { classPropertyName: "isFullWidth", publicName: "isFullWidth", isSignal: true, isRequired: false, transformFunction: null }, paddingX: { classPropertyName: "paddingX", publicName: "paddingX", isSignal: true, isRequired: false, transformFunction: null }, paddingY: { classPropertyName: "paddingY", publicName: "paddingY", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { accion: "accion", fileSelected: "fileSelected" }, viewQueries: [{ propertyName: "buttonNormal", first: true, predicate: ["boton"], descendants: true, isSignal: true }, { propertyName: "fileInput", first: true, predicate: ["fileInput"], descendants: true }], ngImport: i0, template: "@if(!closeButton() && !dropdownButton() && !uploadButton() && ! inputButton()){\r\n<button atajoTecla #boton [altKeyCombination]=\"atajo()\"\r\n (emitirAtajo)=\"disabled() ? null : ( atajo() ? ejecutarAccion() : null)\" [title]=\"construirAlt()\"\r\n (focus)=\"onFocus()\" (blur)=\"onBlur()\"\r\n [style.--focus-color-rgb]=\"getFocusColor()\"\r\n [style.--focus-color]=\"'rgba(' + getFocusColor() + ',0.5)'\"\r\n [ngClass]=\"getClasses()\" (click)=\"ejecutarAccion()\" [disabled]=\"disabled()\"\r\n [id]=\"`id_button_${texto()}`\">\r\n @if (isImageIcon(icon())) {\r\n <img [src]=\"getImageName()\" class=\"button-icon-hover\" height=\"16px\">\r\n }\r\n @else {\r\n <i [ngClass]=\"getIconClass()\" class=\"button-icon-hover\"></i>\r\n }\r\n @if(texto()){\r\n <span [innerHTML]=\"isHtml() ? getSafeHtml() : texto()\"></span>\r\n }\r\n</button>\r\n}\r\n\r\n@if(inputButton()){\r\n<button class=\"btn button-tilt-hover text-white me-1 fs-6 px-3 py-0 w-auto w-sm-100 radius-none padd\"\r\n [ngClass]=\"[outline() ? getColorClassOutline() : getColorClass(), !texto() ? 'boton-buscar' : '']\"\r\n (click)=\"ejecutarAccion()\" [disabled]=\"disabled()\">\r\n <i [ngClass]=\"getIconClass()\" class=\"button-icon-hover\"></i>\r\n @if(texto()){\r\n <span>{{ texto() }}</span>\r\n }\r\n</button>\r\n}\r\n\r\n@if(closeButton()){\r\n<button class=\"btn close fs-5 no-border\" (click)=\"ejecutarAccion()\" [disabled]=\"disabled()\">\r\n <i class=\"me-1 button-icon-hover text-dark fw-bold\" [ngClass]=\"getIconClass()\"></i>\r\n</button>\r\n}\r\n\r\n@if(dropdownButton()){\r\n<button class=\"dropdown-item fs-6\" (click)=\"handleClick($event)\" [disabled]=\"disabled()\" [ngClass]=\"extraClass()\"\r\n [ngbTooltip]=\"tooltip()\" [style.cursor]=\"shouldBlockClick() ? 'not-allowed' : 'pointer'\" placement=\"right\">\r\n \r\n @if (isImageIcon(icon())) {\r\n <img [src]=\"getImageName()\" class=\"me-1 button-icon-hover\" height=\"16px\" [alt]=\"icon()\" >\r\n }\r\n @else {\r\n <i [ngClass]=\"getIconClass()\" class=\"me-1\"></i>\r\n }\r\n\r\n @if(texto()){\r\n <span [innerHTML]=\"isHtml() ? getSafeHtml() : texto()\"></span>\r\n }\r\n @if(uploadButton()){\r\n <input type=\"file\" #fileInput [accept]=\"accept()\" (change)=\"handleFileInput($event)\" [disabled]=\"disabled()\"\r\n class=\"d-none\">\r\n }\r\n</button>\r\n}\r\n\r\n@if(uploadButton() && !dropdownButton()){\r\n<button class=\"btn btn-rounded button-tilt-hover text-white me-1 fs-8 px-3 w-auto w-sm-100\"\r\n [ngClass]=\"outline() ? getColorClassOutline() : getColorClass()\" (click)=\"triggerFileInput()\"\r\n [disabled]=\"disabled()\" [ngbTooltip]=\"tooltip()\" type=\"button\">\r\n <i [ngClass]=\"getIconClass()\" class=\"me-1 button-icon-hover\"></i>\r\n @if(texto()){\r\n <span [innerHTML]=\"isHtml() ? getSafeHtml() : texto()\"></span>\r\n }\r\n <input type=\"file\" #fileInput [accept]=\"accept()\" (change)=\"handleFileInput($event)\" [disabled]=\"disabled()\"\r\n class=\"d-none\">\r\n</button>\r\n}", styles: [".no-border{border:none!important}.button-icon-hover{display:inline-block}.btn{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}@keyframes tilt-bounce{0%,to{transform:rotate(0)}25%{transform:rotate(-.5deg)}75%{transform:rotate(.5deg)}}@keyframes icon-rotate-pop{0%{transform:rotate(0) scale(1)}25%{transform:rotate(10deg) scale(1.05)}50%{transform:rotate(-10deg) scale(1.1)}75%{transform:rotate(10deg) scale(1.05)}to{transform:rotate(0) scale(1)}}.button-tilt-hover:hover{animation:tilt-bounce .6s infinite ease-in-out,aura-pulse 1.5s ease-out infinite}.button-tilt-hover:hover .button-icon-hover{animation:icon-rotate-pop 1s ease-in-out infinite}.dropdown-item{font-size:12px!important;padding:7px 20px;color:#757575;transition:color .3s ease-in-out}.dropdown-item:hover{background:#e8e8e8;color:#222}.tooltip-inner{white-space:nowrap;max-width:none!important}:host ::ng-deep .tooltip-inner{white-space:nowrap;max-width:none!important}.radius-none{border-radius:0}.padd{padding:3px 8px!important}.circle{width:40px!important;height:40px!important;min-width:40px!important;min-height:40px!important;max-width:40px!important;max-height:40px!important;border-radius:100%;color:#fff;transition:box-shadow .3s ease;display:flex!important;justify-content:center!important;align-items:center!important}.circle:hover{box-shadow:0 4px 12px #0003}@keyframes aura-pulse{0%{box-shadow:0 0 0 0 var(--focus-color, rgba(0, 123, 255, .5))}50%{box-shadow:0 0 0 6px rgba(var(--focus-color-rgb, 0, 123, 255),.2)}to{box-shadow:0 0 0 0 var(--focus-color, rgba(0, 123, 255, 0))}}.aura-focus{animation:aura-pulse 1.5s ease-out infinite;outline:none!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: NgbTooltipModule }, { kind: "directive", type: i1$1.NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "popperOptions", "triggers", "positionTarget", "container", "disableTooltip", "tooltipClass", "tooltipContext", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }, { kind: "directive", type: AtajosDirective, selector: "[atajoTecla]", inputs: ["altKeyCombination"], outputs: ["emitirAtajo"] }] });
|
|
257
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.15", type: ButtonComponent, isStandalone: true, selector: "app-button", inputs: { autoFocus: { classPropertyName: "autoFocus", publicName: "autoFocus", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, outline: { classPropertyName: "outline", publicName: "outline", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, tooltip: { classPropertyName: "tooltip", publicName: "tooltip", isSignal: true, isRequired: false, transformFunction: null }, texto: { classPropertyName: "texto", publicName: "texto", isSignal: true, isRequired: false, transformFunction: null }, isHtml: { classPropertyName: "isHtml", publicName: "isHtml", isSignal: true, isRequired: false, transformFunction: null }, closeButton: { classPropertyName: "closeButton", publicName: "closeButton", isSignal: true, isRequired: false, transformFunction: null }, sunatButton: { classPropertyName: "sunatButton", publicName: "sunatButton", isSignal: true, isRequired: false, transformFunction: null }, inputButton: { classPropertyName: "inputButton", publicName: "inputButton", isSignal: true, isRequired: false, transformFunction: null }, buttonDeshabilitado: { classPropertyName: "buttonDeshabilitado", publicName: "buttonDeshabilitado", isSignal: true, isRequired: false, transformFunction: null }, atajo: { classPropertyName: "atajo", publicName: "atajo", isSignal: true, isRequired: false, transformFunction: null }, dropdownButton: { classPropertyName: "dropdownButton", publicName: "dropdownButton", isSignal: true, isRequired: false, transformFunction: null }, extraClass: { classPropertyName: "extraClass", publicName: "extraClass", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, uploadButton: { classPropertyName: "uploadButton", publicName: "uploadButton", isSignal: true, isRequired: false, transformFunction: null }, accept: { classPropertyName: "accept", publicName: "accept", isSignal: true, isRequired: false, transformFunction: null }, isRounded: { classPropertyName: "isRounded", publicName: "isRounded", isSignal: true, isRequired: false, transformFunction: null }, isNotStyle: { classPropertyName: "isNotStyle", publicName: "isNotStyle", isSignal: true, isRequired: false, transformFunction: null }, isFullWidth: { classPropertyName: "isFullWidth", publicName: "isFullWidth", isSignal: true, isRequired: false, transformFunction: null }, paddingX: { classPropertyName: "paddingX", publicName: "paddingX", isSignal: true, isRequired: false, transformFunction: null }, paddingY: { classPropertyName: "paddingY", publicName: "paddingY", isSignal: true, isRequired: false, transformFunction: null }, minWidth: { classPropertyName: "minWidth", publicName: "minWidth", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { accion: "accion", fileSelected: "fileSelected" }, viewQueries: [{ propertyName: "buttonNormal", first: true, predicate: ["boton"], descendants: true, isSignal: true }, { propertyName: "fileInput", first: true, predicate: ["fileInput"], descendants: true }], ngImport: i0, template: "@if(!closeButton() && !dropdownButton() && !uploadButton() && ! inputButton()){\r\n<button atajoTecla #boton [altKeyCombination]=\"atajo()\"\r\n (emitirAtajo)=\"disabled() ? null : ( atajo() ? ejecutarAccion() : null)\" [title]=\"construirAlt()\"\r\n (focus)=\"onFocus()\" (blur)=\"onBlur()\"\r\n [style.--focus-color-rgb]=\"getFocusColor()\"\r\n [style.--focus-color]=\"'rgba(' + getFocusColor() + ',0.5)'\"\r\n [style.min-width.px]=\"minWidth()\"\r\n [ngClass]=\"getClasses()\" (click)=\"ejecutarAccion()\" [disabled]=\"disabled()\"\r\n [id]=\"`id_button_${texto()}`\">\r\n @if (isImageIcon(icon())) {\r\n <img [src]=\"getImageName()\" class=\"button-icon-hover\" height=\"16px\">\r\n }\r\n @else {\r\n <i [ngClass]=\"getIconClass()\" class=\"button-icon-hover\"></i>\r\n }\r\n @if(texto()){\r\n <span [innerHTML]=\"isHtml() ? getSafeHtml() : texto()\"></span>\r\n }\r\n</button>\r\n}\r\n\r\n@if(inputButton()){\r\n<button class=\"btn button-tilt-hover text-white me-1 fs-6 px-3 py-0 w-auto w-sm-100 radius-none padd\"\r\n [ngClass]=\"[outline() ? getColorClassOutline() : getColorClass(), !texto() ? 'boton-buscar' : '']\"\r\n (click)=\"ejecutarAccion()\" [disabled]=\"disabled()\">\r\n <i [ngClass]=\"getIconClass()\" class=\"button-icon-hover\"></i>\r\n @if(texto()){\r\n <span>{{ texto() }}</span>\r\n }\r\n</button>\r\n}\r\n\r\n@if(closeButton()){\r\n<button class=\"btn close fs-5 no-border\" (click)=\"ejecutarAccion()\" [disabled]=\"disabled()\">\r\n <i class=\"me-1 button-icon-hover text-dark fw-bold\" [ngClass]=\"getIconClass()\"></i>\r\n</button>\r\n}\r\n\r\n@if(dropdownButton()){\r\n<button class=\"dropdown-item fs-6\" (click)=\"handleClick($event)\" [disabled]=\"disabled()\" [ngClass]=\"extraClass()\"\r\n [ngbTooltip]=\"tooltip()\" [style.cursor]=\"shouldBlockClick() ? 'not-allowed' : 'pointer'\" placement=\"right\">\r\n \r\n @if (isImageIcon(icon())) {\r\n <img [src]=\"getImageName()\" class=\"me-1 button-icon-hover\" height=\"16px\" [alt]=\"icon()\" >\r\n }\r\n @else {\r\n <i [ngClass]=\"getIconClass()\" class=\"me-1\"></i>\r\n }\r\n\r\n @if(texto()){\r\n <span [innerHTML]=\"isHtml() ? getSafeHtml() : texto()\"></span>\r\n }\r\n @if(uploadButton()){\r\n <input type=\"file\" #fileInput [accept]=\"accept()\" (change)=\"handleFileInput($event)\" [disabled]=\"disabled()\"\r\n class=\"d-none\">\r\n }\r\n</button>\r\n}\r\n\r\n@if(uploadButton() && !dropdownButton()){\r\n<button class=\"btn btn-rounded button-tilt-hover text-white me-1 fs-8 px-3 w-auto w-sm-100\"\r\n [ngClass]=\"outline() ? getColorClassOutline() : getColorClass()\" (click)=\"triggerFileInput()\"\r\n [disabled]=\"disabled()\" [ngbTooltip]=\"tooltip()\" type=\"button\">\r\n <i [ngClass]=\"getIconClass()\" class=\"me-1 button-icon-hover\"></i>\r\n @if(texto()){\r\n <span [innerHTML]=\"isHtml() ? getSafeHtml() : texto()\"></span>\r\n }\r\n <input type=\"file\" #fileInput [accept]=\"accept()\" (change)=\"handleFileInput($event)\" [disabled]=\"disabled()\"\r\n class=\"d-none\">\r\n</button>\r\n}", styles: [".no-border{border:none!important}.button-icon-hover{display:inline-block}.btn{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}@keyframes tilt-bounce{0%,to{transform:rotate(0)}25%{transform:rotate(-.5deg)}75%{transform:rotate(.5deg)}}@keyframes icon-rotate-pop{0%{transform:rotate(0) scale(1)}25%{transform:rotate(10deg) scale(1.05)}50%{transform:rotate(-10deg) scale(1.1)}75%{transform:rotate(10deg) scale(1.05)}to{transform:rotate(0) scale(1)}}.button-tilt-hover:hover{animation:tilt-bounce .6s infinite ease-in-out,aura-pulse 1.5s ease-out infinite}.button-tilt-hover:hover .button-icon-hover{animation:icon-rotate-pop 1s ease-in-out infinite}.dropdown-item{font-size:12px!important;padding:7px 20px;color:#757575;transition:color .3s ease-in-out}.dropdown-item:hover{background:#e8e8e8;color:#222}.tooltip-inner{white-space:nowrap;max-width:none!important}:host ::ng-deep .tooltip-inner{white-space:nowrap;max-width:none!important}.radius-none{border-radius:0}.padd{padding:3px 8px!important}.circle{width:40px!important;height:40px!important;min-width:40px!important;min-height:40px!important;max-width:40px!important;max-height:40px!important;border-radius:100%;color:#fff;transition:box-shadow .3s ease;display:flex!important;justify-content:center!important;align-items:center!important}.circle:hover{box-shadow:0 4px 12px #0003}@keyframes aura-pulse{0%{box-shadow:0 0 0 0 var(--focus-color, rgba(0, 123, 255, .5))}50%{box-shadow:0 0 0 6px rgba(var(--focus-color-rgb, 0, 123, 255),.2)}to{box-shadow:0 0 0 0 var(--focus-color, rgba(0, 123, 255, 0))}}.aura-focus{animation:aura-pulse 1.5s ease-out infinite;outline:none!important}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: NgbTooltipModule }, { kind: "directive", type: i1$1.NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "popperOptions", "triggers", "positionTarget", "container", "disableTooltip", "tooltipClass", "tooltipContext", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }, { kind: "directive", type: AtajosDirective, selector: "[atajoTecla]", inputs: ["altKeyCombination"], outputs: ["emitirAtajo"] }] });
|
|
257
258
|
}
|
|
258
259
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: ButtonComponent, decorators: [{
|
|
259
260
|
type: Component,
|
|
260
|
-
args: [{ selector: 'app-button', imports: [CommonModule, NgbTooltipModule, AtajosDirective], template: "@if(!closeButton() && !dropdownButton() && !uploadButton() && ! inputButton()){\r\n<button atajoTecla #boton [altKeyCombination]=\"atajo()\"\r\n (emitirAtajo)=\"disabled() ? null : ( atajo() ? ejecutarAccion() : null)\" [title]=\"construirAlt()\"\r\n (focus)=\"onFocus()\" (blur)=\"onBlur()\"\r\n [style.--focus-color-rgb]=\"getFocusColor()\"\r\n [style.--focus-color]=\"'rgba(' + getFocusColor() + ',0.5)'\"\r\n [ngClass]=\"getClasses()\" (click)=\"ejecutarAccion()\" [disabled]=\"disabled()\"\r\n [id]=\"`id_button_${texto()}`\">\r\n @if (isImageIcon(icon())) {\r\n <img [src]=\"getImageName()\" class=\"button-icon-hover\" height=\"16px\">\r\n }\r\n @else {\r\n <i [ngClass]=\"getIconClass()\" class=\"button-icon-hover\"></i>\r\n }\r\n @if(texto()){\r\n <span [innerHTML]=\"isHtml() ? getSafeHtml() : texto()\"></span>\r\n }\r\n</button>\r\n}\r\n\r\n@if(inputButton()){\r\n<button class=\"btn button-tilt-hover text-white me-1 fs-6 px-3 py-0 w-auto w-sm-100 radius-none padd\"\r\n [ngClass]=\"[outline() ? getColorClassOutline() : getColorClass(), !texto() ? 'boton-buscar' : '']\"\r\n (click)=\"ejecutarAccion()\" [disabled]=\"disabled()\">\r\n <i [ngClass]=\"getIconClass()\" class=\"button-icon-hover\"></i>\r\n @if(texto()){\r\n <span>{{ texto() }}</span>\r\n }\r\n</button>\r\n}\r\n\r\n@if(closeButton()){\r\n<button class=\"btn close fs-5 no-border\" (click)=\"ejecutarAccion()\" [disabled]=\"disabled()\">\r\n <i class=\"me-1 button-icon-hover text-dark fw-bold\" [ngClass]=\"getIconClass()\"></i>\r\n</button>\r\n}\r\n\r\n@if(dropdownButton()){\r\n<button class=\"dropdown-item fs-6\" (click)=\"handleClick($event)\" [disabled]=\"disabled()\" [ngClass]=\"extraClass()\"\r\n [ngbTooltip]=\"tooltip()\" [style.cursor]=\"shouldBlockClick() ? 'not-allowed' : 'pointer'\" placement=\"right\">\r\n \r\n @if (isImageIcon(icon())) {\r\n <img [src]=\"getImageName()\" class=\"me-1 button-icon-hover\" height=\"16px\" [alt]=\"icon()\" >\r\n }\r\n @else {\r\n <i [ngClass]=\"getIconClass()\" class=\"me-1\"></i>\r\n }\r\n\r\n @if(texto()){\r\n <span [innerHTML]=\"isHtml() ? getSafeHtml() : texto()\"></span>\r\n }\r\n @if(uploadButton()){\r\n <input type=\"file\" #fileInput [accept]=\"accept()\" (change)=\"handleFileInput($event)\" [disabled]=\"disabled()\"\r\n class=\"d-none\">\r\n }\r\n</button>\r\n}\r\n\r\n@if(uploadButton() && !dropdownButton()){\r\n<button class=\"btn btn-rounded button-tilt-hover text-white me-1 fs-8 px-3 w-auto w-sm-100\"\r\n [ngClass]=\"outline() ? getColorClassOutline() : getColorClass()\" (click)=\"triggerFileInput()\"\r\n [disabled]=\"disabled()\" [ngbTooltip]=\"tooltip()\" type=\"button\">\r\n <i [ngClass]=\"getIconClass()\" class=\"me-1 button-icon-hover\"></i>\r\n @if(texto()){\r\n <span [innerHTML]=\"isHtml() ? getSafeHtml() : texto()\"></span>\r\n }\r\n <input type=\"file\" #fileInput [accept]=\"accept()\" (change)=\"handleFileInput($event)\" [disabled]=\"disabled()\"\r\n class=\"d-none\">\r\n</button>\r\n}", styles: [".no-border{border:none!important}.button-icon-hover{display:inline-block}.btn{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}@keyframes tilt-bounce{0%,to{transform:rotate(0)}25%{transform:rotate(-.5deg)}75%{transform:rotate(.5deg)}}@keyframes icon-rotate-pop{0%{transform:rotate(0) scale(1)}25%{transform:rotate(10deg) scale(1.05)}50%{transform:rotate(-10deg) scale(1.1)}75%{transform:rotate(10deg) scale(1.05)}to{transform:rotate(0) scale(1)}}.button-tilt-hover:hover{animation:tilt-bounce .6s infinite ease-in-out,aura-pulse 1.5s ease-out infinite}.button-tilt-hover:hover .button-icon-hover{animation:icon-rotate-pop 1s ease-in-out infinite}.dropdown-item{font-size:12px!important;padding:7px 20px;color:#757575;transition:color .3s ease-in-out}.dropdown-item:hover{background:#e8e8e8;color:#222}.tooltip-inner{white-space:nowrap;max-width:none!important}:host ::ng-deep .tooltip-inner{white-space:nowrap;max-width:none!important}.radius-none{border-radius:0}.padd{padding:3px 8px!important}.circle{width:40px!important;height:40px!important;min-width:40px!important;min-height:40px!important;max-width:40px!important;max-height:40px!important;border-radius:100%;color:#fff;transition:box-shadow .3s ease;display:flex!important;justify-content:center!important;align-items:center!important}.circle:hover{box-shadow:0 4px 12px #0003}@keyframes aura-pulse{0%{box-shadow:0 0 0 0 var(--focus-color, rgba(0, 123, 255, .5))}50%{box-shadow:0 0 0 6px rgba(var(--focus-color-rgb, 0, 123, 255),.2)}to{box-shadow:0 0 0 0 var(--focus-color, rgba(0, 123, 255, 0))}}.aura-focus{animation:aura-pulse 1.5s ease-out infinite;outline:none!important}\n"] }]
|
|
261
|
+
args: [{ selector: 'app-button', imports: [CommonModule, NgbTooltipModule, AtajosDirective], template: "@if(!closeButton() && !dropdownButton() && !uploadButton() && ! inputButton()){\r\n<button atajoTecla #boton [altKeyCombination]=\"atajo()\"\r\n (emitirAtajo)=\"disabled() ? null : ( atajo() ? ejecutarAccion() : null)\" [title]=\"construirAlt()\"\r\n (focus)=\"onFocus()\" (blur)=\"onBlur()\"\r\n [style.--focus-color-rgb]=\"getFocusColor()\"\r\n [style.--focus-color]=\"'rgba(' + getFocusColor() + ',0.5)'\"\r\n [style.min-width.px]=\"minWidth()\"\r\n [ngClass]=\"getClasses()\" (click)=\"ejecutarAccion()\" [disabled]=\"disabled()\"\r\n [id]=\"`id_button_${texto()}`\">\r\n @if (isImageIcon(icon())) {\r\n <img [src]=\"getImageName()\" class=\"button-icon-hover\" height=\"16px\">\r\n }\r\n @else {\r\n <i [ngClass]=\"getIconClass()\" class=\"button-icon-hover\"></i>\r\n }\r\n @if(texto()){\r\n <span [innerHTML]=\"isHtml() ? getSafeHtml() : texto()\"></span>\r\n }\r\n</button>\r\n}\r\n\r\n@if(inputButton()){\r\n<button class=\"btn button-tilt-hover text-white me-1 fs-6 px-3 py-0 w-auto w-sm-100 radius-none padd\"\r\n [ngClass]=\"[outline() ? getColorClassOutline() : getColorClass(), !texto() ? 'boton-buscar' : '']\"\r\n (click)=\"ejecutarAccion()\" [disabled]=\"disabled()\">\r\n <i [ngClass]=\"getIconClass()\" class=\"button-icon-hover\"></i>\r\n @if(texto()){\r\n <span>{{ texto() }}</span>\r\n }\r\n</button>\r\n}\r\n\r\n@if(closeButton()){\r\n<button class=\"btn close fs-5 no-border\" (click)=\"ejecutarAccion()\" [disabled]=\"disabled()\">\r\n <i class=\"me-1 button-icon-hover text-dark fw-bold\" [ngClass]=\"getIconClass()\"></i>\r\n</button>\r\n}\r\n\r\n@if(dropdownButton()){\r\n<button class=\"dropdown-item fs-6\" (click)=\"handleClick($event)\" [disabled]=\"disabled()\" [ngClass]=\"extraClass()\"\r\n [ngbTooltip]=\"tooltip()\" [style.cursor]=\"shouldBlockClick() ? 'not-allowed' : 'pointer'\" placement=\"right\">\r\n \r\n @if (isImageIcon(icon())) {\r\n <img [src]=\"getImageName()\" class=\"me-1 button-icon-hover\" height=\"16px\" [alt]=\"icon()\" >\r\n }\r\n @else {\r\n <i [ngClass]=\"getIconClass()\" class=\"me-1\"></i>\r\n }\r\n\r\n @if(texto()){\r\n <span [innerHTML]=\"isHtml() ? getSafeHtml() : texto()\"></span>\r\n }\r\n @if(uploadButton()){\r\n <input type=\"file\" #fileInput [accept]=\"accept()\" (change)=\"handleFileInput($event)\" [disabled]=\"disabled()\"\r\n class=\"d-none\">\r\n }\r\n</button>\r\n}\r\n\r\n@if(uploadButton() && !dropdownButton()){\r\n<button class=\"btn btn-rounded button-tilt-hover text-white me-1 fs-8 px-3 w-auto w-sm-100\"\r\n [ngClass]=\"outline() ? getColorClassOutline() : getColorClass()\" (click)=\"triggerFileInput()\"\r\n [disabled]=\"disabled()\" [ngbTooltip]=\"tooltip()\" type=\"button\">\r\n <i [ngClass]=\"getIconClass()\" class=\"me-1 button-icon-hover\"></i>\r\n @if(texto()){\r\n <span [innerHTML]=\"isHtml() ? getSafeHtml() : texto()\"></span>\r\n }\r\n <input type=\"file\" #fileInput [accept]=\"accept()\" (change)=\"handleFileInput($event)\" [disabled]=\"disabled()\"\r\n class=\"d-none\">\r\n</button>\r\n}", styles: [".no-border{border:none!important}.button-icon-hover{display:inline-block}.btn{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}@keyframes tilt-bounce{0%,to{transform:rotate(0)}25%{transform:rotate(-.5deg)}75%{transform:rotate(.5deg)}}@keyframes icon-rotate-pop{0%{transform:rotate(0) scale(1)}25%{transform:rotate(10deg) scale(1.05)}50%{transform:rotate(-10deg) scale(1.1)}75%{transform:rotate(10deg) scale(1.05)}to{transform:rotate(0) scale(1)}}.button-tilt-hover:hover{animation:tilt-bounce .6s infinite ease-in-out,aura-pulse 1.5s ease-out infinite}.button-tilt-hover:hover .button-icon-hover{animation:icon-rotate-pop 1s ease-in-out infinite}.dropdown-item{font-size:12px!important;padding:7px 20px;color:#757575;transition:color .3s ease-in-out}.dropdown-item:hover{background:#e8e8e8;color:#222}.tooltip-inner{white-space:nowrap;max-width:none!important}:host ::ng-deep .tooltip-inner{white-space:nowrap;max-width:none!important}.radius-none{border-radius:0}.padd{padding:3px 8px!important}.circle{width:40px!important;height:40px!important;min-width:40px!important;min-height:40px!important;max-width:40px!important;max-height:40px!important;border-radius:100%;color:#fff;transition:box-shadow .3s ease;display:flex!important;justify-content:center!important;align-items:center!important}.circle:hover{box-shadow:0 4px 12px #0003}@keyframes aura-pulse{0%{box-shadow:0 0 0 0 var(--focus-color, rgba(0, 123, 255, .5))}50%{box-shadow:0 0 0 6px rgba(var(--focus-color-rgb, 0, 123, 255),.2)}to{box-shadow:0 0 0 0 var(--focus-color, rgba(0, 123, 255, 0))}}.aura-focus{animation:aura-pulse 1.5s ease-out infinite;outline:none!important}\n"] }]
|
|
261
262
|
}], ctorParameters: () => [], propDecorators: { fileInput: [{
|
|
262
263
|
type: ViewChild,
|
|
263
264
|
args: ['fileInput']
|
|
@@ -416,11 +417,11 @@ class AlertConfirmationComponent {
|
|
|
416
417
|
this.activeModal.close();
|
|
417
418
|
}
|
|
418
419
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: AlertConfirmationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
419
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.15", type: AlertConfirmationComponent, isStandalone: true, selector: "app-alert-confirmation", inputs: { selectedOption: { classPropertyName: "selectedOption", publicName: "selectedOption", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selectedOption: "selectedOptionChange" }, ngImport: i0, template: "<div class=\"alert-confirm-container\">\n\n <div class=\"icon-wrapper\">\n
|
|
420
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.15", type: AlertConfirmationComponent, isStandalone: true, selector: "app-alert-confirmation", inputs: { selectedOption: { classPropertyName: "selectedOption", publicName: "selectedOption", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selectedOption: "selectedOptionChange" }, ngImport: i0, template: "<div class=\"alert-confirm-container\">\n\n\n <div class=\"alert-confirm-content\">\n\n <div class=\"icon-wrapper\">\n <div class=\"icon-circle\">\n <i class=\"fas fa-exclamation-triangle\"></i>\n </div>\n <div class=\"icon-badge\">\n <i class=\"fas fa-exclamation text-warning\"></i>\n </div>\n </div>\n\n <h2 class=\"error-title\">{{ title() }}</h2>\n\n <div class=\"confirm-message\" [innerHTML]=\"textoFormateado()\"></div>\n\n @if(select()){\n <div class=\"select-wrapper\">\n @if (showLabel()) {\n <label class=\"select-label\">Motivo:</label>\n }\n <select class=\"form-select\" [(ngModel)]=\"selectedOption\">\n @for(opt of opcionesFormateadas(); track $index){\n <option [value]=\"opt.codigo\">{{ opt.descri }}</option>\n }\n </select>\n </div>\n }\n\n @if(showTextarea() && mostrarTextareaComputed()){\n <div class=\"textarea-wrapper\">\n <textarea class=\"form-control\" placeholder=\"Ingresar motivo...\" [(ngModel)]=\"textareaValueModel\"\n (ngModelChange)=\"onTextareaChange($event)\" [maxlength]=\"maxLength()\">\n </textarea>\n <div class=\"character-counter\" [class.color-caracter]=\"(maxLength() - (textareaValueModel?.length || 0)) < 10\">\n Caracteres disponibles: {{ maxLength() - (textareaValueModel?.length || 0) }} de {{ maxLength() }}\n </div>\n </div>\n }\n </div>\n\n\n <div class=\"actions\">\n @if(mostrarConfirmar()){\n <app-button [texto]=\"confirmar()\" color=\"azul\" (accion)=\"onConfirmar()\" [isHtml]=\"true\" [autoFocus]=\"focus()\" [minWidth]=\"100\" />\n }\n @if(mostrarExtra()){\n <app-button [texto]=\"extra()\" [color]=\"colorExtra()\" (accion)=\"onExtra()\" [isHtml]=\"true\" />\n }\n @if(mostrarCancelar()){\n <app-button [texto]=\"cancelar()\" color=\"rojo\" (accion)=\"closeModal()\" [isHtml]=\"true\" [autoFocus]=\"!focus()\" [minWidth]=\"100\" />\n }\n </div>\n\n <div class=\"fw-bold fs-6 mt-4 d-inline-flex px-3 py-1 rounded d-flex align-items-center gap-2\"\n style=\"background: rgba(128, 128, 128, 0.185);\">\n <i class=\"fa-solid fa-shield-halved\"></i>\n Por favor, selecciona cuidadosamente. Esta acci\u00F3n es irreversible.\n </div>\n\n</div>", styles: [".alert-confirm-container{border-radius:16px;display:flex;flex-direction:column;max-height:85vh;overflow:hidden;padding-bottom:32px}.alert-confirm-container>div:last-child{align-self:center;padding:0 30px}.alert-confirm-content{flex:1;min-height:0;overflow-y:auto;overflow-x:hidden;padding:40px 30px 24px;text-align:center}.alert-confirm-content::-webkit-scrollbar{width:5px}.alert-confirm-content::-webkit-scrollbar-track{background:transparent}.alert-confirm-content::-webkit-scrollbar-thumb{background-color:#00000026;border-radius:3px}@keyframes confirmEntrance{0%{transform:scale(.4);opacity:0}60%{transform:scale(1.15);opacity:1}80%{transform:scale(.95)}to{transform:scale(1)}}@keyframes confirmPulse{0%,to{box-shadow:0 8px 24px #b4780059}50%{box-shadow:0 8px 32px #b47800a6,0 0 0 10px #b4780012}}@keyframes badgeBounce{0%{transform:scale(0);opacity:0}70%{transform:scale(1.25);opacity:1}to{transform:scale(1)}}.icon-wrapper{position:relative;display:inline-block;margin-bottom:24px}.icon-circle{width:80px;height:80px;background:linear-gradient(135deg,#fbbf24,#d97706);border-radius:50%;display:flex;align-items:center;justify-content:center;box-shadow:0 8px 24px #b4780059;animation:confirmEntrance .5s cubic-bezier(.36,.07,.19,.97) both,confirmPulse 2.4s ease-in-out .5s infinite}.icon-circle i{color:#fff;font-size:34px;font-weight:900}.icon-badge{position:absolute;top:-4px;right:-6px;width:26px;height:26px;background-color:var(--background-card);border-radius:50%;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 6px #0000001f;animation:badgeBounce .4s cubic-bezier(.36,.07,.19,.97) .4s both}.icon-badge i{font-size:11px;font-weight:900}.confirm-message{font-size:.95rem;color:#6b7280;line-height:1.6;margin-bottom:24px}.select-wrapper{display:flex;align-items:center;gap:8px;margin-bottom:16px;text-align:left}.select-wrapper .select-label{font-size:.875rem;font-weight:600;color:#374151;white-space:nowrap;margin-bottom:0}.textarea-wrapper{margin-bottom:16px;text-align:left}.textarea-wrapper .form-control{min-height:100px;resize:vertical}.character-counter{font-size:.75rem;color:#9ca3af;text-align:right;margin-top:4px}.color-caracter{color:#d97706!important}.actions{display:flex;justify-content:center;gap:10px;flex-wrap:wrap;padding:0 30px}.actions app-button{min-width:110px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$2.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$2.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$2.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i1$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: ButtonComponent, selector: "app-button", inputs: ["autoFocus", "color", "outline", "icon", "tooltip", "texto", "isHtml", "closeButton", "sunatButton", "inputButton", "buttonDeshabilitado", "atajo", "dropdownButton", "extraClass", "disabled", "uploadButton", "accept", "isRounded", "isNotStyle", "isFullWidth", "paddingX", "paddingY", "minWidth"], outputs: ["accion", "fileSelected"] }] });
|
|
420
421
|
}
|
|
421
422
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: AlertConfirmationComponent, decorators: [{
|
|
422
423
|
type: Component,
|
|
423
|
-
args: [{ selector: 'app-alert-confirmation', imports: [CommonModule, FormsModule, ButtonComponent], template: "<div class=\"alert-confirm-container\">\n\n <div class=\"icon-wrapper\">\n
|
|
424
|
+
args: [{ selector: 'app-alert-confirmation', imports: [CommonModule, FormsModule, ButtonComponent], template: "<div class=\"alert-confirm-container\">\n\n\n <div class=\"alert-confirm-content\">\n\n <div class=\"icon-wrapper\">\n <div class=\"icon-circle\">\n <i class=\"fas fa-exclamation-triangle\"></i>\n </div>\n <div class=\"icon-badge\">\n <i class=\"fas fa-exclamation text-warning\"></i>\n </div>\n </div>\n\n <h2 class=\"error-title\">{{ title() }}</h2>\n\n <div class=\"confirm-message\" [innerHTML]=\"textoFormateado()\"></div>\n\n @if(select()){\n <div class=\"select-wrapper\">\n @if (showLabel()) {\n <label class=\"select-label\">Motivo:</label>\n }\n <select class=\"form-select\" [(ngModel)]=\"selectedOption\">\n @for(opt of opcionesFormateadas(); track $index){\n <option [value]=\"opt.codigo\">{{ opt.descri }}</option>\n }\n </select>\n </div>\n }\n\n @if(showTextarea() && mostrarTextareaComputed()){\n <div class=\"textarea-wrapper\">\n <textarea class=\"form-control\" placeholder=\"Ingresar motivo...\" [(ngModel)]=\"textareaValueModel\"\n (ngModelChange)=\"onTextareaChange($event)\" [maxlength]=\"maxLength()\">\n </textarea>\n <div class=\"character-counter\" [class.color-caracter]=\"(maxLength() - (textareaValueModel?.length || 0)) < 10\">\n Caracteres disponibles: {{ maxLength() - (textareaValueModel?.length || 0) }} de {{ maxLength() }}\n </div>\n </div>\n }\n </div>\n\n\n <div class=\"actions\">\n @if(mostrarConfirmar()){\n <app-button [texto]=\"confirmar()\" color=\"azul\" (accion)=\"onConfirmar()\" [isHtml]=\"true\" [autoFocus]=\"focus()\" [minWidth]=\"100\" />\n }\n @if(mostrarExtra()){\n <app-button [texto]=\"extra()\" [color]=\"colorExtra()\" (accion)=\"onExtra()\" [isHtml]=\"true\" />\n }\n @if(mostrarCancelar()){\n <app-button [texto]=\"cancelar()\" color=\"rojo\" (accion)=\"closeModal()\" [isHtml]=\"true\" [autoFocus]=\"!focus()\" [minWidth]=\"100\" />\n }\n </div>\n\n <div class=\"fw-bold fs-6 mt-4 d-inline-flex px-3 py-1 rounded d-flex align-items-center gap-2\"\n style=\"background: rgba(128, 128, 128, 0.185);\">\n <i class=\"fa-solid fa-shield-halved\"></i>\n Por favor, selecciona cuidadosamente. Esta acci\u00F3n es irreversible.\n </div>\n\n</div>", styles: [".alert-confirm-container{border-radius:16px;display:flex;flex-direction:column;max-height:85vh;overflow:hidden;padding-bottom:32px}.alert-confirm-container>div:last-child{align-self:center;padding:0 30px}.alert-confirm-content{flex:1;min-height:0;overflow-y:auto;overflow-x:hidden;padding:40px 30px 24px;text-align:center}.alert-confirm-content::-webkit-scrollbar{width:5px}.alert-confirm-content::-webkit-scrollbar-track{background:transparent}.alert-confirm-content::-webkit-scrollbar-thumb{background-color:#00000026;border-radius:3px}@keyframes confirmEntrance{0%{transform:scale(.4);opacity:0}60%{transform:scale(1.15);opacity:1}80%{transform:scale(.95)}to{transform:scale(1)}}@keyframes confirmPulse{0%,to{box-shadow:0 8px 24px #b4780059}50%{box-shadow:0 8px 32px #b47800a6,0 0 0 10px #b4780012}}@keyframes badgeBounce{0%{transform:scale(0);opacity:0}70%{transform:scale(1.25);opacity:1}to{transform:scale(1)}}.icon-wrapper{position:relative;display:inline-block;margin-bottom:24px}.icon-circle{width:80px;height:80px;background:linear-gradient(135deg,#fbbf24,#d97706);border-radius:50%;display:flex;align-items:center;justify-content:center;box-shadow:0 8px 24px #b4780059;animation:confirmEntrance .5s cubic-bezier(.36,.07,.19,.97) both,confirmPulse 2.4s ease-in-out .5s infinite}.icon-circle i{color:#fff;font-size:34px;font-weight:900}.icon-badge{position:absolute;top:-4px;right:-6px;width:26px;height:26px;background-color:var(--background-card);border-radius:50%;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 6px #0000001f;animation:badgeBounce .4s cubic-bezier(.36,.07,.19,.97) .4s both}.icon-badge i{font-size:11px;font-weight:900}.confirm-message{font-size:.95rem;color:#6b7280;line-height:1.6;margin-bottom:24px}.select-wrapper{display:flex;align-items:center;gap:8px;margin-bottom:16px;text-align:left}.select-wrapper .select-label{font-size:.875rem;font-weight:600;color:#374151;white-space:nowrap;margin-bottom:0}.textarea-wrapper{margin-bottom:16px;text-align:left}.textarea-wrapper .form-control{min-height:100px;resize:vertical}.character-counter{font-size:.75rem;color:#9ca3af;text-align:right;margin-top:4px}.color-caracter{color:#d97706!important}.actions{display:flex;justify-content:center;gap:10px;flex-wrap:wrap;padding:0 30px}.actions app-button{min-width:110px}\n"] }]
|
|
424
425
|
}], ctorParameters: () => [] });
|
|
425
426
|
|
|
426
427
|
var alertConfirmation_component = /*#__PURE__*/Object.freeze({
|
|
@@ -461,7 +462,7 @@ class AlertErrorComponent {
|
|
|
461
462
|
this.activeModal.close(true);
|
|
462
463
|
}
|
|
463
464
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: AlertErrorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
464
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.15", type: AlertErrorComponent, isStandalone: true, selector: "app-alert-error", ngImport: i0, template: "<div class=\"alert-error-container\">\n\n <div class=\"alert-error-content\">\n\n <div class=\"icon-wrapper\">\n <div class=\"icon-circle\">\n <i class=\"fas fa-exclamation\"></i>\n </div>\n <div class=\"icon-badge\">\n <i class=\"fas fa-exclamation-triangle\"></i>\n </div>\n </div>\n\n <h2 class=\"error-title text-dark\">{{ titulo() }}</h2>\n\n <p class=\"error-message\" [innerHTML]=\"mensajeFormateado()\"></p>\n\n @if (codigoEstado() || idTraza() || timestamp()) {\n <div class=\"technical-details\">\n <div class=\"tech-header\">\n <i class=\"fas fa-terminal\"></i>\n <span>DETALLES T\u00C9CNICOS</span>\n </div>\n @if (codigoEstado()) {\n <div class=\"tech-row\">\n <span class=\"tech-label\">C\u00D3DIGO_ESTADO:</span>\n <span class=\"tech-value error-code\">{{ codigoEstado() }}</span>\n </div>\n }\n @if (idTraza()) {\n <div class=\"tech-row\">\n <span class=\"tech-label\">ID_TRAZA:</span>\n <span class=\"tech-value\">{{ idTraza() }}</span>\n </div>\n }\n @if (timestamp()) {\n <div class=\"tech-row\">\n <span class=\"tech-label\">TIMESTAMP:</span>\n <span class=\"tech-value\">{{ timestamp() }}</span>\n </div>\n }\n </div>\n }\n\n </div>\n\n <div class=\"actions\">\n <app-button texto=\"Aceptar\" color=\"rojo_alerta\" [isFullWidth]=\"true\" (accion)=\"onAceptar()\" [autoFocus]=\"true\"\n paddingY=\"py-2\" />\n </div>\n\n</div>", styles: [".alert-error-container{border-radius:16px;display:flex;flex-direction:column;max-height:85vh;overflow:hidden}.alert-error-content{flex:1;min-height:0;overflow-y:auto;overflow-x:hidden;padding:40px 30px 24px;text-align:center}.alert-error-content::-webkit-scrollbar{width:5px}.alert-error-content::-webkit-scrollbar-track{background:transparent}.alert-error-content::-webkit-scrollbar-thumb{background-color:#00000026;border-radius:3px}@keyframes errorEntrance{0%{transform:scale(.4);opacity:0}60%{transform:scale(1.15);opacity:1}80%{transform:scale(.95)}to{transform:scale(1)}}@keyframes errorPulse{0%,to{box-shadow:0 8px 24px #c81e1e66}50%{box-shadow:0 8px 32px #c81e1ebf,0 0 0 10px #c81e1e14}}@keyframes badgeBounce{0%{transform:scale(0);opacity:0}70%{transform:scale(1.25);opacity:1}to{transform:scale(1)}}.icon-wrapper{position:relative;display:inline-block;margin-bottom:24px}.icon-circle{width:80px;height:80px;background:linear-gradient(135deg,#f05252,#c81e1e);border-radius:50%;display:flex;align-items:center;justify-content:center;box-shadow:0 8px 24px #c81e1e66;animation:errorEntrance .5s cubic-bezier(.36,.07,.19,.97) both,errorPulse 2.4s ease-in-out .5s infinite}.icon-circle i{color:#fff;font-size:36px;font-weight:900}.icon-badge{position:absolute;top:-4px;right:-6px;width:26px;height:26px;background-color:var(--background-card);border-radius:50%;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 6px #0000001f;animation:badgeBounce .4s cubic-bezier(.36,.07,.19,.97) .4s both}.icon-badge i{color:#be0000;font-size:12px}.error-title{font-size:1.5rem;font-weight:700;margin-bottom:12px}.error-message{font-size:.95rem;color:#6b7280;line-height:1.6;margin-bottom:28px;word-break:break-word;overflow-wrap:break-word}.actions{flex-shrink:0;padding:16px 30px 24px;border-top:1px solid rgba(0,0,0,.06)}.actions app-button{width:100%}.btn-cerrar{background:none;border:none;padding:6px 16px;font-size:.95rem;color:#374151;cursor:pointer;font-weight:500}.btn-cerrar:hover{color:#1a1a2e;text-decoration:underline}.technical-details{background-color:var(--background-color);border:var(--border-table-header);border-radius:10px;padding:16px 20px;text-align:left}.tech-header{display:flex;align-items:center;gap:8px;margin-bottom:12px}.tech-header i{color:#8a8a8a;font-size:12px}.tech-header span{font-size:.7rem;font-weight:700;color:#64748b;letter-spacing:.08em;text-transform:uppercase}.tech-row{display:flex;justify-content:space-between;align-items:center;padding:3px 0}.tech-row .tech-label{font-size:.72rem;color:#929292;font-weight:600;letter-spacing:.05em;text-transform:uppercase}.tech-row .tech-value{font-size:.78rem;color:#475569;font-family:monospace;word-break:break-all;max-width:65%;text-align:right}.tech-row .tech-value.error-code{color:#e0352b;font-weight:700;text-transform:uppercase}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: ButtonComponent, selector: "app-button", inputs: ["autoFocus", "color", "outline", "icon", "tooltip", "texto", "isHtml", "closeButton", "sunatButton", "inputButton", "buttonDeshabilitado", "atajo", "dropdownButton", "extraClass", "disabled", "uploadButton", "accept", "isRounded", "isNotStyle", "isFullWidth", "paddingX", "paddingY"], outputs: ["accion", "fileSelected"] }] });
|
|
465
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.15", type: AlertErrorComponent, isStandalone: true, selector: "app-alert-error", ngImport: i0, template: "<div class=\"alert-error-container\">\n\n <div class=\"alert-error-content\">\n\n <div class=\"icon-wrapper\">\n <div class=\"icon-circle\">\n <i class=\"fas fa-exclamation\"></i>\n </div>\n <div class=\"icon-badge\">\n <i class=\"fas fa-exclamation-triangle\"></i>\n </div>\n </div>\n\n <h2 class=\"error-title text-dark\">{{ titulo() }}</h2>\n\n <p class=\"error-message\" [innerHTML]=\"mensajeFormateado()\"></p>\n\n @if (codigoEstado() || idTraza() || timestamp()) {\n <div class=\"technical-details\">\n <div class=\"tech-header\">\n <i class=\"fas fa-terminal\"></i>\n <span>DETALLES T\u00C9CNICOS</span>\n </div>\n @if (codigoEstado()) {\n <div class=\"tech-row\">\n <span class=\"tech-label\">C\u00D3DIGO_ESTADO:</span>\n <span class=\"tech-value error-code\">{{ codigoEstado() }}</span>\n </div>\n }\n @if (idTraza()) {\n <div class=\"tech-row\">\n <span class=\"tech-label\">ID_TRAZA:</span>\n <span class=\"tech-value\">{{ idTraza() }}</span>\n </div>\n }\n @if (timestamp()) {\n <div class=\"tech-row\">\n <span class=\"tech-label\">TIMESTAMP:</span>\n <span class=\"tech-value\">{{ timestamp() }}</span>\n </div>\n }\n </div>\n }\n\n </div>\n\n <div class=\"actions\">\n <app-button texto=\"Aceptar\" color=\"rojo_alerta\" [isFullWidth]=\"true\" (accion)=\"onAceptar()\" [autoFocus]=\"true\"\n paddingY=\"py-2\" />\n </div>\n\n</div>", styles: [".alert-error-container{border-radius:16px;display:flex;flex-direction:column;max-height:85vh;overflow:hidden}.alert-error-content{flex:1;min-height:0;overflow-y:auto;overflow-x:hidden;padding:40px 30px 24px;text-align:center}.alert-error-content::-webkit-scrollbar{width:5px}.alert-error-content::-webkit-scrollbar-track{background:transparent}.alert-error-content::-webkit-scrollbar-thumb{background-color:#00000026;border-radius:3px}@keyframes errorEntrance{0%{transform:scale(.4);opacity:0}60%{transform:scale(1.15);opacity:1}80%{transform:scale(.95)}to{transform:scale(1)}}@keyframes errorPulse{0%,to{box-shadow:0 8px 24px #c81e1e66}50%{box-shadow:0 8px 32px #c81e1ebf,0 0 0 10px #c81e1e14}}@keyframes badgeBounce{0%{transform:scale(0);opacity:0}70%{transform:scale(1.25);opacity:1}to{transform:scale(1)}}.icon-wrapper{position:relative;display:inline-block;margin-bottom:24px}.icon-circle{width:80px;height:80px;background:linear-gradient(135deg,#f05252,#c81e1e);border-radius:50%;display:flex;align-items:center;justify-content:center;box-shadow:0 8px 24px #c81e1e66;animation:errorEntrance .5s cubic-bezier(.36,.07,.19,.97) both,errorPulse 2.4s ease-in-out .5s infinite}.icon-circle i{color:#fff;font-size:36px;font-weight:900}.icon-badge{position:absolute;top:-4px;right:-6px;width:26px;height:26px;background-color:var(--background-card);border-radius:50%;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 6px #0000001f;animation:badgeBounce .4s cubic-bezier(.36,.07,.19,.97) .4s both}.icon-badge i{color:#be0000;font-size:12px}.error-title{font-size:1.5rem;font-weight:700;margin-bottom:12px}.error-message{font-size:.95rem;color:#6b7280;line-height:1.6;margin-bottom:28px;word-break:break-word;overflow-wrap:break-word}.actions{flex-shrink:0;padding:16px 30px 24px;border-top:1px solid rgba(0,0,0,.06)}.actions app-button{width:100%}.btn-cerrar{background:none;border:none;padding:6px 16px;font-size:.95rem;color:#374151;cursor:pointer;font-weight:500}.btn-cerrar:hover{color:#1a1a2e;text-decoration:underline}.technical-details{background-color:var(--background-color);border:var(--border-table-header);border-radius:10px;padding:16px 20px;text-align:left}.tech-header{display:flex;align-items:center;gap:8px;margin-bottom:12px}.tech-header i{color:#8a8a8a;font-size:12px}.tech-header span{font-size:.7rem;font-weight:700;color:#64748b;letter-spacing:.08em;text-transform:uppercase}.tech-row{display:flex;justify-content:space-between;align-items:center;padding:3px 0}.tech-row .tech-label{font-size:.72rem;color:#929292;font-weight:600;letter-spacing:.05em;text-transform:uppercase}.tech-row .tech-value{font-size:.78rem;color:#475569;font-family:monospace;word-break:break-all;max-width:65%;text-align:right}.tech-row .tech-value.error-code{color:#e0352b;font-weight:700;text-transform:uppercase}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: ButtonComponent, selector: "app-button", inputs: ["autoFocus", "color", "outline", "icon", "tooltip", "texto", "isHtml", "closeButton", "sunatButton", "inputButton", "buttonDeshabilitado", "atajo", "dropdownButton", "extraClass", "disabled", "uploadButton", "accept", "isRounded", "isNotStyle", "isFullWidth", "paddingX", "paddingY", "minWidth"], outputs: ["accion", "fileSelected"] }] });
|
|
465
466
|
}
|
|
466
467
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: AlertErrorComponent, decorators: [{
|
|
467
468
|
type: Component,
|
|
@@ -668,7 +669,7 @@ class HeaderComponent {
|
|
|
668
669
|
this.cerrarModal.emit();
|
|
669
670
|
}
|
|
670
671
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: HeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
671
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.15", type: HeaderComponent, isStandalone: true, selector: "app-header", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, tamanio: { classPropertyName: "tamanio", publicName: "tamanio", isSignal: true, isRequired: false, transformFunction: null }, showFiltro: { classPropertyName: "showFiltro", publicName: "showFiltro", isSignal: true, isRequired: false, transformFunction: null }, withFiltro: { classPropertyName: "withFiltro", publicName: "withFiltro", isSignal: true, isRequired: false, transformFunction: null }, hasData: { classPropertyName: "hasData", publicName: "hasData", isSignal: true, isRequired: false, transformFunction: null }, isModal: { classPropertyName: "isModal", publicName: "isModal", isSignal: true, isRequired: false, transformFunction: null }, showAlerta: { classPropertyName: "showAlerta", publicName: "showAlerta", isSignal: true, isRequired: false, transformFunction: null }, textAlerta: { classPropertyName: "textAlerta", publicName: "textAlerta", isSignal: true, isRequired: false, transformFunction: null }, validateSalto: { classPropertyName: "validateSalto", publicName: "validateSalto", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { withFiltro: "withFiltroChange", cerrarModal: "cerrarModal" }, ngImport: i0, template: "<div class=\"header-outer\" [ngClass]=\"{ 'align-items-center': !validateSalto(), 'align-items-start': validateSalto()}\">\r\n <div class=\"header-main\">\r\n <div (click)=\"toggleFiltro()\" [ngClass]=\"{ 'cursor-pointer': !isModal() }\"\r\n class=\"header-title d-flex align-items-center mb-2\">\r\n <h5 class=\"fw-bold no-select\" [ngClass]=\"['fs-' + tamanio(), isModal() ? 'pt-3' : 'pt-2']\">\r\n {{ title() }}\r\n </h5>\r\n @if(showFiltro()){\r\n <div [ngClass]=\"{'pt-2': isModal()}\">\r\n <app-filter-toggle [hasData]=\"hasData()\" [(withFiltro)]=\"withFiltro\" />\r\n </div>\r\n }\r\n </div>\r\n\r\n @if (showAlerta()) {\r\n <app-alerta class=\"header-alerta\" [mensaje]=\"textAlerta()\" [validateSalto]=\"validateSalto()\" />\r\n }\r\n </div>\r\n\r\n @if(isModal()){\r\n <div class=\"header-close\">\r\n <app-button icon=\"cerrar\" [closeButton]=\"true\" (accion)=\"cerrar()\" />\r\n </div>\r\n }\r\n</div>", styles: [".header-outer{display:flex;flex-wrap:nowrap;gap:8px}.header-title{flex:1 1 auto;min-width:0}.header-main{flex:1 1 auto;min-width:0;display:flex;flex-wrap:wrap;align-items:center;gap:8px}.header-alerta{margin-left:auto;flex:0 1 auto;min-width:0;max-width:100%}.header-close{flex-shrink:0;align-self:flex-start;padding-top:5px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: ButtonComponent, selector: "app-button", inputs: ["autoFocus", "color", "outline", "icon", "tooltip", "texto", "isHtml", "closeButton", "sunatButton", "inputButton", "buttonDeshabilitado", "atajo", "dropdownButton", "extraClass", "disabled", "uploadButton", "accept", "isRounded", "isNotStyle", "isFullWidth", "paddingX", "paddingY"], outputs: ["accion", "fileSelected"] }, { kind: "component", type: AlertaComponent, selector: "app-alerta", inputs: ["titulo", "mensaje", "iconSize", "classContainer", "paddingClass", "validateSalto"] }, { kind: "component", type: FilterToggleComponent, selector: "app-filter-toggle", inputs: ["hasData", "tamanio", "withFiltro"], outputs: ["withFiltroChange"] }] });
|
|
672
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.15", type: HeaderComponent, isStandalone: true, selector: "app-header", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, tamanio: { classPropertyName: "tamanio", publicName: "tamanio", isSignal: true, isRequired: false, transformFunction: null }, showFiltro: { classPropertyName: "showFiltro", publicName: "showFiltro", isSignal: true, isRequired: false, transformFunction: null }, withFiltro: { classPropertyName: "withFiltro", publicName: "withFiltro", isSignal: true, isRequired: false, transformFunction: null }, hasData: { classPropertyName: "hasData", publicName: "hasData", isSignal: true, isRequired: false, transformFunction: null }, isModal: { classPropertyName: "isModal", publicName: "isModal", isSignal: true, isRequired: false, transformFunction: null }, showAlerta: { classPropertyName: "showAlerta", publicName: "showAlerta", isSignal: true, isRequired: false, transformFunction: null }, textAlerta: { classPropertyName: "textAlerta", publicName: "textAlerta", isSignal: true, isRequired: false, transformFunction: null }, validateSalto: { classPropertyName: "validateSalto", publicName: "validateSalto", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { withFiltro: "withFiltroChange", cerrarModal: "cerrarModal" }, ngImport: i0, template: "<div class=\"header-outer\" [ngClass]=\"{ 'align-items-center': !validateSalto(), 'align-items-start': validateSalto()}\">\r\n <div class=\"header-main\">\r\n <div (click)=\"toggleFiltro()\" [ngClass]=\"{ 'cursor-pointer': !isModal() }\"\r\n class=\"header-title d-flex align-items-center mb-2\">\r\n <h5 class=\"fw-bold no-select\" [ngClass]=\"['fs-' + tamanio(), isModal() ? 'pt-3' : 'pt-2']\">\r\n {{ title() }}\r\n </h5>\r\n @if(showFiltro()){\r\n <div [ngClass]=\"{'pt-2': isModal()}\">\r\n <app-filter-toggle [hasData]=\"hasData()\" [(withFiltro)]=\"withFiltro\" />\r\n </div>\r\n }\r\n </div>\r\n\r\n @if (showAlerta()) {\r\n <app-alerta class=\"header-alerta\" [mensaje]=\"textAlerta()\" [validateSalto]=\"validateSalto()\" />\r\n }\r\n </div>\r\n\r\n @if(isModal()){\r\n <div class=\"header-close\">\r\n <app-button icon=\"cerrar\" [closeButton]=\"true\" (accion)=\"cerrar()\" />\r\n </div>\r\n }\r\n</div>", styles: [".header-outer{display:flex;flex-wrap:nowrap;gap:8px}.header-title{flex:1 1 auto;min-width:0}.header-main{flex:1 1 auto;min-width:0;display:flex;flex-wrap:wrap;align-items:center;gap:8px}.header-alerta{margin-left:auto;flex:0 1 auto;min-width:0;max-width:100%}.header-close{flex-shrink:0;align-self:flex-start;padding-top:5px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: ButtonComponent, selector: "app-button", inputs: ["autoFocus", "color", "outline", "icon", "tooltip", "texto", "isHtml", "closeButton", "sunatButton", "inputButton", "buttonDeshabilitado", "atajo", "dropdownButton", "extraClass", "disabled", "uploadButton", "accept", "isRounded", "isNotStyle", "isFullWidth", "paddingX", "paddingY", "minWidth"], outputs: ["accion", "fileSelected"] }, { kind: "component", type: AlertaComponent, selector: "app-alerta", inputs: ["titulo", "mensaje", "iconSize", "classContainer", "paddingClass", "validateSalto"] }, { kind: "component", type: FilterToggleComponent, selector: "app-filter-toggle", inputs: ["hasData", "tamanio", "withFiltro"], outputs: ["withFiltroChange"] }] });
|
|
672
673
|
}
|
|
673
674
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: HeaderComponent, decorators: [{
|
|
674
675
|
type: Component,
|
|
@@ -1471,8 +1472,15 @@ class InputComponent {
|
|
|
1471
1472
|
firstItemDefault = input(false);
|
|
1472
1473
|
typeKey = input('number');
|
|
1473
1474
|
validaCodigo = input(false);
|
|
1475
|
+
inputErrorFn = input(null);
|
|
1474
1476
|
static nextId = 0;
|
|
1475
1477
|
inputId = `app-input-${InputComponent.nextId++}`;
|
|
1478
|
+
hasError = computed(() => {
|
|
1479
|
+
const validator = this.inputErrorFn();
|
|
1480
|
+
return validator
|
|
1481
|
+
? validator(this.value())
|
|
1482
|
+
: this.invalidInput();
|
|
1483
|
+
});
|
|
1476
1484
|
constructor() {
|
|
1477
1485
|
effect(() => {
|
|
1478
1486
|
if (this.invalidInput())
|
|
@@ -1526,11 +1534,11 @@ class InputComponent {
|
|
|
1526
1534
|
this.changeInput.emit(encontrar);
|
|
1527
1535
|
}
|
|
1528
1536
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: InputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1529
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.15", type: InputComponent, isStandalone: true, selector: "app-input", inputs: { wlabel: { classPropertyName: "wlabel", publicName: "wlabel", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, withBuscar: { classPropertyName: "withBuscar", publicName: "withBuscar", isSignal: true, isRequired: false, transformFunction: null }, iconButton: { classPropertyName: "iconButton", publicName: "iconButton", isSignal: true, isRequired: false, transformFunction: null }, classButton: { classPropertyName: "classButton", publicName: "classButton", isSignal: true, isRequired: false, transformFunction: null }, isRequired: { classPropertyName: "isRequired", publicName: "isRequired", isSignal: true, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, position: { classPropertyName: "position", publicName: "position", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, value2: { classPropertyName: "value2", publicName: "value2", isSignal: true, isRequired: false, transformFunction: null }, position_row: { classPropertyName: "position_row", publicName: "position_row", isSignal: true, isRequired: false, transformFunction: null }, withChangeInput: { classPropertyName: "withChangeInput", publicName: "withChangeInput", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, isImportant: { classPropertyName: "isImportant", publicName: "isImportant", isSignal: true, isRequired: false, transformFunction: null }, lista: { classPropertyName: "lista", publicName: "lista", isSignal: true, isRequired: false, transformFunction: null }, keyCodigo: { classPropertyName: "keyCodigo", publicName: "keyCodigo", isSignal: true, isRequired: false, transformFunction: null }, keyDescri: { classPropertyName: "keyDescri", publicName: "keyDescri", isSignal: true, isRequired: false, transformFunction: null }, joinInfo: { classPropertyName: "joinInfo", publicName: "joinInfo", isSignal: true, isRequired: false, transformFunction: null }, withTodos: { classPropertyName: "withTodos", publicName: "withTodos", isSignal: true, isRequired: false, transformFunction: null }, allDisabled: { classPropertyName: "allDisabled", publicName: "allDisabled", isSignal: true, isRequired: false, transformFunction: null }, isVertical: { classPropertyName: "isVertical", publicName: "isVertical", isSignal: true, isRequired: false, transformFunction: null }, alto: { classPropertyName: "alto", publicName: "alto", isSignal: true, isRequired: false, transformFunction: null }, formatNumber: { classPropertyName: "formatNumber", publicName: "formatNumber", isSignal: true, isRequired: false, transformFunction: null }, blur: { classPropertyName: "blur", publicName: "blur", isSignal: true, isRequired: false, transformFunction: null }, enter: { classPropertyName: "enter", publicName: "enter", isSignal: true, isRequired: false, transformFunction: null }, keyup: { classPropertyName: "keyup", publicName: "keyup", isSignal: true, isRequired: false, transformFunction: null }, invalidInput: { classPropertyName: "invalidInput", publicName: "invalidInput", isSignal: true, isRequired: false, transformFunction: null }, activeFocus: { classPropertyName: "activeFocus", publicName: "activeFocus", isSignal: true, isRequired: false, transformFunction: null }, customBorderColor: { classPropertyName: "customBorderColor", publicName: "customBorderColor", isSignal: true, isRequired: false, transformFunction: null }, customBoxShadow: { classPropertyName: "customBoxShadow", publicName: "customBoxShadow", isSignal: true, isRequired: false, transformFunction: null }, customTransition: { classPropertyName: "customTransition", publicName: "customTransition", isSignal: true, isRequired: false, transformFunction: null }, maxLength: { classPropertyName: "maxLength", publicName: "maxLength", isSignal: true, isRequired: false, transformFunction: null }, textoAyuda: { classPropertyName: "textoAyuda", publicName: "textoAyuda", isSignal: true, isRequired: false, transformFunction: null }, sinAyuda: { classPropertyName: "sinAyuda", publicName: "sinAyuda", isSignal: true, isRequired: false, transformFunction: null }, maxWidth: { classPropertyName: "maxWidth", publicName: "maxWidth", isSignal: true, isRequired: false, transformFunction: null }, showTopLabel: { classPropertyName: "showTopLabel", publicName: "showTopLabel", isSignal: true, isRequired: false, transformFunction: null }, topLabelText: { classPropertyName: "topLabelText", publicName: "topLabelText", isSignal: true, isRequired: false, transformFunction: null }, firstItemDefault: { classPropertyName: "firstItemDefault", publicName: "firstItemDefault", isSignal: true, isRequired: false, transformFunction: null }, typeKey: { classPropertyName: "typeKey", publicName: "typeKey", isSignal: true, isRequired: false, transformFunction: null }, validaCodigo: { classPropertyName: "validaCodigo", publicName: "validaCodigo", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange", value2: "value2Change", disabled: "disabledChange", allDisabled: "allDisabledChange", invalidInput: "invalidInputChange", accion: "accion", changeInput: "changeInput" }, ngImport: i0, template: "@if (isVertical()) {\r\n<label [ngClass]=\"{'text-error': isImportant()}\" [for]=\"inputId\" [style.min-width]=\"wlabel() + 'px'\"> {{label()}} @if (isRequired()) {<span\r\n class=\"fw-bold text-danger\">(*)</span>}</label>\r\n}\r\n<div class=\"d-flex align-items-{{position_row()}}\">\r\n @if (!isVertical()) {\r\n <label [ngClass]=\"{'text-error': isImportant()}\" [for]=\"inputId\" [style.min-width]=\"wlabel() + 'px'\"> {{label()}} @if (isRequired()) {<span\r\n class=\"fw-bold text-danger\">(*)</span>}</label>\r\n }\r\n <div class=\"flex-grow-1 me-2\" style=\"min-width: 0\">\r\n <div [ngClass]=\"{'d-block': typeStandar() == 'date', 'd-flex': typeStandar() != 'date', 'flex-column': showTopLabel() }\"\r\n class=\"position-relative\">\r\n \r\n @if (showTopLabel() && topLabelText()) {\r\n <div class=\"input-top-label\">\r\n <label class=\"fw-bold\">{{ topLabelText() }}</label>\r\n </div>\r\n }\r\n \r\n @if (!distintInputs.includes(typeStandar())) {\r\n <input [type]=\"typeStandar()\" (blur)=\"callBlur()\" (keyup.enter)=\"enter()?.()\" (input)=\"keyup()?.()\"\r\n class=\"form-control text-{{position()}}\"\r\n [placeholder]=\"placeholder()\"\r\n [attr.data-active-focus]=\"activeFocus() == false ? 'false' : ''\"\r\n [style.--focus-border-color]=\"customBorderColor()\" [style.--focus-box-shadow]=\"customBoxShadow()\"\r\n [style.--focus-transition]=\"customTransition()\" [style.max-width.px]=\"maxWidth()\"\r\n (focus)=\"invalidInput.set(false)\" autocomplete=\"off\" [ngClass]=\"invalidInput() ? 'input-error' : ''\"\r\n [disabled]=\"allDisabled() ? true : disabled()\" [(ngModel)]=\"value\" [id]=\"inputId\" [caracteresCodigo]=\"validaCodigo()\"\r\n [name]=\"inputId\" [attr.maxlength]=\"maxLength()\">\r\n }\r\n\r\n @if (typeStandar() == 'input-switch') {\r\n <div class=\"d-flex w-100\">\r\n <div class=\"flex-grow-1\">\r\n <input type=\"text\" class=\"form-control\" (blur)=\"callBlur()\" (keyup.enter)=\"enter()?.()\" (input)=\"keyup()?.()\"\r\n [placeholder]=\"placeholder()\"\r\n [attr.data-active-focus]=\"activeFocus() == false ? 'false' : ''\"\r\n [style.--focus-border-color]=\"customBorderColor()\" [style.--focus-box-shadow]=\"customBoxShadow()\"\r\n [style.--focus-transition]=\"customTransition()\" [ngClass]=\"'text-' + position()\"\r\n [style.max-width.px]=\"maxWidth()\" [disabled]=\"allDisabled() ? true : disabled()\" [(ngModel)]=\"value\"\r\n [id]=\"inputId\" [name]=\"inputId\" [caracteresCodigo]=\"validaCodigo()\"\r\n [attr.maxlength]=\"maxLength()\" (focus)=\"invalidInput.set(false)\">\r\n </div>\r\n <div class=\"px-2\">\r\n <app-switch-activo valueOn=\"S\" valueOff=\"N\" [id]=\"`switch_${inputId}`\" [(model)]=\"value2\" />\r\n </div>\r\n </div>\r\n }\r\n\r\n @if (typeStandar() == 'number-format-decimal') {\r\n <input type=\"text\" class=\"form-control\" (blur)=\"callBlur()\" (input)=\"keyup()?.()\" (keyup.enter)=\"enter()?.()\"\r\n [placeholder]=\"placeholder()\"\r\n [attr.data-active-focus]=\"activeFocus() == false ? 'false' : ''\"\r\n [style.--focus-border-color]=\"customBorderColor()\" [style.--focus-box-shadow]=\"customBoxShadow()\"\r\n [style.--focus-transition]=\"customTransition()\" [ngClass]=\"'text-' + position()\"\r\n [style.max-width.px]=\"maxWidth()\" [disabled]=\"allDisabled() ? true : disabled()\" [(ngModel)]=\"value\"\r\n [id]=\"inputId\" [name]=\"inputId\" [appDecimal]=\"formatNumber()\" onlyNumberFlex\r\n [attr.maxlength]=\"maxLength()\" (focus)=\"invalidInput.set(false)\">\r\n }\r\n\r\n @if (typeStandar() == 'number-integer') {\r\n <input type=\"text\" class=\"form-control text-{{position()}}\" (blur)=\"callBlur()\" (input)=\"keyup()?.()\" (keyup.enter)=\"enter()?.()\"\r\n [placeholder]=\"placeholder()\"\r\n [attr.data-active-focus]=\"activeFocus() == false ? 'false' : ''\"\r\n [style.--focus-border-color]=\"customBorderColor()\" [style.--focus-box-shadow]=\"customBoxShadow()\"\r\n [style.--focus-transition]=\"customTransition()\" [style.max-width.px]=\"maxWidth()\"\r\n [ngClass]=\"invalidInput() ? 'input-error' : ''\" [disabled]=\"allDisabled() ? true : disabled()\"\r\n [(ngModel)]=\"value\" [id]=\"inputId\" [name]=\"inputId\" onlyNumber\r\n [attr.maxlength]=\"maxLength()\" (focus)=\"invalidInput.set(false)\">\r\n }\r\n\r\n @if (typeStandar() == 'day') {\r\n <input type=\"text\" class=\"form-control text-{{position()}}\" (blur)=\"callBlur()\" (input)=\"keyup()?.()\" (keyup.enter)=\"enter()?.()\"\r\n [placeholder]=\"placeholder()\"\r\n [attr.data-active-focus]=\"activeFocus() == false ? 'false' : ''\"\r\n [style.--focus-border-color]=\"customBorderColor()\" [style.--focus-box-shadow]=\"customBoxShadow()\"\r\n [style.--focus-transition]=\"customTransition()\" [style.max-width.px]=\"maxWidth()\"\r\n [ngClass]=\"invalidInput() ? 'input-error' : ''\" [disabled]=\"allDisabled() ? true : disabled()\"\r\n [(ngModel)]=\"value\" [id]=\"inputId\" [name]=\"inputId\" onlyDay\r\n [attr.maxlength]=\"maxLength()\" (focus)=\"invalidInput.set(false)\">\r\n }\r\n\r\n @if (typeStandar() == 'date') {\r\n <input type=\"date\" class=\"form-control text-{{position()}}\" (blur)=\"callBlur()\" (input)=\"keyup()?.()\"\r\n [placeholder]=\"placeholder()\"\r\n [attr.data-active-focus]=\"activeFocus() == false ? 'false' : ''\"\r\n [style.--focus-border-color]=\"customBorderColor()\" [style.--focus-box-shadow]=\"customBoxShadow()\"\r\n [style.--focus-transition]=\"customTransition()\" [ngClass]=\"invalidInput() ? 'input-error' : ''\"\r\n [disabled]=\"allDisabled() ? true : disabled()\" [(ngModel)]=\"value\" [id]=\"inputId\"\r\n [name]=\"inputId\" (focus)=\"invalidInput.set(false)\">\r\n }\r\n\r\n @if (typeStandar() == 'time') {\r\n <input type=\"time\" class=\"form-control text-{{position()}}\" (blur)=\"callBlur()\" (input)=\"keyup()?.()\"\r\n [placeholder]=\"placeholder()\"\r\n [attr.data-active-focus]=\"activeFocus() == false ? 'false' : ''\"\r\n [style.--focus-border-color]=\"customBorderColor()\" [style.--focus-box-shadow]=\"customBoxShadow()\"\r\n [style.--focus-transition]=\"customTransition()\" [ngClass]=\"invalidInput() ? 'input-error' : ''\"\r\n [disabled]=\"allDisabled() ? true : disabled()\" [(ngModel)]=\"value\" [id]=\"inputId\"\r\n [name]=\"inputId\" (focus)=\"invalidInput.set(false)\">\r\n }\r\n\r\n @if (typeStandar() == 'text-area') {\r\n <textarea class=\"{{'text-' + position()}} form-area\"\r\n [placeholder]=\"placeholder()\"\r\n [attr.data-active-focus]=\"activeFocus() == false ? 'false' : ''\"\r\n [style.--focus-border-color]=\"customBorderColor()\" [style.--focus-box-shadow]=\"customBoxShadow()\"\r\n [style.--focus-transition]=\"customTransition()\" [id]=\"inputId\" [name]=\"inputId\"\r\n [disabled]=\"allDisabled() ? true : disabled()\" [(ngModel)]=\"value\" [rows]=\"alto()\"\r\n [attr.maxlength]=\"maxLength()\" (focus)=\"invalidInput.set(false)\">\r\n\r\n </textarea>\r\n }\r\n\r\n @if (typeStandar() == 'select') {\r\n <select class=\"form-select {{'text-' + position()}}\" [attr.data-active-focus]=\"activeFocus() == false ? 'false' : ''\"\r\n [class.text-error]=\"isImportant()\"\r\n [style.--focus-border-color]=\"customBorderColor()\" [style.--focus-box-shadow]=\"customBoxShadow()\"\r\n [style.--focus-transition]=\"customTransition()\" [style.max-width.px]=\"maxWidth()\" [style.min-width.px]=\"maxWidth()\" [(ngModel)]=\"value\"\r\n [disabled]=\"allDisabled() ? true : disabled()\" [id]=\"inputId\"\r\n [name]=\"inputId\" (change)=\"emitirChange()\" (focus)=\"focusInput()\">\r\n @if (withTodos()) {\r\n <option [value]=\"typeKey() == 'number' ? -1 : ''\">Todos</option>\r\n }\r\n @for (item of lista(); track $index) {\r\n @if (!keyCodigo()) {\r\n <option [value]=\"item\"> {{ item }}</option>\r\n }\r\n @if (keyCodigo()) {\r\n <option [value]=\"item[keyCodigo()]\"> {{ joinInfo() ? item[keyCodigo()] + ' - ' + item[keyDescri()] :\r\n item[keyDescri()]}}</option>\r\n }\r\n\r\n }\r\n </select>\r\n }\r\n\r\n @if (withBuscar()) {\r\n <button class=\"btn btn-dark boton-buscar fs-7\" [ngClass]=\"classButton()\" [disabled]=\"allDisabled()\" (click)=\"ejecutarAccion()\">\r\n <i [ngClass]=\"iconButton()\" ></i>\r\n </button>\r\n }\r\n @if (withChangeInput()) {\r\n <button class=\"btn btn-dark boton-buscar bg-search fs-7\" [disabled]=\"allDisabled()\" (click)=\"changeInputAction()\">\r\n <i [ngClass]=\"typeStandar() == 'select' ? 'fas fa-times' : 'fa solid fa-pen'\"></i>\r\n </button>\r\n }\r\n @if (invalidInput()) {\r\n <div class=\"infoBox\" @fadeInOut><i class=\"fas fa-exclamation-triangle fs-9 text-danger\"></i> Ocurri\u00F3 un\r\n error: El campo es obligatorio, aseg\u00FArese de ingresar datos v\u00E1lidos.</div>\r\n }\r\n\r\n </div>\r\n </div>\r\n</div>\r\n\r\n@if (textoAyuda() && typeStandar() == 'text-area') {\r\n<div class=\"d-flex flex-wrap justify-content-between align-items-center px-2\">\r\n <span class=\"text-error fs-6\">{{textoAyuda()}}</span>\r\n <span class=\"text-dark fs-6 fw-5\">{{ valueSize() }}/{{maxLength()}} caracteres</span>\r\n</div>\r\n}\r\n\r\n@if (sinAyuda() && typeStandar() == 'text-area') {\r\n<div class=\"d-flex flex-wrap justify-content-between align-items-center px-2\">\r\n <span class=\"text-error fs-6\"></span>\r\n <span class=\"text-dark fs-6 fw-5\">{{ valueSize() }}/{{maxLength()}} caracteres</span>\r\n</div>\r\n}", styles: [".text-error{color:#d60000!important;font-weight:700!important}@media (max-width: 442px){.d-flex{flex-direction:column!important;align-items:stretch!important}.infoBox{font-size:12px;padding:8px 12px;width:100%!important;max-width:100%!important}}@media (max-width: 900px){.infoBox{width:250px!important}}.infoBox{position:absolute;width:400px;top:calc(100% + 10px);left:0;right:0;margin-top:2px;background:#be0000d5;box-shadow:0 4px 12px #0003;border-radius:6px;padding:15px 12px;font-size:14px;color:#dbdbdb;z-index:10;font-size:12px;font-weight:600}.infoBox:before{content:\"\";position:absolute;top:-10px;left:20px;border-width:0 8px 10px 8px;border-style:solid;border-color:transparent transparent rgba(190,0,0,.835) transparent;filter:drop-shadow(0 -1px 1px rgba(0,0,0,.1))}.input-error{border:1px solid rgb(203,0,0);color:#cb0000!important;animation:aura-pulse 1.5s ease-out infinite;position:relative;z-index:1}@keyframes aura-pulse{0%{box-shadow:0 0 #cb0000b3}70%{box-shadow:0 0 0 5px #cb000000}to{box-shadow:0 0 #cb000000}}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$2.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$2.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$2.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: DecimalDirective, selector: "[appDecimal]", inputs: ["appDecimal"] }, { kind: "directive", type: OnlyNumberDirective, selector: "[onlyNumber]" }, { kind: "directive", type: OnlyDayDirective, selector: "[onlyDay]" }, { kind: "component", type: SwitchActivoComponent, selector: "app-switch-activo", inputs: ["valueOn", "valueOff", "labelOn", "labelOff", "iconOn", "iconOff", "colorOn", "colorOff", "id", "model"], outputs: ["modelChange"] }, { kind: "directive", type: OnlyNumberFlexDirective, selector: "[onlyNumberFlex]" }, { kind: "directive", type: CaracteresCodigoDirective, selector: "[caracteresCodigo]", inputs: ["caracteresCodigo"] }], animations: [fadeInOut], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1537
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.15", type: InputComponent, isStandalone: true, selector: "app-input", inputs: { wlabel: { classPropertyName: "wlabel", publicName: "wlabel", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, withBuscar: { classPropertyName: "withBuscar", publicName: "withBuscar", isSignal: true, isRequired: false, transformFunction: null }, iconButton: { classPropertyName: "iconButton", publicName: "iconButton", isSignal: true, isRequired: false, transformFunction: null }, classButton: { classPropertyName: "classButton", publicName: "classButton", isSignal: true, isRequired: false, transformFunction: null }, isRequired: { classPropertyName: "isRequired", publicName: "isRequired", isSignal: true, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, position: { classPropertyName: "position", publicName: "position", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, value2: { classPropertyName: "value2", publicName: "value2", isSignal: true, isRequired: false, transformFunction: null }, position_row: { classPropertyName: "position_row", publicName: "position_row", isSignal: true, isRequired: false, transformFunction: null }, withChangeInput: { classPropertyName: "withChangeInput", publicName: "withChangeInput", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, isImportant: { classPropertyName: "isImportant", publicName: "isImportant", isSignal: true, isRequired: false, transformFunction: null }, lista: { classPropertyName: "lista", publicName: "lista", isSignal: true, isRequired: false, transformFunction: null }, keyCodigo: { classPropertyName: "keyCodigo", publicName: "keyCodigo", isSignal: true, isRequired: false, transformFunction: null }, keyDescri: { classPropertyName: "keyDescri", publicName: "keyDescri", isSignal: true, isRequired: false, transformFunction: null }, joinInfo: { classPropertyName: "joinInfo", publicName: "joinInfo", isSignal: true, isRequired: false, transformFunction: null }, withTodos: { classPropertyName: "withTodos", publicName: "withTodos", isSignal: true, isRequired: false, transformFunction: null }, allDisabled: { classPropertyName: "allDisabled", publicName: "allDisabled", isSignal: true, isRequired: false, transformFunction: null }, isVertical: { classPropertyName: "isVertical", publicName: "isVertical", isSignal: true, isRequired: false, transformFunction: null }, alto: { classPropertyName: "alto", publicName: "alto", isSignal: true, isRequired: false, transformFunction: null }, formatNumber: { classPropertyName: "formatNumber", publicName: "formatNumber", isSignal: true, isRequired: false, transformFunction: null }, blur: { classPropertyName: "blur", publicName: "blur", isSignal: true, isRequired: false, transformFunction: null }, enter: { classPropertyName: "enter", publicName: "enter", isSignal: true, isRequired: false, transformFunction: null }, keyup: { classPropertyName: "keyup", publicName: "keyup", isSignal: true, isRequired: false, transformFunction: null }, invalidInput: { classPropertyName: "invalidInput", publicName: "invalidInput", isSignal: true, isRequired: false, transformFunction: null }, activeFocus: { classPropertyName: "activeFocus", publicName: "activeFocus", isSignal: true, isRequired: false, transformFunction: null }, customBorderColor: { classPropertyName: "customBorderColor", publicName: "customBorderColor", isSignal: true, isRequired: false, transformFunction: null }, customBoxShadow: { classPropertyName: "customBoxShadow", publicName: "customBoxShadow", isSignal: true, isRequired: false, transformFunction: null }, customTransition: { classPropertyName: "customTransition", publicName: "customTransition", isSignal: true, isRequired: false, transformFunction: null }, maxLength: { classPropertyName: "maxLength", publicName: "maxLength", isSignal: true, isRequired: false, transformFunction: null }, textoAyuda: { classPropertyName: "textoAyuda", publicName: "textoAyuda", isSignal: true, isRequired: false, transformFunction: null }, sinAyuda: { classPropertyName: "sinAyuda", publicName: "sinAyuda", isSignal: true, isRequired: false, transformFunction: null }, maxWidth: { classPropertyName: "maxWidth", publicName: "maxWidth", isSignal: true, isRequired: false, transformFunction: null }, showTopLabel: { classPropertyName: "showTopLabel", publicName: "showTopLabel", isSignal: true, isRequired: false, transformFunction: null }, topLabelText: { classPropertyName: "topLabelText", publicName: "topLabelText", isSignal: true, isRequired: false, transformFunction: null }, firstItemDefault: { classPropertyName: "firstItemDefault", publicName: "firstItemDefault", isSignal: true, isRequired: false, transformFunction: null }, typeKey: { classPropertyName: "typeKey", publicName: "typeKey", isSignal: true, isRequired: false, transformFunction: null }, validaCodigo: { classPropertyName: "validaCodigo", publicName: "validaCodigo", isSignal: true, isRequired: false, transformFunction: null }, inputErrorFn: { classPropertyName: "inputErrorFn", publicName: "inputErrorFn", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange", value2: "value2Change", disabled: "disabledChange", allDisabled: "allDisabledChange", invalidInput: "invalidInputChange", accion: "accion", changeInput: "changeInput" }, ngImport: i0, template: "@if (isVertical()) {\r\n<label [ngClass]=\"{'text-error': isImportant()}\" [for]=\"inputId\" [style.min-width]=\"wlabel() + 'px'\"> {{label()}} @if (isRequired()) {<span\r\n class=\"fw-bold text-danger\">(*)</span>}</label>\r\n}\r\n<div class=\"d-flex align-items-{{position_row()}}\">\r\n @if (!isVertical()) {\r\n <label [ngClass]=\"{'text-error': isImportant()}\" [for]=\"inputId\" [style.min-width]=\"wlabel() + 'px'\"> {{label()}} @if (isRequired()) {<span\r\n class=\"fw-bold text-danger\">(*)</span>}</label>\r\n }\r\n <div class=\"flex-grow-1 me-2\" style=\"min-width: 0\">\r\n <div [ngClass]=\"{'d-block': typeStandar() == 'date', 'd-flex': typeStandar() != 'date', 'flex-column': showTopLabel() }\"\r\n class=\"position-relative\">\r\n \r\n @if (showTopLabel() && topLabelText()) {\r\n <div class=\"input-top-label\">\r\n <label class=\"fw-bold\">{{ topLabelText() }}</label>\r\n </div>\r\n }\r\n \r\n @if (!distintInputs.includes(typeStandar())) {\r\n <input [type]=\"typeStandar()\" (blur)=\"callBlur()\" (keyup.enter)=\"enter()?.()\" (input)=\"keyup()?.()\"\r\n class=\"form-control text-{{position()}}\"\r\n [placeholder]=\"placeholder()\"\r\n [attr.data-active-focus]=\"activeFocus() == false ? 'false' : ''\"\r\n [style.--focus-border-color]=\"customBorderColor()\" [style.--focus-box-shadow]=\"customBoxShadow()\"\r\n [style.--focus-transition]=\"customTransition()\" [style.max-width.px]=\"maxWidth()\"\r\n [class.input-error]=\"hasError()\"\r\n (focus)=\"invalidInput.set(false)\" autocomplete=\"off\"\r\n [disabled]=\"allDisabled() ? true : disabled()\" [(ngModel)]=\"value\" [id]=\"inputId\" [caracteresCodigo]=\"validaCodigo()\"\r\n [name]=\"inputId\" [attr.maxlength]=\"maxLength()\">\r\n }\r\n\r\n @if (typeStandar() == 'input-switch') {\r\n <div class=\"d-flex w-100\">\r\n <div class=\"flex-grow-1\">\r\n <input type=\"text\" class=\"form-control\" (blur)=\"callBlur()\" (keyup.enter)=\"enter()?.()\" (input)=\"keyup()?.()\"\r\n [placeholder]=\"placeholder()\"\r\n [attr.data-active-focus]=\"activeFocus() == false ? 'false' : ''\"\r\n [style.--focus-border-color]=\"customBorderColor()\" [style.--focus-box-shadow]=\"customBoxShadow()\"\r\n [style.--focus-transition]=\"customTransition()\" [ngClass]=\"'text-' + position()\"\r\n [style.max-width.px]=\"maxWidth()\" [disabled]=\"allDisabled() ? true : disabled()\" [(ngModel)]=\"value\"\r\n [id]=\"inputId\" [name]=\"inputId\" [caracteresCodigo]=\"validaCodigo()\"\r\n [attr.maxlength]=\"maxLength()\" (focus)=\"invalidInput.set(false)\">\r\n </div>\r\n <div class=\"px-2\">\r\n <app-switch-activo valueOn=\"S\" valueOff=\"N\" [id]=\"`switch_${inputId}`\" [(model)]=\"value2\" />\r\n </div>\r\n </div>\r\n }\r\n\r\n @if (typeStandar() == 'number-format-decimal') {\r\n <input type=\"text\" class=\"form-control\" (blur)=\"callBlur()\" (input)=\"keyup()?.()\" (keyup.enter)=\"enter()?.()\"\r\n [placeholder]=\"placeholder()\"\r\n [attr.data-active-focus]=\"activeFocus() == false ? 'false' : ''\"\r\n [style.--focus-border-color]=\"customBorderColor()\" [style.--focus-box-shadow]=\"customBoxShadow()\"\r\n [style.--focus-transition]=\"customTransition()\" \r\n [class.input-error]=\"hasError()\"\r\n [ngClass]=\"'text-' + position()\"\r\n [style.max-width.px]=\"maxWidth()\" [disabled]=\"allDisabled() ? true : disabled()\" [(ngModel)]=\"value\"\r\n [id]=\"inputId\" [name]=\"inputId\" [appDecimal]=\"formatNumber()\" onlyNumberFlex\r\n [attr.maxlength]=\"maxLength()\" (focus)=\"invalidInput.set(false)\">\r\n }\r\n\r\n @if (typeStandar() == 'number-integer') {\r\n <input type=\"text\" class=\"form-control text-{{position()}}\" (blur)=\"callBlur()\" (input)=\"keyup()?.()\" (keyup.enter)=\"enter()?.()\"\r\n [placeholder]=\"placeholder()\"\r\n [attr.data-active-focus]=\"activeFocus() == false ? 'false' : ''\"\r\n [style.--focus-border-color]=\"customBorderColor()\" [style.--focus-box-shadow]=\"customBoxShadow()\"\r\n [style.--focus-transition]=\"customTransition()\" [style.max-width.px]=\"maxWidth()\"\r\n [class.input-error]=\"hasError()\"\r\n [disabled]=\"allDisabled() ? true : disabled()\"\r\n [(ngModel)]=\"value\" [id]=\"inputId\" [name]=\"inputId\" onlyNumber\r\n [attr.maxlength]=\"maxLength()\" (focus)=\"invalidInput.set(false)\">\r\n }\r\n\r\n @if (typeStandar() == 'day') {\r\n <input type=\"text\" class=\"form-control text-{{position()}}\" (blur)=\"callBlur()\" (input)=\"keyup()?.()\" (keyup.enter)=\"enter()?.()\"\r\n [placeholder]=\"placeholder()\"\r\n [attr.data-active-focus]=\"activeFocus() == false ? 'false' : ''\"\r\n [style.--focus-border-color]=\"customBorderColor()\" [style.--focus-box-shadow]=\"customBoxShadow()\"\r\n [style.--focus-transition]=\"customTransition()\" [style.max-width.px]=\"maxWidth()\"\r\n [class.input-error]=\"hasError()\"\r\n [disabled]=\"allDisabled() ? true : disabled()\"\r\n [(ngModel)]=\"value\" [id]=\"inputId\" [name]=\"inputId\" onlyDay\r\n [attr.maxlength]=\"maxLength()\" (focus)=\"invalidInput.set(false)\">\r\n }\r\n\r\n @if (typeStandar() == 'date') {\r\n <input type=\"date\" class=\"form-control text-{{position()}}\" (blur)=\"callBlur()\" (input)=\"keyup()?.()\"\r\n [placeholder]=\"placeholder()\"\r\n [attr.data-active-focus]=\"activeFocus() == false ? 'false' : ''\"\r\n [style.--focus-border-color]=\"customBorderColor()\" [style.--focus-box-shadow]=\"customBoxShadow()\"\r\n [style.--focus-transition]=\"customTransition()\" \r\n [class.input-error]=\"hasError()\"\r\n [disabled]=\"allDisabled() ? true : disabled()\" [(ngModel)]=\"value\" [id]=\"inputId\"\r\n [name]=\"inputId\" (focus)=\"invalidInput.set(false)\">\r\n }\r\n\r\n @if (typeStandar() == 'time') {\r\n <input type=\"time\" class=\"form-control text-{{position()}}\" (blur)=\"callBlur()\" (input)=\"keyup()?.()\"\r\n [placeholder]=\"placeholder()\"\r\n [attr.data-active-focus]=\"activeFocus() == false ? 'false' : ''\"\r\n [style.--focus-border-color]=\"customBorderColor()\" [style.--focus-box-shadow]=\"customBoxShadow()\"\r\n [style.--focus-transition]=\"customTransition()\" \r\n [class.input-error]=\"hasError()\"\r\n [disabled]=\"allDisabled() ? true : disabled()\" [(ngModel)]=\"value\" [id]=\"inputId\"\r\n [name]=\"inputId\" (focus)=\"invalidInput.set(false)\">\r\n }\r\n\r\n @if (typeStandar() == 'text-area') {\r\n <textarea class=\"{{'text-' + position()}} form-area\"\r\n [placeholder]=\"placeholder()\"\r\n [attr.data-active-focus]=\"activeFocus() == false ? 'false' : ''\"\r\n [style.--focus-border-color]=\"customBorderColor()\" [style.--focus-box-shadow]=\"customBoxShadow()\"\r\n [style.--focus-transition]=\"customTransition()\" \r\n [class.input-error]=\"hasError()\"\r\n [id]=\"inputId\" [name]=\"inputId\"\r\n [disabled]=\"allDisabled() ? true : disabled()\" [(ngModel)]=\"value\" [rows]=\"alto()\"\r\n [attr.maxlength]=\"maxLength()\" (focus)=\"invalidInput.set(false)\">\r\n\r\n </textarea>\r\n }\r\n\r\n @if (typeStandar() == 'select') {\r\n <select class=\"form-select {{'text-' + position()}}\" [attr.data-active-focus]=\"activeFocus() == false ? 'false' : ''\"\r\n [class.text-error]=\"isImportant()\"\r\n [style.--focus-border-color]=\"customBorderColor()\" [style.--focus-box-shadow]=\"customBoxShadow()\"\r\n [style.--focus-transition]=\"customTransition()\" [style.max-width.px]=\"maxWidth()\" [style.min-width.px]=\"maxWidth()\" \r\n [class.input-error]=\"hasError()\"\r\n [(ngModel)]=\"value\"\r\n [disabled]=\"allDisabled() ? true : disabled()\" [id]=\"inputId\"\r\n [name]=\"inputId\" (change)=\"emitirChange()\" (focus)=\"focusInput()\">\r\n @if (withTodos()) {\r\n <option [value]=\"typeKey() == 'number' ? -1 : ''\">Todos</option>\r\n }\r\n @for (item of lista(); track $index) {\r\n @if (!keyCodigo()) {\r\n <option [value]=\"item\"> {{ item }}</option>\r\n }\r\n @if (keyCodigo()) {\r\n <option [value]=\"item[keyCodigo()]\"> {{ joinInfo() ? item[keyCodigo()] + ' - ' + item[keyDescri()] :\r\n item[keyDescri()]}}</option>\r\n }\r\n\r\n }\r\n </select>\r\n }\r\n\r\n @if (withBuscar()) {\r\n <button class=\"btn btn-dark boton-buscar fs-7\" [ngClass]=\"classButton()\" [disabled]=\"allDisabled()\" (click)=\"ejecutarAccion()\">\r\n <i [ngClass]=\"iconButton()\" ></i>\r\n </button>\r\n }\r\n @if (withChangeInput()) {\r\n <button class=\"btn btn-dark boton-buscar bg-search fs-7\" [disabled]=\"allDisabled()\" (click)=\"changeInputAction()\">\r\n <i [ngClass]=\"typeStandar() == 'select' ? 'fas fa-times' : 'fa solid fa-pen'\"></i>\r\n </button>\r\n }\r\n @if (invalidInput()) {\r\n <div class=\"infoBox\" @fadeInOut><i class=\"fas fa-exclamation-triangle fs-9 text-danger\"></i> Ocurri\u00F3 un\r\n error: El campo es obligatorio, aseg\u00FArese de ingresar datos v\u00E1lidos.</div>\r\n }\r\n\r\n </div>\r\n </div>\r\n</div>\r\n\r\n@if (textoAyuda() && typeStandar() == 'text-area') {\r\n<div class=\"d-flex flex-wrap justify-content-between align-items-center px-2\">\r\n <span class=\"text-error fs-6\">{{textoAyuda()}}</span>\r\n <span class=\"text-dark fs-6 fw-5\">{{ valueSize() }}/{{maxLength()}} caracteres</span>\r\n</div>\r\n}\r\n\r\n@if (sinAyuda() && typeStandar() == 'text-area') {\r\n<div class=\"d-flex flex-wrap justify-content-between align-items-center px-2\">\r\n <span class=\"text-error fs-6\"></span>\r\n <span class=\"text-dark fs-6 fw-5\">{{ valueSize() }}/{{maxLength()}} caracteres</span>\r\n</div>\r\n}", styles: [".text-error{color:#d60000!important;font-weight:700!important}@media (max-width: 442px){.d-flex{flex-direction:column!important;align-items:stretch!important}.infoBox{font-size:12px;padding:8px 12px;width:100%!important;max-width:100%!important}}@media (max-width: 900px){.infoBox{width:250px!important}}.infoBox{position:absolute;width:400px;top:calc(100% + 10px);left:0;right:0;margin-top:2px;background:#be0000d5;box-shadow:0 4px 12px #0003;border-radius:6px;padding:15px 12px;font-size:14px;color:#dbdbdb;z-index:10;font-size:12px;font-weight:600}.infoBox:before{content:\"\";position:absolute;top:-10px;left:20px;border-width:0 8px 10px 8px;border-style:solid;border-color:transparent transparent rgba(190,0,0,.835) transparent;filter:drop-shadow(0 -1px 1px rgba(0,0,0,.1))}.input-error{border:1px solid rgb(203,0,0);color:#cb0000!important;animation:aura-pulse 1.5s ease-out infinite;position:relative;z-index:1}@keyframes aura-pulse{0%{box-shadow:0 0 #cb0000b3}70%{box-shadow:0 0 0 5px #cb000000}to{box-shadow:0 0 #cb000000}}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$2.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$2.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$2.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: DecimalDirective, selector: "[appDecimal]", inputs: ["appDecimal"] }, { kind: "directive", type: OnlyNumberDirective, selector: "[onlyNumber]" }, { kind: "directive", type: OnlyDayDirective, selector: "[onlyDay]" }, { kind: "component", type: SwitchActivoComponent, selector: "app-switch-activo", inputs: ["valueOn", "valueOff", "labelOn", "labelOff", "iconOn", "iconOff", "colorOn", "colorOff", "id", "model"], outputs: ["modelChange"] }, { kind: "directive", type: OnlyNumberFlexDirective, selector: "[onlyNumberFlex]" }, { kind: "directive", type: CaracteresCodigoDirective, selector: "[caracteresCodigo]", inputs: ["caracteresCodigo"] }], animations: [fadeInOut], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1530
1538
|
}
|
|
1531
1539
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: InputComponent, decorators: [{
|
|
1532
1540
|
type: Component,
|
|
1533
|
-
args: [{ selector: 'app-input', imports: [FormsModule, CommonModule, DecimalDirective, OnlyNumberDirective, OnlyDayDirective, SwitchActivoComponent, OnlyNumberFlexDirective, CaracteresCodigoDirective], animations: [fadeInOut], changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (isVertical()) {\r\n<label [ngClass]=\"{'text-error': isImportant()}\" [for]=\"inputId\" [style.min-width]=\"wlabel() + 'px'\"> {{label()}} @if (isRequired()) {<span\r\n class=\"fw-bold text-danger\">(*)</span>}</label>\r\n}\r\n<div class=\"d-flex align-items-{{position_row()}}\">\r\n @if (!isVertical()) {\r\n <label [ngClass]=\"{'text-error': isImportant()}\" [for]=\"inputId\" [style.min-width]=\"wlabel() + 'px'\"> {{label()}} @if (isRequired()) {<span\r\n class=\"fw-bold text-danger\">(*)</span>}</label>\r\n }\r\n <div class=\"flex-grow-1 me-2\" style=\"min-width: 0\">\r\n <div [ngClass]=\"{'d-block': typeStandar() == 'date', 'd-flex': typeStandar() != 'date', 'flex-column': showTopLabel() }\"\r\n class=\"position-relative\">\r\n \r\n @if (showTopLabel() && topLabelText()) {\r\n <div class=\"input-top-label\">\r\n <label class=\"fw-bold\">{{ topLabelText() }}</label>\r\n </div>\r\n }\r\n \r\n @if (!distintInputs.includes(typeStandar())) {\r\n <input [type]=\"typeStandar()\" (blur)=\"callBlur()\" (keyup.enter)=\"enter()?.()\" (input)=\"keyup()?.()\"\r\n class=\"form-control text-{{position()}}\"\r\n [placeholder]=\"placeholder()\"\r\n [attr.data-active-focus]=\"activeFocus() == false ? 'false' : ''\"\r\n [style.--focus-border-color]=\"customBorderColor()\" [style.--focus-box-shadow]=\"customBoxShadow()\"\r\n [style.--focus-transition]=\"customTransition()\" [style.max-width.px]=\"maxWidth()\"\r\n (focus)=\"invalidInput.set(false)\" autocomplete=\"off\" [ngClass]=\"invalidInput() ? 'input-error' : ''\"\r\n [disabled]=\"allDisabled() ? true : disabled()\" [(ngModel)]=\"value\" [id]=\"inputId\" [caracteresCodigo]=\"validaCodigo()\"\r\n [name]=\"inputId\" [attr.maxlength]=\"maxLength()\">\r\n }\r\n\r\n @if (typeStandar() == 'input-switch') {\r\n <div class=\"d-flex w-100\">\r\n <div class=\"flex-grow-1\">\r\n <input type=\"text\" class=\"form-control\" (blur)=\"callBlur()\" (keyup.enter)=\"enter()?.()\" (input)=\"keyup()?.()\"\r\n [placeholder]=\"placeholder()\"\r\n [attr.data-active-focus]=\"activeFocus() == false ? 'false' : ''\"\r\n [style.--focus-border-color]=\"customBorderColor()\" [style.--focus-box-shadow]=\"customBoxShadow()\"\r\n [style.--focus-transition]=\"customTransition()\" [ngClass]=\"'text-' + position()\"\r\n [style.max-width.px]=\"maxWidth()\" [disabled]=\"allDisabled() ? true : disabled()\" [(ngModel)]=\"value\"\r\n [id]=\"inputId\" [name]=\"inputId\" [caracteresCodigo]=\"validaCodigo()\"\r\n [attr.maxlength]=\"maxLength()\" (focus)=\"invalidInput.set(false)\">\r\n </div>\r\n <div class=\"px-2\">\r\n <app-switch-activo valueOn=\"S\" valueOff=\"N\" [id]=\"`switch_${inputId}`\" [(model)]=\"value2\" />\r\n </div>\r\n </div>\r\n }\r\n\r\n @if (typeStandar() == 'number-format-decimal') {\r\n <input type=\"text\" class=\"form-control\" (blur)=\"callBlur()\" (input)=\"keyup()?.()\" (keyup.enter)=\"enter()?.()\"\r\n [placeholder]=\"placeholder()\"\r\n [attr.data-active-focus]=\"activeFocus() == false ? 'false' : ''\"\r\n [style.--focus-border-color]=\"customBorderColor()\" [style.--focus-box-shadow]=\"customBoxShadow()\"\r\n [style.--focus-transition]=\"customTransition()\" [ngClass]=\"'text-' + position()\"\r\n [style.max-width.px]=\"maxWidth()\" [disabled]=\"allDisabled() ? true : disabled()\" [(ngModel)]=\"value\"\r\n [id]=\"inputId\" [name]=\"inputId\" [appDecimal]=\"formatNumber()\" onlyNumberFlex\r\n [attr.maxlength]=\"maxLength()\" (focus)=\"invalidInput.set(false)\">\r\n }\r\n\r\n @if (typeStandar() == 'number-integer') {\r\n <input type=\"text\" class=\"form-control text-{{position()}}\" (blur)=\"callBlur()\" (input)=\"keyup()?.()\" (keyup.enter)=\"enter()?.()\"\r\n [placeholder]=\"placeholder()\"\r\n [attr.data-active-focus]=\"activeFocus() == false ? 'false' : ''\"\r\n [style.--focus-border-color]=\"customBorderColor()\" [style.--focus-box-shadow]=\"customBoxShadow()\"\r\n [style.--focus-transition]=\"customTransition()\" [style.max-width.px]=\"maxWidth()\"\r\n [ngClass]=\"invalidInput() ? 'input-error' : ''\" [disabled]=\"allDisabled() ? true : disabled()\"\r\n [(ngModel)]=\"value\" [id]=\"inputId\" [name]=\"inputId\" onlyNumber\r\n [attr.maxlength]=\"maxLength()\" (focus)=\"invalidInput.set(false)\">\r\n }\r\n\r\n @if (typeStandar() == 'day') {\r\n <input type=\"text\" class=\"form-control text-{{position()}}\" (blur)=\"callBlur()\" (input)=\"keyup()?.()\" (keyup.enter)=\"enter()?.()\"\r\n [placeholder]=\"placeholder()\"\r\n [attr.data-active-focus]=\"activeFocus() == false ? 'false' : ''\"\r\n [style.--focus-border-color]=\"customBorderColor()\" [style.--focus-box-shadow]=\"customBoxShadow()\"\r\n [style.--focus-transition]=\"customTransition()\" [style.max-width.px]=\"maxWidth()\"\r\n [ngClass]=\"invalidInput() ? 'input-error' : ''\" [disabled]=\"allDisabled() ? true : disabled()\"\r\n [(ngModel)]=\"value\" [id]=\"inputId\" [name]=\"inputId\" onlyDay\r\n [attr.maxlength]=\"maxLength()\" (focus)=\"invalidInput.set(false)\">\r\n }\r\n\r\n @if (typeStandar() == 'date') {\r\n <input type=\"date\" class=\"form-control text-{{position()}}\" (blur)=\"callBlur()\" (input)=\"keyup()?.()\"\r\n [placeholder]=\"placeholder()\"\r\n [attr.data-active-focus]=\"activeFocus() == false ? 'false' : ''\"\r\n [style.--focus-border-color]=\"customBorderColor()\" [style.--focus-box-shadow]=\"customBoxShadow()\"\r\n [style.--focus-transition]=\"customTransition()\" [ngClass]=\"invalidInput() ? 'input-error' : ''\"\r\n [disabled]=\"allDisabled() ? true : disabled()\" [(ngModel)]=\"value\" [id]=\"inputId\"\r\n [name]=\"inputId\" (focus)=\"invalidInput.set(false)\">\r\n }\r\n\r\n @if (typeStandar() == 'time') {\r\n <input type=\"time\" class=\"form-control text-{{position()}}\" (blur)=\"callBlur()\" (input)=\"keyup()?.()\"\r\n [placeholder]=\"placeholder()\"\r\n [attr.data-active-focus]=\"activeFocus() == false ? 'false' : ''\"\r\n [style.--focus-border-color]=\"customBorderColor()\" [style.--focus-box-shadow]=\"customBoxShadow()\"\r\n [style.--focus-transition]=\"customTransition()\" [ngClass]=\"invalidInput() ? 'input-error' : ''\"\r\n [disabled]=\"allDisabled() ? true : disabled()\" [(ngModel)]=\"value\" [id]=\"inputId\"\r\n [name]=\"inputId\" (focus)=\"invalidInput.set(false)\">\r\n }\r\n\r\n @if (typeStandar() == 'text-area') {\r\n <textarea class=\"{{'text-' + position()}} form-area\"\r\n [placeholder]=\"placeholder()\"\r\n [attr.data-active-focus]=\"activeFocus() == false ? 'false' : ''\"\r\n [style.--focus-border-color]=\"customBorderColor()\" [style.--focus-box-shadow]=\"customBoxShadow()\"\r\n [style.--focus-transition]=\"customTransition()\" [id]=\"inputId\" [name]=\"inputId\"\r\n [disabled]=\"allDisabled() ? true : disabled()\" [(ngModel)]=\"value\" [rows]=\"alto()\"\r\n [attr.maxlength]=\"maxLength()\" (focus)=\"invalidInput.set(false)\">\r\n\r\n </textarea>\r\n }\r\n\r\n @if (typeStandar() == 'select') {\r\n <select class=\"form-select {{'text-' + position()}}\" [attr.data-active-focus]=\"activeFocus() == false ? 'false' : ''\"\r\n [class.text-error]=\"isImportant()\"\r\n [style.--focus-border-color]=\"customBorderColor()\" [style.--focus-box-shadow]=\"customBoxShadow()\"\r\n [style.--focus-transition]=\"customTransition()\" [style.max-width.px]=\"maxWidth()\" [style.min-width.px]=\"maxWidth()\" [(ngModel)]=\"value\"\r\n [disabled]=\"allDisabled() ? true : disabled()\" [id]=\"inputId\"\r\n [name]=\"inputId\" (change)=\"emitirChange()\" (focus)=\"focusInput()\">\r\n @if (withTodos()) {\r\n <option [value]=\"typeKey() == 'number' ? -1 : ''\">Todos</option>\r\n }\r\n @for (item of lista(); track $index) {\r\n @if (!keyCodigo()) {\r\n <option [value]=\"item\"> {{ item }}</option>\r\n }\r\n @if (keyCodigo()) {\r\n <option [value]=\"item[keyCodigo()]\"> {{ joinInfo() ? item[keyCodigo()] + ' - ' + item[keyDescri()] :\r\n item[keyDescri()]}}</option>\r\n }\r\n\r\n }\r\n </select>\r\n }\r\n\r\n @if (withBuscar()) {\r\n <button class=\"btn btn-dark boton-buscar fs-7\" [ngClass]=\"classButton()\" [disabled]=\"allDisabled()\" (click)=\"ejecutarAccion()\">\r\n <i [ngClass]=\"iconButton()\" ></i>\r\n </button>\r\n }\r\n @if (withChangeInput()) {\r\n <button class=\"btn btn-dark boton-buscar bg-search fs-7\" [disabled]=\"allDisabled()\" (click)=\"changeInputAction()\">\r\n <i [ngClass]=\"typeStandar() == 'select' ? 'fas fa-times' : 'fa solid fa-pen'\"></i>\r\n </button>\r\n }\r\n @if (invalidInput()) {\r\n <div class=\"infoBox\" @fadeInOut><i class=\"fas fa-exclamation-triangle fs-9 text-danger\"></i> Ocurri\u00F3 un\r\n error: El campo es obligatorio, aseg\u00FArese de ingresar datos v\u00E1lidos.</div>\r\n }\r\n\r\n </div>\r\n </div>\r\n</div>\r\n\r\n@if (textoAyuda() && typeStandar() == 'text-area') {\r\n<div class=\"d-flex flex-wrap justify-content-between align-items-center px-2\">\r\n <span class=\"text-error fs-6\">{{textoAyuda()}}</span>\r\n <span class=\"text-dark fs-6 fw-5\">{{ valueSize() }}/{{maxLength()}} caracteres</span>\r\n</div>\r\n}\r\n\r\n@if (sinAyuda() && typeStandar() == 'text-area') {\r\n<div class=\"d-flex flex-wrap justify-content-between align-items-center px-2\">\r\n <span class=\"text-error fs-6\"></span>\r\n <span class=\"text-dark fs-6 fw-5\">{{ valueSize() }}/{{maxLength()}} caracteres</span>\r\n</div>\r\n}", styles: [".text-error{color:#d60000!important;font-weight:700!important}@media (max-width: 442px){.d-flex{flex-direction:column!important;align-items:stretch!important}.infoBox{font-size:12px;padding:8px 12px;width:100%!important;max-width:100%!important}}@media (max-width: 900px){.infoBox{width:250px!important}}.infoBox{position:absolute;width:400px;top:calc(100% + 10px);left:0;right:0;margin-top:2px;background:#be0000d5;box-shadow:0 4px 12px #0003;border-radius:6px;padding:15px 12px;font-size:14px;color:#dbdbdb;z-index:10;font-size:12px;font-weight:600}.infoBox:before{content:\"\";position:absolute;top:-10px;left:20px;border-width:0 8px 10px 8px;border-style:solid;border-color:transparent transparent rgba(190,0,0,.835) transparent;filter:drop-shadow(0 -1px 1px rgba(0,0,0,.1))}.input-error{border:1px solid rgb(203,0,0);color:#cb0000!important;animation:aura-pulse 1.5s ease-out infinite;position:relative;z-index:1}@keyframes aura-pulse{0%{box-shadow:0 0 #cb0000b3}70%{box-shadow:0 0 0 5px #cb000000}to{box-shadow:0 0 #cb000000}}\n"] }]
|
|
1541
|
+
args: [{ selector: 'app-input', imports: [FormsModule, CommonModule, DecimalDirective, OnlyNumberDirective, OnlyDayDirective, SwitchActivoComponent, OnlyNumberFlexDirective, CaracteresCodigoDirective], animations: [fadeInOut], changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (isVertical()) {\r\n<label [ngClass]=\"{'text-error': isImportant()}\" [for]=\"inputId\" [style.min-width]=\"wlabel() + 'px'\"> {{label()}} @if (isRequired()) {<span\r\n class=\"fw-bold text-danger\">(*)</span>}</label>\r\n}\r\n<div class=\"d-flex align-items-{{position_row()}}\">\r\n @if (!isVertical()) {\r\n <label [ngClass]=\"{'text-error': isImportant()}\" [for]=\"inputId\" [style.min-width]=\"wlabel() + 'px'\"> {{label()}} @if (isRequired()) {<span\r\n class=\"fw-bold text-danger\">(*)</span>}</label>\r\n }\r\n <div class=\"flex-grow-1 me-2\" style=\"min-width: 0\">\r\n <div [ngClass]=\"{'d-block': typeStandar() == 'date', 'd-flex': typeStandar() != 'date', 'flex-column': showTopLabel() }\"\r\n class=\"position-relative\">\r\n \r\n @if (showTopLabel() && topLabelText()) {\r\n <div class=\"input-top-label\">\r\n <label class=\"fw-bold\">{{ topLabelText() }}</label>\r\n </div>\r\n }\r\n \r\n @if (!distintInputs.includes(typeStandar())) {\r\n <input [type]=\"typeStandar()\" (blur)=\"callBlur()\" (keyup.enter)=\"enter()?.()\" (input)=\"keyup()?.()\"\r\n class=\"form-control text-{{position()}}\"\r\n [placeholder]=\"placeholder()\"\r\n [attr.data-active-focus]=\"activeFocus() == false ? 'false' : ''\"\r\n [style.--focus-border-color]=\"customBorderColor()\" [style.--focus-box-shadow]=\"customBoxShadow()\"\r\n [style.--focus-transition]=\"customTransition()\" [style.max-width.px]=\"maxWidth()\"\r\n [class.input-error]=\"hasError()\"\r\n (focus)=\"invalidInput.set(false)\" autocomplete=\"off\"\r\n [disabled]=\"allDisabled() ? true : disabled()\" [(ngModel)]=\"value\" [id]=\"inputId\" [caracteresCodigo]=\"validaCodigo()\"\r\n [name]=\"inputId\" [attr.maxlength]=\"maxLength()\">\r\n }\r\n\r\n @if (typeStandar() == 'input-switch') {\r\n <div class=\"d-flex w-100\">\r\n <div class=\"flex-grow-1\">\r\n <input type=\"text\" class=\"form-control\" (blur)=\"callBlur()\" (keyup.enter)=\"enter()?.()\" (input)=\"keyup()?.()\"\r\n [placeholder]=\"placeholder()\"\r\n [attr.data-active-focus]=\"activeFocus() == false ? 'false' : ''\"\r\n [style.--focus-border-color]=\"customBorderColor()\" [style.--focus-box-shadow]=\"customBoxShadow()\"\r\n [style.--focus-transition]=\"customTransition()\" [ngClass]=\"'text-' + position()\"\r\n [style.max-width.px]=\"maxWidth()\" [disabled]=\"allDisabled() ? true : disabled()\" [(ngModel)]=\"value\"\r\n [id]=\"inputId\" [name]=\"inputId\" [caracteresCodigo]=\"validaCodigo()\"\r\n [attr.maxlength]=\"maxLength()\" (focus)=\"invalidInput.set(false)\">\r\n </div>\r\n <div class=\"px-2\">\r\n <app-switch-activo valueOn=\"S\" valueOff=\"N\" [id]=\"`switch_${inputId}`\" [(model)]=\"value2\" />\r\n </div>\r\n </div>\r\n }\r\n\r\n @if (typeStandar() == 'number-format-decimal') {\r\n <input type=\"text\" class=\"form-control\" (blur)=\"callBlur()\" (input)=\"keyup()?.()\" (keyup.enter)=\"enter()?.()\"\r\n [placeholder]=\"placeholder()\"\r\n [attr.data-active-focus]=\"activeFocus() == false ? 'false' : ''\"\r\n [style.--focus-border-color]=\"customBorderColor()\" [style.--focus-box-shadow]=\"customBoxShadow()\"\r\n [style.--focus-transition]=\"customTransition()\" \r\n [class.input-error]=\"hasError()\"\r\n [ngClass]=\"'text-' + position()\"\r\n [style.max-width.px]=\"maxWidth()\" [disabled]=\"allDisabled() ? true : disabled()\" [(ngModel)]=\"value\"\r\n [id]=\"inputId\" [name]=\"inputId\" [appDecimal]=\"formatNumber()\" onlyNumberFlex\r\n [attr.maxlength]=\"maxLength()\" (focus)=\"invalidInput.set(false)\">\r\n }\r\n\r\n @if (typeStandar() == 'number-integer') {\r\n <input type=\"text\" class=\"form-control text-{{position()}}\" (blur)=\"callBlur()\" (input)=\"keyup()?.()\" (keyup.enter)=\"enter()?.()\"\r\n [placeholder]=\"placeholder()\"\r\n [attr.data-active-focus]=\"activeFocus() == false ? 'false' : ''\"\r\n [style.--focus-border-color]=\"customBorderColor()\" [style.--focus-box-shadow]=\"customBoxShadow()\"\r\n [style.--focus-transition]=\"customTransition()\" [style.max-width.px]=\"maxWidth()\"\r\n [class.input-error]=\"hasError()\"\r\n [disabled]=\"allDisabled() ? true : disabled()\"\r\n [(ngModel)]=\"value\" [id]=\"inputId\" [name]=\"inputId\" onlyNumber\r\n [attr.maxlength]=\"maxLength()\" (focus)=\"invalidInput.set(false)\">\r\n }\r\n\r\n @if (typeStandar() == 'day') {\r\n <input type=\"text\" class=\"form-control text-{{position()}}\" (blur)=\"callBlur()\" (input)=\"keyup()?.()\" (keyup.enter)=\"enter()?.()\"\r\n [placeholder]=\"placeholder()\"\r\n [attr.data-active-focus]=\"activeFocus() == false ? 'false' : ''\"\r\n [style.--focus-border-color]=\"customBorderColor()\" [style.--focus-box-shadow]=\"customBoxShadow()\"\r\n [style.--focus-transition]=\"customTransition()\" [style.max-width.px]=\"maxWidth()\"\r\n [class.input-error]=\"hasError()\"\r\n [disabled]=\"allDisabled() ? true : disabled()\"\r\n [(ngModel)]=\"value\" [id]=\"inputId\" [name]=\"inputId\" onlyDay\r\n [attr.maxlength]=\"maxLength()\" (focus)=\"invalidInput.set(false)\">\r\n }\r\n\r\n @if (typeStandar() == 'date') {\r\n <input type=\"date\" class=\"form-control text-{{position()}}\" (blur)=\"callBlur()\" (input)=\"keyup()?.()\"\r\n [placeholder]=\"placeholder()\"\r\n [attr.data-active-focus]=\"activeFocus() == false ? 'false' : ''\"\r\n [style.--focus-border-color]=\"customBorderColor()\" [style.--focus-box-shadow]=\"customBoxShadow()\"\r\n [style.--focus-transition]=\"customTransition()\" \r\n [class.input-error]=\"hasError()\"\r\n [disabled]=\"allDisabled() ? true : disabled()\" [(ngModel)]=\"value\" [id]=\"inputId\"\r\n [name]=\"inputId\" (focus)=\"invalidInput.set(false)\">\r\n }\r\n\r\n @if (typeStandar() == 'time') {\r\n <input type=\"time\" class=\"form-control text-{{position()}}\" (blur)=\"callBlur()\" (input)=\"keyup()?.()\"\r\n [placeholder]=\"placeholder()\"\r\n [attr.data-active-focus]=\"activeFocus() == false ? 'false' : ''\"\r\n [style.--focus-border-color]=\"customBorderColor()\" [style.--focus-box-shadow]=\"customBoxShadow()\"\r\n [style.--focus-transition]=\"customTransition()\" \r\n [class.input-error]=\"hasError()\"\r\n [disabled]=\"allDisabled() ? true : disabled()\" [(ngModel)]=\"value\" [id]=\"inputId\"\r\n [name]=\"inputId\" (focus)=\"invalidInput.set(false)\">\r\n }\r\n\r\n @if (typeStandar() == 'text-area') {\r\n <textarea class=\"{{'text-' + position()}} form-area\"\r\n [placeholder]=\"placeholder()\"\r\n [attr.data-active-focus]=\"activeFocus() == false ? 'false' : ''\"\r\n [style.--focus-border-color]=\"customBorderColor()\" [style.--focus-box-shadow]=\"customBoxShadow()\"\r\n [style.--focus-transition]=\"customTransition()\" \r\n [class.input-error]=\"hasError()\"\r\n [id]=\"inputId\" [name]=\"inputId\"\r\n [disabled]=\"allDisabled() ? true : disabled()\" [(ngModel)]=\"value\" [rows]=\"alto()\"\r\n [attr.maxlength]=\"maxLength()\" (focus)=\"invalidInput.set(false)\">\r\n\r\n </textarea>\r\n }\r\n\r\n @if (typeStandar() == 'select') {\r\n <select class=\"form-select {{'text-' + position()}}\" [attr.data-active-focus]=\"activeFocus() == false ? 'false' : ''\"\r\n [class.text-error]=\"isImportant()\"\r\n [style.--focus-border-color]=\"customBorderColor()\" [style.--focus-box-shadow]=\"customBoxShadow()\"\r\n [style.--focus-transition]=\"customTransition()\" [style.max-width.px]=\"maxWidth()\" [style.min-width.px]=\"maxWidth()\" \r\n [class.input-error]=\"hasError()\"\r\n [(ngModel)]=\"value\"\r\n [disabled]=\"allDisabled() ? true : disabled()\" [id]=\"inputId\"\r\n [name]=\"inputId\" (change)=\"emitirChange()\" (focus)=\"focusInput()\">\r\n @if (withTodos()) {\r\n <option [value]=\"typeKey() == 'number' ? -1 : ''\">Todos</option>\r\n }\r\n @for (item of lista(); track $index) {\r\n @if (!keyCodigo()) {\r\n <option [value]=\"item\"> {{ item }}</option>\r\n }\r\n @if (keyCodigo()) {\r\n <option [value]=\"item[keyCodigo()]\"> {{ joinInfo() ? item[keyCodigo()] + ' - ' + item[keyDescri()] :\r\n item[keyDescri()]}}</option>\r\n }\r\n\r\n }\r\n </select>\r\n }\r\n\r\n @if (withBuscar()) {\r\n <button class=\"btn btn-dark boton-buscar fs-7\" [ngClass]=\"classButton()\" [disabled]=\"allDisabled()\" (click)=\"ejecutarAccion()\">\r\n <i [ngClass]=\"iconButton()\" ></i>\r\n </button>\r\n }\r\n @if (withChangeInput()) {\r\n <button class=\"btn btn-dark boton-buscar bg-search fs-7\" [disabled]=\"allDisabled()\" (click)=\"changeInputAction()\">\r\n <i [ngClass]=\"typeStandar() == 'select' ? 'fas fa-times' : 'fa solid fa-pen'\"></i>\r\n </button>\r\n }\r\n @if (invalidInput()) {\r\n <div class=\"infoBox\" @fadeInOut><i class=\"fas fa-exclamation-triangle fs-9 text-danger\"></i> Ocurri\u00F3 un\r\n error: El campo es obligatorio, aseg\u00FArese de ingresar datos v\u00E1lidos.</div>\r\n }\r\n\r\n </div>\r\n </div>\r\n</div>\r\n\r\n@if (textoAyuda() && typeStandar() == 'text-area') {\r\n<div class=\"d-flex flex-wrap justify-content-between align-items-center px-2\">\r\n <span class=\"text-error fs-6\">{{textoAyuda()}}</span>\r\n <span class=\"text-dark fs-6 fw-5\">{{ valueSize() }}/{{maxLength()}} caracteres</span>\r\n</div>\r\n}\r\n\r\n@if (sinAyuda() && typeStandar() == 'text-area') {\r\n<div class=\"d-flex flex-wrap justify-content-between align-items-center px-2\">\r\n <span class=\"text-error fs-6\"></span>\r\n <span class=\"text-dark fs-6 fw-5\">{{ valueSize() }}/{{maxLength()}} caracteres</span>\r\n</div>\r\n}", styles: [".text-error{color:#d60000!important;font-weight:700!important}@media (max-width: 442px){.d-flex{flex-direction:column!important;align-items:stretch!important}.infoBox{font-size:12px;padding:8px 12px;width:100%!important;max-width:100%!important}}@media (max-width: 900px){.infoBox{width:250px!important}}.infoBox{position:absolute;width:400px;top:calc(100% + 10px);left:0;right:0;margin-top:2px;background:#be0000d5;box-shadow:0 4px 12px #0003;border-radius:6px;padding:15px 12px;font-size:14px;color:#dbdbdb;z-index:10;font-size:12px;font-weight:600}.infoBox:before{content:\"\";position:absolute;top:-10px;left:20px;border-width:0 8px 10px 8px;border-style:solid;border-color:transparent transparent rgba(190,0,0,.835) transparent;filter:drop-shadow(0 -1px 1px rgba(0,0,0,.1))}.input-error{border:1px solid rgb(203,0,0);color:#cb0000!important;animation:aura-pulse 1.5s ease-out infinite;position:relative;z-index:1}@keyframes aura-pulse{0%{box-shadow:0 0 #cb0000b3}70%{box-shadow:0 0 0 5px #cb000000}to{box-shadow:0 0 #cb000000}}\n"] }]
|
|
1534
1542
|
}], ctorParameters: () => [] });
|
|
1535
1543
|
|
|
1536
1544
|
class InputClaseComponent {
|
|
@@ -1545,7 +1553,7 @@ class InputClaseComponent {
|
|
|
1545
1553
|
return obtenerTipoClases(data);
|
|
1546
1554
|
}
|
|
1547
1555
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: InputClaseComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1548
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.15", type: InputClaseComponent, isStandalone: true, selector: "app-input-clase", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, item: { classPropertyName: "item", publicName: "item", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, wlabel: { classPropertyName: "wlabel", publicName: "wlabel", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onBlur: "onBlur", value: "valueChange" }, ngImport: i0, template: "\r\n<div class=\"col-md-8 pt-1\">\r\n @switch (tipoInput()) {\r\n @case ('vchar') {\r\n <app-input [label]=\"title()\" [isRequired]=\"required()\" [maxLength]=\"1\" (onBlur)=\"onBlur.emit()\" [wlabel]=\"wlabel()\" [(value)]=\"value\" />\r\n }\r\n @case ('vstrg') {\r\n <app-input [label]=\"title()\" [isRequired]=\"required()\" [maxLength]=\"80\" (onBlur)=\"onBlur.emit()\" [wlabel]=\"wlabel()\" [(value)]=\"value\"/>\r\n }\r\n @case ('ventero') {\r\n <app-input [label]=\"title()\" [isRequired]=\"required()\" position=\"end\" type=\"number-integer\" (onBlur)=\"onBlur.emit()\" [wlabel]=\"wlabel()\" [(value)]=\"value\"/>\r\n }\r\n @case ('vreal') {\r\n <app-input [label]=\"title()\" [isRequired]=\"required()\" position=\"end\" type=\"number-format-decimal\" (onBlur)=\"onBlur.emit()\" [wlabel]=\"wlabel()\" [(value)]=\"value\"/>\r\n }\r\n @case ('vdate') {\r\n <app-input [label]=\"title()\" [isRequired]=\"required()\" (onBlur)=\"onBlur.emit()\" type=\"date\" [wlabel]=\"wlabel()\" [(value)]=\"value\"/>\r\n }\r\n @case ('vtime') {\r\n <app-input [label]=\"title()\" [isRequired]=\"required()\" (onBlur)=\"onBlur.emit()\" type=\"date\" [wlabel]=\"wlabel()\" [(value)]=\"value\"/>\r\n }\r\n @case ('vglosa') {\r\n <app-input [label]=\"title()\" [isRequired]=\"required()\" (onBlur)=\"onBlur.emit()\" type=\"text-area\" [alto]=\"5\" [maxLength]=\"500\" [wlabel]=\"wlabel()\" [(value)]=\"value\"/>\r\n }\r\n @case ('codigo') {\r\n <app-doble-input [label]=\"title()\" [isRequired]=\"required()\" [tipoInput2]=\"2\" [withTodos]=\"false\" keyCodigo=\"codigo\" keyDescri=\"descri\" [lista]=\"item().codigos\" (onBlur)=\"onBlur.emit()\" [wlabel]=\"wlabel()\" [(value)]=\"value\"></app-doble-input>\r\n }\r\n }\r\n \r\n</div>\r\n", styles: [""], dependencies: [{ kind: "component", type: InputComponent, selector: "app-input", inputs: ["wlabel", "label", "placeholder", "withBuscar", "iconButton", "classButton", "isRequired", "type", "position", "value", "value2", "position_row", "withChangeInput", "disabled", "isImportant", "lista", "keyCodigo", "keyDescri", "joinInfo", "withTodos", "allDisabled", "isVertical", "alto", "formatNumber", "blur", "enter", "keyup", "invalidInput", "activeFocus", "customBorderColor", "customBoxShadow", "customTransition", "maxLength", "textoAyuda", "sinAyuda", "maxWidth", "showTopLabel", "topLabelText", "firstItemDefault", "typeKey", "validaCodigo"], outputs: ["valueChange", "value2Change", "disabledChange", "allDisabledChange", "invalidInputChange", "accion", "changeInput"] }, { kind: "component", type: DobleInputComponent, selector: "app-doble-input", inputs: ["wlabel", "label", "withBuscar", "withBuscar2", "isRequired", "tipoInput2", "lista", "keyCodigo", "keyDescri", "joinInfo", "isVertical", "withTodos", "firstItemDefault", "disabled1", "disabled2", "value", "value2", "activeFocus", "customBorderColor", "customBoxShadow", "customTransition", "maxLength", "listName", "invalidInput", "blur1", "enter1", "blur2", "enter2", "typeKey", "withAdicionalInfo", "validaLista"], outputs: ["disabled1Change", "disabled2Change", "valueChange", "value2Change", "changeInput", "invalidInputChange", "accion1", "accion2"] }] });
|
|
1556
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.15", type: InputClaseComponent, isStandalone: true, selector: "app-input-clase", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, item: { classPropertyName: "item", publicName: "item", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, wlabel: { classPropertyName: "wlabel", publicName: "wlabel", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onBlur: "onBlur", value: "valueChange" }, ngImport: i0, template: "\r\n<div class=\"col-md-8 pt-1\">\r\n @switch (tipoInput()) {\r\n @case ('vchar') {\r\n <app-input [label]=\"title()\" [isRequired]=\"required()\" [maxLength]=\"1\" (onBlur)=\"onBlur.emit()\" [wlabel]=\"wlabel()\" [(value)]=\"value\" />\r\n }\r\n @case ('vstrg') {\r\n <app-input [label]=\"title()\" [isRequired]=\"required()\" [maxLength]=\"80\" (onBlur)=\"onBlur.emit()\" [wlabel]=\"wlabel()\" [(value)]=\"value\"/>\r\n }\r\n @case ('ventero') {\r\n <app-input [label]=\"title()\" [isRequired]=\"required()\" position=\"end\" type=\"number-integer\" (onBlur)=\"onBlur.emit()\" [wlabel]=\"wlabel()\" [(value)]=\"value\"/>\r\n }\r\n @case ('vreal') {\r\n <app-input [label]=\"title()\" [isRequired]=\"required()\" position=\"end\" type=\"number-format-decimal\" (onBlur)=\"onBlur.emit()\" [wlabel]=\"wlabel()\" [(value)]=\"value\"/>\r\n }\r\n @case ('vdate') {\r\n <app-input [label]=\"title()\" [isRequired]=\"required()\" (onBlur)=\"onBlur.emit()\" type=\"date\" [wlabel]=\"wlabel()\" [(value)]=\"value\"/>\r\n }\r\n @case ('vtime') {\r\n <app-input [label]=\"title()\" [isRequired]=\"required()\" (onBlur)=\"onBlur.emit()\" type=\"date\" [wlabel]=\"wlabel()\" [(value)]=\"value\"/>\r\n }\r\n @case ('vglosa') {\r\n <app-input [label]=\"title()\" [isRequired]=\"required()\" (onBlur)=\"onBlur.emit()\" type=\"text-area\" [alto]=\"5\" [maxLength]=\"500\" [wlabel]=\"wlabel()\" [(value)]=\"value\"/>\r\n }\r\n @case ('codigo') {\r\n <app-doble-input [label]=\"title()\" [isRequired]=\"required()\" [tipoInput2]=\"2\" [withTodos]=\"false\" keyCodigo=\"codigo\" keyDescri=\"descri\" [lista]=\"item().codigos\" (onBlur)=\"onBlur.emit()\" [wlabel]=\"wlabel()\" [(value)]=\"value\"></app-doble-input>\r\n }\r\n }\r\n \r\n</div>\r\n", styles: [""], dependencies: [{ kind: "component", type: InputComponent, selector: "app-input", inputs: ["wlabel", "label", "placeholder", "withBuscar", "iconButton", "classButton", "isRequired", "type", "position", "value", "value2", "position_row", "withChangeInput", "disabled", "isImportant", "lista", "keyCodigo", "keyDescri", "joinInfo", "withTodos", "allDisabled", "isVertical", "alto", "formatNumber", "blur", "enter", "keyup", "invalidInput", "activeFocus", "customBorderColor", "customBoxShadow", "customTransition", "maxLength", "textoAyuda", "sinAyuda", "maxWidth", "showTopLabel", "topLabelText", "firstItemDefault", "typeKey", "validaCodigo", "inputErrorFn"], outputs: ["valueChange", "value2Change", "disabledChange", "allDisabledChange", "invalidInputChange", "accion", "changeInput"] }, { kind: "component", type: DobleInputComponent, selector: "app-doble-input", inputs: ["wlabel", "label", "withBuscar", "withBuscar2", "isRequired", "tipoInput2", "lista", "keyCodigo", "keyDescri", "joinInfo", "isVertical", "withTodos", "firstItemDefault", "disabled1", "disabled2", "value", "value2", "activeFocus", "customBorderColor", "customBoxShadow", "customTransition", "maxLength", "listName", "invalidInput", "blur1", "enter1", "blur2", "enter2", "typeKey", "withAdicionalInfo", "validaLista"], outputs: ["disabled1Change", "disabled2Change", "valueChange", "value2Change", "changeInput", "invalidInputChange", "accion1", "accion2"] }] });
|
|
1549
1557
|
}
|
|
1550
1558
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: InputClaseComponent, decorators: [{
|
|
1551
1559
|
type: Component,
|
|
@@ -1556,7 +1564,7 @@ class InputDinamicoComponent {
|
|
|
1556
1564
|
inputs = input([]);
|
|
1557
1565
|
sender = model();
|
|
1558
1566
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: InputDinamicoComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1559
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.15", type: InputDinamicoComponent, isStandalone: true, selector: "app-input-dinamico", inputs: { inputs: { classPropertyName: "inputs", publicName: "inputs", isSignal: true, isRequired: false, transformFunction: null }, sender: { classPropertyName: "sender", publicName: "sender", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { sender: "senderChange" }, ngImport: i0, template: "@for (input of inputs(); track $index) {\r\n<div class=\"{{ input.class }}\">\r\n @switch (input.modelo) { \r\n @case ('input-buscar') {\r\n <!-- <app-doble-input-buscar\r\n label=\"{{ input.label }}\"\r\n [(disabled)]=\"input.disabled\"\r\n [isRequired]=\"input.required\"\r\n [wlabel]=\"input.wlabel\"\r\n [maxLength]=\"input.maxlen\"\r\n [(valuecod)]=\"sender()[input.fieldname]\"\r\n [type]=\"input.buscar\"\r\n [oneinput]=\"true\"\r\n [withBuscar2]=\"true\"\r\n [joinInfo]=\"input.joinInfo\"\r\n [withBuscar]=\"true\"\r\n [viewInput]=\"input.viewInput\"\r\n /> -->\r\n }\r\n @default {\r\n <app-input\r\n label=\"{{ input.label }}\"\r\n [(disabled)]=\"input.disabled\"\r\n [isRequired]=\"input.required\"\r\n [wlabel]=\"input.wlabel\"\r\n [maxLength]=\"input.maxlen\"\r\n [(value)]=\"sender()[input.fieldname]\"\r\n [position]=\"input.position\"\r\n [type]=\"input.type\"\r\n [lista]=\"input.lista\"\r\n [keyCodigo]=\"input.keyCodigo\"\r\n [keyDescri]=\"input.keyDescri\"\r\n [withTodos]=\"input.withTodos\"\r\n [joinInfo]=\"input.joinInfo\"\r\n />\r\n } \r\n\r\n }\r\n \r\n</div>\r\n}\r\n", styles: [""], dependencies: [{ kind: "component", type: InputComponent, selector: "app-input", inputs: ["wlabel", "label", "placeholder", "withBuscar", "iconButton", "classButton", "isRequired", "type", "position", "value", "value2", "position_row", "withChangeInput", "disabled", "isImportant", "lista", "keyCodigo", "keyDescri", "joinInfo", "withTodos", "allDisabled", "isVertical", "alto", "formatNumber", "blur", "enter", "keyup", "invalidInput", "activeFocus", "customBorderColor", "customBoxShadow", "customTransition", "maxLength", "textoAyuda", "sinAyuda", "maxWidth", "showTopLabel", "topLabelText", "firstItemDefault", "typeKey", "validaCodigo"], outputs: ["valueChange", "value2Change", "disabledChange", "allDisabledChange", "invalidInputChange", "accion", "changeInput"] }] });
|
|
1567
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.15", type: InputDinamicoComponent, isStandalone: true, selector: "app-input-dinamico", inputs: { inputs: { classPropertyName: "inputs", publicName: "inputs", isSignal: true, isRequired: false, transformFunction: null }, sender: { classPropertyName: "sender", publicName: "sender", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { sender: "senderChange" }, ngImport: i0, template: "@for (input of inputs(); track $index) {\r\n<div class=\"{{ input.class }}\">\r\n @switch (input.modelo) { \r\n @case ('input-buscar') {\r\n <!-- <app-doble-input-buscar\r\n label=\"{{ input.label }}\"\r\n [(disabled)]=\"input.disabled\"\r\n [isRequired]=\"input.required\"\r\n [wlabel]=\"input.wlabel\"\r\n [maxLength]=\"input.maxlen\"\r\n [(valuecod)]=\"sender()[input.fieldname]\"\r\n [type]=\"input.buscar\"\r\n [oneinput]=\"true\"\r\n [withBuscar2]=\"true\"\r\n [joinInfo]=\"input.joinInfo\"\r\n [withBuscar]=\"true\"\r\n [viewInput]=\"input.viewInput\"\r\n /> -->\r\n }\r\n @default {\r\n <app-input\r\n label=\"{{ input.label }}\"\r\n [(disabled)]=\"input.disabled\"\r\n [isRequired]=\"input.required\"\r\n [wlabel]=\"input.wlabel\"\r\n [maxLength]=\"input.maxlen\"\r\n [(value)]=\"sender()[input.fieldname]\"\r\n [position]=\"input.position\"\r\n [type]=\"input.type\"\r\n [lista]=\"input.lista\"\r\n [keyCodigo]=\"input.keyCodigo\"\r\n [keyDescri]=\"input.keyDescri\"\r\n [withTodos]=\"input.withTodos\"\r\n [joinInfo]=\"input.joinInfo\"\r\n />\r\n } \r\n\r\n }\r\n \r\n</div>\r\n}\r\n", styles: [""], dependencies: [{ kind: "component", type: InputComponent, selector: "app-input", inputs: ["wlabel", "label", "placeholder", "withBuscar", "iconButton", "classButton", "isRequired", "type", "position", "value", "value2", "position_row", "withChangeInput", "disabled", "isImportant", "lista", "keyCodigo", "keyDescri", "joinInfo", "withTodos", "allDisabled", "isVertical", "alto", "formatNumber", "blur", "enter", "keyup", "invalidInput", "activeFocus", "customBorderColor", "customBoxShadow", "customTransition", "maxLength", "textoAyuda", "sinAyuda", "maxWidth", "showTopLabel", "topLabelText", "firstItemDefault", "typeKey", "validaCodigo", "inputErrorFn"], outputs: ["valueChange", "value2Change", "disabledChange", "allDisabledChange", "invalidInputChange", "accion", "changeInput"] }] });
|
|
1560
1568
|
}
|
|
1561
1569
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: InputDinamicoComponent, decorators: [{
|
|
1562
1570
|
type: Component,
|
|
@@ -2198,7 +2206,7 @@ class DropdownMenuComponent {
|
|
|
2198
2206
|
return null;
|
|
2199
2207
|
}
|
|
2200
2208
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: DropdownMenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2201
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.15", type: DropdownMenuComponent, isStandalone: true, selector: "app-dropdown-menu", inputs: { disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null }, buttonProperties: { classPropertyName: "buttonProperties", publicName: "buttonProperties", isSignal: true, isRequired: false, transformFunction: null }, hoverTrigger: { classPropertyName: "hoverTrigger", publicName: "hoverTrigger", isSignal: true, isRequired: false, transformFunction: null }, inputButton: { classPropertyName: "inputButton", publicName: "inputButton", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "window:resize": "onResize($event)" } }, viewQueries: [{ propertyName: "dropdown", first: true, predicate: NgbDropdown, descendants: true }, { propertyName: "submenuAnchors", predicate: ["submenuAnchor"], descendants: true }, { propertyName: "submenuDivs", predicate: ["submenuDiv"], descendants: true }], ngImport: i0, template: "<div class=\"d-inline-block\" ngbDropdown container=\"body\">\r\n @if (buttonProps()) {\r\n <button [colorBtn]=\"buttonProps()?.color || null\"\r\n [colorOutlineBtn]=\"!buttonProps()?.color ? buttonProps()?.colorOutline : null\" [disabled]=\"disabled()\"\r\n class=\"button-tilt-hover w-auto w-sm-100\" [ngClass]=\"{\r\n 'btn text-white me-1 fs-6 px-3 py-0 radius-none padd': inputButton(),\r\n 'pbp-6 wrap': !inputButton()\r\n }\" ngbDropdownToggle (mouseenter)=\"handleMainButtonMouseEnter()\" (mouseleave)=\"handleMainButtonMouseLeave()\">\r\n @if (buttonProps()?.icon == 'sunat') {\r\n <img src=\"assets/images/Sunat.ico\" class=\"button-icon-hover\" height=\"16px\" alt=\"Sunat\">\r\n }@else {\r\n <i [iconName]=\"buttonProps()?.icon\" class=\"button-icon-hover\"></i>\r\n } {{ buttonProps()?.texto }}\r\n </button>\r\n } @else {\r\n <button class=\"btn btn-sm border-0\" ngbDropdownToggle (mouseenter)=\"handleMainButtonMouseEnter()\"\r\n (mouseleave)=\"handleMainButtonMouseLeave()\" [disabled]=\"disabled()\">\r\n <i class=\"fas fa-align-left fs-6\"></i>\r\n </button>\r\n }\r\n\r\n <div ngbDropdownMenu class=\"my-0 py-0\" (mouseenter)=\"!isMobile() && handleDropdownMouseEnter()\"\r\n (mouseleave)=\"!isMobile() && handleDropdownMouseLeave()\">\r\n @for (option of visibleOptions(); track $index) {\r\n @if (isMobile() && option.submenu) {\r\n @for (sub of getVisibleSubmenuItems(option.submenu); track $index; let last = $last) {\r\n <app-button [icon]=\"sub.icon\" [texto]=\"sub.text\" (accion)=\"!sub.upload && sub.action()\" [uploadButton]=\"sub.upload\"\r\n [accept]=\"sub.accept\" (fileSelected)=\"sub.fileAction && sub.fileAction($event)\"\r\n [tooltip]=\"getPropertyName(sub.property)\" [extraClass]=\"\r\n (isFirstMobileItem(sub) ? 'border-top-radius ' : '') +\r\n (isLastMobileItem(sub) ? 'border-bottom-radius' : '')\r\n \" [buttonDeshabilitado]=\"sub.property && !propiedades()[sub.property.key]\" [dropdownButton]=\"true\" />\r\n }\r\n }\r\n @else if (!option.submenu || (option.submenu && !isMobile())) {\r\n <div class=\"dropdown-item-with-submenu\" ngbDropdown #submenuAnchor=\"ngbDropdown\"\r\n (mouseenter)=\"!isMobile() && submenuAnchor.open()\">\r\n @if (option.condition !== false && (!option.factor || factores()[option.factor.key])) {\r\n <app-button [icon]=\"option.icon\" [texto]=\"option.text\" (accion)=\"!option.upload && option.action()\"\r\n [uploadButton]=\"option.upload\" [accept]=\"option.accept\"\r\n (fileSelected)=\"option.fileAction && option.fileAction($event)\" [tooltip]=\"getPropertyName(option.property)\"\r\n [extraClass]=\"($index == 0 ? 'border-top-radius ' : '') + ($index == visibleOptions().length - 1 ? 'border-bottom-radius' : '')\"\r\n [buttonDeshabilitado]=\"option.property && !propiedades()[option.property.key]\" [dropdownButton]=\"true\"\r\n (mouseleave)=\"!isMobile() && mouseLeaveItem(submenuAnchor, $event, option.text)\">\r\n @if (option.submenu && !isMobile()) {\r\n <div ngbDropdownMenu placement=\"end\" class=\"my-0 py-0 submenu-container\" #submenuDiv\r\n (mouseleave)=\"!isMobile() && mouseLeaveSubmenu(submenuAnchor, $event, option.text)\">\r\n @for (sub of getVisibleSubmenuItems(option.submenu); track $index; let last = $last) {\r\n <app-button [icon]=\"sub.icon\" [texto]=\"sub.text\" (accion)=\"!sub.upload && sub.action()\"\r\n [uploadButton]=\"sub.upload\" [accept]=\"sub.accept\" (fileSelected)=\"sub.fileAction && sub.fileAction($event)\"\r\n [tooltip]=\"getPropertyName(sub.property)\"\r\n [extraClass]=\"($index == 0 ? 'border-top-radius ' : '') + (last ? 'border-bottom-radius' : '')\"\r\n [buttonDeshabilitado]=\"sub.property && !propiedades()[sub.property.key]\" [dropdownButton]=\"true\" />\r\n }\r\n </div>\r\n }\r\n </app-button>\r\n }\r\n </div>\r\n }\r\n }\r\n </div>\r\n</div>", styles: [".dropdown-item-with-submenu{position:relative;transition:all .3s ease}.submenu-container{position:absolute;left:100%;top:0;margin-top:0!important;opacity:0;transform:translateY(-10px);transition:opacity .3s ease,transform .3s ease;pointer-events:none}.dropdown-item-with-submenu:hover .submenu-container,.dropdown-item-with-submenu:focus-within .submenu-container{opacity:1;transform:translateY(0);pointer-events:auto}@keyframes tilt-bounce{0%,to{transform:rotate(0)}25%{transform:rotate(-.5deg)}75%{transform:rotate(.5deg)}}@keyframes icon-rotate-pop{0%{transform:rotate(0) scale(1)}25%{transform:rotate(10deg) scale(1.05)}50%{transform:rotate(-10deg) scale(1.1)}75%{transform:rotate(10deg) scale(1.05)}to{transform:rotate(0) scale(1)}}.button-tilt-hover:hover{animation:tilt-bounce .6s infinite ease-in-out}.button-tilt-hover:hover .button-icon-hover{animation:icon-rotate-pop 1s ease-in-out infinite}.wrap{overflow:hidden;text-overflow:ellipsis}@media (max-width: 575px){.d-inline-block{display:block!important}}button.radius-none,.btn.radius-none{border-radius:0!important}.padd{padding:3px 8px!important}\n"], dependencies: [{ kind: "ngmodule", type: NgbDropdownModule }, { kind: "directive", type: i1$1.NgbDropdown, selector: "[ngbDropdown]", inputs: ["autoClose", "dropdownClass", "open", "placement", "popperOptions", "container", "display"], outputs: ["openChange"], exportAs: ["ngbDropdown"] }, { kind: "directive", type: i1$1.NgbDropdownToggle, selector: "[ngbDropdownToggle]" }, { kind: "directive", type: i1$1.NgbDropdownMenu, selector: "[ngbDropdownMenu]" }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: ButtonComponent, selector: "app-button", inputs: ["autoFocus", "color", "outline", "icon", "tooltip", "texto", "isHtml", "closeButton", "sunatButton", "inputButton", "buttonDeshabilitado", "atajo", "dropdownButton", "extraClass", "disabled", "uploadButton", "accept", "isRounded", "isNotStyle", "isFullWidth", "paddingX", "paddingY"], outputs: ["accion", "fileSelected"] }, { kind: "directive", type: IconsDirective, selector: "[iconName]", inputs: ["iconName"] }, { kind: "directive", type: ButtonsModalDirective, selector: "[colorBtn]", inputs: ["colorBtn"] }, { kind: "directive", type: ButtonsOutlineDirective, selector: "[colorOutlineBtn]", inputs: ["colorOutlineBtn"] }] });
|
|
2209
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.15", type: DropdownMenuComponent, isStandalone: true, selector: "app-dropdown-menu", inputs: { disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null }, buttonProperties: { classPropertyName: "buttonProperties", publicName: "buttonProperties", isSignal: true, isRequired: false, transformFunction: null }, hoverTrigger: { classPropertyName: "hoverTrigger", publicName: "hoverTrigger", isSignal: true, isRequired: false, transformFunction: null }, inputButton: { classPropertyName: "inputButton", publicName: "inputButton", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "window:resize": "onResize($event)" } }, viewQueries: [{ propertyName: "dropdown", first: true, predicate: NgbDropdown, descendants: true }, { propertyName: "submenuAnchors", predicate: ["submenuAnchor"], descendants: true }, { propertyName: "submenuDivs", predicate: ["submenuDiv"], descendants: true }], ngImport: i0, template: "<div class=\"d-inline-block\" ngbDropdown container=\"body\">\r\n @if (buttonProps()) {\r\n <button [colorBtn]=\"buttonProps()?.color || null\"\r\n [colorOutlineBtn]=\"!buttonProps()?.color ? buttonProps()?.colorOutline : null\" [disabled]=\"disabled()\"\r\n class=\"button-tilt-hover w-auto w-sm-100\" [ngClass]=\"{\r\n 'btn text-white me-1 fs-6 px-3 py-0 radius-none padd': inputButton(),\r\n 'pbp-6 wrap': !inputButton()\r\n }\" ngbDropdownToggle (mouseenter)=\"handleMainButtonMouseEnter()\" (mouseleave)=\"handleMainButtonMouseLeave()\">\r\n @if (buttonProps()?.icon == 'sunat') {\r\n <img src=\"assets/images/Sunat.ico\" class=\"button-icon-hover\" height=\"16px\" alt=\"Sunat\">\r\n }@else {\r\n <i [iconName]=\"buttonProps()?.icon\" class=\"button-icon-hover\"></i>\r\n } {{ buttonProps()?.texto }}\r\n </button>\r\n } @else {\r\n <button class=\"btn btn-sm border-0\" ngbDropdownToggle (mouseenter)=\"handleMainButtonMouseEnter()\"\r\n (mouseleave)=\"handleMainButtonMouseLeave()\" [disabled]=\"disabled()\">\r\n <i class=\"fas fa-align-left fs-6\"></i>\r\n </button>\r\n }\r\n\r\n <div ngbDropdownMenu class=\"my-0 py-0\" (mouseenter)=\"!isMobile() && handleDropdownMouseEnter()\"\r\n (mouseleave)=\"!isMobile() && handleDropdownMouseLeave()\">\r\n @for (option of visibleOptions(); track $index) {\r\n @if (isMobile() && option.submenu) {\r\n @for (sub of getVisibleSubmenuItems(option.submenu); track $index; let last = $last) {\r\n <app-button [icon]=\"sub.icon\" [texto]=\"sub.text\" (accion)=\"!sub.upload && sub.action()\" [uploadButton]=\"sub.upload\"\r\n [accept]=\"sub.accept\" (fileSelected)=\"sub.fileAction && sub.fileAction($event)\"\r\n [tooltip]=\"getPropertyName(sub.property)\" [extraClass]=\"\r\n (isFirstMobileItem(sub) ? 'border-top-radius ' : '') +\r\n (isLastMobileItem(sub) ? 'border-bottom-radius' : '')\r\n \" [buttonDeshabilitado]=\"sub.property && !propiedades()[sub.property.key]\" [dropdownButton]=\"true\" />\r\n }\r\n }\r\n @else if (!option.submenu || (option.submenu && !isMobile())) {\r\n <div class=\"dropdown-item-with-submenu\" ngbDropdown #submenuAnchor=\"ngbDropdown\"\r\n (mouseenter)=\"!isMobile() && submenuAnchor.open()\">\r\n @if (option.condition !== false && (!option.factor || factores()[option.factor.key])) {\r\n <app-button [icon]=\"option.icon\" [texto]=\"option.text\" (accion)=\"!option.upload && option.action()\"\r\n [uploadButton]=\"option.upload\" [accept]=\"option.accept\"\r\n (fileSelected)=\"option.fileAction && option.fileAction($event)\" [tooltip]=\"getPropertyName(option.property)\"\r\n [extraClass]=\"($index == 0 ? 'border-top-radius ' : '') + ($index == visibleOptions().length - 1 ? 'border-bottom-radius' : '')\"\r\n [buttonDeshabilitado]=\"option.property && !propiedades()[option.property.key]\" [dropdownButton]=\"true\"\r\n (mouseleave)=\"!isMobile() && mouseLeaveItem(submenuAnchor, $event, option.text)\">\r\n @if (option.submenu && !isMobile()) {\r\n <div ngbDropdownMenu placement=\"end\" class=\"my-0 py-0 submenu-container\" #submenuDiv\r\n (mouseleave)=\"!isMobile() && mouseLeaveSubmenu(submenuAnchor, $event, option.text)\">\r\n @for (sub of getVisibleSubmenuItems(option.submenu); track $index; let last = $last) {\r\n <app-button [icon]=\"sub.icon\" [texto]=\"sub.text\" (accion)=\"!sub.upload && sub.action()\"\r\n [uploadButton]=\"sub.upload\" [accept]=\"sub.accept\" (fileSelected)=\"sub.fileAction && sub.fileAction($event)\"\r\n [tooltip]=\"getPropertyName(sub.property)\"\r\n [extraClass]=\"($index == 0 ? 'border-top-radius ' : '') + (last ? 'border-bottom-radius' : '')\"\r\n [buttonDeshabilitado]=\"sub.property && !propiedades()[sub.property.key]\" [dropdownButton]=\"true\" />\r\n }\r\n </div>\r\n }\r\n </app-button>\r\n }\r\n </div>\r\n }\r\n }\r\n </div>\r\n</div>", styles: [".dropdown-item-with-submenu{position:relative;transition:all .3s ease}.submenu-container{position:absolute;left:100%;top:0;margin-top:0!important;opacity:0;transform:translateY(-10px);transition:opacity .3s ease,transform .3s ease;pointer-events:none}.dropdown-item-with-submenu:hover .submenu-container,.dropdown-item-with-submenu:focus-within .submenu-container{opacity:1;transform:translateY(0);pointer-events:auto}@keyframes tilt-bounce{0%,to{transform:rotate(0)}25%{transform:rotate(-.5deg)}75%{transform:rotate(.5deg)}}@keyframes icon-rotate-pop{0%{transform:rotate(0) scale(1)}25%{transform:rotate(10deg) scale(1.05)}50%{transform:rotate(-10deg) scale(1.1)}75%{transform:rotate(10deg) scale(1.05)}to{transform:rotate(0) scale(1)}}.button-tilt-hover:hover{animation:tilt-bounce .6s infinite ease-in-out}.button-tilt-hover:hover .button-icon-hover{animation:icon-rotate-pop 1s ease-in-out infinite}.wrap{overflow:hidden;text-overflow:ellipsis}@media (max-width: 575px){.d-inline-block{display:block!important}}button.radius-none,.btn.radius-none{border-radius:0!important}.padd{padding:3px 8px!important}\n"], dependencies: [{ kind: "ngmodule", type: NgbDropdownModule }, { kind: "directive", type: i1$1.NgbDropdown, selector: "[ngbDropdown]", inputs: ["autoClose", "dropdownClass", "open", "placement", "popperOptions", "container", "display"], outputs: ["openChange"], exportAs: ["ngbDropdown"] }, { kind: "directive", type: i1$1.NgbDropdownToggle, selector: "[ngbDropdownToggle]" }, { kind: "directive", type: i1$1.NgbDropdownMenu, selector: "[ngbDropdownMenu]" }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: ButtonComponent, selector: "app-button", inputs: ["autoFocus", "color", "outline", "icon", "tooltip", "texto", "isHtml", "closeButton", "sunatButton", "inputButton", "buttonDeshabilitado", "atajo", "dropdownButton", "extraClass", "disabled", "uploadButton", "accept", "isRounded", "isNotStyle", "isFullWidth", "paddingX", "paddingY", "minWidth"], outputs: ["accion", "fileSelected"] }, { kind: "directive", type: IconsDirective, selector: "[iconName]", inputs: ["iconName"] }, { kind: "directive", type: ButtonsModalDirective, selector: "[colorBtn]", inputs: ["colorBtn"] }, { kind: "directive", type: ButtonsOutlineDirective, selector: "[colorOutlineBtn]", inputs: ["colorOutlineBtn"] }] });
|
|
2202
2210
|
}
|
|
2203
2211
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: DropdownMenuComponent, decorators: [{
|
|
2204
2212
|
type: Component,
|
|
@@ -3411,7 +3419,7 @@ class TableDetalleComponent {
|
|
|
3411
3419
|
return text?.replace(regex, '<mark>$1</mark>');
|
|
3412
3420
|
}
|
|
3413
3421
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TableDetalleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
3414
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.15", type: TableDetalleComponent, isStandalone: true, selector: "app-table-detalle", inputs: { selectedRow: { classPropertyName: "selectedRow", publicName: "selectedRow", isSignal: true, isRequired: false, transformFunction: null }, identifier: { classPropertyName: "identifier", publicName: "identifier", isSignal: true, isRequired: false, transformFunction: null }, altoContainer: { classPropertyName: "altoContainer", publicName: "altoContainer", isSignal: true, isRequired: false, transformFunction: null }, withFiltro: { classPropertyName: "withFiltro", publicName: "withFiltro", isSignal: true, isRequired: false, transformFunction: null }, busqueda: { classPropertyName: "busqueda", publicName: "busqueda", isSignal: true, isRequired: false, transformFunction: null }, rows: { classPropertyName: "rows", publicName: "rows", isSignal: true, isRequired: false, transformFunction: null }, columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: false, transformFunction: null }, lastItemDisabled: { classPropertyName: "lastItemDisabled", publicName: "lastItemDisabled", isSignal: true, isRequired: false, transformFunction: null }, position: { classPropertyName: "position", publicName: "position", isSignal: true, isRequired: false, transformFunction: null }, withCheckbox: { classPropertyName: "withCheckbox", publicName: "withCheckbox", isSignal: true, isRequired: false, transformFunction: null }, withEditItem: { classPropertyName: "withEditItem", publicName: "withEditItem", isSignal: true, isRequired: false, transformFunction: null }, colorHeader: { classPropertyName: "colorHeader", publicName: "colorHeader", isSignal: true, isRequired: false, transformFunction: null }, deleteItems: { classPropertyName: "deleteItems", publicName: "deleteItems", isSignal: true, isRequired: false, transformFunction: null }, selectItems: { classPropertyName: "selectItems", publicName: "selectItems", isSignal: true, isRequired: false, transformFunction: null }, isDarkMode: { classPropertyName: "isDarkMode", publicName: "isDarkMode", isSignal: true, isRequired: false, transformFunction: null }, selectedRadio: { classPropertyName: "selectedRadio", publicName: "selectedRadio", isSignal: true, isRequired: false, transformFunction: null }, rendered: { classPropertyName: "rendered", publicName: "rendered", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selectedRow: "selectedRowChange", busqueda: "busquedaChange", deleteItems: "deleteItemsChange", selectItems: "selectItemsChange", selectedRadio: "selectedRadioChange", editItem: "editItem" }, providers: [DatePipe, DecimalPipe], queries: [{ propertyName: "customActions", first: true, predicate: ["customActions"], descendants: true }], ngImport: i0, template: "@if (withFiltro()) {\r\n<div class=\"col-12 mb-2 mt-2 d-flex justify-content-end align-items-center\">\r\n <label for=\"\" class=\"form-label me-2 pt-2\">Buscar</label>\r\n <input type=\"text\" class=\"form-control cw-250\" (input)=\"textoDigitado($event)\">\r\n</div>\r\n}\r\n<div class=\"table-container table-responsive\"\r\n [style.max-height]=\"altoContainer() ? 'calc(100vh - ' + altoContainer() + 'px)' : ''\"\r\n [style.max-height]=\"altoContainer()? 'calc(100vh - ' + altoContainer() + 'px)' : ''\">\r\n <table #table class=\"table table-striped normal-table\" [ngClass]=\"isDarkMode() ? 'table-dark' : ''\">\r\n <thead>\r\n <tr class=\"shadow-sm\">\r\n @if (withCheckbox()) {\r\n <th scope=\"col\" class=\"text-center b-table w-min\"\r\n [ngClass]=\"colorHeader()== 'normal' ? '' : 'header-normal'\">\r\n <input type=\"checkbox\" class=\"form-check-input fs-8 border border-secondary\"\r\n [checked]=\"validaAllCheck()\" (change)=\"allCheck($event)\">\r\n </th>\r\n }\r\n\r\n @if (withEditItem()) {\r\n <th scope=\"col\" class=\"text-center b-table w-min\"\r\n [ngClass]=\"colorHeader()== 'normal' ? '' : 'header-normal'\">\r\n </th>\r\n }\r\n\r\n @if (customActions) {\r\n <th scope=\"col\" class=\"b-table w-min mwp-50\"\r\n [ngClass]=\"colorHeader()== 'normal' ? '' : 'header-normal'\"></th>\r\n }\r\n\r\n @for (column of columns(); track $index) {\r\n @if (column.visible) {\r\n <th scope=\"col\" class=\"b-table\" #thElement [title]=\"column.caption\"\r\n [style.width]=\"widthDefault(column) + 'px'\" [style.min-width]=\"widthDefault(column) + 'px'\"\r\n [ngClass]=\"colorHeader()== 'normal' ? '' : 'header-normal'\">\r\n {{ column.caption }}\r\n </th>\r\n }\r\n }\r\n </tr>\r\n </thead>\r\n\r\n <tbody>\r\n @for (row of rowFilter(); track iRow; let iRow = $index) {\r\n @let isLast = validaAccionDescri(iRow);\r\n @let rowClass = getRowClass(row);\r\n <tr [ngClass]=\"{'table-active': (identifier().length < 1 ? selectedRow() == $index : selectedRow() == concatenarValue(row,identifier()))}\"\r\n [class]=\"rowClass\" (click)=\"selectRow(identifier().length < 1 ? $index : row)\"\r\n [id]=\"identifier().length < 1 ? ('row_table_' + $index) : ('row_table_'+ concatenarValue(row,identifier()))\">\r\n\r\n @if (withCheckbox()) {\r\n <td scope=\"col\" class=\"text-center b-table w-min\" [class]=\"rowClass\">\r\n @if(!resolveCell('checkbox', row)?.hidden){\r\n <input type=\"checkbox\" class=\"form-check-input fs-8 border border-secondary my-0 py-0\"\r\n [disabled]=\"!lastItemDisabled() ? false : validaLastRegistro($index)\"\r\n [checked]=\"isItemSelected($index)\" (change)=\"toogleItem($index, $event)\">\r\n }\r\n </td>\r\n }\r\n\r\n @if (withEditItem()) {\r\n <td scope=\"col\" class=\"text-start b-table w-min\">\r\n <div class=\"d-flex align-items-center justify-content-center\">\r\n <i (click)=\"validaEdit(iRow) ? editItem.emit(row) : null \"\r\n class=\"fas fa-pen fs-7 px-2 py-2 my-1 rounded-2 text-secondary shadow-sm\"\r\n [ngClass]=\"validaEdit(iRow) ? 'cursor-pointer' : ''\" title=\"Editar articulo\"></i>\r\n </div>\r\n </td>\r\n }\r\n\r\n @if (customActions) {\r\n <td class=\"text-center mwp-90 b-table w-min\">\r\n <div class=\"d-flex justify-content-center align-items-center\">\r\n <ng-container *ngTemplateOutlet=\"customActions; context: { $implicit: row }\"></ng-container>\r\n </div>\r\n </td>\r\n }\r\n\r\n @for (column of columns(); track $index) {\r\n @if (column.visible) {\r\n @switch (column.tipo) {\r\n\r\n @case ('input-radio') {\r\n <td scope=\"col\" class=\"text-center b-table\">\r\n <input type=\"radio\" class=\"form-check-input fs-8 border border-secondary m-0 p-0\"\r\n [disabled]=\"lastItemDisabled() && validaLastRegistro(iRow)\" [checked]=\"selectedRadio() === iRow\"\r\n (change)=\"clickRadio(iRow)\">\r\n </td>\r\n }\r\n\r\n @case ('fecha') {\r\n <td class=\"b-table\" [title]=\"row[column.fieldname] | date:'dd/MM/yyyy'\"\r\n [ngClass]=\"row.situac == 'J' ? 'text-error':''\">\r\n {{ row[column.fieldname] | date:'dd/MM/yyyy' }}\r\n </td>\r\n }\r\n\r\n @case ('decimal') {\r\n <td class=\"text-end b-table\" [title]=\"limpiarNumero(row[column.fieldname]) | number:'1.2-2'\"\r\n [ngClass]=\"row.situac == 'J' ? 'text-error':''\">\r\n {{limpiarNumero(row[column.fieldname]) | number:'1.2-2'}}\r\n </td>\r\n }\r\n\r\n @case ('list-select') {\r\n <td class=\"text-center b-table\" [title]=\"row[column.fieldname]\">\r\n <div ngbDropdown class=\"d-inline-block\" container=\"body\">\r\n <div class=\"h-100 bg-sidebar d-flex align-items-center px-1\">\r\n <button [disabled]=\"!isLast\" class=\"border-0 bg-none\"\r\n [ngClass]=\"!isLast ? 'text-muted' : 'text-input'\" ngbDropdownToggle>\r\n {{row[column.fieldname]}}\r\n </button>\r\n </div>\r\n <div ngbDropdownMenu class=\"my-0 py-0\">\r\n @for (item of column.lista; track $index; let last = $last) {\r\n <app-button [texto]=\"item.text\"\r\n [extraClass]=\"($index == 0 ? 'border-top-radius ' : '') + (last ? 'border-bottom-radius' : '')\"\r\n [dropdownButton]=\"true\" (accion)=\"item?.action(row,item.codigo)\" />\r\n }\r\n </div>\r\n </div>\r\n <!-- <app-dropdown-menu [options]=\"column.lista\" [disabled]=\"lastItemDisabled() ? false : !validaLastRegistro($index)\" [buttonProperties]=\"{color:'none',texto:row[column.fieldname]}\"/> -->\r\n </td>\r\n\r\n }\r\n\r\n @case ('input') {\r\n <td class=\"b-table\" [title]=\"row[column.fieldname]\" [ngClass]=\"row.situac == 'J' ? 'text-error':''\">\r\n <input type=\"text\" class=\"form-control\" [(ngModel)]=\"row[column.fieldname]\"\r\n (focus)=\"focusData(row[column.fieldname])\"\r\n (blur)=\"!validarData(row[column.fieldname]) ? null : column?.blur(row)\"\r\n (keyup.enter)=\"!validarData(row[column.fieldname]) ? null : column?.enter(row)\"\r\n [disabled]=\"column.disabled ? (typeof column.disabled === 'function' ? column.disabled(row) : column.disabled) : false\">\r\n </td>\r\n }\r\n\r\n @case ('input-date') {\r\n <td class=\"b-table\" [title]=\"row[column.fieldname]\" [ngClass]=\"row.situac == 'J' ? 'text-error':''\">\r\n <input type=\"date\" class=\"form-control\" [(ngModel)]=\"row[column.fieldname]\"\r\n (blur)=\"column?.blur(row)\" (keyup.enter)=\"column?.enter(row)\"\r\n [disabled]=\"column.disabled ? (typeof column.disabled === 'function' ? column.disabled(row) : column.disabled) : false\">\r\n </td>\r\n }\r\n\r\n @case ('input-etiqueta') {\r\n <td class=\"b-table\" [title]=\"row[column.fieldname]\" [ngClass]=\"row.situac == 'J' ? 'text-error':''\">\r\n <!-- <app-doble-input-buscar [oneinput]=\"true\" type=\"etiqueta\" [withDetails]=\"true\"\r\n [(valuedes)]=\"row[column.fieldname]\" [(disabled)]=\"row.disabledEtiqueta\"\r\n [auxiliarData]=\"{tipinv:row.tipinv,codart:row.codart,codtit:row.codtit,codalm:row.codalm}\"\r\n (emitirAdicionalData)=\"manejarDataEtiqueta($event,row)\"\r\n (disabledChange)=\"limpiarEtiqueta($event,row)\" [withBuscar2]=\"true\"\r\n [allDisabled]=\"row.disabledAll ?? false\" /> -->\r\n </td>\r\n }\r\n\r\n @case ('input-afecta') {\r\n <td class=\"b-table\" [title]=\"row[column.fieldname]\" [ngClass]=\"row.situac == 'J' ? 'text-error':''\">\r\n <!-- <app-doble-input-buscar [oneinput]=\"true\" type=\"tafecta\" [(valuecod)]=\"row[column.fieldname]\"\r\n [(disabled)]=\"row.disabledEtiqueta\" [(valuedes)]=\"row.dtipafec\" viewInput=\"cod\"\r\n [withBuscar]=\"true\" [allDisabled]=\"row.disabledAll ?? false\" /> -->\r\n </td>\r\n }\r\n\r\n @case ('input-number') {\r\n <td class=\"b-table\" [title]=\"row[column.fieldname]\" [ngClass]=\"row.situac == 'J' ? 'text-error':''\">\r\n <input type=\"text\" class=\"form-control text-end\"\r\n [ngClass]=\"(!column.valida ? '' : (row[column.fieldname] ?? 0) <= 0 ? 'input-error' : '')\"\r\n [(ngModel)]=\"row[column.fieldname]\" (blur)=\"validarFunction(column.blur)?.(row)\"\r\n [disabled]=\"row.disabledAll ?? false\" onlyNumber>\r\n </td>\r\n }\r\n\r\n @case ('input-decimal') {\r\n <td class=\"b-table\" [title]=\"row[column.fieldname]\" [ngClass]=\"row.situac == 'J' ? 'text-error':''\">\r\n <input type=\"text\" class=\"form-control text-end w-100\"\r\n [ngClass]=\"(!column.valida ? '' : (row[column.fieldname] ?? 0) <= 0 ? 'input-error' : '')\"\r\n [(ngModel)]=\"row[column.fieldname]\" (blur)=\"validarFunction(column.blur)?.(row)\"\r\n [appDecimal]=\"column.pipe\" [readonly]=\"column.readonly ? column.readonly(row) : false\"\r\n [disabled]=\"row.disabledAll ?? generateKeyDisabled(row,column)\" onlyNumber>\r\n </td>\r\n }\r\n\r\n @case ('input-select') {\r\n <td class=\"b-table\" [title]=\"row[column.fieldname]\" [ngClass]=\"row.situac == 'J' ? 'text-error':''\">\r\n <select class=\"form-select\" name=\"{{`cbo_lista_${row[column.fieldname]}`}}\"\r\n id=\"{{`cbo_lista_${row[column.fieldname]}`}}\" [(ngModel)]=\"row[column.fieldname]\"\r\n (change)=\"validarFunction(column.change)?.(row)\"\r\n [disabled]=\"column.disabled ? (typeof column.disabled === 'function' ? column.disabled(row) : column.disabled) : false\">\r\n @for (item of column.lista; track $index) {\r\n <option [value]=\"item[column.keyCodigo]\"> {{ item[column.keyDescri]}} </option>\r\n }\r\n </select>\r\n </td>\r\n }\r\n\r\n @case ('stock') {\r\n <td class=\"b-table text-center\" [title]=\"row[column.fieldname] ? row[column.fieldname] : 'Sin Stock'\">\r\n @if (limpiarNumero(row[column.fieldname]) > 0) {\r\n {{row[column.fieldname]}}\r\n }@else {\r\n <i class=\"fas fa-times text-danger fw-bold fs-4\"></i>\r\n }\r\n </td>\r\n }\r\n\r\n @default {\r\n <td class=\"b-table\" [title]=\"row[column.fieldname]\" [ngClass]=\"row.situac == 'J' ? 'text-error':''\">\r\n <span [ngClass]=\"isLast ? 'cursor-pointer' : ''\"\r\n (click)=\"isLast ? column?.clic() : null\">{{row[column.fieldname]}}</span>\r\n </td>\r\n }\r\n }\r\n }\r\n }\r\n </tr>\r\n }\r\n </tbody>\r\n </table>\r\n</div>", styles: ["thead{position:sticky;top:0;z-index:1}.table-container{width:100%;max-width:100%;overflow-x:auto;display:block;white-space:nowrap}.table-blank{--bs-table-bg-state: white !important}.header-normal{background:#cecece!important}.normal-table thead tr th{font-size:11px;text-align:start;font-weight:700;max-width:220px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.normal-table tbody tr{height:30px}.normal-table tbody tr td{font-size:11px;vertical-align:middle;font-weight:500;white-space:nowrap;text-overflow:ellipsis;padding-top:0;padding-bottom:0}.normal-table thead{position:sticky;top:0;z-index:1}@media (max-width: 1600px){.normal-table tbody tr td{font-size:9px}.normal-table thead tr th{font-size:10px}}.input-error{border:1px solid rgb(203,0,0);color:#cb0000!important;position:relative;z-index:1}@keyframes aura-pulse{0%{box-shadow:0 0 #cb0000b3}70%{box-shadow:0 0 0 5px #cb000000}to{box-shadow:0 0 #cb000000}}.w-min{max-width:40px!important;width:40px!important;min-width:40px!important}.bg-red{background-color:red}.bg-red i,.bg-red span,.bg-red button,.bg-red td,.bg-red input,.bg-red select,.bg-red-input{color:red!important}.bg-blue{background-color:#00f}.bg-blue i,.bg-blue span,.bg-blue button,.bg-blue td,.bg-blue input,.bg-blue select,.bg-blue-input{color:#00f!important}.bg-yellow{background-color:#ff0}.bg-green{background-color:#adff2f}.bg-initial{background-color:initial}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$2.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$2.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$2.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: i1.DecimalPipe, name: "number" }, { kind: "pipe", type: i1.DatePipe, name: "date" }, { kind: "directive", type: DecimalDirective, selector: "[appDecimal]", inputs: ["appDecimal"] }, { kind: "directive", type: OnlyNumberDirective, selector: "[onlyNumber]" }, { kind: "ngmodule", type: NgbDropdownModule }, { kind: "directive", type: i1$1.NgbDropdown, selector: "[ngbDropdown]", inputs: ["autoClose", "dropdownClass", "open", "placement", "popperOptions", "container", "display"], outputs: ["openChange"], exportAs: ["ngbDropdown"] }, { kind: "directive", type: i1$1.NgbDropdownToggle, selector: "[ngbDropdownToggle]" }, { kind: "directive", type: i1$1.NgbDropdownMenu, selector: "[ngbDropdownMenu]" }, { kind: "component", type: ButtonComponent, selector: "app-button", inputs: ["autoFocus", "color", "outline", "icon", "tooltip", "texto", "isHtml", "closeButton", "sunatButton", "inputButton", "buttonDeshabilitado", "atajo", "dropdownButton", "extraClass", "disabled", "uploadButton", "accept", "isRounded", "isNotStyle", "isFullWidth", "paddingX", "paddingY"], outputs: ["accion", "fileSelected"] }] });
|
|
3422
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.15", type: TableDetalleComponent, isStandalone: true, selector: "app-table-detalle", inputs: { selectedRow: { classPropertyName: "selectedRow", publicName: "selectedRow", isSignal: true, isRequired: false, transformFunction: null }, identifier: { classPropertyName: "identifier", publicName: "identifier", isSignal: true, isRequired: false, transformFunction: null }, altoContainer: { classPropertyName: "altoContainer", publicName: "altoContainer", isSignal: true, isRequired: false, transformFunction: null }, withFiltro: { classPropertyName: "withFiltro", publicName: "withFiltro", isSignal: true, isRequired: false, transformFunction: null }, busqueda: { classPropertyName: "busqueda", publicName: "busqueda", isSignal: true, isRequired: false, transformFunction: null }, rows: { classPropertyName: "rows", publicName: "rows", isSignal: true, isRequired: false, transformFunction: null }, columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: false, transformFunction: null }, lastItemDisabled: { classPropertyName: "lastItemDisabled", publicName: "lastItemDisabled", isSignal: true, isRequired: false, transformFunction: null }, position: { classPropertyName: "position", publicName: "position", isSignal: true, isRequired: false, transformFunction: null }, withCheckbox: { classPropertyName: "withCheckbox", publicName: "withCheckbox", isSignal: true, isRequired: false, transformFunction: null }, withEditItem: { classPropertyName: "withEditItem", publicName: "withEditItem", isSignal: true, isRequired: false, transformFunction: null }, colorHeader: { classPropertyName: "colorHeader", publicName: "colorHeader", isSignal: true, isRequired: false, transformFunction: null }, deleteItems: { classPropertyName: "deleteItems", publicName: "deleteItems", isSignal: true, isRequired: false, transformFunction: null }, selectItems: { classPropertyName: "selectItems", publicName: "selectItems", isSignal: true, isRequired: false, transformFunction: null }, isDarkMode: { classPropertyName: "isDarkMode", publicName: "isDarkMode", isSignal: true, isRequired: false, transformFunction: null }, selectedRadio: { classPropertyName: "selectedRadio", publicName: "selectedRadio", isSignal: true, isRequired: false, transformFunction: null }, rendered: { classPropertyName: "rendered", publicName: "rendered", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selectedRow: "selectedRowChange", busqueda: "busquedaChange", deleteItems: "deleteItemsChange", selectItems: "selectItemsChange", selectedRadio: "selectedRadioChange", editItem: "editItem" }, providers: [DatePipe, DecimalPipe], queries: [{ propertyName: "customActions", first: true, predicate: ["customActions"], descendants: true }], ngImport: i0, template: "@if (withFiltro()) {\r\n<div class=\"col-12 mb-2 mt-2 d-flex justify-content-end align-items-center\">\r\n <label for=\"\" class=\"form-label me-2 pt-2\">Buscar</label>\r\n <input type=\"text\" class=\"form-control cw-250\" (input)=\"textoDigitado($event)\">\r\n</div>\r\n}\r\n<div class=\"table-container table-responsive\"\r\n [style.max-height]=\"altoContainer() ? 'calc(100vh - ' + altoContainer() + 'px)' : ''\"\r\n [style.max-height]=\"altoContainer()? 'calc(100vh - ' + altoContainer() + 'px)' : ''\">\r\n <table #table class=\"table table-striped normal-table\" [ngClass]=\"isDarkMode() ? 'table-dark' : ''\">\r\n <thead>\r\n <tr class=\"shadow-sm\">\r\n @if (withCheckbox()) {\r\n <th scope=\"col\" class=\"text-center b-table w-min\"\r\n [ngClass]=\"colorHeader()== 'normal' ? '' : 'header-normal'\">\r\n <input type=\"checkbox\" class=\"form-check-input fs-8 border border-secondary\"\r\n [checked]=\"validaAllCheck()\" (change)=\"allCheck($event)\">\r\n </th>\r\n }\r\n\r\n @if (withEditItem()) {\r\n <th scope=\"col\" class=\"text-center b-table w-min\"\r\n [ngClass]=\"colorHeader()== 'normal' ? '' : 'header-normal'\">\r\n </th>\r\n }\r\n\r\n @if (customActions) {\r\n <th scope=\"col\" class=\"b-table w-min mwp-50\"\r\n [ngClass]=\"colorHeader()== 'normal' ? '' : 'header-normal'\"></th>\r\n }\r\n\r\n @for (column of columns(); track $index) {\r\n @if (column.visible) {\r\n <th scope=\"col\" class=\"b-table\" #thElement [title]=\"column.caption\"\r\n [style.width]=\"widthDefault(column) + 'px'\" [style.min-width]=\"widthDefault(column) + 'px'\"\r\n [ngClass]=\"colorHeader()== 'normal' ? '' : 'header-normal'\">\r\n {{ column.caption }}\r\n </th>\r\n }\r\n }\r\n </tr>\r\n </thead>\r\n\r\n <tbody>\r\n @for (row of rowFilter(); track iRow; let iRow = $index) {\r\n @let isLast = validaAccionDescri(iRow);\r\n @let rowClass = getRowClass(row);\r\n <tr [ngClass]=\"{'table-active': (identifier().length < 1 ? selectedRow() == $index : selectedRow() == concatenarValue(row,identifier()))}\"\r\n [class]=\"rowClass\" (click)=\"selectRow(identifier().length < 1 ? $index : row)\"\r\n [id]=\"identifier().length < 1 ? ('row_table_' + $index) : ('row_table_'+ concatenarValue(row,identifier()))\">\r\n\r\n @if (withCheckbox()) {\r\n <td scope=\"col\" class=\"text-center b-table w-min\" [class]=\"rowClass\">\r\n @if(!resolveCell('checkbox', row)?.hidden){\r\n <input type=\"checkbox\" class=\"form-check-input fs-8 border border-secondary my-0 py-0\"\r\n [disabled]=\"!lastItemDisabled() ? false : validaLastRegistro($index)\"\r\n [checked]=\"isItemSelected($index)\" (change)=\"toogleItem($index, $event)\">\r\n }\r\n </td>\r\n }\r\n\r\n @if (withEditItem()) {\r\n <td scope=\"col\" class=\"text-start b-table w-min\">\r\n <div class=\"d-flex align-items-center justify-content-center\">\r\n <i (click)=\"validaEdit(iRow) ? editItem.emit(row) : null \"\r\n class=\"fas fa-pen fs-7 px-2 py-2 my-1 rounded-2 text-secondary shadow-sm\"\r\n [ngClass]=\"validaEdit(iRow) ? 'cursor-pointer' : ''\" title=\"Editar articulo\"></i>\r\n </div>\r\n </td>\r\n }\r\n\r\n @if (customActions) {\r\n <td class=\"text-center mwp-90 b-table w-min\">\r\n <div class=\"d-flex justify-content-center align-items-center\">\r\n <ng-container *ngTemplateOutlet=\"customActions; context: { $implicit: row }\"></ng-container>\r\n </div>\r\n </td>\r\n }\r\n\r\n @for (column of columns(); track $index) {\r\n @if (column.visible) {\r\n @switch (column.tipo) {\r\n\r\n @case ('input-radio') {\r\n <td scope=\"col\" class=\"text-center b-table\">\r\n <input type=\"radio\" class=\"form-check-input fs-8 border border-secondary m-0 p-0\"\r\n [disabled]=\"lastItemDisabled() && validaLastRegistro(iRow)\" [checked]=\"selectedRadio() === iRow\"\r\n (change)=\"clickRadio(iRow)\">\r\n </td>\r\n }\r\n\r\n @case ('fecha') {\r\n <td class=\"b-table\" [title]=\"row[column.fieldname] | date:'dd/MM/yyyy'\"\r\n [ngClass]=\"row.situac == 'J' ? 'text-error':''\">\r\n {{ row[column.fieldname] | date:'dd/MM/yyyy' }}\r\n </td>\r\n }\r\n\r\n @case ('decimal') {\r\n <td class=\"text-end b-table\" [title]=\"limpiarNumero(row[column.fieldname]) | number:'1.2-2'\"\r\n [ngClass]=\"row.situac == 'J' ? 'text-error':''\">\r\n {{limpiarNumero(row[column.fieldname]) | number:'1.2-2'}}\r\n </td>\r\n }\r\n\r\n @case ('list-select') {\r\n <td class=\"text-center b-table\" [title]=\"row[column.fieldname]\">\r\n <div ngbDropdown class=\"d-inline-block\" container=\"body\">\r\n <div class=\"h-100 bg-sidebar d-flex align-items-center px-1\">\r\n <button [disabled]=\"!isLast\" class=\"border-0 bg-none\"\r\n [ngClass]=\"!isLast ? 'text-muted' : 'text-input'\" ngbDropdownToggle>\r\n {{row[column.fieldname]}}\r\n </button>\r\n </div>\r\n <div ngbDropdownMenu class=\"my-0 py-0\">\r\n @for (item of column.lista; track $index; let last = $last) {\r\n <app-button [texto]=\"item.text\"\r\n [extraClass]=\"($index == 0 ? 'border-top-radius ' : '') + (last ? 'border-bottom-radius' : '')\"\r\n [dropdownButton]=\"true\" (accion)=\"item?.action(row,item.codigo)\" />\r\n }\r\n </div>\r\n </div>\r\n <!-- <app-dropdown-menu [options]=\"column.lista\" [disabled]=\"lastItemDisabled() ? false : !validaLastRegistro($index)\" [buttonProperties]=\"{color:'none',texto:row[column.fieldname]}\"/> -->\r\n </td>\r\n\r\n }\r\n\r\n @case ('input') {\r\n <td class=\"b-table\" [title]=\"row[column.fieldname]\" [ngClass]=\"row.situac == 'J' ? 'text-error':''\">\r\n <input type=\"text\" class=\"form-control\" [(ngModel)]=\"row[column.fieldname]\"\r\n (focus)=\"focusData(row[column.fieldname])\"\r\n (blur)=\"!validarData(row[column.fieldname]) ? null : column?.blur(row)\"\r\n (keyup.enter)=\"!validarData(row[column.fieldname]) ? null : column?.enter(row)\"\r\n [disabled]=\"column.disabled ? (typeof column.disabled === 'function' ? column.disabled(row) : column.disabled) : false\">\r\n </td>\r\n }\r\n\r\n @case ('input-date') {\r\n <td class=\"b-table\" [title]=\"row[column.fieldname]\" [ngClass]=\"row.situac == 'J' ? 'text-error':''\">\r\n <input type=\"date\" class=\"form-control\" [(ngModel)]=\"row[column.fieldname]\"\r\n (blur)=\"column?.blur(row)\" (keyup.enter)=\"column?.enter(row)\"\r\n [disabled]=\"column.disabled ? (typeof column.disabled === 'function' ? column.disabled(row) : column.disabled) : false\">\r\n </td>\r\n }\r\n\r\n @case ('input-etiqueta') {\r\n <td class=\"b-table\" [title]=\"row[column.fieldname]\" [ngClass]=\"row.situac == 'J' ? 'text-error':''\">\r\n <!-- <app-doble-input-buscar [oneinput]=\"true\" type=\"etiqueta\" [withDetails]=\"true\"\r\n [(valuedes)]=\"row[column.fieldname]\" [(disabled)]=\"row.disabledEtiqueta\"\r\n [auxiliarData]=\"{tipinv:row.tipinv,codart:row.codart,codtit:row.codtit,codalm:row.codalm}\"\r\n (emitirAdicionalData)=\"manejarDataEtiqueta($event,row)\"\r\n (disabledChange)=\"limpiarEtiqueta($event,row)\" [withBuscar2]=\"true\"\r\n [allDisabled]=\"row.disabledAll ?? false\" /> -->\r\n </td>\r\n }\r\n\r\n @case ('input-afecta') {\r\n <td class=\"b-table\" [title]=\"row[column.fieldname]\" [ngClass]=\"row.situac == 'J' ? 'text-error':''\">\r\n <!-- <app-doble-input-buscar [oneinput]=\"true\" type=\"tafecta\" [(valuecod)]=\"row[column.fieldname]\"\r\n [(disabled)]=\"row.disabledEtiqueta\" [(valuedes)]=\"row.dtipafec\" viewInput=\"cod\"\r\n [withBuscar]=\"true\" [allDisabled]=\"row.disabledAll ?? false\" /> -->\r\n </td>\r\n }\r\n\r\n @case ('input-number') {\r\n <td class=\"b-table\" [title]=\"row[column.fieldname]\" [ngClass]=\"row.situac == 'J' ? 'text-error':''\">\r\n <input type=\"text\" class=\"form-control text-end\"\r\n [ngClass]=\"(!column.valida ? '' : (row[column.fieldname] ?? 0) <= 0 ? 'input-error' : '')\"\r\n [(ngModel)]=\"row[column.fieldname]\" (blur)=\"validarFunction(column.blur)?.(row)\"\r\n [disabled]=\"row.disabledAll ?? false\" onlyNumber>\r\n </td>\r\n }\r\n\r\n @case ('input-decimal') {\r\n <td class=\"b-table\" [title]=\"row[column.fieldname]\" [ngClass]=\"row.situac == 'J' ? 'text-error':''\">\r\n <input type=\"text\" class=\"form-control text-end w-100\"\r\n [ngClass]=\"(!column.valida ? '' : (row[column.fieldname] ?? 0) <= 0 ? 'input-error' : '')\"\r\n [(ngModel)]=\"row[column.fieldname]\" (blur)=\"validarFunction(column.blur)?.(row)\"\r\n [appDecimal]=\"column.pipe\" [readonly]=\"column.readonly ? column.readonly(row) : false\"\r\n [disabled]=\"row.disabledAll ?? generateKeyDisabled(row,column)\" onlyNumber>\r\n </td>\r\n }\r\n\r\n @case ('input-select') {\r\n <td class=\"b-table\" [title]=\"row[column.fieldname]\" [ngClass]=\"row.situac == 'J' ? 'text-error':''\">\r\n <select class=\"form-select\" name=\"{{`cbo_lista_${row[column.fieldname]}`}}\"\r\n id=\"{{`cbo_lista_${row[column.fieldname]}`}}\" [(ngModel)]=\"row[column.fieldname]\"\r\n (change)=\"validarFunction(column.change)?.(row)\"\r\n [disabled]=\"column.disabled ? (typeof column.disabled === 'function' ? column.disabled(row) : column.disabled) : false\">\r\n @for (item of column.lista; track $index) {\r\n <option [value]=\"item[column.keyCodigo]\"> {{ item[column.keyDescri]}} </option>\r\n }\r\n </select>\r\n </td>\r\n }\r\n\r\n @case ('stock') {\r\n <td class=\"b-table text-center\" [title]=\"row[column.fieldname] ? row[column.fieldname] : 'Sin Stock'\">\r\n @if (limpiarNumero(row[column.fieldname]) > 0) {\r\n {{row[column.fieldname]}}\r\n }@else {\r\n <i class=\"fas fa-times text-danger fw-bold fs-4\"></i>\r\n }\r\n </td>\r\n }\r\n\r\n @default {\r\n <td class=\"b-table\" [title]=\"row[column.fieldname]\" [ngClass]=\"row.situac == 'J' ? 'text-error':''\">\r\n <span [ngClass]=\"isLast ? 'cursor-pointer' : ''\"\r\n (click)=\"isLast ? column?.clic() : null\">{{row[column.fieldname]}}</span>\r\n </td>\r\n }\r\n }\r\n }\r\n }\r\n </tr>\r\n }\r\n </tbody>\r\n </table>\r\n</div>", styles: ["thead{position:sticky;top:0;z-index:1}.table-container{width:100%;max-width:100%;overflow-x:auto;display:block;white-space:nowrap}.table-blank{--bs-table-bg-state: white !important}.header-normal{background:#cecece!important}.normal-table thead tr th{font-size:11px;text-align:start;font-weight:700;max-width:220px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.normal-table tbody tr{height:30px}.normal-table tbody tr td{font-size:11px;vertical-align:middle;font-weight:500;white-space:nowrap;text-overflow:ellipsis;padding-top:0;padding-bottom:0}.normal-table thead{position:sticky;top:0;z-index:1}@media (max-width: 1600px){.normal-table tbody tr td{font-size:9px}.normal-table thead tr th{font-size:10px}}.input-error{border:1px solid rgb(203,0,0);color:#cb0000!important;position:relative;z-index:1}@keyframes aura-pulse{0%{box-shadow:0 0 #cb0000b3}70%{box-shadow:0 0 0 5px #cb000000}to{box-shadow:0 0 #cb000000}}.w-min{max-width:40px!important;width:40px!important;min-width:40px!important}.bg-red{background-color:red}.bg-red i,.bg-red span,.bg-red button,.bg-red td,.bg-red input,.bg-red select,.bg-red-input{color:red!important}.bg-blue{background-color:#00f}.bg-blue i,.bg-blue span,.bg-blue button,.bg-blue td,.bg-blue input,.bg-blue select,.bg-blue-input{color:#00f!important}.bg-yellow{background-color:#ff0}.bg-green{background-color:#adff2f}.bg-initial{background-color:initial}\n"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$2.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$2.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$2.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i1$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: i1.DecimalPipe, name: "number" }, { kind: "pipe", type: i1.DatePipe, name: "date" }, { kind: "directive", type: DecimalDirective, selector: "[appDecimal]", inputs: ["appDecimal"] }, { kind: "directive", type: OnlyNumberDirective, selector: "[onlyNumber]" }, { kind: "ngmodule", type: NgbDropdownModule }, { kind: "directive", type: i1$1.NgbDropdown, selector: "[ngbDropdown]", inputs: ["autoClose", "dropdownClass", "open", "placement", "popperOptions", "container", "display"], outputs: ["openChange"], exportAs: ["ngbDropdown"] }, { kind: "directive", type: i1$1.NgbDropdownToggle, selector: "[ngbDropdownToggle]" }, { kind: "directive", type: i1$1.NgbDropdownMenu, selector: "[ngbDropdownMenu]" }, { kind: "component", type: ButtonComponent, selector: "app-button", inputs: ["autoFocus", "color", "outline", "icon", "tooltip", "texto", "isHtml", "closeButton", "sunatButton", "inputButton", "buttonDeshabilitado", "atajo", "dropdownButton", "extraClass", "disabled", "uploadButton", "accept", "isRounded", "isNotStyle", "isFullWidth", "paddingX", "paddingY", "minWidth"], outputs: ["accion", "fileSelected"] }] });
|
|
3415
3423
|
}
|
|
3416
3424
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TableDetalleComponent, decorators: [{
|
|
3417
3425
|
type: Component,
|
|
@@ -4426,7 +4434,7 @@ class MdGenericoComponent {
|
|
|
4426
4434
|
this.modalService.dismiss();
|
|
4427
4435
|
}
|
|
4428
4436
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: MdGenericoComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
4429
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.15", type: MdGenericoComponent, isStandalone: true, selector: "app-md-generico", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, scrollable: { classPropertyName: "scrollable", publicName: "scrollable", isSignal: true, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, showAlerta: { classPropertyName: "showAlerta", publicName: "showAlerta", isSignal: true, isRequired: false, transformFunction: null }, textAlerta: { classPropertyName: "textAlerta", publicName: "textAlerta", isSignal: true, isRequired: false, transformFunction: null }, sizeTitle: { classPropertyName: "sizeTitle", publicName: "sizeTitle", isSignal: true, isRequired: false, transformFunction: null }, showFiltro: { classPropertyName: "showFiltro", publicName: "showFiltro", isSignal: true, isRequired: false, transformFunction: null }, withFiltro: { classPropertyName: "withFiltro", publicName: "withFiltro", isSignal: true, isRequired: false, transformFunction: null }, dataFiltro: { classPropertyName: "dataFiltro", publicName: "dataFiltro", isSignal: true, isRequired: false, transformFunction: null }, isModal: { classPropertyName: "isModal", publicName: "isModal", isSignal: true, isRequired: false, transformFunction: null }, acceptDisabled: { classPropertyName: "acceptDisabled", publicName: "acceptDisabled", isSignal: true, isRequired: false, transformFunction: null }, validaCierre: { classPropertyName: "validaCierre", publicName: "validaCierre", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { continuar: "continuar", continuar2: "continuar2", cerrar: "cerrar", withFiltro: "withFiltroChange", emitirFiltro: "emitirFiltro" }, queries: [{ propertyName: "content", first: true, predicate: ["body"], descendants: true, isSignal: true }, { propertyName: "footer", first: true, predicate: ["footer"], descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"md-inner\">\r\n <div class=\"modal-header py-2\">\r\n <div class=\"w-100\">\r\n <app-header [isModal]=\"isModal()\" (cerrarModal)=\"cerrarModal()\" [tamanio]=\"sizeTitle()\"\r\n [showAlerta]=\"showAlerta()\" [textAlerta]=\"textAlerta()\" [title]=\"title()\" [showFiltro]=\"showFiltro()\"\r\n [hasData]=\"dataFiltro()\" [(withFiltro)]=\"withFiltro\" />\r\n </div>\r\n </div>\r\n\r\n <div class=\"modal-body\" [ngClass]=\"{ 'max-height': scrollable() }\">\r\n <ng-container *ngTemplateOutlet=\"content();\"></ng-container>\r\n </div>\r\n\r\n @if( showFooter()){\r\n <div class=\"modal-footer\">\r\n @if (footer()) {\r\n <ng-container *ngTemplateOutlet=\"footer();\"></ng-container>\r\n }\r\n @if (type() == '1') {\r\n <app-button icon=\"adelante\" texto=\"Continuar\" color=\"verde\" (accion)=\"continuar.emit()\"\r\n [disabled]=\"acceptDisabled()\" />\r\n }\r\n @if (type() == '2') {\r\n <app-button icon=\"guardar\" texto=\"Guardar\" color=\"azul\" (accion)=\"continuar.emit()\"\r\n [disabled]=\"acceptDisabled()\" />\r\n }\r\n @if (type() == '3') {\r\n <app-button icon=\"imprimir\" texto=\"Imprimir\" color=\"gris\" (accion)=\"continuar.emit()\"\r\n [disabled]=\"acceptDisabled()\" />\r\n }\r\n @if( type() == '4'){\r\n <app-button icon=\"agregar\" texto=\"Adicionar\" color=\"verde\" (accion)=\"continuar.emit()\"\r\n [disabled]=\"acceptDisabled()\" />\r\n }\r\n @if( type() == '6'){\r\n <app-button icon=\"check\" texto=\"Actualizar\" color=\"azul\" (accion)=\"continuar.emit()\"\r\n [disabled]=\"acceptDisabled()\" />\r\n }\r\n @if( type() != '5'){\r\n <app-button icon=\"cancelar\" texto=\"Cancelar\" color=\"amarillo\" (accion)=\"cerrarModal()\" />\r\n }\r\n </div>\r\n }\r\n\r\n @if( type() == 'APROB'){\r\n <div class=\"modal-footer d-flex justify-content-center\">\r\n <app-button icon=\"aprobar\" texto=\"Aprobar\" color=\"verde\" (accion)=\"continuar.emit()\" />\r\n <app-button icon=\"desaprobar\" texto=\"Desaprobar\" color=\"rojo\" (accion)=\"continuar2.emit()\" />\r\n </div>\r\n }\r\n</div>", styles: [".md-inner{display:grid;grid-template-rows:auto 1fr auto;height:fit-content;max-height:calc(100dvh - var(--bs-modal-margin) * 2 - 2px);overflow:hidden}.max-height{overflow-y:auto;min-height:0}.modal-body{overflow-x:auto!important}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: HeaderComponent, selector: "app-header", inputs: ["title", "tamanio", "showFiltro", "withFiltro", "hasData", "isModal", "showAlerta", "textAlerta", "validateSalto"], outputs: ["withFiltroChange", "cerrarModal"] }, { kind: "component", type: ButtonComponent, selector: "app-button", inputs: ["autoFocus", "color", "outline", "icon", "tooltip", "texto", "isHtml", "closeButton", "sunatButton", "inputButton", "buttonDeshabilitado", "atajo", "dropdownButton", "extraClass", "disabled", "uploadButton", "accept", "isRounded", "isNotStyle", "isFullWidth", "paddingX", "paddingY"], outputs: ["accion", "fileSelected"] }] });
|
|
4437
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.15", type: MdGenericoComponent, isStandalone: true, selector: "app-md-generico", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, scrollable: { classPropertyName: "scrollable", publicName: "scrollable", isSignal: true, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, showAlerta: { classPropertyName: "showAlerta", publicName: "showAlerta", isSignal: true, isRequired: false, transformFunction: null }, textAlerta: { classPropertyName: "textAlerta", publicName: "textAlerta", isSignal: true, isRequired: false, transformFunction: null }, sizeTitle: { classPropertyName: "sizeTitle", publicName: "sizeTitle", isSignal: true, isRequired: false, transformFunction: null }, showFiltro: { classPropertyName: "showFiltro", publicName: "showFiltro", isSignal: true, isRequired: false, transformFunction: null }, withFiltro: { classPropertyName: "withFiltro", publicName: "withFiltro", isSignal: true, isRequired: false, transformFunction: null }, dataFiltro: { classPropertyName: "dataFiltro", publicName: "dataFiltro", isSignal: true, isRequired: false, transformFunction: null }, isModal: { classPropertyName: "isModal", publicName: "isModal", isSignal: true, isRequired: false, transformFunction: null }, acceptDisabled: { classPropertyName: "acceptDisabled", publicName: "acceptDisabled", isSignal: true, isRequired: false, transformFunction: null }, validaCierre: { classPropertyName: "validaCierre", publicName: "validaCierre", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { continuar: "continuar", continuar2: "continuar2", cerrar: "cerrar", withFiltro: "withFiltroChange", emitirFiltro: "emitirFiltro" }, queries: [{ propertyName: "content", first: true, predicate: ["body"], descendants: true, isSignal: true }, { propertyName: "footer", first: true, predicate: ["footer"], descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"md-inner\">\r\n <div class=\"modal-header py-2\">\r\n <div class=\"w-100\">\r\n <app-header [isModal]=\"isModal()\" (cerrarModal)=\"cerrarModal()\" [tamanio]=\"sizeTitle()\"\r\n [showAlerta]=\"showAlerta()\" [textAlerta]=\"textAlerta()\" [title]=\"title()\" [showFiltro]=\"showFiltro()\"\r\n [hasData]=\"dataFiltro()\" [(withFiltro)]=\"withFiltro\" />\r\n </div>\r\n </div>\r\n\r\n <div class=\"modal-body\" [ngClass]=\"{ 'max-height': scrollable() }\">\r\n <ng-container *ngTemplateOutlet=\"content();\"></ng-container>\r\n </div>\r\n\r\n @if( showFooter()){\r\n <div class=\"modal-footer\">\r\n @if (footer()) {\r\n <ng-container *ngTemplateOutlet=\"footer();\"></ng-container>\r\n }\r\n @if (type() == '1') {\r\n <app-button icon=\"adelante\" texto=\"Continuar\" color=\"verde\" (accion)=\"continuar.emit()\"\r\n [disabled]=\"acceptDisabled()\" />\r\n }\r\n @if (type() == '2') {\r\n <app-button icon=\"guardar\" texto=\"Guardar\" color=\"azul\" (accion)=\"continuar.emit()\"\r\n [disabled]=\"acceptDisabled()\" />\r\n }\r\n @if (type() == '3') {\r\n <app-button icon=\"imprimir\" texto=\"Imprimir\" color=\"gris\" (accion)=\"continuar.emit()\"\r\n [disabled]=\"acceptDisabled()\" />\r\n }\r\n @if( type() == '4'){\r\n <app-button icon=\"agregar\" texto=\"Adicionar\" color=\"verde\" (accion)=\"continuar.emit()\"\r\n [disabled]=\"acceptDisabled()\" />\r\n }\r\n @if( type() == '6'){\r\n <app-button icon=\"check\" texto=\"Actualizar\" color=\"azul\" (accion)=\"continuar.emit()\"\r\n [disabled]=\"acceptDisabled()\" />\r\n }\r\n @if( type() != '5'){\r\n <app-button icon=\"cancelar\" texto=\"Cancelar\" color=\"amarillo\" (accion)=\"cerrarModal()\" />\r\n }\r\n </div>\r\n }\r\n\r\n @if( type() == 'APROB'){\r\n <div class=\"modal-footer d-flex justify-content-center\">\r\n <app-button icon=\"aprobar\" texto=\"Aprobar\" color=\"verde\" (accion)=\"continuar.emit()\" />\r\n <app-button icon=\"desaprobar\" texto=\"Desaprobar\" color=\"rojo\" (accion)=\"continuar2.emit()\" />\r\n </div>\r\n }\r\n</div>", styles: [".md-inner{display:grid;grid-template-rows:auto 1fr auto;height:fit-content;max-height:calc(100dvh - var(--bs-modal-margin) * 2 - 2px);overflow:hidden}.max-height{overflow-y:auto;min-height:0}.modal-body{overflow-x:auto!important}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: HeaderComponent, selector: "app-header", inputs: ["title", "tamanio", "showFiltro", "withFiltro", "hasData", "isModal", "showAlerta", "textAlerta", "validateSalto"], outputs: ["withFiltroChange", "cerrarModal"] }, { kind: "component", type: ButtonComponent, selector: "app-button", inputs: ["autoFocus", "color", "outline", "icon", "tooltip", "texto", "isHtml", "closeButton", "sunatButton", "inputButton", "buttonDeshabilitado", "atajo", "dropdownButton", "extraClass", "disabled", "uploadButton", "accept", "isRounded", "isNotStyle", "isFullWidth", "paddingX", "paddingY", "minWidth"], outputs: ["accion", "fileSelected"] }] });
|
|
4430
4438
|
}
|
|
4431
4439
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: MdGenericoComponent, decorators: [{
|
|
4432
4440
|
type: Component,
|