brainloper-ui 1.0.21 → 1.0.22
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/esm2020/src/app/modules/brainloper-ui/components/data-table/data-table.component.mjs +11 -4
- package/esm2020/src/app/modules/interfaces/data-table/table-configuration.mjs +1 -1
- package/fesm2015/brainloper-ui.mjs +10 -3
- package/fesm2015/brainloper-ui.mjs.map +1 -1
- package/fesm2020/brainloper-ui.mjs +10 -3
- package/fesm2020/brainloper-ui.mjs.map +1 -1
- package/package.json +1 -1
- package/src/app/modules/brainloper-ui/components/data-table/data-table.component.d.ts +3 -1
- package/src/app/modules/interfaces/data-table/table-configuration.d.ts +1 -0
|
@@ -1322,7 +1322,8 @@ class DataTableComponent {
|
|
|
1322
1322
|
hideTitle: true,
|
|
1323
1323
|
hideFilter: true,
|
|
1324
1324
|
notInitialize: false,
|
|
1325
|
-
blockEventclickRow: false
|
|
1325
|
+
blockEventclickRow: false,
|
|
1326
|
+
exportXslxByRow: false
|
|
1326
1327
|
};
|
|
1327
1328
|
this.titleLoading = "";
|
|
1328
1329
|
this.messageLoading = "";
|
|
@@ -1332,6 +1333,7 @@ class DataTableComponent {
|
|
|
1332
1333
|
this.edit = new EventEmitter();
|
|
1333
1334
|
this.delete = new EventEmitter();
|
|
1334
1335
|
this.print = new EventEmitter();
|
|
1336
|
+
this.exportXslxByRow = new EventEmitter();
|
|
1335
1337
|
this.active = new EventEmitter();
|
|
1336
1338
|
this.selected = new EventEmitter();
|
|
1337
1339
|
this.internalData = new EventEmitter();
|
|
@@ -1530,6 +1532,9 @@ class DataTableComponent {
|
|
|
1530
1532
|
case 'exportToExcel':
|
|
1531
1533
|
this.exportToExcel();
|
|
1532
1534
|
break;
|
|
1535
|
+
case 'exportToExcelByRow':
|
|
1536
|
+
this.exportXslxByRow.emit(this.selectedRows);
|
|
1537
|
+
break;
|
|
1533
1538
|
}
|
|
1534
1539
|
}
|
|
1535
1540
|
exportToExcel() {
|
|
@@ -1642,10 +1647,10 @@ class DataTableComponent {
|
|
|
1642
1647
|
}
|
|
1643
1648
|
}
|
|
1644
1649
|
DataTableComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: DataTableComponent, deps: [{ token: i1.MatDialog }, { token: HttpService }, { token: MessageService }, { token: FunctionsService }, { token: i5$1.MatPaginatorIntl }, { token: ExportDataService }], target: i0.ɵɵFactoryTarget.Component });
|
|
1645
|
-
DataTableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.1", type: DataTableComponent, selector: "data-table", inputs: { title: "title", columns: "columns", data: "data", combo: "combo", configuration: "configuration", reloadTable: "reloadTable", url: "url", params: "params", titleLoading: "titleLoading", messageLoading: "messageLoading", headerFileXlsm: "headerFileXlsm", headerFilters: "headerFilters" }, outputs: { clickRow: "clickRow", add: "add", edit: "edit", delete: "delete", print: "print", active: "active", selected: "selected", internalData: "internalData" }, viewQueries: [{ propertyName: "paginator", first: true, predicate: MatPaginator, descendants: true, static: true }], usesOnChanges: true, ngImport: i0, template: "<div style=\"width:100%;\">\r\n <app-filters [headerFilters]=\"headerFilters\" (applyFilters)=\"applyFilters($event)\">\r\n </app-filters>\r\n\r\n <div style='display: flex; flex-direction: row; justify-content: space-between; align-items: center;'>\r\n <div style='flex:1; font-size: 1rem;'>\r\n <strong><p style='margin:0' *ngIf='selectedRows.length>0 && selectedRows.length<2'> {{selectedRows.length}} Seleccionado </p></strong>\r\n <strong><p style='margin:0' *ngIf='selectedRows.length>1'> {{selectedRows.length}} Seleccionados </p></strong>\r\n <strong><p style='margin:0' *ngIf='selectedRows.length<1 && !configuration.hideTitle'> {{title}} </p></strong>\r\n </div>\r\n\r\n <div *ngIf=\"!configuration.hideFilter\" style='flex:3; padding-right: 10px; margin-bottom: 5px;'>\r\n <mat-form-field class='filter'>\r\n <input type=\"text\" [(ngModel)]='filters' (keyup)='changeFilters()' matInput placeholder=\"Filtrar\">\r\n </mat-form-field>\r\n </div>\r\n\r\n <div style='flex:0.5; display:flex; flex-direction: row; justify-content: flex-end;'>\r\n\r\n <div (click)='action(\"edit\")' *ngIf='selectedRows.length==1' matTooltip=\"Editar\" matTooltipPosition=\"above\">\r\n <i class=\"fa fa-edit btn-accion\" style=\"font-size: 170%; margin-right: 15px;\" *ngIf='configuration.edit'></i>\r\n </div>\r\n\r\n <div (click)='action(\"print\")' *ngIf='selectedRows.length==1 && screen' matTooltip=\"Imprimir\" matTooltipPosition=\"above\">\r\n <i class=\"fa fa-print btn-accion\" style=\"font-size: 170%; margin-right: 15px;\" *ngIf='configuration.print'></i>\r\n </div>\r\n\r\n <div (click)='action(\"delete\")' *ngIf='selectedRows.length>0' matTooltip=\"Eliminar\" matTooltipPosition=\"above\">\r\n <i class=\"fa fa-trash btn-accion\" style=\"font-size: 170%; margin-right: 15px;\" *ngIf='configuration.delete'></i>\r\n </div>\r\n\r\n <div (click)='action(\"active\")' *ngIf='selectedRows.length>0' matTooltip=\"Activar/Desactivar\" matTooltipPosition=\"above\">\r\n <i class=\"fa fa-adjust btn-accion\" style=\"font-size: 170%; margin-right: 15px;\" *ngIf='configuration.active'></i>\r\n </div>\r\n\r\n <div (click)='action(\"add\")' *ngIf='selectedRows.length==0' matTooltip=\"Nuevo\" matTooltipPosition=\"above\">\r\n <i class=\"fa fa-plus-circle btn-accion\" style=\"font-size: 170%;margin-right: 15px;\" *ngIf='configuration.add'></i>\r\n </div>\r\n\r\n <div (click)='action(\"exportToExcel\")' *ngIf='selectedRows.length == 0 && data.length > 0' matTooltip=\"Exportar excel\" matTooltipPosition=\"above\">\r\n <i class=\"fa fa-download btn-accion\" style=\"font-size: 170%;margin-right: 15px;\" *ngIf='configuration.exportXslx'></i>\r\n </div>\r\n </div>\r\n\r\n </div>\r\n\r\n <table class=\"table_Eter table-hover\">\r\n <thead class=\"dark\">\r\n <tr >\r\n <th *ngIf='configuration.selectable || configuration.delete || configuration.edit' style='justify-content: center;'>\r\n <mat-checkbox color='primary' (change)='seletecAllEvent($event)' [(ngModel)]='selectAll' [indeterminate]='indeterminateState'> </mat-checkbox> </th>\r\n <th\r\n [class]=\"column.style?.movil\"\r\n *ngFor='let column of columns' scope=\"col\"\r\n [ngStyle]=\"column.style\"\r\n >{{column.label}}</th>\r\n </tr>\r\n </thead>\r\n <tbody class='mat-elevation-z3'>\r\n\r\n <tr style=\"cursor: pointer;\" *ngFor='let row of data' (click)='clickOnRoW(row)' >\r\n <th *ngIf='configuration.selectable || configuration.delete || configuration.edit' style='justify-content: center;'> <mat-checkbox color='primary' [(ngModel)]='checkboxs[row[configuration.primaryKey]]' (click)='clicked($event)' (change)='selection(row, $event)'> </mat-checkbox> </th>\r\n <th [class]='column.style?.movil' [ngStyle]='column.style' scope=\"row\" *ngFor='let column of columns'>{{ row[column.ID] }}</th>\r\n </tr>\r\n\r\n\r\n </tbody>\r\n\r\n </table>\r\n\r\n <div *ngIf='length == 0 && data.length == 0' style=\"margin-left: 10px;\"> <strong>No se encontr\u00F3 informaci\u00F3n</strong></div>\r\n\r\n <mat-paginator *ngIf=\"paginatorActive\"\r\n [length]=\"length\" [pageSize]=\"pageSize\" [pageSizeOptions]=\"pageSizeOptions\" showFirstLastButtons\r\n (page)=\"changePage($event)\"></mat-paginator>\r\n\r\n</div>\r\n", styles: [".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:100%}.filter{padding:0;margin-bottom:10px;width:100%}.filter ::ng-deep .mat-form-field-underline{bottom:3px!important}.filter ::ng-deep .mat-form-field-infix{border:0!important}.filter ::ng-deep .mat-form-field-wrapper{padding:0}.filter ::ng-deep .mat-form-field-appearance-legacy .mat-form-field-wrapper{padding:0}@media only screen and (max-width: 600px){.no-movil{display:none}}::ng-deep .mat-paginator{background:transparent!important}@media screen and (max-width: 400px){.filter{padding:0;margin-bottom:40px;width:70%}}\n"], components: [{ type: FiltersComponent, selector: "app-filters", inputs: ["headerFilters"], outputs: ["applyFilters"] }, { type: i3.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { type: i9.MatCheckbox, selector: "mat-checkbox", inputs: ["disableRipple", "color", "tabIndex", "aria-label", "aria-labelledby", "aria-describedby", "id", "required", "labelPosition", "name", "value", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { type: i5$1.MatPaginator, selector: "mat-paginator", inputs: ["disabled"], exportAs: ["matPaginator"] }], directives: [{ type: i7.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i11.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { type: i10.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i10.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i10.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i8.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { type: i7.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i7.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
|
|
1650
|
+
DataTableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.1", type: DataTableComponent, selector: "data-table", inputs: { title: "title", columns: "columns", data: "data", combo: "combo", configuration: "configuration", reloadTable: "reloadTable", url: "url", params: "params", titleLoading: "titleLoading", messageLoading: "messageLoading", headerFileXlsm: "headerFileXlsm", headerFilters: "headerFilters" }, outputs: { clickRow: "clickRow", add: "add", edit: "edit", delete: "delete", print: "print", exportXslxByRow: "exportXslxByRow", active: "active", selected: "selected", internalData: "internalData" }, viewQueries: [{ propertyName: "paginator", first: true, predicate: MatPaginator, descendants: true, static: true }], usesOnChanges: true, ngImport: i0, template: "<div style=\"width:100%;\">\r\n <app-filters [headerFilters]=\"headerFilters\" (applyFilters)=\"applyFilters($event)\">\r\n </app-filters>\r\n\r\n <div style='display: flex; flex-direction: row; justify-content: space-between; align-items: center;'>\r\n <div style='flex:1; font-size: 1rem;'>\r\n <strong><p style='margin:0' *ngIf='selectedRows.length>0 && selectedRows.length<2'> {{selectedRows.length}} Seleccionado </p></strong>\r\n <strong><p style='margin:0' *ngIf='selectedRows.length>1'> {{selectedRows.length}} Seleccionados </p></strong>\r\n <strong><p style='margin:0' *ngIf='selectedRows.length<1 && !configuration.hideTitle'> {{title}} </p></strong>\r\n </div>\r\n\r\n <div *ngIf=\"!configuration.hideFilter\" style='flex:3; padding-right: 10px; margin-bottom: 5px;'>\r\n <mat-form-field class='filter'>\r\n <input type=\"text\" [(ngModel)]='filters' (keyup)='changeFilters()' matInput placeholder=\"Filtrar\">\r\n </mat-form-field>\r\n </div>\r\n\r\n <div style='flex:0.5; display:flex; flex-direction: row; justify-content: flex-end;'>\r\n\r\n <div (click)='action(\"edit\")' *ngIf='selectedRows.length==1' matTooltip=\"Editar\" matTooltipPosition=\"above\">\r\n <i class=\"fa fa-edit btn-accion\" style=\"font-size: 170%; margin-right: 15px;\" *ngIf='configuration.edit'></i>\r\n </div>\r\n\r\n <div (click)='action(\"print\")' *ngIf='selectedRows.length==1 && screen' matTooltip=\"Imprimir\" matTooltipPosition=\"above\">\r\n <i class=\"fa fa-print btn-accion\" style=\"font-size: 170%; margin-right: 15px;\" *ngIf='configuration.print'></i>\r\n </div>\r\n\r\n <div (click)='action(\"delete\")' *ngIf='selectedRows.length>0' matTooltip=\"Eliminar\" matTooltipPosition=\"above\">\r\n <i class=\"fa fa-trash btn-accion\" style=\"font-size: 170%; margin-right: 15px;\" *ngIf='configuration.delete'></i>\r\n </div>\r\n\r\n <div (click)='action(\"active\")' *ngIf='selectedRows.length>0' matTooltip=\"Activar/Desactivar\" matTooltipPosition=\"above\">\r\n <i class=\"fa fa-adjust btn-accion\" style=\"font-size: 170%; margin-right: 15px;\" *ngIf='configuration.active'></i>\r\n </div>\r\n\r\n <div (click)='action(\"add\")' *ngIf='selectedRows.length==0' matTooltip=\"Nuevo\" matTooltipPosition=\"above\">\r\n <i class=\"fa fa-plus-circle btn-accion\" style=\"font-size: 170%;margin-right: 15px;\" *ngIf='configuration.add'></i>\r\n </div>\r\n\r\n <div (click)='action(\"exportToExcel\")' *ngIf='selectedRows.length == 0 && data.length > 0' matTooltip=\"Exportar excel\" matTooltipPosition=\"above\">\r\n <i class=\"fa fa-download btn-accion\" style=\"font-size: 170%;margin-right: 15px;\" *ngIf='configuration.exportXslx'></i>\r\n </div>\r\n\r\n <div (click)='action(\"exportToExcelByRow\")' *ngIf='selectedRows.length == 1' matTooltip=\"Exportar excel\" matTooltipPosition=\"above\">\r\n <i class=\"fa fa-download btn-accion\" style=\"font-size: 170%;margin-right: 15px;\" *ngIf='configuration.exportXslxByRow'></i>\r\n </div>\r\n\r\n </div>\r\n\r\n </div>\r\n\r\n <table class=\"table_Eter table-hover\">\r\n <thead class=\"dark\">\r\n <tr >\r\n <th *ngIf='configuration.selectable || configuration.delete || configuration.edit' style='justify-content: center;'>\r\n <mat-checkbox color='primary' (change)='seletecAllEvent($event)' [(ngModel)]='selectAll' [indeterminate]='indeterminateState'> </mat-checkbox> </th>\r\n <th\r\n [class]=\"column.style?.movil\"\r\n *ngFor='let column of columns' scope=\"col\"\r\n [ngStyle]=\"column.style\"\r\n >{{column.label}}</th>\r\n </tr>\r\n </thead>\r\n <tbody class='mat-elevation-z3'>\r\n\r\n <tr style=\"cursor: pointer;\" *ngFor='let row of data' (click)='clickOnRoW(row)' >\r\n <th *ngIf='configuration.selectable || configuration.delete || configuration.edit' style='justify-content: center;'> <mat-checkbox color='primary' [(ngModel)]='checkboxs[row[configuration.primaryKey]]' (click)='clicked($event)' (change)='selection(row, $event)'> </mat-checkbox> </th>\r\n <th [class]='column.style?.movil' [ngStyle]='column.style' scope=\"row\" *ngFor='let column of columns'>{{ row[column.ID] }}</th>\r\n </tr>\r\n\r\n\r\n </tbody>\r\n\r\n </table>\r\n\r\n <div *ngIf='length == 0 && data.length == 0' style=\"margin-left: 10px;\"> <strong>No se encontr\u00F3 informaci\u00F3n</strong></div>\r\n\r\n <mat-paginator *ngIf=\"paginatorActive\"\r\n [length]=\"length\" [pageSize]=\"pageSize\" [pageSizeOptions]=\"pageSizeOptions\" showFirstLastButtons\r\n (page)=\"changePage($event)\"></mat-paginator>\r\n\r\n</div>\r\n", styles: [".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:100%}.filter{padding:0;margin-bottom:10px;width:100%}.filter ::ng-deep .mat-form-field-underline{bottom:3px!important}.filter ::ng-deep .mat-form-field-infix{border:0!important}.filter ::ng-deep .mat-form-field-wrapper{padding:0}.filter ::ng-deep .mat-form-field-appearance-legacy .mat-form-field-wrapper{padding:0}@media only screen and (max-width: 600px){.no-movil{display:none}}::ng-deep .mat-paginator{background:transparent!important}@media screen and (max-width: 400px){.filter{padding:0;margin-bottom:40px;width:70%}}\n"], components: [{ type: FiltersComponent, selector: "app-filters", inputs: ["headerFilters"], outputs: ["applyFilters"] }, { type: i3.MatFormField, selector: "mat-form-field", inputs: ["color", "appearance", "hideRequiredMarker", "hintLabel", "floatLabel"], exportAs: ["matFormField"] }, { type: i9.MatCheckbox, selector: "mat-checkbox", inputs: ["disableRipple", "color", "tabIndex", "aria-label", "aria-labelledby", "aria-describedby", "id", "required", "labelPosition", "name", "value", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { type: i5$1.MatPaginator, selector: "mat-paginator", inputs: ["disabled"], exportAs: ["matPaginator"] }], directives: [{ type: i7.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i11.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { type: i10.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i10.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i10.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i8.MatTooltip, selector: "[matTooltip]", exportAs: ["matTooltip"] }, { type: i7.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i7.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
|
|
1646
1651
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.1", ngImport: i0, type: DataTableComponent, decorators: [{
|
|
1647
1652
|
type: Component,
|
|
1648
|
-
args: [{ selector: 'data-table', template: "<div style=\"width:100%;\">\r\n <app-filters [headerFilters]=\"headerFilters\" (applyFilters)=\"applyFilters($event)\">\r\n </app-filters>\r\n\r\n <div style='display: flex; flex-direction: row; justify-content: space-between; align-items: center;'>\r\n <div style='flex:1; font-size: 1rem;'>\r\n <strong><p style='margin:0' *ngIf='selectedRows.length>0 && selectedRows.length<2'> {{selectedRows.length}} Seleccionado </p></strong>\r\n <strong><p style='margin:0' *ngIf='selectedRows.length>1'> {{selectedRows.length}} Seleccionados </p></strong>\r\n <strong><p style='margin:0' *ngIf='selectedRows.length<1 && !configuration.hideTitle'> {{title}} </p></strong>\r\n </div>\r\n\r\n <div *ngIf=\"!configuration.hideFilter\" style='flex:3; padding-right: 10px; margin-bottom: 5px;'>\r\n <mat-form-field class='filter'>\r\n <input type=\"text\" [(ngModel)]='filters' (keyup)='changeFilters()' matInput placeholder=\"Filtrar\">\r\n </mat-form-field>\r\n </div>\r\n\r\n <div style='flex:0.5; display:flex; flex-direction: row; justify-content: flex-end;'>\r\n\r\n <div (click)='action(\"edit\")' *ngIf='selectedRows.length==1' matTooltip=\"Editar\" matTooltipPosition=\"above\">\r\n <i class=\"fa fa-edit btn-accion\" style=\"font-size: 170%; margin-right: 15px;\" *ngIf='configuration.edit'></i>\r\n </div>\r\n\r\n <div (click)='action(\"print\")' *ngIf='selectedRows.length==1 && screen' matTooltip=\"Imprimir\" matTooltipPosition=\"above\">\r\n <i class=\"fa fa-print btn-accion\" style=\"font-size: 170%; margin-right: 15px;\" *ngIf='configuration.print'></i>\r\n </div>\r\n\r\n <div (click)='action(\"delete\")' *ngIf='selectedRows.length>0' matTooltip=\"Eliminar\" matTooltipPosition=\"above\">\r\n <i class=\"fa fa-trash btn-accion\" style=\"font-size: 170%; margin-right: 15px;\" *ngIf='configuration.delete'></i>\r\n </div>\r\n\r\n <div (click)='action(\"active\")' *ngIf='selectedRows.length>0' matTooltip=\"Activar/Desactivar\" matTooltipPosition=\"above\">\r\n <i class=\"fa fa-adjust btn-accion\" style=\"font-size: 170%; margin-right: 15px;\" *ngIf='configuration.active'></i>\r\n </div>\r\n\r\n <div (click)='action(\"add\")' *ngIf='selectedRows.length==0' matTooltip=\"Nuevo\" matTooltipPosition=\"above\">\r\n <i class=\"fa fa-plus-circle btn-accion\" style=\"font-size: 170%;margin-right: 15px;\" *ngIf='configuration.add'></i>\r\n </div>\r\n\r\n <div (click)='action(\"exportToExcel\")' *ngIf='selectedRows.length == 0 && data.length > 0' matTooltip=\"Exportar excel\" matTooltipPosition=\"above\">\r\n <i class=\"fa fa-download btn-accion\" style=\"font-size: 170%;margin-right: 15px;\" *ngIf='configuration.exportXslx'></i>\r\n </div>\r\n </div>\r\n\r\n </div>\r\n\r\n <table class=\"table_Eter table-hover\">\r\n <thead class=\"dark\">\r\n <tr >\r\n <th *ngIf='configuration.selectable || configuration.delete || configuration.edit' style='justify-content: center;'>\r\n <mat-checkbox color='primary' (change)='seletecAllEvent($event)' [(ngModel)]='selectAll' [indeterminate]='indeterminateState'> </mat-checkbox> </th>\r\n <th\r\n [class]=\"column.style?.movil\"\r\n *ngFor='let column of columns' scope=\"col\"\r\n [ngStyle]=\"column.style\"\r\n >{{column.label}}</th>\r\n </tr>\r\n </thead>\r\n <tbody class='mat-elevation-z3'>\r\n\r\n <tr style=\"cursor: pointer;\" *ngFor='let row of data' (click)='clickOnRoW(row)' >\r\n <th *ngIf='configuration.selectable || configuration.delete || configuration.edit' style='justify-content: center;'> <mat-checkbox color='primary' [(ngModel)]='checkboxs[row[configuration.primaryKey]]' (click)='clicked($event)' (change)='selection(row, $event)'> </mat-checkbox> </th>\r\n <th [class]='column.style?.movil' [ngStyle]='column.style' scope=\"row\" *ngFor='let column of columns'>{{ row[column.ID] }}</th>\r\n </tr>\r\n\r\n\r\n </tbody>\r\n\r\n </table>\r\n\r\n <div *ngIf='length == 0 && data.length == 0' style=\"margin-left: 10px;\"> <strong>No se encontr\u00F3 informaci\u00F3n</strong></div>\r\n\r\n <mat-paginator *ngIf=\"paginatorActive\"\r\n [length]=\"length\" [pageSize]=\"pageSize\" [pageSizeOptions]=\"pageSizeOptions\" showFirstLastButtons\r\n (page)=\"changePage($event)\"></mat-paginator>\r\n\r\n</div>\r\n", styles: [".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:100%}.filter{padding:0;margin-bottom:10px;width:100%}.filter ::ng-deep .mat-form-field-underline{bottom:3px!important}.filter ::ng-deep .mat-form-field-infix{border:0!important}.filter ::ng-deep .mat-form-field-wrapper{padding:0}.filter ::ng-deep .mat-form-field-appearance-legacy .mat-form-field-wrapper{padding:0}@media only screen and (max-width: 600px){.no-movil{display:none}}::ng-deep .mat-paginator{background:transparent!important}@media screen and (max-width: 400px){.filter{padding:0;margin-bottom:40px;width:70%}}\n"] }]
|
|
1653
|
+
args: [{ selector: 'data-table', template: "<div style=\"width:100%;\">\r\n <app-filters [headerFilters]=\"headerFilters\" (applyFilters)=\"applyFilters($event)\">\r\n </app-filters>\r\n\r\n <div style='display: flex; flex-direction: row; justify-content: space-between; align-items: center;'>\r\n <div style='flex:1; font-size: 1rem;'>\r\n <strong><p style='margin:0' *ngIf='selectedRows.length>0 && selectedRows.length<2'> {{selectedRows.length}} Seleccionado </p></strong>\r\n <strong><p style='margin:0' *ngIf='selectedRows.length>1'> {{selectedRows.length}} Seleccionados </p></strong>\r\n <strong><p style='margin:0' *ngIf='selectedRows.length<1 && !configuration.hideTitle'> {{title}} </p></strong>\r\n </div>\r\n\r\n <div *ngIf=\"!configuration.hideFilter\" style='flex:3; padding-right: 10px; margin-bottom: 5px;'>\r\n <mat-form-field class='filter'>\r\n <input type=\"text\" [(ngModel)]='filters' (keyup)='changeFilters()' matInput placeholder=\"Filtrar\">\r\n </mat-form-field>\r\n </div>\r\n\r\n <div style='flex:0.5; display:flex; flex-direction: row; justify-content: flex-end;'>\r\n\r\n <div (click)='action(\"edit\")' *ngIf='selectedRows.length==1' matTooltip=\"Editar\" matTooltipPosition=\"above\">\r\n <i class=\"fa fa-edit btn-accion\" style=\"font-size: 170%; margin-right: 15px;\" *ngIf='configuration.edit'></i>\r\n </div>\r\n\r\n <div (click)='action(\"print\")' *ngIf='selectedRows.length==1 && screen' matTooltip=\"Imprimir\" matTooltipPosition=\"above\">\r\n <i class=\"fa fa-print btn-accion\" style=\"font-size: 170%; margin-right: 15px;\" *ngIf='configuration.print'></i>\r\n </div>\r\n\r\n <div (click)='action(\"delete\")' *ngIf='selectedRows.length>0' matTooltip=\"Eliminar\" matTooltipPosition=\"above\">\r\n <i class=\"fa fa-trash btn-accion\" style=\"font-size: 170%; margin-right: 15px;\" *ngIf='configuration.delete'></i>\r\n </div>\r\n\r\n <div (click)='action(\"active\")' *ngIf='selectedRows.length>0' matTooltip=\"Activar/Desactivar\" matTooltipPosition=\"above\">\r\n <i class=\"fa fa-adjust btn-accion\" style=\"font-size: 170%; margin-right: 15px;\" *ngIf='configuration.active'></i>\r\n </div>\r\n\r\n <div (click)='action(\"add\")' *ngIf='selectedRows.length==0' matTooltip=\"Nuevo\" matTooltipPosition=\"above\">\r\n <i class=\"fa fa-plus-circle btn-accion\" style=\"font-size: 170%;margin-right: 15px;\" *ngIf='configuration.add'></i>\r\n </div>\r\n\r\n <div (click)='action(\"exportToExcel\")' *ngIf='selectedRows.length == 0 && data.length > 0' matTooltip=\"Exportar excel\" matTooltipPosition=\"above\">\r\n <i class=\"fa fa-download btn-accion\" style=\"font-size: 170%;margin-right: 15px;\" *ngIf='configuration.exportXslx'></i>\r\n </div>\r\n\r\n <div (click)='action(\"exportToExcelByRow\")' *ngIf='selectedRows.length == 1' matTooltip=\"Exportar excel\" matTooltipPosition=\"above\">\r\n <i class=\"fa fa-download btn-accion\" style=\"font-size: 170%;margin-right: 15px;\" *ngIf='configuration.exportXslxByRow'></i>\r\n </div>\r\n\r\n </div>\r\n\r\n </div>\r\n\r\n <table class=\"table_Eter table-hover\">\r\n <thead class=\"dark\">\r\n <tr >\r\n <th *ngIf='configuration.selectable || configuration.delete || configuration.edit' style='justify-content: center;'>\r\n <mat-checkbox color='primary' (change)='seletecAllEvent($event)' [(ngModel)]='selectAll' [indeterminate]='indeterminateState'> </mat-checkbox> </th>\r\n <th\r\n [class]=\"column.style?.movil\"\r\n *ngFor='let column of columns' scope=\"col\"\r\n [ngStyle]=\"column.style\"\r\n >{{column.label}}</th>\r\n </tr>\r\n </thead>\r\n <tbody class='mat-elevation-z3'>\r\n\r\n <tr style=\"cursor: pointer;\" *ngFor='let row of data' (click)='clickOnRoW(row)' >\r\n <th *ngIf='configuration.selectable || configuration.delete || configuration.edit' style='justify-content: center;'> <mat-checkbox color='primary' [(ngModel)]='checkboxs[row[configuration.primaryKey]]' (click)='clicked($event)' (change)='selection(row, $event)'> </mat-checkbox> </th>\r\n <th [class]='column.style?.movil' [ngStyle]='column.style' scope=\"row\" *ngFor='let column of columns'>{{ row[column.ID] }}</th>\r\n </tr>\r\n\r\n\r\n </tbody>\r\n\r\n </table>\r\n\r\n <div *ngIf='length == 0 && data.length == 0' style=\"margin-left: 10px;\"> <strong>No se encontr\u00F3 informaci\u00F3n</strong></div>\r\n\r\n <mat-paginator *ngIf=\"paginatorActive\"\r\n [length]=\"length\" [pageSize]=\"pageSize\" [pageSizeOptions]=\"pageSizeOptions\" showFirstLastButtons\r\n (page)=\"changePage($event)\"></mat-paginator>\r\n\r\n</div>\r\n", styles: [".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:100%}.filter{padding:0;margin-bottom:10px;width:100%}.filter ::ng-deep .mat-form-field-underline{bottom:3px!important}.filter ::ng-deep .mat-form-field-infix{border:0!important}.filter ::ng-deep .mat-form-field-wrapper{padding:0}.filter ::ng-deep .mat-form-field-appearance-legacy .mat-form-field-wrapper{padding:0}@media only screen and (max-width: 600px){.no-movil{display:none}}::ng-deep .mat-paginator{background:transparent!important}@media screen and (max-width: 400px){.filter{padding:0;margin-bottom:40px;width:70%}}\n"] }]
|
|
1649
1654
|
}], ctorParameters: function () { return [{ type: i1.MatDialog }, { type: HttpService }, { type: MessageService }, { type: FunctionsService }, { type: i5$1.MatPaginatorIntl }, { type: ExportDataService }]; }, propDecorators: { title: [{
|
|
1650
1655
|
type: Input
|
|
1651
1656
|
}], columns: [{
|
|
@@ -1678,6 +1683,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.1", ngImpor
|
|
|
1678
1683
|
type: Output
|
|
1679
1684
|
}], print: [{
|
|
1680
1685
|
type: Output
|
|
1686
|
+
}], exportXslxByRow: [{
|
|
1687
|
+
type: Output
|
|
1681
1688
|
}], active: [{
|
|
1682
1689
|
type: Output
|
|
1683
1690
|
}], selected: [{
|