@abp/ng.components 10.0.0-rc.1 → 10.0.0-rc.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/extensible/index.d.ts
CHANGED
|
@@ -157,8 +157,8 @@ declare class ExtensibleFormPropService {
|
|
|
157
157
|
#private;
|
|
158
158
|
meridian$: rxjs.Observable<boolean>;
|
|
159
159
|
isRequired(validator: ValidatorFn): boolean;
|
|
160
|
-
getComponent(prop: FormProp): "
|
|
161
|
-
getType(prop: FormProp): "email" | "hidden" | "number" | "
|
|
160
|
+
getComponent(prop: FormProp): "hidden" | "select" | "date" | "time" | "checkbox" | "template" | "multiselect" | "passwordinputgroup" | "typeahead" | "dateTime" | "textarea" | "input";
|
|
161
|
+
getType(prop: FormProp): "email" | "hidden" | "number" | "text" | "checkbox" | "password" | "passwordinputgroup";
|
|
162
162
|
calcAsterisks(validators: ValidatorFn[]): "" | "*";
|
|
163
163
|
static ɵfac: i0.ɵɵFactoryDeclaration<ExtensibleFormPropService, never>;
|
|
164
164
|
static ɵprov: i0.ɵɵInjectableDeclaration<ExtensibleFormPropService>;
|
|
@@ -1038,12 +1038,7 @@ class ExtensibleTableComponent {
|
|
|
1038
1038
|
.pipe(debounceTime$1(100), distinctUntilChanged$1())
|
|
1039
1039
|
.subscribe(() => this.triggerLoadMore());
|
|
1040
1040
|
this.columnWidths = computed(() => {
|
|
1041
|
-
|
|
1042
|
-
const widths = [actionsColumn];
|
|
1043
|
-
this.propList.forEach(({ value: prop }) => {
|
|
1044
|
-
widths.push(prop.columnWidth);
|
|
1045
|
-
});
|
|
1046
|
-
return widths;
|
|
1041
|
+
return this.propList.toArray().map(prop => prop.columnWidth);
|
|
1047
1042
|
});
|
|
1048
1043
|
const extensions = this.#injector.get(ExtensionsService);
|
|
1049
1044
|
const name = this.#injector.get(EXTENSIONS_IDENTIFIER);
|
|
@@ -1172,7 +1167,7 @@ class ExtensibleTableComponent {
|
|
|
1172
1167
|
this.loadMoreSubscription.unsubscribe();
|
|
1173
1168
|
}
|
|
1174
1169
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.7", ngImport: i0, type: ExtensibleTableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1175
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.7", type: ExtensibleTableComponent, isStandalone: true, selector: "abp-extensible-table", inputs: { actionsText: "actionsText", data: "data", list: "list", recordsTotal: "recordsTotal", actionsColumnWidth: "actionsColumnWidth", actionsTemplate: "actionsTemplate", selectable: "selectable", selectionType: "selectionType", selected: "selected", infiniteScroll: "infiniteScroll", isLoading: "isLoading", scrollThreshold: "scrollThreshold", tableHeight: "tableHeight" }, outputs: { tableActivate: "tableActivate", selectionChange: "selectionChange", loadMore: "loadMore" }, exportAs: ["abpExtensibleTable"], usesOnChanges: true, ngImport: i0, template: "@if (isBrowser) {\r\n <ngx-datatable\r\n default\r\n [rows]=\"data\"\r\n [count]=\"recordsTotal\"\r\n [list]=\"list\"\r\n [selectionType]=\"selectable ? _selectionType : undefined\"\r\n (activate)=\"tableActivate.emit($event)\"\r\n (select)=\"onSelect($event)\"\r\n [selected]=\"selected\"\r\n (scroll)=\"onScroll($event)\"\r\n [scrollbarV]=\"infiniteScroll\"\r\n [style.height]=\"getTableHeight()\"\r\n [loadingIndicator]=\"infiniteScroll && isLoading\"\r\n [footerHeight]=\"infiniteScroll ? false : 50\"\r\n>\r\n@if(selectable) {\r\n <ngx-datatable-column [width]=\"50\" [sortable]=\"false\" [canAutoResize]=\"false\" [draggable]=\"false\" [resizeable]=\"false\">\r\n\r\n <ng-template ngx-datatable-header-template let-value=\"value\" let-allRowsSelected=\"allRowsSelected\"\r\n let-selectFn=\"selectFn\">\r\n @if (_selectionType !== 'single') {\r\n <div class=\"form-check\">\r\n <input class=\"form-check-input table-check\" type=\"checkbox\" [checked]=\"allRowsSelected\"\r\n (change)=\"selectFn(!allRowsSelected)\" />\r\n </div>\r\n }\r\n </ng-template>\r\n\r\n <ng-template ngx-datatable-cell-template let-value=\"value\" let-row=\"row\" let-isSelected=\"isSelected\"\r\n let-onCheckboxChangeFn=\"onCheckboxChangeFn\">\r\n @if(_selectionType === 'single') {\r\n <div class=\"h-100 form-check form-check-sm form-check-custom form-check-solid\">\r\n <input class=\"form-check-input\" type=\"radio\" [checked]=\"isSelected\" (change)=\"onCheckboxChangeFn($event)\" />\r\n </div>\r\n }\r\n @if (_selectionType !== 'single') {\r\n <div class=\"h-100 form-check form-check-sm form-check-custom form-check-solid\">\r\n <input class=\"form-check-input\" type=\"checkbox\" [checked]=\"isSelected\" (change)=\"onCheckboxChangeFn($event)\" />\r\n </div>\r\n }\r\n </ng-template>\r\n\r\n </ngx-datatable-column>\r\n }\r\n @if (actionsTemplate || (actionList.length && hasAtLeastOnePermittedAction)) {\r\n <ngx-datatable-column\r\n [name]=\"actionsText | abpLocalization\"\r\n [maxWidth]=\"columnWidths[0] ?? undefined\"\r\n [width]=\"columnWidths[0] ?? 200\"\r\n [canAutoResize]=\"!columnWidths[0]\"\r\n [sortable]=\"false\"\r\n >\r\n <ng-template let-row=\"row\" let-i=\"rowIndex\" ngx-datatable-cell-template>\r\n <ng-container\r\n *ngTemplateOutlet=\"actionsTemplate || gridActions; context: { $implicit: row, index: i }\"\r\n ></ng-container>\r\n <ng-template #gridActions>\r\n @if (isVisibleActions(row)) {\r\n <abp-grid-actions [index]=\"i\" [record]=\"row\" text=\"AbpUi::Actions\"></abp-grid-actions>\r\n }\r\n </ng-template>\r\n </ng-template>\r\n </ngx-datatable-column>\r\n }\r\n @for (prop of propList; track prop.name; let i = $index) {\r\n <ngx-datatable-column\r\n *abpVisible=\"prop.columnVisible(getInjected)\"\r\n [width]=\"columnWidths[i + 1] ?? 200\"\r\n [canAutoResize]=\"!columnWidths[i + 1]\"\r\n [name]=\"(prop.isExtra ? '::' + prop.displayName : prop.displayName) | abpLocalization\"\r\n [prop]=\"prop.name\"\r\n [sortable]=\"prop.sortable\"\r\n >\r\n <ng-template ngx-datatable-header-template let-column=\"column\" let-sortFn=\"sortFn\">\r\n @if (prop.tooltip) {\r\n <span\r\n [ngbTooltip]=\"prop.tooltip.text | abpLocalization\"\r\n [placement]=\"prop.tooltip.placement || 'auto'\"\r\n container=\"body\"\r\n [class.pointer]=\"prop.sortable\"\r\n (click)=\"prop.sortable && sortFn(column)\"\r\n >\r\n {{ column.name }} <i class=\"fa fa-info-circle\" aria-hidden=\"true\"></i>\r\n </span>\r\n } @else {\r\n <span\r\n [class.pointer]=\"prop.sortable\"\r\n (click)=\"prop.sortable && sortFn(column)\"\r\n >\r\n {{ column.name }}\r\n </span>\r\n }\r\n </ng-template>\r\n <ng-template let-row=\"row\" let-i=\"index\" ngx-datatable-cell-template>\r\n <ng-container *abpPermission=\"prop.permission; runChangeDetection: false\">\r\n <ng-container *abpVisible=\"row['_' + prop.name]?.visible\">\r\n @if (!row['_' + prop.name].component) {\r\n @if (prop.type === 'datetime' || prop.type === 'date' || prop.type === 'time') {\r\n <div\r\n [innerHTML]=\"\r\n !prop.isExtra\r\n ? (row['_' + prop.name]?.value | async | abpUtcToLocal:prop.type)\r\n : ('::' + (row['_' + prop.name]?.value | async | abpUtcToLocal:prop.type) | abpLocalization)\r\n \"\r\n (click)=\"\r\n prop.action && prop.action({ getInjected: getInjected, record: row, index: i })\r\n \"\r\n [ngClass]=\"entityPropTypeClasses[prop.type]\"\r\n [class.pointer]=\"prop.action\"\r\n ></div>\r\n } @else {\r\n <div\r\n [innerHTML]=\"\r\n !prop.isExtra\r\n ? (row['_' + prop.name]?.value | async)\r\n : ('::' + (row['_' + prop.name]?.value | async) | abpLocalization)\r\n \"\r\n (click)=\"\r\n prop.action && prop.action({ getInjected: getInjected, record: row, index: i })\r\n \"\r\n [ngClass]=\"entityPropTypeClasses[prop.type]\"\r\n [class.pointer]=\"prop.action\"\r\n ></div>\r\n }\r\n } @else {\r\n <ng-container\r\n *ngComponentOutlet=\"\r\n row['_' + prop.name].component;\r\n injector: row['_' + prop.name].injector\r\n \"\r\n ></ng-container>\r\n }\r\n </ng-container>\r\n </ng-container>\r\n </ng-template>\r\n </ngx-datatable-column>\r\n }\r\n</ngx-datatable>\r\n}\r\n", dependencies: [{ kind: "directive", type: AbpVisibleDirective, selector: "[abpVisible]", inputs: ["abpVisible"] }, { kind: "ngmodule", type: NgxDatatableModule }, { kind: "component", type: i1$1.DatatableComponent, selector: "ngx-datatable", inputs: ["targetMarkerTemplate", "rows", "groupRowsBy", "groupedRows", "columns", "selected", "scrollbarV", "scrollbarVDynamic", "scrollbarH", "rowHeight", "columnMode", "headerHeight", "footerHeight", "externalPaging", "externalSorting", "limit", "count", "offset", "loadingIndicator", "ghostLoadingIndicator", "selectionType", "reorderable", "swapColumns", "sortType", "sorts", "cssClasses", "messages", "rowClass", "selectCheck", "displayCheck", "groupExpansionDefault", "trackByProp", "selectAllRowsOnPage", "virtualization", "treeFromRelation", "treeToRelation", "summaryRow", "summaryHeight", "summaryPosition", "disableRowCheck", "rowDraggable", "enableClearingSortState", "rowIdentity"], outputs: ["scroll", "activate", "select", "sort", "page", "reorder", "resize", "tableContextmenu", "treeAction", "rowDragEvents"] }, { kind: "directive", type: i1$1.DataTableColumnDirective, selector: "ngx-datatable-column", inputs: ["name", "prop", "bindAsUnsafeHtml", "frozenLeft", "frozenRight", "flexGrow", "resizeable", "comparator", "pipe", "sortable", "draggable", "canAutoResize", "minWidth", "width", "maxWidth", "checkboxable", "headerCheckboxable", "headerClass", "cellClass", "isTreeColumn", "treeLevelIndent", "summaryFunc", "summaryTemplate", "cellTemplate", "headerTemplate", "treeToggleTemplate", "ghostCellTemplate"] }, { kind: "directive", type: i1$1.DataTableColumnHeaderDirective, selector: "[ngx-datatable-header-template]" }, { kind: "directive", type: i1$1.DataTableColumnCellDirective, selector: "[ngx-datatable-cell-template]" }, { kind: "component", type: GridActionsComponent, selector: "abp-grid-actions", inputs: ["icon", "index", "text"], exportAs: ["abpGridActions"] }, { kind: "directive", type: NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "popperOptions", "triggers", "positionTarget", "container", "disableTooltip", "tooltipClass", "tooltipContext", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }, { kind: "directive", type: NgxDatatableDefaultDirective, selector: "ngx-datatable[default]", inputs: ["class"], exportAs: ["ngxDatatableDefault"] }, { kind: "directive", type: NgxDatatableListDirective, selector: "ngx-datatable[list]", inputs: ["list"], exportAs: ["ngxDatatableList"] }, { kind: "directive", type: PermissionDirective, selector: "[abpPermission]", inputs: ["abpPermission", "abpPermissionRunChangeDetection"] }, { kind: "pipe", type: LocalizationPipe, name: "abpLocalization" }, { kind: "pipe", type: UtcToLocalPipe, name: "abpUtcToLocal" }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInputs", "ngComponentOutletInjector", "ngComponentOutletContent", "ngComponentOutletNgModule", "ngComponentOutletNgModuleFactory"], exportAs: ["ngComponentOutlet"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
1170
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.7", type: ExtensibleTableComponent, isStandalone: true, selector: "abp-extensible-table", inputs: { actionsText: "actionsText", data: "data", list: "list", recordsTotal: "recordsTotal", actionsColumnWidth: "actionsColumnWidth", actionsTemplate: "actionsTemplate", selectable: "selectable", selectionType: "selectionType", selected: "selected", infiniteScroll: "infiniteScroll", isLoading: "isLoading", scrollThreshold: "scrollThreshold", tableHeight: "tableHeight" }, outputs: { tableActivate: "tableActivate", selectionChange: "selectionChange", loadMore: "loadMore" }, exportAs: ["abpExtensibleTable"], usesOnChanges: true, ngImport: i0, template: "@if (isBrowser) {\r\n <ngx-datatable\r\n default\r\n [rows]=\"data\"\r\n [count]=\"recordsTotal\"\r\n [list]=\"list\"\r\n [selectionType]=\"selectable ? _selectionType : undefined\"\r\n (activate)=\"tableActivate.emit($event)\"\r\n (select)=\"onSelect($event)\"\r\n [selected]=\"selected\"\r\n (scroll)=\"onScroll($event)\"\r\n [scrollbarV]=\"infiniteScroll\"\r\n [style.height]=\"getTableHeight()\"\r\n [loadingIndicator]=\"infiniteScroll && isLoading\"\r\n [footerHeight]=\"infiniteScroll ? false : 50\"\r\n>\r\n@if(selectable) {\r\n <ngx-datatable-column [width]=\"50\" [sortable]=\"false\" [canAutoResize]=\"false\" [draggable]=\"false\" [resizeable]=\"false\">\r\n\r\n <ng-template ngx-datatable-header-template let-value=\"value\" let-allRowsSelected=\"allRowsSelected\"\r\n let-selectFn=\"selectFn\">\r\n @if (_selectionType !== 'single') {\r\n <div class=\"form-check\">\r\n <input class=\"form-check-input table-check\" type=\"checkbox\" [checked]=\"allRowsSelected\"\r\n (change)=\"selectFn(!allRowsSelected)\" />\r\n </div>\r\n }\r\n </ng-template>\r\n\r\n <ng-template ngx-datatable-cell-template let-value=\"value\" let-row=\"row\" let-isSelected=\"isSelected\"\r\n let-onCheckboxChangeFn=\"onCheckboxChangeFn\">\r\n @if(_selectionType === 'single') {\r\n <div class=\"h-100 form-check form-check-sm form-check-custom form-check-solid\">\r\n <input class=\"form-check-input\" type=\"radio\" [checked]=\"isSelected\" (change)=\"onCheckboxChangeFn($event)\" />\r\n </div>\r\n }\r\n @if (_selectionType !== 'single') {\r\n <div class=\"h-100 form-check form-check-sm form-check-custom form-check-solid\">\r\n <input class=\"form-check-input\" type=\"checkbox\" [checked]=\"isSelected\" (change)=\"onCheckboxChangeFn($event)\" />\r\n </div>\r\n }\r\n </ng-template>\r\n\r\n </ngx-datatable-column>\r\n }\r\n @if (actionsTemplate || (actionList.length && hasAtLeastOnePermittedAction)) {\r\n <ngx-datatable-column\r\n [name]=\"actionsText | abpLocalization\"\r\n [maxWidth]=\"_actionsColumnWidth() ?? undefined\"\r\n [width]=\"_actionsColumnWidth() ?? 200\"\r\n [canAutoResize]=\"!_actionsColumnWidth()\"\r\n [sortable]=\"false\"\r\n >\r\n <ng-template let-row=\"row\" let-i=\"rowIndex\" ngx-datatable-cell-template>\r\n <ng-container\r\n *ngTemplateOutlet=\"actionsTemplate || gridActions; context: { $implicit: row, index: i }\"\r\n ></ng-container>\r\n <ng-template #gridActions>\r\n @if (isVisibleActions(row)) {\r\n <abp-grid-actions [index]=\"i\" [record]=\"row\" text=\"AbpUi::Actions\"></abp-grid-actions>\r\n }\r\n </ng-template>\r\n </ng-template>\r\n </ngx-datatable-column>\r\n }\r\n @for (prop of propList; track prop.name; let i = $index) {\r\n <ngx-datatable-column\r\n *abpVisible=\"prop.columnVisible(getInjected)\"\r\n [width]=\"columnWidths[i] ?? 200\"\r\n [canAutoResize]=\"!columnWidths[i]\"\r\n [name]=\"(prop.isExtra ? '::' + prop.displayName : prop.displayName) | abpLocalization\"\r\n [prop]=\"prop.name\"\r\n [sortable]=\"prop.sortable\"\r\n >\r\n <ng-template ngx-datatable-header-template let-column=\"column\" let-sortFn=\"sortFn\">\r\n @if (prop.tooltip) {\r\n <span\r\n [ngbTooltip]=\"prop.tooltip.text | abpLocalization\"\r\n [placement]=\"prop.tooltip.placement || 'auto'\"\r\n container=\"body\"\r\n [class.pointer]=\"prop.sortable\"\r\n (click)=\"prop.sortable && sortFn(column)\"\r\n >\r\n {{ column.name }} <i class=\"fa fa-info-circle\" aria-hidden=\"true\"></i>\r\n </span>\r\n } @else {\r\n <span\r\n [class.pointer]=\"prop.sortable\"\r\n (click)=\"prop.sortable && sortFn(column)\"\r\n >\r\n {{ column.name }}\r\n </span>\r\n }\r\n </ng-template>\r\n <ng-template let-row=\"row\" let-i=\"index\" ngx-datatable-cell-template>\r\n <ng-container *abpPermission=\"prop.permission; runChangeDetection: false\">\r\n <ng-container *abpVisible=\"row['_' + prop.name]?.visible\">\r\n @if (!row['_' + prop.name].component) {\r\n @if (prop.type === 'datetime' || prop.type === 'date' || prop.type === 'time') {\r\n <div\r\n [innerHTML]=\"\r\n !prop.isExtra\r\n ? (row['_' + prop.name]?.value | async | abpUtcToLocal:prop.type)\r\n : ('::' + (row['_' + prop.name]?.value | async | abpUtcToLocal:prop.type) | abpLocalization)\r\n \"\r\n (click)=\"\r\n prop.action && prop.action({ getInjected: getInjected, record: row, index: i })\r\n \"\r\n [ngClass]=\"entityPropTypeClasses[prop.type]\"\r\n [class.pointer]=\"prop.action\"\r\n ></div>\r\n } @else {\r\n <div\r\n [innerHTML]=\"\r\n !prop.isExtra\r\n ? (row['_' + prop.name]?.value | async)\r\n : ('::' + (row['_' + prop.name]?.value | async) | abpLocalization)\r\n \"\r\n (click)=\"\r\n prop.action && prop.action({ getInjected: getInjected, record: row, index: i })\r\n \"\r\n [ngClass]=\"entityPropTypeClasses[prop.type]\"\r\n [class.pointer]=\"prop.action\"\r\n ></div>\r\n }\r\n } @else {\r\n <ng-container\r\n *ngComponentOutlet=\"\r\n row['_' + prop.name].component;\r\n injector: row['_' + prop.name].injector\r\n \"\r\n ></ng-container>\r\n }\r\n </ng-container>\r\n </ng-container>\r\n </ng-template>\r\n </ngx-datatable-column>\r\n }\r\n</ngx-datatable>\r\n}\r\n", dependencies: [{ kind: "directive", type: AbpVisibleDirective, selector: "[abpVisible]", inputs: ["abpVisible"] }, { kind: "ngmodule", type: NgxDatatableModule }, { kind: "component", type: i1$1.DatatableComponent, selector: "ngx-datatable", inputs: ["targetMarkerTemplate", "rows", "groupRowsBy", "groupedRows", "columns", "selected", "scrollbarV", "scrollbarVDynamic", "scrollbarH", "rowHeight", "columnMode", "headerHeight", "footerHeight", "externalPaging", "externalSorting", "limit", "count", "offset", "loadingIndicator", "ghostLoadingIndicator", "selectionType", "reorderable", "swapColumns", "sortType", "sorts", "cssClasses", "messages", "rowClass", "selectCheck", "displayCheck", "groupExpansionDefault", "trackByProp", "selectAllRowsOnPage", "virtualization", "treeFromRelation", "treeToRelation", "summaryRow", "summaryHeight", "summaryPosition", "disableRowCheck", "rowDraggable", "enableClearingSortState", "rowIdentity"], outputs: ["scroll", "activate", "select", "sort", "page", "reorder", "resize", "tableContextmenu", "treeAction", "rowDragEvents"] }, { kind: "directive", type: i1$1.DataTableColumnDirective, selector: "ngx-datatable-column", inputs: ["name", "prop", "bindAsUnsafeHtml", "frozenLeft", "frozenRight", "flexGrow", "resizeable", "comparator", "pipe", "sortable", "draggable", "canAutoResize", "minWidth", "width", "maxWidth", "checkboxable", "headerCheckboxable", "headerClass", "cellClass", "isTreeColumn", "treeLevelIndent", "summaryFunc", "summaryTemplate", "cellTemplate", "headerTemplate", "treeToggleTemplate", "ghostCellTemplate"] }, { kind: "directive", type: i1$1.DataTableColumnHeaderDirective, selector: "[ngx-datatable-header-template]" }, { kind: "directive", type: i1$1.DataTableColumnCellDirective, selector: "[ngx-datatable-cell-template]" }, { kind: "component", type: GridActionsComponent, selector: "abp-grid-actions", inputs: ["icon", "index", "text"], exportAs: ["abpGridActions"] }, { kind: "directive", type: NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "popperOptions", "triggers", "positionTarget", "container", "disableTooltip", "tooltipClass", "tooltipContext", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }, { kind: "directive", type: NgxDatatableDefaultDirective, selector: "ngx-datatable[default]", inputs: ["class"], exportAs: ["ngxDatatableDefault"] }, { kind: "directive", type: NgxDatatableListDirective, selector: "ngx-datatable[list]", inputs: ["list"], exportAs: ["ngxDatatableList"] }, { kind: "directive", type: PermissionDirective, selector: "[abpPermission]", inputs: ["abpPermission", "abpPermissionRunChangeDetection"] }, { kind: "pipe", type: LocalizationPipe, name: "abpLocalization" }, { kind: "pipe", type: UtcToLocalPipe, name: "abpUtcToLocal" }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInputs", "ngComponentOutletInjector", "ngComponentOutletContent", "ngComponentOutletNgModule", "ngComponentOutletNgModuleFactory"], exportAs: ["ngComponentOutlet"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
1176
1171
|
}
|
|
1177
1172
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.7", ngImport: i0, type: ExtensibleTableComponent, decorators: [{
|
|
1178
1173
|
type: Component,
|
|
@@ -1189,7 +1184,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.7", ngImpor
|
|
|
1189
1184
|
AsyncPipe,
|
|
1190
1185
|
NgTemplateOutlet,
|
|
1191
1186
|
NgComponentOutlet,
|
|
1192
|
-
], changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (isBrowser) {\r\n <ngx-datatable\r\n default\r\n [rows]=\"data\"\r\n [count]=\"recordsTotal\"\r\n [list]=\"list\"\r\n [selectionType]=\"selectable ? _selectionType : undefined\"\r\n (activate)=\"tableActivate.emit($event)\"\r\n (select)=\"onSelect($event)\"\r\n [selected]=\"selected\"\r\n (scroll)=\"onScroll($event)\"\r\n [scrollbarV]=\"infiniteScroll\"\r\n [style.height]=\"getTableHeight()\"\r\n [loadingIndicator]=\"infiniteScroll && isLoading\"\r\n [footerHeight]=\"infiniteScroll ? false : 50\"\r\n>\r\n@if(selectable) {\r\n <ngx-datatable-column [width]=\"50\" [sortable]=\"false\" [canAutoResize]=\"false\" [draggable]=\"false\" [resizeable]=\"false\">\r\n\r\n <ng-template ngx-datatable-header-template let-value=\"value\" let-allRowsSelected=\"allRowsSelected\"\r\n let-selectFn=\"selectFn\">\r\n @if (_selectionType !== 'single') {\r\n <div class=\"form-check\">\r\n <input class=\"form-check-input table-check\" type=\"checkbox\" [checked]=\"allRowsSelected\"\r\n (change)=\"selectFn(!allRowsSelected)\" />\r\n </div>\r\n }\r\n </ng-template>\r\n\r\n <ng-template ngx-datatable-cell-template let-value=\"value\" let-row=\"row\" let-isSelected=\"isSelected\"\r\n let-onCheckboxChangeFn=\"onCheckboxChangeFn\">\r\n @if(_selectionType === 'single') {\r\n <div class=\"h-100 form-check form-check-sm form-check-custom form-check-solid\">\r\n <input class=\"form-check-input\" type=\"radio\" [checked]=\"isSelected\" (change)=\"onCheckboxChangeFn($event)\" />\r\n </div>\r\n }\r\n @if (_selectionType !== 'single') {\r\n <div class=\"h-100 form-check form-check-sm form-check-custom form-check-solid\">\r\n <input class=\"form-check-input\" type=\"checkbox\" [checked]=\"isSelected\" (change)=\"onCheckboxChangeFn($event)\" />\r\n </div>\r\n }\r\n </ng-template>\r\n\r\n </ngx-datatable-column>\r\n }\r\n @if (actionsTemplate || (actionList.length && hasAtLeastOnePermittedAction)) {\r\n <ngx-datatable-column\r\n [name]=\"actionsText | abpLocalization\"\r\n [maxWidth]=\"
|
|
1187
|
+
], changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (isBrowser) {\r\n <ngx-datatable\r\n default\r\n [rows]=\"data\"\r\n [count]=\"recordsTotal\"\r\n [list]=\"list\"\r\n [selectionType]=\"selectable ? _selectionType : undefined\"\r\n (activate)=\"tableActivate.emit($event)\"\r\n (select)=\"onSelect($event)\"\r\n [selected]=\"selected\"\r\n (scroll)=\"onScroll($event)\"\r\n [scrollbarV]=\"infiniteScroll\"\r\n [style.height]=\"getTableHeight()\"\r\n [loadingIndicator]=\"infiniteScroll && isLoading\"\r\n [footerHeight]=\"infiniteScroll ? false : 50\"\r\n>\r\n@if(selectable) {\r\n <ngx-datatable-column [width]=\"50\" [sortable]=\"false\" [canAutoResize]=\"false\" [draggable]=\"false\" [resizeable]=\"false\">\r\n\r\n <ng-template ngx-datatable-header-template let-value=\"value\" let-allRowsSelected=\"allRowsSelected\"\r\n let-selectFn=\"selectFn\">\r\n @if (_selectionType !== 'single') {\r\n <div class=\"form-check\">\r\n <input class=\"form-check-input table-check\" type=\"checkbox\" [checked]=\"allRowsSelected\"\r\n (change)=\"selectFn(!allRowsSelected)\" />\r\n </div>\r\n }\r\n </ng-template>\r\n\r\n <ng-template ngx-datatable-cell-template let-value=\"value\" let-row=\"row\" let-isSelected=\"isSelected\"\r\n let-onCheckboxChangeFn=\"onCheckboxChangeFn\">\r\n @if(_selectionType === 'single') {\r\n <div class=\"h-100 form-check form-check-sm form-check-custom form-check-solid\">\r\n <input class=\"form-check-input\" type=\"radio\" [checked]=\"isSelected\" (change)=\"onCheckboxChangeFn($event)\" />\r\n </div>\r\n }\r\n @if (_selectionType !== 'single') {\r\n <div class=\"h-100 form-check form-check-sm form-check-custom form-check-solid\">\r\n <input class=\"form-check-input\" type=\"checkbox\" [checked]=\"isSelected\" (change)=\"onCheckboxChangeFn($event)\" />\r\n </div>\r\n }\r\n </ng-template>\r\n\r\n </ngx-datatable-column>\r\n }\r\n @if (actionsTemplate || (actionList.length && hasAtLeastOnePermittedAction)) {\r\n <ngx-datatable-column\r\n [name]=\"actionsText | abpLocalization\"\r\n [maxWidth]=\"_actionsColumnWidth() ?? undefined\"\r\n [width]=\"_actionsColumnWidth() ?? 200\"\r\n [canAutoResize]=\"!_actionsColumnWidth()\"\r\n [sortable]=\"false\"\r\n >\r\n <ng-template let-row=\"row\" let-i=\"rowIndex\" ngx-datatable-cell-template>\r\n <ng-container\r\n *ngTemplateOutlet=\"actionsTemplate || gridActions; context: { $implicit: row, index: i }\"\r\n ></ng-container>\r\n <ng-template #gridActions>\r\n @if (isVisibleActions(row)) {\r\n <abp-grid-actions [index]=\"i\" [record]=\"row\" text=\"AbpUi::Actions\"></abp-grid-actions>\r\n }\r\n </ng-template>\r\n </ng-template>\r\n </ngx-datatable-column>\r\n }\r\n @for (prop of propList; track prop.name; let i = $index) {\r\n <ngx-datatable-column\r\n *abpVisible=\"prop.columnVisible(getInjected)\"\r\n [width]=\"columnWidths[i] ?? 200\"\r\n [canAutoResize]=\"!columnWidths[i]\"\r\n [name]=\"(prop.isExtra ? '::' + prop.displayName : prop.displayName) | abpLocalization\"\r\n [prop]=\"prop.name\"\r\n [sortable]=\"prop.sortable\"\r\n >\r\n <ng-template ngx-datatable-header-template let-column=\"column\" let-sortFn=\"sortFn\">\r\n @if (prop.tooltip) {\r\n <span\r\n [ngbTooltip]=\"prop.tooltip.text | abpLocalization\"\r\n [placement]=\"prop.tooltip.placement || 'auto'\"\r\n container=\"body\"\r\n [class.pointer]=\"prop.sortable\"\r\n (click)=\"prop.sortable && sortFn(column)\"\r\n >\r\n {{ column.name }} <i class=\"fa fa-info-circle\" aria-hidden=\"true\"></i>\r\n </span>\r\n } @else {\r\n <span\r\n [class.pointer]=\"prop.sortable\"\r\n (click)=\"prop.sortable && sortFn(column)\"\r\n >\r\n {{ column.name }}\r\n </span>\r\n }\r\n </ng-template>\r\n <ng-template let-row=\"row\" let-i=\"index\" ngx-datatable-cell-template>\r\n <ng-container *abpPermission=\"prop.permission; runChangeDetection: false\">\r\n <ng-container *abpVisible=\"row['_' + prop.name]?.visible\">\r\n @if (!row['_' + prop.name].component) {\r\n @if (prop.type === 'datetime' || prop.type === 'date' || prop.type === 'time') {\r\n <div\r\n [innerHTML]=\"\r\n !prop.isExtra\r\n ? (row['_' + prop.name]?.value | async | abpUtcToLocal:prop.type)\r\n : ('::' + (row['_' + prop.name]?.value | async | abpUtcToLocal:prop.type) | abpLocalization)\r\n \"\r\n (click)=\"\r\n prop.action && prop.action({ getInjected: getInjected, record: row, index: i })\r\n \"\r\n [ngClass]=\"entityPropTypeClasses[prop.type]\"\r\n [class.pointer]=\"prop.action\"\r\n ></div>\r\n } @else {\r\n <div\r\n [innerHTML]=\"\r\n !prop.isExtra\r\n ? (row['_' + prop.name]?.value | async)\r\n : ('::' + (row['_' + prop.name]?.value | async) | abpLocalization)\r\n \"\r\n (click)=\"\r\n prop.action && prop.action({ getInjected: getInjected, record: row, index: i })\r\n \"\r\n [ngClass]=\"entityPropTypeClasses[prop.type]\"\r\n [class.pointer]=\"prop.action\"\r\n ></div>\r\n }\r\n } @else {\r\n <ng-container\r\n *ngComponentOutlet=\"\r\n row['_' + prop.name].component;\r\n injector: row['_' + prop.name].injector\r\n \"\r\n ></ng-container>\r\n }\r\n </ng-container>\r\n </ng-container>\r\n </ng-template>\r\n </ngx-datatable-column>\r\n }\r\n</ngx-datatable>\r\n}\r\n" }]
|
|
1193
1188
|
}], ctorParameters: () => [], propDecorators: { actionsText: [{
|
|
1194
1189
|
type: Input
|
|
1195
1190
|
}], data: [{
|