@vendure/admin-ui 1.7.4 → 1.8.1

package/bundles/vendure-admin-ui-customer.umd.js

@@ -1266,7 +1266,7 @@
     CustomerGroupListComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: 'vdr-customer-group-list',
-                    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",
+                    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\"\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: { count: selectedCustomerIds.length } }}\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",
                     changeDetection: i0.ChangeDetectionStrategy.OnPush,
                     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"]
                 },] }
@@ -1348,7 +1348,8 @@
                 this.selectionChange.emit(this.members.map(function (v) { return v.id; }));
             }
         };
-        CustomerGroupMemberListComponent.prototype.toggleSelectMember = function (member) {
+        CustomerGroupMemberListComponent.prototype.toggleSelectMember = function (_a) {
+            var member = _a.item;
             if (this.selectedMemberIds.includes(member.id)) {
                 this.selectionChange.emit(this.selectedMemberIds.filter(function (id) { return id !== member.id; }));
             }
@@ -1527,7 +1528,7 @@
     CustomerListComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: 'vdr-customer-list',
-                    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-customers-by-email-last-name-postal-code' | 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-list\"></vdr-action-bar-items>\r\n        <a class=\"btn btn-primary\" [routerLink]=\"['./create']\" *vdrIfPermissions=\"'CreateCustomer'\">\r\n            <clr-icon shape=\"plus\"></clr-icon>\r\n            {{ 'customer.create-new-customer' | translate }}\r\n        </a>\r\n    </vdr-ab-right>\r\n</vdr-action-bar>\r\n\r\n<vdr-data-table\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    <vdr-dt-column [expand]=\"true\">{{ 'customer.name' | translate }}</vdr-dt-column>\r\n    <vdr-dt-column [expand]=\"true\">{{ 'customer.email-address' | translate }}</vdr-dt-column>\r\n    <vdr-dt-column>{{ 'customer.customer-type' | translate }}</vdr-dt-column>\r\n    <vdr-dt-column></vdr-dt-column>\r\n    <vdr-dt-column></vdr-dt-column>\r\n    <ng-template let-customer=\"item\">\r\n        <td class=\"left align-middle\">\r\n            {{ customer.title }} {{ customer.firstName }} {{ customer.lastName }}\r\n        </td>\r\n        <td class=\"left align-middle\">{{ customer.emailAddress }}</td>\r\n        <td class=\"left align-middle\">\r\n            <vdr-customer-status-label [customer]=\"customer\"></vdr-customer-status-label>\r\n        </td>\r\n        <td class=\"right align-middle\">\r\n            <vdr-table-row-action\r\n                iconShape=\"edit\"\r\n                [label]=\"'common.edit' | translate\"\r\n                [linkTo]=\"['./', customer.id]\"\r\n            ></vdr-table-row-action>\r\n        </td>\r\n        <td>\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                        type=\"button\"\r\n                        class=\"delete-button\"\r\n                        (click)=\"deleteCustomer(customer)\"\r\n                        [disabled]=\"!('DeleteCustomer' | hasPermission)\"\r\n                        vdrDropdownItem\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",
+                    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-customers-by-email-last-name-postal-code' | translate\"\r\n            class=\"search-input\"\r\n        />\r\n    </vdr-ab-left>\r\n    <vdr-ab-right>\r\n        <vdr-action-bar-items locationId=\"customer-list\"></vdr-action-bar-items>\r\n        <a class=\"btn btn-primary\" [routerLink]=\"['./create']\" *vdrIfPermissions=\"'CreateCustomer'\">\r\n            <clr-icon shape=\"plus\"></clr-icon>\r\n            {{ 'customer.create-new-customer' | translate }}\r\n        </a>\r\n    </vdr-ab-right>\r\n</vdr-action-bar>\r\n\r\n<vdr-data-table\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    <vdr-dt-column [expand]=\"true\">{{ 'customer.name' | translate }}</vdr-dt-column>\r\n    <vdr-dt-column [expand]=\"true\">{{ 'customer.email-address' | translate }}</vdr-dt-column>\r\n    <vdr-dt-column>{{ 'customer.customer-type' | translate }}</vdr-dt-column>\r\n    <vdr-dt-column></vdr-dt-column>\r\n    <vdr-dt-column></vdr-dt-column>\r\n    <ng-template let-customer=\"item\">\r\n        <td class=\"left align-middle\">\r\n            {{ customer.title }} {{ customer.firstName }} {{ customer.lastName }}\r\n        </td>\r\n        <td class=\"left align-middle\">{{ customer.emailAddress }}</td>\r\n        <td class=\"left align-middle\">\r\n            <vdr-customer-status-label [customer]=\"customer\"></vdr-customer-status-label>\r\n        </td>\r\n        <td class=\"right align-middle\">\r\n            <vdr-table-row-action\r\n                iconShape=\"edit\"\r\n                [label]=\"'common.edit' | translate\"\r\n                [linkTo]=\"['./', customer.id]\"\r\n            ></vdr-table-row-action>\r\n        </td>\r\n        <td>\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                        type=\"button\"\r\n                        class=\"delete-button\"\r\n                        (click)=\"deleteCustomer(customer)\"\r\n                        [disabled]=\"!('DeleteCustomer' | hasPermission)\"\r\n                        vdrDropdownItem\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",
                     styles: [".search-input{margin-top:6px;min-width:300px}\n"]
                 },] }
     ];