brainloper-ui 20.0.7 → 20.0.8

package/fesm2022/brainloper-ui.mjs

@@ -1882,7 +1882,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImpo
 
 class ScreenSizeUtil {
     static isMobile() {
-        return screen.width <= 600;
+        const widthCheck = screen.width <= 600;
+        const userAgent = navigator.userAgent || navigator.vendor || window.opera;
+        const mobileRegex = /android|webos|iphone|ipad|ipod|blackberry|iemobile|opera mini/i;
+        const userAgentCheck = mobileRegex.test(userAgent);
+        return widthCheck || userAgentCheck;
     }
 }
 
@@ -2442,6 +2446,7 @@ class DataTableComponent {
         this.functionEter = functionEter;
         this.paginatorTranslate = paginatorTranslate;
         this.exportService = exportService;
+        this.movil = ScreenSizeUtil.isMobile();
         this.paginatorTranslate.itemsPerPageLabel = 'Elementos por página';
         this.paginatorTranslate.nextPageLabel = 'Siguiente página';
         this.paginatorTranslate.lastPageLabel = 'Última página';
@@ -2968,11 +2973,11 @@ class DataTableComponent {
         this.applyFilters();
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: DataTableComponent, deps: [{ token: i1.MatDialog }, { token: HttpService }, { token: MessageService }, { token: FunctionsService }, { token: i5$2.MatPaginatorIntl }, { token: ExportDataService }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.15", type: DataTableComponent, isStandalone: false, selector: "data-table", inputs: { title: "title", titleExcelFile: "titleExcelFile", columns: "columns", data: "data", combo: "combo", configuration: "configuration", reloadTable: "reloadTable", url: "url", params: "params", titleLoading: "titleLoading", messageLoading: "messageLoading", headerFileXlsm: "headerFileXlsm", headerFilters: "headerFilters", xslxTitleFields: "xslxTitleFields", xslxSheetNameFields: "xslxSheetNameFields", xslxBodyFields: "xslxBodyFields", xslxParams: "xslxParams", roleId: "roleId", moduleId: "moduleId", subModuleId: "subModuleId" }, outputs: { clickRow: "clickRow", add: "add", edit: "edit", delete: "delete", print: "print", exportXslxByRow: "exportXslxByRow", active: "active", selected: "selected", view: "view", closeOrder: "closeOrder", packOff: "packOff", advance: "advance", income: "income", exit: "exit", internalData: "internalData", sendEmail: "sendEmail", addComment: "addComment", fileIconClick: "fileIconClick" }, viewQueries: [{ propertyName: "paginator", first: true, predicate: MatPaginator, descendants: true, static: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"contenedor-tabla\">\n  @if (!configuration.hideTitle) {\n    <div class=\"table-title-mobile\">\n      <strong>{{ title }}</strong>\n    </div>\n  }\n\n  <app-filters [headerFilters]=\"headerFilters\" (applyFilters)=\"applyFilters($event)\">\n  </app-filters>\n\n  <div class=\"row mb-2\" style=\"width: 99%\">\n    @if (!configuration.hideFilter) {\n      <div class=\"col-12 d-flex justify-content-center\">\n        <mat-form-field class=\"filter\">\n          <mat-label>Filtrar</mat-label>\n          <input type=\"text\" [(ngModel)]=\"filters\" (keyup)=\"changeFilters()\" matInput placeholder=\"Filtrar\" />\n        </mat-form-field>\n      </div>\n    }\n  </div>\n\n  <div class=\"col-12 d-flex flex-row justify-content-between align-items-center p-2\">\n    <div class=\"d-none d-md-block me-md-3 w-100\" style=\"font-size: 1rem\">\n      @if (selectedRows.length > 0 && configuration.selectable) {\n        <span class=\"fw-bold\">\n          {{ selectedRows.length }}\n          {{ selectedRows.length === 1 ? 'Seleccionado' : 'Seleccionados' }}\n        </span>\n      }\n    </div>\n    <div class=\"d-flex justify-content-end w-100\">\n      <ng-container *ngTemplateOutlet=\"buttonsTable\"></ng-container>\n    </div>\n  </div>\n\n  <table class=\"table_Eter table-hover\">\n    <thead class=\"dark\">\n      <tr>\n        @if (configuration.selectable) {\n          <th style=\"justify-content: center\">\n            <mat-checkbox color=\"primary\" (change)=\"seletecAllEvent($event)\" [(ngModel)]=\"selectAll\"\n              [indeterminate]=\"indeterminateState\">\n            </mat-checkbox>\n          </th>\n        }\n        @for (column of columns; track column) {\n          <th [class]=\"column.style?.movil\" scope=\"col\" [ngStyle]=\"column.style\">\n            {{ column.label }}\n          </th>\n        }\n        @if (shouldShowMenu()) {\n          <th></th>\n        }\n      </tr>\n    </thead>\n    <tbody class=\"mat-elevation-z3\">\n      @for (row of data; track row) {\n        <tr style=\"cursor: pointer\" (click)=\"clickOnRoW(row)\"\n          [class]=\"checkboxs[row[configuration.primaryKey]] ? 'selected-row' : ''\">\n          @if (configuration.selectable) {\n            <th style=\"justify-content: center\">\n              <mat-checkbox color=\"primary\" [(ngModel)]=\"checkboxs[row[configuration.primaryKey]]\" (click)=\"clicked($event)\"\n                (change)=\"selection(row, $event)\">\n              </mat-checkbox>\n            </th>\n          }\n          @for (column of columns; track column) {\n            <th [class]=\"column.style?.movil\" [ngStyle]=\"column.style\" scope=\"row\">\n              @if (\n                column.type === 'file' ||\n                (column.rules && evaluateRules(row[column.ID], column.rules))) {\n                <div (click)=\"onFileIconClick($event, row[column.ID])\">\n                  <i class=\"fa fa-file\" style=\"cursor: pointer\"></i>\n                </div>\n              } @else {\n                {{ row[column.ID] }}\n              }\n            </th>\n          }\n          @if (shouldShowMenu()) {\n            <th class=\"d-flex justify-content-center align-items-center\"\n              style=\"overflow: visible;\">\n              <mat-icon (click)=\"showMenu($event)\" [matMenuTriggerFor]=\"menu\" matRipple class=\"menu_more_vert\"\n              aria-hidden=\"false\" aria-label=\"Example delete icon\">more_vert</mat-icon>\n              <mat-menu #menu=\"matMenu\">\n                @for (btn of buttonsConfig; track btn) {\n                  <div>\n                    @if (btn.condition()) {\n                      <button (click)=\"action(btn.action, row)\" mat-menu-item\n                        class=\"d-flex align-items-center w-100\">\n                        <i class=\"fa {{ btn.icon }} btn-accion\" style=\"font-size: 120%; margin-right: 10px\"></i>\n                        {{ btn.tooltip }}\n                      </button>\n                    }\n                  </div>\n                }\n              </mat-menu>\n            </th>\n          }\n        </tr>\n      }\n    </tbody>\n  </table>\n\n  @if (length == 0 && data.length == 0) {\n    <div style=\"margin-left: 10px\">\n      <strong>No se encontr\u00F3 informaci\u00F3n</strong>\n    </div>\n  }\n\n  @if (paginatorActive) {\n    <mat-paginator [length]=\"length\" [pageSize]=\"pageSize\" [pageSizeOptions]=\"pageSizeOptions\"\n    showFirstLastButtons (page)=\"changePage($event)\"></mat-paginator>\n  }\n</div>\n\n<ng-template #buttonsTable let-fontSize=\"fontSize\" let-marginRight=\"marginRight\" class=\"button-table\">\n  @for (btn of buttonsConfig; track btn) {\n    @if (btn.conditionShowHeader()) {\n      <div (click)=\"action(btn.action)\" matTooltip=\"{{ btn.tooltip }}\"\n        matTooltipPosition=\"above\">\n      <i class=\"fa {{ btn.icon }} btn-accion\" [ngStyle]=\"{\n          'font-size': fontSize ? fontSize : '170%',\n          'margin-right': marginRight ? marginRight : '15px'\n        }\"></i>\n      </div>\n    }\n  }\n</ng-template>", styles: [".contenedor-tabla{width:100%;overflow-x:auto}.table_Eter{width:100%;margin-bottom:4px;color:primary;border-collapse:collapse}.table_Eter .dark th{color:#fff;background-color:#343a40;border-color:#454d55;text-align:center;vertical-align:middle}.table_Eter thead th{vertical-align:bottom;border-bottom:2px solid #dee2e6}.table_Eter th,.table_Eter td{padding:.75rem;vertical-align:top;border-top:1px solid #dee2e6}th{text-align:inherit}*,*:before,*:after{box-sizing:border-box}.btn-accion{cursor:pointer}mat-form-field{padding:0!important;width:90%}.table-title-mobile{display:block;margin-bottom:10px;font-size:1.2rem;text-align:center}.filter{padding:0;margin-bottom:10px}.selected-row{color:#212529;background-color:#00000013}.button-table{flex:.5;display:flex;flex-direction:row;justify-content:flex-end}button:focus{outline:none!important}@media only screen and (max-width: 600px){.no-movil{display:none}::ng-deep .mat-mdc-paginator-range-label{margin:0!important}}::ng-deep .mat-mdc-paginator{background:transparent!important}\n"], dependencies: [{ kind: "directive", type: i7.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i7.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i1$4.MatRipple, selector: "[mat-ripple], [matRipple]", inputs: ["matRippleColor", "matRippleUnbounded", "matRippleCentered", "matRippleRadius", "matRippleAnimation", "matRippleDisabled", "matRippleTrigger"], exportAs: ["matRipple"] }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i10.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i10.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i10.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "component", type: i4$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4$1.MatLabel, selector: "mat-label" }, { kind: "directive", type: i5.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "component", type: i13.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "aria-expanded", "aria-controls", "aria-owns", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "disabledInteractive", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "directive", type: i5$1.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "component", type: i5$2.MatPaginator, selector: "mat-paginator", inputs: ["color", "pageIndex", "length", "pageSize", "pageSizeOptions", "hidePageSize", "showFirstLastButtons", "selectConfig", "disabled"], outputs: ["page"], exportAs: ["matPaginator"] }, { 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.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: "component", type: FiltersComponent, selector: "app-filters", inputs: ["headerFilters"], outputs: ["applyFilters"] }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.15", type: DataTableComponent, isStandalone: false, selector: "data-table", inputs: { title: "title", titleExcelFile: "titleExcelFile", columns: "columns", data: "data", combo: "combo", configuration: "configuration", reloadTable: "reloadTable", url: "url", params: "params", titleLoading: "titleLoading", messageLoading: "messageLoading", headerFileXlsm: "headerFileXlsm", headerFilters: "headerFilters", xslxTitleFields: "xslxTitleFields", xslxSheetNameFields: "xslxSheetNameFields", xslxBodyFields: "xslxBodyFields", xslxParams: "xslxParams", roleId: "roleId", moduleId: "moduleId", subModuleId: "subModuleId" }, outputs: { clickRow: "clickRow", add: "add", edit: "edit", delete: "delete", print: "print", exportXslxByRow: "exportXslxByRow", active: "active", selected: "selected", view: "view", closeOrder: "closeOrder", packOff: "packOff", advance: "advance", income: "income", exit: "exit", internalData: "internalData", sendEmail: "sendEmail", addComment: "addComment", fileIconClick: "fileIconClick" }, viewQueries: [{ propertyName: "paginator", first: true, predicate: MatPaginator, descendants: true, static: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"contenedor-tabla\">\n  @if (!configuration.hideTitle) {\n    <div class=\"table-title-mobile\">\n      <strong>{{ title }}</strong>\n    </div>\n  }\n\n  <app-filters [headerFilters]=\"headerFilters\" (applyFilters)=\"applyFilters($event)\">\n  </app-filters>\n\n  <div class=\"row mb-2\" style=\"width: 99%\">\n    @if (!configuration.hideFilter) {\n      <div class=\"col-12 d-flex justify-content-center\">\n        <mat-form-field class=\"filter\">\n          <mat-label>Filtrar</mat-label>\n          <input type=\"text\" [(ngModel)]=\"filters\" (keyup)=\"changeFilters()\" matInput placeholder=\"Filtrar\" />\n        </mat-form-field>\n      </div>\n    }\n  </div>\n\n  <div class=\"col-12 d-flex flex-row justify-content-between align-items-center p-2\">\n    <div class=\"d-none d-md-block me-md-3 w-100\" style=\"font-size: 1rem\">\n      @if (selectedRows.length > 0 && configuration.selectable && !movil) {\n        <span class=\"fw-bold\">\n          {{ selectedRows.length }}\n          {{ selectedRows.length === 1 ? 'Seleccionado' : 'Seleccionados' }}\n        </span>\n      }\n    </div>\n    <div class=\"d-flex justify-content-end w-100\">\n      <ng-container *ngTemplateOutlet=\"buttonsTable\"></ng-container>\n    </div>\n  </div>\n\n  <table class=\"table_Eter table-hover\">\n    <thead class=\"dark\">\n      <tr>\n        @if (configuration.selectable) {\n          <th style=\"justify-content: center\">\n            <mat-checkbox color=\"primary\" (change)=\"seletecAllEvent($event)\" [(ngModel)]=\"selectAll\"\n              [indeterminate]=\"indeterminateState\">\n            </mat-checkbox>\n          </th>\n        }\n        @for (column of columns; track column) {\n          <th [class]=\"column.style?.movil\" scope=\"col\" [ngStyle]=\"column.style\">\n            {{ column.label }}\n          </th>\n        }\n        @if (shouldShowMenu()) {\n          <th></th>\n        }\n      </tr>\n    </thead>\n    <tbody class=\"mat-elevation-z3\">\n      @for (row of data; track row) {\n        <tr style=\"cursor: pointer\" (click)=\"clickOnRoW(row)\"\n          [class]=\"checkboxs[row[configuration.primaryKey]] ? 'selected-row' : ''\">\n          @if (configuration.selectable) {\n            <th style=\"justify-content: center\">\n              <mat-checkbox color=\"primary\" [(ngModel)]=\"checkboxs[row[configuration.primaryKey]]\" (click)=\"clicked($event)\"\n                (change)=\"selection(row, $event)\">\n              </mat-checkbox>\n            </th>\n          }\n          @for (column of columns; track column) {\n            <th [class]=\"column.style?.movil\" [ngStyle]=\"column.style\" scope=\"row\">\n              @if (\n                column.type === 'file' ||\n                (column.rules && evaluateRules(row[column.ID], column.rules))) {\n                <div (click)=\"onFileIconClick($event, row[column.ID])\">\n                  <i class=\"fa fa-file\" style=\"cursor: pointer\"></i>\n                </div>\n              } @else {\n                {{ row[column.ID] }}\n              }\n            </th>\n          }\n          @if (shouldShowMenu()) {\n            <th class=\"d-flex justify-content-center align-items-center\"\n              style=\"overflow: visible;\">\n              <mat-icon (click)=\"showMenu($event)\" [matMenuTriggerFor]=\"menu\" matRipple class=\"menu_more_vert\"\n              aria-hidden=\"false\" aria-label=\"Example delete icon\">more_vert</mat-icon>\n              <mat-menu #menu=\"matMenu\">\n                @for (btn of buttonsConfig; track btn) {\n                  <div>\n                    @if (btn.condition()) {\n                      <button (click)=\"action(btn.action, row)\" mat-menu-item\n                        class=\"d-flex align-items-center w-100\">\n                        <i class=\"fa {{ btn.icon }} btn-accion\" style=\"font-size: 120%; margin-right: 10px\"></i>\n                        {{ btn.tooltip }}\n                      </button>\n                    }\n                  </div>\n                }\n              </mat-menu>\n            </th>\n          }\n        </tr>\n      }\n    </tbody>\n  </table>\n\n  @if (length == 0 && data.length == 0) {\n    <div style=\"margin-left: 10px\">\n      <strong>No se encontr\u00F3 informaci\u00F3n</strong>\n    </div>\n  }\n\n  @if (paginatorActive) {\n    <mat-paginator [length]=\"length\" [pageSize]=\"pageSize\" [pageSizeOptions]=\"pageSizeOptions\"\n    showFirstLastButtons (page)=\"changePage($event)\"></mat-paginator>\n  }\n</div>\n\n<ng-template #buttonsTable let-fontSize=\"fontSize\" let-marginRight=\"marginRight\" class=\"button-table\">\n  @for (btn of buttonsConfig; track btn) {\n    @if (btn.conditionShowHeader()) {\n      <div (click)=\"action(btn.action)\" matTooltip=\"{{ btn.tooltip }}\"\n        matTooltipPosition=\"above\">\n      <i class=\"fa {{ btn.icon }} btn-accion\" [ngStyle]=\"{\n          'font-size': fontSize ? fontSize : '170%',\n          'margin-right': marginRight ? marginRight : '15px'\n        }\"></i>\n      </div>\n    }\n  }\n</ng-template>", styles: [".contenedor-tabla{width:100%;overflow-x:auto}.table_Eter{width:100%;margin-bottom:4px;color:primary;border-collapse:collapse}.table_Eter .dark th{color:#fff;background-color:#343a40;border-color:#454d55;text-align:center;vertical-align:middle}.table_Eter thead th{vertical-align:bottom;border-bottom:2px solid #dee2e6}.table_Eter th,.table_Eter td{padding:.75rem;vertical-align:top;border-top:1px solid #dee2e6}th{text-align:inherit}*,*:before,*:after{box-sizing:border-box}.btn-accion{cursor:pointer}mat-form-field{padding:0!important;width:90%}.table-title-mobile{display:block;margin-bottom:10px;font-size:1.2rem;text-align:center}.filter{padding:0;margin-bottom:10px}.selected-row{color:#212529;background-color:#00000013}.button-table{flex:.5;display:flex;flex-direction:row;justify-content:flex-end}button:focus{outline:none!important}@media only screen and (max-width: 600px){.no-movil{display:none}::ng-deep .mat-mdc-paginator-range-label{margin:0!important}}::ng-deep .mat-mdc-paginator{background:transparent!important}\n"], dependencies: [{ kind: "directive", type: i7.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i7.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i1$4.MatRipple, selector: "[mat-ripple], [matRipple]", inputs: ["matRippleColor", "matRippleUnbounded", "matRippleCentered", "matRippleRadius", "matRippleAnimation", "matRippleDisabled", "matRippleTrigger"], exportAs: ["matRipple"] }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i10.MatMenu, selector: "mat-menu", inputs: ["backdropClass", "aria-label", "aria-labelledby", "aria-describedby", "xPosition", "yPosition", "overlapTrigger", "hasBackdrop", "class", "classList"], outputs: ["closed", "close"], exportAs: ["matMenu"] }, { kind: "component", type: i10.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i10.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "component", type: i4$1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "directive", type: i4$1.MatLabel, selector: "mat-label" }, { kind: "directive", type: i5.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "component", type: i13.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "aria-expanded", "aria-controls", "aria-owns", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "disabledInteractive", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "directive", type: i5$1.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "component", type: i5$2.MatPaginator, selector: "mat-paginator", inputs: ["color", "pageIndex", "length", "pageSize", "pageSizeOptions", "hidePageSize", "showFirstLastButtons", "selectConfig", "disabled"], outputs: ["page"], exportAs: ["matPaginator"] }, { 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.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: "component", type: FiltersComponent, selector: "app-filters", inputs: ["headerFilters"], outputs: ["applyFilters"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.15", ngImport: i0, type: DataTableComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'data-table', standalone: false, template: "<div class=\"contenedor-tabla\">\n  @if (!configuration.hideTitle) {\n    <div class=\"table-title-mobile\">\n      <strong>{{ title }}</strong>\n    </div>\n  }\n\n  <app-filters [headerFilters]=\"headerFilters\" (applyFilters)=\"applyFilters($event)\">\n  </app-filters>\n\n  <div class=\"row mb-2\" style=\"width: 99%\">\n    @if (!configuration.hideFilter) {\n      <div class=\"col-12 d-flex justify-content-center\">\n        <mat-form-field class=\"filter\">\n          <mat-label>Filtrar</mat-label>\n          <input type=\"text\" [(ngModel)]=\"filters\" (keyup)=\"changeFilters()\" matInput placeholder=\"Filtrar\" />\n        </mat-form-field>\n      </div>\n    }\n  </div>\n\n  <div class=\"col-12 d-flex flex-row justify-content-between align-items-center p-2\">\n    <div class=\"d-none d-md-block me-md-3 w-100\" style=\"font-size: 1rem\">\n      @if (selectedRows.length > 0 && configuration.selectable) {\n        <span class=\"fw-bold\">\n          {{ selectedRows.length }}\n          {{ selectedRows.length === 1 ? 'Seleccionado' : 'Seleccionados' }}\n        </span>\n      }\n    </div>\n    <div class=\"d-flex justify-content-end w-100\">\n      <ng-container *ngTemplateOutlet=\"buttonsTable\"></ng-container>\n    </div>\n  </div>\n\n  <table class=\"table_Eter table-hover\">\n    <thead class=\"dark\">\n      <tr>\n        @if (configuration.selectable) {\n          <th style=\"justify-content: center\">\n            <mat-checkbox color=\"primary\" (change)=\"seletecAllEvent($event)\" [(ngModel)]=\"selectAll\"\n              [indeterminate]=\"indeterminateState\">\n            </mat-checkbox>\n          </th>\n        }\n        @for (column of columns; track column) {\n          <th [class]=\"column.style?.movil\" scope=\"col\" [ngStyle]=\"column.style\">\n            {{ column.label }}\n          </th>\n        }\n        @if (shouldShowMenu()) {\n          <th></th>\n        }\n      </tr>\n    </thead>\n    <tbody class=\"mat-elevation-z3\">\n      @for (row of data; track row) {\n        <tr style=\"cursor: pointer\" (click)=\"clickOnRoW(row)\"\n          [class]=\"checkboxs[row[configuration.primaryKey]] ? 'selected-row' : ''\">\n          @if (configuration.selectable) {\n            <th style=\"justify-content: center\">\n              <mat-checkbox color=\"primary\" [(ngModel)]=\"checkboxs[row[configuration.primaryKey]]\" (click)=\"clicked($event)\"\n                (change)=\"selection(row, $event)\">\n              </mat-checkbox>\n            </th>\n          }\n          @for (column of columns; track column) {\n            <th [class]=\"column.style?.movil\" [ngStyle]=\"column.style\" scope=\"row\">\n              @if (\n                column.type === 'file' ||\n                (column.rules && evaluateRules(row[column.ID], column.rules))) {\n                <div (click)=\"onFileIconClick($event, row[column.ID])\">\n                  <i class=\"fa fa-file\" style=\"cursor: pointer\"></i>\n                </div>\n              } @else {\n                {{ row[column.ID] }}\n              }\n            </th>\n          }\n          @if (shouldShowMenu()) {\n            <th class=\"d-flex justify-content-center align-items-center\"\n              style=\"overflow: visible;\">\n              <mat-icon (click)=\"showMenu($event)\" [matMenuTriggerFor]=\"menu\" matRipple class=\"menu_more_vert\"\n              aria-hidden=\"false\" aria-label=\"Example delete icon\">more_vert</mat-icon>\n              <mat-menu #menu=\"matMenu\">\n                @for (btn of buttonsConfig; track btn) {\n                  <div>\n                    @if (btn.condition()) {\n                      <button (click)=\"action(btn.action, row)\" mat-menu-item\n                        class=\"d-flex align-items-center w-100\">\n                        <i class=\"fa {{ btn.icon }} btn-accion\" style=\"font-size: 120%; margin-right: 10px\"></i>\n                        {{ btn.tooltip }}\n                      </button>\n                    }\n                  </div>\n                }\n              </mat-menu>\n            </th>\n          }\n        </tr>\n      }\n    </tbody>\n  </table>\n\n  @if (length == 0 && data.length == 0) {\n    <div style=\"margin-left: 10px\">\n      <strong>No se encontr\u00F3 informaci\u00F3n</strong>\n    </div>\n  }\n\n  @if (paginatorActive) {\n    <mat-paginator [length]=\"length\" [pageSize]=\"pageSize\" [pageSizeOptions]=\"pageSizeOptions\"\n    showFirstLastButtons (page)=\"changePage($event)\"></mat-paginator>\n  }\n</div>\n\n<ng-template #buttonsTable let-fontSize=\"fontSize\" let-marginRight=\"marginRight\" class=\"button-table\">\n  @for (btn of buttonsConfig; track btn) {\n    @if (btn.conditionShowHeader()) {\n      <div (click)=\"action(btn.action)\" matTooltip=\"{{ btn.tooltip }}\"\n        matTooltipPosition=\"above\">\n      <i class=\"fa {{ btn.icon }} btn-accion\" [ngStyle]=\"{\n          'font-size': fontSize ? fontSize : '170%',\n          'margin-right': marginRight ? marginRight : '15px'\n        }\"></i>\n      </div>\n    }\n  }\n</ng-template>", styles: [".contenedor-tabla{width:100%;overflow-x:auto}.table_Eter{width:100%;margin-bottom:4px;color:primary;border-collapse:collapse}.table_Eter .dark th{color:#fff;background-color:#343a40;border-color:#454d55;text-align:center;vertical-align:middle}.table_Eter thead th{vertical-align:bottom;border-bottom:2px solid #dee2e6}.table_Eter th,.table_Eter td{padding:.75rem;vertical-align:top;border-top:1px solid #dee2e6}th{text-align:inherit}*,*:before,*:after{box-sizing:border-box}.btn-accion{cursor:pointer}mat-form-field{padding:0!important;width:90%}.table-title-mobile{display:block;margin-bottom:10px;font-size:1.2rem;text-align:center}.filter{padding:0;margin-bottom:10px}.selected-row{color:#212529;background-color:#00000013}.button-table{flex:.5;display:flex;flex-direction:row;justify-content:flex-end}button:focus{outline:none!important}@media only screen and (max-width: 600px){.no-movil{display:none}::ng-deep .mat-mdc-paginator-range-label{margin:0!important}}::ng-deep .mat-mdc-paginator{background:transparent!important}\n"] }]
+            args: [{ selector: 'data-table', standalone: false, template: "<div class=\"contenedor-tabla\">\n  @if (!configuration.hideTitle) {\n    <div class=\"table-title-mobile\">\n      <strong>{{ title }}</strong>\n    </div>\n  }\n\n  <app-filters [headerFilters]=\"headerFilters\" (applyFilters)=\"applyFilters($event)\">\n  </app-filters>\n\n  <div class=\"row mb-2\" style=\"width: 99%\">\n    @if (!configuration.hideFilter) {\n      <div class=\"col-12 d-flex justify-content-center\">\n        <mat-form-field class=\"filter\">\n          <mat-label>Filtrar</mat-label>\n          <input type=\"text\" [(ngModel)]=\"filters\" (keyup)=\"changeFilters()\" matInput placeholder=\"Filtrar\" />\n        </mat-form-field>\n      </div>\n    }\n  </div>\n\n  <div class=\"col-12 d-flex flex-row justify-content-between align-items-center p-2\">\n    <div class=\"d-none d-md-block me-md-3 w-100\" style=\"font-size: 1rem\">\n      @if (selectedRows.length > 0 && configuration.selectable && !movil) {\n        <span class=\"fw-bold\">\n          {{ selectedRows.length }}\n          {{ selectedRows.length === 1 ? 'Seleccionado' : 'Seleccionados' }}\n        </span>\n      }\n    </div>\n    <div class=\"d-flex justify-content-end w-100\">\n      <ng-container *ngTemplateOutlet=\"buttonsTable\"></ng-container>\n    </div>\n  </div>\n\n  <table class=\"table_Eter table-hover\">\n    <thead class=\"dark\">\n      <tr>\n        @if (configuration.selectable) {\n          <th style=\"justify-content: center\">\n            <mat-checkbox color=\"primary\" (change)=\"seletecAllEvent($event)\" [(ngModel)]=\"selectAll\"\n              [indeterminate]=\"indeterminateState\">\n            </mat-checkbox>\n          </th>\n        }\n        @for (column of columns; track column) {\n          <th [class]=\"column.style?.movil\" scope=\"col\" [ngStyle]=\"column.style\">\n            {{ column.label }}\n          </th>\n        }\n        @if (shouldShowMenu()) {\n          <th></th>\n        }\n      </tr>\n    </thead>\n    <tbody class=\"mat-elevation-z3\">\n      @for (row of data; track row) {\n        <tr style=\"cursor: pointer\" (click)=\"clickOnRoW(row)\"\n          [class]=\"checkboxs[row[configuration.primaryKey]] ? 'selected-row' : ''\">\n          @if (configuration.selectable) {\n            <th style=\"justify-content: center\">\n              <mat-checkbox color=\"primary\" [(ngModel)]=\"checkboxs[row[configuration.primaryKey]]\" (click)=\"clicked($event)\"\n                (change)=\"selection(row, $event)\">\n              </mat-checkbox>\n            </th>\n          }\n          @for (column of columns; track column) {\n            <th [class]=\"column.style?.movil\" [ngStyle]=\"column.style\" scope=\"row\">\n              @if (\n                column.type === 'file' ||\n                (column.rules && evaluateRules(row[column.ID], column.rules))) {\n                <div (click)=\"onFileIconClick($event, row[column.ID])\">\n                  <i class=\"fa fa-file\" style=\"cursor: pointer\"></i>\n                </div>\n              } @else {\n                {{ row[column.ID] }}\n              }\n            </th>\n          }\n          @if (shouldShowMenu()) {\n            <th class=\"d-flex justify-content-center align-items-center\"\n              style=\"overflow: visible;\">\n              <mat-icon (click)=\"showMenu($event)\" [matMenuTriggerFor]=\"menu\" matRipple class=\"menu_more_vert\"\n              aria-hidden=\"false\" aria-label=\"Example delete icon\">more_vert</mat-icon>\n              <mat-menu #menu=\"matMenu\">\n                @for (btn of buttonsConfig; track btn) {\n                  <div>\n                    @if (btn.condition()) {\n                      <button (click)=\"action(btn.action, row)\" mat-menu-item\n                        class=\"d-flex align-items-center w-100\">\n                        <i class=\"fa {{ btn.icon }} btn-accion\" style=\"font-size: 120%; margin-right: 10px\"></i>\n                        {{ btn.tooltip }}\n                      </button>\n                    }\n                  </div>\n                }\n              </mat-menu>\n            </th>\n          }\n        </tr>\n      }\n    </tbody>\n  </table>\n\n  @if (length == 0 && data.length == 0) {\n    <div style=\"margin-left: 10px\">\n      <strong>No se encontr\u00F3 informaci\u00F3n</strong>\n    </div>\n  }\n\n  @if (paginatorActive) {\n    <mat-paginator [length]=\"length\" [pageSize]=\"pageSize\" [pageSizeOptions]=\"pageSizeOptions\"\n    showFirstLastButtons (page)=\"changePage($event)\"></mat-paginator>\n  }\n</div>\n\n<ng-template #buttonsTable let-fontSize=\"fontSize\" let-marginRight=\"marginRight\" class=\"button-table\">\n  @for (btn of buttonsConfig; track btn) {\n    @if (btn.conditionShowHeader()) {\n      <div (click)=\"action(btn.action)\" matTooltip=\"{{ btn.tooltip }}\"\n        matTooltipPosition=\"above\">\n      <i class=\"fa {{ btn.icon }} btn-accion\" [ngStyle]=\"{\n          'font-size': fontSize ? fontSize : '170%',\n          'margin-right': marginRight ? marginRight : '15px'\n        }\"></i>\n      </div>\n    }\n  }\n</ng-template>", styles: [".contenedor-tabla{width:100%;overflow-x:auto}.table_Eter{width:100%;margin-bottom:4px;color:primary;border-collapse:collapse}.table_Eter .dark th{color:#fff;background-color:#343a40;border-color:#454d55;text-align:center;vertical-align:middle}.table_Eter thead th{vertical-align:bottom;border-bottom:2px solid #dee2e6}.table_Eter th,.table_Eter td{padding:.75rem;vertical-align:top;border-top:1px solid #dee2e6}th{text-align:inherit}*,*:before,*:after{box-sizing:border-box}.btn-accion{cursor:pointer}mat-form-field{padding:0!important;width:90%}.table-title-mobile{display:block;margin-bottom:10px;font-size:1.2rem;text-align:center}.filter{padding:0;margin-bottom:10px}.selected-row{color:#212529;background-color:#00000013}.button-table{flex:.5;display:flex;flex-direction:row;justify-content:flex-end}button:focus{outline:none!important}@media only screen and (max-width: 600px){.no-movil{display:none}::ng-deep .mat-mdc-paginator-range-label{margin:0!important}}::ng-deep .mat-mdc-paginator{background:transparent!important}\n"] }]
         }], ctorParameters: () => [{ type: i1.MatDialog }, { type: HttpService }, { type: MessageService }, { type: FunctionsService }, { type: i5$2.MatPaginatorIntl }, { type: ExportDataService }], propDecorators: { title: [{
                 type: Input
             }], titleExcelFile: [{