@vendure/admin-ui 2.0.0-next.15 → 2.0.0-next.17

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.
Files changed (31) hide show
  1. package/core/common/utilities/configurable-operation-utils.d.ts +4 -1
  2. package/core/common/version.d.ts +1 -1
  3. package/esm2020/catalog/components/option-value-input/option-value-input.component.mjs +7 -2
  4. package/esm2020/core/common/utilities/configurable-operation-utils.mjs +7 -2
  5. package/esm2020/core/common/version.mjs +2 -2
  6. package/esm2020/core/components/app-shell/app-shell.component.mjs +2 -2
  7. package/esm2020/core/data/utils/remove-readonly-custom-fields.mjs +4 -1
  8. package/esm2020/core/shared/components/rich-text-editor/prosemirror/context-menu/context-menu.component.mjs +1 -1
  9. package/esm2020/core/shared/components/rich-text-editor/prosemirror/context-menu/context-menu.service.mjs +2 -2
  10. package/esm2020/core/shared/pipes/locale-currency.pipe.mjs +10 -2
  11. package/esm2020/customer/components/customer-group-list/customer-group-list.component.mjs +7 -6
  12. package/esm2020/order/components/order-editor/order-editor.component.mjs +12 -5
  13. package/fesm2015/vendure-admin-ui-catalog.mjs +7 -1
  14. package/fesm2015/vendure-admin-ui-catalog.mjs.map +1 -1
  15. package/fesm2015/vendure-admin-ui-core.mjs +23 -6
  16. package/fesm2015/vendure-admin-ui-core.mjs.map +1 -1
  17. package/fesm2015/vendure-admin-ui-customer.mjs +6 -5
  18. package/fesm2015/vendure-admin-ui-customer.mjs.map +1 -1
  19. package/fesm2015/vendure-admin-ui-order.mjs +8 -4
  20. package/fesm2015/vendure-admin-ui-order.mjs.map +1 -1
  21. package/fesm2020/vendure-admin-ui-catalog.mjs +6 -1
  22. package/fesm2020/vendure-admin-ui-catalog.mjs.map +1 -1
  23. package/fesm2020/vendure-admin-ui-core.mjs +22 -6
  24. package/fesm2020/vendure-admin-ui-core.mjs.map +1 -1
  25. package/fesm2020/vendure-admin-ui-customer.mjs +6 -5
  26. package/fesm2020/vendure-admin-ui-customer.mjs.map +1 -1
  27. package/fesm2020/vendure-admin-ui-order.mjs +11 -4
  28. package/fesm2020/vendure-admin-ui-order.mjs.map +1 -1
  29. package/package.json +2 -2
  30. package/static/styles/_variables.scss +1 -0
  31. package/static/styles/global/_sass-overrides.scss +1 -1
@@ -858,10 +858,9 @@ class CustomerGroupListComponent extends BaseListComponent {
858
858
  .fromComponent(CustomerGroupDetailDialogComponent, { locals: { group: { name: '' } } })
859
859
  .pipe(switchMap(result => result
860
860
  ? this.dataService.customer.createCustomerGroup(Object.assign(Object.assign({}, result), { customerIds: [] }))
861
- : EMPTY),
862
- // refresh list
863
- switchMap(() => this.dataService.customer.getCustomerGroupList().single$))
861
+ : EMPTY))
864
862
  .subscribe(() => {
863
+ this.refresh();
865
864
  this.notificationService.success(marker('common.notify-create-success'), {
866
865
  entity: 'CustomerGroup',
867
866
  });
@@ -896,6 +895,7 @@ class CustomerGroupListComponent extends BaseListComponent {
896
895
  this.notificationService.error(result.errorMessage);
897
896
  }
898
897
  else {
898
+ this.refresh();
899
899
  this.notificationService.success(marker('common.notify-delete-success'), {
900
900
  entity: 'CustomerGroup',
901
901
  });
@@ -913,6 +913,7 @@ class CustomerGroupListComponent extends BaseListComponent {
913
913
  ? this.dataService.customer.updateCustomerGroup(Object.assign({ id: group.id }, result))
914
914
  : EMPTY))
915
915
  .subscribe(() => {
916
+ this.refresh();
916
917
  this.notificationService.success(marker('common.notify-update-success'), {
917
918
  entity: 'CustomerGroup',
918
919
  });
@@ -967,10 +968,10 @@ class CustomerGroupListComponent extends BaseListComponent {
967
968
  }
968
969
  }
969
970
  CustomerGroupListComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.3", ngImport: i0, type: CustomerGroupListComponent, deps: [{ token: i1.DataService }, { token: i1.NotificationService }, { token: i1.ModalService }, { token: i2.ActivatedRoute }, { token: i2.Router }], target: i0.ɵɵFactoryTarget.Component });
970
- CustomerGroupListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.3", type: CustomerGroupListComponent, selector: "vdr-customer-group-list", usesInheritance: true, ngImport: i0, template: "<vdr-action-bar>\r\n <vdr-ab-left>\r\n <input\r\n type=\"text\"\r\n name=\"emailSearchTerm\"\r\n [formControl]=\"searchTerm\"\r\n [placeholder]=\"'customer.search-by-group-name' | translate\"\r\n class=\"search-input ml3\"\r\n />\r\n </vdr-ab-left>\r\n <vdr-ab-right>\r\n <vdr-action-bar-items locationId=\"customer-group-list\"></vdr-action-bar-items>\r\n <button class=\"btn btn-primary\" *vdrIfPermissions=\"'CreateCustomerGroup'\" (click)=\"create()\">\r\n <clr-icon shape=\"plus\"></clr-icon>\r\n {{ 'customer.create-new-customer-group' | translate }}\r\n </button>\r\n </vdr-ab-right>\r\n</vdr-action-bar>\r\n<div class=\"group-wrapper\">\r\n <div class=\"group-list\">\r\n <vdr-data-table\r\n [class.expanded]=\"activeGroup$ | async\"\r\n [items]=\"items$ | async\"\r\n [itemsPerPage]=\"itemsPerPage$ | async\"\r\n [totalItems]=\"totalItems$ | async\"\r\n [currentPage]=\"currentPage$ | async\"\r\n (pageChange)=\"setPageNumber($event)\"\r\n (itemsPerPageChange)=\"setItemsPerPage($event)\"\r\n >\r\n <ng-template let-group=\"item\">\r\n <td class=\"left align-middle\" [class.active]=\"group.id === activeGroupId\">\r\n <vdr-entity-info [entity]=\"group\"></vdr-entity-info>\r\n </td>\r\n <td class=\"left align-middle\" [class.active]=\"group.id === activeGroupId\">\r\n <vdr-chip [colorFrom]=\"group.id\">{{ group.name }}</vdr-chip>\r\n </td>\r\n <td class=\"left align-middle\" [class.active]=\"group.id === activeGroupId\">\r\n <a\r\n class=\"btn btn-link btn-sm\"\r\n [routerLink]=\"['./', { contents: group.id }]\"\r\n queryParamsHandling=\"preserve\"\r\n >\r\n <clr-icon shape=\"view-list\"></clr-icon>\r\n {{ 'customer.view-group-members' | translate }}\r\n </a>\r\n </td>\r\n <td class=\"right align-middle\" [class.active]=\"group.id === activeGroupId\">\r\n <button class=\"btn btn-link btn-sm\" (click)=\"update(group)\">\r\n <clr-icon shape=\"edit\"></clr-icon>\r\n {{ 'common.edit' | translate }}\r\n </button>\r\n </td>\r\n <td [class.active]=\"group.id === activeGroupId\">\r\n <vdr-dropdown>\r\n <button type=\"button\" class=\"btn btn-link btn-sm\" vdrDropdownTrigger>\r\n {{ 'common.actions' | translate }}\r\n <clr-icon shape=\"caret down\"></clr-icon>\r\n </button>\r\n <vdr-dropdown-menu vdrPosition=\"bottom-right\">\r\n <button\r\n class=\"button\"\r\n vdrDropdownItem\r\n (click)=\"delete(group.id)\"\r\n [disabled]=\"!('DeleteCustomerGroup' | hasPermission)\"\r\n >\r\n <clr-icon shape=\"trash\" class=\"is-danger\"></clr-icon>\r\n {{ 'common.delete' | translate }}\r\n </button>\r\n </vdr-dropdown-menu>\r\n </vdr-dropdown>\r\n </td>\r\n </ng-template>\r\n </vdr-data-table>\r\n\r\n <table class=\"table mt0\" *ngIf=\"!(listIsEmpty$ | async); else emptyPlaceholder\">\r\n <tbody>\r\n <tr\r\n *ngFor=\"let group of items$ | async\"\r\n [class.active]=\"group.id === (activeGroup$ | async)?.id\"\r\n ></tr>\r\n </tbody>\r\n </table>\r\n </div>\r\n <ng-template #emptyPlaceholder>\r\n <vdr-empty-placeholder></vdr-empty-placeholder>\r\n </ng-template>\r\n <div class=\"group-members\" [class.expanded]=\"activeGroup$ | async\">\r\n <ng-container *ngIf=\"activeGroup$ | async as activeGroup\">\r\n <div class=\"flex\">\r\n <div class=\"header-title-row\">{{ activeGroup.name }} ({{ membersTotal$ | async }})</div>\r\n <div class=\"flex-spacer\"></div>\r\n <button type=\"button\" class=\"close-button\" (click)=\"closeMembers()\">\r\n <clr-icon shape=\"close\"></clr-icon>\r\n </button>\r\n </div>\r\n <div class=\"controls\">\r\n <vdr-dropdown>\r\n <button\r\n type=\"button\"\r\n class=\"btn btn-secondary btn-sm\"\r\n vdrDropdownTrigger\r\n [disabled]=\"selectedCustomerIds.length === 0\"\r\n >\r\n {{ 'common.with-selected' | translate }}\r\n <clr-icon shape=\"caret down\"></clr-icon>\r\n </button>\r\n <vdr-dropdown-menu vdrPosition=\"bottom-right\">\r\n <button\r\n type=\"button\"\r\n class=\"delete-button\"\r\n (click)=\"removeFromGroup(activeGroup, selectedCustomerIds)\"\r\n vdrDropdownItem\r\n [disabled]=\"!('UpdateCustomerGroup' | hasPermission)\"\r\n >\r\n <clr-icon shape=\"trash\" class=\"is-danger\"></clr-icon>\r\n {{ 'customer.remove-from-group' | translate }}\r\n </button>\r\n </vdr-dropdown-menu>\r\n </vdr-dropdown>\r\n <button class=\"btn btn-secondary btn-sm\" (click)=\"addToGroup(activeGroup)\">\r\n {{ 'customer.add-customers-to-group' | translate: { groupName: activeGroup.name } }}\r\n </button>\r\n </div>\r\n <vdr-customer-group-member-list\r\n [members]=\"members$ | async\"\r\n [route]=\"route\"\r\n [totalItems]=\"membersTotal$ | async\"\r\n [selectedMemberIds]=\"selectedCustomerIds\"\r\n (selectionChange)=\"selectedCustomerIds = $event\"\r\n (fetchParamsChange)=\"fetchGroupMembers$.next($event)\"\r\n ></vdr-customer-group-member-list>\r\n </ng-container>\r\n </div>\r\n</div>\r\n", styles: [".group-wrapper{display:flex;height:calc(100% - 50px)}.group-wrapper .group-list{flex:1;overflow:auto;margin-top:0}.group-wrapper .group-list .active{background-color:var(--clr-global-selection-color)}.group-wrapper .group-list.expanded{width:calc(100% - 40vw)}vdr-data-table ::ng-deep table{margin-top:0}.group-members{height:100%;width:0;opacity:0;visibility:hidden;overflow:auto;transition:width .3s,opacity .2s .3s,visibility 0s .3s}.group-members.expanded{width:40vw;visibility:visible;opacity:1;padding-left:12px}.group-members .close-button{margin:0;background:none;border:none;cursor:pointer}.group-members ::ng-deep table.table{margin-top:0}.group-members ::ng-deep table.table th{top:0}.group-members .controls{display:flex;justify-content:space-between}vdr-empty-placeholder{flex:1}\n"], components: [{ type: i1.ActionBarComponent, selector: "vdr-action-bar" }, { type: i1.ActionBarLeftComponent, selector: "vdr-ab-left", inputs: ["grow"] }, { type: i1.ActionBarRightComponent, selector: "vdr-ab-right", inputs: ["grow"] }, { type: i1.ActionBarItemsComponent, selector: "vdr-action-bar-items", inputs: ["locationId"] }, { type: i1.DataTableComponent, selector: "vdr-data-table", inputs: ["items", "itemsPerPage", "currentPage", "totalItems", "allSelected", "isRowSelectedFn", "emptyStateLabel"], outputs: ["allSelectChange", "rowSelectChange", "pageChange", "itemsPerPageChange"] }, { type: i1.EntityInfoComponent, selector: "vdr-entity-info", inputs: ["small", "entity"] }, { type: i1.ChipComponent, selector: "vdr-chip", inputs: ["icon", "invert", "colorFrom", "colorType"], outputs: ["iconClick"] }, { type: i1.DropdownComponent, selector: "vdr-dropdown", inputs: ["manualToggle"] }, { type: i1.DropdownMenuComponent, selector: "vdr-dropdown-menu", inputs: ["vdrPosition", "customClasses"] }, { type: i1.EmptyPlaceholderComponent, selector: "vdr-empty-placeholder", inputs: ["emptyStateLabel"] }, { type: CustomerGroupMemberListComponent, selector: "vdr-customer-group-member-list", inputs: ["members", "totalItems", "route", "selectedMemberIds"], outputs: ["selectionChange", "fetchParamsChange"] }], directives: [{ type: i1.FormFieldControlDirective, selector: "input, textarea, select" }, { type: i3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i3.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i1.IfPermissionsDirective, selector: "[vdrIfPermissions]", inputs: ["vdrIfPermissions", "vdrIfPermissionsElse"] }, { type: i3$2.ClrIconCustomTag, selector: "clr-icon" }, { type: i2.RouterLinkWithHref, selector: "a[routerLink],area[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "preserveFragment", "skipLocationChange", "replaceUrl", "state", "relativeTo", "routerLink"] }, { type: i1.DropdownTriggerDirective, selector: "[vdrDropdownTrigger]" }, { type: i1.DropdownItemDirective, selector: "[vdrDropdownItem]" }, { type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], pipes: { "translate": i4.TranslatePipe, "async": i3$1.AsyncPipe, "hasPermission": i1.HasPermissionPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
971
+ CustomerGroupListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.3", type: CustomerGroupListComponent, selector: "vdr-customer-group-list", usesInheritance: true, ngImport: i0, template: "<vdr-action-bar>\r\n <vdr-ab-left>\r\n <input\r\n type=\"text\"\r\n name=\"emailSearchTerm\"\r\n [formControl]=\"searchTerm\"\r\n [placeholder]=\"'customer.search-by-group-name' | translate\"\r\n class=\"search-input ml3\"\r\n />\r\n </vdr-ab-left>\r\n <vdr-ab-right>\r\n <vdr-action-bar-items locationId=\"customer-group-list\"></vdr-action-bar-items>\r\n <button class=\"btn btn-primary\" *vdrIfPermissions=\"'CreateCustomerGroup'\" (click)=\"create()\">\r\n <clr-icon shape=\"plus\"></clr-icon>\r\n {{ 'customer.create-new-customer-group' | translate }}\r\n </button>\r\n </vdr-ab-right>\r\n</vdr-action-bar>\r\n<div class=\"group-wrapper\">\r\n <div class=\"group-list\">\r\n <vdr-data-table\r\n [class.expanded]=\"activeGroup$ | async\"\r\n [items]=\"items$ | async\"\r\n [itemsPerPage]=\"itemsPerPage$ | async\"\r\n [totalItems]=\"totalItems$ | async\"\r\n [currentPage]=\"currentPage$ | async\"\r\n (pageChange)=\"setPageNumber($event)\"\r\n (itemsPerPageChange)=\"setItemsPerPage($event)\"\r\n >\r\n <ng-template let-group=\"item\">\r\n <td class=\"left align-middle\" [class.active]=\"group.id === activeGroupId\">\r\n <vdr-entity-info [entity]=\"group\"></vdr-entity-info>\r\n </td>\r\n <td class=\"left align-middle\" [class.active]=\"group.id === activeGroupId\">\r\n <vdr-chip [colorFrom]=\"group.id\">{{ group.name }}</vdr-chip>\r\n </td>\r\n <td class=\"left align-middle\" [class.active]=\"group.id === activeGroupId\">\r\n <a\r\n class=\"btn btn-link btn-sm\"\r\n [routerLink]=\"['./', { contents: group.id }]\"\r\n queryParamsHandling=\"preserve\"\r\n >\r\n <clr-icon shape=\"view-list\"></clr-icon>\r\n {{ 'customer.view-group-members' | translate }}\r\n </a>\r\n </td>\r\n <td class=\"right align-middle\" [class.active]=\"group.id === activeGroupId\">\r\n <button class=\"btn btn-link btn-sm\" (click)=\"update(group)\">\r\n <clr-icon shape=\"edit\"></clr-icon>\r\n {{ 'common.edit' | translate }}\r\n </button>\r\n </td>\r\n <td [class.active]=\"group.id === activeGroupId\" class=\"align-middle\">\r\n <vdr-dropdown>\r\n <button type=\"button\" class=\"btn btn-link btn-sm\" vdrDropdownTrigger>\r\n {{ 'common.actions' | translate }}\r\n <clr-icon shape=\"caret down\"></clr-icon>\r\n </button>\r\n <vdr-dropdown-menu vdrPosition=\"bottom-right\">\r\n <button\r\n class=\"button\"\r\n vdrDropdownItem\r\n (click)=\"delete(group.id)\"\r\n [disabled]=\"!('DeleteCustomerGroup' | hasPermission)\"\r\n >\r\n <clr-icon shape=\"trash\" class=\"is-danger\"></clr-icon>\r\n {{ 'common.delete' | translate }}\r\n </button>\r\n </vdr-dropdown-menu>\r\n </vdr-dropdown>\r\n </td>\r\n </ng-template>\r\n </vdr-data-table>\r\n </div>\r\n <ng-template #emptyPlaceholder>\r\n <vdr-empty-placeholder></vdr-empty-placeholder>\r\n </ng-template>\r\n <div class=\"group-members\" [class.expanded]=\"activeGroup$ | async\">\r\n <ng-container *ngIf=\"activeGroup$ | async as activeGroup\">\r\n <div class=\"flex\">\r\n <div class=\"header-title-row\">{{ activeGroup.name }} ({{ membersTotal$ | async }})</div>\r\n <div class=\"flex-spacer\"></div>\r\n <button type=\"button\" class=\"close-button\" (click)=\"closeMembers()\">\r\n <clr-icon shape=\"close\"></clr-icon>\r\n </button>\r\n </div>\r\n <div class=\"controls\">\r\n <vdr-dropdown>\r\n <button\r\n type=\"button\"\r\n class=\"btn btn-secondary btn-sm\"\r\n vdrDropdownTrigger\r\n [disabled]=\"selectedCustomerIds.length === 0\"\r\n >\r\n {{ 'common.with-selected' | translate }}\r\n <clr-icon shape=\"caret down\"></clr-icon>\r\n </button>\r\n <vdr-dropdown-menu vdrPosition=\"bottom-right\">\r\n <button\r\n type=\"button\"\r\n class=\"delete-button\"\r\n (click)=\"removeFromGroup(activeGroup, selectedCustomerIds)\"\r\n vdrDropdownItem\r\n [disabled]=\"!('UpdateCustomerGroup' | hasPermission)\"\r\n >\r\n <clr-icon shape=\"trash\" class=\"is-danger\"></clr-icon>\r\n {{ 'customer.remove-from-group' | translate }}\r\n </button>\r\n </vdr-dropdown-menu>\r\n </vdr-dropdown>\r\n <button class=\"btn btn-secondary btn-sm\" (click)=\"addToGroup(activeGroup)\">\r\n {{ 'customer.add-customers-to-group' | translate: { groupName: activeGroup.name } }}\r\n </button>\r\n </div>\r\n <vdr-customer-group-member-list\r\n [members]=\"members$ | async\"\r\n [route]=\"route\"\r\n [totalItems]=\"membersTotal$ | async\"\r\n [selectedMemberIds]=\"selectedCustomerIds\"\r\n (selectionChange)=\"selectedCustomerIds = $event\"\r\n (fetchParamsChange)=\"fetchGroupMembers$.next($event)\"\r\n ></vdr-customer-group-member-list>\r\n </ng-container>\r\n </div>\r\n</div>\r\n", styles: [".group-wrapper{display:flex;height:calc(100% - 50px)}.group-wrapper .group-list{flex:1;overflow:auto;margin-top:0}.group-wrapper .group-list .active{background-color:var(--clr-global-selection-color)}.group-wrapper .group-list.expanded{width:calc(100% - 40vw)}vdr-data-table ::ng-deep table{margin-top:0}.group-members{height:100%;width:0;opacity:0;visibility:hidden;overflow:auto;transition:width .3s,opacity .2s .3s,visibility 0s .3s}.group-members.expanded{width:40vw;visibility:visible;opacity:1;padding-left:12px}.group-members .close-button{margin:0;background:none;border:none;cursor:pointer}.group-members ::ng-deep table.table{margin-top:0}.group-members ::ng-deep table.table th{top:0}.group-members .controls{display:flex;justify-content:space-between}vdr-empty-placeholder{flex:1}\n"], components: [{ type: i1.ActionBarComponent, selector: "vdr-action-bar" }, { type: i1.ActionBarLeftComponent, selector: "vdr-ab-left", inputs: ["grow"] }, { type: i1.ActionBarRightComponent, selector: "vdr-ab-right", inputs: ["grow"] }, { type: i1.ActionBarItemsComponent, selector: "vdr-action-bar-items", inputs: ["locationId"] }, { type: i1.DataTableComponent, selector: "vdr-data-table", inputs: ["items", "itemsPerPage", "currentPage", "totalItems", "allSelected", "isRowSelectedFn", "emptyStateLabel"], outputs: ["allSelectChange", "rowSelectChange", "pageChange", "itemsPerPageChange"] }, { type: i1.EntityInfoComponent, selector: "vdr-entity-info", inputs: ["small", "entity"] }, { type: i1.ChipComponent, selector: "vdr-chip", inputs: ["icon", "invert", "colorFrom", "colorType"], outputs: ["iconClick"] }, { type: i1.DropdownComponent, selector: "vdr-dropdown", inputs: ["manualToggle"] }, { type: i1.DropdownMenuComponent, selector: "vdr-dropdown-menu", inputs: ["vdrPosition", "customClasses"] }, { type: i1.EmptyPlaceholderComponent, selector: "vdr-empty-placeholder", inputs: ["emptyStateLabel"] }, { type: CustomerGroupMemberListComponent, selector: "vdr-customer-group-member-list", inputs: ["members", "totalItems", "route", "selectedMemberIds"], outputs: ["selectionChange", "fetchParamsChange"] }], directives: [{ type: i1.FormFieldControlDirective, selector: "input, textarea, select" }, { type: i3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i3.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i1.IfPermissionsDirective, selector: "[vdrIfPermissions]", inputs: ["vdrIfPermissions", "vdrIfPermissionsElse"] }, { type: i3$2.ClrIconCustomTag, selector: "clr-icon" }, { type: i2.RouterLinkWithHref, selector: "a[routerLink],area[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "preserveFragment", "skipLocationChange", "replaceUrl", "state", "relativeTo", "routerLink"] }, { type: i1.DropdownTriggerDirective, selector: "[vdrDropdownTrigger]" }, { type: i1.DropdownItemDirective, selector: "[vdrDropdownItem]" }, { type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "translate": i4.TranslatePipe, "async": i3$1.AsyncPipe, "hasPermission": i1.HasPermissionPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
971
972
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.3", ngImport: i0, type: CustomerGroupListComponent, decorators: [{
972
973
  type: Component,
973
- args: [{ selector: 'vdr-customer-group-list', changeDetection: ChangeDetectionStrategy.OnPush, template: "<vdr-action-bar>\r\n <vdr-ab-left>\r\n <input\r\n type=\"text\"\r\n name=\"emailSearchTerm\"\r\n [formControl]=\"searchTerm\"\r\n [placeholder]=\"'customer.search-by-group-name' | translate\"\r\n class=\"search-input ml3\"\r\n />\r\n </vdr-ab-left>\r\n <vdr-ab-right>\r\n <vdr-action-bar-items locationId=\"customer-group-list\"></vdr-action-bar-items>\r\n <button class=\"btn btn-primary\" *vdrIfPermissions=\"'CreateCustomerGroup'\" (click)=\"create()\">\r\n <clr-icon shape=\"plus\"></clr-icon>\r\n {{ 'customer.create-new-customer-group' | translate }}\r\n </button>\r\n </vdr-ab-right>\r\n</vdr-action-bar>\r\n<div class=\"group-wrapper\">\r\n <div class=\"group-list\">\r\n <vdr-data-table\r\n [class.expanded]=\"activeGroup$ | async\"\r\n [items]=\"items$ | async\"\r\n [itemsPerPage]=\"itemsPerPage$ | async\"\r\n [totalItems]=\"totalItems$ | async\"\r\n [currentPage]=\"currentPage$ | async\"\r\n (pageChange)=\"setPageNumber($event)\"\r\n (itemsPerPageChange)=\"setItemsPerPage($event)\"\r\n >\r\n <ng-template let-group=\"item\">\r\n <td class=\"left align-middle\" [class.active]=\"group.id === activeGroupId\">\r\n <vdr-entity-info [entity]=\"group\"></vdr-entity-info>\r\n </td>\r\n <td class=\"left align-middle\" [class.active]=\"group.id === activeGroupId\">\r\n <vdr-chip [colorFrom]=\"group.id\">{{ group.name }}</vdr-chip>\r\n </td>\r\n <td class=\"left align-middle\" [class.active]=\"group.id === activeGroupId\">\r\n <a\r\n class=\"btn btn-link btn-sm\"\r\n [routerLink]=\"['./', { contents: group.id }]\"\r\n queryParamsHandling=\"preserve\"\r\n >\r\n <clr-icon shape=\"view-list\"></clr-icon>\r\n {{ 'customer.view-group-members' | translate }}\r\n </a>\r\n </td>\r\n <td class=\"right align-middle\" [class.active]=\"group.id === activeGroupId\">\r\n <button class=\"btn btn-link btn-sm\" (click)=\"update(group)\">\r\n <clr-icon shape=\"edit\"></clr-icon>\r\n {{ 'common.edit' | translate }}\r\n </button>\r\n </td>\r\n <td [class.active]=\"group.id === activeGroupId\">\r\n <vdr-dropdown>\r\n <button type=\"button\" class=\"btn btn-link btn-sm\" vdrDropdownTrigger>\r\n {{ 'common.actions' | translate }}\r\n <clr-icon shape=\"caret down\"></clr-icon>\r\n </button>\r\n <vdr-dropdown-menu vdrPosition=\"bottom-right\">\r\n <button\r\n class=\"button\"\r\n vdrDropdownItem\r\n (click)=\"delete(group.id)\"\r\n [disabled]=\"!('DeleteCustomerGroup' | hasPermission)\"\r\n >\r\n <clr-icon shape=\"trash\" class=\"is-danger\"></clr-icon>\r\n {{ 'common.delete' | translate }}\r\n </button>\r\n </vdr-dropdown-menu>\r\n </vdr-dropdown>\r\n </td>\r\n </ng-template>\r\n </vdr-data-table>\r\n\r\n <table class=\"table mt0\" *ngIf=\"!(listIsEmpty$ | async); else emptyPlaceholder\">\r\n <tbody>\r\n <tr\r\n *ngFor=\"let group of items$ | async\"\r\n [class.active]=\"group.id === (activeGroup$ | async)?.id\"\r\n ></tr>\r\n </tbody>\r\n </table>\r\n </div>\r\n <ng-template #emptyPlaceholder>\r\n <vdr-empty-placeholder></vdr-empty-placeholder>\r\n </ng-template>\r\n <div class=\"group-members\" [class.expanded]=\"activeGroup$ | async\">\r\n <ng-container *ngIf=\"activeGroup$ | async as activeGroup\">\r\n <div class=\"flex\">\r\n <div class=\"header-title-row\">{{ activeGroup.name }} ({{ membersTotal$ | async }})</div>\r\n <div class=\"flex-spacer\"></div>\r\n <button type=\"button\" class=\"close-button\" (click)=\"closeMembers()\">\r\n <clr-icon shape=\"close\"></clr-icon>\r\n </button>\r\n </div>\r\n <div class=\"controls\">\r\n <vdr-dropdown>\r\n <button\r\n type=\"button\"\r\n class=\"btn btn-secondary btn-sm\"\r\n vdrDropdownTrigger\r\n [disabled]=\"selectedCustomerIds.length === 0\"\r\n >\r\n {{ 'common.with-selected' | translate }}\r\n <clr-icon shape=\"caret down\"></clr-icon>\r\n </button>\r\n <vdr-dropdown-menu vdrPosition=\"bottom-right\">\r\n <button\r\n type=\"button\"\r\n class=\"delete-button\"\r\n (click)=\"removeFromGroup(activeGroup, selectedCustomerIds)\"\r\n vdrDropdownItem\r\n [disabled]=\"!('UpdateCustomerGroup' | hasPermission)\"\r\n >\r\n <clr-icon shape=\"trash\" class=\"is-danger\"></clr-icon>\r\n {{ 'customer.remove-from-group' | translate }}\r\n </button>\r\n </vdr-dropdown-menu>\r\n </vdr-dropdown>\r\n <button class=\"btn btn-secondary btn-sm\" (click)=\"addToGroup(activeGroup)\">\r\n {{ 'customer.add-customers-to-group' | translate: { groupName: activeGroup.name } }}\r\n </button>\r\n </div>\r\n <vdr-customer-group-member-list\r\n [members]=\"members$ | async\"\r\n [route]=\"route\"\r\n [totalItems]=\"membersTotal$ | async\"\r\n [selectedMemberIds]=\"selectedCustomerIds\"\r\n (selectionChange)=\"selectedCustomerIds = $event\"\r\n (fetchParamsChange)=\"fetchGroupMembers$.next($event)\"\r\n ></vdr-customer-group-member-list>\r\n </ng-container>\r\n </div>\r\n</div>\r\n", styles: [".group-wrapper{display:flex;height:calc(100% - 50px)}.group-wrapper .group-list{flex:1;overflow:auto;margin-top:0}.group-wrapper .group-list .active{background-color:var(--clr-global-selection-color)}.group-wrapper .group-list.expanded{width:calc(100% - 40vw)}vdr-data-table ::ng-deep table{margin-top:0}.group-members{height:100%;width:0;opacity:0;visibility:hidden;overflow:auto;transition:width .3s,opacity .2s .3s,visibility 0s .3s}.group-members.expanded{width:40vw;visibility:visible;opacity:1;padding-left:12px}.group-members .close-button{margin:0;background:none;border:none;cursor:pointer}.group-members ::ng-deep table.table{margin-top:0}.group-members ::ng-deep table.table th{top:0}.group-members .controls{display:flex;justify-content:space-between}vdr-empty-placeholder{flex:1}\n"] }]
974
+ args: [{ selector: 'vdr-customer-group-list', changeDetection: ChangeDetectionStrategy.OnPush, template: "<vdr-action-bar>\r\n <vdr-ab-left>\r\n <input\r\n type=\"text\"\r\n name=\"emailSearchTerm\"\r\n [formControl]=\"searchTerm\"\r\n [placeholder]=\"'customer.search-by-group-name' | translate\"\r\n class=\"search-input ml3\"\r\n />\r\n </vdr-ab-left>\r\n <vdr-ab-right>\r\n <vdr-action-bar-items locationId=\"customer-group-list\"></vdr-action-bar-items>\r\n <button class=\"btn btn-primary\" *vdrIfPermissions=\"'CreateCustomerGroup'\" (click)=\"create()\">\r\n <clr-icon shape=\"plus\"></clr-icon>\r\n {{ 'customer.create-new-customer-group' | translate }}\r\n </button>\r\n </vdr-ab-right>\r\n</vdr-action-bar>\r\n<div class=\"group-wrapper\">\r\n <div class=\"group-list\">\r\n <vdr-data-table\r\n [class.expanded]=\"activeGroup$ | async\"\r\n [items]=\"items$ | async\"\r\n [itemsPerPage]=\"itemsPerPage$ | async\"\r\n [totalItems]=\"totalItems$ | async\"\r\n [currentPage]=\"currentPage$ | async\"\r\n (pageChange)=\"setPageNumber($event)\"\r\n (itemsPerPageChange)=\"setItemsPerPage($event)\"\r\n >\r\n <ng-template let-group=\"item\">\r\n <td class=\"left align-middle\" [class.active]=\"group.id === activeGroupId\">\r\n <vdr-entity-info [entity]=\"group\"></vdr-entity-info>\r\n </td>\r\n <td class=\"left align-middle\" [class.active]=\"group.id === activeGroupId\">\r\n <vdr-chip [colorFrom]=\"group.id\">{{ group.name }}</vdr-chip>\r\n </td>\r\n <td class=\"left align-middle\" [class.active]=\"group.id === activeGroupId\">\r\n <a\r\n class=\"btn btn-link btn-sm\"\r\n [routerLink]=\"['./', { contents: group.id }]\"\r\n queryParamsHandling=\"preserve\"\r\n >\r\n <clr-icon shape=\"view-list\"></clr-icon>\r\n {{ 'customer.view-group-members' | translate }}\r\n </a>\r\n </td>\r\n <td class=\"right align-middle\" [class.active]=\"group.id === activeGroupId\">\r\n <button class=\"btn btn-link btn-sm\" (click)=\"update(group)\">\r\n <clr-icon shape=\"edit\"></clr-icon>\r\n {{ 'common.edit' | translate }}\r\n </button>\r\n </td>\r\n <td [class.active]=\"group.id === activeGroupId\" class=\"align-middle\">\r\n <vdr-dropdown>\r\n <button type=\"button\" class=\"btn btn-link btn-sm\" vdrDropdownTrigger>\r\n {{ 'common.actions' | translate }}\r\n <clr-icon shape=\"caret down\"></clr-icon>\r\n </button>\r\n <vdr-dropdown-menu vdrPosition=\"bottom-right\">\r\n <button\r\n class=\"button\"\r\n vdrDropdownItem\r\n (click)=\"delete(group.id)\"\r\n [disabled]=\"!('DeleteCustomerGroup' | hasPermission)\"\r\n >\r\n <clr-icon shape=\"trash\" class=\"is-danger\"></clr-icon>\r\n {{ 'common.delete' | translate }}\r\n </button>\r\n </vdr-dropdown-menu>\r\n </vdr-dropdown>\r\n </td>\r\n </ng-template>\r\n </vdr-data-table>\r\n </div>\r\n <ng-template #emptyPlaceholder>\r\n <vdr-empty-placeholder></vdr-empty-placeholder>\r\n </ng-template>\r\n <div class=\"group-members\" [class.expanded]=\"activeGroup$ | async\">\r\n <ng-container *ngIf=\"activeGroup$ | async as activeGroup\">\r\n <div class=\"flex\">\r\n <div class=\"header-title-row\">{{ activeGroup.name }} ({{ membersTotal$ | async }})</div>\r\n <div class=\"flex-spacer\"></div>\r\n <button type=\"button\" class=\"close-button\" (click)=\"closeMembers()\">\r\n <clr-icon shape=\"close\"></clr-icon>\r\n </button>\r\n </div>\r\n <div class=\"controls\">\r\n <vdr-dropdown>\r\n <button\r\n type=\"button\"\r\n class=\"btn btn-secondary btn-sm\"\r\n vdrDropdownTrigger\r\n [disabled]=\"selectedCustomerIds.length === 0\"\r\n >\r\n {{ 'common.with-selected' | translate }}\r\n <clr-icon shape=\"caret down\"></clr-icon>\r\n </button>\r\n <vdr-dropdown-menu vdrPosition=\"bottom-right\">\r\n <button\r\n type=\"button\"\r\n class=\"delete-button\"\r\n (click)=\"removeFromGroup(activeGroup, selectedCustomerIds)\"\r\n vdrDropdownItem\r\n [disabled]=\"!('UpdateCustomerGroup' | hasPermission)\"\r\n >\r\n <clr-icon shape=\"trash\" class=\"is-danger\"></clr-icon>\r\n {{ 'customer.remove-from-group' | translate }}\r\n </button>\r\n </vdr-dropdown-menu>\r\n </vdr-dropdown>\r\n <button class=\"btn btn-secondary btn-sm\" (click)=\"addToGroup(activeGroup)\">\r\n {{ 'customer.add-customers-to-group' | translate: { groupName: activeGroup.name } }}\r\n </button>\r\n </div>\r\n <vdr-customer-group-member-list\r\n [members]=\"members$ | async\"\r\n [route]=\"route\"\r\n [totalItems]=\"membersTotal$ | async\"\r\n [selectedMemberIds]=\"selectedCustomerIds\"\r\n (selectionChange)=\"selectedCustomerIds = $event\"\r\n (fetchParamsChange)=\"fetchGroupMembers$.next($event)\"\r\n ></vdr-customer-group-member-list>\r\n </ng-container>\r\n </div>\r\n</div>\r\n", styles: [".group-wrapper{display:flex;height:calc(100% - 50px)}.group-wrapper .group-list{flex:1;overflow:auto;margin-top:0}.group-wrapper .group-list .active{background-color:var(--clr-global-selection-color)}.group-wrapper .group-list.expanded{width:calc(100% - 40vw)}vdr-data-table ::ng-deep table{margin-top:0}.group-members{height:100%;width:0;opacity:0;visibility:hidden;overflow:auto;transition:width .3s,opacity .2s .3s,visibility 0s .3s}.group-members.expanded{width:40vw;visibility:visible;opacity:1;padding-left:12px}.group-members .close-button{margin:0;background:none;border:none;cursor:pointer}.group-members ::ng-deep table.table{margin-top:0}.group-members ::ng-deep table.table th{top:0}.group-members .controls{display:flex;justify-content:space-between}vdr-empty-placeholder{flex:1}\n"] }]
974
975
  }], ctorParameters: function () { return [{ type: i1.DataService }, { type: i1.NotificationService }, { type: i1.ModalService }, { type: i2.ActivatedRoute }, { type: i2.Router }]; } });
975
976
 
976
977
  class CustomerListComponent extends BaseListComponent {