UNPKG

@netgrif/components

Version:

Netgrif Application Engine frontend Angular components

25 lines 12.5 kB
import { Component } from '@angular/core'; import { AbstractMultiUserAssignListComponent } from '@netgrif/components-core'; import * as i0 from "@angular/core"; import * as i1 from "@netgrif/components-core"; import * as i2 from "@angular/common"; import * as i3 from "@ngbracket/ngx-layout"; import * as i4 from "@angular/material/icon"; import * as i5 from "@angular/material/progress-spinner"; import * as i6 from "@angular/cdk/scrolling"; import * as i7 from "./multi-user-assign-item/multi-user-assign-item.component"; import * as i8 from "@ngx-translate/core"; export class MultiUserAssignListComponent extends AbstractMultiUserAssignListComponent { _userListService; constructor(_userListService) { super(_userListService); this._userListService = _userListService; } static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: MultiUserAssignListComponent, deps: [{ token: i1.UserListService }], target: i0.ɵɵFactoryTarget.Component }); static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: MultiUserAssignListComponent, selector: "nc-multi-user-assign-list", usesInheritance: true, ngImport: i0, template: "<div fxLayout=\"column\" fxLayoutAlign=\"start center\" fxFlex>\n <ng-container *ngIf=\"users$ | async as users\">\n <div *ngIf=\"!loading && users.length === 0\" fxFlex=\"100\" fxLayout=\"column\" fxLayoutAlign=\"center center\">\n <mat-icon color=\"accent\" class=\"margin-bottom-default\">person_add_disabled</mat-icon>\n <span class=\"font-size-20\">{{ 'side-menu.user.noUser' | translate }}</span>\n </div>\n\n <div class=\"full-height full-width\" fxFlex=\"100\">\n <cdk-virtual-scroll-viewport itemSize=\"60\" (scrolledIndexChange)=\"loadNextPage()\"\n class=\"full-height full-width\">\n <nc-multi-user-assign-item\n *cdkVirtualFor=\"let user of users;\n trackBy: trackBy;\n templateCacheSize: 0\"\n [user]=\"user\"\n [selectedIds$]=\"selectedUsers$\"\n (click)=\"select(user)\">\n </nc-multi-user-assign-item>\n\n <div *ngIf=\"loading\" fxLayout=\"column\" fxLayoutAlign=\"center center\"\n class=\"margin-top-default\">\n <mat-spinner color=\"primary\" diameter=\"40\"></mat-spinner>\n </div>\n </cdk-virtual-scroll-viewport>\n </div>\n </ng-container>\n</div>\n", styles: [".full-height{height:100%;min-height:100%}.full-width{width:100%;min-width:100%}.padding-default{padding:8px}.padding-half{padding:4px}.padding-x2{padding:16px}.margin-default{margin:8px}.margin-half{margin:4px}.margin-x2{margin:16px}.margin-top-half{margin-top:4px}.margin-top-x2{margin-top:16px}.margin-bottom-half{margin-bottom:4px}.margin-bottom-x2{margin-bottom:16px}.margin-left-default{margin-left:8px}.margin-left-half{margin-left:4px}.margin-left-x2{margin-left:16px}.margin-right-default{margin-right:8px}.margin-right-half{margin-right:4px}.margin-right-x2{margin-right:16px}.font-size-20{font-size:20px}.margin-bottom-default{margin-bottom:8px}.margin-top-default{margin-top:8px}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.DefaultLayoutDirective, selector: " [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md], [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md], [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm], [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { kind: "directive", type: i3.DefaultLayoutAlignDirective, selector: " [fxLayoutAlign], [fxLayoutAlign.xs], [fxLayoutAlign.sm], [fxLayoutAlign.md], [fxLayoutAlign.lg], [fxLayoutAlign.xl], [fxLayoutAlign.lt-sm], [fxLayoutAlign.lt-md], [fxLayoutAlign.lt-lg], [fxLayoutAlign.lt-xl], [fxLayoutAlign.gt-xs], [fxLayoutAlign.gt-sm], [fxLayoutAlign.gt-md], [fxLayoutAlign.gt-lg]", inputs: ["fxLayoutAlign", "fxLayoutAlign.xs", "fxLayoutAlign.sm", "fxLayoutAlign.md", "fxLayoutAlign.lg", "fxLayoutAlign.xl", "fxLayoutAlign.lt-sm", "fxLayoutAlign.lt-md", "fxLayoutAlign.lt-lg", "fxLayoutAlign.lt-xl", "fxLayoutAlign.gt-xs", "fxLayoutAlign.gt-sm", "fxLayoutAlign.gt-md", "fxLayoutAlign.gt-lg"] }, { kind: "directive", type: i3.DefaultFlexDirective, selector: " [fxFlex], [fxFlex.xs], [fxFlex.sm], [fxFlex.md], [fxFlex.lg], [fxFlex.xl], [fxFlex.lt-sm], [fxFlex.lt-md], [fxFlex.lt-lg], [fxFlex.lt-xl], [fxFlex.gt-xs], [fxFlex.gt-sm], [fxFlex.gt-md], [fxFlex.gt-lg]", inputs: ["fxFlex", "fxFlex.xs", "fxFlex.sm", "fxFlex.md", "fxFlex.lg", "fxFlex.xl", "fxFlex.lt-sm", "fxFlex.lt-md", "fxFlex.lt-lg", "fxFlex.lt-xl", "fxFlex.gt-xs", "fxFlex.gt-sm", "fxFlex.gt-md", "fxFlex.gt-lg"] }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i5.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }, { kind: "directive", type: i6.CdkFixedSizeVirtualScroll, selector: "cdk-virtual-scroll-viewport[itemSize]", inputs: ["itemSize", "minBufferPx", "maxBufferPx"] }, { kind: "directive", type: i6.CdkVirtualForOf, selector: "[cdkVirtualFor][cdkVirtualForOf]", inputs: ["cdkVirtualForOf", "cdkVirtualForTrackBy", "cdkVirtualForTemplate", "cdkVirtualForTemplateCacheSize"] }, { kind: "component", type: i6.CdkVirtualScrollViewport, selector: "cdk-virtual-scroll-viewport", inputs: ["orientation", "appendOnly"], outputs: ["scrolledIndexChange"] }, { kind: "component", type: i7.MultiUserAssignItemComponent, selector: "nc-multi-user-assign-item" }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }, { kind: "pipe", type: i8.TranslatePipe, name: "translate" }] }); } i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: MultiUserAssignListComponent, decorators: [{ type: Component, args: [{ selector: 'nc-multi-user-assign-list', template: "<div fxLayout=\"column\" fxLayoutAlign=\"start center\" fxFlex>\n <ng-container *ngIf=\"users$ | async as users\">\n <div *ngIf=\"!loading && users.length === 0\" fxFlex=\"100\" fxLayout=\"column\" fxLayoutAlign=\"center center\">\n <mat-icon color=\"accent\" class=\"margin-bottom-default\">person_add_disabled</mat-icon>\n <span class=\"font-size-20\">{{ 'side-menu.user.noUser' | translate }}</span>\n </div>\n\n <div class=\"full-height full-width\" fxFlex=\"100\">\n <cdk-virtual-scroll-viewport itemSize=\"60\" (scrolledIndexChange)=\"loadNextPage()\"\n class=\"full-height full-width\">\n <nc-multi-user-assign-item\n *cdkVirtualFor=\"let user of users;\n trackBy: trackBy;\n templateCacheSize: 0\"\n [user]=\"user\"\n [selectedIds$]=\"selectedUsers$\"\n (click)=\"select(user)\">\n </nc-multi-user-assign-item>\n\n <div *ngIf=\"loading\" fxLayout=\"column\" fxLayoutAlign=\"center center\"\n class=\"margin-top-default\">\n <mat-spinner color=\"primary\" diameter=\"40\"></mat-spinner>\n </div>\n </cdk-virtual-scroll-viewport>\n </div>\n </ng-container>\n</div>\n", styles: [".full-height{height:100%;min-height:100%}.full-width{width:100%;min-width:100%}.padding-default{padding:8px}.padding-half{padding:4px}.padding-x2{padding:16px}.margin-default{margin:8px}.margin-half{margin:4px}.margin-x2{margin:16px}.margin-top-half{margin-top:4px}.margin-top-x2{margin-top:16px}.margin-bottom-half{margin-bottom:4px}.margin-bottom-x2{margin-bottom:16px}.margin-left-default{margin-left:8px}.margin-left-half{margin-left:4px}.margin-left-x2{margin-left:16px}.margin-right-default{margin-right:8px}.margin-right-half{margin-right:4px}.margin-right-x2{margin-right:16px}.font-size-20{font-size:20px}.margin-bottom-default{margin-bottom:8px}.margin-top-default{margin-top:8px}\n"] }] }], ctorParameters: () => [{ type: i1.UserListService }] }); //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibXVsdGktdXNlci1hc3NpZ24tbGlzdC5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9uZXRncmlmLWNvbXBvbmVudHMvc3JjL2xpYi9zaWRlLW1lbnUvY29udGVudC1jb21wb25lbnRzL211bHRpLXVzZXItYXNzaWduL211bHRpLXVzZXItYXNzaWduLWxpc3QvbXVsdGktdXNlci1hc3NpZ24tbGlzdC5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9uZXRncmlmLWNvbXBvbmVudHMvc3JjL2xpYi9zaWRlLW1lbnUvY29udGVudC1jb21wb25lbnRzL211bHRpLXVzZXItYXNzaWduL211bHRpLXVzZXItYXNzaWduLWxpc3QvbXVsdGktdXNlci1hc3NpZ24tbGlzdC5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUMsU0FBUyxFQUFDLE1BQU0sZUFBZSxDQUFDO0FBQ3hDLE9BQU8sRUFBQyxvQ0FBb0MsRUFBa0IsTUFBTSwwQkFBMEIsQ0FBQzs7Ozs7Ozs7OztBQU8vRixNQUFNLE9BQU8sNEJBQTZCLFNBQVEsb0NBQW9DO0lBRTVEO0lBQXRCLFlBQXNCLGdCQUFpQztRQUNuRCxLQUFLLENBQUMsZ0JBQWdCLENBQUMsQ0FBQztRQUROLHFCQUFnQixHQUFoQixnQkFBZ0IsQ0FBaUI7SUFFdkQsQ0FBQzt3R0FKUSw0QkFBNEI7NEZBQTVCLDRCQUE0Qix3RkNSekMsNjVDQTJCQTs7NEZEbkJhLDRCQUE0QjtrQkFMeEMsU0FBUzsrQkFDRSwyQkFBMkIiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQge0NvbXBvbmVudH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQge0Fic3RyYWN0TXVsdGlVc2VyQXNzaWduTGlzdENvbXBvbmVudCwgVXNlckxpc3RTZXJ2aWNlfSBmcm9tICdAbmV0Z3JpZi9jb21wb25lbnRzLWNvcmUnO1xuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6ICduYy1tdWx0aS11c2VyLWFzc2lnbi1saXN0JyxcbiAgdGVtcGxhdGVVcmw6ICcuL211bHRpLXVzZXItYXNzaWduLWxpc3QuY29tcG9uZW50Lmh0bWwnLFxuICBzdHlsZVVybHM6IFsnLi9tdWx0aS11c2VyLWFzc2lnbi1saXN0LmNvbXBvbmVudC5zY3NzJ11cbn0pXG5leHBvcnQgY2xhc3MgTXVsdGlVc2VyQXNzaWduTGlzdENvbXBvbmVudCBleHRlbmRzIEFic3RyYWN0TXVsdGlVc2VyQXNzaWduTGlzdENvbXBvbmVudCB7XG5cbiAgICBjb25zdHJ1Y3Rvcihwcm90ZWN0ZWQgX3VzZXJMaXN0U2VydmljZTogVXNlckxpc3RTZXJ2aWNlKSB7XG4gICAgICAgIHN1cGVyKF91c2VyTGlzdFNlcnZpY2UpO1xuICAgIH1cblxufVxuIiwiPGRpdiBmeExheW91dD1cImNvbHVtblwiIGZ4TGF5b3V0QWxpZ249XCJzdGFydCBjZW50ZXJcIiBmeEZsZXg+XG4gICAgPG5nLWNvbnRhaW5lciAqbmdJZj1cInVzZXJzJCB8IGFzeW5jIGFzIHVzZXJzXCI+XG4gICAgICAgIDxkaXYgKm5nSWY9XCIhbG9hZGluZyAmJiB1c2Vycy5sZW5ndGggPT09IDBcIiBmeEZsZXg9XCIxMDBcIiBmeExheW91dD1cImNvbHVtblwiIGZ4TGF5b3V0QWxpZ249XCJjZW50ZXIgY2VudGVyXCI+XG4gICAgICAgICAgICA8bWF0LWljb24gY29sb3I9XCJhY2NlbnRcIiBjbGFzcz1cIm1hcmdpbi1ib3R0b20tZGVmYXVsdFwiPnBlcnNvbl9hZGRfZGlzYWJsZWQ8L21hdC1pY29uPlxuICAgICAgICAgICAgPHNwYW4gY2xhc3M9XCJmb250LXNpemUtMjBcIj57eyAnc2lkZS1tZW51LnVzZXIubm9Vc2VyJyB8IHRyYW5zbGF0ZSB9fTwvc3Bhbj5cbiAgICAgICAgPC9kaXY+XG5cbiAgICAgICAgPGRpdiBjbGFzcz1cImZ1bGwtaGVpZ2h0IGZ1bGwtd2lkdGhcIiBmeEZsZXg9XCIxMDBcIj5cbiAgICAgICAgICAgIDxjZGstdmlydHVhbC1zY3JvbGwtdmlld3BvcnQgaXRlbVNpemU9XCI2MFwiIChzY3JvbGxlZEluZGV4Q2hhbmdlKT1cImxvYWROZXh0UGFnZSgpXCJcbiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgY2xhc3M9XCJmdWxsLWhlaWdodCBmdWxsLXdpZHRoXCI+XG4gICAgICAgICAgICAgICAgPG5jLW11bHRpLXVzZXItYXNzaWduLWl0ZW1cbiAgICAgICAgICAgICAgICAgICAgKmNka1ZpcnR1YWxGb3I9XCJsZXQgdXNlciBvZiB1c2VycztcbiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIHRyYWNrQnk6IHRyYWNrQnk7XG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICB0ZW1wbGF0ZUNhY2hlU2l6ZTogMFwiXG4gICAgICAgICAgICAgICAgICAgIFt1c2VyXT1cInVzZXJcIlxuICAgICAgICAgICAgICAgICAgICBbc2VsZWN0ZWRJZHMkXT1cInNlbGVjdGVkVXNlcnMkXCJcbiAgICAgICAgICAgICAgICAgICAgKGNsaWNrKT1cInNlbGVjdCh1c2VyKVwiPlxuICAgICAgICAgICAgICAgIDwvbmMtbXVsdGktdXNlci1hc3NpZ24taXRlbT5cblxuICAgICAgICAgICAgICAgIDxkaXYgKm5nSWY9XCJsb2FkaW5nXCIgZnhMYXlvdXQ9XCJjb2x1bW5cIiBmeExheW91dEFsaWduPVwiY2VudGVyIGNlbnRlclwiXG4gICAgICAgICAgICAgICAgICAgICBjbGFzcz1cIm1hcmdpbi10b3AtZGVmYXVsdFwiPlxuICAgICAgICAgICAgICAgICAgICA8bWF0LXNwaW5uZXIgY29sb3I9XCJwcmltYXJ5XCIgZGlhbWV0ZXI9XCI0MFwiPjwvbWF0LXNwaW5uZXI+XG4gICAgICAgICAgICAgICAgPC9kaXY+XG4gICAgICAgICAgICA8L2Nkay12aXJ0dWFsLXNjcm9sbC12aWV3cG9ydD5cbiAgICAgICAgPC9kaXY+XG4gICAgPC9uZy1jb250YWluZXI+XG48L2Rpdj5cbiJdfQ==