intelica-library-ui 0.1.54 → 0.1.56
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/intelica-library-ui.mjs +169 -18
- package/fesm2022/intelica-library-ui.mjs.map +1 -1
- package/lib/components/actions-menu/actions-menu.component.d.ts +7 -1
- package/lib/components/table/table.component.d.ts +2 -1
- package/lib/services/htmlToExcel.service.d.ts +12 -1
- package/lib/services/shared.service.d.ts +1 -0
- package/package.json +1 -1
|
@@ -1420,7 +1420,46 @@ class SharedService {
|
|
|
1420
1420
|
}
|
|
1421
1421
|
});
|
|
1422
1422
|
return item;
|
|
1423
|
-
}), [
|
|
1423
|
+
}), [
|
|
1424
|
+
(elm) => {
|
|
1425
|
+
let value = elm[column];
|
|
1426
|
+
if (value == null) {
|
|
1427
|
+
value = "";
|
|
1428
|
+
}
|
|
1429
|
+
if (typeof value === "string") {
|
|
1430
|
+
const normalized = value.trim().toLowerCase();
|
|
1431
|
+
const startsWithSpecial = /^[^a-z0-9]/i.test(normalized);
|
|
1432
|
+
return startsWithSpecial ? `~${normalized}` : normalized;
|
|
1433
|
+
}
|
|
1434
|
+
return value;
|
|
1435
|
+
},
|
|
1436
|
+
], [criteria]);
|
|
1437
|
+
}
|
|
1438
|
+
SortRecursivePrimeNg(data, column, criteria) {
|
|
1439
|
+
return _.orderBy(data.map(item => {
|
|
1440
|
+
Object.keys(item).forEach(key => {
|
|
1441
|
+
if (Array.isArray(item[key])) {
|
|
1442
|
+
item[key] = this.SortRecursive(item[key], column, criteria);
|
|
1443
|
+
}
|
|
1444
|
+
});
|
|
1445
|
+
return item;
|
|
1446
|
+
}), [
|
|
1447
|
+
(elm) => {
|
|
1448
|
+
let value = elm[column];
|
|
1449
|
+
if (value == null || (typeof value === "string" && value.trim() === "")) {
|
|
1450
|
+
return "___0";
|
|
1451
|
+
}
|
|
1452
|
+
if (typeof value === "string") {
|
|
1453
|
+
const normalized = value.trim().toLowerCase();
|
|
1454
|
+
const startsWithSpecial = /^[^a-z0-9]/i.test(normalized);
|
|
1455
|
+
if (startsWithSpecial) {
|
|
1456
|
+
return `___1${normalized}`;
|
|
1457
|
+
}
|
|
1458
|
+
return `___2${normalized}`;
|
|
1459
|
+
}
|
|
1460
|
+
return `___2${value}`;
|
|
1461
|
+
},
|
|
1462
|
+
], [criteria]);
|
|
1424
1463
|
}
|
|
1425
1464
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: SharedService, deps: [{ token: i1$1.Location }], target: i0.ɵɵFactoryTarget.Injectable });
|
|
1426
1465
|
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: SharedService, providedIn: "root" });
|
|
@@ -1445,6 +1484,7 @@ class TableComponent {
|
|
|
1445
1484
|
ShowIndex = false;
|
|
1446
1485
|
ListDataSelected = [];
|
|
1447
1486
|
SelectedIdentifier = null;
|
|
1487
|
+
ClassName = "";
|
|
1448
1488
|
EmmitSelectedItem = new EventEmitter();
|
|
1449
1489
|
EmitListDataFilter = new EventEmitter();
|
|
1450
1490
|
EmitSearchEvent = new EventEmitter();
|
|
@@ -1515,7 +1555,7 @@ class TableComponent {
|
|
|
1515
1555
|
SortPages() {
|
|
1516
1556
|
const order = this.SortOrder === 1 ? "asc" : "desc";
|
|
1517
1557
|
const field = this.SortField;
|
|
1518
|
-
this.ListDataFilter = this.SharedService.
|
|
1558
|
+
this.ListDataFilter = this.SharedService.SortRecursivePrimeNg([...this.ListDataFilter], field, order);
|
|
1519
1559
|
this.UpdatePages();
|
|
1520
1560
|
}
|
|
1521
1561
|
UpdatePages() {
|
|
@@ -1589,11 +1629,11 @@ class TableComponent {
|
|
|
1589
1629
|
this.EmitSearchEvent.emit(this.SearchInput);
|
|
1590
1630
|
}
|
|
1591
1631
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: TableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1592
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: TableComponent, isStandalone: true, selector: "intelica-table", inputs: { ComponentId: "ComponentId", ListData: "ListData", ShowSearch: "ShowSearch", ListSearchOptions: "ListSearchOptions", ShowPagination: "ShowPagination", RowsPerPage: "RowsPerPage", ShowCheckbox: "ShowCheckbox", ShowIndex: "ShowIndex", ListDataSelected: "ListDataSelected", SelectedIdentifier: "SelectedIdentifier" }, outputs: { EmmitSelectedItem: "EmmitSelectedItem", EmitListDataFilter: "EmitListDataFilter", EmitSearchEvent: "EmitSearchEvent" }, queries: [{ propertyName: "AdditionalTemplate", first: true, predicate: ["additionalTemplate"], descendants: true }, { propertyName: "Columns", predicate: ColumnComponent }, { propertyName: "ColumnGroups", predicate: ColumnGroupComponent }, { propertyName: "RowResumenGroups", predicate: RowResumenComponent }], viewQueries: [{ propertyName: "PaginatorTable", first: true, predicate: ["paginatorTable"], descendants: true }, { propertyName: "SearchTable", first: true, predicate: ["searchTable"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"prTable\">\r\n\t<div class=\"prTableTools\">\r\n\t\t<div class=\"prTableTools__additional\">\r\n\t\t\t@if (AdditionalTemplate) {\r\n\t\t\t<div class=\"prTableTools__additional\">\r\n\t\t\t\t<ng-container *ngTemplateOutlet=\"AdditionalTemplate\"></ng-container>\r\n\t\t\t</div>\r\n\t\t\t}\r\n\t\t</div>\r\n\t\t@if (ShowSearch) {\r\n\t\t<intelica-search\r\n\t\t\t#searchTable\r\n\t\t\t[ComponentId]=\"ComponentId + 'Search'\"\r\n\t\t\t(OnSearch)=\"ExecuteSearch($event)\"\r\n\t\t\t[SearchFieldOptions]=\"ListSearchOptionsSimple\"\r\n\t\t\t[SearchOnKeyup]=\"false\"\r\n\t\t\t[SimpleSearchInput]=\"false\"\r\n\t\t></intelica-search>\r\n\t\t} @if (ShowPagination) {\r\n\t\t<intelica-paginator #paginatorTable [TotalItems]=\"ListDataFilter.length\" [ItemsPerPage]=\"RowsPerPage\" (PageChange)=\"OnPageChange($event)\"></intelica-paginator>\r\n\t\t}\r\n\t</div>\r\n\t<p-table\r\n\t\tclass=\"prTableBasic\"\r\n\t\t[value]=\"ListDataTable\"\r\n\t\tresponsiveLayout=\"scroll\"\r\n\t\t[(selection)]=\"ListDataSelectedFilter\"\r\n\t\t(onHeaderCheckboxToggle)=\"SelectAll($event)\"\r\n\t\t(onRowSelect)=\"OnRowSelect($event)\"\r\n\t\t(onRowUnselect)=\"OnRowUnselect($event)\"\r\n\t>\r\n\t\t<!-- Encabezados -->\r\n\t\t<ng-template pTemplate=\"header\">\r\n\t\t\t<tr>\r\n\t\t\t\t@for (col of ColumnGroupList; track $index) {\r\n\t\t\t\t<th [attr.colspan]=\"col.colspan\" [attr.rowspan]=\"col.rowspan\" [pSortableColumn]=\"col.sortable ? col.field : ''\" [style.width]=\"col.width\" (click)=\"OnSort(col.field)\">\r\n\t\t\t\t\t<span pTooltip=\"{{ col.header }}\">{{ col.header }}</span>\r\n\t\t\t\t\t<p-sortIcon *ngIf=\"col.sortable\" [field]=\"col.field\"></p-sortIcon>\r\n\t\t\t\t</th>\r\n\t\t\t\t} @if (ShowCheckbox && ColumnGroupList.length != 0) {\r\n\t\t\t\t<th class=\"text-center\" style=\"width: 4%\" rowspan=\"2\">\r\n\t\t\t\t\t<p-tableHeaderCheckbox class=\"prCheckbox\" [ngClass]=\"{ 'prCheckbox--indeterminate': ListDataSelectedTemp.length > 0 && ListDataSelectedTemp.length < ListDataFilter.length }\" />\r\n\t\t\t\t</th>\r\n\t\t\t\t}\r\n\t\t\t</tr>\r\n\t\t\t<tr>\r\n\t\t\t\t@for (col of ColumnList; track $index) { @if(col.showHeader ){\r\n\t\t\t\t<th [class]=\"col.className\" [pSortableColumn]=\"col.sortable ? col.field : ''\" [style.width]=\"col.width\" (click)=\"OnSort(col.field)\">\r\n\t\t\t\t\t<span pTooltip=\"{{ col.headerTooltip }}\" tooltipPosition=\"{{ col.headerTooltipPosition }}\">{{ col.header }}</span>\r\n\t\t\t\t\t<p-sortIcon *ngIf=\"col.sortable\" [field]=\"col.field\"></p-sortIcon>\r\n\t\t\t\t</th>\r\n\t\t\t\t} } @if(ShowCheckbox && ColumnGroupList.length == 0 ){\r\n\t\t\t\t<th class=\"text-center\" style=\"width: 4%\">\r\n\t\t\t\t\t<p-tableHeaderCheckbox class=\"prCheckbox\" [ngClass]=\"{ 'prCheckbox--indeterminate': ListDataSelectedTemp.length > 0 && ListDataSelectedTemp.length < ListDataFilter.length }\" />\r\n\t\t\t\t</th>\r\n\t\t\t\t}\r\n\t\t\t</tr>\r\n\t\t\t@if (ListDataFilter.length > 0) {\r\n\t\t\t<tr class=\"fixedRow\">\r\n\t\t\t\t@for (col of RowResumenList; track $index) {\r\n\t\t\t\t<td [ngClass]=\"col.className\" [attr.colspan]=\"col.colspan\" [attr.rowspan]=\"col.rowspan\">\r\n\t\t\t\t\t@if (col.templateRef) {\r\n\t\t\t\t\t<span>\r\n\t\t\t\t\t\t<ng-container *ngTemplateOutlet=\"col.templateRef\"></ng-container>\r\n\t\t\t\t\t</span>\r\n\t\t\t\t\t} @else {\r\n\t\t\t\t\t<ng-template #defaultContent></ng-template>\r\n\t\t\t\t\t}\r\n\t\t\t\t</td>\r\n\t\t\t\t}\r\n\t\t\t</tr>\r\n\t\t\t}\r\n\t\t</ng-template>\r\n\t\t<!-- Cuerpo de la tabla -->\r\n\t\t<ng-template pTemplate=\"body\" let-rowData let-rowIndex=\"rowIndex\">\r\n\t\t\t<tr>\r\n\t\t\t\t@for (col of ColumnList; track $index) {\r\n\t\t\t\t<td [ngClass]=\"col.className\">\r\n\t\t\t\t\t@if (col.showIndex) {\r\n\t\t\t\t\t{{ rowIndex + 1 + (CurrentPage - 1) * RowsPerPage }}\r\n\t\t\t\t\t} @else { @if (col.templateRef) {\r\n\t\t\t\t\t<ng-container *ngTemplateOutlet=\"col.templateRef; context: { $implicit: rowData }\"></ng-container>\r\n\t\t\t\t\t} @else {\r\n\t\t\t\t\t<span class=\"text-breakWord\" pTooltip=\"{{ col.tooltip }}\" tooltipPosition=\"{{ col.tooltipPosition }}\">\r\n\t\t\t\t\t\t{{ rowData[col.field] }}\r\n\t\t\t\t\t</span>\r\n\t\t\t\t\t} }\r\n\t\t\t\t</td>\r\n\t\t\t\t} @if (ShowCheckbox) {\r\n\t\t\t\t<td class=\"text-center\">\r\n\t\t\t\t\t<p-tableCheckbox [value]=\"rowData\" class=\"prCheckbox\" />\r\n\t\t\t\t</td>\r\n\t\t\t\t}\r\n\t\t\t</tr>\r\n\t\t</ng-template>\r\n\t\t<ng-template #emptymessage>\r\n\t\t\t<tr>\r\n\t\t\t\t<td [attr.colspan]=\"ColumnList.length + (ShowCheckbox ? 1 : 0)\" class=\"text-center\">\r\n\t\t\t\t\t{{ \"Nodata\" | term : GlobalTermService.languageCode }}\r\n\t\t\t\t</td>\r\n\t\t\t</tr>\r\n\t\t</ng-template>\r\n\t</p-table>\r\n</div>\r\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: SearchComponent, selector: "intelica-search", inputs: ["ComponentId", "SearchFieldOptions", "SearchOnKeyup", "SimpleSearchInput", "Placeholder"], outputs: ["OnSearch"] }, { kind: "component", type: PaginatorComponent, selector: "intelica-paginator", inputs: ["TotalItems", "CurrentPage", "ItemsPerPage"], outputs: ["PageChange"] }, { kind: "ngmodule", type: TableModule }, { kind: "component", type: i2$1.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "style", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "scrollDirection", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "responsive", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "autoLayout", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "size", "showGridlines", "stripedRows", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "virtualRowHeight", "selectAll"], outputs: ["contextMenuSelectionChange", "selectAllChange", "selectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "directive", type: i3$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: i2$1.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { kind: "component", type: i2$1.SortIcon, selector: "p-sortIcon", inputs: ["field"] }, { kind: "component", type: i2$1.TableCheckbox, selector: "p-tableCheckbox", inputs: ["disabled", "value", "index", "inputId", "name", "required", "ariaLabel"] }, { kind: "component", type: i2$1.TableHeaderCheckbox, selector: "p-tableHeaderCheckbox", inputs: ["disabled", "inputId", "name", "ariaLabel"] }, { kind: "ngmodule", type: BadgeModule }, { kind: "ngmodule", type: TooltipModule }, { kind: "directive", type: i4.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions"] }, { kind: "pipe", type: TermPipe, name: "term" }] });
|
|
1632
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: TableComponent, isStandalone: true, selector: "intelica-table", inputs: { ComponentId: "ComponentId", ListData: "ListData", ShowSearch: "ShowSearch", ListSearchOptions: "ListSearchOptions", ShowPagination: "ShowPagination", RowsPerPage: "RowsPerPage", ShowCheckbox: "ShowCheckbox", ShowIndex: "ShowIndex", ListDataSelected: "ListDataSelected", SelectedIdentifier: "SelectedIdentifier", ClassName: "ClassName" }, outputs: { EmmitSelectedItem: "EmmitSelectedItem", EmitListDataFilter: "EmitListDataFilter", EmitSearchEvent: "EmitSearchEvent" }, queries: [{ propertyName: "AdditionalTemplate", first: true, predicate: ["additionalTemplate"], descendants: true }, { propertyName: "Columns", predicate: ColumnComponent }, { propertyName: "ColumnGroups", predicate: ColumnGroupComponent }, { propertyName: "RowResumenGroups", predicate: RowResumenComponent }], viewQueries: [{ propertyName: "PaginatorTable", first: true, predicate: ["paginatorTable"], descendants: true }, { propertyName: "SearchTable", first: true, predicate: ["searchTable"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"prTable\">\r\n\t<div class=\"prTableTools\">\r\n\t\t<div class=\"prTableTools__additional\">\r\n\t\t\t@if (AdditionalTemplate) {\r\n\t\t\t<div class=\"prTableTools__additional\">\r\n\t\t\t\t<ng-container *ngTemplateOutlet=\"AdditionalTemplate\"></ng-container>\r\n\t\t\t</div>\r\n\t\t\t}\r\n\t\t</div>\r\n\t\t@if (ShowSearch) {\r\n\t\t<intelica-search\r\n\t\t\t#searchTable\r\n\t\t\t[ComponentId]=\"ComponentId + 'Search'\"\r\n\t\t\t(OnSearch)=\"ExecuteSearch($event)\"\r\n\t\t\t[SearchFieldOptions]=\"ListSearchOptionsSimple\"\r\n\t\t\t[SearchOnKeyup]=\"false\"\r\n\t\t\t[SimpleSearchInput]=\"false\"\r\n\t\t></intelica-search>\r\n\t\t} @if (ShowPagination) {\r\n\t\t<intelica-paginator #paginatorTable [TotalItems]=\"ListDataFilter.length\" [ItemsPerPage]=\"RowsPerPage\" (PageChange)=\"OnPageChange($event)\"></intelica-paginator>\r\n\t\t}\r\n\t</div>\r\n\t<p-table\r\n\t\tclass=\"prTableBasic\"\r\n\t\t[ngClass]=\"ClassName\"\r\n\t\t[value]=\"ListDataTable\"\r\n\t\tresponsiveLayout=\"scroll\"\r\n\t\t[(selection)]=\"ListDataSelectedFilter\"\r\n\t\t(onHeaderCheckboxToggle)=\"SelectAll($event)\"\r\n\t\t(onRowSelect)=\"OnRowSelect($event)\"\r\n\t\t(onRowUnselect)=\"OnRowUnselect($event)\"\r\n\t>\r\n\t\t<!-- Encabezados -->\r\n\t\t<ng-template pTemplate=\"header\">\r\n\t\t\t<tr>\r\n\t\t\t\t@for (col of ColumnGroupList; track $index) {\r\n\t\t\t\t<th [attr.colspan]=\"col.colspan\" [attr.rowspan]=\"col.rowspan\" [pSortableColumn]=\"col.sortable ? col.field : ''\" [style.width]=\"col.width\" (click)=\"OnSort(col.field)\">\r\n\t\t\t\t\t<span pTooltip=\"{{ col.header }}\">{{ col.header }}</span>\r\n\t\t\t\t\t<p-sortIcon *ngIf=\"col.sortable\" [field]=\"col.field\"></p-sortIcon>\r\n\t\t\t\t</th>\r\n\t\t\t\t} @if (ShowCheckbox && ColumnGroupList.length != 0) {\r\n\t\t\t\t<th class=\"text-center\" style=\"width: 4%\" rowspan=\"2\">\r\n\t\t\t\t\t<p-tableHeaderCheckbox class=\"prCheckbox\" [ngClass]=\"{ 'prCheckbox--indeterminate': ListDataSelectedTemp.length > 0 && ListDataSelectedTemp.length < ListDataFilter.length }\" />\r\n\t\t\t\t</th>\r\n\t\t\t\t}\r\n\t\t\t</tr>\r\n\t\t\t<tr>\r\n\t\t\t\t@for (col of ColumnList; track $index) { @if(col.showHeader ){\r\n\t\t\t\t<th [class]=\"col.className\" [pSortableColumn]=\"col.sortable ? col.field : ''\" [style.width]=\"col.width\" (click)=\"OnSort(col.field)\">\r\n\t\t\t\t\t<span pTooltip=\"{{ col.headerTooltip }}\" tooltipPosition=\"{{ col.headerTooltipPosition }}\">{{ col.header }}</span>\r\n\t\t\t\t\t<p-sortIcon *ngIf=\"col.sortable\" [field]=\"col.field\"></p-sortIcon>\r\n\t\t\t\t</th>\r\n\t\t\t\t} } @if(ShowCheckbox && ColumnGroupList.length == 0 ){\r\n\t\t\t\t<th class=\"text-center\" style=\"width: 4%\">\r\n\t\t\t\t\t<p-tableHeaderCheckbox class=\"prCheckbox\" [ngClass]=\"{ 'prCheckbox--indeterminate': ListDataSelectedTemp.length > 0 && ListDataSelectedTemp.length < ListDataFilter.length }\" />\r\n\t\t\t\t</th>\r\n\t\t\t\t}\r\n\t\t\t</tr>\r\n\t\t\t@if (ListDataFilter.length > 0) {\r\n\t\t\t<tr class=\"fixedRow\">\r\n\t\t\t\t@for (col of RowResumenList; track $index) {\r\n\t\t\t\t<td [ngClass]=\"col.className\" [attr.colspan]=\"col.colspan\" [attr.rowspan]=\"col.rowspan\">\r\n\t\t\t\t\t@if (col.templateRef) {\r\n\t\t\t\t\t<span>\r\n\t\t\t\t\t\t<ng-container *ngTemplateOutlet=\"col.templateRef\"></ng-container>\r\n\t\t\t\t\t</span>\r\n\t\t\t\t\t} @else {\r\n\t\t\t\t\t<ng-template #defaultContent></ng-template>\r\n\t\t\t\t\t}\r\n\t\t\t\t</td>\r\n\t\t\t\t}\r\n\t\t\t</tr>\r\n\t\t\t}\r\n\t\t</ng-template>\r\n\t\t<!-- Cuerpo de la tabla -->\r\n\t\t<ng-template pTemplate=\"body\" let-rowData let-rowIndex=\"rowIndex\">\r\n\t\t\t<tr>\r\n\t\t\t\t@for (col of ColumnList; track $index) {\r\n\t\t\t\t<td [ngClass]=\"col.className\">\r\n\t\t\t\t\t@if (col.showIndex) {\r\n\t\t\t\t\t{{ rowIndex + 1 + (CurrentPage - 1) * RowsPerPage }}\r\n\t\t\t\t\t} @else { @if (col.templateRef) {\r\n\t\t\t\t\t<ng-container *ngTemplateOutlet=\"col.templateRef; context: { $implicit: rowData }\"></ng-container>\r\n\t\t\t\t\t} @else {\r\n\t\t\t\t\t<span class=\"text-breakWord\" pTooltip=\"{{ col.tooltip }}\" tooltipPosition=\"{{ col.tooltipPosition }}\">\r\n\t\t\t\t\t\t{{ rowData[col.field] }}\r\n\t\t\t\t\t</span>\r\n\t\t\t\t\t} }\r\n\t\t\t\t</td>\r\n\t\t\t\t} @if (ShowCheckbox) {\r\n\t\t\t\t<td class=\"text-center\">\r\n\t\t\t\t\t<p-tableCheckbox [value]=\"rowData\" class=\"prCheckbox\" />\r\n\t\t\t\t</td>\r\n\t\t\t\t}\r\n\t\t\t</tr>\r\n\t\t</ng-template>\r\n\t\t<ng-template #emptymessage>\r\n\t\t\t<tr>\r\n\t\t\t\t<td [attr.colspan]=\"ColumnList.length + (ShowCheckbox ? 1 : 0)\" class=\"text-center\">\r\n\t\t\t\t\t{{ \"Nodata\" | term : GlobalTermService.languageCode }}\r\n\t\t\t\t</td>\r\n\t\t\t</tr>\r\n\t\t</ng-template>\r\n\t</p-table>\r\n</div>\r\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: SearchComponent, selector: "intelica-search", inputs: ["ComponentId", "SearchFieldOptions", "SearchOnKeyup", "SimpleSearchInput", "Placeholder"], outputs: ["OnSearch"] }, { kind: "component", type: PaginatorComponent, selector: "intelica-paginator", inputs: ["TotalItems", "CurrentPage", "ItemsPerPage"], outputs: ["PageChange"] }, { kind: "ngmodule", type: TableModule }, { kind: "component", type: i2$1.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "style", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "scrollDirection", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "responsive", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "autoLayout", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "size", "showGridlines", "stripedRows", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "virtualRowHeight", "selectAll"], outputs: ["contextMenuSelectionChange", "selectAllChange", "selectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "directive", type: i3$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: i2$1.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { kind: "component", type: i2$1.SortIcon, selector: "p-sortIcon", inputs: ["field"] }, { kind: "component", type: i2$1.TableCheckbox, selector: "p-tableCheckbox", inputs: ["disabled", "value", "index", "inputId", "name", "required", "ariaLabel"] }, { kind: "component", type: i2$1.TableHeaderCheckbox, selector: "p-tableHeaderCheckbox", inputs: ["disabled", "inputId", "name", "ariaLabel"] }, { kind: "ngmodule", type: BadgeModule }, { kind: "ngmodule", type: TooltipModule }, { kind: "directive", type: i4.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions"] }, { kind: "pipe", type: TermPipe, name: "term" }] });
|
|
1593
1633
|
}
|
|
1594
1634
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: TableComponent, decorators: [{
|
|
1595
1635
|
type: Component,
|
|
1596
|
-
args: [{ selector: "intelica-table", standalone: true, imports: [CommonModule, SearchComponent, PaginatorComponent, TableModule, BadgeModule, TooltipModule, TermPipe], template: "<div class=\"prTable\">\r\n\t<div class=\"prTableTools\">\r\n\t\t<div class=\"prTableTools__additional\">\r\n\t\t\t@if (AdditionalTemplate) {\r\n\t\t\t<div class=\"prTableTools__additional\">\r\n\t\t\t\t<ng-container *ngTemplateOutlet=\"AdditionalTemplate\"></ng-container>\r\n\t\t\t</div>\r\n\t\t\t}\r\n\t\t</div>\r\n\t\t@if (ShowSearch) {\r\n\t\t<intelica-search\r\n\t\t\t#searchTable\r\n\t\t\t[ComponentId]=\"ComponentId + 'Search'\"\r\n\t\t\t(OnSearch)=\"ExecuteSearch($event)\"\r\n\t\t\t[SearchFieldOptions]=\"ListSearchOptionsSimple\"\r\n\t\t\t[SearchOnKeyup]=\"false\"\r\n\t\t\t[SimpleSearchInput]=\"false\"\r\n\t\t></intelica-search>\r\n\t\t} @if (ShowPagination) {\r\n\t\t<intelica-paginator #paginatorTable [TotalItems]=\"ListDataFilter.length\" [ItemsPerPage]=\"RowsPerPage\" (PageChange)=\"OnPageChange($event)\"></intelica-paginator>\r\n\t\t}\r\n\t</div>\r\n\t<p-table\r\n\t\tclass=\"prTableBasic\"\r\n\t\t[value]=\"ListDataTable\"\r\n\t\tresponsiveLayout=\"scroll\"\r\n\t\t[(selection)]=\"ListDataSelectedFilter\"\r\n\t\t(onHeaderCheckboxToggle)=\"SelectAll($event)\"\r\n\t\t(onRowSelect)=\"OnRowSelect($event)\"\r\n\t\t(onRowUnselect)=\"OnRowUnselect($event)\"\r\n\t>\r\n\t\t<!-- Encabezados -->\r\n\t\t<ng-template pTemplate=\"header\">\r\n\t\t\t<tr>\r\n\t\t\t\t@for (col of ColumnGroupList; track $index) {\r\n\t\t\t\t<th [attr.colspan]=\"col.colspan\" [attr.rowspan]=\"col.rowspan\" [pSortableColumn]=\"col.sortable ? col.field : ''\" [style.width]=\"col.width\" (click)=\"OnSort(col.field)\">\r\n\t\t\t\t\t<span pTooltip=\"{{ col.header }}\">{{ col.header }}</span>\r\n\t\t\t\t\t<p-sortIcon *ngIf=\"col.sortable\" [field]=\"col.field\"></p-sortIcon>\r\n\t\t\t\t</th>\r\n\t\t\t\t} @if (ShowCheckbox && ColumnGroupList.length != 0) {\r\n\t\t\t\t<th class=\"text-center\" style=\"width: 4%\" rowspan=\"2\">\r\n\t\t\t\t\t<p-tableHeaderCheckbox class=\"prCheckbox\" [ngClass]=\"{ 'prCheckbox--indeterminate': ListDataSelectedTemp.length > 0 && ListDataSelectedTemp.length < ListDataFilter.length }\" />\r\n\t\t\t\t</th>\r\n\t\t\t\t}\r\n\t\t\t</tr>\r\n\t\t\t<tr>\r\n\t\t\t\t@for (col of ColumnList; track $index) { @if(col.showHeader ){\r\n\t\t\t\t<th [class]=\"col.className\" [pSortableColumn]=\"col.sortable ? col.field : ''\" [style.width]=\"col.width\" (click)=\"OnSort(col.field)\">\r\n\t\t\t\t\t<span pTooltip=\"{{ col.headerTooltip }}\" tooltipPosition=\"{{ col.headerTooltipPosition }}\">{{ col.header }}</span>\r\n\t\t\t\t\t<p-sortIcon *ngIf=\"col.sortable\" [field]=\"col.field\"></p-sortIcon>\r\n\t\t\t\t</th>\r\n\t\t\t\t} } @if(ShowCheckbox && ColumnGroupList.length == 0 ){\r\n\t\t\t\t<th class=\"text-center\" style=\"width: 4%\">\r\n\t\t\t\t\t<p-tableHeaderCheckbox class=\"prCheckbox\" [ngClass]=\"{ 'prCheckbox--indeterminate': ListDataSelectedTemp.length > 0 && ListDataSelectedTemp.length < ListDataFilter.length }\" />\r\n\t\t\t\t</th>\r\n\t\t\t\t}\r\n\t\t\t</tr>\r\n\t\t\t@if (ListDataFilter.length > 0) {\r\n\t\t\t<tr class=\"fixedRow\">\r\n\t\t\t\t@for (col of RowResumenList; track $index) {\r\n\t\t\t\t<td [ngClass]=\"col.className\" [attr.colspan]=\"col.colspan\" [attr.rowspan]=\"col.rowspan\">\r\n\t\t\t\t\t@if (col.templateRef) {\r\n\t\t\t\t\t<span>\r\n\t\t\t\t\t\t<ng-container *ngTemplateOutlet=\"col.templateRef\"></ng-container>\r\n\t\t\t\t\t</span>\r\n\t\t\t\t\t} @else {\r\n\t\t\t\t\t<ng-template #defaultContent></ng-template>\r\n\t\t\t\t\t}\r\n\t\t\t\t</td>\r\n\t\t\t\t}\r\n\t\t\t</tr>\r\n\t\t\t}\r\n\t\t</ng-template>\r\n\t\t<!-- Cuerpo de la tabla -->\r\n\t\t<ng-template pTemplate=\"body\" let-rowData let-rowIndex=\"rowIndex\">\r\n\t\t\t<tr>\r\n\t\t\t\t@for (col of ColumnList; track $index) {\r\n\t\t\t\t<td [ngClass]=\"col.className\">\r\n\t\t\t\t\t@if (col.showIndex) {\r\n\t\t\t\t\t{{ rowIndex + 1 + (CurrentPage - 1) * RowsPerPage }}\r\n\t\t\t\t\t} @else { @if (col.templateRef) {\r\n\t\t\t\t\t<ng-container *ngTemplateOutlet=\"col.templateRef; context: { $implicit: rowData }\"></ng-container>\r\n\t\t\t\t\t} @else {\r\n\t\t\t\t\t<span class=\"text-breakWord\" pTooltip=\"{{ col.tooltip }}\" tooltipPosition=\"{{ col.tooltipPosition }}\">\r\n\t\t\t\t\t\t{{ rowData[col.field] }}\r\n\t\t\t\t\t</span>\r\n\t\t\t\t\t} }\r\n\t\t\t\t</td>\r\n\t\t\t\t} @if (ShowCheckbox) {\r\n\t\t\t\t<td class=\"text-center\">\r\n\t\t\t\t\t<p-tableCheckbox [value]=\"rowData\" class=\"prCheckbox\" />\r\n\t\t\t\t</td>\r\n\t\t\t\t}\r\n\t\t\t</tr>\r\n\t\t</ng-template>\r\n\t\t<ng-template #emptymessage>\r\n\t\t\t<tr>\r\n\t\t\t\t<td [attr.colspan]=\"ColumnList.length + (ShowCheckbox ? 1 : 0)\" class=\"text-center\">\r\n\t\t\t\t\t{{ \"Nodata\" | term : GlobalTermService.languageCode }}\r\n\t\t\t\t</td>\r\n\t\t\t</tr>\r\n\t\t</ng-template>\r\n\t</p-table>\r\n</div>\r\n" }]
|
|
1636
|
+
args: [{ selector: "intelica-table", standalone: true, imports: [CommonModule, SearchComponent, PaginatorComponent, TableModule, BadgeModule, TooltipModule, TermPipe], template: "<div class=\"prTable\">\r\n\t<div class=\"prTableTools\">\r\n\t\t<div class=\"prTableTools__additional\">\r\n\t\t\t@if (AdditionalTemplate) {\r\n\t\t\t<div class=\"prTableTools__additional\">\r\n\t\t\t\t<ng-container *ngTemplateOutlet=\"AdditionalTemplate\"></ng-container>\r\n\t\t\t</div>\r\n\t\t\t}\r\n\t\t</div>\r\n\t\t@if (ShowSearch) {\r\n\t\t<intelica-search\r\n\t\t\t#searchTable\r\n\t\t\t[ComponentId]=\"ComponentId + 'Search'\"\r\n\t\t\t(OnSearch)=\"ExecuteSearch($event)\"\r\n\t\t\t[SearchFieldOptions]=\"ListSearchOptionsSimple\"\r\n\t\t\t[SearchOnKeyup]=\"false\"\r\n\t\t\t[SimpleSearchInput]=\"false\"\r\n\t\t></intelica-search>\r\n\t\t} @if (ShowPagination) {\r\n\t\t<intelica-paginator #paginatorTable [TotalItems]=\"ListDataFilter.length\" [ItemsPerPage]=\"RowsPerPage\" (PageChange)=\"OnPageChange($event)\"></intelica-paginator>\r\n\t\t}\r\n\t</div>\r\n\t<p-table\r\n\t\tclass=\"prTableBasic\"\r\n\t\t[ngClass]=\"ClassName\"\r\n\t\t[value]=\"ListDataTable\"\r\n\t\tresponsiveLayout=\"scroll\"\r\n\t\t[(selection)]=\"ListDataSelectedFilter\"\r\n\t\t(onHeaderCheckboxToggle)=\"SelectAll($event)\"\r\n\t\t(onRowSelect)=\"OnRowSelect($event)\"\r\n\t\t(onRowUnselect)=\"OnRowUnselect($event)\"\r\n\t>\r\n\t\t<!-- Encabezados -->\r\n\t\t<ng-template pTemplate=\"header\">\r\n\t\t\t<tr>\r\n\t\t\t\t@for (col of ColumnGroupList; track $index) {\r\n\t\t\t\t<th [attr.colspan]=\"col.colspan\" [attr.rowspan]=\"col.rowspan\" [pSortableColumn]=\"col.sortable ? col.field : ''\" [style.width]=\"col.width\" (click)=\"OnSort(col.field)\">\r\n\t\t\t\t\t<span pTooltip=\"{{ col.header }}\">{{ col.header }}</span>\r\n\t\t\t\t\t<p-sortIcon *ngIf=\"col.sortable\" [field]=\"col.field\"></p-sortIcon>\r\n\t\t\t\t</th>\r\n\t\t\t\t} @if (ShowCheckbox && ColumnGroupList.length != 0) {\r\n\t\t\t\t<th class=\"text-center\" style=\"width: 4%\" rowspan=\"2\">\r\n\t\t\t\t\t<p-tableHeaderCheckbox class=\"prCheckbox\" [ngClass]=\"{ 'prCheckbox--indeterminate': ListDataSelectedTemp.length > 0 && ListDataSelectedTemp.length < ListDataFilter.length }\" />\r\n\t\t\t\t</th>\r\n\t\t\t\t}\r\n\t\t\t</tr>\r\n\t\t\t<tr>\r\n\t\t\t\t@for (col of ColumnList; track $index) { @if(col.showHeader ){\r\n\t\t\t\t<th [class]=\"col.className\" [pSortableColumn]=\"col.sortable ? col.field : ''\" [style.width]=\"col.width\" (click)=\"OnSort(col.field)\">\r\n\t\t\t\t\t<span pTooltip=\"{{ col.headerTooltip }}\" tooltipPosition=\"{{ col.headerTooltipPosition }}\">{{ col.header }}</span>\r\n\t\t\t\t\t<p-sortIcon *ngIf=\"col.sortable\" [field]=\"col.field\"></p-sortIcon>\r\n\t\t\t\t</th>\r\n\t\t\t\t} } @if(ShowCheckbox && ColumnGroupList.length == 0 ){\r\n\t\t\t\t<th class=\"text-center\" style=\"width: 4%\">\r\n\t\t\t\t\t<p-tableHeaderCheckbox class=\"prCheckbox\" [ngClass]=\"{ 'prCheckbox--indeterminate': ListDataSelectedTemp.length > 0 && ListDataSelectedTemp.length < ListDataFilter.length }\" />\r\n\t\t\t\t</th>\r\n\t\t\t\t}\r\n\t\t\t</tr>\r\n\t\t\t@if (ListDataFilter.length > 0) {\r\n\t\t\t<tr class=\"fixedRow\">\r\n\t\t\t\t@for (col of RowResumenList; track $index) {\r\n\t\t\t\t<td [ngClass]=\"col.className\" [attr.colspan]=\"col.colspan\" [attr.rowspan]=\"col.rowspan\">\r\n\t\t\t\t\t@if (col.templateRef) {\r\n\t\t\t\t\t<span>\r\n\t\t\t\t\t\t<ng-container *ngTemplateOutlet=\"col.templateRef\"></ng-container>\r\n\t\t\t\t\t</span>\r\n\t\t\t\t\t} @else {\r\n\t\t\t\t\t<ng-template #defaultContent></ng-template>\r\n\t\t\t\t\t}\r\n\t\t\t\t</td>\r\n\t\t\t\t}\r\n\t\t\t</tr>\r\n\t\t\t}\r\n\t\t</ng-template>\r\n\t\t<!-- Cuerpo de la tabla -->\r\n\t\t<ng-template pTemplate=\"body\" let-rowData let-rowIndex=\"rowIndex\">\r\n\t\t\t<tr>\r\n\t\t\t\t@for (col of ColumnList; track $index) {\r\n\t\t\t\t<td [ngClass]=\"col.className\">\r\n\t\t\t\t\t@if (col.showIndex) {\r\n\t\t\t\t\t{{ rowIndex + 1 + (CurrentPage - 1) * RowsPerPage }}\r\n\t\t\t\t\t} @else { @if (col.templateRef) {\r\n\t\t\t\t\t<ng-container *ngTemplateOutlet=\"col.templateRef; context: { $implicit: rowData }\"></ng-container>\r\n\t\t\t\t\t} @else {\r\n\t\t\t\t\t<span class=\"text-breakWord\" pTooltip=\"{{ col.tooltip }}\" tooltipPosition=\"{{ col.tooltipPosition }}\">\r\n\t\t\t\t\t\t{{ rowData[col.field] }}\r\n\t\t\t\t\t</span>\r\n\t\t\t\t\t} }\r\n\t\t\t\t</td>\r\n\t\t\t\t} @if (ShowCheckbox) {\r\n\t\t\t\t<td class=\"text-center\">\r\n\t\t\t\t\t<p-tableCheckbox [value]=\"rowData\" class=\"prCheckbox\" />\r\n\t\t\t\t</td>\r\n\t\t\t\t}\r\n\t\t\t</tr>\r\n\t\t</ng-template>\r\n\t\t<ng-template #emptymessage>\r\n\t\t\t<tr>\r\n\t\t\t\t<td [attr.colspan]=\"ColumnList.length + (ShowCheckbox ? 1 : 0)\" class=\"text-center\">\r\n\t\t\t\t\t{{ \"Nodata\" | term : GlobalTermService.languageCode }}\r\n\t\t\t\t</td>\r\n\t\t\t</tr>\r\n\t\t</ng-template>\r\n\t</p-table>\r\n</div>\r\n" }]
|
|
1597
1637
|
}], ctorParameters: () => [], propDecorators: { ComponentId: [{
|
|
1598
1638
|
type: Input
|
|
1599
1639
|
}], ListData: [{
|
|
@@ -1614,6 +1654,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImpor
|
|
|
1614
1654
|
type: Input
|
|
1615
1655
|
}], SelectedIdentifier: [{
|
|
1616
1656
|
type: Input
|
|
1657
|
+
}], ClassName: [{
|
|
1658
|
+
type: Input
|
|
1617
1659
|
}], EmmitSelectedItem: [{
|
|
1618
1660
|
type: Output
|
|
1619
1661
|
}], EmitListDataFilter: [{
|
|
@@ -1728,6 +1770,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImpor
|
|
|
1728
1770
|
class ActionsMenuComponent {
|
|
1729
1771
|
termPipe;
|
|
1730
1772
|
GlobalTermService = inject(GlobalTermService);
|
|
1773
|
+
/**
|
|
1774
|
+
* Indica si el menú se muestra como texto.
|
|
1775
|
+
* @type {boolean}
|
|
1776
|
+
* @default false
|
|
1777
|
+
*/
|
|
1778
|
+
showFilterText = false;
|
|
1731
1779
|
Popover;
|
|
1732
1780
|
MenuButton;
|
|
1733
1781
|
PopoverContainer;
|
|
@@ -1902,12 +1950,14 @@ class ActionsMenuComponent {
|
|
|
1902
1950
|
this.ShowSelectActions = true;
|
|
1903
1951
|
}
|
|
1904
1952
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: ActionsMenuComponent, deps: [{ token: TermPipe }], target: i0.ɵɵFactoryTarget.Component });
|
|
1905
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "
|
|
1953
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: ActionsMenuComponent, isStandalone: true, selector: "intelica-actions-menu", inputs: { showFilterText: "showFilterText" }, host: { listeners: { "mousedown": "onMouseDown($event)", "window:mousedown": "onMouseDownOutsideBody($event)", "mouseup": "onMouseUp($event)", "document:click": "closeAll($event)" } }, queries: [{ propertyName: "actions", predicate: ActionDirective }], viewQueries: [{ propertyName: "Popover", first: true, predicate: ["popover"], descendants: true }, { propertyName: "MenuButton", first: true, predicate: ["menuButton"], descendants: true }, { propertyName: "PopoverContainer", first: true, predicate: ["popoverContainer"], descendants: true }], ngImport: i0, template: "<div #popoverContainer class=\"grPopoverContainer\">\r\n\t@if(showFilterText){\r\n\t<button #menuButton class=\"grMenuFilter\" (click)=\"togglePopover($event)\">\r\n\t\t<i class=\"icon icon-filter-bars\"></i>\r\n\t\t<span class=\"grMenuText\">{{ \"Filters\" | term : GlobalTermService.languageCode }}</span>\r\n\t</button>\r\n\t} @else {\r\n\t<button #menuButton class=\"grMenuAction\" (click)=\"togglePopover($event)\">\r\n\t\t<i class=\"icon icon-bars\"></i>\r\n\t</button>\r\n\t}\r\n\t<div class=\"grPopover\" #popover>\r\n\t\t<!-- Men\u00FA -->\r\n\t\t<div class=\"grPopoverMenu\" *ngIf=\"ShowActionsMenu\" [ngClass]=\"{ hidden: !ShowSelectActions }\">\r\n\t\t\t<div class=\"grPopoverHeader\">\r\n\t\t\t\t<h3>\r\n\t\t\t\t\t<span>{{ \"SelectAction\" | term : GlobalTermService.languageCode }}</span>\r\n\t\t\t\t</h3>\r\n\t\t\t</div>\r\n\t\t\t<div class=\"grPopoverBody\">\r\n\t\t\t\t<button pRipple class=\"grButtonActions\" *ngFor=\"let item of actions; let $index = index\" (click)=\"showTemplate(item)\">\r\n\t\t\t\t\t<span class=\"formRowInputNumber\">{{ $index + 1 }}</span>\r\n\t\t\t\t\t<span class=\"grButtonActionName\">{{ item.name | term : GlobalTermService.languageCode }}</span>\r\n\t\t\t\t</button>\r\n\t\t\t</div>\r\n\t\t</div>\r\n\r\n\t\t<!-- Sub Men\u00FA -->\r\n\t\t<div class=\"grPopoverSubMenu\" [ngClass]=\"{ hidden: !item.active }\" *ngFor=\"let item of actions\">\r\n\t\t\t<div class=\"grPopoverHeader\">\r\n\t\t\t\t<h3>\r\n\t\t\t\t\t<button class=\"backButton\" (click)=\"returnSelectActions(item)\">\r\n\t\t\t\t\t\t<i class=\"icon icon-arrow-left\"></i>\r\n\t\t\t\t\t</button>\r\n\t\t\t\t\t<span>{{ item.name | term : GlobalTermService.languageCode }}</span>\r\n\t\t\t\t</h3>\r\n\t\t\t</div>\r\n\t\t\t<div class=\"grPopoverBody\">\r\n\t\t\t\t<ng-container *ngTemplateOutlet=\"item.template\"></ng-container>\r\n\t\t\t</div>\r\n\t\t</div>\r\n\t</div>\r\n</div>\r\n", dependencies: [{ kind: "ngmodule", type: ButtonModule }, { kind: "ngmodule", type: InputGroupAddonModule }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: RippleModule }, { kind: "directive", type: i3$2.Ripple, selector: "[pRipple]" }, { kind: "pipe", type: TermPipe, name: "term" }] });
|
|
1906
1954
|
}
|
|
1907
1955
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: ActionsMenuComponent, decorators: [{
|
|
1908
1956
|
type: Component,
|
|
1909
|
-
args: [{ selector: "intelica-actions-menu", imports: [ButtonModule, InputGroupAddonModule, CommonModule, RippleModule, TermPipe], template: "<div #popoverContainer class=\"grPopoverContainer\">\r\n\t<button #menuButton class=\"grMenuAction\" (click)=\"togglePopover($event)\">\r\n\t\t<i class=\"icon icon-bars\"></i>\r\n\t</button>\r\n\t<div class=\"grPopover\" #popover>\r\n\t\t<!-- Men\u00FA -->\r\n\t\t<div class=\"grPopoverMenu\" *ngIf=\"ShowActionsMenu\" [ngClass]=\"{ hidden: !ShowSelectActions }\">\r\n\t\t\t<div class=\"grPopoverHeader\">\r\n\t\t\t\t<h3>\r\n\t\t\t\t\t<span>{{ \"SelectAction\" | term : GlobalTermService.languageCode }}</span>\r\n\t\t\t\t</h3>\r\n\t\t\t</div>\r\n\t\t\t<div class=\"grPopoverBody\">\r\n\t\t\t\t<button pRipple class=\"grButtonActions\" *ngFor=\"let item of actions; let $index = index\" (click)=\"showTemplate(item)\">\r\n\t\t\t\t\t<span class=\"formRowInputNumber\">{{ $index + 1 }}</span>\r\n\t\t\t\t\t<span class=\"grButtonActionName\">{{ item.name | term : GlobalTermService.languageCode }}</span>\r\n\t\t\t\t</button>\r\n\t\t\t</div>\r\n\t\t</div>\r\n\r\n\t\t<!-- Sub Men\u00FA -->\r\n\t\t<div class=\"grPopoverSubMenu\" [ngClass]=\"{ hidden: !item.active }\" *ngFor=\"let item of actions\">\r\n\t\t\t<div class=\"grPopoverHeader\">\r\n\t\t\t\t<h3>\r\n\t\t\t\t\t<button class=\"backButton\" (click)=\"returnSelectActions(item)\">\r\n\t\t\t\t\t\t<i class=\"icon icon-arrow-left\"></i>\r\n\t\t\t\t\t</button>\r\n\t\t\t\t\t<span>{{ item.name | term : GlobalTermService.languageCode }}</span>\r\n\t\t\t\t</h3>\r\n\t\t\t</div>\r\n\t\t\t<div class=\"grPopoverBody\">\r\n\t\t\t\t<ng-container *ngTemplateOutlet=\"item.template\"></ng-container>\r\n\t\t\t</div>\r\n\t\t</div>\r\n\t</div>\r\n</div>\r\n" }]
|
|
1910
|
-
}], ctorParameters: () => [{ type: TermPipe }], propDecorators: {
|
|
1957
|
+
args: [{ selector: "intelica-actions-menu", imports: [ButtonModule, InputGroupAddonModule, CommonModule, RippleModule, TermPipe], template: "<div #popoverContainer class=\"grPopoverContainer\">\r\n\t@if(showFilterText){\r\n\t<button #menuButton class=\"grMenuFilter\" (click)=\"togglePopover($event)\">\r\n\t\t<i class=\"icon icon-filter-bars\"></i>\r\n\t\t<span class=\"grMenuText\">{{ \"Filters\" | term : GlobalTermService.languageCode }}</span>\r\n\t</button>\r\n\t} @else {\r\n\t<button #menuButton class=\"grMenuAction\" (click)=\"togglePopover($event)\">\r\n\t\t<i class=\"icon icon-bars\"></i>\r\n\t</button>\r\n\t}\r\n\t<div class=\"grPopover\" #popover>\r\n\t\t<!-- Men\u00FA -->\r\n\t\t<div class=\"grPopoverMenu\" *ngIf=\"ShowActionsMenu\" [ngClass]=\"{ hidden: !ShowSelectActions }\">\r\n\t\t\t<div class=\"grPopoverHeader\">\r\n\t\t\t\t<h3>\r\n\t\t\t\t\t<span>{{ \"SelectAction\" | term : GlobalTermService.languageCode }}</span>\r\n\t\t\t\t</h3>\r\n\t\t\t</div>\r\n\t\t\t<div class=\"grPopoverBody\">\r\n\t\t\t\t<button pRipple class=\"grButtonActions\" *ngFor=\"let item of actions; let $index = index\" (click)=\"showTemplate(item)\">\r\n\t\t\t\t\t<span class=\"formRowInputNumber\">{{ $index + 1 }}</span>\r\n\t\t\t\t\t<span class=\"grButtonActionName\">{{ item.name | term : GlobalTermService.languageCode }}</span>\r\n\t\t\t\t</button>\r\n\t\t\t</div>\r\n\t\t</div>\r\n\r\n\t\t<!-- Sub Men\u00FA -->\r\n\t\t<div class=\"grPopoverSubMenu\" [ngClass]=\"{ hidden: !item.active }\" *ngFor=\"let item of actions\">\r\n\t\t\t<div class=\"grPopoverHeader\">\r\n\t\t\t\t<h3>\r\n\t\t\t\t\t<button class=\"backButton\" (click)=\"returnSelectActions(item)\">\r\n\t\t\t\t\t\t<i class=\"icon icon-arrow-left\"></i>\r\n\t\t\t\t\t</button>\r\n\t\t\t\t\t<span>{{ item.name | term : GlobalTermService.languageCode }}</span>\r\n\t\t\t\t</h3>\r\n\t\t\t</div>\r\n\t\t\t<div class=\"grPopoverBody\">\r\n\t\t\t\t<ng-container *ngTemplateOutlet=\"item.template\"></ng-container>\r\n\t\t\t</div>\r\n\t\t</div>\r\n\t</div>\r\n</div>\r\n" }]
|
|
1958
|
+
}], ctorParameters: () => [{ type: TermPipe }], propDecorators: { showFilterText: [{
|
|
1959
|
+
type: Input
|
|
1960
|
+
}], Popover: [{
|
|
1911
1961
|
type: ViewChild,
|
|
1912
1962
|
args: ["popover"]
|
|
1913
1963
|
}], MenuButton: [{
|
|
@@ -2380,7 +2430,7 @@ class HtmlToExcelService {
|
|
|
2380
2430
|
horizontal: "center",
|
|
2381
2431
|
wrapText: true,
|
|
2382
2432
|
};
|
|
2383
|
-
async ExportToExcel(excelName, reportTitle, filterTitle, rowsSerializate, columns, filters) {
|
|
2433
|
+
async ExportToExcel(excelName, reportTitle, filterTitle, rowsSerializate, columns, filters, subtitles = [], showTotalRow = false) {
|
|
2384
2434
|
const workbook = new Workbook();
|
|
2385
2435
|
const worksheet = workbook.addWorksheet(reportTitle);
|
|
2386
2436
|
worksheet.views = [{ showGridLines: false }];
|
|
@@ -2388,7 +2438,7 @@ class HtmlToExcelService {
|
|
|
2388
2438
|
base64: this.Logo,
|
|
2389
2439
|
extension: "png",
|
|
2390
2440
|
});
|
|
2391
|
-
this.SetReportPage(rowsSerializate, worksheet, columns, imageId);
|
|
2441
|
+
this.SetReportPage(rowsSerializate, worksheet, columns, imageId, subtitles, showTotalRow);
|
|
2392
2442
|
this.SetTitle(worksheet, reportTitle);
|
|
2393
2443
|
if (filters.length > 0) {
|
|
2394
2444
|
const worksheetFilter = workbook.addWorksheet(filterTitle);
|
|
@@ -2410,27 +2460,68 @@ class HtmlToExcelService {
|
|
|
2410
2460
|
};
|
|
2411
2461
|
titleCell.alignment = { vertical: "middle", horizontal: "center" };
|
|
2412
2462
|
}
|
|
2413
|
-
SetReportPage(rowsSerializate, worksheet, columns, imageId) {
|
|
2463
|
+
SetReportPage(rowsSerializate, worksheet, columns, imageId, subtitles = [], showTotalRow = false) {
|
|
2414
2464
|
let columnsCell = [];
|
|
2415
2465
|
let cells = [];
|
|
2416
2466
|
let rows = JSON.parse(rowsSerializate);
|
|
2467
|
+
//Inserción de filas para imagen
|
|
2468
|
+
const imageRows = 5;
|
|
2417
2469
|
const numberRows = rows.length;
|
|
2418
|
-
|
|
2419
|
-
|
|
2420
|
-
|
|
2421
|
-
|
|
2422
|
-
worksheet.addRow([""]);
|
|
2470
|
+
for (let i = 0; i < subtitles.length + imageRows; i++) {
|
|
2471
|
+
worksheet.addRow([""]);
|
|
2472
|
+
}
|
|
2473
|
+
//Inserción de nombre de columnas
|
|
2423
2474
|
let columnsNames = [];
|
|
2475
|
+
let startRow = imageRows + 1 + subtitles.length;
|
|
2424
2476
|
for (let i = 0; i < columns.length; i++) {
|
|
2425
|
-
let cell = `${String.fromCharCode(65 + i)}
|
|
2477
|
+
let cell = `${String.fromCharCode(65 + i)}${startRow}`;
|
|
2426
2478
|
columnsNames.push(columns[i].displayColumnName);
|
|
2427
2479
|
columnsCell.push(cell);
|
|
2428
2480
|
}
|
|
2429
2481
|
worksheet.addRow(columnsNames);
|
|
2482
|
+
//Inserción y formato de sumatorias
|
|
2483
|
+
if (showTotalRow) {
|
|
2484
|
+
const sums = columns.map(col => {
|
|
2485
|
+
if (!col.totalRowValue)
|
|
2486
|
+
return null;
|
|
2487
|
+
return rows.reduce((acc, row) => {
|
|
2488
|
+
const value = parseFloat(row[col.columnName]) || 0;
|
|
2489
|
+
return acc + value;
|
|
2490
|
+
}, 0);
|
|
2491
|
+
});
|
|
2492
|
+
const sumRow = columns.map((col, index) => {
|
|
2493
|
+
if (col.columnName === "")
|
|
2494
|
+
return "Total";
|
|
2495
|
+
if (!col.totalRowValue)
|
|
2496
|
+
return "";
|
|
2497
|
+
return (sums[index]?.toLocaleString(undefined, {
|
|
2498
|
+
minimumFractionDigits: 2,
|
|
2499
|
+
maximumFractionDigits: 2,
|
|
2500
|
+
}) || "0.00");
|
|
2501
|
+
});
|
|
2502
|
+
startRow = startRow + 1;
|
|
2503
|
+
worksheet.insertRow(startRow, sumRow);
|
|
2504
|
+
columns.forEach((col, index) => {
|
|
2505
|
+
const cellAddress = `${String.fromCharCode(65 + index)}${startRow}`;
|
|
2506
|
+
const cell = worksheet.getCell(cellAddress);
|
|
2507
|
+
cell.font = {
|
|
2508
|
+
name: "Arial",
|
|
2509
|
+
bold: true,
|
|
2510
|
+
size: 10,
|
|
2511
|
+
color: { argb: "FF7F00" },
|
|
2512
|
+
};
|
|
2513
|
+
cell.alignment = {
|
|
2514
|
+
vertical: "middle",
|
|
2515
|
+
horizontal: col.isNumber ? "right" : "left",
|
|
2516
|
+
};
|
|
2517
|
+
cell.border = { bottom: { style: "thin", color: { argb: "FF7F00" } } };
|
|
2518
|
+
});
|
|
2519
|
+
}
|
|
2520
|
+
//Inserción de filas
|
|
2430
2521
|
for (let rowIndex = 0; rowIndex < numberRows; rowIndex++) {
|
|
2431
2522
|
let rowCells = [];
|
|
2432
2523
|
let rowValues = [];
|
|
2433
|
-
let index = rowIndex +
|
|
2524
|
+
let index = rowIndex + startRow + 1;
|
|
2434
2525
|
for (let columIndex = 0; columIndex < columns.length; columIndex++) {
|
|
2435
2526
|
let cell = `${String.fromCharCode(65 + columIndex)}${index}`;
|
|
2436
2527
|
rowCells.push(cell);
|
|
@@ -2443,6 +2534,7 @@ class HtmlToExcelService {
|
|
|
2443
2534
|
worksheet.addRow(rowValues);
|
|
2444
2535
|
cells.push({ index: index, cells: rowCells });
|
|
2445
2536
|
}
|
|
2537
|
+
//Formato nombre de columnas
|
|
2446
2538
|
columnsCell.map(key => {
|
|
2447
2539
|
worksheet.getCell(key).fill = {
|
|
2448
2540
|
type: "pattern",
|
|
@@ -2458,6 +2550,7 @@ class HtmlToExcelService {
|
|
|
2458
2550
|
};
|
|
2459
2551
|
worksheet.getCell(key).alignment = this.ColumnAligment;
|
|
2460
2552
|
});
|
|
2553
|
+
//Formato de filas
|
|
2461
2554
|
cells.forEach(element => {
|
|
2462
2555
|
element.cells.map(key => {
|
|
2463
2556
|
if (element.index % 2 !== 1) {
|
|
@@ -2476,12 +2569,29 @@ class HtmlToExcelService {
|
|
|
2476
2569
|
};
|
|
2477
2570
|
});
|
|
2478
2571
|
});
|
|
2572
|
+
//Logo intelica
|
|
2479
2573
|
worksheet.addImage(imageId, {
|
|
2480
2574
|
tl: { col: 0.5, row: 1.5 },
|
|
2481
2575
|
ext: { width: 218, height: 58 },
|
|
2482
2576
|
editAs: "absolute",
|
|
2483
2577
|
});
|
|
2484
2578
|
this.AdjustColumnWidth(worksheet, columns);
|
|
2579
|
+
//Subtitulos: Se inserta al final para evitar altere el autoajuste de las columnas
|
|
2580
|
+
for (let i = 0; i < subtitles.length; i++) {
|
|
2581
|
+
const range = `${String.fromCharCode(65)}${6 + i}:${String.fromCharCode(79)}${6 + i}`;
|
|
2582
|
+
worksheet.mergeCells(range);
|
|
2583
|
+
const cell = worksheet.getCell(`${String.fromCharCode(65)}${6 + i}`);
|
|
2584
|
+
const subtitle = subtitles[i];
|
|
2585
|
+
cell.value = subtitle;
|
|
2586
|
+
cell.font = {
|
|
2587
|
+
name: "Arial",
|
|
2588
|
+
bold: true,
|
|
2589
|
+
italic: true,
|
|
2590
|
+
size: 10,
|
|
2591
|
+
color: { argb: "203764" },
|
|
2592
|
+
};
|
|
2593
|
+
cell.alignment = { vertical: "middle", horizontal: "left", wrapText: true };
|
|
2594
|
+
}
|
|
2485
2595
|
}
|
|
2486
2596
|
SetFilterPage(filterTitle, worksheetFilter, filters) {
|
|
2487
2597
|
let widtFilter = 30;
|
|
@@ -2529,10 +2639,11 @@ class HtmlToExcelService {
|
|
|
2529
2639
|
worksheet.columns.forEach((column, index) => {
|
|
2530
2640
|
if (!column.values)
|
|
2531
2641
|
return;
|
|
2642
|
+
if (columns[index] == undefined)
|
|
2643
|
+
return;
|
|
2532
2644
|
let columnWidth = columns[index].width ?? Math.max(...column.values.map(v => (v ? v.toString().length : 0)).filter(v => typeof v === "number"), columns[index].displayColumnName.length) * 1.2;
|
|
2533
2645
|
column.width = Math.min(Math.max(columnWidth, 5), 100);
|
|
2534
2646
|
column.alignment = columns[index].isNumber ? { vertical: "middle", horizontal: "right", wrapText: true } : { vertical: "middle", horizontal: "left", wrapText: true };
|
|
2535
|
-
console.log(column.width, column);
|
|
2536
2647
|
});
|
|
2537
2648
|
worksheet.eachRow((row, rowIndex) => {
|
|
2538
2649
|
if (rowIndex === 1)
|
|
@@ -2550,6 +2661,46 @@ class HtmlToExcelService {
|
|
|
2550
2661
|
row.height = Math.min(Math.max(15 * maxLines, 15), 30);
|
|
2551
2662
|
});
|
|
2552
2663
|
}
|
|
2664
|
+
async ExportToExcelRawData({ excelName, reportTitle, filterTitle, rowsSerializate, columns, filters, orderColumn = false }) {
|
|
2665
|
+
const workbook = new Workbook();
|
|
2666
|
+
const worksheet = workbook.addWorksheet(reportTitle);
|
|
2667
|
+
const rows = JSON.parse(rowsSerializate);
|
|
2668
|
+
worksheet.views = [{ showGridLines: false }];
|
|
2669
|
+
const allColumns = orderColumn ? [{ displayColumnName: "N°" }, ...columns] : columns;
|
|
2670
|
+
allColumns.forEach((col, index) => {
|
|
2671
|
+
const headerCell = worksheet.getCell(`${String.fromCharCode(65 + index)}1`);
|
|
2672
|
+
headerCell.value = col.displayColumnName;
|
|
2673
|
+
headerCell.alignment = { horizontal: "center", vertical: "middle" };
|
|
2674
|
+
headerCell.font = { name: "Arial", bold: true, size: 10 };
|
|
2675
|
+
});
|
|
2676
|
+
const maxLengths = allColumns.map(col => col.displayColumnName.length);
|
|
2677
|
+
rows.forEach((rowData, rowIndex) => {
|
|
2678
|
+
const rowValues = allColumns.map((col, colIndex) => {
|
|
2679
|
+
if (orderColumn && colIndex === 0) {
|
|
2680
|
+
return (rowIndex + 1).toString();
|
|
2681
|
+
}
|
|
2682
|
+
const originalColIndex = orderColumn ? colIndex - 1 : colIndex;
|
|
2683
|
+
return rowData[columns[originalColIndex].columnName]?.toString() || "";
|
|
2684
|
+
});
|
|
2685
|
+
rowValues.forEach((value, i) => {
|
|
2686
|
+
const length = value.length;
|
|
2687
|
+
if (length > maxLengths[i]) {
|
|
2688
|
+
maxLengths[i] = length;
|
|
2689
|
+
}
|
|
2690
|
+
});
|
|
2691
|
+
worksheet.addRow(rowValues);
|
|
2692
|
+
});
|
|
2693
|
+
allColumns.forEach((_, index) => {
|
|
2694
|
+
worksheet.getColumn(index + 1).width = maxLengths[index] + 2;
|
|
2695
|
+
});
|
|
2696
|
+
if (filters?.length) {
|
|
2697
|
+
const worksheetFilter = workbook.addWorksheet(filterTitle);
|
|
2698
|
+
worksheetFilter.views = [{ showGridLines: false }];
|
|
2699
|
+
this.SetFilterPage(filterTitle, worksheetFilter, filters);
|
|
2700
|
+
}
|
|
2701
|
+
const buffer = await workbook.xlsx.writeBuffer();
|
|
2702
|
+
saveAs(new Blob([buffer]), excelName);
|
|
2703
|
+
}
|
|
2553
2704
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: HtmlToExcelService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
2554
2705
|
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: HtmlToExcelService, providedIn: "root" });
|
|
2555
2706
|
}
|