@solcre-org/core-ui 2.14.1 → 2.14.2
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/solcre-org-core-ui.mjs +42 -30
- package/fesm2022/solcre-org-core-ui.mjs.map +1 -1
- package/index.d.ts +22 -10
- package/package.json +1 -1
|
@@ -11704,6 +11704,28 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImpor
|
|
|
11704
11704
|
}]
|
|
11705
11705
|
}] });
|
|
11706
11706
|
|
|
11707
|
+
class GenericSwitchComponent {
|
|
11708
|
+
options = input.required();
|
|
11709
|
+
selectedValue = input();
|
|
11710
|
+
ariaLabel = input('Switch options');
|
|
11711
|
+
valueChange = output();
|
|
11712
|
+
isSelected(value) {
|
|
11713
|
+
return this.selectedValue() === value;
|
|
11714
|
+
}
|
|
11715
|
+
onOptionClick(option) {
|
|
11716
|
+
if (option.disabled || this.isSelected(option.value)) {
|
|
11717
|
+
return;
|
|
11718
|
+
}
|
|
11719
|
+
this.valueChange.emit(option.value);
|
|
11720
|
+
}
|
|
11721
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: GenericSwitchComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
11722
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: GenericSwitchComponent, isStandalone: true, selector: "core-generic-switch", inputs: { options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: true, transformFunction: null }, selectedValue: { classPropertyName: "selectedValue", publicName: "selectedValue", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { valueChange: "valueChange" }, ngImport: i0, template: "<button \n class=\"c-switch\"\n [attr.aria-label]=\"ariaLabel()\"\n role=\"group\">\n @for (option of options(); track option.value) {\n <span \n class=\"c-icon-btn\"\n [class]=\"option.icon || '' | coreIconCompat\"\n [class.is-active]=\"isSelected(option.value)\"\n [class.is-disabled]=\"option.disabled\"\n [attr.title]=\"option.tooltip || option.label || '' | translate\"\n [attr.aria-pressed]=\"isSelected(option.value)\"\n [attr.aria-disabled]=\"option.disabled\"\n [attr.data-value]=\"option.value\"\n (click)=\"onOptionClick(option)\">\n @if (option.label && !option.icon) {\n {{ option.label | translate }}\n }\n </span>\n }\n</button>\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "pipe", type: IconCompatPipe, name: "coreIconCompat" }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }] });
|
|
11723
|
+
}
|
|
11724
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: GenericSwitchComponent, decorators: [{
|
|
11725
|
+
type: Component,
|
|
11726
|
+
args: [{ selector: 'core-generic-switch', standalone: true, imports: [CommonModule, IconCompatPipe, TranslateModule], template: "<button \n class=\"c-switch\"\n [attr.aria-label]=\"ariaLabel()\"\n role=\"group\">\n @for (option of options(); track option.value) {\n <span \n class=\"c-icon-btn\"\n [class]=\"option.icon || '' | coreIconCompat\"\n [class.is-active]=\"isSelected(option.value)\"\n [class.is-disabled]=\"option.disabled\"\n [attr.title]=\"option.tooltip || option.label || '' | translate\"\n [attr.aria-pressed]=\"isSelected(option.value)\"\n [attr.aria-disabled]=\"option.disabled\"\n [attr.data-value]=\"option.value\"\n (click)=\"onOptionClick(option)\">\n @if (option.label && !option.icon) {\n {{ option.label | translate }}\n }\n </span>\n }\n</button>\n" }]
|
|
11727
|
+
}] });
|
|
11728
|
+
|
|
11707
11729
|
class GenericTableComponent {
|
|
11708
11730
|
paginationService = inject(PaginationService);
|
|
11709
11731
|
tableDataService = inject((TableDataService));
|
|
@@ -12309,6 +12331,11 @@ class GenericTableComponent {
|
|
|
12309
12331
|
triggerCustomAction(action, row) {
|
|
12310
12332
|
action.callback(row);
|
|
12311
12333
|
}
|
|
12334
|
+
onCustomActionSwitchChange(value, action, row) {
|
|
12335
|
+
if (action.onSwitchChange) {
|
|
12336
|
+
action.onSwitchChange(value, row);
|
|
12337
|
+
}
|
|
12338
|
+
}
|
|
12312
12339
|
triggerGlobalAction(action) {
|
|
12313
12340
|
action.callback(this.selectedRows());
|
|
12314
12341
|
this.globalActionTriggered.emit({ action, selectedRows: this.selectedRows() });
|
|
@@ -13251,7 +13278,7 @@ class GenericTableComponent {
|
|
|
13251
13278
|
};
|
|
13252
13279
|
}
|
|
13253
13280
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: GenericTableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
13254
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: GenericTableComponent, isStandalone: true, selector: "core-generic-table", inputs: { columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: true, transformFunction: null }, modalFields: { classPropertyName: "modalFields", publicName: "modalFields", isSignal: true, isRequired: false, transformFunction: null }, modalTabs: { classPropertyName: "modalTabs", publicName: "modalTabs", isSignal: true, isRequired: false, transformFunction: null }, actions: { classPropertyName: "actions", publicName: "actions", isSignal: true, isRequired: true, transformFunction: null }, customActions: { classPropertyName: "customActions", publicName: "customActions", isSignal: true, isRequired: false, transformFunction: null }, globalActions: { classPropertyName: "globalActions", publicName: "globalActions", isSignal: true, isRequired: false, transformFunction: null }, pageSizeOptions: { classPropertyName: "pageSizeOptions", publicName: "pageSizeOptions", isSignal: true, isRequired: false, transformFunction: null }, showFilter: { classPropertyName: "showFilter", publicName: "showFilter", isSignal: true, isRequired: false, transformFunction: null }, showSelection: { classPropertyName: "showSelection", publicName: "showSelection", isSignal: true, isRequired: false, transformFunction: null }, showActions: { classPropertyName: "showActions", publicName: "showActions", isSignal: true, isRequired: false, transformFunction: null }, showCreateButton: { classPropertyName: "showCreateButton", publicName: "showCreateButton", isSignal: true, isRequired: false, transformFunction: null }, filterButtonConfig: { classPropertyName: "filterButtonConfig", publicName: "filterButtonConfig", isSignal: true, isRequired: false, transformFunction: null }, createButtonConfig: { classPropertyName: "createButtonConfig", publicName: "createButtonConfig", isSignal: true, isRequired: false, transformFunction: null }, createButtonText: { classPropertyName: "createButtonText", publicName: "createButtonText", isSignal: true, isRequired: false, transformFunction: null }, dataInput: { classPropertyName: "dataInput", publicName: "dataInput", isSignal: true, isRequired: false, transformFunction: null }, customFilters: { classPropertyName: "customFilters", publicName: "customFilters", isSignal: true, isRequired: false, transformFunction: null }, enablePagination: { classPropertyName: "enablePagination", publicName: "enablePagination", isSignal: true, isRequired: false, transformFunction: null }, modelFactory: { classPropertyName: "modelFactory", publicName: "modelFactory", isSignal: true, isRequired: false, transformFunction: null }, endpoint: { classPropertyName: "endpoint", publicName: "endpoint", isSignal: true, isRequired: false, transformFunction: null }, customParams: { classPropertyName: "customParams", publicName: "customParams", isSignal: true, isRequired: false, transformFunction: null }, customArrayKey: { classPropertyName: "customArrayKey", publicName: "customArrayKey", isSignal: true, isRequired: false, transformFunction: null }, listTitle: { classPropertyName: "listTitle", publicName: "listTitle", isSignal: true, isRequired: false, transformFunction: null }, moreData: { classPropertyName: "moreData", publicName: "moreData", isSignal: true, isRequired: false, transformFunction: null }, inModal: { classPropertyName: "inModal", publicName: "inModal", isSignal: true, isRequired: false, transformFunction: null }, expansionConfig: { classPropertyName: "expansionConfig", publicName: "expansionConfig", isSignal: true, isRequired: false, transformFunction: null }, fileUploadConfig: { classPropertyName: "fileUploadConfig", publicName: "fileUploadConfig", isSignal: true, isRequired: false, transformFunction: null }, rowStyleConfigs: { classPropertyName: "rowStyleConfigs", publicName: "rowStyleConfigs", isSignal: true, isRequired: false, transformFunction: null }, columnDisabledConfigs: { classPropertyName: "columnDisabledConfigs", publicName: "columnDisabledConfigs", isSignal: true, isRequired: false, transformFunction: null }, rowVisibilityConfigs: { classPropertyName: "rowVisibilityConfigs", publicName: "rowVisibilityConfigs", isSignal: true, isRequired: false, transformFunction: null }, headerOrder: { classPropertyName: "headerOrder", publicName: "headerOrder", isSignal: true, isRequired: false, transformFunction: null }, showActiveFilters: { classPropertyName: "showActiveFilters", publicName: "showActiveFilters", isSignal: true, isRequired: false, transformFunction: null }, activeFiltersConfig: { classPropertyName: "activeFiltersConfig", publicName: "activeFiltersConfig", isSignal: true, isRequired: false, transformFunction: null }, sortConfig: { classPropertyName: "sortConfig", publicName: "sortConfig", isSignal: true, isRequired: false, transformFunction: null }, showManualRefresh: { classPropertyName: "showManualRefresh", publicName: "showManualRefresh", isSignal: true, isRequired: false, transformFunction: null }, manualRefreshConfig: { classPropertyName: "manualRefreshConfig", publicName: "manualRefreshConfig", isSignal: true, isRequired: false, transformFunction: null }, refreshButtonConfig: { classPropertyName: "refreshButtonConfig", publicName: "refreshButtonConfig", isSignal: true, isRequired: false, transformFunction: null }, customEdit: { classPropertyName: "customEdit", publicName: "customEdit", isSignal: true, isRequired: false, transformFunction: null }, customDelete: { classPropertyName: "customDelete", publicName: "customDelete", isSignal: true, isRequired: false, transformFunction: null }, customView: { classPropertyName: "customView", publicName: "customView", isSignal: true, isRequired: false, transformFunction: null }, customSave: { classPropertyName: "customSave", publicName: "customSave", isSignal: true, isRequired: false, transformFunction: null }, useCustomSave: { classPropertyName: "useCustomSave", publicName: "useCustomSave", isSignal: true, isRequired: false, transformFunction: null }, onApiError: { classPropertyName: "onApiError", publicName: "onApiError", isSignal: true, isRequired: false, transformFunction: null }, inlineEditConfig: { classPropertyName: "inlineEditConfig", publicName: "inlineEditConfig", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { actionTriggered: "actionTriggered", selectionChanged: "selectionChanged", dataCreated: "dataCreated", dataUpdated: "dataUpdated", dataDeleted: "dataDeleted", dataFetched: "dataFetched", onMoreDataLoaded: "onMoreDataLoaded", globalActionTriggered: "globalActionTriggered", modalData: "modalData", beforeSave: "beforeSave", onFilterChange: "onFilterChange", onClearFilters: "onClearFilters", activeFilterRemoved: "activeFilterRemoved", activeFiltersCleared: "activeFiltersCleared", dataRefreshed: "dataRefreshed", inlineEditSave: "inlineEditSave", inlineEditModeChanged: "inlineEditModeChanged", inlineEditValidationError: "inlineEditValidationError" }, host: { listeners: { "window:beforeunload": "onBeforeUnload($event)", "document:click": "closeSubmenu()" } }, providers: [TableDataService, FilterService, PaginationService, ModelApiService, InlineEditService], viewQueries: [{ propertyName: "sentinel", first: true, predicate: ["sentinel"], descendants: true }, { propertyName: "dropdownTrigger", first: true, predicate: ["dropdownTrigger"], descendants: true }, { propertyName: "dropdown", first: true, predicate: ["dropdown"], descendants: true }, { propertyName: "manualRefreshComponent", first: true, predicate: CoreManualRefreshComponent, descendants: true }], hostDirectives: [{ directive: CoreHostDirective }], ngImport: i0, template: "@if (showActiveFilters()) {\n <core-active-filters\n [activeFilters]=\"currentActiveFilters()\"\n [config]=\"activeFiltersConfig()\"\n (onFilterRemove)=\"onActiveFilterRemove($event)\"\n (onClearAll)=\"onActiveFiltersClear()\">\n </core-active-filters>\n}\n<div class=\"c-table\" [class.in-modal]=\"inModal()\" [class.inline-edit-mode]=\"inlineEditService.isInlineEditMode()\">\n @if (showManualRefresh()) {\n <core-manual-refresh \n [config]=\"getManualRefreshConfig()\"\n (onRefresh)=\"onManualRefresh()\">\n </core-manual-refresh>\n }\n <table>\n <thead>\n <tr>\n @if (showSelection()) {\n <!-- Todo: Tabla con row selection -->\n <th class=\"select-column\">\n <input type=\"checkbox\" [checked]=\"isAllSelected()\" (change)=\"masterToggle()\" />\n </th>\n }\n @for (column of columns(); track $index) {\n <th [ngClass]=\"column.align ? 'u-align-' + column.align : ''\">\n @if (isColumnSortable(column)) {\n <button class=\"c-table-order\" tabindex=\"-1\"\n [class.is-asc]=\"getColumnSortState(column) === SortDirection.ASC\"\n [class.is-desc]=\"getColumnSortState(column) === SortDirection.DESC\"\n [class.has-multiple-sorts]=\"isMultiColumnSortEnabled() && getColumnSortPriority(column) !== null\"\n [title]=\"getSortButtonTitle(column)\"\n (click)=\"onColumnHeaderClick(column)\">\n {{ column.label | translate }}\n <!-- @if (isMultiColumnSortEnabled() && getColumnSortPriority(column) !== null) {\n <span class=\"c-table-order__priority\">{{ getColumnSortPriority(column)! + 1 }}</span>\n } -->\n <span class=\"c-table-order__controls\">\n <span class=\"c-table-order__arrow--desc icon-arrow-up\"></span>\n <span class=\"c-table-order__arrow--asc icon-arrow-down\"></span>\n </span>\n </button>\n } @else {\n {{ column.label | translate }}\n }\n </th>\n }\n @if (showActions() && (actions().length > 0 || customActions().length > 0)) {\n <th class=\"u-align-right\">{{ 'table.actions' | translate }}</th>\n }\n </tr>\n </thead>\n <tbody>\n @for (row of displayedData(); track row.getId()) {\n <tr [ngClass]=\"getRowClasses(row)\" \n [class.is-editable]=\"isRowInEditMode(row.getId())\"\n [class.is-disabled]=\"isRowDisabled(row)\">\n @if (showSelection()) {\n <!-- Todo: Tabla con row selection -->\n <td class=\"select-column\">\n <input type=\"checkbox\" [checked]=\"isRowSelected(row)\" (change)=\"toggleRow(row)\" />\n </td>\n }\n @for (column of columns(); track $index) {\n <td [attr.data-label]=\"column.label | translate\" \n [ngClass]=\"[\n column.align ? 'u-align-' + column.align : '',\n getCellDisabledClasses(row, column)\n ]\" \n [class.is-editing]=\"isColumnEditable(column, row)\"\n [class.is-column-disabled]=\"isColumnDisabledForRow(row, column)\">\n @if (column.template) {\n <!-- Todo: Ver qu\u00E9 es esto -->\n <ng-container *ngTemplateOutlet=\"column.template; context: { $implicit: row, column: column }\"></ng-container>\n } @else if (isColumnEditable(column, row)) {\n <!-- !Solcre: Modo de edici\u00F3n en l\u00EDnea usando DynamicField -->\n <div class=\"c-table__inline-edit\">\n <strong class=\"c-table__mobile-heading\">{{ column.label | translate }}:</strong>\n <div\n coreDynamicField\n [field]=\"getInlineEditableConfigWithState(row, column)!\"\n [value]=\"getEditingValue(row, column)\"\n [mode]=\"ModalMode.EDIT\"\n [errors]=\"getCellErrors(row, column)\"\n [rowData]=\"row\"\n (valueChange)=\"onCellValueChange(row, column, $event)\"\n (onBlurEvent)=\"onCellBlur(row, column)\"\n (onEnterEvent)=\"onCellEnter(row, column)\"\n ></div>\n </div>\n } @else {\n <div class=\"c-table__content\">\n <strong class=\"c-table__mobile-heading\">{{ column.label | translate }}:</strong> {{ getFormattedValue(row,\n column) }}\n </div>\n }\n </td>\n }\n\n <!-- Actions-->\n\n @if (showActions() && (actions().length > 0 || customActions().length > 0 || expansionConfig()?.enabled)) {\n\n <td class=\"u-align-right\">\n <div class=\"c-table__actions\">\n <core-dropdown [rowId]=\"row.getId()\" [extraDefaultActions]=\"getVisibleDefaultActions(row, true)\"\n [extraCustomActions]=\"getVisibleCustomActions(row, true)\" [row]=\"row\"\n [triggerElementId]=\"'dropdown-trigger-' + row.getId()\"\n (actionTriggered)=\"triggerAction($event.action, $event.row)\"\n (customActionTriggered)=\"triggerCustomAction($event.action, $event.row)\" #dropdown>\n </core-dropdown>\n @for (actionConfig of getVisibleDefaultActions(row, false); track actionConfig.action) {\n @if (hasPermission(actionConfig)) {\n @if (actionConfig.action === TableAction.VIEW || actionConfig.action === TableAction.EDIT ||\n actionConfig.action === TableAction.DELETE) {\n <core-generic-button [config]=\"getActionButtonConfig(actionConfig.action, actionConfig, row)\"\n (buttonClick)=\"onButtonClick($event, actionConfig.action, row)\">\n </core-generic-button>\n }\n }\n }\n @for (customAction of getVisibleCustomActions(row, false); track customAction.label || $index) {\n @if (hasPermission(customAction)) {\n <core-generic-button [config]=\"getCustomActionButtonConfigForRow(customAction, row)\"\n (buttonClick)=\"onButtonClick($event, customAction, row)\">\n </core-generic-button>\n }\n }\n\n @if (hasExtraActionsForRow(row)) {\n <core-generic-button [config]=\"getMoreActionsButtonConfig(row.getId())\" [data]=\"row\"\n (buttonClick)=\"onMoreActionsClick($event, row.getId())\" #dropdownTrigger>\n </core-generic-button>\n }\n\n @if (expansionConfig()?.enabled) {\n <!-- \u2705 Solcre: Celda dedicada para expansi\u00F3n en su posici\u00F3n correcta -->\n <core-generic-button [config]=\"getExpandButtonConfig(row)\" (buttonClick)=\"onExpandButtonClick($event, row)\">\n </core-generic-button>\n }\n\n </div> <!-- .c-table__actions -->\n </td> <!-- td parent of .c-table__actions -->\n } <!-- @if (showActions() -->\n\n\n </tr>\n @if (expansionConfig()?.enabled && isRowExpanded(row)) {\n <!-- Todo: Ver que es esto -->\n <tr class=\"expansion-row\" [ngClass]=\"getRowClasses(row)\">\n <td [attr.colspan]=\"displayedColumns().length\" class=\"expansion-content\">\n <ng-container *ngTemplateOutlet=\"expansionConfig()!.template; context: { $implicit: row }\">\n </ng-container>\n </td>\n </tr>\n }\n } @empty {\n <tr>\n <!-- Todo: Estilo .no-data -->\n <td [attr.colspan]=\"displayedColumns().length\">\n <p class=\"c-placeholder\">{{ 'table.noData' | translate }}</p>\n </td>\n </tr>\n }\n </tbody>\n </table>\n</div> <!-- .c-table -->\n\n<!-- Todo: Todo lo que viene dsp de la tabla -->\n\n@if (!enablePagination()) {\n<!-- Todo: Ver qu\u00E9 onda esto -->\n<div #sentinel class=\"sentinel\"></div>\n}\n\n@if (enablePagination()) {\n<core-generic-pagination \n [tableId]=\"tableId\" \n [isServerSide]=\"!!endpoint()\">\n</core-generic-pagination>\n}\n\n<core-generic-modal [isOpen]=\"tableActionService.getIsModalOpen()\" [mode]=\"tableActionService.getModalMode()\"\n [data]=\"tableActionService.getModalData()\" [fields]=\"hasTabs() ? [] : tableActionService.getModalFieldsToShow()\"\n [tabs]=\"hasTabs() ? modalTabs() : []\" [title]=\"tableActionService.getModalTitle()\" [modelFactory]=\"modelFactory() || null\"\n (save)=\"onModalSave($event)\" (close)=\"tableActionService.closeModal()\" (modalData)=\"onModalData($event)\">\n</core-generic-modal>\n\n<core-filter-modal [isOpen]=\"isFilterModalOpen()\" [filters]=\"customFilters()\" [currentFilterValues]=\"currentFilterValues()\" (close)=\"closeFiltersPopup()\"\n (filterChange)=\"handleFilterChange($event)\" (globalFilterChange)=\"applyGlobalFilter($event)\"\n (clearFilters)=\"handleClearFilters()\">\n</core-filter-modal>", styles: [".expansion-row .expansion-content{padding:16px;background-color:#f8f9fa;border-top:1px solid #dee2e6}.expansion-row td{border-bottom:none}@keyframes newItemHighlight{0%{background-color:#f8f9fa;border-left-color:#28a745}25%{background-color:#e9ecef}50%{background-color:#f8f9fa}75%{background-color:#e9ecef}to{background-color:transparent;border-left-color:transparent}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }, { kind: "component", type: GenericModalComponent, selector: "core-generic-modal", inputs: ["isOpen", "mode", "data", "fields", "tabs", "steps", "title", "isMultiple", "customTemplate", "customViewTemplate", "finalStepTemplate", "buttonConfig", "modelFactory", "errors", "validators", "customHasChanges", "stepValidationEnabled", "allowFreeNavigation", "autoMarkCompleted"], outputs: ["save", "close", "modalData"] }, { kind: "component", type: GenericPaginationComponent, selector: "core-generic-pagination", inputs: ["tableId", "isServerSide"] }, { kind: "component", type: DropdownComponent, selector: "core-dropdown", inputs: ["rowId", "triggerElementId", "extraDefaultActions", "extraCustomActions", "row"], outputs: ["actionTriggered", "customActionTriggered"] }, { kind: "component", type: FilterModalComponent, selector: "core-filter-modal", inputs: ["isOpen", "filters", "currentFilterValues"], outputs: ["close", "filterChange", "clearFilters", "globalFilterChange"] }, { kind: "component", type: GenericButtonComponent, selector: "core-generic-button", inputs: ["config", "data"], outputs: ["buttonClick"] }, { kind: "directive", type: DynamicFieldDirective, selector: "[coreDynamicField]", inputs: ["field", "value", "mode", "errors", "rowData", "formValue"], outputs: ["valueChange", "onBlurEvent", "onEnterEvent", "selectionChange"] }, { kind: "component", type: ActiveFiltersComponent, selector: "core-active-filters", inputs: ["activeFilters", "config"], outputs: ["onFilterRemove", "onClearAll"] }, { kind: "component", type: CoreManualRefreshComponent, selector: "core-manual-refresh", inputs: ["config", "refreshId"], outputs: ["onRefresh", "timestampUpdated"] }] });
|
|
13281
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: GenericTableComponent, isStandalone: true, selector: "core-generic-table", inputs: { columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: true, transformFunction: null }, modalFields: { classPropertyName: "modalFields", publicName: "modalFields", isSignal: true, isRequired: false, transformFunction: null }, modalTabs: { classPropertyName: "modalTabs", publicName: "modalTabs", isSignal: true, isRequired: false, transformFunction: null }, actions: { classPropertyName: "actions", publicName: "actions", isSignal: true, isRequired: true, transformFunction: null }, customActions: { classPropertyName: "customActions", publicName: "customActions", isSignal: true, isRequired: false, transformFunction: null }, globalActions: { classPropertyName: "globalActions", publicName: "globalActions", isSignal: true, isRequired: false, transformFunction: null }, pageSizeOptions: { classPropertyName: "pageSizeOptions", publicName: "pageSizeOptions", isSignal: true, isRequired: false, transformFunction: null }, showFilter: { classPropertyName: "showFilter", publicName: "showFilter", isSignal: true, isRequired: false, transformFunction: null }, showSelection: { classPropertyName: "showSelection", publicName: "showSelection", isSignal: true, isRequired: false, transformFunction: null }, showActions: { classPropertyName: "showActions", publicName: "showActions", isSignal: true, isRequired: false, transformFunction: null }, showCreateButton: { classPropertyName: "showCreateButton", publicName: "showCreateButton", isSignal: true, isRequired: false, transformFunction: null }, filterButtonConfig: { classPropertyName: "filterButtonConfig", publicName: "filterButtonConfig", isSignal: true, isRequired: false, transformFunction: null }, createButtonConfig: { classPropertyName: "createButtonConfig", publicName: "createButtonConfig", isSignal: true, isRequired: false, transformFunction: null }, createButtonText: { classPropertyName: "createButtonText", publicName: "createButtonText", isSignal: true, isRequired: false, transformFunction: null }, dataInput: { classPropertyName: "dataInput", publicName: "dataInput", isSignal: true, isRequired: false, transformFunction: null }, customFilters: { classPropertyName: "customFilters", publicName: "customFilters", isSignal: true, isRequired: false, transformFunction: null }, enablePagination: { classPropertyName: "enablePagination", publicName: "enablePagination", isSignal: true, isRequired: false, transformFunction: null }, modelFactory: { classPropertyName: "modelFactory", publicName: "modelFactory", isSignal: true, isRequired: false, transformFunction: null }, endpoint: { classPropertyName: "endpoint", publicName: "endpoint", isSignal: true, isRequired: false, transformFunction: null }, customParams: { classPropertyName: "customParams", publicName: "customParams", isSignal: true, isRequired: false, transformFunction: null }, customArrayKey: { classPropertyName: "customArrayKey", publicName: "customArrayKey", isSignal: true, isRequired: false, transformFunction: null }, listTitle: { classPropertyName: "listTitle", publicName: "listTitle", isSignal: true, isRequired: false, transformFunction: null }, moreData: { classPropertyName: "moreData", publicName: "moreData", isSignal: true, isRequired: false, transformFunction: null }, inModal: { classPropertyName: "inModal", publicName: "inModal", isSignal: true, isRequired: false, transformFunction: null }, expansionConfig: { classPropertyName: "expansionConfig", publicName: "expansionConfig", isSignal: true, isRequired: false, transformFunction: null }, fileUploadConfig: { classPropertyName: "fileUploadConfig", publicName: "fileUploadConfig", isSignal: true, isRequired: false, transformFunction: null }, rowStyleConfigs: { classPropertyName: "rowStyleConfigs", publicName: "rowStyleConfigs", isSignal: true, isRequired: false, transformFunction: null }, columnDisabledConfigs: { classPropertyName: "columnDisabledConfigs", publicName: "columnDisabledConfigs", isSignal: true, isRequired: false, transformFunction: null }, rowVisibilityConfigs: { classPropertyName: "rowVisibilityConfigs", publicName: "rowVisibilityConfigs", isSignal: true, isRequired: false, transformFunction: null }, headerOrder: { classPropertyName: "headerOrder", publicName: "headerOrder", isSignal: true, isRequired: false, transformFunction: null }, showActiveFilters: { classPropertyName: "showActiveFilters", publicName: "showActiveFilters", isSignal: true, isRequired: false, transformFunction: null }, activeFiltersConfig: { classPropertyName: "activeFiltersConfig", publicName: "activeFiltersConfig", isSignal: true, isRequired: false, transformFunction: null }, sortConfig: { classPropertyName: "sortConfig", publicName: "sortConfig", isSignal: true, isRequired: false, transformFunction: null }, showManualRefresh: { classPropertyName: "showManualRefresh", publicName: "showManualRefresh", isSignal: true, isRequired: false, transformFunction: null }, manualRefreshConfig: { classPropertyName: "manualRefreshConfig", publicName: "manualRefreshConfig", isSignal: true, isRequired: false, transformFunction: null }, refreshButtonConfig: { classPropertyName: "refreshButtonConfig", publicName: "refreshButtonConfig", isSignal: true, isRequired: false, transformFunction: null }, customEdit: { classPropertyName: "customEdit", publicName: "customEdit", isSignal: true, isRequired: false, transformFunction: null }, customDelete: { classPropertyName: "customDelete", publicName: "customDelete", isSignal: true, isRequired: false, transformFunction: null }, customView: { classPropertyName: "customView", publicName: "customView", isSignal: true, isRequired: false, transformFunction: null }, customSave: { classPropertyName: "customSave", publicName: "customSave", isSignal: true, isRequired: false, transformFunction: null }, useCustomSave: { classPropertyName: "useCustomSave", publicName: "useCustomSave", isSignal: true, isRequired: false, transformFunction: null }, onApiError: { classPropertyName: "onApiError", publicName: "onApiError", isSignal: true, isRequired: false, transformFunction: null }, inlineEditConfig: { classPropertyName: "inlineEditConfig", publicName: "inlineEditConfig", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { actionTriggered: "actionTriggered", selectionChanged: "selectionChanged", dataCreated: "dataCreated", dataUpdated: "dataUpdated", dataDeleted: "dataDeleted", dataFetched: "dataFetched", onMoreDataLoaded: "onMoreDataLoaded", globalActionTriggered: "globalActionTriggered", modalData: "modalData", beforeSave: "beforeSave", onFilterChange: "onFilterChange", onClearFilters: "onClearFilters", activeFilterRemoved: "activeFilterRemoved", activeFiltersCleared: "activeFiltersCleared", dataRefreshed: "dataRefreshed", inlineEditSave: "inlineEditSave", inlineEditModeChanged: "inlineEditModeChanged", inlineEditValidationError: "inlineEditValidationError" }, host: { listeners: { "window:beforeunload": "onBeforeUnload($event)", "document:click": "closeSubmenu()" } }, providers: [TableDataService, FilterService, PaginationService, ModelApiService, InlineEditService], viewQueries: [{ propertyName: "sentinel", first: true, predicate: ["sentinel"], descendants: true }, { propertyName: "dropdownTrigger", first: true, predicate: ["dropdownTrigger"], descendants: true }, { propertyName: "dropdown", first: true, predicate: ["dropdown"], descendants: true }, { propertyName: "manualRefreshComponent", first: true, predicate: CoreManualRefreshComponent, descendants: true }], hostDirectives: [{ directive: CoreHostDirective }], ngImport: i0, template: "@if (showActiveFilters()) {\n <core-active-filters\n [activeFilters]=\"currentActiveFilters()\"\n [config]=\"activeFiltersConfig()\"\n (onFilterRemove)=\"onActiveFilterRemove($event)\"\n (onClearAll)=\"onActiveFiltersClear()\">\n </core-active-filters>\n}\n<div class=\"c-table\" [class.in-modal]=\"inModal()\" [class.inline-edit-mode]=\"inlineEditService.isInlineEditMode()\">\n @if (showManualRefresh()) {\n <core-manual-refresh \n [config]=\"getManualRefreshConfig()\"\n (onRefresh)=\"onManualRefresh()\">\n </core-manual-refresh>\n }\n <table>\n <thead>\n <tr>\n @if (showSelection()) {\n <!-- Todo: Tabla con row selection -->\n <th class=\"select-column\">\n <input type=\"checkbox\" [checked]=\"isAllSelected()\" (change)=\"masterToggle()\" />\n </th>\n }\n @for (column of columns(); track $index) {\n <th [ngClass]=\"column.align ? 'u-align-' + column.align : ''\">\n @if (isColumnSortable(column)) {\n <button class=\"c-table-order\" tabindex=\"-1\"\n [class.is-asc]=\"getColumnSortState(column) === SortDirection.ASC\"\n [class.is-desc]=\"getColumnSortState(column) === SortDirection.DESC\"\n [class.has-multiple-sorts]=\"isMultiColumnSortEnabled() && getColumnSortPriority(column) !== null\"\n [title]=\"getSortButtonTitle(column)\"\n (click)=\"onColumnHeaderClick(column)\">\n {{ column.label | translate }}\n <!-- @if (isMultiColumnSortEnabled() && getColumnSortPriority(column) !== null) {\n <span class=\"c-table-order__priority\">{{ getColumnSortPriority(column)! + 1 }}</span>\n } -->\n <span class=\"c-table-order__controls\">\n <span class=\"c-table-order__arrow--desc icon-arrow-up\"></span>\n <span class=\"c-table-order__arrow--asc icon-arrow-down\"></span>\n </span>\n </button>\n } @else {\n {{ column.label | translate }}\n }\n </th>\n }\n @if (showActions() && (actions().length > 0 || customActions().length > 0)) {\n <th class=\"u-align-right\">{{ 'table.actions' | translate }}</th>\n }\n </tr>\n </thead>\n <tbody>\n @for (row of displayedData(); track row.getId()) {\n <tr [ngClass]=\"getRowClasses(row)\" \n [class.is-editable]=\"isRowInEditMode(row.getId())\"\n [class.is-disabled]=\"isRowDisabled(row)\">\n @if (showSelection()) {\n <!-- Todo: Tabla con row selection -->\n <td class=\"select-column\">\n <input type=\"checkbox\" [checked]=\"isRowSelected(row)\" (change)=\"toggleRow(row)\" />\n </td>\n }\n @for (column of columns(); track $index) {\n <td [attr.data-label]=\"column.label | translate\" \n [ngClass]=\"[\n column.align ? 'u-align-' + column.align : '',\n getCellDisabledClasses(row, column)\n ]\" \n [class.is-editing]=\"isColumnEditable(column, row)\"\n [class.is-column-disabled]=\"isColumnDisabledForRow(row, column)\">\n @if (column.template) {\n <!-- Todo: Ver qu\u00E9 es esto -->\n <ng-container *ngTemplateOutlet=\"column.template; context: { $implicit: row, column: column }\"></ng-container>\n } @else if (isColumnEditable(column, row)) {\n <!-- !Solcre: Modo de edici\u00F3n en l\u00EDnea usando DynamicField -->\n <div class=\"c-table__inline-edit\">\n <strong class=\"c-table__mobile-heading\">{{ column.label | translate }}:</strong>\n <div\n coreDynamicField\n [field]=\"getInlineEditableConfigWithState(row, column)!\"\n [value]=\"getEditingValue(row, column)\"\n [mode]=\"ModalMode.EDIT\"\n [errors]=\"getCellErrors(row, column)\"\n [rowData]=\"row\"\n (valueChange)=\"onCellValueChange(row, column, $event)\"\n (onBlurEvent)=\"onCellBlur(row, column)\"\n (onEnterEvent)=\"onCellEnter(row, column)\"\n ></div>\n </div>\n } @else {\n <div class=\"c-table__content\">\n <strong class=\"c-table__mobile-heading\">{{ column.label | translate }}:</strong> {{ getFormattedValue(row,\n column) }}\n </div>\n }\n </td>\n }\n\n <!-- Actions-->\n\n @if (showActions() && (actions().length > 0 || customActions().length > 0 || expansionConfig()?.enabled)) {\n\n <td class=\"u-align-right\">\n <div class=\"c-table__actions\">\n <core-dropdown [rowId]=\"row.getId()\" [extraDefaultActions]=\"getVisibleDefaultActions(row, true)\"\n [extraCustomActions]=\"getVisibleCustomActions(row, true)\" [row]=\"row\"\n [triggerElementId]=\"'dropdown-trigger-' + row.getId()\"\n (actionTriggered)=\"triggerAction($event.action, $event.row)\"\n (customActionTriggered)=\"triggerCustomAction($event.action, $event.row)\" #dropdown>\n </core-dropdown>\n @for (actionConfig of getVisibleDefaultActions(row, false); track actionConfig.action) {\n @if (hasPermission(actionConfig)) {\n @if (actionConfig.action === TableAction.VIEW || actionConfig.action === TableAction.EDIT ||\n actionConfig.action === TableAction.DELETE) {\n <core-generic-button [config]=\"getActionButtonConfig(actionConfig.action, actionConfig, row)\"\n (buttonClick)=\"onButtonClick($event, actionConfig.action, row)\">\n </core-generic-button>\n }\n }\n }\n @for (customAction of getVisibleCustomActions(row, false); track customAction.label || $index) {\n @if (hasPermission(customAction)) {\n @if (customAction.isSwitch && customAction.switchOptions) {\n <core-generic-switch\n [options]=\"customAction.switchOptions\"\n [selectedValue]=\"customAction.switchValue ? customAction.switchValue(row) : null\"\n [ariaLabel]=\"customAction.switchAriaLabel || customAction.title\"\n (valueChange)=\"onCustomActionSwitchChange($event, customAction, row)\">\n </core-generic-switch>\n } @else {\n <core-generic-button [config]=\"getCustomActionButtonConfigForRow(customAction, row)\"\n (buttonClick)=\"onButtonClick($event, customAction, row)\">\n </core-generic-button>\n }\n }\n }\n\n @if (hasExtraActionsForRow(row)) {\n <core-generic-button [config]=\"getMoreActionsButtonConfig(row.getId())\" [data]=\"row\"\n (buttonClick)=\"onMoreActionsClick($event, row.getId())\" #dropdownTrigger>\n </core-generic-button>\n }\n\n @if (expansionConfig()?.enabled) {\n <!-- \u2705 Solcre: Celda dedicada para expansi\u00F3n en su posici\u00F3n correcta -->\n <core-generic-button [config]=\"getExpandButtonConfig(row)\" (buttonClick)=\"onExpandButtonClick($event, row)\">\n </core-generic-button>\n }\n\n </div> <!-- .c-table__actions -->\n </td> <!-- td parent of .c-table__actions -->\n } <!-- @if (showActions() -->\n\n\n </tr>\n @if (expansionConfig()?.enabled && isRowExpanded(row)) {\n <!-- Todo: Ver que es esto -->\n <tr class=\"expansion-row\" [ngClass]=\"getRowClasses(row)\">\n <td [attr.colspan]=\"displayedColumns().length\" class=\"expansion-content\">\n <ng-container *ngTemplateOutlet=\"expansionConfig()!.template; context: { $implicit: row }\">\n </ng-container>\n </td>\n </tr>\n }\n } @empty {\n <tr>\n <!-- Todo: Estilo .no-data -->\n <td [attr.colspan]=\"displayedColumns().length\">\n <p class=\"c-placeholder\">{{ 'table.noData' | translate }}</p>\n </td>\n </tr>\n }\n </tbody>\n </table>\n</div> <!-- .c-table -->\n\n<!-- Todo: Todo lo que viene dsp de la tabla -->\n\n@if (!enablePagination()) {\n<!-- Todo: Ver qu\u00E9 onda esto -->\n<div #sentinel class=\"sentinel\"></div>\n}\n\n@if (enablePagination()) {\n<core-generic-pagination \n [tableId]=\"tableId\" \n [isServerSide]=\"!!endpoint()\">\n</core-generic-pagination>\n}\n\n<core-generic-modal [isOpen]=\"tableActionService.getIsModalOpen()\" [mode]=\"tableActionService.getModalMode()\"\n [data]=\"tableActionService.getModalData()\" [fields]=\"hasTabs() ? [] : tableActionService.getModalFieldsToShow()\"\n [tabs]=\"hasTabs() ? modalTabs() : []\" [title]=\"tableActionService.getModalTitle()\" [modelFactory]=\"modelFactory() || null\"\n (save)=\"onModalSave($event)\" (close)=\"tableActionService.closeModal()\" (modalData)=\"onModalData($event)\">\n</core-generic-modal>\n\n<core-filter-modal [isOpen]=\"isFilterModalOpen()\" [filters]=\"customFilters()\" [currentFilterValues]=\"currentFilterValues()\" (close)=\"closeFiltersPopup()\"\n (filterChange)=\"handleFilterChange($event)\" (globalFilterChange)=\"applyGlobalFilter($event)\"\n (clearFilters)=\"handleClearFilters()\">\n</core-filter-modal>", styles: [".expansion-row .expansion-content{padding:16px;background-color:#f8f9fa;border-top:1px solid #dee2e6}.expansion-row td{border-bottom:none}@keyframes newItemHighlight{0%{background-color:#f8f9fa;border-left-color:#28a745}25%{background-color:#e9ecef}50%{background-color:#f8f9fa}75%{background-color:#e9ecef}to{background-color:transparent;border-left-color:transparent}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }, { kind: "component", type: GenericModalComponent, selector: "core-generic-modal", inputs: ["isOpen", "mode", "data", "fields", "tabs", "steps", "title", "isMultiple", "customTemplate", "customViewTemplate", "finalStepTemplate", "buttonConfig", "modelFactory", "errors", "validators", "customHasChanges", "stepValidationEnabled", "allowFreeNavigation", "autoMarkCompleted"], outputs: ["save", "close", "modalData"] }, { kind: "component", type: GenericPaginationComponent, selector: "core-generic-pagination", inputs: ["tableId", "isServerSide"] }, { kind: "component", type: DropdownComponent, selector: "core-dropdown", inputs: ["rowId", "triggerElementId", "extraDefaultActions", "extraCustomActions", "row"], outputs: ["actionTriggered", "customActionTriggered"] }, { kind: "component", type: FilterModalComponent, selector: "core-filter-modal", inputs: ["isOpen", "filters", "currentFilterValues"], outputs: ["close", "filterChange", "clearFilters", "globalFilterChange"] }, { kind: "component", type: GenericButtonComponent, selector: "core-generic-button", inputs: ["config", "data"], outputs: ["buttonClick"] }, { kind: "directive", type: DynamicFieldDirective, selector: "[coreDynamicField]", inputs: ["field", "value", "mode", "errors", "rowData", "formValue"], outputs: ["valueChange", "onBlurEvent", "onEnterEvent", "selectionChange"] }, { kind: "component", type: ActiveFiltersComponent, selector: "core-active-filters", inputs: ["activeFilters", "config"], outputs: ["onFilterRemove", "onClearAll"] }, { kind: "component", type: CoreManualRefreshComponent, selector: "core-manual-refresh", inputs: ["config", "refreshId"], outputs: ["onRefresh", "timestampUpdated"] }, { kind: "component", type: GenericSwitchComponent, selector: "core-generic-switch", inputs: ["options", "selectedValue", "ariaLabel"], outputs: ["valueChange"] }] });
|
|
13255
13282
|
}
|
|
13256
13283
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: GenericTableComponent, decorators: [{
|
|
13257
13284
|
type: Component,
|
|
@@ -13266,7 +13293,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImpor
|
|
|
13266
13293
|
DynamicFieldDirective,
|
|
13267
13294
|
ActiveFiltersComponent,
|
|
13268
13295
|
CoreManualRefreshComponent,
|
|
13269
|
-
|
|
13296
|
+
GenericSwitchComponent,
|
|
13297
|
+
], hostDirectives: [CoreHostDirective], providers: [TableDataService, FilterService, PaginationService, ModelApiService, InlineEditService], template: "@if (showActiveFilters()) {\n <core-active-filters\n [activeFilters]=\"currentActiveFilters()\"\n [config]=\"activeFiltersConfig()\"\n (onFilterRemove)=\"onActiveFilterRemove($event)\"\n (onClearAll)=\"onActiveFiltersClear()\">\n </core-active-filters>\n}\n<div class=\"c-table\" [class.in-modal]=\"inModal()\" [class.inline-edit-mode]=\"inlineEditService.isInlineEditMode()\">\n @if (showManualRefresh()) {\n <core-manual-refresh \n [config]=\"getManualRefreshConfig()\"\n (onRefresh)=\"onManualRefresh()\">\n </core-manual-refresh>\n }\n <table>\n <thead>\n <tr>\n @if (showSelection()) {\n <!-- Todo: Tabla con row selection -->\n <th class=\"select-column\">\n <input type=\"checkbox\" [checked]=\"isAllSelected()\" (change)=\"masterToggle()\" />\n </th>\n }\n @for (column of columns(); track $index) {\n <th [ngClass]=\"column.align ? 'u-align-' + column.align : ''\">\n @if (isColumnSortable(column)) {\n <button class=\"c-table-order\" tabindex=\"-1\"\n [class.is-asc]=\"getColumnSortState(column) === SortDirection.ASC\"\n [class.is-desc]=\"getColumnSortState(column) === SortDirection.DESC\"\n [class.has-multiple-sorts]=\"isMultiColumnSortEnabled() && getColumnSortPriority(column) !== null\"\n [title]=\"getSortButtonTitle(column)\"\n (click)=\"onColumnHeaderClick(column)\">\n {{ column.label | translate }}\n <!-- @if (isMultiColumnSortEnabled() && getColumnSortPriority(column) !== null) {\n <span class=\"c-table-order__priority\">{{ getColumnSortPriority(column)! + 1 }}</span>\n } -->\n <span class=\"c-table-order__controls\">\n <span class=\"c-table-order__arrow--desc icon-arrow-up\"></span>\n <span class=\"c-table-order__arrow--asc icon-arrow-down\"></span>\n </span>\n </button>\n } @else {\n {{ column.label | translate }}\n }\n </th>\n }\n @if (showActions() && (actions().length > 0 || customActions().length > 0)) {\n <th class=\"u-align-right\">{{ 'table.actions' | translate }}</th>\n }\n </tr>\n </thead>\n <tbody>\n @for (row of displayedData(); track row.getId()) {\n <tr [ngClass]=\"getRowClasses(row)\" \n [class.is-editable]=\"isRowInEditMode(row.getId())\"\n [class.is-disabled]=\"isRowDisabled(row)\">\n @if (showSelection()) {\n <!-- Todo: Tabla con row selection -->\n <td class=\"select-column\">\n <input type=\"checkbox\" [checked]=\"isRowSelected(row)\" (change)=\"toggleRow(row)\" />\n </td>\n }\n @for (column of columns(); track $index) {\n <td [attr.data-label]=\"column.label | translate\" \n [ngClass]=\"[\n column.align ? 'u-align-' + column.align : '',\n getCellDisabledClasses(row, column)\n ]\" \n [class.is-editing]=\"isColumnEditable(column, row)\"\n [class.is-column-disabled]=\"isColumnDisabledForRow(row, column)\">\n @if (column.template) {\n <!-- Todo: Ver qu\u00E9 es esto -->\n <ng-container *ngTemplateOutlet=\"column.template; context: { $implicit: row, column: column }\"></ng-container>\n } @else if (isColumnEditable(column, row)) {\n <!-- !Solcre: Modo de edici\u00F3n en l\u00EDnea usando DynamicField -->\n <div class=\"c-table__inline-edit\">\n <strong class=\"c-table__mobile-heading\">{{ column.label | translate }}:</strong>\n <div\n coreDynamicField\n [field]=\"getInlineEditableConfigWithState(row, column)!\"\n [value]=\"getEditingValue(row, column)\"\n [mode]=\"ModalMode.EDIT\"\n [errors]=\"getCellErrors(row, column)\"\n [rowData]=\"row\"\n (valueChange)=\"onCellValueChange(row, column, $event)\"\n (onBlurEvent)=\"onCellBlur(row, column)\"\n (onEnterEvent)=\"onCellEnter(row, column)\"\n ></div>\n </div>\n } @else {\n <div class=\"c-table__content\">\n <strong class=\"c-table__mobile-heading\">{{ column.label | translate }}:</strong> {{ getFormattedValue(row,\n column) }}\n </div>\n }\n </td>\n }\n\n <!-- Actions-->\n\n @if (showActions() && (actions().length > 0 || customActions().length > 0 || expansionConfig()?.enabled)) {\n\n <td class=\"u-align-right\">\n <div class=\"c-table__actions\">\n <core-dropdown [rowId]=\"row.getId()\" [extraDefaultActions]=\"getVisibleDefaultActions(row, true)\"\n [extraCustomActions]=\"getVisibleCustomActions(row, true)\" [row]=\"row\"\n [triggerElementId]=\"'dropdown-trigger-' + row.getId()\"\n (actionTriggered)=\"triggerAction($event.action, $event.row)\"\n (customActionTriggered)=\"triggerCustomAction($event.action, $event.row)\" #dropdown>\n </core-dropdown>\n @for (actionConfig of getVisibleDefaultActions(row, false); track actionConfig.action) {\n @if (hasPermission(actionConfig)) {\n @if (actionConfig.action === TableAction.VIEW || actionConfig.action === TableAction.EDIT ||\n actionConfig.action === TableAction.DELETE) {\n <core-generic-button [config]=\"getActionButtonConfig(actionConfig.action, actionConfig, row)\"\n (buttonClick)=\"onButtonClick($event, actionConfig.action, row)\">\n </core-generic-button>\n }\n }\n }\n @for (customAction of getVisibleCustomActions(row, false); track customAction.label || $index) {\n @if (hasPermission(customAction)) {\n @if (customAction.isSwitch && customAction.switchOptions) {\n <core-generic-switch\n [options]=\"customAction.switchOptions\"\n [selectedValue]=\"customAction.switchValue ? customAction.switchValue(row) : null\"\n [ariaLabel]=\"customAction.switchAriaLabel || customAction.title\"\n (valueChange)=\"onCustomActionSwitchChange($event, customAction, row)\">\n </core-generic-switch>\n } @else {\n <core-generic-button [config]=\"getCustomActionButtonConfigForRow(customAction, row)\"\n (buttonClick)=\"onButtonClick($event, customAction, row)\">\n </core-generic-button>\n }\n }\n }\n\n @if (hasExtraActionsForRow(row)) {\n <core-generic-button [config]=\"getMoreActionsButtonConfig(row.getId())\" [data]=\"row\"\n (buttonClick)=\"onMoreActionsClick($event, row.getId())\" #dropdownTrigger>\n </core-generic-button>\n }\n\n @if (expansionConfig()?.enabled) {\n <!-- \u2705 Solcre: Celda dedicada para expansi\u00F3n en su posici\u00F3n correcta -->\n <core-generic-button [config]=\"getExpandButtonConfig(row)\" (buttonClick)=\"onExpandButtonClick($event, row)\">\n </core-generic-button>\n }\n\n </div> <!-- .c-table__actions -->\n </td> <!-- td parent of .c-table__actions -->\n } <!-- @if (showActions() -->\n\n\n </tr>\n @if (expansionConfig()?.enabled && isRowExpanded(row)) {\n <!-- Todo: Ver que es esto -->\n <tr class=\"expansion-row\" [ngClass]=\"getRowClasses(row)\">\n <td [attr.colspan]=\"displayedColumns().length\" class=\"expansion-content\">\n <ng-container *ngTemplateOutlet=\"expansionConfig()!.template; context: { $implicit: row }\">\n </ng-container>\n </td>\n </tr>\n }\n } @empty {\n <tr>\n <!-- Todo: Estilo .no-data -->\n <td [attr.colspan]=\"displayedColumns().length\">\n <p class=\"c-placeholder\">{{ 'table.noData' | translate }}</p>\n </td>\n </tr>\n }\n </tbody>\n </table>\n</div> <!-- .c-table -->\n\n<!-- Todo: Todo lo que viene dsp de la tabla -->\n\n@if (!enablePagination()) {\n<!-- Todo: Ver qu\u00E9 onda esto -->\n<div #sentinel class=\"sentinel\"></div>\n}\n\n@if (enablePagination()) {\n<core-generic-pagination \n [tableId]=\"tableId\" \n [isServerSide]=\"!!endpoint()\">\n</core-generic-pagination>\n}\n\n<core-generic-modal [isOpen]=\"tableActionService.getIsModalOpen()\" [mode]=\"tableActionService.getModalMode()\"\n [data]=\"tableActionService.getModalData()\" [fields]=\"hasTabs() ? [] : tableActionService.getModalFieldsToShow()\"\n [tabs]=\"hasTabs() ? modalTabs() : []\" [title]=\"tableActionService.getModalTitle()\" [modelFactory]=\"modelFactory() || null\"\n (save)=\"onModalSave($event)\" (close)=\"tableActionService.closeModal()\" (modalData)=\"onModalData($event)\">\n</core-generic-modal>\n\n<core-filter-modal [isOpen]=\"isFilterModalOpen()\" [filters]=\"customFilters()\" [currentFilterValues]=\"currentFilterValues()\" (close)=\"closeFiltersPopup()\"\n (filterChange)=\"handleFilterChange($event)\" (globalFilterChange)=\"applyGlobalFilter($event)\"\n (clearFilters)=\"handleClearFilters()\">\n</core-filter-modal>", styles: [".expansion-row .expansion-content{padding:16px;background-color:#f8f9fa;border-top:1px solid #dee2e6}.expansion-row td{border-bottom:none}@keyframes newItemHighlight{0%{background-color:#f8f9fa;border-left-color:#28a745}25%{background-color:#e9ecef}50%{background-color:#f8f9fa}75%{background-color:#e9ecef}to{background-color:transparent;border-left-color:transparent}}\n"] }]
|
|
13270
13298
|
}], ctorParameters: () => [], propDecorators: { sentinel: [{
|
|
13271
13299
|
type: ViewChild,
|
|
13272
13300
|
args: ['sentinel', { static: false }]
|
|
@@ -14616,6 +14644,11 @@ class HeaderComponent {
|
|
|
14616
14644
|
this.triggerGlobalAction(action);
|
|
14617
14645
|
}
|
|
14618
14646
|
}
|
|
14647
|
+
onGlobalSwitchChange(value, action) {
|
|
14648
|
+
if (this.hasPermission(action) && action.onSwitchChange) {
|
|
14649
|
+
action.onSwitchChange(value, []);
|
|
14650
|
+
}
|
|
14651
|
+
}
|
|
14619
14652
|
onCustomButtonClick(event, action) {
|
|
14620
14653
|
if (this.isCustomActionVisible(action) && !this.isCustomActionDisabled(action)) {
|
|
14621
14654
|
this.triggerCustomAction(action);
|
|
@@ -14667,15 +14700,16 @@ class HeaderComponent {
|
|
|
14667
14700
|
return this.headerService.getText()();
|
|
14668
14701
|
}
|
|
14669
14702
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: HeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
14670
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: HeaderComponent, isStandalone: true, selector: "core-header", outputs: { filterRequested: "filterRequested", createRequested: "createRequested", globalActionTriggered: "globalActionTriggered" }, hostDirectives: [{ directive: CoreHostDirective }], ngImport: i0, template: "@if (headerService.getIsVisible()()) {\n @if(!headerService.getHeaderOutside()()) {\n <div class=\"c-header\">\n <div class=\"c-header__row\">\n\n <div class=\"c-header__group\">\n\n <h2 class=\"c-header__heading u-heading\">{{ getHeaderTitle() }}</h2>\n\n </div>\n\n <div class=\"c-header__group u-flex\">\n\n @for (element of headerService.getOrderedElements(); track element.type) {\n @if (headerService.isElementVisible(element.type)) {\n \n @switch (element.type) {\n @case (HeaderElementType.GLOBAL_ACTIONS) {\n @for (globalAction of headerService.getGlobalActions()(); track globalAction.label || $index) {\n @if (hasPermission(globalAction)) {\n <core-generic-button \n
|
|
14703
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: HeaderComponent, isStandalone: true, selector: "core-header", outputs: { filterRequested: "filterRequested", createRequested: "createRequested", globalActionTriggered: "globalActionTriggered" }, hostDirectives: [{ directive: CoreHostDirective }], ngImport: i0, template: "@if (headerService.getIsVisible()()) {\n @if(!headerService.getHeaderOutside()()) {\n <div class=\"c-header\">\n <div class=\"c-header__row\">\n\n <div class=\"c-header__group\">\n\n <h2 class=\"c-header__heading u-heading\">{{ getHeaderTitle() }}</h2>\n\n </div>\n\n <div class=\"c-header__group u-flex\">\n\n @for (element of headerService.getOrderedElements(); track element.type) {\n @if (headerService.isElementVisible(element.type)) {\n \n @switch (element.type) {\n @case (HeaderElementType.GLOBAL_ACTIONS) {\n @for (globalAction of headerService.getGlobalActions()(); track globalAction.label || $index) {\n @if (hasPermission(globalAction)) {\n @if (globalAction.isSwitch && globalAction.switchOptions) {\n <core-generic-switch\n [options]=\"globalAction.switchOptions\"\n [selectedValue]=\"globalAction.switchSelectedValue\"\n [ariaLabel]=\"globalAction.switchAriaLabel || globalAction.label || 'Switch options'\"\n (valueChange)=\"onGlobalSwitchChange($event, globalAction)\">\n </core-generic-switch>\n } @else {\n <core-generic-button \n [config]=\"getGlobalActionButtonConfig(globalAction)\"\n (buttonClick)=\"onGlobalButtonClick($event, globalAction)\">\n </core-generic-button>\n }\n }\n }\n }\n \n @case (HeaderElementType.CUSTOM_ACTIONS) {\n @for (customAction of headerService.getCustomActions()(); track customAction.id) {\n @if (isCustomActionVisible(customAction)) {\n <core-generic-button \n [config]=\"getCustomActionButtonConfig(customAction)\"\n (buttonClick)=\"onCustomButtonClick($event, customAction)\">\n </core-generic-button>\n }\n }\n }\n \n @case (HeaderElementType.FILTER) {\n <core-generic-button \n [config]=\"getFilterButtonConfig()\"\n (buttonClick)=\"onFilterButtonClick()\">\n </core-generic-button>\n }\n \n @case (HeaderElementType.CREATE) {\n <core-generic-button \n [config]=\"getCreateButtonConfig()\"\n (buttonClick)=\"onCreateButtonClick()\">\n </core-generic-button>\n }\n }\n \n }\n }\n\n </div>\n\n </div>\n\n <p class=\"c-header__text u-text\" *ngIf=\"getHeaderText()\">\n {{ getHeaderText() }}\n </p>\n\n @if (\n headerService.isElementVisible(HeaderElementType.CUSTOM_TEMPLATE) && \n headerService.getCustomTemplate()()\n ) {\n <ng-container [ngTemplateOutlet]=\"headerService.getCustomTemplate()()\"></ng-container>\n }\n </div>\n } @else {\n @if(\n headerService.isElementVisible(HeaderElementType.CUSTOM_TEMPLATE) && \n headerService.getCustomTemplate()()\n ) {\n <ng-container [ngTemplateOutlet]=\"headerService.getCustomTemplate()()\"></ng-container>\n }\n }\n}", styles: [":root{--header-bg: #ffffff;--header-text: #333;--header-shadow: rgba(0, 0, 0, .1);--logout-btn-color: #e74c3c;--logout-btn-hover: #c0392b;--theme-btn-color: #666;--theme-btn-hover: #007bff}.dark-mode{--header-bg: #1a1a1a;--header-text: #e0e0e0;--header-shadow: rgba(255, 255, 255, .1);--logout-btn-color: #ff6b6b;--logout-btn-hover: #ff8787;--theme-btn-color: #bbb;--theme-btn-hover: #4da8ff}.header{background-color:var(--header-bg);box-shadow:0 2px 4px var(--header-shadow);padding:15px 20px;display:flex;justify-content:space-between;align-items:center}.header .user-info{font-weight:500;color:var(--header-text)}.header .header-actions{display:flex;align-items:center;gap:15px}.header .theme-toggle-btn{background:none;border:none;color:var(--theme-btn-color);font-size:16px;cursor:pointer;display:flex;align-items:center}.header .theme-toggle-btn:hover{color:var(--theme-btn-hover)}.header .logout-btn{background:none;border:none;color:var(--logout-btn-color);font-size:16px;cursor:pointer;display:flex;align-items:center}.header .logout-btn i{margin-right:5px}.header .logout-btn:hover{color:var(--logout-btn-hover)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "component", type: GenericButtonComponent, selector: "core-generic-button", inputs: ["config", "data"], outputs: ["buttonClick"] }, { kind: "component", type: GenericSwitchComponent, selector: "core-generic-switch", inputs: ["options", "selectedValue", "ariaLabel"], outputs: ["valueChange"] }] });
|
|
14671
14704
|
}
|
|
14672
14705
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: HeaderComponent, decorators: [{
|
|
14673
14706
|
type: Component,
|
|
14674
14707
|
args: [{ selector: 'core-header', standalone: true, imports: [
|
|
14675
14708
|
CommonModule,
|
|
14676
14709
|
TranslateModule,
|
|
14677
|
-
GenericButtonComponent
|
|
14678
|
-
|
|
14710
|
+
GenericButtonComponent,
|
|
14711
|
+
GenericSwitchComponent
|
|
14712
|
+
], hostDirectives: [CoreHostDirective], template: "@if (headerService.getIsVisible()()) {\n @if(!headerService.getHeaderOutside()()) {\n <div class=\"c-header\">\n <div class=\"c-header__row\">\n\n <div class=\"c-header__group\">\n\n <h2 class=\"c-header__heading u-heading\">{{ getHeaderTitle() }}</h2>\n\n </div>\n\n <div class=\"c-header__group u-flex\">\n\n @for (element of headerService.getOrderedElements(); track element.type) {\n @if (headerService.isElementVisible(element.type)) {\n \n @switch (element.type) {\n @case (HeaderElementType.GLOBAL_ACTIONS) {\n @for (globalAction of headerService.getGlobalActions()(); track globalAction.label || $index) {\n @if (hasPermission(globalAction)) {\n @if (globalAction.isSwitch && globalAction.switchOptions) {\n <core-generic-switch\n [options]=\"globalAction.switchOptions\"\n [selectedValue]=\"globalAction.switchSelectedValue\"\n [ariaLabel]=\"globalAction.switchAriaLabel || globalAction.label || 'Switch options'\"\n (valueChange)=\"onGlobalSwitchChange($event, globalAction)\">\n </core-generic-switch>\n } @else {\n <core-generic-button \n [config]=\"getGlobalActionButtonConfig(globalAction)\"\n (buttonClick)=\"onGlobalButtonClick($event, globalAction)\">\n </core-generic-button>\n }\n }\n }\n }\n \n @case (HeaderElementType.CUSTOM_ACTIONS) {\n @for (customAction of headerService.getCustomActions()(); track customAction.id) {\n @if (isCustomActionVisible(customAction)) {\n <core-generic-button \n [config]=\"getCustomActionButtonConfig(customAction)\"\n (buttonClick)=\"onCustomButtonClick($event, customAction)\">\n </core-generic-button>\n }\n }\n }\n \n @case (HeaderElementType.FILTER) {\n <core-generic-button \n [config]=\"getFilterButtonConfig()\"\n (buttonClick)=\"onFilterButtonClick()\">\n </core-generic-button>\n }\n \n @case (HeaderElementType.CREATE) {\n <core-generic-button \n [config]=\"getCreateButtonConfig()\"\n (buttonClick)=\"onCreateButtonClick()\">\n </core-generic-button>\n }\n }\n \n }\n }\n\n </div>\n\n </div>\n\n <p class=\"c-header__text u-text\" *ngIf=\"getHeaderText()\">\n {{ getHeaderText() }}\n </p>\n\n @if (\n headerService.isElementVisible(HeaderElementType.CUSTOM_TEMPLATE) && \n headerService.getCustomTemplate()()\n ) {\n <ng-container [ngTemplateOutlet]=\"headerService.getCustomTemplate()()\"></ng-container>\n }\n </div>\n } @else {\n @if(\n headerService.isElementVisible(HeaderElementType.CUSTOM_TEMPLATE) && \n headerService.getCustomTemplate()()\n ) {\n <ng-container [ngTemplateOutlet]=\"headerService.getCustomTemplate()()\"></ng-container>\n }\n }\n}", styles: [":root{--header-bg: #ffffff;--header-text: #333;--header-shadow: rgba(0, 0, 0, .1);--logout-btn-color: #e74c3c;--logout-btn-hover: #c0392b;--theme-btn-color: #666;--theme-btn-hover: #007bff}.dark-mode{--header-bg: #1a1a1a;--header-text: #e0e0e0;--header-shadow: rgba(255, 255, 255, .1);--logout-btn-color: #ff6b6b;--logout-btn-hover: #ff8787;--theme-btn-color: #bbb;--theme-btn-hover: #4da8ff}.header{background-color:var(--header-bg);box-shadow:0 2px 4px var(--header-shadow);padding:15px 20px;display:flex;justify-content:space-between;align-items:center}.header .user-info{font-weight:500;color:var(--header-text)}.header .header-actions{display:flex;align-items:center;gap:15px}.header .theme-toggle-btn{background:none;border:none;color:var(--theme-btn-color);font-size:16px;cursor:pointer;display:flex;align-items:center}.header .theme-toggle-btn:hover{color:var(--theme-btn-hover)}.header .logout-btn{background:none;border:none;color:var(--logout-btn-color);font-size:16px;cursor:pointer;display:flex;align-items:center}.header .logout-btn i{margin-right:5px}.header .logout-btn:hover{color:var(--logout-btn-hover)}\n"] }]
|
|
14679
14713
|
}], ctorParameters: () => [] });
|
|
14680
14714
|
|
|
14681
14715
|
var PermissionsActions;
|
|
@@ -14752,11 +14786,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImpor
|
|
|
14752
14786
|
// Este archivo es generado automáticamente por scripts/update-version.js
|
|
14753
14787
|
// No edites manualmente este archivo
|
|
14754
14788
|
const VERSION = {
|
|
14755
|
-
full: '2.14.
|
|
14789
|
+
full: '2.14.2',
|
|
14756
14790
|
major: 2,
|
|
14757
14791
|
minor: 14,
|
|
14758
|
-
patch:
|
|
14759
|
-
timestamp: '2025-10-02T13:
|
|
14792
|
+
patch: 2,
|
|
14793
|
+
timestamp: '2025-10-02T13:40:33.026Z',
|
|
14760
14794
|
buildDate: '2/10/2025'
|
|
14761
14795
|
};
|
|
14762
14796
|
|
|
@@ -17548,28 +17582,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImpor
|
|
|
17548
17582
|
args: [{ selector: 'core-generic-gallery', standalone: true, imports: [CommonModule, GenericSkeletonComponent], providers: [], template: "<div [class]=\"containerClasses()\" \n [ngStyle]=\"containerStyles()\">\n \n @if (finalConfig().layoutType === 'main-left') {\n @if (mainImage()) {\n <div class=\"c-gallery-grid__img\" \n [class.c-gallery-grid__img--loading]=\"isImageLoading(mainImage()!, 0)\"\n [class.c-gallery-grid__img--error]=\"hasImageError(mainImage()!, 0)\">\n \n @if (isImageLoading(mainImage()!, 0)) {\n <div class=\"c-gallery-grid__skeleton\">\n <core-generic-skeleton \n [type]=\"SkeletonType.IMAGE\"\n width=\"100%\"\n height=\"100%\"\n [animation]=\"SkeletonAnimation.SHIMMER\"\n [ariaLabel]=\"'Loading image: ' + (mainImage()!.alt || 'Main image')\">\n </core-generic-skeleton>\n </div>\n }\n \n @if (!isImageLoading(mainImage()!, 0) && !hasImageError(mainImage()!, 0)) {\n <img\n [src]=\"mainImage()!.src\"\n [alt]=\"mainImage()!.alt || ''\"\n [title]=\"mainImage()!.title || ''\"\n [loading]=\"getImageLoading(true)\"\n (click)=\"onImageClick(mainImage()!, 0)\">\n }\n \n @if (isImageLoading(mainImage()!, 0)) {\n <img \n [src]=\"mainImage()!.src\"\n [alt]=\"mainImage()!.alt || ''\"\n style=\"display: none;\"\n (load)=\"onImageLoad(mainImage()!, 0)\"\n (error)=\"onImageError(mainImage()!, 0)\">\n }\n \n @if (hasImageError(mainImage()!, 0)) {\n <div class=\"c-gallery-grid__error\">\n <div class=\"c-gallery-grid__error-content\">\n <span class=\"c-gallery-grid__error-icon\">\uD83D\uDCF7</span>\n <span class=\"c-gallery-grid__error-text\">Error al cargar imagen</span>\n </div>\n </div>\n }\n </div>\n }\n \n @if (thumbnailImages().length > 0) {\n <div class=\"c-gallery-grid__imgs-xs\">\n @for (image of thumbnailImages(); track image.id || $index; let i = $index) {\n <div class=\"c-gallery-grid__img\" \n [class.c-gallery-grid__img--loading]=\"isImageLoading(image, i + 1)\"\n [class.c-gallery-grid__img--error]=\"hasImageError(image, i + 1)\">\n \n @if (isImageLoading(image, i + 1)) {\n <div class=\"c-gallery-grid__skeleton\">\n <core-generic-skeleton \n [type]=\"SkeletonType.IMAGE\"\n width=\"100%\"\n height=\"100%\"\n [animation]=\"SkeletonAnimation.SHIMMER\"\n [ariaLabel]=\"'Loading thumbnail: ' + (image.alt || 'Thumbnail')\">\n </core-generic-skeleton>\n </div>\n }\n \n @if (!isImageLoading(image, i + 1) && !hasImageError(image, i + 1)) {\n <img\n [src]=\"image.thumbnail || image.src\"\n [alt]=\"image.alt || ''\"\n [title]=\"image.title || ''\"\n [loading]=\"getImageLoading(false)\"\n (click)=\"onImageClick(image, i + 1)\">\n }\n \n @if (isImageLoading(image, i + 1)) {\n <img \n [src]=\"image.thumbnail || image.src\"\n [alt]=\"image.alt || ''\"\n style=\"display: none;\"\n (load)=\"onImageLoad(image, i + 1)\"\n (error)=\"onImageError(image, i + 1)\">\n }\n \n @if (hasImageError(image, i + 1)) {\n <div class=\"c-gallery-grid__error\">\n <div class=\"c-gallery-grid__error-content\">\n <span class=\"c-gallery-grid__error-icon\">\uD83D\uDCF7</span>\n <span class=\"c-gallery-grid__error-text\">Error</span>\n </div>\n </div>\n }\n </div>\n }\n </div>\n }\n }\n \n @if (finalConfig().layoutType === 'main-right') {\n @if (thumbnailImages().length > 0) {\n <div class=\"c-gallery-grid__imgs-xs\">\n @for (image of thumbnailImages(); track image.id || $index; let i = $index) {\n <div class=\"c-gallery-grid__img\" \n [class.c-gallery-grid__img--loading]=\"isImageLoading(image, i + 1)\"\n [class.c-gallery-grid__img--error]=\"hasImageError(image, i + 1)\">\n \n @if (isImageLoading(image, i + 1)) {\n <div class=\"c-gallery-grid__skeleton\">\n <core-generic-skeleton \n [type]=\"SkeletonType.IMAGE\"\n width=\"100%\"\n height=\"100%\"\n [animation]=\"SkeletonAnimation.SHIMMER\"\n [ariaLabel]=\"'Loading thumbnail: ' + (image.alt || 'Thumbnail')\">\n </core-generic-skeleton>\n </div>\n }\n \n @if (!isImageLoading(image, i + 1) && !hasImageError(image, i + 1)) {\n <img\n [src]=\"image.thumbnail || image.src\"\n [alt]=\"image.alt || ''\"\n [title]=\"image.title || ''\"\n [loading]=\"getImageLoading(false)\"\n (click)=\"onImageClick(image, i + 1)\">\n }\n \n @if (isImageLoading(image, i + 1)) {\n <img \n [src]=\"image.thumbnail || image.src\"\n [alt]=\"image.alt || ''\"\n style=\"display: none;\"\n (load)=\"onImageLoad(image, i + 1)\"\n (error)=\"onImageError(image, i + 1)\">\n }\n \n @if (hasImageError(image, i + 1)) {\n <div class=\"c-gallery-grid__error\">\n <div class=\"c-gallery-grid__error-content\">\n <span class=\"c-gallery-grid__error-icon\">\uD83D\uDCF7</span>\n <span class=\"c-gallery-grid__error-text\">Error</span>\n </div>\n </div>\n }\n </div>\n }\n </div>\n }\n \n @if (mainImage()) {\n <div class=\"c-gallery-grid__img\" \n [class.c-gallery-grid__img--loading]=\"isImageLoading(mainImage()!, 0)\"\n [class.c-gallery-grid__img--error]=\"hasImageError(mainImage()!, 0)\">\n \n @if (isImageLoading(mainImage()!, 0)) {\n <div class=\"c-gallery-grid__skeleton\">\n <core-generic-skeleton \n [type]=\"SkeletonType.IMAGE\"\n width=\"100%\"\n height=\"100%\"\n [animation]=\"SkeletonAnimation.SHIMMER\"\n [ariaLabel]=\"'Loading image: ' + (mainImage()!.alt || 'Main image')\">\n </core-generic-skeleton>\n </div>\n }\n \n @if (!isImageLoading(mainImage()!, 0) && !hasImageError(mainImage()!, 0)) {\n <img\n [src]=\"mainImage()!.src\"\n [alt]=\"mainImage()!.alt || ''\"\n [title]=\"mainImage()!.title || ''\"\n [loading]=\"getImageLoading(true)\"\n (click)=\"onImageClick(mainImage()!, 0)\">\n }\n \n @if (isImageLoading(mainImage()!, 0)) {\n <img \n [src]=\"mainImage()!.src\"\n [alt]=\"mainImage()!.alt || ''\"\n style=\"display: none;\"\n (load)=\"onImageLoad(mainImage()!, 0)\"\n (error)=\"onImageError(mainImage()!, 0)\">\n }\n \n @if (hasImageError(mainImage()!, 0)) {\n <div class=\"c-gallery-grid__error\">\n <div class=\"c-gallery-grid__error-content\">\n <span class=\"c-gallery-grid__error-icon\">\uD83D\uDCF7</span>\n <span class=\"c-gallery-grid__error-text\">Error al cargar imagen</span>\n </div>\n </div>\n }\n </div>\n }\n }\n \n @if (finalConfig().layoutType === 'main-top') {\n @if (mainImage()) {\n <div class=\"c-gallery-grid__img\" \n [class.c-gallery-grid__img--loading]=\"isImageLoading(mainImage()!, 0)\"\n [class.c-gallery-grid__img--error]=\"hasImageError(mainImage()!, 0)\">\n \n @if (isImageLoading(mainImage()!, 0)) {\n <div class=\"c-gallery-grid__skeleton\">\n <core-generic-skeleton \n [type]=\"SkeletonType.IMAGE\"\n width=\"100%\"\n height=\"100%\"\n [animation]=\"SkeletonAnimation.SHIMMER\"\n [ariaLabel]=\"'Loading image: ' + (mainImage()!.alt || 'Main image')\">\n </core-generic-skeleton>\n </div>\n }\n \n @if (!isImageLoading(mainImage()!, 0) && !hasImageError(mainImage()!, 0)) {\n <img\n [src]=\"mainImage()!.src\"\n [alt]=\"mainImage()!.alt || ''\"\n [title]=\"mainImage()!.title || ''\"\n [loading]=\"getImageLoading(true)\"\n (click)=\"onImageClick(mainImage()!, 0)\">\n }\n \n @if (isImageLoading(mainImage()!, 0)) {\n <img \n [src]=\"mainImage()!.src\"\n [alt]=\"mainImage()!.alt || ''\"\n style=\"display: none;\"\n (load)=\"onImageLoad(mainImage()!, 0)\"\n (error)=\"onImageError(mainImage()!, 0)\">\n }\n \n @if (hasImageError(mainImage()!, 0)) {\n <div class=\"c-gallery-grid__error\">\n <div class=\"c-gallery-grid__error-content\">\n <span class=\"c-gallery-grid__error-icon\">\uD83D\uDCF7</span>\n <span class=\"c-gallery-grid__error-text\">Error al cargar imagen</span>\n </div>\n </div>\n }\n </div>\n }\n \n @if (thumbnailImages().length > 0) {\n <div class=\"c-gallery-grid__imgs-xs\">\n @for (image of thumbnailImages(); track image.id || $index; let i = $index) {\n <div class=\"c-gallery-grid__img\" \n [class.c-gallery-grid__img--loading]=\"isImageLoading(image, i + 1)\"\n [class.c-gallery-grid__img--error]=\"hasImageError(image, i + 1)\">\n \n @if (isImageLoading(image, i + 1)) {\n <div class=\"c-gallery-grid__skeleton\">\n <core-generic-skeleton \n [type]=\"SkeletonType.IMAGE\"\n width=\"100%\"\n height=\"100%\"\n [animation]=\"SkeletonAnimation.SHIMMER\"\n [ariaLabel]=\"'Loading thumbnail: ' + (image.alt || 'Thumbnail')\">\n </core-generic-skeleton>\n </div>\n }\n \n @if (!isImageLoading(image, i + 1) && !hasImageError(image, i + 1)) {\n <img\n [src]=\"image.thumbnail || image.src\"\n [alt]=\"image.alt || ''\"\n [title]=\"image.title || ''\"\n [loading]=\"getImageLoading(false)\"\n (click)=\"onImageClick(image, i + 1)\">\n }\n \n @if (isImageLoading(image, i + 1)) {\n <img \n [src]=\"image.thumbnail || image.src\"\n [alt]=\"image.alt || ''\"\n style=\"display: none;\"\n (load)=\"onImageLoad(image, i + 1)\"\n (error)=\"onImageError(image, i + 1)\">\n }\n \n @if (hasImageError(image, i + 1)) {\n <div class=\"c-gallery-grid__error\">\n <div class=\"c-gallery-grid__error-content\">\n <span class=\"c-gallery-grid__error-icon\">\uD83D\uDCF7</span>\n <span class=\"c-gallery-grid__error-text\">Error</span>\n </div>\n </div>\n }\n </div>\n }\n </div>\n }\n }\n\n @if (finalConfig().layoutType === 'single') {\n @if (mainImage()) {\n <div class=\"c-gallery-grid__img\" \n [class.c-gallery-grid__img--loading]=\"isImageLoading(mainImage()!, 0)\"\n [class.c-gallery-grid__img--error]=\"hasImageError(mainImage()!, 0)\">\n \n @if (isImageLoading(mainImage()!, 0)) {\n <div class=\"c-gallery-grid__skeleton\">\n <core-generic-skeleton \n [type]=\"SkeletonType.IMAGE\"\n width=\"100%\"\n height=\"100%\"\n [animation]=\"SkeletonAnimation.SHIMMER\"\n [ariaLabel]=\"'Loading image: ' + (mainImage()!.alt || 'Single image')\">\n </core-generic-skeleton>\n </div>\n }\n \n @if (!isImageLoading(mainImage()!, 0) && !hasImageError(mainImage()!, 0)) {\n <img\n [src]=\"mainImage()!.src\"\n [alt]=\"mainImage()!.alt || ''\"\n [title]=\"mainImage()!.title || ''\"\n [loading]=\"getImageLoading(true)\"\n (click)=\"onImageClick(mainImage()!, 0)\">\n }\n \n @if (isImageLoading(mainImage()!, 0)) {\n <img \n [src]=\"mainImage()!.src\"\n [alt]=\"mainImage()!.alt || ''\"\n style=\"display: none;\"\n (load)=\"onImageLoad(mainImage()!, 0)\"\n (error)=\"onImageError(mainImage()!, 0)\">\n }\n \n @if (hasImageError(mainImage()!, 0)) {\n <div class=\"c-gallery-grid__error\">\n <div class=\"c-gallery-grid__error-content\">\n <span class=\"c-gallery-grid__error-icon\">\uD83D\uDCF7</span>\n <span class=\"c-gallery-grid__error-text\">Error al cargar imagen</span>\n </div>\n </div>\n }\n </div>\n }\n }\n</div>\n" }]
|
|
17549
17583
|
}], ctorParameters: () => [] });
|
|
17550
17584
|
|
|
17551
|
-
class GenericSwitchComponent {
|
|
17552
|
-
options = input.required();
|
|
17553
|
-
selectedValue = input();
|
|
17554
|
-
ariaLabel = input('Switch options');
|
|
17555
|
-
valueChange = output();
|
|
17556
|
-
isSelected(value) {
|
|
17557
|
-
return this.selectedValue() === value;
|
|
17558
|
-
}
|
|
17559
|
-
onOptionClick(option) {
|
|
17560
|
-
if (option.disabled || this.isSelected(option.value)) {
|
|
17561
|
-
return;
|
|
17562
|
-
}
|
|
17563
|
-
this.valueChange.emit(option.value);
|
|
17564
|
-
}
|
|
17565
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: GenericSwitchComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
17566
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: GenericSwitchComponent, isStandalone: true, selector: "core-generic-switch", inputs: { options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: true, transformFunction: null }, selectedValue: { classPropertyName: "selectedValue", publicName: "selectedValue", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { valueChange: "valueChange" }, ngImport: i0, template: "<button \n class=\"c-switch\"\n [attr.aria-label]=\"ariaLabel()\"\n role=\"group\">\n @for (option of options(); track option.value) {\n <span \n class=\"c-icon-btn\"\n [class]=\"option.icon || '' | coreIconCompat\"\n [class.is-active]=\"isSelected(option.value)\"\n [class.is-disabled]=\"option.disabled\"\n [attr.title]=\"option.tooltip || option.label || '' | translate\"\n [attr.aria-pressed]=\"isSelected(option.value)\"\n [attr.aria-disabled]=\"option.disabled\"\n [attr.data-value]=\"option.value\"\n (click)=\"onOptionClick(option)\">\n @if (option.label && !option.icon) {\n {{ option.label | translate }}\n }\n </span>\n }\n</button>\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "pipe", type: IconCompatPipe, name: "coreIconCompat" }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }] });
|
|
17567
|
-
}
|
|
17568
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: GenericSwitchComponent, decorators: [{
|
|
17569
|
-
type: Component,
|
|
17570
|
-
args: [{ selector: 'core-generic-switch', standalone: true, imports: [CommonModule, IconCompatPipe, TranslateModule], template: "<button \n class=\"c-switch\"\n [attr.aria-label]=\"ariaLabel()\"\n role=\"group\">\n @for (option of options(); track option.value) {\n <span \n class=\"c-icon-btn\"\n [class]=\"option.icon || '' | coreIconCompat\"\n [class.is-active]=\"isSelected(option.value)\"\n [class.is-disabled]=\"option.disabled\"\n [attr.title]=\"option.tooltip || option.label || '' | translate\"\n [attr.aria-pressed]=\"isSelected(option.value)\"\n [attr.aria-disabled]=\"option.disabled\"\n [attr.data-value]=\"option.value\"\n (click)=\"onOptionClick(option)\">\n @if (option.label && !option.icon) {\n {{ option.label | translate }}\n }\n </span>\n }\n</button>\n" }]
|
|
17571
|
-
}] });
|
|
17572
|
-
|
|
17573
17585
|
class CacheBustingInterceptor {
|
|
17574
17586
|
intercept(req, next) {
|
|
17575
17587
|
if (req.url.includes('/assets/i18n/') && req.url.endsWith('.json')) {
|