@stemy/ngx-utils 19.2.6 → 19.2.8
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.
|
@@ -3671,16 +3671,28 @@ class BaseToasterService {
|
|
|
3671
3671
|
};
|
|
3672
3672
|
}
|
|
3673
3673
|
info(message, params) {
|
|
3674
|
-
this.
|
|
3674
|
+
this.translate(message, params, "info");
|
|
3675
3675
|
}
|
|
3676
3676
|
success(message, params) {
|
|
3677
|
-
this.
|
|
3677
|
+
this.translate(message, params, "success");
|
|
3678
3678
|
}
|
|
3679
3679
|
warning(message, params) {
|
|
3680
|
-
this.
|
|
3680
|
+
this.translate(message, params, "warning");
|
|
3681
3681
|
}
|
|
3682
3682
|
error(message, params) {
|
|
3683
|
-
this.
|
|
3683
|
+
this.translate(message, params, "error");
|
|
3684
|
+
}
|
|
3685
|
+
infoPromised(message, params) {
|
|
3686
|
+
return this.translatePromised(message, params, "info");
|
|
3687
|
+
}
|
|
3688
|
+
successPromised(message, params) {
|
|
3689
|
+
return this.translatePromised(message, params, "success");
|
|
3690
|
+
}
|
|
3691
|
+
warningPromised(message, params) {
|
|
3692
|
+
return this.translatePromised(message, params, "warning");
|
|
3693
|
+
}
|
|
3694
|
+
errorPromised(message, params) {
|
|
3695
|
+
return this.translatePromised(message, params, "error");
|
|
3684
3696
|
}
|
|
3685
3697
|
handleAsyncMethod(method) {
|
|
3686
3698
|
if (!method)
|
|
@@ -3695,13 +3707,18 @@ class BaseToasterService {
|
|
|
3695
3707
|
this.error(reason.message, reason.context);
|
|
3696
3708
|
});
|
|
3697
3709
|
}
|
|
3698
|
-
|
|
3710
|
+
translate(message, params, type) {
|
|
3699
3711
|
this.language.getTranslation(message, params).then(str => {
|
|
3700
|
-
this.show(
|
|
3712
|
+
this.show(str, type);
|
|
3701
3713
|
});
|
|
3702
3714
|
}
|
|
3715
|
+
async translatePromised(message, params, type) {
|
|
3716
|
+
const str = await this.language.getTranslation(message, params);
|
|
3717
|
+
return this.show(str, type);
|
|
3718
|
+
}
|
|
3703
3719
|
show(message, type) {
|
|
3704
3720
|
console.log(message, `background: ${this.colorMap[type]}; color: #ffffff`);
|
|
3721
|
+
return null;
|
|
3705
3722
|
}
|
|
3706
3723
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: BaseToasterService, deps: [{ token: LANGUAGE_SERVICE }], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
3707
3724
|
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: BaseToasterService }); }
|
|
@@ -5817,11 +5834,11 @@ class DynamicTableComponent {
|
|
|
5817
5834
|
});
|
|
5818
5835
|
}
|
|
5819
5836
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: DynamicTableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
5820
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.0.3", type: DynamicTableComponent, isStandalone: false, selector: "dynamic-table", inputs: { label: "label", placeholder: "placeholder", dataLoader: "dataLoader", data: "data", page: "page", urlParam: "urlParam", parallelData: "parallelData", columns: "columns", showFilter: "showFilter", itemsPerPage: "itemsPerPage", updateTime: "updateTime", filterTime: "filterTime", maxPages: "maxPages", directionLinks: "directionLinks", boundaryLinks: "boundaryLinks", orderBy: "orderBy", orderDescending: "orderDescending", testId: "testId", titlePrefix: "titlePrefix", dragStartFn: "dragStartFn", dragEnterFn: "dragEnterFn", dropFn: "dropFn" }, queries: [{ propertyName: "rowTemplate", first: true, predicate: ["rowTemplate"], descendants: true, static: true }, { propertyName: "wrapperTemplate", first: true, predicate: ["wrapperTemplate"], descendants: true, static: true }, { propertyName: "filterTemplate", first: true, predicate: ["filterTemplate"], descendants: true, static: true }, { propertyName: "templateDirectives", predicate: DynamicTableTemplateDirective }], viewQueries: [{ propertyName: "columnsTemplate", first: true, predicate: ["columnsTemplate"], descendants: true, static: true }, { propertyName: "defaultRowTemplate", first: true, predicate: ["defaultRowTemplate"], descendants: true, static: true }, { propertyName: "defaultWrapperTemplate", first: true, predicate: ["defaultWrapperTemplate"], descendants: true, static: true }, { propertyName: "defaultFilterTemplate", first: true, predicate: ["defaultFilterTemplate"], descendants: true, static: true }, { propertyName: "pagination", first: true, predicate: ["pagination"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"dynamic-table\" #pagination=\"pagination\" [pagination]=\"loadData\" [page]=\"page\" [itemsPerPage]=\"itemsPerPage\" [updateTime]=\"updateTime\">\r\n <ng-template #defaultFilterTemplate let-table>\r\n <div class=\"table-filter\" *ngIf=\"table.showFilter\">\r\n <label *ngIf=\"label\" [attr.for]=\"tableId\">{{ label | translate }}</label>\r\n <input type=\"text\"\r\n class=\"form-control\"\r\n [attr.id]=\"tableId\"\r\n [attr.data-testid]=\"testId + '-filter-input'\"\r\n [placeholder]=\"placeholder | translate\"\r\n [ngModel]=\"table.filter\"\r\n (ngModelChange)=\"table.setFilter($event)\"/>\r\n <ng-content select=\"[table-filter]\"></ng-content>\r\n </div>\r\n </ng-template>\r\n <ng-container [ngxTemplateOutlet]=\"filterTemplate || defaultFilterTemplate\" [context]=\"this\"></ng-container>\r\n <pagination-menu [urlParam]=\"urlParam\" [maxSize]=\"maxPages\" [directionLinks]=\"directionLinks\" [boundaryLinks]=\"boundaryLinks\"></pagination-menu>\r\n <div class=\"table-responsive\">\r\n <ng-template #columnTemplate let-context let-column=\"column\" let-template=\"template\">\r\n <ng-template #defaultTemplate let-column=\"column\" let-item=\"item\">\r\n <span>{{ item[column] == undefined || item[column] == null ? '-' : item[column] }}</span>\r\n </ng-template>\r\n <ng-template #pureTemplate>\r\n <ng-container [ngxTemplateOutlet]=\"template.ref\" [context]=\"context\"></ng-container>\r\n </ng-template>\r\n <td [ngClass]=\"'column-' + column\"\r\n [attr.data-testid]=\"testId + '-' + column + '-' + context.rowIndex\" *ngIf=\"!template || !template.pure; else pureTemplate\">\r\n <ng-container [ngxTemplateOutlet]=\"!template ? defaultTemplate : template.ref\" [context]=\"context\"></ng-container>\r\n </td>\r\n </ng-template>\r\n\r\n <ng-template #columnsTemplate let-context>\r\n <ng-container *ngFor=\"let column of cols\"\r\n [ngxTemplateOutlet]=\"columnTemplate\"\r\n [context]=\"context\"\r\n [additionalContext]=\"{\r\n template: templates[column],\r\n column: column\r\n }\"></ng-container>\r\n </ng-template>\r\n\r\n <ng-template #defaultRowTemplate let-context>\r\n <tr draggable=\"true\"\r\n #elem\r\n (dragstart)=\"onDragStart($event, elem, context.item)\"\r\n (dragenter)=\"onDragEnter($event, elem, context.item)\"\r\n (dragleave)=\"onDragLeave($event, elem)\"\r\n (drop)=\"onDrop($event, elem, context.item)\">\r\n <ng-container [ngxTemplateOutlet]=\"columnsTemplate\" [context]=\"context\"></ng-container>\r\n </tr>\r\n </ng-template>\r\n\r\n <ng-template #defaultWrapperTemplate>\r\n <table class=\"table table-striped\">\r\n <thead>\r\n <tr>\r\n <th *ngFor=\"let column of cols\" [ngClass]=\"'column-' + column\">\r\n <ng-template #defaultCol>\r\n <span>{{ realColumns[column].title | translate }}</span>\r\n </ng-template>\r\n <a *ngIf=\"realColumns[column].sort; else defaultCol\"\r\n [ngClass]=\"orderBy !== column ? 'sort' : (orderDescending ? 'sort-desc' : 'sort-asc')\"\r\n (click)=\"setOrder(column)\">\r\n <span>{{ realColumns[column].title | translate }}</span>\r\n <i *ngIf=\"orderBy == column\"\r\n [icon]=\"orderBy !== column ? 'sort' : (orderDescending ? 'sort-desc' : 'sort-asc')\"></i>\r\n </a>\r\n </th>\r\n </tr>\r\n <tr *ngIf=\"hasQuery\">\r\n <th *ngFor=\"let column of cols\" [ngClass]=\"['column-' + column, 'filter-column']\">\r\n <ng-container *ngIf=\"realColumns[column].filter\">\r\n <input class=\"form-control\"\r\n [attr.data-testid]=\"testId + '-filter-' + column\"\r\n [type]=\"realColumns[column].filterType || 'text'\"\r\n [placeholder]=\"realColumns[column].title | translate\"\r\n [ngModel]=\"query[column]\"\r\n (ngModelChange)=\"updateQuery(column, $event)\"/>\r\n </ng-container>\r\n </th>\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <ng-container *paginationItem=\"let context\"\r\n [ngxTemplateOutlet]=\"rowTemplate\"\r\n [context]=\"context\"\r\n [additionalContext]=\"this\"></ng-container>\r\n </tbody>\r\n </table>\r\n </ng-template>\r\n\r\n <div class=\"table-wrapper\">\r\n <ng-content select=\"[table-top]\"></ng-content>\r\n <ng-container [ngxTemplateOutlet]=\"wrapperTemplate || defaultWrapperTemplate\"\r\n [context]=\"this\"></ng-container>\r\n <ng-content select=\"[table-bottom]\"></ng-content>\r\n </div>\r\n </div>\r\n <pagination-menu [urlParam]=\"urlParam\" [maxSize]=\"maxPages\" [directionLinks]=\"directionLinks\" [boundaryLinks]=\"boundaryLinks\"></pagination-menu>\r\n</div>\r\n", styles: [".dynamic-table{--table-bg: transparent;--table-stripe-bg: rgba(210, 210, 210, .35)}.dynamic-table .table-filter{margin-bottom:25px;display:flex;gap:10px}.dynamic-table .table-filter>input{max-width:400px}.dynamic-table .table-wrapper{position:relative}.dynamic-table table.table{border-collapse:collapse;width:100%;font-family:inherit;font-size:inherit}.dynamic-table table.table th{text-align:left}.dynamic-table table.table td,.dynamic-table table.table th{text-align:left;padding:6px 12px;border:1px solid var(--border-color);vertical-align:middle}.dynamic-table table.table-sm th,.dynamic-table table.table-sm td{font-size:var(--font-size-sm);padding:4px 6px}.dynamic-table table.table thead th{font-weight:500}.dynamic-table table.table thead th a{color:var(--text-color);cursor:pointer}.dynamic-table table.table thead th span{display:inline-block;vertical-align:middle}.dynamic-table table.table thead th .svg-icon{float:right}.dynamic-table table.table thead th .svg-icon svg{width:20px;height:20px}.dynamic-table table.table tbody tr td{background-color:var(--table-bg)}.dynamic-table .table-striped>tbody>tr:nth-of-type(odd) td{background-color:var(--table-stripe-bg)}\n"], dependencies: [{ kind: "directive", type: i1$3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: IconDirective, selector: "[icon]", inputs: ["icon", "activeIcon", "active"], outputs: ["activeChange"] }, { kind: "directive", type: NgxTemplateOutletDirective, selector: "[ngxTemplateOutlet]", inputs: ["context", "additionalContext", "ngxTemplateOutlet"] }, { kind: "directive", type: PaginationDirective, selector: "[pagination]", inputs: ["pagination", "page", "itemsPerPage", "updateTime", "waitFor"], outputs: ["pageChange", "onRefresh"], exportAs: ["pagination"] }, { kind: "directive", type: PaginationItemDirective, selector: "[paginationItem]" }, { kind: "component", type: PaginationMenuComponent, selector: "pagination-menu", inputs: ["maxSize", "urlParam", "directionLinks", "boundaryLinks"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }], encapsulation: i0.ViewEncapsulation.None }); }
|
|
5837
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.0.3", type: DynamicTableComponent, isStandalone: false, selector: "dynamic-table", inputs: { label: "label", placeholder: "placeholder", dataLoader: "dataLoader", data: "data", page: "page", urlParam: "urlParam", parallelData: "parallelData", columns: "columns", showFilter: "showFilter", itemsPerPage: "itemsPerPage", updateTime: "updateTime", filterTime: "filterTime", maxPages: "maxPages", directionLinks: "directionLinks", boundaryLinks: "boundaryLinks", orderBy: "orderBy", orderDescending: "orderDescending", testId: "testId", titlePrefix: "titlePrefix", dragStartFn: "dragStartFn", dragEnterFn: "dragEnterFn", dropFn: "dropFn" }, queries: [{ propertyName: "rowTemplate", first: true, predicate: ["rowTemplate"], descendants: true, static: true }, { propertyName: "wrapperTemplate", first: true, predicate: ["wrapperTemplate"], descendants: true, static: true }, { propertyName: "filterTemplate", first: true, predicate: ["filterTemplate"], descendants: true, static: true }, { propertyName: "templateDirectives", predicate: DynamicTableTemplateDirective }], viewQueries: [{ propertyName: "columnsTemplate", first: true, predicate: ["columnsTemplate"], descendants: true, static: true }, { propertyName: "defaultRowTemplate", first: true, predicate: ["defaultRowTemplate"], descendants: true, static: true }, { propertyName: "defaultWrapperTemplate", first: true, predicate: ["defaultWrapperTemplate"], descendants: true, static: true }, { propertyName: "defaultFilterTemplate", first: true, predicate: ["defaultFilterTemplate"], descendants: true, static: true }, { propertyName: "pagination", first: true, predicate: ["pagination"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"dynamic-table\" #pagination=\"pagination\" [pagination]=\"loadData\" [page]=\"page\" [itemsPerPage]=\"itemsPerPage\" [updateTime]=\"updateTime\">\r\n <ng-template #defaultFilterTemplate let-table>\r\n <div class=\"table-filter\" *ngIf=\"table.showFilter\">\r\n <label *ngIf=\"label\" [attr.for]=\"tableId\">{{ label | translate }}</label>\r\n <input type=\"text\"\r\n class=\"form-control\"\r\n [attr.id]=\"tableId\"\r\n [attr.data-testid]=\"testId + '-filter-input'\"\r\n [placeholder]=\"placeholder | translate\"\r\n [ngModel]=\"table.filter\"\r\n (ngModelChange)=\"table.setFilter($event)\"/>\r\n <ng-content select=\"[table-filter]\"></ng-content>\r\n </div>\r\n </ng-template>\r\n <ng-container [ngxTemplateOutlet]=\"filterTemplate || defaultFilterTemplate\" [context]=\"this\"></ng-container>\r\n <pagination-menu [urlParam]=\"urlParam\" [maxSize]=\"maxPages\" [directionLinks]=\"directionLinks\" [boundaryLinks]=\"boundaryLinks\"></pagination-menu>\r\n <div class=\"table-responsive\">\r\n <ng-template #columnTemplate let-context let-column=\"column\" let-template=\"template\">\r\n <ng-template #defaultTemplate let-column=\"column\" let-item=\"item\">\r\n <span>{{ item[column] == undefined || item[column] == null ? '-' : item[column] }}</span>\r\n </ng-template>\r\n <ng-template #pureTemplate>\r\n <ng-container [ngxTemplateOutlet]=\"template.ref\" [context]=\"context\"></ng-container>\r\n </ng-template>\r\n <td [ngClass]=\"'column-' + column\"\r\n [attr.data-testid]=\"testId + '-' + column + '-' + context.rowIndex\" *ngIf=\"!template || !template.pure; else pureTemplate\">\r\n <ng-container [ngxTemplateOutlet]=\"!template ? defaultTemplate : template.ref\" [context]=\"context\"></ng-container>\r\n </td>\r\n </ng-template>\r\n\r\n <ng-template #columnsTemplate let-context>\r\n <ng-container *ngFor=\"let column of cols\"\r\n [ngxTemplateOutlet]=\"columnTemplate\"\r\n [context]=\"context\"\r\n [additionalContext]=\"{\r\n template: templates[column],\r\n column: column\r\n }\"></ng-container>\r\n </ng-template>\r\n\r\n <ng-template #defaultRowTemplate let-context>\r\n <tr draggable=\"true\"\r\n #elem\r\n (dragstart)=\"onDragStart($event, elem, context.item)\"\r\n (dragenter)=\"onDragEnter($event, elem, context.item)\"\r\n (dragleave)=\"onDragLeave($event, elem)\"\r\n (drop)=\"onDrop($event, elem, context.item)\">\r\n <ng-container [ngxTemplateOutlet]=\"columnsTemplate\" [context]=\"context\"></ng-container>\r\n </tr>\r\n </ng-template>\r\n\r\n <ng-template #defaultWrapperTemplate>\r\n <table class=\"table table-striped\">\r\n <thead>\r\n <tr>\r\n <th *ngFor=\"let column of cols\" [ngClass]=\"'column-' + column\">\r\n <ng-template #defaultCol>\r\n <span>{{ realColumns[column].title | translate }}</span>\r\n </ng-template>\r\n <a *ngIf=\"realColumns[column].sort; else defaultCol\"\r\n [ngClass]=\"orderBy !== column ? 'sort' : (orderDescending ? 'sort-desc' : 'sort-asc')\"\r\n (click)=\"setOrder(column)\">\r\n <span>{{ realColumns[column].title | translate }}</span>\r\n <i *ngIf=\"orderBy == column\"\r\n [icon]=\"orderBy !== column ? 'sort' : (orderDescending ? 'sort-desc' : 'sort-asc')\"></i>\r\n </a>\r\n </th>\r\n </tr>\r\n <tr *ngIf=\"hasQuery\">\r\n <th *ngFor=\"let column of cols\" [ngClass]=\"['column-' + column, 'filter-column']\">\r\n <ng-container *ngIf=\"realColumns[column].filter\">\r\n <input class=\"form-control\"\r\n [attr.data-testid]=\"testId + '-filter-' + column\"\r\n [type]=\"realColumns[column].filterType || 'text'\"\r\n [placeholder]=\"realColumns[column].title | translate\"\r\n [ngModel]=\"query[column]\"\r\n (ngModelChange)=\"updateQuery(column, $event)\"/>\r\n </ng-container>\r\n </th>\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <ng-container *paginationItem=\"let context\"\r\n [ngxTemplateOutlet]=\"rowTemplate\"\r\n [context]=\"context\"\r\n [additionalContext]=\"this\"></ng-container>\r\n </tbody>\r\n </table>\r\n </ng-template>\r\n\r\n <div class=\"table-wrapper\">\r\n <ng-content select=\"[table-top]\"></ng-content>\r\n <ng-container [ngxTemplateOutlet]=\"wrapperTemplate || defaultWrapperTemplate\"\r\n [context]=\"this\"></ng-container>\r\n <ng-content select=\"[table-bottom]\"></ng-content>\r\n </div>\r\n </div>\r\n <pagination-menu [urlParam]=\"urlParam\" [maxSize]=\"maxPages\" [directionLinks]=\"directionLinks\" [boundaryLinks]=\"boundaryLinks\"></pagination-menu>\r\n</div>\r\n", styles: [".dynamic-table{--table-bg: transparent;--table-stripe-bg: rgba(210, 210, 210, .35)}.dynamic-table .table-responsive{overflow:hidden;overflow-x:auto}.dynamic-table .table-filter{margin-bottom:25px;display:flex;gap:10px}.dynamic-table .table-filter>input{max-width:400px}.dynamic-table .table-wrapper{position:relative}.dynamic-table table.table{border-collapse:collapse;width:100%;font-family:inherit;font-size:inherit}.dynamic-table table.table th{text-align:left}.dynamic-table table.table td,.dynamic-table table.table th{text-align:left;padding:6px 12px;border:1px solid var(--border-color);vertical-align:middle}.dynamic-table table.table-sm th,.dynamic-table table.table-sm td{font-size:var(--font-size-sm);padding:4px 6px}.dynamic-table table.table thead th{font-weight:500}.dynamic-table table.table thead th a{color:var(--text-color);cursor:pointer}.dynamic-table table.table thead th span{display:inline-block;vertical-align:middle}.dynamic-table table.table thead th .svg-icon{float:right}.dynamic-table table.table thead th .svg-icon svg{width:20px;height:20px}.dynamic-table table.table tbody tr td{background-color:var(--table-bg)}.dynamic-table .table-striped>tbody>tr:nth-of-type(odd) td{background-color:var(--table-stripe-bg)}\n"], dependencies: [{ kind: "directive", type: i1$3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: IconDirective, selector: "[icon]", inputs: ["icon", "activeIcon", "active"], outputs: ["activeChange"] }, { kind: "directive", type: NgxTemplateOutletDirective, selector: "[ngxTemplateOutlet]", inputs: ["context", "additionalContext", "ngxTemplateOutlet"] }, { kind: "directive", type: PaginationDirective, selector: "[pagination]", inputs: ["pagination", "page", "itemsPerPage", "updateTime", "waitFor"], outputs: ["pageChange", "onRefresh"], exportAs: ["pagination"] }, { kind: "directive", type: PaginationItemDirective, selector: "[paginationItem]" }, { kind: "component", type: PaginationMenuComponent, selector: "pagination-menu", inputs: ["maxSize", "urlParam", "directionLinks", "boundaryLinks"] }, { kind: "pipe", type: TranslatePipe, name: "translate" }], encapsulation: i0.ViewEncapsulation.None }); }
|
|
5821
5838
|
}
|
|
5822
5839
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: DynamicTableComponent, decorators: [{
|
|
5823
5840
|
type: Component,
|
|
5824
|
-
args: [{ standalone: false, encapsulation: ViewEncapsulation.None, selector: "dynamic-table", template: "<div class=\"dynamic-table\" #pagination=\"pagination\" [pagination]=\"loadData\" [page]=\"page\" [itemsPerPage]=\"itemsPerPage\" [updateTime]=\"updateTime\">\r\n <ng-template #defaultFilterTemplate let-table>\r\n <div class=\"table-filter\" *ngIf=\"table.showFilter\">\r\n <label *ngIf=\"label\" [attr.for]=\"tableId\">{{ label | translate }}</label>\r\n <input type=\"text\"\r\n class=\"form-control\"\r\n [attr.id]=\"tableId\"\r\n [attr.data-testid]=\"testId + '-filter-input'\"\r\n [placeholder]=\"placeholder | translate\"\r\n [ngModel]=\"table.filter\"\r\n (ngModelChange)=\"table.setFilter($event)\"/>\r\n <ng-content select=\"[table-filter]\"></ng-content>\r\n </div>\r\n </ng-template>\r\n <ng-container [ngxTemplateOutlet]=\"filterTemplate || defaultFilterTemplate\" [context]=\"this\"></ng-container>\r\n <pagination-menu [urlParam]=\"urlParam\" [maxSize]=\"maxPages\" [directionLinks]=\"directionLinks\" [boundaryLinks]=\"boundaryLinks\"></pagination-menu>\r\n <div class=\"table-responsive\">\r\n <ng-template #columnTemplate let-context let-column=\"column\" let-template=\"template\">\r\n <ng-template #defaultTemplate let-column=\"column\" let-item=\"item\">\r\n <span>{{ item[column] == undefined || item[column] == null ? '-' : item[column] }}</span>\r\n </ng-template>\r\n <ng-template #pureTemplate>\r\n <ng-container [ngxTemplateOutlet]=\"template.ref\" [context]=\"context\"></ng-container>\r\n </ng-template>\r\n <td [ngClass]=\"'column-' + column\"\r\n [attr.data-testid]=\"testId + '-' + column + '-' + context.rowIndex\" *ngIf=\"!template || !template.pure; else pureTemplate\">\r\n <ng-container [ngxTemplateOutlet]=\"!template ? defaultTemplate : template.ref\" [context]=\"context\"></ng-container>\r\n </td>\r\n </ng-template>\r\n\r\n <ng-template #columnsTemplate let-context>\r\n <ng-container *ngFor=\"let column of cols\"\r\n [ngxTemplateOutlet]=\"columnTemplate\"\r\n [context]=\"context\"\r\n [additionalContext]=\"{\r\n template: templates[column],\r\n column: column\r\n }\"></ng-container>\r\n </ng-template>\r\n\r\n <ng-template #defaultRowTemplate let-context>\r\n <tr draggable=\"true\"\r\n #elem\r\n (dragstart)=\"onDragStart($event, elem, context.item)\"\r\n (dragenter)=\"onDragEnter($event, elem, context.item)\"\r\n (dragleave)=\"onDragLeave($event, elem)\"\r\n (drop)=\"onDrop($event, elem, context.item)\">\r\n <ng-container [ngxTemplateOutlet]=\"columnsTemplate\" [context]=\"context\"></ng-container>\r\n </tr>\r\n </ng-template>\r\n\r\n <ng-template #defaultWrapperTemplate>\r\n <table class=\"table table-striped\">\r\n <thead>\r\n <tr>\r\n <th *ngFor=\"let column of cols\" [ngClass]=\"'column-' + column\">\r\n <ng-template #defaultCol>\r\n <span>{{ realColumns[column].title | translate }}</span>\r\n </ng-template>\r\n <a *ngIf=\"realColumns[column].sort; else defaultCol\"\r\n [ngClass]=\"orderBy !== column ? 'sort' : (orderDescending ? 'sort-desc' : 'sort-asc')\"\r\n (click)=\"setOrder(column)\">\r\n <span>{{ realColumns[column].title | translate }}</span>\r\n <i *ngIf=\"orderBy == column\"\r\n [icon]=\"orderBy !== column ? 'sort' : (orderDescending ? 'sort-desc' : 'sort-asc')\"></i>\r\n </a>\r\n </th>\r\n </tr>\r\n <tr *ngIf=\"hasQuery\">\r\n <th *ngFor=\"let column of cols\" [ngClass]=\"['column-' + column, 'filter-column']\">\r\n <ng-container *ngIf=\"realColumns[column].filter\">\r\n <input class=\"form-control\"\r\n [attr.data-testid]=\"testId + '-filter-' + column\"\r\n [type]=\"realColumns[column].filterType || 'text'\"\r\n [placeholder]=\"realColumns[column].title | translate\"\r\n [ngModel]=\"query[column]\"\r\n (ngModelChange)=\"updateQuery(column, $event)\"/>\r\n </ng-container>\r\n </th>\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <ng-container *paginationItem=\"let context\"\r\n [ngxTemplateOutlet]=\"rowTemplate\"\r\n [context]=\"context\"\r\n [additionalContext]=\"this\"></ng-container>\r\n </tbody>\r\n </table>\r\n </ng-template>\r\n\r\n <div class=\"table-wrapper\">\r\n <ng-content select=\"[table-top]\"></ng-content>\r\n <ng-container [ngxTemplateOutlet]=\"wrapperTemplate || defaultWrapperTemplate\"\r\n [context]=\"this\"></ng-container>\r\n <ng-content select=\"[table-bottom]\"></ng-content>\r\n </div>\r\n </div>\r\n <pagination-menu [urlParam]=\"urlParam\" [maxSize]=\"maxPages\" [directionLinks]=\"directionLinks\" [boundaryLinks]=\"boundaryLinks\"></pagination-menu>\r\n</div>\r\n", styles: [".dynamic-table{--table-bg: transparent;--table-stripe-bg: rgba(210, 210, 210, .35)}.dynamic-table .table-filter{margin-bottom:25px;display:flex;gap:10px}.dynamic-table .table-filter>input{max-width:400px}.dynamic-table .table-wrapper{position:relative}.dynamic-table table.table{border-collapse:collapse;width:100%;font-family:inherit;font-size:inherit}.dynamic-table table.table th{text-align:left}.dynamic-table table.table td,.dynamic-table table.table th{text-align:left;padding:6px 12px;border:1px solid var(--border-color);vertical-align:middle}.dynamic-table table.table-sm th,.dynamic-table table.table-sm td{font-size:var(--font-size-sm);padding:4px 6px}.dynamic-table table.table thead th{font-weight:500}.dynamic-table table.table thead th a{color:var(--text-color);cursor:pointer}.dynamic-table table.table thead th span{display:inline-block;vertical-align:middle}.dynamic-table table.table thead th .svg-icon{float:right}.dynamic-table table.table thead th .svg-icon svg{width:20px;height:20px}.dynamic-table table.table tbody tr td{background-color:var(--table-bg)}.dynamic-table .table-striped>tbody>tr:nth-of-type(odd) td{background-color:var(--table-stripe-bg)}\n"] }]
|
|
5841
|
+
args: [{ standalone: false, encapsulation: ViewEncapsulation.None, selector: "dynamic-table", template: "<div class=\"dynamic-table\" #pagination=\"pagination\" [pagination]=\"loadData\" [page]=\"page\" [itemsPerPage]=\"itemsPerPage\" [updateTime]=\"updateTime\">\r\n <ng-template #defaultFilterTemplate let-table>\r\n <div class=\"table-filter\" *ngIf=\"table.showFilter\">\r\n <label *ngIf=\"label\" [attr.for]=\"tableId\">{{ label | translate }}</label>\r\n <input type=\"text\"\r\n class=\"form-control\"\r\n [attr.id]=\"tableId\"\r\n [attr.data-testid]=\"testId + '-filter-input'\"\r\n [placeholder]=\"placeholder | translate\"\r\n [ngModel]=\"table.filter\"\r\n (ngModelChange)=\"table.setFilter($event)\"/>\r\n <ng-content select=\"[table-filter]\"></ng-content>\r\n </div>\r\n </ng-template>\r\n <ng-container [ngxTemplateOutlet]=\"filterTemplate || defaultFilterTemplate\" [context]=\"this\"></ng-container>\r\n <pagination-menu [urlParam]=\"urlParam\" [maxSize]=\"maxPages\" [directionLinks]=\"directionLinks\" [boundaryLinks]=\"boundaryLinks\"></pagination-menu>\r\n <div class=\"table-responsive\">\r\n <ng-template #columnTemplate let-context let-column=\"column\" let-template=\"template\">\r\n <ng-template #defaultTemplate let-column=\"column\" let-item=\"item\">\r\n <span>{{ item[column] == undefined || item[column] == null ? '-' : item[column] }}</span>\r\n </ng-template>\r\n <ng-template #pureTemplate>\r\n <ng-container [ngxTemplateOutlet]=\"template.ref\" [context]=\"context\"></ng-container>\r\n </ng-template>\r\n <td [ngClass]=\"'column-' + column\"\r\n [attr.data-testid]=\"testId + '-' + column + '-' + context.rowIndex\" *ngIf=\"!template || !template.pure; else pureTemplate\">\r\n <ng-container [ngxTemplateOutlet]=\"!template ? defaultTemplate : template.ref\" [context]=\"context\"></ng-container>\r\n </td>\r\n </ng-template>\r\n\r\n <ng-template #columnsTemplate let-context>\r\n <ng-container *ngFor=\"let column of cols\"\r\n [ngxTemplateOutlet]=\"columnTemplate\"\r\n [context]=\"context\"\r\n [additionalContext]=\"{\r\n template: templates[column],\r\n column: column\r\n }\"></ng-container>\r\n </ng-template>\r\n\r\n <ng-template #defaultRowTemplate let-context>\r\n <tr draggable=\"true\"\r\n #elem\r\n (dragstart)=\"onDragStart($event, elem, context.item)\"\r\n (dragenter)=\"onDragEnter($event, elem, context.item)\"\r\n (dragleave)=\"onDragLeave($event, elem)\"\r\n (drop)=\"onDrop($event, elem, context.item)\">\r\n <ng-container [ngxTemplateOutlet]=\"columnsTemplate\" [context]=\"context\"></ng-container>\r\n </tr>\r\n </ng-template>\r\n\r\n <ng-template #defaultWrapperTemplate>\r\n <table class=\"table table-striped\">\r\n <thead>\r\n <tr>\r\n <th *ngFor=\"let column of cols\" [ngClass]=\"'column-' + column\">\r\n <ng-template #defaultCol>\r\n <span>{{ realColumns[column].title | translate }}</span>\r\n </ng-template>\r\n <a *ngIf=\"realColumns[column].sort; else defaultCol\"\r\n [ngClass]=\"orderBy !== column ? 'sort' : (orderDescending ? 'sort-desc' : 'sort-asc')\"\r\n (click)=\"setOrder(column)\">\r\n <span>{{ realColumns[column].title | translate }}</span>\r\n <i *ngIf=\"orderBy == column\"\r\n [icon]=\"orderBy !== column ? 'sort' : (orderDescending ? 'sort-desc' : 'sort-asc')\"></i>\r\n </a>\r\n </th>\r\n </tr>\r\n <tr *ngIf=\"hasQuery\">\r\n <th *ngFor=\"let column of cols\" [ngClass]=\"['column-' + column, 'filter-column']\">\r\n <ng-container *ngIf=\"realColumns[column].filter\">\r\n <input class=\"form-control\"\r\n [attr.data-testid]=\"testId + '-filter-' + column\"\r\n [type]=\"realColumns[column].filterType || 'text'\"\r\n [placeholder]=\"realColumns[column].title | translate\"\r\n [ngModel]=\"query[column]\"\r\n (ngModelChange)=\"updateQuery(column, $event)\"/>\r\n </ng-container>\r\n </th>\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <ng-container *paginationItem=\"let context\"\r\n [ngxTemplateOutlet]=\"rowTemplate\"\r\n [context]=\"context\"\r\n [additionalContext]=\"this\"></ng-container>\r\n </tbody>\r\n </table>\r\n </ng-template>\r\n\r\n <div class=\"table-wrapper\">\r\n <ng-content select=\"[table-top]\"></ng-content>\r\n <ng-container [ngxTemplateOutlet]=\"wrapperTemplate || defaultWrapperTemplate\"\r\n [context]=\"this\"></ng-container>\r\n <ng-content select=\"[table-bottom]\"></ng-content>\r\n </div>\r\n </div>\r\n <pagination-menu [urlParam]=\"urlParam\" [maxSize]=\"maxPages\" [directionLinks]=\"directionLinks\" [boundaryLinks]=\"boundaryLinks\"></pagination-menu>\r\n</div>\r\n", styles: [".dynamic-table{--table-bg: transparent;--table-stripe-bg: rgba(210, 210, 210, .35)}.dynamic-table .table-responsive{overflow:hidden;overflow-x:auto}.dynamic-table .table-filter{margin-bottom:25px;display:flex;gap:10px}.dynamic-table .table-filter>input{max-width:400px}.dynamic-table .table-wrapper{position:relative}.dynamic-table table.table{border-collapse:collapse;width:100%;font-family:inherit;font-size:inherit}.dynamic-table table.table th{text-align:left}.dynamic-table table.table td,.dynamic-table table.table th{text-align:left;padding:6px 12px;border:1px solid var(--border-color);vertical-align:middle}.dynamic-table table.table-sm th,.dynamic-table table.table-sm td{font-size:var(--font-size-sm);padding:4px 6px}.dynamic-table table.table thead th{font-weight:500}.dynamic-table table.table thead th a{color:var(--text-color);cursor:pointer}.dynamic-table table.table thead th span{display:inline-block;vertical-align:middle}.dynamic-table table.table thead th .svg-icon{float:right}.dynamic-table table.table thead th .svg-icon svg{width:20px;height:20px}.dynamic-table table.table tbody tr td{background-color:var(--table-bg)}.dynamic-table .table-striped>tbody>tr:nth-of-type(odd) td{background-color:var(--table-stripe-bg)}\n"] }]
|
|
5825
5842
|
}], ctorParameters: () => [], propDecorators: { label: [{
|
|
5826
5843
|
type: Input
|
|
5827
5844
|
}], placeholder: [{
|