@jvsoft/components 0.0.4 → 0.0.6
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/fesm2022/jvsoft-components-tabla-mantenimiento.mjs +43 -20
- package/fesm2022/jvsoft-components-tabla-mantenimiento.mjs.map +1 -1
- package/fesm2022/jvsoft-components.mjs +43 -20
- package/fesm2022/jvsoft-components.mjs.map +1 -1
- package/package.json +5 -1
- package/tabla-mantenimiento/interfaces/global/columnas-tabla.d.ts +14 -3
- package/tabla-mantenimiento/interfaces/global/no-export.d.ts +2 -0
- package/tabla-mantenimiento/interfaces/global/otros.d.ts +1 -2
- package/tabla-mantenimiento/tabla-mantenimiento.component.d.ts +4 -1
|
@@ -327,6 +327,16 @@ class ForCheckboxModel {
|
|
|
327
327
|
}
|
|
328
328
|
}
|
|
329
329
|
|
|
330
|
+
function tipoValorFuncion(datoParam, defaultValue, ...param) {
|
|
331
|
+
if (datoParam === undefined || datoParam === null) {
|
|
332
|
+
return defaultValue; // Retorna el valor por defecto si es undefined
|
|
333
|
+
}
|
|
334
|
+
if (typeof datoParam === 'function') {
|
|
335
|
+
return datoParam(...param);
|
|
336
|
+
}
|
|
337
|
+
return datoParam;
|
|
338
|
+
}
|
|
339
|
+
|
|
330
340
|
class MatRowKeyboardSelectionDirective {
|
|
331
341
|
el;
|
|
332
342
|
rows;
|
|
@@ -693,11 +703,11 @@ class ColumnTypeIconsComponent extends ColumnTypeComponent {
|
|
|
693
703
|
return columna.items;
|
|
694
704
|
}
|
|
695
705
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.7", ngImport: i0, type: ColumnTypeIconsComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
696
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.1.7", type: ColumnTypeIconsComponent, isStandalone: false, selector: "jvs-column-type-icons", inputs: { column: "column" }, usesInheritance: true, ngImport: i0, template: "<ng-template #cellTemplate let-row=\"row\">\n <div class=\"flex items-center justify-center\" [ngClass]=\"{ '-space-x-1': !column.iconsDef?.soloIcono }\"\n >\n <ng-container *ngFor=\"let icon of obtenerItems(column.iconsDef, row)\">\n <ng-container *ngIf=\"!column.iconsDef?.soloIcono; else soloIcono\">\n <button matRipple type=\"button\" *ngIf=\"!icon.esVisible || icon.esVisible(row)\"\n (click)=\"icon.click ? icon.click(row) : false
|
|
706
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.1.7", type: ColumnTypeIconsComponent, isStandalone: false, selector: "jvs-column-type-icons", inputs: { column: "column" }, usesInheritance: true, ngImport: i0, template: "<ng-template #cellTemplate let-row=\"row\">\n <div class=\"flex items-center justify-center\" [ngClass]=\"{ '-space-x-1': !column.iconsDef?.soloIcono }\"\n >\n <ng-container *ngFor=\"let icon of obtenerItems(column.iconsDef, row)\">\n <ng-container *ngIf=\"!column.iconsDef?.soloIcono; else soloIcono\">\n <button matRipple type=\"button\" *ngIf=\"!icon.esVisible || icon.esVisible(row)\"\n (click)=\"icon.click ? icon.click(row) : false; $event.stopPropagation()\"\n class=\"flex items-center justify-center p-1 rounded border shadow-sm hover:shadow-lg\"\n [ngClass]=\"icon.contentCss\"\n [matTooltip]=\"icon.toolTip ?? row[icon.toolTipField ?? '_field_']\"\n [matTooltipDisabled]=\"!icon.toolTip && !icon.toolTipField\"\n >\n <ng-container [ngTemplateOutlet]=\"iconoConTamanio\"\n [ngTemplateOutletContext]=\"{icon: icon.icon, iconClass: icon.cssClass, size: (icon.iconSize ?? column.iconsDef?.iconSize)}\"></ng-container>\n </button>\n </ng-container>\n <ng-template #soloIcono>\n <div *ngIf=\"!icon.esVisible || icon.esVisible(row)\" [ngClass]=\"icon.contentCss\"\n class=\"flex items-center\"\n [matTooltip]=\"icon.toolTip ?? row[icon.toolTipField ?? '_field_']\"\n [matTooltipDisabled]=\"!icon.toolTip && !icon.toolTipField\"\n >\n <ng-container [ngTemplateOutlet]=\"iconoConTamanio\"\n [ngTemplateOutletContext]=\"{icon: icon.icon, iconClass: icon.cssClass, size: (icon.iconSize ?? column.iconsDef?.iconSize)}\"></ng-container>\n </div>\n </ng-template>\n </ng-container>\n </div>\n</ng-template>\n\n<ng-container matColumnDef=\"{{ column.property }}\">\n <!-- Definici\u00F3n del encabezado de la columna -->\n <th *matHeaderCellDef [ngClass]=\"column.cssClassesTH\" class=\"uppercase text-center\" mat-header-cell mat-sort-header\n [disabled]=\"column.sort === false\">\n <span [innerHTML]=\"column.label ?? ''\">{{ column.label }} </span>\n </th>\n\n <!-- Cuerpo de la celda, definido por los hijos -->\n <td *matCellDef=\"let row\" [ngClass]=\"column.cssClasses\" mat-cell (click)=\"accionClick(row, $event)\">\n\n <ng-container [ngTemplateOutlet]=\"cellTemplate\" [ngTemplateOutletContext]=\"{row}\"></ng-container>\n\n </td>\n\n <th *matFooterCellDef [ngClass]=\"column.cssFooterClasses\" mat-footer-cell>\n {{ column.transformarFooter ? column.transformarFooter() : '' }}\n </th>\n</ng-container>\n\n\n<ng-template #iconoConTamanio let-icon=\"icon\" let-iconClass=\"iconClass\" let-size=\"size\">\n <mat-icon *ngIf=\"size\" [svgIcon]=\"icon\" [ngClass]=\"iconClass\" [inline]=\"true\"\n [style.font-size]=\"size\"\n [style.height]=\"size\"\n [style.width]=\"size\"\n ></mat-icon>\n <mat-icon *ngIf=\"!size\" [svgIcon]=\"icon\" [ngClass]=\"iconClass\"></mat-icon>\n</ng-template>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2$1.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i2$1.MatColumnDef, selector: "[matColumnDef]", inputs: ["matColumnDef"] }, { kind: "directive", type: i2$1.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i2$1.MatFooterCellDef, selector: "[matFooterCellDef]" }, { kind: "directive", type: i2$1.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i2$1.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: i3$1.MatSortHeader, selector: "[mat-sort-header]", inputs: ["mat-sort-header", "arrowPosition", "start", "disabled", "sortActionDescription", "disableClear"], exportAs: ["matSortHeader"] }, { kind: "directive", type: i4.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "directive", type: i5.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"] }] });
|
|
697
707
|
}
|
|
698
708
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.7", ngImport: i0, type: ColumnTypeIconsComponent, decorators: [{
|
|
699
709
|
type: Component,
|
|
700
|
-
args: [{ selector: 'jvs-column-type-icons', standalone: false, template: "<ng-template #cellTemplate let-row=\"row\">\n <div class=\"flex items-center justify-center\" [ngClass]=\"{ '-space-x-1': !column.iconsDef?.soloIcono }\"\n >\n <ng-container *ngFor=\"let icon of obtenerItems(column.iconsDef, row)\">\n <ng-container *ngIf=\"!column.iconsDef?.soloIcono; else soloIcono\">\n <button matRipple type=\"button\" *ngIf=\"!icon.esVisible || icon.esVisible(row)\"\n (click)=\"icon.click ? icon.click(row) : false
|
|
710
|
+
args: [{ selector: 'jvs-column-type-icons', standalone: false, template: "<ng-template #cellTemplate let-row=\"row\">\n <div class=\"flex items-center justify-center\" [ngClass]=\"{ '-space-x-1': !column.iconsDef?.soloIcono }\"\n >\n <ng-container *ngFor=\"let icon of obtenerItems(column.iconsDef, row)\">\n <ng-container *ngIf=\"!column.iconsDef?.soloIcono; else soloIcono\">\n <button matRipple type=\"button\" *ngIf=\"!icon.esVisible || icon.esVisible(row)\"\n (click)=\"icon.click ? icon.click(row) : false; $event.stopPropagation()\"\n class=\"flex items-center justify-center p-1 rounded border shadow-sm hover:shadow-lg\"\n [ngClass]=\"icon.contentCss\"\n [matTooltip]=\"icon.toolTip ?? row[icon.toolTipField ?? '_field_']\"\n [matTooltipDisabled]=\"!icon.toolTip && !icon.toolTipField\"\n >\n <ng-container [ngTemplateOutlet]=\"iconoConTamanio\"\n [ngTemplateOutletContext]=\"{icon: icon.icon, iconClass: icon.cssClass, size: (icon.iconSize ?? column.iconsDef?.iconSize)}\"></ng-container>\n </button>\n </ng-container>\n <ng-template #soloIcono>\n <div *ngIf=\"!icon.esVisible || icon.esVisible(row)\" [ngClass]=\"icon.contentCss\"\n class=\"flex items-center\"\n [matTooltip]=\"icon.toolTip ?? row[icon.toolTipField ?? '_field_']\"\n [matTooltipDisabled]=\"!icon.toolTip && !icon.toolTipField\"\n >\n <ng-container [ngTemplateOutlet]=\"iconoConTamanio\"\n [ngTemplateOutletContext]=\"{icon: icon.icon, iconClass: icon.cssClass, size: (icon.iconSize ?? column.iconsDef?.iconSize)}\"></ng-container>\n </div>\n </ng-template>\n </ng-container>\n </div>\n</ng-template>\n\n<ng-container matColumnDef=\"{{ column.property }}\">\n <!-- Definici\u00F3n del encabezado de la columna -->\n <th *matHeaderCellDef [ngClass]=\"column.cssClassesTH\" class=\"uppercase text-center\" mat-header-cell mat-sort-header\n [disabled]=\"column.sort === false\">\n <span [innerHTML]=\"column.label ?? ''\">{{ column.label }} </span>\n </th>\n\n <!-- Cuerpo de la celda, definido por los hijos -->\n <td *matCellDef=\"let row\" [ngClass]=\"column.cssClasses\" mat-cell (click)=\"accionClick(row, $event)\">\n\n <ng-container [ngTemplateOutlet]=\"cellTemplate\" [ngTemplateOutletContext]=\"{row}\"></ng-container>\n\n </td>\n\n <th *matFooterCellDef [ngClass]=\"column.cssFooterClasses\" mat-footer-cell>\n {{ column.transformarFooter ? column.transformarFooter() : '' }}\n </th>\n</ng-container>\n\n\n<ng-template #iconoConTamanio let-icon=\"icon\" let-iconClass=\"iconClass\" let-size=\"size\">\n <mat-icon *ngIf=\"size\" [svgIcon]=\"icon\" [ngClass]=\"iconClass\" [inline]=\"true\"\n [style.font-size]=\"size\"\n [style.height]=\"size\"\n [style.width]=\"size\"\n ></mat-icon>\n <mat-icon *ngIf=\"!size\" [svgIcon]=\"icon\" [ngClass]=\"iconClass\"></mat-icon>\n</ng-template>\n" }]
|
|
701
711
|
}], propDecorators: { column: [{
|
|
702
712
|
type: Input,
|
|
703
713
|
args: [{ required: true }]
|
|
@@ -1155,6 +1165,10 @@ let TablaMantenimientoComponent = class TablaMantenimientoComponent {
|
|
|
1155
1165
|
listaInicial[idx] = mutar;
|
|
1156
1166
|
}
|
|
1157
1167
|
if (btnActual.type == 'custom') {
|
|
1168
|
+
listaInicial[idx].datosExtra = {
|
|
1169
|
+
...listaInicial[idx].datosExtra,
|
|
1170
|
+
tabla_mantenimiento_config_visibleAlias: listaInicial[idx].visible == undefined ? true : listaInicial[idx].visible,
|
|
1171
|
+
};
|
|
1158
1172
|
listaInicial[idx].visible = false;
|
|
1159
1173
|
}
|
|
1160
1174
|
});
|
|
@@ -1229,18 +1243,20 @@ let TablaMantenimientoComponent = class TablaMantenimientoComponent {
|
|
|
1229
1243
|
}
|
|
1230
1244
|
get objVisibleColumns() {
|
|
1231
1245
|
return this.columnasTabla.filter(column => {
|
|
1232
|
-
if (column.
|
|
1233
|
-
column.
|
|
1246
|
+
if (column.noMostrar != undefined) {
|
|
1247
|
+
column.noMostrarEnLista = column.noMostrar;
|
|
1234
1248
|
}
|
|
1249
|
+
return !tipoValorFuncion(column.noMostrarEnLista, false);
|
|
1250
|
+
}).filter(column => {
|
|
1251
|
+
// SECCION MODIFICADOR
|
|
1235
1252
|
if (this.filaExtraTemplate) {
|
|
1236
1253
|
column.sort = false;
|
|
1237
1254
|
}
|
|
1238
|
-
|
|
1255
|
+
// Fin SECCION MODIFICADOR
|
|
1256
|
+
column.visible = tipoValorFuncion(column.visible, true);
|
|
1257
|
+
if (!column.visible && column.esVisible != undefined) {
|
|
1239
1258
|
column.visible = column.esVisible();
|
|
1240
1259
|
}
|
|
1241
|
-
if (column.noMostrar != undefined) {
|
|
1242
|
-
column.visible = !column.noMostrar();
|
|
1243
|
-
}
|
|
1244
1260
|
return column.visible;
|
|
1245
1261
|
});
|
|
1246
1262
|
}
|
|
@@ -1281,6 +1297,7 @@ let TablaMantenimientoComponent = class TablaMantenimientoComponent {
|
|
|
1281
1297
|
return '';
|
|
1282
1298
|
}
|
|
1283
1299
|
condicionesClaseFila = (item) => [];
|
|
1300
|
+
soloIconos = false;
|
|
1284
1301
|
ngOnInit() {
|
|
1285
1302
|
// this.sharedService.dataRutaActual$.pipe(untilDestroyed(this)).subscribe(datRouteData => {
|
|
1286
1303
|
// if (datRouteData) {
|
|
@@ -1331,14 +1348,24 @@ let TablaMantenimientoComponent = class TablaMantenimientoComponent {
|
|
|
1331
1348
|
this.cdRef.detectChanges();
|
|
1332
1349
|
this.columnDefs.forEach(columnDef => {
|
|
1333
1350
|
this.table.addColumnDef(columnDef);
|
|
1334
|
-
|
|
1351
|
+
const col = this.columnasTabla.find(col => col.property == columnDef.name);
|
|
1352
|
+
if (col && col.type == 'custom') {
|
|
1353
|
+
console.warn(JSON.stringify(col));
|
|
1354
|
+
col.visible = col.datosExtra?.tabla_mantenimiento_config_visibleAlias ?? col.visible;
|
|
1355
|
+
delete col.datosExtra?.tabla_mantenimiento_config_visibleAlias;
|
|
1356
|
+
if (Object.keys(col.datosExtra).length < 1) {
|
|
1357
|
+
delete col.datosExtra;
|
|
1358
|
+
}
|
|
1359
|
+
}
|
|
1335
1360
|
});
|
|
1336
1361
|
// console.log(a);
|
|
1337
1362
|
if (this.ctrlBusquedaValue) {
|
|
1338
1363
|
this.cCampoBusqueda.setValue(this.ctrlBusquedaValue);
|
|
1339
1364
|
}
|
|
1365
|
+
this.table.renderRows(); // 🔹 Refrescar la tabla
|
|
1340
1366
|
}
|
|
1341
1367
|
ngOnChanges(changes) {
|
|
1368
|
+
console.warn(changes);
|
|
1342
1369
|
if (changes['botonesCRUD'] || changes['ctrlBusqueda']) {
|
|
1343
1370
|
this.actualizarCrud();
|
|
1344
1371
|
}
|
|
@@ -1689,10 +1716,11 @@ let TablaMantenimientoComponent = class TablaMantenimientoComponent {
|
|
|
1689
1716
|
this.accionRecargar.emit(this.opcFiltroActual);
|
|
1690
1717
|
// this.accionRecargar.emit({ ...this.opcFiltroActual, ...{seleccionado: this.objSeleccionado}});
|
|
1691
1718
|
}
|
|
1719
|
+
tipoValorFuncion = tipoValorFuncion;
|
|
1692
1720
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.7", ngImport: i0, type: TablaMantenimientoComponent, deps: [{ token: i1$2.FormBuilder }, { token: i2$2.Overlay }, { token: i0.ViewContainerRef }, { token: TablaMantenimientoService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
1693
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.1.7", type: TablaMantenimientoComponent, isStandalone: true, selector: "jvs-tabla-mantenimiento", inputs: { virtualScroll: "virtualScroll", itemSize: "itemSize", headerize: "headerize", dataSuscription: "dataSuscription", objThis: "objThis", nombreColeccion: "nombreColeccion", ctrlBusquedaValue: "ctrlBusquedaValue", ctrlBusquedaPlaceholder: "ctrlBusquedaPlaceholder", filtroCampos: "filtroCampos", paginador: "paginador", esTabla: "esTabla", readOnly: "readOnly", filaExtraHeader: "filaExtraHeader", filaFooter: "filaFooter", botonesCRUD: "botonesCRUD", objBotonesCRUD: "objBotonesCRUD", classSeleccionado: "classSeleccionado", classAnulado: "classAnulado", campoAnulado: "campoAnulado", campoAnuladoMensaje: "campoAnuladoMensaje", filaExtraTemplate: "filaExtraTemplate", exportarExcel: "exportarExcel", pageSize: "pageSize", pageSizeOptions: "pageSizeOptions", derechosActuales: "derechosActuales", ctrlBusqueda: "ctrlBusqueda", leyenda: "leyenda", idTabla: "idTabla", columnasTabla: "columnasTabla", botonesMenu: "botonesMenu", condicionesClaseFila: "condicionesClaseFila" }, outputs: { dblclickItem: "dblclickItem", opcionSelecionada: "opcionSelecionada", opcBusqueda: "opcBusqueda", accionRecargar: "accionRecargar", dataSourceChange: "dataSourceChange", resultados: "resultados", resultadosConLabel: "resultadosConLabel", dataFiltro: "dataFiltro" }, host: { properties: { "id": "this.id" }, classAttribute: "jvs-tabla-mantenimiento" }, providers: [
|
|
1721
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.1.7", type: TablaMantenimientoComponent, isStandalone: true, selector: "jvs-tabla-mantenimiento", inputs: { virtualScroll: "virtualScroll", itemSize: "itemSize", headerize: "headerize", dataSuscription: "dataSuscription", objThis: "objThis", nombreColeccion: "nombreColeccion", ctrlBusquedaValue: "ctrlBusquedaValue", ctrlBusquedaPlaceholder: "ctrlBusquedaPlaceholder", filtroCampos: "filtroCampos", paginador: "paginador", esTabla: "esTabla", readOnly: "readOnly", filaExtraHeader: "filaExtraHeader", filaFooter: "filaFooter", botonesCRUD: "botonesCRUD", objBotonesCRUD: "objBotonesCRUD", classSeleccionado: "classSeleccionado", classAnulado: "classAnulado", campoAnulado: "campoAnulado", campoAnuladoMensaje: "campoAnuladoMensaje", filaExtraTemplate: "filaExtraTemplate", exportarExcel: "exportarExcel", pageSize: "pageSize", pageSizeOptions: "pageSizeOptions", derechosActuales: "derechosActuales", ctrlBusqueda: "ctrlBusqueda", leyenda: "leyenda", idTabla: "idTabla", columnasTabla: "columnasTabla", botonesMenu: "botonesMenu", condicionesClaseFila: "condicionesClaseFila", soloIconos: "soloIconos" }, outputs: { dblclickItem: "dblclickItem", opcionSelecionada: "opcionSelecionada", opcBusqueda: "opcBusqueda", accionRecargar: "accionRecargar", dataSourceChange: "dataSourceChange", resultados: "resultados", resultadosConLabel: "resultadosConLabel", dataFiltro: "dataFiltro" }, host: { properties: { "id": "this.id" }, classAttribute: "jvs-tabla-mantenimiento" }, providers: [
|
|
1694
1722
|
{ provide: MAT_PAGINATOR_DEFAULT_OPTIONS, useValue: { formFieldAppearance: 'outline' } }
|
|
1695
|
-
], queries: [{ propertyName: "columnDefs", predicate: MatColumnDef, descendants: true }], viewQueries: [{ propertyName: "paginator", first: true, predicate: MatPaginator, descendants: true }, { propertyName: "sort", first: true, predicate: MatSort, descendants: true }, { propertyName: "table", first: true, predicate: MatTable, descendants: true }, { propertyName: "rowFooter", first: true, predicate: MatFooterRow, descendants: true, read: ElementRef }, { propertyName: "userMenu", first: true, predicate: ["userMenu"], descendants: true }, { propertyName: "rows", predicate: MatRow, descendants: true, read: ElementRef }], usesOnChanges: true, ngImport: i0, template: "<div class=\"flex flex-col h-fit\">\n <div class=\"grow flex items-center justify-between bg-white\">\n <ng-content select=\"[filtro]\"></ng-content>\n </div>\n\n <div class=\"flex flex-col border-t\">\n <div class=\"flex-1 bg-app-bar flex items-center justify-between p-1\">\n <!-- <div class=\"hidden flex-1 sm:flex items-center flex-wrap gap-1\">-->\n <!-- </div>-->\n <div class=\"flex items-center flex-wrap mr-1 h-full\" *ngIf=\"leyenda\">\n <span class=\"font-bold\" [class]=\"leyenda.class\">{{ leyenda.text }}</span>\n </div>\n <div class=\"hidden flex-1 sm:flex items-center flex-wrap gap-1\">\n <div *ngIf=\"(botonesMenuFinal.izquierda ?? []).length > 0 \" class=\" flex items-center flex-wrap contenedor-botones\">\n <ng-container *ngFor=\"let btn of botonesMenu.izquierda; let idx = index;\">\n <ng-container *ngTemplateOutlet=\"botonesSuperiores; context:{btn: btn, idx: {inicio: idx, fin: botonesMenu.izquierda?.length}}\"></ng-container>\n </ng-container>\n </div>\n\n <div *ngIf=\"(botonesMenuFinal.crud ?? []).length > 0\" class=\" flex items-center flex-wrap contenedor-botones\">\n <ng-container *ngFor=\"let btn of botonesMenu.crud; let idx = index;\">\n <ng-container *ngTemplateOutlet=\"botonesSuperiores; context:{btn: btn, idx: {inicio: idx, fin: botonesMenu.crud?.length}}\"></ng-container>\n </ng-container>\n </div>\n\n <div *ngIf=\"(botonesMenuFinal.principal ?? []).length > 0\" class=\" flex items-center flex-wrap contenedor-botones\">\n <ng-container *ngFor=\"let btn of botonesMenu.principal; let idx = index;\">\n <ng-container *ngTemplateOutlet=\"botonesSuperiores; context:{btn: btn, idx: {inicio: idx, fin: botonesMenu.principal?.length}}\"></ng-container>\n </ng-container>\n </div>\n\n <div *ngIf=\"(botonesMenuFinal.derecha ?? []).length > 0\" class=\"flex-auto flex items-center justify-end contenedor-botones\">\n <ng-container *ngFor=\"let btn of botonesMenu.derecha; let idx = index;\">\n <ng-container *ngTemplateOutlet=\"botonesSuperiores; context:{btn: btn, idx: {inicio: idx, fin: botonesMenu.derecha?.length}}\"></ng-container>\n </ng-container>\n </div>\n <ng-content select=\"[objetosMenuPegado]\"></ng-content>\n </div>\n <div class=\"flex flex-1 sm:hidden items-center flex-wrap gap-1\">\n <button class=\"flex items-center justify-center text-2xs leading-none rounded-full p-1\"\n matRipple\n matTooltip=\"Botones de Acci\u00F3n\"\n type=\"button\"\n [matMenuTriggerFor]=\"menuOpciones\"\n >\n <mat-icon class=\"icon-xs\" svgIcon=\"roundMenu\"></mat-icon>\n </button>\n </div>\n <div class=\"flex-none flex items-center justify-end border-l-2\">\n <div class=\"flex-1 sm:flex-none flex items-center justify-end\">\n <ng-content select=\"[objetosMenu]\"></ng-content>\n </div>\n </div>\n <div *ngIf=\"ctrlBusqueda\" class=\"hidden flex-initial sm:flex items-center form-input max-w-[150px] bg-card rounded-full border m-1 px-1 border-l-2\"\n >\n <mat-icon svgIcon=\"roundSearch\" class=\"icon-xs\"></mat-icon>\n <input [formControl]=\"cCampoBusqueda\"\n class=\"text-xs px-1 py-1 border-0 outline-none w-full bg-transparent max-w-sm\"\n [placeholder]=\"ctrlBusquedaPlaceholder\"\n (keyup.enter)=\"ctrlBusqueda == 'query' ? cargarData() : false;\"\n type=\"search\">\n </div>\n <div class=\"flex-none flex items-center justify-end border-l-2\">\n <ng-content select=\"[botonesFiltro]\"></ng-content>\n <button matRipple *ngIf=\"isRecargarUsed || ctrlBusqueda == 'query'\"\n class=\"flex items-center justify-center text-2xs leading-none rounded-full p-1 text-green-700\"\n matTooltip=\"Actualizar datos\"\n (click)=\"(ctrlBusqueda == 'query' ? cargarData() : emitirAccionRecargar())\"\n type=\"button\">\n <mat-icon svgIcon=\"roundRefresh\" class=\"icon-xs\"></mat-icon>\n\n </button>\n <button matRipple [matMenuTriggerFor]=\"columnFilterMenu\" *ngIf=\"filtroCampos\"\n class=\"flex items-center justify-center text-2xs leading-none rounded-full p-1\"\n matTooltip=\"Columnas Filtro\"\n type=\"button\">\n <mat-icon svgIcon=\"roundFilterList\" class=\"icon-xs\"></mat-icon>\n </button>\n </div>\n </div>\n\n <div *ngIf=\"(botonesMenuFinal.secundario ?? []).length > 0\" class=\"flex-1 bg-app-bar flex items-center justify-between p-1 border-t\">\n <div class=\"hidden flex-1 sm:flex items-center flex-wrap gap-1\">\n <div class=\" flex items-center flex-wrap contenedor-botones\">\n <ng-container *ngFor=\"let btn of botonesMenu.secundario; let idx = index;\">\n <ng-container *ngTemplateOutlet=\"botonesSuperiores; context:{btn: btn, idx: {inicio: idx, fin: botonesMenu.secundario?.length}}\"></ng-container>\n </ng-container>\n </div>\n </div>\n </div>\n <!--<div class=\"grow flex flex-col items-stretch contenedor-tabla\" [ngClass]=\"{'table-container overflow-auto': esTabla}\">\n <pre>{{ this.chkLista.modelosChk | json }}</pre>\n <pre>{{ this.chkLista.checkbox.cantidadActivos | json }}</pre>\n <pre>{{ this.chkLista.checkbox.algunosActivos | json }}</pre>\n </div>-->\n <div class=\"grow flex flex-col items-stretch contenedor-tabla\" [ngClass]=\"{'table-container overflow-auto': esTabla}\">\n <ng-content select=\"[cuerpo]\"></ng-content>\n\n <table [id]=\"'tabla_' + nombreColeccion\" [dataSource]=\"dataSource\" [multiTemplateDataRows]=\"true\"\n [hidden]=\"!esTabla\"\n class=\"flex-1 table-mantenimiento table-auto h-fit\" mat-table matSort\n [trackBy]=\"trackByFn\"\n #tablaMantenimiento\n >\n\n <!--<table [dataSource]=\"dataSource\" class=\"table-mantenimiento table-auto h-auto w-full justify-center\" mat-table matSort>-->\n\n\n <ng-content select=\"[tableDefinitions]\"></ng-content>\n <ng-container matColumnDef=\"numeracion_automatica\">\n <th mat-header-cell *matHeaderCellDef style=\"width: 16px !important\">N\u00BA</th>\n <td mat-cell *matCellDef=\"let element; let i = dataIndex\" class=\"p-0 celda-numeracion-fila\">\n <div class=\"flex items-center justify-center font-bold numeracionFila\">\n <ng-container *ngIf=\"esTabla && paginador\">\n {{ (this.paginator?.pageIndex == 0 ? i + 1 : 1 + i + (this.paginator?.pageIndex ?? 1) * (this.paginator?.pageSize ?? 1)) }}\n </ng-container>\n <ng-container *ngIf=\"!paginador\">\n {{ (i + 1) }}\n </ng-container>\n </div>\n </td>\n <td mat-footer-cell *matFooterCellDef class=\"uppercase\"></td>\n </ng-container>\n <jvs-tabla-mantenimiento-column-defs [objThis]=\"this\" [colDetalle]=\"columnasTabla\"\n [nombreColeccion]=\"nombreColeccion\" [(chkLista)]=\"chkLista\"></jvs-tabla-mantenimiento-column-defs>\n\n <tr *matHeaderRowDef=\"visibleColumns; sticky: true\" mat-header-row class=\"title\" matHeader\n [style.height.px]=\"placeholderHeight\"\n ></tr>\n\n <ng-container *ngIf=\"!!filaExtraHeader\">\n <tr mat-row *matRowDef=\"let row; columns: ['filaExtraHeader']\" class=\"student-detail-row\"\n [style.height.px]=\"(virtualScroll ? (itemSize ? itemSize : 0) : 0)\"\n ></tr>\n\n <ng-container matColumnDef=\"filaExtraHeader\">\n <td mat-cell *matCellDef=\"let row; let i = dataIndex\" [attr.colspan]=\"visibleColumns.length\">\n\n <div class=\"row m-0 student-element-detail\"\n [@detailExpand]=\"(i == 0 && filaExtraHeader.esVisible && filaExtraHeader.esVisible()) ? 'expanded' : 'collapsed'\"\n [style.padding-right.px]=\"row.isExpanded ? 5 : 0\"\n [style.padding-left.px]=\"row.isExpanded ? 5 : 0\"\n >\n <ng-container *ngIf=\"filaExtraHeader.template\"\n [ngTemplateOutlet]=\"filaExtraHeader.template\"\n [ngTemplateOutletContext]=\"{ row: row }\"></ng-container>\n </div>\n\n </td>\n </ng-container>\n </ng-container>\n <ng-container *ngIf=\"filaFooter\">\n <tr *matFooterRowDef=\"visibleColumns\" mat-footer-row\n [style.height.px]=\"(virtualScroll ? (itemSize ? itemSize : 0) : 0)\"\n [id]=\"nombreColeccion + '_filaFooter'\"\n ></tr>\n </ng-container>\n\n <!--\t<tr\n *matRowDef=\"let row; columns: visibleColumns;\"\n class=\"hover:bg-secondary trans-ease-out cursor-pointer\"\n mat-row></tr>-->\n <tr\n [matRowKeyboardSelection]=\"tablaMantenimiento\"\n [rowModel]=\"row\"\n (seleccionarSiguiente)=\"opcMenu($event, {seccion: nombreColeccion, tipo: 'ver'});\"\n\n *matRowDef=\"let row; columns: visibleColumns;\"\n (click)=\"seleccionarItem(row); opcMenu(row, {seccion: nombreColeccion, tipo: 'ver'});\"\n (dblclick)=\"opcMenu(row, {seccion: nombreColeccion, tipo: 'seleccionar'}); dblclickItem.emit(row)\"\n (contextmenu)=\"(abrirMenuContextual($event, row)); $event. preventDefault();\"\n [ngClass]=\"classFila(row)\"\n @fadeInUp\n class=\"trans-ease-out cursor-pointer h-auto\"\n [style.height.px]=\"(virtualScroll ? (itemSize ? itemSize : 0) : 0)\"\n [id]=\"propiedadSeleccion(row)\"\n [matTooltip]=\"row[campoAnuladoMensaje ?? '']\"\n matTooltipPosition=\"below\"\n matTooltipClass=\"bg-red-700 text-red-100 m-0\"\n [matTooltipDisabled]=\"!campoAnuladoMensaje || !row[campoAnuladoMensaje]\"\n [class.regAnulado]=\"row[campoAnulado ?? ''] == 1\"\n (keyup.delete)=\"opcMenu(row, {seccion: nombreColeccion, tipo: 'eliminar'})\"\n mat-row></tr>\n <ng-container *ngIf=\"filaExtraTemplate\">\n <tr mat-row *matRowDef=\"let row; columns: ['expandedDetail']\" class=\"student-detail-row h-0\"></tr>\n\n <ng-container matColumnDef=\"expandedDetail\">\n <td mat-cell *matCellDef=\"let row\" [attr.colspan]=\"visibleColumns.length\">\n\n <div class=\"row m-0 student-element-detail\"\n [@detailExpand]=\"row.isExpanded ? 'expanded' : 'collapsed'\"\n [style.padding-right.px]=\"row.isExpanded ? 5 : 0\"\n [style.padding-left.px]=\"row.isExpanded ? 5 : 0\"\n >\n <ng-container [ngTemplateOutlet]=\"filaExtraTemplate\"\n [ngTemplateOutletContext]=\"{ row: row }\"></ng-container>\n </div>\n\n </td>\n </ng-container>\n </ng-container>\n </table>\n\n <ng-container *ngIf=\"componenteCargadoTotalmente\">\n <div *ngIf=\"(noData | async) && esTabla\" class=\"flex-1 text-center text-secondary font-medium\">\n No se encontraron datos\n </div>\n </ng-container>\n </div>\n <ng-content select=\"[appendTable]\"></ng-content>\n <div class=\"flex-1 bg-app-bar flex flex-col sm:flex-row items-start justify-between p-1\">\n <div class=\"flex-1 flex items-start flex-wrap gap-1\">\n <div *ngIf=\"(botonesMenuFinal.inferior ?? []).length > 0\" class=\" flex items-center flex-wrap\">\n <ng-container *ngFor=\"let btn of botonesMenu.inferior; let idx = index;\">\n <ng-container *ngTemplateOutlet=\"botonesSuperiores; context:{btn: btn, idx: {inicio: idx, fin: botonesMenu.inferior?.length}}\"></ng-container>\n </ng-container>\n </div>\n </div>\n\n <div *ngIf=\"esTabla && paginador\" class=\"flex-1 sm:flex-none flex items-center justify-end\">\n <mat-paginator class=\"tabla-mantenimiento-paginador\" [pageSizeOptions]=\"paginacion.pageSizeOptions\" [pageIndex]=\"paginacion.pageIndex - 1\" [length]=\"paginacion.pageLength\" [pageSize]=\"paginacion.pageSize\" (page)=\"paginacion.pageCurrent = $event; emitirResultados();\" ></mat-paginator>\n </div>\n </div>\n </div>\n\n</div>\n\n\n\n<!-- SECCION DE TEMPLATES O MENUS -->\n\n\n<mat-menu #columnFilterMenu=\"matMenu\" xPosition=\"before\" yPosition=\"below\">\n <ng-container *ngFor=\"let column of columnasTabla\">\n <button (click)=\"toggleColumnVisibility(column, $event)\" *ngIf=\"!column.noMostrar || !column.noMostrar()\"\n class=\"checkbox-item mat-menu-item\">\n <mat-checkbox (click)=\"$event.stopPropagation()\" [(ngModel)]=\"column.visible\" [ngModelOptions]=\"{standalone: true}\" color=\"primary\">\n <span [innerHTML]=\"(column.labelLista ?? column.label).replace('<br>', ' ')\"></span>\n </mat-checkbox>\n </button>\n </ng-container>\n</mat-menu>\n\n\n\n\n\n\n<ng-template #botonesSuperiores let-btn=\"btn\" let-idx=\"idx\">\n <ng-container *ngTemplateOutlet=\"botonesContextual; context:{btn: btn, item: objSeleccionado, barraSuperior: true, idx: idx}\"></ng-container>\n</ng-template>\n\n<ng-template #botonesContextual let-btn=\"btn\" let-item=\"item\" let-barraSuperior=\"barraSuperior\" let-idx=\"idx\">\n\n <ng-container *ngIf=\"barraSuperior; else noBarraSuperior\">\n\n <!--\t\t<button mat-button style=\"min-width: unset; border: 1px !important;\" class=\"uppercase border border-gray rounded-none h-full px-1 disabled:opacity-50 disabled:text-secondary disabled:bg-transparent\">-->\n <!--\t\t\t<mat-icon *ngIf=\"btn.icono\" [svgIcon]=\"btn.icono\" size=\"15px\" class=\"icon-xs\"></mat-icon>-->\n <!--\t\t</button>-->\n <ng-container *ngIf=\"btn.subItems && btn.subItems.length > 0\">\n <button matRipple [matRippleUnbounded]=\"false\" class=\"flex items-center justify-between uppercase text-2xs leading-none rounded-none px-2 py-1 bg-opacity-95 hover:bg-opacity-100 disabled:opacity-50 disabled:text-secondary disabled:!bg-gray-300 dark:disabled:!bg-gray-500 mat-elevation-z2\" type=\"button\"\n\n *ngIf=\"(!btn.esVisible || btn.esVisible(item, this)) && subItemsActivos(btn, item)\"\n [class]=\"(btn.class?btn.class:'')\"\n\n (click)=\"opcMenu(item, btn)\"\n [style.min-width]=\"(btn.soloIcono ? 'unset' : '')\"\n [matTooltip]=\"btn.tooltip || (btn.label ? btn.label : ( (derechosActuales && derechosActuales[btn.cDerechoCodigo ?? btn.tipo]) ? derechosActuales[btn.cDerechoCodigo ?? btn.tipo]['cDerechoNombre'] : capitalizarTexto(btn.tipo))) \"\n [matMenuTriggerFor]=\"menuOtrosBarra.menu\"\n\n [matBadge]=\"btn.badge\"\n matBadgeSize=\"small\"\n >\n <mat-icon class=\"icon-xs\" [class.mr-0.5]=\"!btn.soloIcono\" *ngIf=\"btn.icono\" [svgIcon]=\"btn.icono\" ></mat-icon>\n <span class=\"whitespace-nowrap\" *ngIf=\"!btn.soloIcono\">{{ btn.label ? btn.label : ( (derechosActuales && derechosActuales[btn.cDerechoCodigo ?? btn.tipo]) ? derechosActuales[btn.cDerechoCodigo ?? btn.tipo]['cDerechoNombre'] : capitalizarTexto(btn.tipo)) }}</span>\n <mat-icon class=\"icon-xs\" svgIcon=\"fa5sCaretDown\" ></mat-icon>\n </button>\n\n <jvs-tabla-mantenimiento-menu #menuOtrosBarra\n [objThis]=\"objThis\"\n [nombreColeccion]=\"nombreColeccion\"\n [item]=\"item\"\n [derechosActuales]=\"derechosActuales\"\n [subItems]=\"btn.subItems\"\n (opcionSelecionada)=\"opcMenu($event.item, $event.btn)\"\n [botonTemplate]=\"botonesContextual\"\n >\n </jvs-tabla-mantenimiento-menu>\n </ng-container>\n <ng-container *ngIf=\"!btn.subItems || btn.subItems.length == 0\">\n <button class=\"flex items-center justify-between uppercase text-2xs leading-none rounded-none px-2 py-1 bg-opacity-95 hover:bg-opacity-100 disabled:opacity-50 disabled:text-secondary disabled:!bg-gray-300 dark:disabled:!bg-gray-500 mat-elevation-z2\" type=\"button\"\n\n *ngIf=\"!btn.esVisible || btn.esVisible(item, this)\"\n [class]=\"(btn.class?btn.class:'text-secondary')\"\n [ngClass]=\"{'text-secondary italic': !ignorarDerechos && !btn.esIndependiente && (!btn.ignorarDerecho && (!derechosActuales || !derechosActuales[btn.cDerechoCodigo ?? btn.tipo])) && !(['nuevo', 'editar', 'eliminar'].includes(btn.tipo))}\"\n [disabled]=\"!btn.esIndependiente && botonDisabled(btn, item)\"\n (click)=\"opcMenu(item, btn)\"\n [style.min-width]=\"(btn.soloIcono ? 'unset' : '')\"\n [matTooltip]=\"btn.tooltip || (btn.label ? btn.label : ( (derechosActuales && derechosActuales[btn.cDerechoCodigo ?? btn.tipo]) ? derechosActuales[btn.cDerechoCodigo ?? btn.tipo]['cDerechoNombre'] : capitalizarTexto(btn.tipo))) \"\n\n [matBadge]=\"btn.badge\"\n matBadgeSize=\"small\"\n >\n <mat-icon class=\"icon-xs\" [class.mr-0.5]=\"!btn.soloIcono\" *ngIf=\"btn.icono\" [svgIcon]=\"btn.icono\"></mat-icon>\n <span class=\"whitespace-nowrap\" *ngIf=\"!btn.soloIcono\">{{ btn.label ? btn.label : ( (derechosActuales && derechosActuales[btn.cDerechoCodigo ?? btn.tipo]) ? derechosActuales[btn.cDerechoCodigo ?? btn.tipo]['cDerechoNombre'] : capitalizarTexto(btn.tipo)) }}</span>\n </button>\n\n </ng-container>\n\n </ng-container>\n <ng-template #noBarraSuperior>\n\n <ng-container *ngIf=\"btn.subItems && btn.subItems.length > 0\">\n <button class=\"flex items-center justify-between uppercase w-full rounded-none px-2 disabled:opacity-50 disabled:text-secondary disabled:bg-transparent\" mat-menu-item type=\"button\"\n *ngIf=\"!btn.noContextual && (!btn.esVisible || btn.esVisible(item, this))\"\n [class]=\"(btn.class?btn.class.replace('text-white', '').replace('bg', 'text'):'text-secondary')\"\n [ngClass]=\"{'text-secondary italic': !ignorarDerechos && !btn.esIndependiente && (!btn.ignorarDerecho && (!derechosActuales || !derechosActuales[btn.cDerechoCodigo ?? btn.tipo]))}\"\n [disabled]=\"!btn.esIndependiente && botonDisabled(btn, item)\"\n (click)=\"opcMenu(item, btn); $event.stopPropagation();\"\n [matMenuTriggerFor]=\"menuOtrosBarra.menu\"\n >\n <div class=\"flex w-full items-center justify-between uppercase text-2xs\"\n >\n <mat-icon *ngIf=\"btn.icono\" [svgIcon]=\"btn.icono\"\n class=\"flex-none icon-xs\"\n ></mat-icon>\n <span class=\"grow text-2xs\">{{ btn.label ? btn.label : ( (derechosActuales && derechosActuales[btn.cDerechoCodigo ?? btn.tipo]) ? derechosActuales[btn.cDerechoCodigo ?? btn.tipo]['cDerechoNombre'] : capitalizarTexto(btn.tipo)) }}</span>\n <mat-icon class=\"flex-none icon-xs\" svgIcon=\"fa5sCaretRight\"></mat-icon>\n </div>\n </button>\n\n <jvs-tabla-mantenimiento-menu #menuOtrosBarra\n [objThis]=\"objThis\"\n [nombreColeccion]=\"nombreColeccion\"\n [item]=\"item\"\n [derechosActuales]=\"derechosActuales\"\n [subItems]=\"btn.subItems\"\n (opcionSelecionada)=\"opcMenu($event.item, $event.btn)\"\n [botonTemplate]=\"botonesContextual\"\n >\n </jvs-tabla-mantenimiento-menu>\n </ng-container>\n <ng-container *ngIf=\"!btn.subItems || btn.subItems.length == 0\">\n <ng-container *ngIf=\"btn.tipo == '-#SEPARADOR#-'; else itemsNormales\">\n <mat-divider></mat-divider>\n </ng-container>\n <ng-template #itemsNormales>\n <button class=\"flex items-center justify-between uppercase w-full rounded-none px-2 disabled:opacity-50 disabled:text-secondary disabled:bg-transparent\" mat-menu-item type=\"button\"\n *ngIf=\"!btn.noContextual && (!btn.esVisible || btn.esVisible(item, this))\"\n [class]=\"(btn.class?btn.class.replace('text-white', '').replace('bg', 'text'):'text-secondary')\"\n [ngClass]=\"{'text-secondary italic': !ignorarDerechos && !btn.esIndependiente && (!btn.ignorarDerecho && (!derechosActuales || !derechosActuales[btn.cDerechoCodigo ?? btn.tipo]))}\"\n [disabled]=\"!btn.esIndependiente && botonDisabled(btn, item)\"\n (click)=\"opcMenu(item, btn)\"\n >\n <div class=\"flex w-full items-center justify-between uppercase text-2xs\">\n <mat-icon *ngIf=\"btn.icono\" [svgIcon]=\"btn.icono\" class=\"flex-none icon-xs\"\n ></mat-icon>\n <span class=\"grow text-2xs\">{{ btn.label ? btn.label : ( (derechosActuales && derechosActuales[btn.cDerechoCodigo ?? btn.tipo]) ? derechosActuales[btn.cDerechoCodigo ?? btn.tipo]['cDerechoNombre'] : capitalizarTexto(btn.tipo)) }}</span>\n </div>\n </button>\n </ng-template>\n\n </ng-container>\n\n </ng-template>\n\n</ng-template>\n\n<ng-template #userMenu let-item=\"item\">\n <div class=\"mat-menu bg-white rounded mat-elevation-z8 shadow botonesContextual\">\n <ng-container *ngFor=\"let btn of listaMenuCompleto\">\n <ng-container *ngTemplateOutlet=\"botonesContextual; context:{btn: btn, item: objSeleccionado, barraSuperior: false}\"></ng-container>\n </ng-container>\n </div>\n</ng-template>\n\n\n<mat-menu #menuOpciones=\"matMenu\" xPosition=\"before\" yPosition=\"below\">\n <ng-container *ngFor=\"let btn of listaMenuCompleto\">\n <ng-container\n *ngTemplateOutlet=\"botonesContextual; context:{btn: btn, item: objSeleccionado, barraSuperior: false}\"></ng-container>\n </ng-container>\n</mat-menu>\n", styles: [":root{--tabla-mantenimiento-seleccion-fondo: rgb(179, 217, 252);--tabla-mantenimiento-seleccion-texto: rgb(1, 84, 164);--mat-paginator-container-size: 30px}:root .table-mantenimiento .elemento-seleccionado{background-color:var(--tabla-mantenimiento-seleccion-fondo)!important;color:var(--tabla-mantenimiento-seleccion-texto)!important;border-color:var(--tabla-mantenimiento-seleccion-texto)!important}.jvs-tabla-mantenimiento{width:inherit}.jvs-tabla-mantenimiento .contenedor-botones>*:first-child{@apply rounded-l;}.jvs-tabla-mantenimiento .contenedor-botones>*:last-child{@apply rounded-r;}.jvs-tabla-mantenimiento .mat-mdc-menu-content:not(:empty){@apply flex flex-col items-start;padding:0!important}.jvs-tabla-mantenimiento .mat-mdc-menu-item{line-height:24px!important;height:24px!important;min-height:24px!important}.jvs-tabla-mantenimiento .mat-mdc-menu-panel{min-height:auto!important}.jvs-tabla-mantenimiento .mat-mdc-table .mat-mdc-cell,.jvs-tabla-mantenimiento .mat-mdc-table .mat-mdc-header-cell .mat-mdc-footer-cell{white-space:unset}.jvs-tabla-mantenimiento .table-container{max-height:600px!important}.jvs-tabla-mantenimiento .table-mantenimiento .mat-mdc-table-sticky-border-elem-right{border-left:1px solid #e0e0e0}.jvs-tabla-mantenimiento .table-mantenimiento .mat-mdc-table-sticky-border-elem-left{border-right:1px solid #e0e0e0}.jvs-tabla-mantenimiento .table-mantenimiento tr.regAnulado .mat-mdc-cell{color:unset!important}.jvs-tabla-mantenimiento .table-mantenimiento .bg-primary-activo .numeracionFila{@apply rounded-full bg-primary-contrast text-primary mx-1 p-1 w-6 h-6;}.jvs-tabla-mantenimiento .table-mantenimiento th .form-input{@apply w-auto;}.jvs-tabla-mantenimiento .table-mantenimiento th.mat-mdc-header-cell,.jvs-tabla-mantenimiento .table-mantenimiento td.mat-mdc-cell,.jvs-tabla-mantenimiento .table-mantenimiento td.mat-mdc-footer-cell{border-width:1px;border-style:solid}.jvs-tabla-mantenimiento .table-mantenimiento th.mat-mdc-header-cell:not(.celda-numeracion-fila),.jvs-tabla-mantenimiento .table-mantenimiento td.mat-mdc-cell:not(.celda-numeracion-fila),.jvs-tabla-mantenimiento .table-mantenimiento td.mat-mdc-footer-cell:not(.celda-numeracion-fila){padding:.05rem .25rem}.jvs-tabla-mantenimiento .table-mantenimiento th.mat-mdc-header-cell:first-of-type:not(.celda-numeracion-fila),.jvs-tabla-mantenimiento .table-mantenimiento th.mat-mdc-header-cell:last-of-type:not(.celda-numeracion-fila),.jvs-tabla-mantenimiento .table-mantenimiento td.mat-mdc-cell:first-of-type:not(.celda-numeracion-fila),.jvs-tabla-mantenimiento .table-mantenimiento td.mat-mdc-cell:last-of-type:not(.celda-numeracion-fila),.jvs-tabla-mantenimiento .table-mantenimiento td.mat-mdc-footer-cell:first-of-type:not(.celda-numeracion-fila),.jvs-tabla-mantenimiento .table-mantenimiento td.mat-mdc-footer-cell:last-of-type:not(.celda-numeracion-fila){padding:0 .25rem}.jvs-tabla-mantenimiento .table-mantenimiento .student-element-detail{overflow:hidden;display:flex;align-items:center;justify-content:center}.jvs-tabla-mantenimiento .table-mantenimiento .mat-mdc-header-row{height:25px!important;color:rgb(var(--color-primary))!important;background-color:rgb(var(--color-primary-contrast))!important}.jvs-tabla-mantenimiento .table-mantenimiento .mat-mdc-header-cell{padding:5px;font-size:10px;line-height:10px;font-weight:700!important;color:inherit}.jvs-tabla-mantenimiento .table-mantenimiento .mdc-data-table__row:not(.mdc-data-table__row--selected):not(.elemento-seleccionado):hover,.jvs-tabla-mantenimiento .table-mantenimiento .mdc-data-table__row:not(.mdc-data-table__row--selected):not(.elemento-seleccionado):focus{background-color:rgba(var(--color-primary-contrast),.04)}.jvs-tabla-mantenimiento .table-mantenimiento .mat-mdc-row .mat-mdc-cell,.jvs-tabla-mantenimiento .table-mantenimiento .mat-mdc-footer-row .mat-mdc-cell{font-size:10px}.jvs-tabla-mantenimiento .table-mantenimiento .mat-mdc-row .mat-mdc-footer-cell:empty,.jvs-tabla-mantenimiento .table-mantenimiento .mat-mdc-footer-row .mat-mdc-footer-cell:empty{border-width:0!important}.jvs-tabla-mantenimiento .table-mantenimiento .mat-mdc-cell{@apply leading-tight;}.jvs-tabla-mantenimiento .table-mantenimiento th.mat-mdc-header-cell{border-color:#d4d0d0;@apply text-center uppercase;}.jvs-tabla-mantenimiento .table-mantenimiento th.mat-mdc-header-cell .mat-sort-header-container{@apply flex items-center justify-between w-full;}.jvs-tabla-mantenimiento .table-mantenimiento th.mat-mdc-header-cell .mat-sort-header-container .mat-sort-header-content{@apply inline w-full text-center;}.jvs-tabla-mantenimiento .table-mantenimiento th.mat-mdc-header-cell .mat-sort-header-container .mat-sort-header-arrow{@apply flex-none;}.jvs-tabla-mantenimiento .table-mantenimiento .mat-mdc-sort-header-content{width:100%;text-align:center;display:unset;align-items:center}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "ngmodule", type: FormsModule }, { 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: "ngmodule", type: MatCheckboxModule }, { kind: "component", type: i3$2.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: "ngmodule", type: MatDividerModule }, { kind: "component", type: i6.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatMenuModule }, { kind: "component", type: i8.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: i8.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i8.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "ngmodule", type: MatPaginatorModule }, { kind: "component", type: i9.MatPaginator, selector: "mat-paginator", inputs: ["color", "pageIndex", "length", "pageSize", "pageSizeOptions", "hidePageSize", "showFirstLastButtons", "selectConfig", "disabled"], outputs: ["page"], exportAs: ["matPaginator"] }, { kind: "ngmodule", type: MatRippleModule }, { kind: "directive", type: i5.MatRipple, selector: "[mat-ripple], [matRipple]", inputs: ["matRippleColor", "matRippleUnbounded", "matRippleCentered", "matRippleRadius", "matRippleAnimation", "matRippleDisabled", "matRippleTrigger"], exportAs: ["matRipple"] }, { kind: "ngmodule", type: MatSortModule }, { kind: "directive", type: i3$1.MatSort, selector: "[matSort]", inputs: ["matSortActive", "matSortStart", "matSortDirection", "matSortDisableClear", "matSortDisabled"], outputs: ["matSortChange"], exportAs: ["matSort"] }, { kind: "ngmodule", type: MatTableModule }, { kind: "component", type: i2$1.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i2$1.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i2$1.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i2$1.MatColumnDef, selector: "[matColumnDef]", inputs: ["matColumnDef"] }, { kind: "directive", type: i2$1.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i2$1.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i2$1.MatFooterCellDef, selector: "[matFooterCellDef]" }, { kind: "directive", type: i2$1.MatFooterRowDef, selector: "[matFooterRowDef]", inputs: ["matFooterRowDef", "matFooterRowDefSticky"] }, { kind: "directive", type: i2$1.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i2$1.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "directive", type: i2$1.MatFooterCell, selector: "mat-footer-cell, td[mat-footer-cell]" }, { kind: "component", type: i2$1.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i2$1.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "component", type: i2$1.MatFooterRow, selector: "mat-footer-row, tr[mat-footer-row]", exportAs: ["matFooterRow"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i4.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: TablaMantenimientoColumnDefsComponent, selector: "jvs-tabla-mantenimiento-column-defs", inputs: ["objThis", "nombreColeccion", "colDetalle", "chkLista"], outputs: ["chkListaChange"] }, { kind: "ngmodule", type: MatBadgeModule }, { kind: "directive", type: i14.MatBadge, selector: "[matBadge]", inputs: ["matBadgeColor", "matBadgeOverlap", "matBadgeDisabled", "matBadgePosition", "matBadge", "matBadgeDescription", "matBadgeSize", "matBadgeHidden"] }, { kind: "component", type: TablaMantenimientoMenuComponent, selector: "jvs-tabla-mantenimiento-menu", inputs: ["objThis", "nombreColeccion", "item", "derechosActuales", "subItems", "botonTemplate"], outputs: ["opcionSelecionada"] }, { kind: "directive", type: MatRowKeyboardSelectionDirective, selector: "[matRowKeyboardSelection]", inputs: ["matRowKeyboardSelection", "rowModel"], outputs: ["seleccionarSiguiente"] }], animations: [
|
|
1723
|
+
], queries: [{ propertyName: "columnDefs", predicate: MatColumnDef, descendants: true }], viewQueries: [{ propertyName: "paginator", first: true, predicate: MatPaginator, descendants: true }, { propertyName: "sort", first: true, predicate: MatSort, descendants: true }, { propertyName: "table", first: true, predicate: MatTable, descendants: true }, { propertyName: "rowFooter", first: true, predicate: MatFooterRow, descendants: true, read: ElementRef }, { propertyName: "userMenu", first: true, predicate: ["userMenu"], descendants: true }, { propertyName: "rows", predicate: MatRow, descendants: true, read: ElementRef }], usesOnChanges: true, ngImport: i0, template: "<div class=\"flex flex-col h-fit\">\n <div class=\"grow flex items-center justify-between bg-white\">\n <ng-content select=\"[filtro]\"></ng-content>\n </div>\n\n <div class=\"flex flex-col border-t\">\n <div class=\"flex-1 bg-app-bar flex items-center justify-between p-1\">\n <!-- <div class=\"hidden flex-1 sm:flex items-center flex-wrap gap-1\">-->\n <!-- </div>-->\n <div class=\"flex items-center flex-wrap mr-1 h-full\" *ngIf=\"leyenda\">\n <span class=\"font-bold\" [class]=\"leyenda.class\">{{ leyenda.text }}</span>\n </div>\n <div class=\"hidden flex-1 sm:flex items-center flex-wrap gap-1\">\n <div *ngIf=\"(botonesMenuFinal.izquierda ?? []).length > 0 \" class=\" flex items-center flex-wrap contenedor-botones\">\n <ng-container *ngFor=\"let btn of botonesMenu.izquierda; let idx = index;\">\n <ng-container *ngTemplateOutlet=\"botonesSuperiores; context:{btn: btn, idx: {inicio: idx, fin: botonesMenu.izquierda?.length}}\"></ng-container>\n </ng-container>\n </div>\n\n <div *ngIf=\"(botonesMenuFinal.crud ?? []).length > 0\" class=\" flex items-center flex-wrap contenedor-botones\">\n <ng-container *ngFor=\"let btn of botonesMenu.crud; let idx = index;\">\n <ng-container *ngTemplateOutlet=\"botonesSuperiores; context:{btn: btn, idx: {inicio: idx, fin: botonesMenu.crud?.length}}\"></ng-container>\n </ng-container>\n </div>\n\n <div *ngIf=\"(botonesMenuFinal.principal ?? []).length > 0\" class=\" flex items-center flex-wrap contenedor-botones\">\n <ng-container *ngFor=\"let btn of botonesMenu.principal; let idx = index;\">\n <ng-container *ngTemplateOutlet=\"botonesSuperiores; context:{btn: btn, idx: {inicio: idx, fin: botonesMenu.principal?.length}}\"></ng-container>\n </ng-container>\n </div>\n\n <div *ngIf=\"(botonesMenuFinal.derecha ?? []).length > 0\" class=\"flex-auto flex items-center justify-end contenedor-botones\">\n <ng-container *ngFor=\"let btn of botonesMenu.derecha; let idx = index;\">\n <ng-container *ngTemplateOutlet=\"botonesSuperiores; context:{btn: btn, idx: {inicio: idx, fin: botonesMenu.derecha?.length}}\"></ng-container>\n </ng-container>\n </div>\n <ng-content select=\"[objetosMenuPegado]\"></ng-content>\n </div>\n <div class=\"flex flex-1 sm:hidden items-center flex-wrap gap-1\">\n <button class=\"flex items-center justify-center text-2xs leading-none rounded-full p-1\"\n matRipple\n matTooltip=\"Botones de Acci\u00F3n\"\n type=\"button\"\n [matMenuTriggerFor]=\"menuOpciones\"\n >\n <mat-icon class=\"icon-xs\" svgIcon=\"roundMenu\"></mat-icon>\n </button>\n </div>\n <div class=\"flex-none flex items-center justify-end border-l-2\">\n <div class=\"flex-1 sm:flex-none flex items-center justify-end\">\n <ng-content select=\"[objetosMenu]\"></ng-content>\n </div>\n </div>\n <div *ngIf=\"ctrlBusqueda\" class=\"hidden flex-initial sm:flex items-center form-input max-w-[150px] bg-card rounded-full border m-1 px-1 border-l-2\"\n >\n <mat-icon svgIcon=\"roundSearch\" class=\"icon-xs\"></mat-icon>\n <input [formControl]=\"cCampoBusqueda\"\n class=\"text-xs px-1 py-1 border-0 outline-none w-full bg-transparent max-w-sm\"\n [placeholder]=\"ctrlBusquedaPlaceholder\"\n (keyup.enter)=\"ctrlBusqueda == 'query' ? cargarData() : false;\"\n type=\"search\">\n </div>\n <div class=\"flex-none flex items-center justify-end border-l-2\">\n <ng-content select=\"[botonesFiltro]\"></ng-content>\n <button matRipple *ngIf=\"isRecargarUsed || ctrlBusqueda == 'query'\"\n class=\"flex items-center justify-center text-2xs leading-none rounded-full p-1 text-green-700\"\n matTooltip=\"Actualizar datos\"\n (click)=\"(ctrlBusqueda == 'query' ? cargarData() : emitirAccionRecargar())\"\n type=\"button\">\n <mat-icon svgIcon=\"roundRefresh\" class=\"icon-xs\"></mat-icon>\n\n </button>\n <button matRipple [matMenuTriggerFor]=\"columnFilterMenu\" *ngIf=\"filtroCampos\"\n class=\"flex items-center justify-center text-2xs leading-none rounded-full p-1\"\n matTooltip=\"Columnas Filtro\"\n type=\"button\">\n <mat-icon svgIcon=\"roundFilterList\" class=\"icon-xs\"></mat-icon>\n </button>\n </div>\n </div>\n\n <div *ngIf=\"(botonesMenuFinal.secundario ?? []).length > 0\" class=\"flex-1 bg-app-bar flex items-center justify-between p-1 border-t\">\n <div class=\"hidden flex-1 sm:flex items-center flex-wrap gap-1\">\n <div class=\" flex items-center flex-wrap contenedor-botones\">\n <ng-container *ngFor=\"let btn of botonesMenu.secundario; let idx = index;\">\n <ng-container *ngTemplateOutlet=\"botonesSuperiores; context:{btn: btn, idx: {inicio: idx, fin: botonesMenu.secundario?.length}}\"></ng-container>\n </ng-container>\n </div>\n </div>\n </div>\n <!--<div class=\"grow flex flex-col items-stretch contenedor-tabla\" [ngClass]=\"{'table-container overflow-auto': esTabla}\">\n <pre>{{ this.chkLista.modelosChk | json }}</pre>\n <pre>{{ this.chkLista.checkbox.cantidadActivos | json }}</pre>\n <pre>{{ this.chkLista.checkbox.algunosActivos | json }}</pre>\n </div>-->\n <div class=\"grow flex flex-col items-stretch contenedor-tabla\" [ngClass]=\"{'table-container overflow-auto': esTabla}\">\n <ng-content select=\"[cuerpo]\"></ng-content>\n\n <table [id]=\"'tabla_' + nombreColeccion\" [dataSource]=\"dataSource\" [multiTemplateDataRows]=\"true\"\n [hidden]=\"!esTabla\"\n class=\"flex-1 table-mantenimiento table-auto h-fit\" mat-table matSort\n [trackBy]=\"trackByFn\"\n #tablaMantenimiento\n >\n\n <!--<table [dataSource]=\"dataSource\" class=\"table-mantenimiento table-auto h-auto w-full justify-center\" mat-table matSort>-->\n\n\n <ng-content select=\"[tableDefinitions]\"></ng-content>\n <ng-container matColumnDef=\"numeracion_automatica\">\n <th mat-header-cell *matHeaderCellDef style=\"width: 16px !important\">N\u00BA</th>\n <td mat-cell *matCellDef=\"let element; let i = dataIndex\" class=\"p-0 celda-numeracion-fila\">\n <div class=\"flex items-center justify-center font-bold numeracionFila\">\n <ng-container *ngIf=\"esTabla && paginador\">\n {{ (this.paginator?.pageIndex == 0 ? i + 1 : 1 + i + (this.paginator?.pageIndex ?? 1) * (this.paginator?.pageSize ?? 1)) }}\n </ng-container>\n <ng-container *ngIf=\"!paginador\">\n {{ (i + 1) }}\n </ng-container>\n </div>\n </td>\n <td mat-footer-cell *matFooterCellDef class=\"uppercase\"></td>\n </ng-container>\n <jvs-tabla-mantenimiento-column-defs [objThis]=\"this\" [colDetalle]=\"columnasTabla\"\n [nombreColeccion]=\"nombreColeccion\" [(chkLista)]=\"chkLista\"></jvs-tabla-mantenimiento-column-defs>\n\n <tr *matHeaderRowDef=\"visibleColumns; sticky: true\" mat-header-row class=\"title\" matHeader\n [style.height.px]=\"placeholderHeight\"\n ></tr>\n\n <ng-container *ngIf=\"!!filaExtraHeader\">\n <tr mat-row *matRowDef=\"let row; columns: ['filaExtraHeader']\" class=\"student-detail-row\"\n [style.height.px]=\"(virtualScroll ? (itemSize ? itemSize : 0) : 0)\"\n ></tr>\n\n <ng-container matColumnDef=\"filaExtraHeader\">\n <td mat-cell *matCellDef=\"let row; let i = dataIndex\" [attr.colspan]=\"visibleColumns.length\">\n\n <div class=\"row m-0 student-element-detail\"\n [@detailExpand]=\"(i == 0 && filaExtraHeader.esVisible && filaExtraHeader.esVisible()) ? 'expanded' : 'collapsed'\"\n [style.padding-right.px]=\"row.isExpanded ? 5 : 0\"\n [style.padding-left.px]=\"row.isExpanded ? 5 : 0\"\n >\n <ng-container *ngIf=\"filaExtraHeader.template\"\n [ngTemplateOutlet]=\"filaExtraHeader.template\"\n [ngTemplateOutletContext]=\"{ row: row }\"></ng-container>\n </div>\n\n </td>\n </ng-container>\n </ng-container>\n <ng-container *ngIf=\"filaFooter\">\n <tr *matFooterRowDef=\"visibleColumns\" mat-footer-row\n [style.height.px]=\"(virtualScroll ? (itemSize ? itemSize : 0) : 0)\"\n [id]=\"nombreColeccion + '_filaFooter'\"\n ></tr>\n </ng-container>\n\n <!--\t<tr\n *matRowDef=\"let row; columns: visibleColumns;\"\n class=\"hover:bg-secondary trans-ease-out cursor-pointer\"\n mat-row></tr>-->\n <tr\n [matRowKeyboardSelection]=\"tablaMantenimiento\"\n [rowModel]=\"row\"\n (seleccionarSiguiente)=\"opcMenu($event, {seccion: nombreColeccion, tipo: 'ver'});\"\n\n *matRowDef=\"let row; let idxTabla = dataIndex; columns: visibleColumns;\"\n (click)=\"seleccionarItem(row); opcMenu(row, {seccion: nombreColeccion, tipo: 'ver', tableDataIndex: idxTabla });\"\n (dblclick)=\"opcMenu(row, {seccion: nombreColeccion, tipo: 'seleccionar'}); dblclickItem.emit(row)\"\n (contextmenu)=\"(abrirMenuContextual($event, row)); $event. preventDefault();\"\n [ngClass]=\"classFila(row)\"\n @fadeInUp\n class=\"trans-ease-out cursor-pointer h-auto\"\n [style.height.px]=\"(virtualScroll ? (itemSize ? itemSize : 0) : 0)\"\n [id]=\"propiedadSeleccion(row)\"\n [matTooltip]=\"row[campoAnuladoMensaje ?? '']\"\n matTooltipPosition=\"below\"\n matTooltipClass=\"bg-red-700 text-red-100 m-0\"\n [matTooltipDisabled]=\"!campoAnuladoMensaje || !row[campoAnuladoMensaje]\"\n [class.regAnulado]=\"row[campoAnulado ?? ''] == 1\"\n (keyup.delete)=\"opcMenu(row, {seccion: nombreColeccion, tipo: 'eliminar'})\"\n mat-row></tr>\n <ng-container *ngIf=\"filaExtraTemplate\">\n <tr mat-row *matRowDef=\"let row; columns: ['expandedDetail']\" class=\"student-detail-row h-0\"></tr>\n\n <ng-container matColumnDef=\"expandedDetail\">\n <td mat-cell *matCellDef=\"let row\" [attr.colspan]=\"visibleColumns.length\">\n\n <div class=\"row m-0 student-element-detail\"\n [@detailExpand]=\"row.isExpanded ? 'expanded' : 'collapsed'\"\n [style.padding-right.px]=\"row.isExpanded ? 5 : 0\"\n [style.padding-left.px]=\"row.isExpanded ? 5 : 0\"\n >\n <ng-container [ngTemplateOutlet]=\"filaExtraTemplate\"\n [ngTemplateOutletContext]=\"{ row: row }\"></ng-container>\n </div>\n\n </td>\n </ng-container>\n </ng-container>\n </table>\n\n <ng-container *ngIf=\"componenteCargadoTotalmente\">\n <div *ngIf=\"(noData | async) && esTabla\" class=\"flex-1 text-center text-secondary font-medium\">\n No se encontraron datos\n </div>\n </ng-container>\n </div>\n <ng-content select=\"[appendTable]\"></ng-content>\n <div class=\"flex-1 bg-app-bar flex flex-col sm:flex-row items-start justify-between p-1\">\n <div class=\"flex-1 flex items-start flex-wrap gap-1\">\n <div *ngIf=\"(botonesMenuFinal.inferior ?? []).length > 0\" class=\" flex items-center flex-wrap\">\n <ng-container *ngFor=\"let btn of botonesMenu.inferior; let idx = index;\">\n <ng-container *ngTemplateOutlet=\"botonesSuperiores; context:{btn: btn, idx: {inicio: idx, fin: botonesMenu.inferior?.length}}\"></ng-container>\n </ng-container>\n </div>\n </div>\n\n <div *ngIf=\"esTabla && paginador\" class=\"flex-1 sm:flex-none flex items-center justify-end\">\n <mat-paginator class=\"tabla-mantenimiento-paginador\" [pageSizeOptions]=\"paginacion.pageSizeOptions\" [pageIndex]=\"paginacion.pageIndex - 1\" [length]=\"paginacion.pageLength\" [pageSize]=\"paginacion.pageSize\" (page)=\"paginacion.pageCurrent = $event; emitirResultados();\" ></mat-paginator>\n </div>\n </div>\n </div>\n\n</div>\n\n\n\n<!-- SECCION DE TEMPLATES O MENUS -->\n\n\n<mat-menu #columnFilterMenu=\"matMenu\" xPosition=\"before\" yPosition=\"below\">\n <ng-container *ngFor=\"let column of columnasTabla\">\n <button (click)=\"toggleColumnVisibility(column, $event)\" *ngIf=\"!tipoValorFuncion(column.noMostrarEnLista, false)\"\n class=\"checkbox-item mat-menu-item\">\n <mat-checkbox (click)=\"$event.stopPropagation()\" [(ngModel)]=\"column.visible\" [ngModelOptions]=\"{standalone: true}\" color=\"primary\">\n <span [innerHTML]=\"(column.labelLista ?? column.label).replace('<br>', ' ')\"></span>\n </mat-checkbox>\n </button>\n </ng-container>\n</mat-menu>\n\n\n\n\n\n\n<ng-template #botonesSuperiores let-btn=\"btn\" let-idx=\"idx\">\n <ng-container *ngTemplateOutlet=\"botonesContextual; context:{btn: btn, item: objSeleccionado, barraSuperior: true, idx: idx}\"></ng-container>\n</ng-template>\n\n<ng-template #botonesContextual let-btn=\"btn\" let-item=\"item\" let-barraSuperior=\"barraSuperior\" let-idx=\"idx\">\n\n <ng-container *ngIf=\"barraSuperior; else noBarraSuperior\">\n\n <!--\t\t<button mat-button style=\"min-width: unset; border: 1px !important;\" class=\"uppercase border border-gray rounded-none h-full px-1 disabled:opacity-50 disabled:text-secondary disabled:bg-transparent\">-->\n <!--\t\t\t<mat-icon *ngIf=\"btn.icono\" [svgIcon]=\"btn.icono\" size=\"15px\" class=\"icon-xs\"></mat-icon>-->\n <!--\t\t</button>-->\n <ng-container *ngIf=\"btn.subItems && btn.subItems.length > 0\">\n <button matRipple [matRippleUnbounded]=\"false\" class=\"flex items-center justify-between uppercase text-2xs leading-none rounded-none px-2 py-1 bg-opacity-95 hover:bg-opacity-100 disabled:opacity-50 disabled:text-secondary disabled:!bg-gray-300 dark:disabled:!bg-gray-500 mat-elevation-z2\" type=\"button\"\n\n *ngIf=\"(!btn.esVisible || btn.esVisible(item, this)) && subItemsActivos(btn, item)\"\n [class]=\"(btn.class?btn.class:'')\"\n\n (click)=\"opcMenu(item, btn)\"\n [style.min-width]=\"((btn.soloIcono ?? tipoValorFuncion(soloIconos)) ? 'unset' : '')\"\n [matTooltip]=\"btn.tooltip || (btn.label ? btn.label : ( (derechosActuales && derechosActuales[btn.cDerechoCodigo ?? btn.tipo]) ? derechosActuales[btn.cDerechoCodigo ?? btn.tipo]['cDerechoNombre'] : capitalizarTexto(btn.tipo))) \"\n [matMenuTriggerFor]=\"menuOtrosBarra.menu\"\n\n [matBadge]=\"btn.badge\"\n matBadgeSize=\"small\"\n >\n <mat-icon class=\"icon-xs\" [class.mr-0.5]=\"!(btn.soloIcono ?? tipoValorFuncion(soloIconos))\" *ngIf=\"btn.icono\" [svgIcon]=\"btn.icono\" ></mat-icon>\n <span class=\"whitespace-nowrap\" *ngIf=\"!(btn.soloIcono ?? tipoValorFuncion(soloIconos))\">{{ btn.label ? btn.label : ( (derechosActuales && derechosActuales[btn.cDerechoCodigo ?? btn.tipo]) ? derechosActuales[btn.cDerechoCodigo ?? btn.tipo]['cDerechoNombre'] : capitalizarTexto(btn.tipo)) }}</span>\n <mat-icon class=\"icon-xs\" svgIcon=\"fa5sCaretDown\" ></mat-icon>\n </button>\n\n <jvs-tabla-mantenimiento-menu #menuOtrosBarra\n [objThis]=\"objThis\"\n [nombreColeccion]=\"nombreColeccion\"\n [item]=\"item\"\n [derechosActuales]=\"derechosActuales\"\n [subItems]=\"btn.subItems\"\n (opcionSelecionada)=\"opcMenu($event.item, $event.btn)\"\n [botonTemplate]=\"botonesContextual\"\n >\n </jvs-tabla-mantenimiento-menu>\n </ng-container>\n <ng-container *ngIf=\"!btn.subItems || btn.subItems.length == 0\">\n <button class=\"flex items-center justify-between uppercase text-2xs leading-none rounded-none px-2 py-1 bg-opacity-95 hover:bg-opacity-100 disabled:opacity-50 disabled:text-secondary disabled:!bg-gray-300 dark:disabled:!bg-gray-500 mat-elevation-z2\" type=\"button\"\n\n *ngIf=\"!btn.esVisible || btn.esVisible(item, this)\"\n [class]=\"(btn.class?btn.class:'text-secondary')\"\n [ngClass]=\"{'text-secondary italic': !ignorarDerechos && !btn.esIndependiente && (!btn.ignorarDerecho && (!derechosActuales || !derechosActuales[btn.cDerechoCodigo ?? btn.tipo])) && !(['nuevo', 'editar', 'eliminar'].includes(btn.tipo))}\"\n [disabled]=\"!btn.esIndependiente && botonDisabled(btn, item)\"\n (click)=\"opcMenu(item, btn)\"\n [style.min-width]=\"((btn.soloIcono ?? tipoValorFuncion(soloIconos)) ? 'unset' : '')\"\n [matTooltip]=\"btn.tooltip || (btn.label ? btn.label : ( (derechosActuales && derechosActuales[btn.cDerechoCodigo ?? btn.tipo]) ? derechosActuales[btn.cDerechoCodigo ?? btn.tipo]['cDerechoNombre'] : capitalizarTexto(btn.tipo))) \"\n\n [matBadge]=\"btn.badge\"\n matBadgeSize=\"small\"\n >\n <mat-icon class=\"icon-xs\" [class.mr-0.5]=\"!(btn.soloIcono ?? tipoValorFuncion(soloIconos))\" *ngIf=\"btn.icono\" [svgIcon]=\"btn.icono\"></mat-icon>\n <span class=\"whitespace-nowrap\" *ngIf=\"!(btn.soloIcono ?? tipoValorFuncion(soloIconos))\">{{ btn.label ? btn.label : ( (derechosActuales && derechosActuales[btn.cDerechoCodigo ?? btn.tipo]) ? derechosActuales[btn.cDerechoCodigo ?? btn.tipo]['cDerechoNombre'] : capitalizarTexto(btn.tipo)) }}</span>\n </button>\n\n </ng-container>\n\n </ng-container>\n <ng-template #noBarraSuperior>\n\n <ng-container *ngIf=\"btn.subItems && btn.subItems.length > 0\">\n <button class=\"flex items-center justify-between uppercase w-full rounded-none px-2 disabled:opacity-50 disabled:text-secondary disabled:bg-transparent\" mat-menu-item type=\"button\"\n *ngIf=\"!btn.noContextual && (!btn.esVisible || btn.esVisible(item, this))\"\n [class]=\"(btn.class?btn.class.replace('text-white', '').replace('bg', 'text'):'text-secondary')\"\n [ngClass]=\"{'text-secondary italic': !ignorarDerechos && !btn.esIndependiente && (!btn.ignorarDerecho && (!derechosActuales || !derechosActuales[btn.cDerechoCodigo ?? btn.tipo]))}\"\n [disabled]=\"!btn.esIndependiente && botonDisabled(btn, item)\"\n (click)=\"opcMenu(item, btn); $event.stopPropagation();\"\n [matMenuTriggerFor]=\"menuOtrosBarra.menu\"\n >\n <div class=\"flex w-full items-center justify-between uppercase text-2xs\"\n >\n <mat-icon *ngIf=\"btn.icono\" [svgIcon]=\"btn.icono\"\n class=\"flex-none icon-xs\"\n ></mat-icon>\n <span class=\"grow text-2xs\">{{ btn.label ? btn.label : ( (derechosActuales && derechosActuales[btn.cDerechoCodigo ?? btn.tipo]) ? derechosActuales[btn.cDerechoCodigo ?? btn.tipo]['cDerechoNombre'] : capitalizarTexto(btn.tipo)) }}</span>\n <mat-icon class=\"flex-none icon-xs\" svgIcon=\"fa5sCaretRight\"></mat-icon>\n </div>\n </button>\n\n <jvs-tabla-mantenimiento-menu #menuOtrosBarra\n [objThis]=\"objThis\"\n [nombreColeccion]=\"nombreColeccion\"\n [item]=\"item\"\n [derechosActuales]=\"derechosActuales\"\n [subItems]=\"btn.subItems\"\n (opcionSelecionada)=\"opcMenu($event.item, $event.btn)\"\n [botonTemplate]=\"botonesContextual\"\n >\n </jvs-tabla-mantenimiento-menu>\n </ng-container>\n <ng-container *ngIf=\"!btn.subItems || btn.subItems.length == 0\">\n <ng-container *ngIf=\"btn.tipo == '-#SEPARADOR#-'; else itemsNormales\">\n <mat-divider></mat-divider>\n </ng-container>\n <ng-template #itemsNormales>\n <button class=\"flex items-center justify-between uppercase w-full rounded-none px-2 disabled:opacity-50 disabled:text-secondary disabled:bg-transparent\" mat-menu-item type=\"button\"\n *ngIf=\"!btn.noContextual && (!btn.esVisible || btn.esVisible(item, this))\"\n [class]=\"(btn.class?btn.class.replace('text-white', '').replace('bg', 'text'):'text-secondary')\"\n [ngClass]=\"{'text-secondary italic': !ignorarDerechos && !btn.esIndependiente && (!btn.ignorarDerecho && (!derechosActuales || !derechosActuales[btn.cDerechoCodigo ?? btn.tipo]))}\"\n [disabled]=\"!btn.esIndependiente && botonDisabled(btn, item)\"\n (click)=\"opcMenu(item, btn)\"\n >\n <div class=\"flex w-full items-center justify-between uppercase text-2xs\">\n <mat-icon *ngIf=\"btn.icono\" [svgIcon]=\"btn.icono\" class=\"flex-none icon-xs\"\n ></mat-icon>\n <span class=\"grow text-2xs\">{{ btn.label ? btn.label : ( (derechosActuales && derechosActuales[btn.cDerechoCodigo ?? btn.tipo]) ? derechosActuales[btn.cDerechoCodigo ?? btn.tipo]['cDerechoNombre'] : capitalizarTexto(btn.tipo)) }}</span>\n </div>\n </button>\n </ng-template>\n\n </ng-container>\n\n </ng-template>\n\n</ng-template>\n\n<ng-template #userMenu let-item=\"item\">\n <div class=\"mat-menu bg-white rounded mat-elevation-z8 shadow botonesContextual\">\n <ng-container *ngFor=\"let btn of listaMenuCompleto\">\n <ng-container *ngTemplateOutlet=\"botonesContextual; context:{btn: btn, item: objSeleccionado, barraSuperior: false}\"></ng-container>\n </ng-container>\n </div>\n</ng-template>\n\n\n<mat-menu #menuOpciones=\"matMenu\" xPosition=\"before\" yPosition=\"below\">\n <ng-container *ngFor=\"let btn of listaMenuCompleto\">\n <ng-container\n *ngTemplateOutlet=\"botonesContextual; context:{btn: btn, item: objSeleccionado, barraSuperior: false}\"></ng-container>\n </ng-container>\n</mat-menu>\n", styles: [":root{--tabla-mantenimiento-seleccion-fondo: rgb(179, 217, 252);--tabla-mantenimiento-seleccion-texto: rgb(1, 84, 164);--mat-paginator-container-size: 30px}:root .table-mantenimiento .elemento-seleccionado{background-color:var(--tabla-mantenimiento-seleccion-fondo)!important;color:var(--tabla-mantenimiento-seleccion-texto)!important;border-color:var(--tabla-mantenimiento-seleccion-texto)!important}.jvs-tabla-mantenimiento{width:inherit}.jvs-tabla-mantenimiento .contenedor-botones>*:first-child{@apply rounded-l;}.jvs-tabla-mantenimiento .contenedor-botones>*:last-child{@apply rounded-r;}.jvs-tabla-mantenimiento .mat-mdc-menu-content:not(:empty){@apply flex flex-col items-start;padding:0!important}.jvs-tabla-mantenimiento .mat-mdc-menu-item{line-height:24px!important;height:24px!important;min-height:24px!important}.jvs-tabla-mantenimiento .mat-mdc-menu-panel{min-height:auto!important}.jvs-tabla-mantenimiento .mat-mdc-table .mat-mdc-cell,.jvs-tabla-mantenimiento .mat-mdc-table .mat-mdc-header-cell .mat-mdc-footer-cell{white-space:unset}.jvs-tabla-mantenimiento .table-container{max-height:600px!important}.jvs-tabla-mantenimiento .table-mantenimiento .mat-mdc-table-sticky-border-elem-right{border-left:1px solid #e0e0e0}.jvs-tabla-mantenimiento .table-mantenimiento .mat-mdc-table-sticky-border-elem-left{border-right:1px solid #e0e0e0}.jvs-tabla-mantenimiento .table-mantenimiento tr.regAnulado .mat-mdc-cell{color:unset!important}.jvs-tabla-mantenimiento .table-mantenimiento .bg-primary-activo .numeracionFila{@apply rounded-full bg-primary-contrast text-primary mx-1 p-1 w-6 h-6;}.jvs-tabla-mantenimiento .table-mantenimiento th .form-input{@apply w-auto;}.jvs-tabla-mantenimiento .table-mantenimiento th.mat-mdc-header-cell,.jvs-tabla-mantenimiento .table-mantenimiento td.mat-mdc-cell,.jvs-tabla-mantenimiento .table-mantenimiento td.mat-mdc-footer-cell{border-width:1px;border-style:solid}.jvs-tabla-mantenimiento .table-mantenimiento th.mat-mdc-header-cell:not(.celda-numeracion-fila),.jvs-tabla-mantenimiento .table-mantenimiento td.mat-mdc-cell:not(.celda-numeracion-fila),.jvs-tabla-mantenimiento .table-mantenimiento td.mat-mdc-footer-cell:not(.celda-numeracion-fila){padding:.05rem .25rem}.jvs-tabla-mantenimiento .table-mantenimiento th.mat-mdc-header-cell:first-of-type:not(.celda-numeracion-fila),.jvs-tabla-mantenimiento .table-mantenimiento th.mat-mdc-header-cell:last-of-type:not(.celda-numeracion-fila),.jvs-tabla-mantenimiento .table-mantenimiento td.mat-mdc-cell:first-of-type:not(.celda-numeracion-fila),.jvs-tabla-mantenimiento .table-mantenimiento td.mat-mdc-cell:last-of-type:not(.celda-numeracion-fila),.jvs-tabla-mantenimiento .table-mantenimiento td.mat-mdc-footer-cell:first-of-type:not(.celda-numeracion-fila),.jvs-tabla-mantenimiento .table-mantenimiento td.mat-mdc-footer-cell:last-of-type:not(.celda-numeracion-fila){padding:0 .25rem}.jvs-tabla-mantenimiento .table-mantenimiento .student-element-detail{overflow:hidden;display:flex;align-items:center;justify-content:center}.jvs-tabla-mantenimiento .table-mantenimiento .mat-mdc-header-row{height:25px!important;color:rgb(var(--color-primary))!important;background-color:rgb(var(--color-primary-contrast))!important}.jvs-tabla-mantenimiento .table-mantenimiento .mat-mdc-header-cell{padding:5px;font-size:10px;line-height:10px;font-weight:700!important;color:inherit}.jvs-tabla-mantenimiento .table-mantenimiento .mdc-data-table__row:not(.mdc-data-table__row--selected):not(.elemento-seleccionado):hover,.jvs-tabla-mantenimiento .table-mantenimiento .mdc-data-table__row:not(.mdc-data-table__row--selected):not(.elemento-seleccionado):focus{background-color:rgba(var(--color-primary-contrast),.04)}.jvs-tabla-mantenimiento .table-mantenimiento .mat-mdc-row .mat-mdc-cell,.jvs-tabla-mantenimiento .table-mantenimiento .mat-mdc-footer-row .mat-mdc-cell{font-size:10px}.jvs-tabla-mantenimiento .table-mantenimiento .mat-mdc-row .mat-mdc-footer-cell:empty,.jvs-tabla-mantenimiento .table-mantenimiento .mat-mdc-footer-row .mat-mdc-footer-cell:empty{border-width:0!important}.jvs-tabla-mantenimiento .table-mantenimiento .mat-mdc-cell{@apply leading-tight;}.jvs-tabla-mantenimiento .table-mantenimiento th.mat-mdc-header-cell{border-color:#d4d0d0;@apply text-center uppercase;}.jvs-tabla-mantenimiento .table-mantenimiento th.mat-mdc-header-cell .mat-sort-header-container{@apply flex items-center justify-between w-full;}.jvs-tabla-mantenimiento .table-mantenimiento th.mat-mdc-header-cell .mat-sort-header-container .mat-sort-header-content{@apply inline w-full text-center;}.jvs-tabla-mantenimiento .table-mantenimiento th.mat-mdc-header-cell .mat-sort-header-container .mat-sort-header-arrow{@apply flex-none;}.jvs-tabla-mantenimiento .table-mantenimiento .mat-mdc-sort-header-content{width:100%;text-align:center;display:unset;align-items:center}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }, { kind: "ngmodule", type: FormsModule }, { 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: "ngmodule", type: MatCheckboxModule }, { kind: "component", type: i3$2.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: "ngmodule", type: MatDividerModule }, { kind: "component", type: i6.MatDivider, selector: "mat-divider", inputs: ["vertical", "inset"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatMenuModule }, { kind: "component", type: i8.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: i8.MatMenuItem, selector: "[mat-menu-item]", inputs: ["role", "disabled", "disableRipple"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i8.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", inputs: ["mat-menu-trigger-for", "matMenuTriggerFor", "matMenuTriggerData", "matMenuTriggerRestoreFocus"], outputs: ["menuOpened", "onMenuOpen", "menuClosed", "onMenuClose"], exportAs: ["matMenuTrigger"] }, { kind: "ngmodule", type: MatPaginatorModule }, { kind: "component", type: i9.MatPaginator, selector: "mat-paginator", inputs: ["color", "pageIndex", "length", "pageSize", "pageSizeOptions", "hidePageSize", "showFirstLastButtons", "selectConfig", "disabled"], outputs: ["page"], exportAs: ["matPaginator"] }, { kind: "ngmodule", type: MatRippleModule }, { kind: "directive", type: i5.MatRipple, selector: "[mat-ripple], [matRipple]", inputs: ["matRippleColor", "matRippleUnbounded", "matRippleCentered", "matRippleRadius", "matRippleAnimation", "matRippleDisabled", "matRippleTrigger"], exportAs: ["matRipple"] }, { kind: "ngmodule", type: MatSortModule }, { kind: "directive", type: i3$1.MatSort, selector: "[matSort]", inputs: ["matSortActive", "matSortStart", "matSortDirection", "matSortDisableClear", "matSortDisabled"], outputs: ["matSortChange"], exportAs: ["matSort"] }, { kind: "ngmodule", type: MatTableModule }, { kind: "component", type: i2$1.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i2$1.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i2$1.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i2$1.MatColumnDef, selector: "[matColumnDef]", inputs: ["matColumnDef"] }, { kind: "directive", type: i2$1.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i2$1.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i2$1.MatFooterCellDef, selector: "[matFooterCellDef]" }, { kind: "directive", type: i2$1.MatFooterRowDef, selector: "[matFooterRowDef]", inputs: ["matFooterRowDef", "matFooterRowDefSticky"] }, { kind: "directive", type: i2$1.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i2$1.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "directive", type: i2$1.MatFooterCell, selector: "mat-footer-cell, td[mat-footer-cell]" }, { kind: "component", type: i2$1.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i2$1.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "component", type: i2$1.MatFooterRow, selector: "mat-footer-row, tr[mat-footer-row]", exportAs: ["matFooterRow"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i4.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: TablaMantenimientoColumnDefsComponent, selector: "jvs-tabla-mantenimiento-column-defs", inputs: ["objThis", "nombreColeccion", "colDetalle", "chkLista"], outputs: ["chkListaChange"] }, { kind: "ngmodule", type: MatBadgeModule }, { kind: "directive", type: i14.MatBadge, selector: "[matBadge]", inputs: ["matBadgeColor", "matBadgeOverlap", "matBadgeDisabled", "matBadgePosition", "matBadge", "matBadgeDescription", "matBadgeSize", "matBadgeHidden"] }, { kind: "component", type: TablaMantenimientoMenuComponent, selector: "jvs-tabla-mantenimiento-menu", inputs: ["objThis", "nombreColeccion", "item", "derechosActuales", "subItems", "botonTemplate"], outputs: ["opcionSelecionada"] }, { kind: "directive", type: MatRowKeyboardSelectionDirective, selector: "[matRowKeyboardSelection]", inputs: ["matRowKeyboardSelection", "rowModel"], outputs: ["seleccionarSiguiente"] }], animations: [
|
|
1696
1724
|
trigger('detailExpand', [
|
|
1697
1725
|
state('collapsed', style({ height: '0px', minHeight: '0' })),
|
|
1698
1726
|
state('expanded', style({ height: '*' })),
|
|
@@ -1756,7 +1784,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.7", ngImpor
|
|
|
1756
1784
|
]),
|
|
1757
1785
|
], providers: [
|
|
1758
1786
|
{ provide: MAT_PAGINATOR_DEFAULT_OPTIONS, useValue: { formFieldAppearance: 'outline' } }
|
|
1759
|
-
], template: "<div class=\"flex flex-col h-fit\">\n <div class=\"grow flex items-center justify-between bg-white\">\n <ng-content select=\"[filtro]\"></ng-content>\n </div>\n\n <div class=\"flex flex-col border-t\">\n <div class=\"flex-1 bg-app-bar flex items-center justify-between p-1\">\n <!-- <div class=\"hidden flex-1 sm:flex items-center flex-wrap gap-1\">-->\n <!-- </div>-->\n <div class=\"flex items-center flex-wrap mr-1 h-full\" *ngIf=\"leyenda\">\n <span class=\"font-bold\" [class]=\"leyenda.class\">{{ leyenda.text }}</span>\n </div>\n <div class=\"hidden flex-1 sm:flex items-center flex-wrap gap-1\">\n <div *ngIf=\"(botonesMenuFinal.izquierda ?? []).length > 0 \" class=\" flex items-center flex-wrap contenedor-botones\">\n <ng-container *ngFor=\"let btn of botonesMenu.izquierda; let idx = index;\">\n <ng-container *ngTemplateOutlet=\"botonesSuperiores; context:{btn: btn, idx: {inicio: idx, fin: botonesMenu.izquierda?.length}}\"></ng-container>\n </ng-container>\n </div>\n\n <div *ngIf=\"(botonesMenuFinal.crud ?? []).length > 0\" class=\" flex items-center flex-wrap contenedor-botones\">\n <ng-container *ngFor=\"let btn of botonesMenu.crud; let idx = index;\">\n <ng-container *ngTemplateOutlet=\"botonesSuperiores; context:{btn: btn, idx: {inicio: idx, fin: botonesMenu.crud?.length}}\"></ng-container>\n </ng-container>\n </div>\n\n <div *ngIf=\"(botonesMenuFinal.principal ?? []).length > 0\" class=\" flex items-center flex-wrap contenedor-botones\">\n <ng-container *ngFor=\"let btn of botonesMenu.principal; let idx = index;\">\n <ng-container *ngTemplateOutlet=\"botonesSuperiores; context:{btn: btn, idx: {inicio: idx, fin: botonesMenu.principal?.length}}\"></ng-container>\n </ng-container>\n </div>\n\n <div *ngIf=\"(botonesMenuFinal.derecha ?? []).length > 0\" class=\"flex-auto flex items-center justify-end contenedor-botones\">\n <ng-container *ngFor=\"let btn of botonesMenu.derecha; let idx = index;\">\n <ng-container *ngTemplateOutlet=\"botonesSuperiores; context:{btn: btn, idx: {inicio: idx, fin: botonesMenu.derecha?.length}}\"></ng-container>\n </ng-container>\n </div>\n <ng-content select=\"[objetosMenuPegado]\"></ng-content>\n </div>\n <div class=\"flex flex-1 sm:hidden items-center flex-wrap gap-1\">\n <button class=\"flex items-center justify-center text-2xs leading-none rounded-full p-1\"\n matRipple\n matTooltip=\"Botones de Acci\u00F3n\"\n type=\"button\"\n [matMenuTriggerFor]=\"menuOpciones\"\n >\n <mat-icon class=\"icon-xs\" svgIcon=\"roundMenu\"></mat-icon>\n </button>\n </div>\n <div class=\"flex-none flex items-center justify-end border-l-2\">\n <div class=\"flex-1 sm:flex-none flex items-center justify-end\">\n <ng-content select=\"[objetosMenu]\"></ng-content>\n </div>\n </div>\n <div *ngIf=\"ctrlBusqueda\" class=\"hidden flex-initial sm:flex items-center form-input max-w-[150px] bg-card rounded-full border m-1 px-1 border-l-2\"\n >\n <mat-icon svgIcon=\"roundSearch\" class=\"icon-xs\"></mat-icon>\n <input [formControl]=\"cCampoBusqueda\"\n class=\"text-xs px-1 py-1 border-0 outline-none w-full bg-transparent max-w-sm\"\n [placeholder]=\"ctrlBusquedaPlaceholder\"\n (keyup.enter)=\"ctrlBusqueda == 'query' ? cargarData() : false;\"\n type=\"search\">\n </div>\n <div class=\"flex-none flex items-center justify-end border-l-2\">\n <ng-content select=\"[botonesFiltro]\"></ng-content>\n <button matRipple *ngIf=\"isRecargarUsed || ctrlBusqueda == 'query'\"\n class=\"flex items-center justify-center text-2xs leading-none rounded-full p-1 text-green-700\"\n matTooltip=\"Actualizar datos\"\n (click)=\"(ctrlBusqueda == 'query' ? cargarData() : emitirAccionRecargar())\"\n type=\"button\">\n <mat-icon svgIcon=\"roundRefresh\" class=\"icon-xs\"></mat-icon>\n\n </button>\n <button matRipple [matMenuTriggerFor]=\"columnFilterMenu\" *ngIf=\"filtroCampos\"\n class=\"flex items-center justify-center text-2xs leading-none rounded-full p-1\"\n matTooltip=\"Columnas Filtro\"\n type=\"button\">\n <mat-icon svgIcon=\"roundFilterList\" class=\"icon-xs\"></mat-icon>\n </button>\n </div>\n </div>\n\n <div *ngIf=\"(botonesMenuFinal.secundario ?? []).length > 0\" class=\"flex-1 bg-app-bar flex items-center justify-between p-1 border-t\">\n <div class=\"hidden flex-1 sm:flex items-center flex-wrap gap-1\">\n <div class=\" flex items-center flex-wrap contenedor-botones\">\n <ng-container *ngFor=\"let btn of botonesMenu.secundario; let idx = index;\">\n <ng-container *ngTemplateOutlet=\"botonesSuperiores; context:{btn: btn, idx: {inicio: idx, fin: botonesMenu.secundario?.length}}\"></ng-container>\n </ng-container>\n </div>\n </div>\n </div>\n <!--<div class=\"grow flex flex-col items-stretch contenedor-tabla\" [ngClass]=\"{'table-container overflow-auto': esTabla}\">\n <pre>{{ this.chkLista.modelosChk | json }}</pre>\n <pre>{{ this.chkLista.checkbox.cantidadActivos | json }}</pre>\n <pre>{{ this.chkLista.checkbox.algunosActivos | json }}</pre>\n </div>-->\n <div class=\"grow flex flex-col items-stretch contenedor-tabla\" [ngClass]=\"{'table-container overflow-auto': esTabla}\">\n <ng-content select=\"[cuerpo]\"></ng-content>\n\n <table [id]=\"'tabla_' + nombreColeccion\" [dataSource]=\"dataSource\" [multiTemplateDataRows]=\"true\"\n [hidden]=\"!esTabla\"\n class=\"flex-1 table-mantenimiento table-auto h-fit\" mat-table matSort\n [trackBy]=\"trackByFn\"\n #tablaMantenimiento\n >\n\n <!--<table [dataSource]=\"dataSource\" class=\"table-mantenimiento table-auto h-auto w-full justify-center\" mat-table matSort>-->\n\n\n <ng-content select=\"[tableDefinitions]\"></ng-content>\n <ng-container matColumnDef=\"numeracion_automatica\">\n <th mat-header-cell *matHeaderCellDef style=\"width: 16px !important\">N\u00BA</th>\n <td mat-cell *matCellDef=\"let element; let i = dataIndex\" class=\"p-0 celda-numeracion-fila\">\n <div class=\"flex items-center justify-center font-bold numeracionFila\">\n <ng-container *ngIf=\"esTabla && paginador\">\n {{ (this.paginator?.pageIndex == 0 ? i + 1 : 1 + i + (this.paginator?.pageIndex ?? 1) * (this.paginator?.pageSize ?? 1)) }}\n </ng-container>\n <ng-container *ngIf=\"!paginador\">\n {{ (i + 1) }}\n </ng-container>\n </div>\n </td>\n <td mat-footer-cell *matFooterCellDef class=\"uppercase\"></td>\n </ng-container>\n <jvs-tabla-mantenimiento-column-defs [objThis]=\"this\" [colDetalle]=\"columnasTabla\"\n [nombreColeccion]=\"nombreColeccion\" [(chkLista)]=\"chkLista\"></jvs-tabla-mantenimiento-column-defs>\n\n <tr *matHeaderRowDef=\"visibleColumns; sticky: true\" mat-header-row class=\"title\" matHeader\n [style.height.px]=\"placeholderHeight\"\n ></tr>\n\n <ng-container *ngIf=\"!!filaExtraHeader\">\n <tr mat-row *matRowDef=\"let row; columns: ['filaExtraHeader']\" class=\"student-detail-row\"\n [style.height.px]=\"(virtualScroll ? (itemSize ? itemSize : 0) : 0)\"\n ></tr>\n\n <ng-container matColumnDef=\"filaExtraHeader\">\n <td mat-cell *matCellDef=\"let row; let i = dataIndex\" [attr.colspan]=\"visibleColumns.length\">\n\n <div class=\"row m-0 student-element-detail\"\n [@detailExpand]=\"(i == 0 && filaExtraHeader.esVisible && filaExtraHeader.esVisible()) ? 'expanded' : 'collapsed'\"\n [style.padding-right.px]=\"row.isExpanded ? 5 : 0\"\n [style.padding-left.px]=\"row.isExpanded ? 5 : 0\"\n >\n <ng-container *ngIf=\"filaExtraHeader.template\"\n [ngTemplateOutlet]=\"filaExtraHeader.template\"\n [ngTemplateOutletContext]=\"{ row: row }\"></ng-container>\n </div>\n\n </td>\n </ng-container>\n </ng-container>\n <ng-container *ngIf=\"filaFooter\">\n <tr *matFooterRowDef=\"visibleColumns\" mat-footer-row\n [style.height.px]=\"(virtualScroll ? (itemSize ? itemSize : 0) : 0)\"\n [id]=\"nombreColeccion + '_filaFooter'\"\n ></tr>\n </ng-container>\n\n <!--\t<tr\n *matRowDef=\"let row; columns: visibleColumns;\"\n class=\"hover:bg-secondary trans-ease-out cursor-pointer\"\n mat-row></tr>-->\n <tr\n [matRowKeyboardSelection]=\"tablaMantenimiento\"\n [rowModel]=\"row\"\n (seleccionarSiguiente)=\"opcMenu($event, {seccion: nombreColeccion, tipo: 'ver'});\"\n\n *matRowDef=\"let row; columns: visibleColumns;\"\n (click)=\"seleccionarItem(row); opcMenu(row, {seccion: nombreColeccion, tipo: 'ver'});\"\n (dblclick)=\"opcMenu(row, {seccion: nombreColeccion, tipo: 'seleccionar'}); dblclickItem.emit(row)\"\n (contextmenu)=\"(abrirMenuContextual($event, row)); $event. preventDefault();\"\n [ngClass]=\"classFila(row)\"\n @fadeInUp\n class=\"trans-ease-out cursor-pointer h-auto\"\n [style.height.px]=\"(virtualScroll ? (itemSize ? itemSize : 0) : 0)\"\n [id]=\"propiedadSeleccion(row)\"\n [matTooltip]=\"row[campoAnuladoMensaje ?? '']\"\n matTooltipPosition=\"below\"\n matTooltipClass=\"bg-red-700 text-red-100 m-0\"\n [matTooltipDisabled]=\"!campoAnuladoMensaje || !row[campoAnuladoMensaje]\"\n [class.regAnulado]=\"row[campoAnulado ?? ''] == 1\"\n (keyup.delete)=\"opcMenu(row, {seccion: nombreColeccion, tipo: 'eliminar'})\"\n mat-row></tr>\n <ng-container *ngIf=\"filaExtraTemplate\">\n <tr mat-row *matRowDef=\"let row; columns: ['expandedDetail']\" class=\"student-detail-row h-0\"></tr>\n\n <ng-container matColumnDef=\"expandedDetail\">\n <td mat-cell *matCellDef=\"let row\" [attr.colspan]=\"visibleColumns.length\">\n\n <div class=\"row m-0 student-element-detail\"\n [@detailExpand]=\"row.isExpanded ? 'expanded' : 'collapsed'\"\n [style.padding-right.px]=\"row.isExpanded ? 5 : 0\"\n [style.padding-left.px]=\"row.isExpanded ? 5 : 0\"\n >\n <ng-container [ngTemplateOutlet]=\"filaExtraTemplate\"\n [ngTemplateOutletContext]=\"{ row: row }\"></ng-container>\n </div>\n\n </td>\n </ng-container>\n </ng-container>\n </table>\n\n <ng-container *ngIf=\"componenteCargadoTotalmente\">\n <div *ngIf=\"(noData | async) && esTabla\" class=\"flex-1 text-center text-secondary font-medium\">\n No se encontraron datos\n </div>\n </ng-container>\n </div>\n <ng-content select=\"[appendTable]\"></ng-content>\n <div class=\"flex-1 bg-app-bar flex flex-col sm:flex-row items-start justify-between p-1\">\n <div class=\"flex-1 flex items-start flex-wrap gap-1\">\n <div *ngIf=\"(botonesMenuFinal.inferior ?? []).length > 0\" class=\" flex items-center flex-wrap\">\n <ng-container *ngFor=\"let btn of botonesMenu.inferior; let idx = index;\">\n <ng-container *ngTemplateOutlet=\"botonesSuperiores; context:{btn: btn, idx: {inicio: idx, fin: botonesMenu.inferior?.length}}\"></ng-container>\n </ng-container>\n </div>\n </div>\n\n <div *ngIf=\"esTabla && paginador\" class=\"flex-1 sm:flex-none flex items-center justify-end\">\n <mat-paginator class=\"tabla-mantenimiento-paginador\" [pageSizeOptions]=\"paginacion.pageSizeOptions\" [pageIndex]=\"paginacion.pageIndex - 1\" [length]=\"paginacion.pageLength\" [pageSize]=\"paginacion.pageSize\" (page)=\"paginacion.pageCurrent = $event; emitirResultados();\" ></mat-paginator>\n </div>\n </div>\n </div>\n\n</div>\n\n\n\n<!-- SECCION DE TEMPLATES O MENUS -->\n\n\n<mat-menu #columnFilterMenu=\"matMenu\" xPosition=\"before\" yPosition=\"below\">\n <ng-container *ngFor=\"let column of columnasTabla\">\n <button (click)=\"toggleColumnVisibility(column, $event)\" *ngIf=\"!column.noMostrar || !column.noMostrar()\"\n class=\"checkbox-item mat-menu-item\">\n <mat-checkbox (click)=\"$event.stopPropagation()\" [(ngModel)]=\"column.visible\" [ngModelOptions]=\"{standalone: true}\" color=\"primary\">\n <span [innerHTML]=\"(column.labelLista ?? column.label).replace('<br>', ' ')\"></span>\n </mat-checkbox>\n </button>\n </ng-container>\n</mat-menu>\n\n\n\n\n\n\n<ng-template #botonesSuperiores let-btn=\"btn\" let-idx=\"idx\">\n <ng-container *ngTemplateOutlet=\"botonesContextual; context:{btn: btn, item: objSeleccionado, barraSuperior: true, idx: idx}\"></ng-container>\n</ng-template>\n\n<ng-template #botonesContextual let-btn=\"btn\" let-item=\"item\" let-barraSuperior=\"barraSuperior\" let-idx=\"idx\">\n\n <ng-container *ngIf=\"barraSuperior; else noBarraSuperior\">\n\n <!--\t\t<button mat-button style=\"min-width: unset; border: 1px !important;\" class=\"uppercase border border-gray rounded-none h-full px-1 disabled:opacity-50 disabled:text-secondary disabled:bg-transparent\">-->\n <!--\t\t\t<mat-icon *ngIf=\"btn.icono\" [svgIcon]=\"btn.icono\" size=\"15px\" class=\"icon-xs\"></mat-icon>-->\n <!--\t\t</button>-->\n <ng-container *ngIf=\"btn.subItems && btn.subItems.length > 0\">\n <button matRipple [matRippleUnbounded]=\"false\" class=\"flex items-center justify-between uppercase text-2xs leading-none rounded-none px-2 py-1 bg-opacity-95 hover:bg-opacity-100 disabled:opacity-50 disabled:text-secondary disabled:!bg-gray-300 dark:disabled:!bg-gray-500 mat-elevation-z2\" type=\"button\"\n\n *ngIf=\"(!btn.esVisible || btn.esVisible(item, this)) && subItemsActivos(btn, item)\"\n [class]=\"(btn.class?btn.class:'')\"\n\n (click)=\"opcMenu(item, btn)\"\n [style.min-width]=\"(btn.soloIcono ? 'unset' : '')\"\n [matTooltip]=\"btn.tooltip || (btn.label ? btn.label : ( (derechosActuales && derechosActuales[btn.cDerechoCodigo ?? btn.tipo]) ? derechosActuales[btn.cDerechoCodigo ?? btn.tipo]['cDerechoNombre'] : capitalizarTexto(btn.tipo))) \"\n [matMenuTriggerFor]=\"menuOtrosBarra.menu\"\n\n [matBadge]=\"btn.badge\"\n matBadgeSize=\"small\"\n >\n <mat-icon class=\"icon-xs\" [class.mr-0.5]=\"!btn.soloIcono\" *ngIf=\"btn.icono\" [svgIcon]=\"btn.icono\" ></mat-icon>\n <span class=\"whitespace-nowrap\" *ngIf=\"!btn.soloIcono\">{{ btn.label ? btn.label : ( (derechosActuales && derechosActuales[btn.cDerechoCodigo ?? btn.tipo]) ? derechosActuales[btn.cDerechoCodigo ?? btn.tipo]['cDerechoNombre'] : capitalizarTexto(btn.tipo)) }}</span>\n <mat-icon class=\"icon-xs\" svgIcon=\"fa5sCaretDown\" ></mat-icon>\n </button>\n\n <jvs-tabla-mantenimiento-menu #menuOtrosBarra\n [objThis]=\"objThis\"\n [nombreColeccion]=\"nombreColeccion\"\n [item]=\"item\"\n [derechosActuales]=\"derechosActuales\"\n [subItems]=\"btn.subItems\"\n (opcionSelecionada)=\"opcMenu($event.item, $event.btn)\"\n [botonTemplate]=\"botonesContextual\"\n >\n </jvs-tabla-mantenimiento-menu>\n </ng-container>\n <ng-container *ngIf=\"!btn.subItems || btn.subItems.length == 0\">\n <button class=\"flex items-center justify-between uppercase text-2xs leading-none rounded-none px-2 py-1 bg-opacity-95 hover:bg-opacity-100 disabled:opacity-50 disabled:text-secondary disabled:!bg-gray-300 dark:disabled:!bg-gray-500 mat-elevation-z2\" type=\"button\"\n\n *ngIf=\"!btn.esVisible || btn.esVisible(item, this)\"\n [class]=\"(btn.class?btn.class:'text-secondary')\"\n [ngClass]=\"{'text-secondary italic': !ignorarDerechos && !btn.esIndependiente && (!btn.ignorarDerecho && (!derechosActuales || !derechosActuales[btn.cDerechoCodigo ?? btn.tipo])) && !(['nuevo', 'editar', 'eliminar'].includes(btn.tipo))}\"\n [disabled]=\"!btn.esIndependiente && botonDisabled(btn, item)\"\n (click)=\"opcMenu(item, btn)\"\n [style.min-width]=\"(btn.soloIcono ? 'unset' : '')\"\n [matTooltip]=\"btn.tooltip || (btn.label ? btn.label : ( (derechosActuales && derechosActuales[btn.cDerechoCodigo ?? btn.tipo]) ? derechosActuales[btn.cDerechoCodigo ?? btn.tipo]['cDerechoNombre'] : capitalizarTexto(btn.tipo))) \"\n\n [matBadge]=\"btn.badge\"\n matBadgeSize=\"small\"\n >\n <mat-icon class=\"icon-xs\" [class.mr-0.5]=\"!btn.soloIcono\" *ngIf=\"btn.icono\" [svgIcon]=\"btn.icono\"></mat-icon>\n <span class=\"whitespace-nowrap\" *ngIf=\"!btn.soloIcono\">{{ btn.label ? btn.label : ( (derechosActuales && derechosActuales[btn.cDerechoCodigo ?? btn.tipo]) ? derechosActuales[btn.cDerechoCodigo ?? btn.tipo]['cDerechoNombre'] : capitalizarTexto(btn.tipo)) }}</span>\n </button>\n\n </ng-container>\n\n </ng-container>\n <ng-template #noBarraSuperior>\n\n <ng-container *ngIf=\"btn.subItems && btn.subItems.length > 0\">\n <button class=\"flex items-center justify-between uppercase w-full rounded-none px-2 disabled:opacity-50 disabled:text-secondary disabled:bg-transparent\" mat-menu-item type=\"button\"\n *ngIf=\"!btn.noContextual && (!btn.esVisible || btn.esVisible(item, this))\"\n [class]=\"(btn.class?btn.class.replace('text-white', '').replace('bg', 'text'):'text-secondary')\"\n [ngClass]=\"{'text-secondary italic': !ignorarDerechos && !btn.esIndependiente && (!btn.ignorarDerecho && (!derechosActuales || !derechosActuales[btn.cDerechoCodigo ?? btn.tipo]))}\"\n [disabled]=\"!btn.esIndependiente && botonDisabled(btn, item)\"\n (click)=\"opcMenu(item, btn); $event.stopPropagation();\"\n [matMenuTriggerFor]=\"menuOtrosBarra.menu\"\n >\n <div class=\"flex w-full items-center justify-between uppercase text-2xs\"\n >\n <mat-icon *ngIf=\"btn.icono\" [svgIcon]=\"btn.icono\"\n class=\"flex-none icon-xs\"\n ></mat-icon>\n <span class=\"grow text-2xs\">{{ btn.label ? btn.label : ( (derechosActuales && derechosActuales[btn.cDerechoCodigo ?? btn.tipo]) ? derechosActuales[btn.cDerechoCodigo ?? btn.tipo]['cDerechoNombre'] : capitalizarTexto(btn.tipo)) }}</span>\n <mat-icon class=\"flex-none icon-xs\" svgIcon=\"fa5sCaretRight\"></mat-icon>\n </div>\n </button>\n\n <jvs-tabla-mantenimiento-menu #menuOtrosBarra\n [objThis]=\"objThis\"\n [nombreColeccion]=\"nombreColeccion\"\n [item]=\"item\"\n [derechosActuales]=\"derechosActuales\"\n [subItems]=\"btn.subItems\"\n (opcionSelecionada)=\"opcMenu($event.item, $event.btn)\"\n [botonTemplate]=\"botonesContextual\"\n >\n </jvs-tabla-mantenimiento-menu>\n </ng-container>\n <ng-container *ngIf=\"!btn.subItems || btn.subItems.length == 0\">\n <ng-container *ngIf=\"btn.tipo == '-#SEPARADOR#-'; else itemsNormales\">\n <mat-divider></mat-divider>\n </ng-container>\n <ng-template #itemsNormales>\n <button class=\"flex items-center justify-between uppercase w-full rounded-none px-2 disabled:opacity-50 disabled:text-secondary disabled:bg-transparent\" mat-menu-item type=\"button\"\n *ngIf=\"!btn.noContextual && (!btn.esVisible || btn.esVisible(item, this))\"\n [class]=\"(btn.class?btn.class.replace('text-white', '').replace('bg', 'text'):'text-secondary')\"\n [ngClass]=\"{'text-secondary italic': !ignorarDerechos && !btn.esIndependiente && (!btn.ignorarDerecho && (!derechosActuales || !derechosActuales[btn.cDerechoCodigo ?? btn.tipo]))}\"\n [disabled]=\"!btn.esIndependiente && botonDisabled(btn, item)\"\n (click)=\"opcMenu(item, btn)\"\n >\n <div class=\"flex w-full items-center justify-between uppercase text-2xs\">\n <mat-icon *ngIf=\"btn.icono\" [svgIcon]=\"btn.icono\" class=\"flex-none icon-xs\"\n ></mat-icon>\n <span class=\"grow text-2xs\">{{ btn.label ? btn.label : ( (derechosActuales && derechosActuales[btn.cDerechoCodigo ?? btn.tipo]) ? derechosActuales[btn.cDerechoCodigo ?? btn.tipo]['cDerechoNombre'] : capitalizarTexto(btn.tipo)) }}</span>\n </div>\n </button>\n </ng-template>\n\n </ng-container>\n\n </ng-template>\n\n</ng-template>\n\n<ng-template #userMenu let-item=\"item\">\n <div class=\"mat-menu bg-white rounded mat-elevation-z8 shadow botonesContextual\">\n <ng-container *ngFor=\"let btn of listaMenuCompleto\">\n <ng-container *ngTemplateOutlet=\"botonesContextual; context:{btn: btn, item: objSeleccionado, barraSuperior: false}\"></ng-container>\n </ng-container>\n </div>\n</ng-template>\n\n\n<mat-menu #menuOpciones=\"matMenu\" xPosition=\"before\" yPosition=\"below\">\n <ng-container *ngFor=\"let btn of listaMenuCompleto\">\n <ng-container\n *ngTemplateOutlet=\"botonesContextual; context:{btn: btn, item: objSeleccionado, barraSuperior: false}\"></ng-container>\n </ng-container>\n</mat-menu>\n", styles: [":root{--tabla-mantenimiento-seleccion-fondo: rgb(179, 217, 252);--tabla-mantenimiento-seleccion-texto: rgb(1, 84, 164);--mat-paginator-container-size: 30px}:root .table-mantenimiento .elemento-seleccionado{background-color:var(--tabla-mantenimiento-seleccion-fondo)!important;color:var(--tabla-mantenimiento-seleccion-texto)!important;border-color:var(--tabla-mantenimiento-seleccion-texto)!important}.jvs-tabla-mantenimiento{width:inherit}.jvs-tabla-mantenimiento .contenedor-botones>*:first-child{@apply rounded-l;}.jvs-tabla-mantenimiento .contenedor-botones>*:last-child{@apply rounded-r;}.jvs-tabla-mantenimiento .mat-mdc-menu-content:not(:empty){@apply flex flex-col items-start;padding:0!important}.jvs-tabla-mantenimiento .mat-mdc-menu-item{line-height:24px!important;height:24px!important;min-height:24px!important}.jvs-tabla-mantenimiento .mat-mdc-menu-panel{min-height:auto!important}.jvs-tabla-mantenimiento .mat-mdc-table .mat-mdc-cell,.jvs-tabla-mantenimiento .mat-mdc-table .mat-mdc-header-cell .mat-mdc-footer-cell{white-space:unset}.jvs-tabla-mantenimiento .table-container{max-height:600px!important}.jvs-tabla-mantenimiento .table-mantenimiento .mat-mdc-table-sticky-border-elem-right{border-left:1px solid #e0e0e0}.jvs-tabla-mantenimiento .table-mantenimiento .mat-mdc-table-sticky-border-elem-left{border-right:1px solid #e0e0e0}.jvs-tabla-mantenimiento .table-mantenimiento tr.regAnulado .mat-mdc-cell{color:unset!important}.jvs-tabla-mantenimiento .table-mantenimiento .bg-primary-activo .numeracionFila{@apply rounded-full bg-primary-contrast text-primary mx-1 p-1 w-6 h-6;}.jvs-tabla-mantenimiento .table-mantenimiento th .form-input{@apply w-auto;}.jvs-tabla-mantenimiento .table-mantenimiento th.mat-mdc-header-cell,.jvs-tabla-mantenimiento .table-mantenimiento td.mat-mdc-cell,.jvs-tabla-mantenimiento .table-mantenimiento td.mat-mdc-footer-cell{border-width:1px;border-style:solid}.jvs-tabla-mantenimiento .table-mantenimiento th.mat-mdc-header-cell:not(.celda-numeracion-fila),.jvs-tabla-mantenimiento .table-mantenimiento td.mat-mdc-cell:not(.celda-numeracion-fila),.jvs-tabla-mantenimiento .table-mantenimiento td.mat-mdc-footer-cell:not(.celda-numeracion-fila){padding:.05rem .25rem}.jvs-tabla-mantenimiento .table-mantenimiento th.mat-mdc-header-cell:first-of-type:not(.celda-numeracion-fila),.jvs-tabla-mantenimiento .table-mantenimiento th.mat-mdc-header-cell:last-of-type:not(.celda-numeracion-fila),.jvs-tabla-mantenimiento .table-mantenimiento td.mat-mdc-cell:first-of-type:not(.celda-numeracion-fila),.jvs-tabla-mantenimiento .table-mantenimiento td.mat-mdc-cell:last-of-type:not(.celda-numeracion-fila),.jvs-tabla-mantenimiento .table-mantenimiento td.mat-mdc-footer-cell:first-of-type:not(.celda-numeracion-fila),.jvs-tabla-mantenimiento .table-mantenimiento td.mat-mdc-footer-cell:last-of-type:not(.celda-numeracion-fila){padding:0 .25rem}.jvs-tabla-mantenimiento .table-mantenimiento .student-element-detail{overflow:hidden;display:flex;align-items:center;justify-content:center}.jvs-tabla-mantenimiento .table-mantenimiento .mat-mdc-header-row{height:25px!important;color:rgb(var(--color-primary))!important;background-color:rgb(var(--color-primary-contrast))!important}.jvs-tabla-mantenimiento .table-mantenimiento .mat-mdc-header-cell{padding:5px;font-size:10px;line-height:10px;font-weight:700!important;color:inherit}.jvs-tabla-mantenimiento .table-mantenimiento .mdc-data-table__row:not(.mdc-data-table__row--selected):not(.elemento-seleccionado):hover,.jvs-tabla-mantenimiento .table-mantenimiento .mdc-data-table__row:not(.mdc-data-table__row--selected):not(.elemento-seleccionado):focus{background-color:rgba(var(--color-primary-contrast),.04)}.jvs-tabla-mantenimiento .table-mantenimiento .mat-mdc-row .mat-mdc-cell,.jvs-tabla-mantenimiento .table-mantenimiento .mat-mdc-footer-row .mat-mdc-cell{font-size:10px}.jvs-tabla-mantenimiento .table-mantenimiento .mat-mdc-row .mat-mdc-footer-cell:empty,.jvs-tabla-mantenimiento .table-mantenimiento .mat-mdc-footer-row .mat-mdc-footer-cell:empty{border-width:0!important}.jvs-tabla-mantenimiento .table-mantenimiento .mat-mdc-cell{@apply leading-tight;}.jvs-tabla-mantenimiento .table-mantenimiento th.mat-mdc-header-cell{border-color:#d4d0d0;@apply text-center uppercase;}.jvs-tabla-mantenimiento .table-mantenimiento th.mat-mdc-header-cell .mat-sort-header-container{@apply flex items-center justify-between w-full;}.jvs-tabla-mantenimiento .table-mantenimiento th.mat-mdc-header-cell .mat-sort-header-container .mat-sort-header-content{@apply inline w-full text-center;}.jvs-tabla-mantenimiento .table-mantenimiento th.mat-mdc-header-cell .mat-sort-header-container .mat-sort-header-arrow{@apply flex-none;}.jvs-tabla-mantenimiento .table-mantenimiento .mat-mdc-sort-header-content{width:100%;text-align:center;display:unset;align-items:center}\n"] }]
|
|
1787
|
+
], template: "<div class=\"flex flex-col h-fit\">\n <div class=\"grow flex items-center justify-between bg-white\">\n <ng-content select=\"[filtro]\"></ng-content>\n </div>\n\n <div class=\"flex flex-col border-t\">\n <div class=\"flex-1 bg-app-bar flex items-center justify-between p-1\">\n <!-- <div class=\"hidden flex-1 sm:flex items-center flex-wrap gap-1\">-->\n <!-- </div>-->\n <div class=\"flex items-center flex-wrap mr-1 h-full\" *ngIf=\"leyenda\">\n <span class=\"font-bold\" [class]=\"leyenda.class\">{{ leyenda.text }}</span>\n </div>\n <div class=\"hidden flex-1 sm:flex items-center flex-wrap gap-1\">\n <div *ngIf=\"(botonesMenuFinal.izquierda ?? []).length > 0 \" class=\" flex items-center flex-wrap contenedor-botones\">\n <ng-container *ngFor=\"let btn of botonesMenu.izquierda; let idx = index;\">\n <ng-container *ngTemplateOutlet=\"botonesSuperiores; context:{btn: btn, idx: {inicio: idx, fin: botonesMenu.izquierda?.length}}\"></ng-container>\n </ng-container>\n </div>\n\n <div *ngIf=\"(botonesMenuFinal.crud ?? []).length > 0\" class=\" flex items-center flex-wrap contenedor-botones\">\n <ng-container *ngFor=\"let btn of botonesMenu.crud; let idx = index;\">\n <ng-container *ngTemplateOutlet=\"botonesSuperiores; context:{btn: btn, idx: {inicio: idx, fin: botonesMenu.crud?.length}}\"></ng-container>\n </ng-container>\n </div>\n\n <div *ngIf=\"(botonesMenuFinal.principal ?? []).length > 0\" class=\" flex items-center flex-wrap contenedor-botones\">\n <ng-container *ngFor=\"let btn of botonesMenu.principal; let idx = index;\">\n <ng-container *ngTemplateOutlet=\"botonesSuperiores; context:{btn: btn, idx: {inicio: idx, fin: botonesMenu.principal?.length}}\"></ng-container>\n </ng-container>\n </div>\n\n <div *ngIf=\"(botonesMenuFinal.derecha ?? []).length > 0\" class=\"flex-auto flex items-center justify-end contenedor-botones\">\n <ng-container *ngFor=\"let btn of botonesMenu.derecha; let idx = index;\">\n <ng-container *ngTemplateOutlet=\"botonesSuperiores; context:{btn: btn, idx: {inicio: idx, fin: botonesMenu.derecha?.length}}\"></ng-container>\n </ng-container>\n </div>\n <ng-content select=\"[objetosMenuPegado]\"></ng-content>\n </div>\n <div class=\"flex flex-1 sm:hidden items-center flex-wrap gap-1\">\n <button class=\"flex items-center justify-center text-2xs leading-none rounded-full p-1\"\n matRipple\n matTooltip=\"Botones de Acci\u00F3n\"\n type=\"button\"\n [matMenuTriggerFor]=\"menuOpciones\"\n >\n <mat-icon class=\"icon-xs\" svgIcon=\"roundMenu\"></mat-icon>\n </button>\n </div>\n <div class=\"flex-none flex items-center justify-end border-l-2\">\n <div class=\"flex-1 sm:flex-none flex items-center justify-end\">\n <ng-content select=\"[objetosMenu]\"></ng-content>\n </div>\n </div>\n <div *ngIf=\"ctrlBusqueda\" class=\"hidden flex-initial sm:flex items-center form-input max-w-[150px] bg-card rounded-full border m-1 px-1 border-l-2\"\n >\n <mat-icon svgIcon=\"roundSearch\" class=\"icon-xs\"></mat-icon>\n <input [formControl]=\"cCampoBusqueda\"\n class=\"text-xs px-1 py-1 border-0 outline-none w-full bg-transparent max-w-sm\"\n [placeholder]=\"ctrlBusquedaPlaceholder\"\n (keyup.enter)=\"ctrlBusqueda == 'query' ? cargarData() : false;\"\n type=\"search\">\n </div>\n <div class=\"flex-none flex items-center justify-end border-l-2\">\n <ng-content select=\"[botonesFiltro]\"></ng-content>\n <button matRipple *ngIf=\"isRecargarUsed || ctrlBusqueda == 'query'\"\n class=\"flex items-center justify-center text-2xs leading-none rounded-full p-1 text-green-700\"\n matTooltip=\"Actualizar datos\"\n (click)=\"(ctrlBusqueda == 'query' ? cargarData() : emitirAccionRecargar())\"\n type=\"button\">\n <mat-icon svgIcon=\"roundRefresh\" class=\"icon-xs\"></mat-icon>\n\n </button>\n <button matRipple [matMenuTriggerFor]=\"columnFilterMenu\" *ngIf=\"filtroCampos\"\n class=\"flex items-center justify-center text-2xs leading-none rounded-full p-1\"\n matTooltip=\"Columnas Filtro\"\n type=\"button\">\n <mat-icon svgIcon=\"roundFilterList\" class=\"icon-xs\"></mat-icon>\n </button>\n </div>\n </div>\n\n <div *ngIf=\"(botonesMenuFinal.secundario ?? []).length > 0\" class=\"flex-1 bg-app-bar flex items-center justify-between p-1 border-t\">\n <div class=\"hidden flex-1 sm:flex items-center flex-wrap gap-1\">\n <div class=\" flex items-center flex-wrap contenedor-botones\">\n <ng-container *ngFor=\"let btn of botonesMenu.secundario; let idx = index;\">\n <ng-container *ngTemplateOutlet=\"botonesSuperiores; context:{btn: btn, idx: {inicio: idx, fin: botonesMenu.secundario?.length}}\"></ng-container>\n </ng-container>\n </div>\n </div>\n </div>\n <!--<div class=\"grow flex flex-col items-stretch contenedor-tabla\" [ngClass]=\"{'table-container overflow-auto': esTabla}\">\n <pre>{{ this.chkLista.modelosChk | json }}</pre>\n <pre>{{ this.chkLista.checkbox.cantidadActivos | json }}</pre>\n <pre>{{ this.chkLista.checkbox.algunosActivos | json }}</pre>\n </div>-->\n <div class=\"grow flex flex-col items-stretch contenedor-tabla\" [ngClass]=\"{'table-container overflow-auto': esTabla}\">\n <ng-content select=\"[cuerpo]\"></ng-content>\n\n <table [id]=\"'tabla_' + nombreColeccion\" [dataSource]=\"dataSource\" [multiTemplateDataRows]=\"true\"\n [hidden]=\"!esTabla\"\n class=\"flex-1 table-mantenimiento table-auto h-fit\" mat-table matSort\n [trackBy]=\"trackByFn\"\n #tablaMantenimiento\n >\n\n <!--<table [dataSource]=\"dataSource\" class=\"table-mantenimiento table-auto h-auto w-full justify-center\" mat-table matSort>-->\n\n\n <ng-content select=\"[tableDefinitions]\"></ng-content>\n <ng-container matColumnDef=\"numeracion_automatica\">\n <th mat-header-cell *matHeaderCellDef style=\"width: 16px !important\">N\u00BA</th>\n <td mat-cell *matCellDef=\"let element; let i = dataIndex\" class=\"p-0 celda-numeracion-fila\">\n <div class=\"flex items-center justify-center font-bold numeracionFila\">\n <ng-container *ngIf=\"esTabla && paginador\">\n {{ (this.paginator?.pageIndex == 0 ? i + 1 : 1 + i + (this.paginator?.pageIndex ?? 1) * (this.paginator?.pageSize ?? 1)) }}\n </ng-container>\n <ng-container *ngIf=\"!paginador\">\n {{ (i + 1) }}\n </ng-container>\n </div>\n </td>\n <td mat-footer-cell *matFooterCellDef class=\"uppercase\"></td>\n </ng-container>\n <jvs-tabla-mantenimiento-column-defs [objThis]=\"this\" [colDetalle]=\"columnasTabla\"\n [nombreColeccion]=\"nombreColeccion\" [(chkLista)]=\"chkLista\"></jvs-tabla-mantenimiento-column-defs>\n\n <tr *matHeaderRowDef=\"visibleColumns; sticky: true\" mat-header-row class=\"title\" matHeader\n [style.height.px]=\"placeholderHeight\"\n ></tr>\n\n <ng-container *ngIf=\"!!filaExtraHeader\">\n <tr mat-row *matRowDef=\"let row; columns: ['filaExtraHeader']\" class=\"student-detail-row\"\n [style.height.px]=\"(virtualScroll ? (itemSize ? itemSize : 0) : 0)\"\n ></tr>\n\n <ng-container matColumnDef=\"filaExtraHeader\">\n <td mat-cell *matCellDef=\"let row; let i = dataIndex\" [attr.colspan]=\"visibleColumns.length\">\n\n <div class=\"row m-0 student-element-detail\"\n [@detailExpand]=\"(i == 0 && filaExtraHeader.esVisible && filaExtraHeader.esVisible()) ? 'expanded' : 'collapsed'\"\n [style.padding-right.px]=\"row.isExpanded ? 5 : 0\"\n [style.padding-left.px]=\"row.isExpanded ? 5 : 0\"\n >\n <ng-container *ngIf=\"filaExtraHeader.template\"\n [ngTemplateOutlet]=\"filaExtraHeader.template\"\n [ngTemplateOutletContext]=\"{ row: row }\"></ng-container>\n </div>\n\n </td>\n </ng-container>\n </ng-container>\n <ng-container *ngIf=\"filaFooter\">\n <tr *matFooterRowDef=\"visibleColumns\" mat-footer-row\n [style.height.px]=\"(virtualScroll ? (itemSize ? itemSize : 0) : 0)\"\n [id]=\"nombreColeccion + '_filaFooter'\"\n ></tr>\n </ng-container>\n\n <!--\t<tr\n *matRowDef=\"let row; columns: visibleColumns;\"\n class=\"hover:bg-secondary trans-ease-out cursor-pointer\"\n mat-row></tr>-->\n <tr\n [matRowKeyboardSelection]=\"tablaMantenimiento\"\n [rowModel]=\"row\"\n (seleccionarSiguiente)=\"opcMenu($event, {seccion: nombreColeccion, tipo: 'ver'});\"\n\n *matRowDef=\"let row; let idxTabla = dataIndex; columns: visibleColumns;\"\n (click)=\"seleccionarItem(row); opcMenu(row, {seccion: nombreColeccion, tipo: 'ver', tableDataIndex: idxTabla });\"\n (dblclick)=\"opcMenu(row, {seccion: nombreColeccion, tipo: 'seleccionar'}); dblclickItem.emit(row)\"\n (contextmenu)=\"(abrirMenuContextual($event, row)); $event. preventDefault();\"\n [ngClass]=\"classFila(row)\"\n @fadeInUp\n class=\"trans-ease-out cursor-pointer h-auto\"\n [style.height.px]=\"(virtualScroll ? (itemSize ? itemSize : 0) : 0)\"\n [id]=\"propiedadSeleccion(row)\"\n [matTooltip]=\"row[campoAnuladoMensaje ?? '']\"\n matTooltipPosition=\"below\"\n matTooltipClass=\"bg-red-700 text-red-100 m-0\"\n [matTooltipDisabled]=\"!campoAnuladoMensaje || !row[campoAnuladoMensaje]\"\n [class.regAnulado]=\"row[campoAnulado ?? ''] == 1\"\n (keyup.delete)=\"opcMenu(row, {seccion: nombreColeccion, tipo: 'eliminar'})\"\n mat-row></tr>\n <ng-container *ngIf=\"filaExtraTemplate\">\n <tr mat-row *matRowDef=\"let row; columns: ['expandedDetail']\" class=\"student-detail-row h-0\"></tr>\n\n <ng-container matColumnDef=\"expandedDetail\">\n <td mat-cell *matCellDef=\"let row\" [attr.colspan]=\"visibleColumns.length\">\n\n <div class=\"row m-0 student-element-detail\"\n [@detailExpand]=\"row.isExpanded ? 'expanded' : 'collapsed'\"\n [style.padding-right.px]=\"row.isExpanded ? 5 : 0\"\n [style.padding-left.px]=\"row.isExpanded ? 5 : 0\"\n >\n <ng-container [ngTemplateOutlet]=\"filaExtraTemplate\"\n [ngTemplateOutletContext]=\"{ row: row }\"></ng-container>\n </div>\n\n </td>\n </ng-container>\n </ng-container>\n </table>\n\n <ng-container *ngIf=\"componenteCargadoTotalmente\">\n <div *ngIf=\"(noData | async) && esTabla\" class=\"flex-1 text-center text-secondary font-medium\">\n No se encontraron datos\n </div>\n </ng-container>\n </div>\n <ng-content select=\"[appendTable]\"></ng-content>\n <div class=\"flex-1 bg-app-bar flex flex-col sm:flex-row items-start justify-between p-1\">\n <div class=\"flex-1 flex items-start flex-wrap gap-1\">\n <div *ngIf=\"(botonesMenuFinal.inferior ?? []).length > 0\" class=\" flex items-center flex-wrap\">\n <ng-container *ngFor=\"let btn of botonesMenu.inferior; let idx = index;\">\n <ng-container *ngTemplateOutlet=\"botonesSuperiores; context:{btn: btn, idx: {inicio: idx, fin: botonesMenu.inferior?.length}}\"></ng-container>\n </ng-container>\n </div>\n </div>\n\n <div *ngIf=\"esTabla && paginador\" class=\"flex-1 sm:flex-none flex items-center justify-end\">\n <mat-paginator class=\"tabla-mantenimiento-paginador\" [pageSizeOptions]=\"paginacion.pageSizeOptions\" [pageIndex]=\"paginacion.pageIndex - 1\" [length]=\"paginacion.pageLength\" [pageSize]=\"paginacion.pageSize\" (page)=\"paginacion.pageCurrent = $event; emitirResultados();\" ></mat-paginator>\n </div>\n </div>\n </div>\n\n</div>\n\n\n\n<!-- SECCION DE TEMPLATES O MENUS -->\n\n\n<mat-menu #columnFilterMenu=\"matMenu\" xPosition=\"before\" yPosition=\"below\">\n <ng-container *ngFor=\"let column of columnasTabla\">\n <button (click)=\"toggleColumnVisibility(column, $event)\" *ngIf=\"!tipoValorFuncion(column.noMostrarEnLista, false)\"\n class=\"checkbox-item mat-menu-item\">\n <mat-checkbox (click)=\"$event.stopPropagation()\" [(ngModel)]=\"column.visible\" [ngModelOptions]=\"{standalone: true}\" color=\"primary\">\n <span [innerHTML]=\"(column.labelLista ?? column.label).replace('<br>', ' ')\"></span>\n </mat-checkbox>\n </button>\n </ng-container>\n</mat-menu>\n\n\n\n\n\n\n<ng-template #botonesSuperiores let-btn=\"btn\" let-idx=\"idx\">\n <ng-container *ngTemplateOutlet=\"botonesContextual; context:{btn: btn, item: objSeleccionado, barraSuperior: true, idx: idx}\"></ng-container>\n</ng-template>\n\n<ng-template #botonesContextual let-btn=\"btn\" let-item=\"item\" let-barraSuperior=\"barraSuperior\" let-idx=\"idx\">\n\n <ng-container *ngIf=\"barraSuperior; else noBarraSuperior\">\n\n <!--\t\t<button mat-button style=\"min-width: unset; border: 1px !important;\" class=\"uppercase border border-gray rounded-none h-full px-1 disabled:opacity-50 disabled:text-secondary disabled:bg-transparent\">-->\n <!--\t\t\t<mat-icon *ngIf=\"btn.icono\" [svgIcon]=\"btn.icono\" size=\"15px\" class=\"icon-xs\"></mat-icon>-->\n <!--\t\t</button>-->\n <ng-container *ngIf=\"btn.subItems && btn.subItems.length > 0\">\n <button matRipple [matRippleUnbounded]=\"false\" class=\"flex items-center justify-between uppercase text-2xs leading-none rounded-none px-2 py-1 bg-opacity-95 hover:bg-opacity-100 disabled:opacity-50 disabled:text-secondary disabled:!bg-gray-300 dark:disabled:!bg-gray-500 mat-elevation-z2\" type=\"button\"\n\n *ngIf=\"(!btn.esVisible || btn.esVisible(item, this)) && subItemsActivos(btn, item)\"\n [class]=\"(btn.class?btn.class:'')\"\n\n (click)=\"opcMenu(item, btn)\"\n [style.min-width]=\"((btn.soloIcono ?? tipoValorFuncion(soloIconos)) ? 'unset' : '')\"\n [matTooltip]=\"btn.tooltip || (btn.label ? btn.label : ( (derechosActuales && derechosActuales[btn.cDerechoCodigo ?? btn.tipo]) ? derechosActuales[btn.cDerechoCodigo ?? btn.tipo]['cDerechoNombre'] : capitalizarTexto(btn.tipo))) \"\n [matMenuTriggerFor]=\"menuOtrosBarra.menu\"\n\n [matBadge]=\"btn.badge\"\n matBadgeSize=\"small\"\n >\n <mat-icon class=\"icon-xs\" [class.mr-0.5]=\"!(btn.soloIcono ?? tipoValorFuncion(soloIconos))\" *ngIf=\"btn.icono\" [svgIcon]=\"btn.icono\" ></mat-icon>\n <span class=\"whitespace-nowrap\" *ngIf=\"!(btn.soloIcono ?? tipoValorFuncion(soloIconos))\">{{ btn.label ? btn.label : ( (derechosActuales && derechosActuales[btn.cDerechoCodigo ?? btn.tipo]) ? derechosActuales[btn.cDerechoCodigo ?? btn.tipo]['cDerechoNombre'] : capitalizarTexto(btn.tipo)) }}</span>\n <mat-icon class=\"icon-xs\" svgIcon=\"fa5sCaretDown\" ></mat-icon>\n </button>\n\n <jvs-tabla-mantenimiento-menu #menuOtrosBarra\n [objThis]=\"objThis\"\n [nombreColeccion]=\"nombreColeccion\"\n [item]=\"item\"\n [derechosActuales]=\"derechosActuales\"\n [subItems]=\"btn.subItems\"\n (opcionSelecionada)=\"opcMenu($event.item, $event.btn)\"\n [botonTemplate]=\"botonesContextual\"\n >\n </jvs-tabla-mantenimiento-menu>\n </ng-container>\n <ng-container *ngIf=\"!btn.subItems || btn.subItems.length == 0\">\n <button class=\"flex items-center justify-between uppercase text-2xs leading-none rounded-none px-2 py-1 bg-opacity-95 hover:bg-opacity-100 disabled:opacity-50 disabled:text-secondary disabled:!bg-gray-300 dark:disabled:!bg-gray-500 mat-elevation-z2\" type=\"button\"\n\n *ngIf=\"!btn.esVisible || btn.esVisible(item, this)\"\n [class]=\"(btn.class?btn.class:'text-secondary')\"\n [ngClass]=\"{'text-secondary italic': !ignorarDerechos && !btn.esIndependiente && (!btn.ignorarDerecho && (!derechosActuales || !derechosActuales[btn.cDerechoCodigo ?? btn.tipo])) && !(['nuevo', 'editar', 'eliminar'].includes(btn.tipo))}\"\n [disabled]=\"!btn.esIndependiente && botonDisabled(btn, item)\"\n (click)=\"opcMenu(item, btn)\"\n [style.min-width]=\"((btn.soloIcono ?? tipoValorFuncion(soloIconos)) ? 'unset' : '')\"\n [matTooltip]=\"btn.tooltip || (btn.label ? btn.label : ( (derechosActuales && derechosActuales[btn.cDerechoCodigo ?? btn.tipo]) ? derechosActuales[btn.cDerechoCodigo ?? btn.tipo]['cDerechoNombre'] : capitalizarTexto(btn.tipo))) \"\n\n [matBadge]=\"btn.badge\"\n matBadgeSize=\"small\"\n >\n <mat-icon class=\"icon-xs\" [class.mr-0.5]=\"!(btn.soloIcono ?? tipoValorFuncion(soloIconos))\" *ngIf=\"btn.icono\" [svgIcon]=\"btn.icono\"></mat-icon>\n <span class=\"whitespace-nowrap\" *ngIf=\"!(btn.soloIcono ?? tipoValorFuncion(soloIconos))\">{{ btn.label ? btn.label : ( (derechosActuales && derechosActuales[btn.cDerechoCodigo ?? btn.tipo]) ? derechosActuales[btn.cDerechoCodigo ?? btn.tipo]['cDerechoNombre'] : capitalizarTexto(btn.tipo)) }}</span>\n </button>\n\n </ng-container>\n\n </ng-container>\n <ng-template #noBarraSuperior>\n\n <ng-container *ngIf=\"btn.subItems && btn.subItems.length > 0\">\n <button class=\"flex items-center justify-between uppercase w-full rounded-none px-2 disabled:opacity-50 disabled:text-secondary disabled:bg-transparent\" mat-menu-item type=\"button\"\n *ngIf=\"!btn.noContextual && (!btn.esVisible || btn.esVisible(item, this))\"\n [class]=\"(btn.class?btn.class.replace('text-white', '').replace('bg', 'text'):'text-secondary')\"\n [ngClass]=\"{'text-secondary italic': !ignorarDerechos && !btn.esIndependiente && (!btn.ignorarDerecho && (!derechosActuales || !derechosActuales[btn.cDerechoCodigo ?? btn.tipo]))}\"\n [disabled]=\"!btn.esIndependiente && botonDisabled(btn, item)\"\n (click)=\"opcMenu(item, btn); $event.stopPropagation();\"\n [matMenuTriggerFor]=\"menuOtrosBarra.menu\"\n >\n <div class=\"flex w-full items-center justify-between uppercase text-2xs\"\n >\n <mat-icon *ngIf=\"btn.icono\" [svgIcon]=\"btn.icono\"\n class=\"flex-none icon-xs\"\n ></mat-icon>\n <span class=\"grow text-2xs\">{{ btn.label ? btn.label : ( (derechosActuales && derechosActuales[btn.cDerechoCodigo ?? btn.tipo]) ? derechosActuales[btn.cDerechoCodigo ?? btn.tipo]['cDerechoNombre'] : capitalizarTexto(btn.tipo)) }}</span>\n <mat-icon class=\"flex-none icon-xs\" svgIcon=\"fa5sCaretRight\"></mat-icon>\n </div>\n </button>\n\n <jvs-tabla-mantenimiento-menu #menuOtrosBarra\n [objThis]=\"objThis\"\n [nombreColeccion]=\"nombreColeccion\"\n [item]=\"item\"\n [derechosActuales]=\"derechosActuales\"\n [subItems]=\"btn.subItems\"\n (opcionSelecionada)=\"opcMenu($event.item, $event.btn)\"\n [botonTemplate]=\"botonesContextual\"\n >\n </jvs-tabla-mantenimiento-menu>\n </ng-container>\n <ng-container *ngIf=\"!btn.subItems || btn.subItems.length == 0\">\n <ng-container *ngIf=\"btn.tipo == '-#SEPARADOR#-'; else itemsNormales\">\n <mat-divider></mat-divider>\n </ng-container>\n <ng-template #itemsNormales>\n <button class=\"flex items-center justify-between uppercase w-full rounded-none px-2 disabled:opacity-50 disabled:text-secondary disabled:bg-transparent\" mat-menu-item type=\"button\"\n *ngIf=\"!btn.noContextual && (!btn.esVisible || btn.esVisible(item, this))\"\n [class]=\"(btn.class?btn.class.replace('text-white', '').replace('bg', 'text'):'text-secondary')\"\n [ngClass]=\"{'text-secondary italic': !ignorarDerechos && !btn.esIndependiente && (!btn.ignorarDerecho && (!derechosActuales || !derechosActuales[btn.cDerechoCodigo ?? btn.tipo]))}\"\n [disabled]=\"!btn.esIndependiente && botonDisabled(btn, item)\"\n (click)=\"opcMenu(item, btn)\"\n >\n <div class=\"flex w-full items-center justify-between uppercase text-2xs\">\n <mat-icon *ngIf=\"btn.icono\" [svgIcon]=\"btn.icono\" class=\"flex-none icon-xs\"\n ></mat-icon>\n <span class=\"grow text-2xs\">{{ btn.label ? btn.label : ( (derechosActuales && derechosActuales[btn.cDerechoCodigo ?? btn.tipo]) ? derechosActuales[btn.cDerechoCodigo ?? btn.tipo]['cDerechoNombre'] : capitalizarTexto(btn.tipo)) }}</span>\n </div>\n </button>\n </ng-template>\n\n </ng-container>\n\n </ng-template>\n\n</ng-template>\n\n<ng-template #userMenu let-item=\"item\">\n <div class=\"mat-menu bg-white rounded mat-elevation-z8 shadow botonesContextual\">\n <ng-container *ngFor=\"let btn of listaMenuCompleto\">\n <ng-container *ngTemplateOutlet=\"botonesContextual; context:{btn: btn, item: objSeleccionado, barraSuperior: false}\"></ng-container>\n </ng-container>\n </div>\n</ng-template>\n\n\n<mat-menu #menuOpciones=\"matMenu\" xPosition=\"before\" yPosition=\"below\">\n <ng-container *ngFor=\"let btn of listaMenuCompleto\">\n <ng-container\n *ngTemplateOutlet=\"botonesContextual; context:{btn: btn, item: objSeleccionado, barraSuperior: false}\"></ng-container>\n </ng-container>\n</mat-menu>\n", styles: [":root{--tabla-mantenimiento-seleccion-fondo: rgb(179, 217, 252);--tabla-mantenimiento-seleccion-texto: rgb(1, 84, 164);--mat-paginator-container-size: 30px}:root .table-mantenimiento .elemento-seleccionado{background-color:var(--tabla-mantenimiento-seleccion-fondo)!important;color:var(--tabla-mantenimiento-seleccion-texto)!important;border-color:var(--tabla-mantenimiento-seleccion-texto)!important}.jvs-tabla-mantenimiento{width:inherit}.jvs-tabla-mantenimiento .contenedor-botones>*:first-child{@apply rounded-l;}.jvs-tabla-mantenimiento .contenedor-botones>*:last-child{@apply rounded-r;}.jvs-tabla-mantenimiento .mat-mdc-menu-content:not(:empty){@apply flex flex-col items-start;padding:0!important}.jvs-tabla-mantenimiento .mat-mdc-menu-item{line-height:24px!important;height:24px!important;min-height:24px!important}.jvs-tabla-mantenimiento .mat-mdc-menu-panel{min-height:auto!important}.jvs-tabla-mantenimiento .mat-mdc-table .mat-mdc-cell,.jvs-tabla-mantenimiento .mat-mdc-table .mat-mdc-header-cell .mat-mdc-footer-cell{white-space:unset}.jvs-tabla-mantenimiento .table-container{max-height:600px!important}.jvs-tabla-mantenimiento .table-mantenimiento .mat-mdc-table-sticky-border-elem-right{border-left:1px solid #e0e0e0}.jvs-tabla-mantenimiento .table-mantenimiento .mat-mdc-table-sticky-border-elem-left{border-right:1px solid #e0e0e0}.jvs-tabla-mantenimiento .table-mantenimiento tr.regAnulado .mat-mdc-cell{color:unset!important}.jvs-tabla-mantenimiento .table-mantenimiento .bg-primary-activo .numeracionFila{@apply rounded-full bg-primary-contrast text-primary mx-1 p-1 w-6 h-6;}.jvs-tabla-mantenimiento .table-mantenimiento th .form-input{@apply w-auto;}.jvs-tabla-mantenimiento .table-mantenimiento th.mat-mdc-header-cell,.jvs-tabla-mantenimiento .table-mantenimiento td.mat-mdc-cell,.jvs-tabla-mantenimiento .table-mantenimiento td.mat-mdc-footer-cell{border-width:1px;border-style:solid}.jvs-tabla-mantenimiento .table-mantenimiento th.mat-mdc-header-cell:not(.celda-numeracion-fila),.jvs-tabla-mantenimiento .table-mantenimiento td.mat-mdc-cell:not(.celda-numeracion-fila),.jvs-tabla-mantenimiento .table-mantenimiento td.mat-mdc-footer-cell:not(.celda-numeracion-fila){padding:.05rem .25rem}.jvs-tabla-mantenimiento .table-mantenimiento th.mat-mdc-header-cell:first-of-type:not(.celda-numeracion-fila),.jvs-tabla-mantenimiento .table-mantenimiento th.mat-mdc-header-cell:last-of-type:not(.celda-numeracion-fila),.jvs-tabla-mantenimiento .table-mantenimiento td.mat-mdc-cell:first-of-type:not(.celda-numeracion-fila),.jvs-tabla-mantenimiento .table-mantenimiento td.mat-mdc-cell:last-of-type:not(.celda-numeracion-fila),.jvs-tabla-mantenimiento .table-mantenimiento td.mat-mdc-footer-cell:first-of-type:not(.celda-numeracion-fila),.jvs-tabla-mantenimiento .table-mantenimiento td.mat-mdc-footer-cell:last-of-type:not(.celda-numeracion-fila){padding:0 .25rem}.jvs-tabla-mantenimiento .table-mantenimiento .student-element-detail{overflow:hidden;display:flex;align-items:center;justify-content:center}.jvs-tabla-mantenimiento .table-mantenimiento .mat-mdc-header-row{height:25px!important;color:rgb(var(--color-primary))!important;background-color:rgb(var(--color-primary-contrast))!important}.jvs-tabla-mantenimiento .table-mantenimiento .mat-mdc-header-cell{padding:5px;font-size:10px;line-height:10px;font-weight:700!important;color:inherit}.jvs-tabla-mantenimiento .table-mantenimiento .mdc-data-table__row:not(.mdc-data-table__row--selected):not(.elemento-seleccionado):hover,.jvs-tabla-mantenimiento .table-mantenimiento .mdc-data-table__row:not(.mdc-data-table__row--selected):not(.elemento-seleccionado):focus{background-color:rgba(var(--color-primary-contrast),.04)}.jvs-tabla-mantenimiento .table-mantenimiento .mat-mdc-row .mat-mdc-cell,.jvs-tabla-mantenimiento .table-mantenimiento .mat-mdc-footer-row .mat-mdc-cell{font-size:10px}.jvs-tabla-mantenimiento .table-mantenimiento .mat-mdc-row .mat-mdc-footer-cell:empty,.jvs-tabla-mantenimiento .table-mantenimiento .mat-mdc-footer-row .mat-mdc-footer-cell:empty{border-width:0!important}.jvs-tabla-mantenimiento .table-mantenimiento .mat-mdc-cell{@apply leading-tight;}.jvs-tabla-mantenimiento .table-mantenimiento th.mat-mdc-header-cell{border-color:#d4d0d0;@apply text-center uppercase;}.jvs-tabla-mantenimiento .table-mantenimiento th.mat-mdc-header-cell .mat-sort-header-container{@apply flex items-center justify-between w-full;}.jvs-tabla-mantenimiento .table-mantenimiento th.mat-mdc-header-cell .mat-sort-header-container .mat-sort-header-content{@apply inline w-full text-center;}.jvs-tabla-mantenimiento .table-mantenimiento th.mat-mdc-header-cell .mat-sort-header-container .mat-sort-header-arrow{@apply flex-none;}.jvs-tabla-mantenimiento .table-mantenimiento .mat-mdc-sort-header-content{width:100%;text-align:center;display:unset;align-items:center}\n"] }]
|
|
1760
1788
|
}], ctorParameters: () => [{ type: i1$2.FormBuilder }, { type: i2$2.Overlay }, { type: i0.ViewContainerRef }, { type: TablaMantenimientoService }, { type: i0.ChangeDetectorRef }], propDecorators: { id: [{
|
|
1761
1789
|
type: HostBinding
|
|
1762
1790
|
}], virtualScroll: [{
|
|
@@ -1860,15 +1888,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.7", ngImpor
|
|
|
1860
1888
|
type: Input
|
|
1861
1889
|
}], condicionesClaseFila: [{
|
|
1862
1890
|
type: Input
|
|
1891
|
+
}], soloIconos: [{
|
|
1892
|
+
type: Input
|
|
1863
1893
|
}] } });
|
|
1864
1894
|
|
|
1865
|
-
function tipoValorFuncion(datoParam, ...param) {
|
|
1866
|
-
if (typeof datoParam === 'function') {
|
|
1867
|
-
return datoParam(...param);
|
|
1868
|
-
}
|
|
1869
|
-
return datoParam;
|
|
1870
|
-
}
|
|
1871
|
-
|
|
1872
1895
|
class LucesNavidadComponent {
|
|
1873
1896
|
enProduccion = true;
|
|
1874
1897
|
forzarMuestra = false;
|
|
@@ -1935,5 +1958,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.7", ngImpor
|
|
|
1935
1958
|
* Generated bundle index. Do not edit.
|
|
1936
1959
|
*/
|
|
1937
1960
|
|
|
1938
|
-
export { DialogFlotanteComponent, LucesNavidadComponent, MatSuffixSearchButtonComponent, ProgressBarComponent, TablaMantenimientoComponent, TablaMantenimientoService
|
|
1961
|
+
export { DialogFlotanteComponent, LucesNavidadComponent, MatSuffixSearchButtonComponent, ProgressBarComponent, TablaMantenimientoComponent, TablaMantenimientoService };
|
|
1939
1962
|
//# sourceMappingURL=jvsoft-components.mjs.map
|