@vendure/admin-ui 1.7.0 → 1.7.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (40) hide show
  1. package/bundles/vendure-admin-ui-catalog.umd.js +8 -1
  2. package/bundles/vendure-admin-ui-catalog.umd.js.map +1 -1
  3. package/bundles/vendure-admin-ui-core.umd.js +28 -11
  4. package/bundles/vendure-admin-ui-core.umd.js.map +1 -1
  5. package/bundles/vendure-admin-ui-customer.umd.js +5 -4
  6. package/bundles/vendure-admin-ui-customer.umd.js.map +1 -1
  7. package/bundles/vendure-admin-ui-order.umd.js +10 -7
  8. package/bundles/vendure-admin-ui-order.umd.js.map +1 -1
  9. package/core/common/generated-types.d.ts +2 -1
  10. package/core/common/utilities/configurable-operation-utils.d.ts +4 -1
  11. package/core/common/version.d.ts +1 -1
  12. package/core/vendure-admin-ui-core.metadata.json +1 -1
  13. package/customer/vendure-admin-ui-customer.metadata.json +1 -1
  14. package/esm2015/catalog/components/generate-product-variants/generate-product-variants.component.js +1 -1
  15. package/esm2015/catalog/components/option-value-input/option-value-input.component.js +8 -2
  16. package/esm2015/core/common/generated-types.js +2 -2
  17. package/esm2015/core/common/introspection-result.js +1 -1
  18. package/esm2015/core/common/utilities/configurable-operation-utils.js +8 -2
  19. package/esm2015/core/common/version.js +2 -2
  20. package/esm2015/core/components/app-shell/app-shell.component.js +1 -1
  21. package/esm2015/core/data/definitions/order-definitions.js +443 -443
  22. package/esm2015/core/data/definitions/product-definitions.js +743 -743
  23. package/esm2015/core/data/utils/remove-readonly-custom-fields.js +4 -1
  24. package/esm2015/core/shared/components/dropdown/dropdown-menu.component.js +11 -11
  25. package/esm2015/core/shared/components/dropdown/dropdown-trigger.directive.js +1 -1
  26. package/esm2015/core/shared/pipes/locale-currency.pipe.js +10 -2
  27. package/esm2015/customer/components/customer-group-list/customer-group-list.component.js +6 -5
  28. package/esm2015/order/components/order-editor/order-editor.component.js +9 -5
  29. package/fesm2015/vendure-admin-ui-catalog.js +7 -1
  30. package/fesm2015/vendure-admin-ui-catalog.js.map +1 -1
  31. package/fesm2015/vendure-admin-ui-core.js +1260 -1243
  32. package/fesm2015/vendure-admin-ui-core.js.map +1 -1
  33. package/fesm2015/vendure-admin-ui-customer.js +5 -4
  34. package/fesm2015/vendure-admin-ui-customer.js.map +1 -1
  35. package/fesm2015/vendure-admin-ui-order.js +8 -4
  36. package/fesm2015/vendure-admin-ui-order.js.map +1 -1
  37. package/order/vendure-admin-ui-order.metadata.json +1 -1
  38. package/package.json +2 -2
  39. package/static/styles/_variables.scss +1 -0
  40. package/static/styles/global/_sass-overrides.scss +1 -1
@@ -1,8 +1,8 @@
1
1
  (function (global, factory) {
2
- typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core'), require('@angular/forms'), require('@vendure/admin-ui/core'), require('@biesbjerg/ngx-translate-extract-marker'), require('@vendure/common/lib/shared-utils'), require('@angular/router'), require('rxjs'), require('rxjs/operators')) :
3
- typeof define === 'function' && define.amd ? define('@vendure/admin-ui/order', ['exports', '@angular/core', '@angular/forms', '@vendure/admin-ui/core', '@biesbjerg/ngx-translate-extract-marker', '@vendure/common/lib/shared-utils', '@angular/router', 'rxjs', 'rxjs/operators'], factory) :
4
- (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory((global.vendure = global.vendure || {}, global.vendure['admin-ui'] = global.vendure['admin-ui'] || {}, global.vendure['admin-ui'].order = {}), global.ng.core, global.ng.forms, global.vendure['admin-ui'].core, global.ngxTranslateExtractMarker, global.sharedUtils, global.ng.router, global.rxjs, global.rxjs.operators));
5
- }(this, (function (exports, i0, forms, i1, ngxTranslateExtractMarker, sharedUtils, i1$1, rxjs, operators) { 'use strict';
2
+ typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core'), require('@angular/forms'), require('@vendure/admin-ui/core'), require('@biesbjerg/ngx-translate-extract-marker'), require('@vendure/common/lib/shared-utils'), require('@angular/router'), require('rxjs'), require('rxjs/operators'), require('@vendure/common/lib/simple-deep-clone')) :
3
+ typeof define === 'function' && define.amd ? define('@vendure/admin-ui/order', ['exports', '@angular/core', '@angular/forms', '@vendure/admin-ui/core', '@biesbjerg/ngx-translate-extract-marker', '@vendure/common/lib/shared-utils', '@angular/router', 'rxjs', 'rxjs/operators', '@vendure/common/lib/simple-deep-clone'], factory) :
4
+ (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory((global.vendure = global.vendure || {}, global.vendure['admin-ui'] = global.vendure['admin-ui'] || {}, global.vendure['admin-ui'].order = {}), global.ng.core, global.ng.forms, global.vendure['admin-ui'].core, global.ngxTranslateExtractMarker, global.sharedUtils, global.ng.router, global.rxjs, global.rxjs.operators, global.simpleDeepClone));
5
+ }(this, (function (exports, i0, forms, i1, ngxTranslateExtractMarker, sharedUtils, i1$1, rxjs, operators, simpleDeepClone) { 'use strict';
6
6
 
7
7
  function _interopNamespace(e) {
8
8
  if (e && e.__esModule) return e;
@@ -2286,7 +2286,10 @@
2286
2286
  OrderEditorComponent.prototype.previewAndModify = function (order) {
2287
2287
  var _this = this;
2288
2288
  var _a;
2289
- var input = Object.assign(Object.assign(Object.assign(Object.assign({}, this.modifyOrderInput), (this.billingAddressForm.dirty ? { updateBillingAddress: this.billingAddressForm.value } : {})), (this.shippingAddressForm.dirty
2289
+ var modifyOrderInput = Object.assign(Object.assign({}, this.modifyOrderInput), { adjustOrderLines: this.modifyOrderInput.adjustOrderLines.map(function (line) {
2290
+ return i1.transformRelationCustomFieldInputs(simpleDeepClone.simpleDeepClone(line), _this.orderLineCustomFields);
2291
+ }) });
2292
+ var input = Object.assign(Object.assign(Object.assign(Object.assign({}, modifyOrderInput), (this.billingAddressForm.dirty ? { updateBillingAddress: this.billingAddressForm.value } : {})), (this.shippingAddressForm.dirty
2290
2293
  ? { updateShippingAddress: this.shippingAddressForm.value }
2291
2294
  : {})), { dryRun: true, couponCodes: this.couponCodesControl.dirty ? this.couponCodesControl.value : undefined, note: (_a = this.note) !== null && _a !== void 0 ? _a : '', options: {
2292
2295
  recalculateShipping: this.recalculateShipping,
@@ -2394,9 +2397,9 @@
2394
2397
  OrderEditorComponent.decorators = [
2395
2398
  { type: i0.Component, args: [{
2396
2399
  selector: 'vdr-order-editor',
2397
- template: "<vdr-action-bar *ngIf=\"entity$ | async as order\">\r\n <vdr-ab-left>\r\n <div class=\"flex clr-align-items-center\">\r\n <vdr-entity-info [entity]=\"entity$ | async\"></vdr-entity-info>\r\n <vdr-order-state-label [state]=\"order.state\"></vdr-order-state-label>\r\n </div>\r\n </vdr-ab-left>\r\n\r\n <vdr-ab-right>\r\n <button class=\"btn btn-secondary\" (click)=\"transitionToPriorState(order)\">\r\n {{ 'order.cancel-modification' | translate }}\r\n </button>\r\n </vdr-ab-right>\r\n</vdr-action-bar>\r\n\r\n<div *ngIf=\"entity$ | async as order\">\r\n <div class=\"clr-row\">\r\n <div class=\"clr-col-lg-8\">\r\n <table class=\"order-table table\">\r\n <thead>\r\n <tr>\r\n <th></th>\r\n <th>{{ 'order.product-name' | translate }}</th>\r\n <th>{{ 'order.product-sku' | translate }}</th>\r\n <th>{{ 'order.unit-price' | translate }}</th>\r\n <th>{{ 'order.quantity' | translate }}</th>\r\n <th *ngIf=\"orderLineCustomFields.length\">{{ 'common.custom-fields' | translate }}</th>\r\n <th>{{ 'order.total' | translate }}</th>\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <tr\r\n *ngFor=\"let line of order.lines; let i = index\"\r\n class=\"order-line\"\r\n [class.is-cancelled]=\"line.quantity === 0\"\r\n [class.modified]=\"isLineModified(line)\"\r\n >\r\n <td class=\"align-middle thumb\">\r\n <img\r\n *ngIf=\"line.featuredAsset\"\r\n [src]=\"line.featuredAsset | assetPreview: 'tiny'\"\r\n />\r\n </td>\r\n <td class=\"align-middle name\">{{ line.productVariant.name }}</td>\r\n <td class=\"align-middle sku\">{{ line.productVariant.sku }}</td>\r\n <td class=\"align-middle unit-price\">\r\n {{ line.unitPriceWithTax | localeCurrency: order.currencyCode }}\r\n <div class=\"net-price\" [title]=\"'order.net-price' | translate\">\r\n {{ line.unitPrice | localeCurrency: order.currencyCode }}\r\n </div>\r\n </td>\r\n <td class=\"align-middle quantity\">\r\n <input\r\n type=\"number\"\r\n min=\"0\"\r\n [value]=\"line.quantity\"\r\n (input)=\"updateLineQuantity(line, $event.target.value)\"\r\n />\r\n <vdr-line-refunds [line]=\"line\" [payments]=\"order.payments\"></vdr-line-refunds>\r\n <vdr-line-fulfillment\r\n [line]=\"line\"\r\n [orderState]=\"order.state\"\r\n ></vdr-line-fulfillment>\r\n </td>\r\n <td *ngIf=\"orderLineCustomFields.length\" class=\"order-line-custom-field align-middle\">\r\n <ng-container *ngFor=\"let customField of orderLineCustomFields\">\r\n <vdr-custom-field-control\r\n [customField]=\"customField\"\r\n [customFieldsFormGroup]=\"orderLineCustomFieldsFormArray.get([i])\"\r\n entityName=\"OrderLine\"\r\n [compact]=\"true\"\r\n ></vdr-custom-field-control>\r\n </ng-container>\r\n </td>\r\n <td class=\"align-middle total\">\r\n {{ line.linePriceWithTax | localeCurrency: order.currencyCode }}\r\n <div class=\"net-price\" [title]=\"'order.net-price' | translate\">\r\n {{ line.linePrice | localeCurrency: order.currencyCode }}\r\n </div>\r\n </td>\r\n </tr>\r\n <tr\r\n *ngFor=\"let addedLine of addedLines; trackBy: trackByProductVariantId; let i = index\"\r\n class=\"modified\"\r\n >\r\n <td class=\"align-middle thumb\">\r\n <img\r\n *ngIf=\"addedLine.productAsset\"\r\n [src]=\"addedLine.productAsset | assetPreview: 'tiny'\"\r\n />\r\n </td>\r\n <td class=\"align-middle name\">{{ addedLine.productVariantName }}</td>\r\n <td class=\"align-middle sku\">{{ addedLine.sku }}</td>\r\n <td class=\"align-middle unit-price\">\r\n {{ addedLine.priceWithTax | localeCurrency: order.currencyCode }}\r\n <div class=\"net-price\" [title]=\"'order.net-price' | translate\">\r\n {{ addedLine.price | localeCurrency: order.currencyCode }}\r\n </div>\r\n </td>\r\n <td class=\"align-middle quantity\">\r\n <input\r\n type=\"number\"\r\n min=\"0\"\r\n [value]=\"addedLine.quantity\"\r\n (input)=\"updateAddedItemQuantity(addedLine, $event.target.value)\"\r\n />\r\n <button class=\"icon-button\" (click)=\"removeAddedItem(i)\">\r\n <clr-icon shape=\"trash\"></clr-icon>\r\n </button>\r\n </td>\r\n <td *ngIf=\"orderLineCustomFields.length\" class=\"order-line-custom-field align-middle\">\r\n <ng-container *ngFor=\"let customField of orderLineCustomFields\">\r\n <vdr-custom-field-control\r\n [customField]=\"customField\"\r\n [customFieldsFormGroup]=\"addItemCustomFieldsFormArray.get([i])\"\r\n entityName=\"OrderLine\"\r\n [compact]=\"true\"\r\n ></vdr-custom-field-control>\r\n </ng-container>\r\n </td>\r\n <td class=\"align-middle total\">\r\n {{\r\n (addedLine.priceWithTax * addedLine.quantity) / 100\r\n | currency: order.currencyCode\r\n }}\r\n <div class=\"net-price\" [title]=\"'order.net-price' | translate\">\r\n {{\r\n (addedLine.price * addedLine.quantity) / 100\r\n | currency: order.currencyCode\r\n }}\r\n </div>\r\n </td>\r\n </tr>\r\n <tr class=\"surcharge\" *ngFor=\"let surcharge of order.surcharges\">\r\n <td class=\"align-middle name left\" colspan=\"2\">{{ surcharge.description }}</td>\r\n <td class=\"align-middle sku\">{{ surcharge.sku }}</td>\r\n <td class=\"align-middle\"></td>\r\n <td></td>\r\n <td *ngIf=\"orderLineCustomFields.length\"></td>\r\n <td class=\"align-middle total\">\r\n {{ surcharge.priceWithTax | localeCurrency: order.currencyCode }}\r\n <div class=\"net-price\" [title]=\"'order.net-price' | translate\">\r\n {{ surcharge.price | localeCurrency: order.currencyCode }}\r\n </div>\r\n </td>\r\n </tr>\r\n <tr\r\n class=\"surcharge modified\"\r\n *ngFor=\"let surcharge of modifyOrderInput.surcharges; let i = index\"\r\n >\r\n <td class=\"align-middle name left\" colspan=\"2\">\r\n {{ surcharge.description }}\r\n <button class=\"icon-button\" (click)=\"removeSurcharge(i)\">\r\n <clr-icon shape=\"trash\"></clr-icon>\r\n </button>\r\n </td>\r\n <td class=\"align-middle sku\">{{ surcharge.sku }}</td>\r\n <td class=\"align-middle\"></td>\r\n <td></td>\r\n <td *ngIf=\"orderLineCustomFields.length\"></td>\r\n <td class=\"align-middle total\">\r\n <ng-container *ngIf=\"getSurchargePrices(surcharge) as surchargePrice\">\r\n {{ surchargePrice.priceWithTax | localeCurrency: order.currencyCode }}\r\n <div class=\"net-price\" [title]=\"'order.net-price' | translate\">\r\n {{ surchargePrice.price | localeCurrency: order.currencyCode }}\r\n </div>\r\n </ng-container>\r\n </td>\r\n </tr>\r\n <tr class=\"shipping\">\r\n <td class=\"left clr-align-middle\">{{ 'order.shipping' | translate }}</td>\r\n <td class=\"clr-align-middle\">{{ order.shippingLines[0]?.shippingMethod?.name }}</td>\r\n <td colspan=\"3\"></td>\r\n <td *ngIf=\"orderLineCustomFields.length\"></td>\r\n <td class=\"clr-align-middle\">\r\n {{ order.shippingWithTax | localeCurrency: order.currencyCode }}\r\n <div class=\"net-price\" [title]=\"'order.net-price' | translate\">\r\n {{ order.shipping | localeCurrency: order.currencyCode }}\r\n </div>\r\n </td>\r\n </tr>\r\n </tbody>\r\n </table>\r\n\r\n <h4 class=\"mb2\">{{ 'order.modifications' | translate }}</h4>\r\n <clr-accordion>\r\n <clr-accordion-panel>\r\n <clr-accordion-title>{{ 'order.add-item-to-order' | translate }}</clr-accordion-title>\r\n <clr-accordion-content *clrIfExpanded>\r\n <vdr-product-selector class=\"mb4\" (productSelected)=\"addItemSelectedVariant = $event\">\r\n </vdr-product-selector>\r\n <div *ngIf=\"addItemSelectedVariant\" class=\"flex mb4\">\r\n <img\r\n *ngIf=\"addItemSelectedVariant.productAsset as asset\"\r\n [src]=\"asset | assetPreview: 'tiny'\"\r\n class=\"mr4\"\r\n />\r\n <div>\r\n <strong class=\"mr4\">{{ addItemSelectedVariant.productVariantName }}</strong>\r\n <small>{{ addItemSelectedVariant.sku }}</small>\r\n <div>\r\n {{\r\n getSelectedItemPrice(addItemSelectedVariant)\r\n | localeCurrency: order.currencyCode\r\n }}\r\n </div>\r\n </div>\r\n </div>\r\n <ng-container *ngFor=\"let customField of orderLineCustomFields\">\r\n <vdr-custom-field-control\r\n [readonly]=\"!addItemSelectedVariant\"\r\n [customField]=\"customField\"\r\n [customFieldsFormGroup]=\"addItemCustomFieldsForm\"\r\n entityName=\"OrderLine\"\r\n [compact]=\"true\"\r\n ></vdr-custom-field-control>\r\n </ng-container>\r\n <button\r\n class=\"btn btn-secondary\"\r\n [disabled]=\"!addItemSelectedVariant || addItemCustomFieldsForm.invalid\"\r\n (click)=\"addItemToOrder(addItemSelectedVariant)\"\r\n >\r\n {{ 'order.add-item-to-order' | translate }}\r\n </button>\r\n </clr-accordion-content>\r\n </clr-accordion-panel>\r\n <clr-accordion-panel>\r\n <clr-accordion-title>{{ 'order.set-coupon-codes' | translate }}</clr-accordion-title>\r\n <clr-accordion-content *clrIfExpanded>\r\n <ng-select\r\n [items]=\"availableCouponCodes$ | async\"\r\n appendTo=\"body\"\r\n bindLabel=\"code\"\r\n bindValue=\"code\"\r\n [addTag]=\"false\"\r\n [multiple]=\"true\"\r\n [hideSelected]=\"true\"\r\n [minTermLength]=\"2\"\r\n typeToSearchText=\"\"\r\n [typeahead]=\"couponCodeInput$\"\r\n [formControl]=\"couponCodesControl\"\r\n >\r\n <ng-template ng-option-tmp let-item=\"item\">\r\n <vdr-chip>{{ item.code }}</vdr-chip> {{ item.promotionName }}\r\n </ng-template>\r\n </ng-select>\r\n </clr-accordion-content>\r\n </clr-accordion-panel>\r\n\r\n <clr-accordion-panel>\r\n <clr-accordion-title>{{ 'order.add-surcharge' | translate }}</clr-accordion-title>\r\n <clr-accordion-content *clrIfExpanded>\r\n <form [formGroup]=\"surchargeForm\" (submit)=\"addSurcharge(surchargeForm.value)\">\r\n <vdr-form-field [label]=\"'common.description' | translate\" for=\"description\"\r\n ><input id=\"description\" type=\"text\" formControlName=\"description\"\r\n /></vdr-form-field>\r\n <vdr-form-field [label]=\"'order.product-sku' | translate\" for=\"sku\"\r\n ><input id=\"sku\" type=\"text\" formControlName=\"sku\"\r\n /></vdr-form-field>\r\n <vdr-form-field [label]=\"'common.price' | translate\" for=\"price\"\r\n ><vdr-currency-input\r\n [currencyCode]=\"order.currencyCode\"\r\n id=\"price\"\r\n formControlName=\"price\"\r\n ></vdr-currency-input\r\n ></vdr-form-field>\r\n <vdr-form-field\r\n [label]=\"\r\n 'catalog.price-includes-tax-at'\r\n | translate: { rate: surchargeForm.get('taxRate')?.value }\r\n \"\r\n for=\"priceIncludesTax\"\r\n ><input\r\n id=\"priceIncludesTax\"\r\n type=\"checkbox\"\r\n clrCheckbox\r\n formControlName=\"priceIncludesTax\"\r\n /></vdr-form-field>\r\n <vdr-form-field [label]=\"'order.tax-rate' | translate\" for=\"taxRate\"\r\n ><vdr-affixed-input suffix=\"%\"\r\n ><input\r\n id=\"taxRate\"\r\n type=\"number\"\r\n min=\"0\"\r\n max=\"100\"\r\n formControlName=\"taxRate\" /></vdr-affixed-input\r\n ></vdr-form-field>\r\n <vdr-form-field [label]=\"'order.tax-description' | translate\" for=\"taxDescription\"\r\n ><input id=\"taxDescription\" type=\"text\" formControlName=\"taxDescription\"\r\n /></vdr-form-field>\r\n <button\r\n class=\"btn btn-secondary\"\r\n [disabled]=\"\r\n surchargeForm.invalid ||\r\n surchargeForm.pristine ||\r\n surchargeForm.get('price')?.value === 0\r\n \"\r\n >\r\n {{ 'order.add-surcharge' | translate }}\r\n </button>\r\n </form>\r\n </clr-accordion-content>\r\n </clr-accordion-panel>\r\n <clr-accordion-panel>\r\n <clr-accordion-title>{{ 'order.edit-shipping-address' | translate }}</clr-accordion-title>\r\n <clr-accordion-content *clrIfExpanded>\r\n <vdr-address-form\r\n [formGroup]=\"shippingAddressForm\"\r\n [availableCountries]=\"availableCountries$ | async\"\r\n [customFields]=\"addressCustomFields\"\r\n ></vdr-address-form>\r\n </clr-accordion-content>\r\n </clr-accordion-panel>\r\n <clr-accordion-panel>\r\n <clr-accordion-title>{{ 'order.edit-billing-address' | translate }}</clr-accordion-title>\r\n <clr-accordion-content *clrIfExpanded>\r\n <vdr-address-form\r\n [formGroup]=\"billingAddressForm\"\r\n [availableCountries]=\"availableCountries$ | async\"\r\n [customFields]=\"addressCustomFields\"\r\n ></vdr-address-form>\r\n </clr-accordion-content>\r\n </clr-accordion-panel>\r\n </clr-accordion>\r\n </div>\r\n <div class=\"clr-col-lg-4 order-cards\">\r\n <div class=\"card\">\r\n <div class=\"card-header\">\r\n {{ 'order.modification-summary' | translate }}\r\n </div>\r\n <div class=\"card-block\">\r\n <ul>\r\n <li *ngIf=\"modifyOrderInput.addItems?.length\">\r\n {{\r\n 'order.modification-adding-items'\r\n | translate: { count: modifyOrderInput.addItems?.length }\r\n }}\r\n </li>\r\n <li *ngIf=\"modifyOrderInput.adjustOrderLines?.length\">\r\n {{\r\n 'order.modification-adjusting-lines'\r\n | translate: { count: modifyOrderInput.adjustOrderLines?.length }\r\n }}\r\n </li>\r\n <li *ngIf=\"modifyOrderInput.surcharges?.length\">\r\n {{\r\n 'order.modification-adding-surcharges'\r\n | translate: { count: modifyOrderInput.surcharges?.length }\r\n }}\r\n </li>\r\n <li *ngIf=\"shippingAddressForm.dirty\">\r\n {{ 'order.modification-updating-shipping-address' | translate }}\r\n </li>\r\n <li *ngIf=\"billingAddressForm.dirty\">\r\n {{ 'order.modification-updating-billing-address' | translate }}\r\n </li>\r\n </ul>\r\n </div>\r\n <div class=\"card-block\">\r\n <label class=\"clr-control-label\">{{ 'order.note' | translate }}</label>\r\n <textarea [(ngModel)]=\"note\" name=\"note\" clrTextarea required></textarea>\r\n <clr-checkbox-wrapper class=\"\">\r\n <input type=\"checkbox\" clrCheckbox [(ngModel)]=\"recalculateShipping\" />\r\n <label>{{ 'order.modification-recalculate-shipping' | translate }}</label>\r\n </clr-checkbox-wrapper>\r\n </div>\r\n <div class=\"card-footer\">\r\n <button\r\n class=\"btn btn-primary\"\r\n [disabled]=\"!canPreviewChanges()\"\r\n (click)=\"previewAndModify(order)\"\r\n >\r\n {{ 'order.preview-changes' | translate }}\r\n </button>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n",
2400
+ template: "<vdr-action-bar *ngIf=\"entity$ | async as order\">\r\n <vdr-ab-left>\r\n <div class=\"flex clr-align-items-center\">\r\n <vdr-entity-info [entity]=\"entity$ | async\"></vdr-entity-info>\r\n <vdr-order-state-label [state]=\"order.state\"></vdr-order-state-label>\r\n </div>\r\n </vdr-ab-left>\r\n\r\n <vdr-ab-right>\r\n <button class=\"btn btn-secondary\" (click)=\"transitionToPriorState(order)\">\r\n {{ 'order.cancel-modification' | translate }}\r\n </button>\r\n </vdr-ab-right>\r\n</vdr-action-bar>\r\n\r\n<div *ngIf=\"entity$ | async as order\">\r\n <div class=\"clr-row\">\r\n <div class=\"clr-col-lg-8\">\r\n <table class=\"order-table table\">\r\n <thead>\r\n <tr>\r\n <th></th>\r\n <th>{{ 'order.product-name' | translate }}</th>\r\n <th>{{ 'order.product-sku' | translate }}</th>\r\n <th>{{ 'order.unit-price' | translate }}</th>\r\n <th>{{ 'order.quantity' | translate }}</th>\r\n <th *ngIf=\"orderLineCustomFields.length\">{{ 'common.custom-fields' | translate }}</th>\r\n <th>{{ 'order.total' | translate }}</th>\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <tr\r\n *ngFor=\"let line of order.lines; let i = index\"\r\n class=\"order-line\"\r\n [class.is-cancelled]=\"line.quantity === 0\"\r\n [class.modified]=\"isLineModified(line)\"\r\n >\r\n <td class=\"align-middle thumb\">\r\n <img\r\n *ngIf=\"line.featuredAsset\"\r\n [src]=\"line.featuredAsset | assetPreview: 'tiny'\"\r\n />\r\n </td>\r\n <td class=\"align-middle name\">{{ line.productVariant.name }}</td>\r\n <td class=\"align-middle sku\">{{ line.productVariant.sku }}</td>\r\n <td class=\"align-middle unit-price\">\r\n {{ line.unitPriceWithTax | localeCurrency: order.currencyCode }}\r\n <div class=\"net-price\" [title]=\"'order.net-price' | translate\">\r\n {{ line.unitPrice | localeCurrency: order.currencyCode }}\r\n </div>\r\n </td>\r\n <td class=\"align-middle quantity\">\r\n <input\r\n type=\"number\"\r\n min=\"0\"\r\n [value]=\"line.quantity\"\r\n (input)=\"updateLineQuantity(line, $event.target.value)\"\r\n />\r\n <vdr-line-refunds [line]=\"line\" [payments]=\"order.payments\"></vdr-line-refunds>\r\n <vdr-line-fulfillment\r\n [line]=\"line\"\r\n [orderState]=\"order.state\"\r\n ></vdr-line-fulfillment>\r\n </td>\r\n <td *ngIf=\"orderLineCustomFields.length\" class=\"order-line-custom-field align-middle\">\r\n <vdr-tabbed-custom-fields\r\n entityName=\"OrderLine\"\r\n [customFields]=\"orderLineCustomFields\"\r\n [customFieldsFormGroup]=\"orderLineCustomFieldsFormArray.get([i])\"\r\n [compact]=\"true\"\r\n ></vdr-tabbed-custom-fields>\r\n </td>\r\n <td class=\"align-middle total\">\r\n {{ line.linePriceWithTax | localeCurrency: order.currencyCode }}\r\n <div class=\"net-price\" [title]=\"'order.net-price' | translate\">\r\n {{ line.linePrice | localeCurrency: order.currencyCode }}\r\n </div>\r\n </td>\r\n </tr>\r\n <tr\r\n *ngFor=\"let addedLine of addedLines; trackBy: trackByProductVariantId; let i = index\"\r\n class=\"modified\"\r\n >\r\n <td class=\"align-middle thumb\">\r\n <img\r\n *ngIf=\"addedLine.productAsset\"\r\n [src]=\"addedLine.productAsset | assetPreview: 'tiny'\"\r\n />\r\n </td>\r\n <td class=\"align-middle name\">{{ addedLine.productVariantName }}</td>\r\n <td class=\"align-middle sku\">{{ addedLine.sku }}</td>\r\n <td class=\"align-middle unit-price\">\r\n {{ addedLine.priceWithTax | localeCurrency: order.currencyCode }}\r\n <div class=\"net-price\" [title]=\"'order.net-price' | translate\">\r\n {{ addedLine.price | localeCurrency: order.currencyCode }}\r\n </div>\r\n </td>\r\n <td class=\"align-middle quantity\">\r\n <input\r\n type=\"number\"\r\n min=\"0\"\r\n [value]=\"addedLine.quantity\"\r\n (input)=\"updateAddedItemQuantity(addedLine, $event.target.value)\"\r\n />\r\n <button class=\"icon-button\" (click)=\"removeAddedItem(i)\">\r\n <clr-icon shape=\"trash\"></clr-icon>\r\n </button>\r\n </td>\r\n <td *ngIf=\"orderLineCustomFields.length\" class=\"order-line-custom-field align-middle\">\r\n <ng-container *ngFor=\"let customField of orderLineCustomFields\">\r\n <vdr-custom-field-control\r\n [customField]=\"customField\"\r\n [customFieldsFormGroup]=\"addItemCustomFieldsFormArray.get([i])\"\r\n entityName=\"OrderLine\"\r\n [compact]=\"true\"\r\n ></vdr-custom-field-control>\r\n </ng-container>\r\n </td>\r\n <td class=\"align-middle total\">\r\n {{\r\n (addedLine.priceWithTax * addedLine.quantity) / 100\r\n | currency: order.currencyCode\r\n }}\r\n <div class=\"net-price\" [title]=\"'order.net-price' | translate\">\r\n {{\r\n (addedLine.price * addedLine.quantity) / 100\r\n | currency: order.currencyCode\r\n }}\r\n </div>\r\n </td>\r\n </tr>\r\n <tr class=\"surcharge\" *ngFor=\"let surcharge of order.surcharges\">\r\n <td class=\"align-middle name left\" colspan=\"2\">{{ surcharge.description }}</td>\r\n <td class=\"align-middle sku\">{{ surcharge.sku }}</td>\r\n <td class=\"align-middle\"></td>\r\n <td></td>\r\n <td *ngIf=\"orderLineCustomFields.length\"></td>\r\n <td class=\"align-middle total\">\r\n {{ surcharge.priceWithTax | localeCurrency: order.currencyCode }}\r\n <div class=\"net-price\" [title]=\"'order.net-price' | translate\">\r\n {{ surcharge.price | localeCurrency: order.currencyCode }}\r\n </div>\r\n </td>\r\n </tr>\r\n <tr\r\n class=\"surcharge modified\"\r\n *ngFor=\"let surcharge of modifyOrderInput.surcharges; let i = index\"\r\n >\r\n <td class=\"align-middle name left\" colspan=\"2\">\r\n {{ surcharge.description }}\r\n <button class=\"icon-button\" (click)=\"removeSurcharge(i)\">\r\n <clr-icon shape=\"trash\"></clr-icon>\r\n </button>\r\n </td>\r\n <td class=\"align-middle sku\">{{ surcharge.sku }}</td>\r\n <td class=\"align-middle\"></td>\r\n <td></td>\r\n <td *ngIf=\"orderLineCustomFields.length\"></td>\r\n <td class=\"align-middle total\">\r\n <ng-container *ngIf=\"getSurchargePrices(surcharge) as surchargePrice\">\r\n {{ surchargePrice.priceWithTax | localeCurrency: order.currencyCode }}\r\n <div class=\"net-price\" [title]=\"'order.net-price' | translate\">\r\n {{ surchargePrice.price | localeCurrency: order.currencyCode }}\r\n </div>\r\n </ng-container>\r\n </td>\r\n </tr>\r\n <tr class=\"shipping\">\r\n <td class=\"left clr-align-middle\">{{ 'order.shipping' | translate }}</td>\r\n <td class=\"clr-align-middle\">{{ order.shippingLines[0]?.shippingMethod?.name }}</td>\r\n <td colspan=\"3\"></td>\r\n <td *ngIf=\"orderLineCustomFields.length\"></td>\r\n <td class=\"clr-align-middle\">\r\n {{ order.shippingWithTax | localeCurrency: order.currencyCode }}\r\n <div class=\"net-price\" [title]=\"'order.net-price' | translate\">\r\n {{ order.shipping | localeCurrency: order.currencyCode }}\r\n </div>\r\n </td>\r\n </tr>\r\n </tbody>\r\n </table>\r\n\r\n <h4 class=\"mb2\">{{ 'order.modifications' | translate }}</h4>\r\n <clr-accordion>\r\n <clr-accordion-panel>\r\n <clr-accordion-title>{{ 'order.add-item-to-order' | translate }}</clr-accordion-title>\r\n <clr-accordion-content *clrIfExpanded>\r\n <vdr-product-selector class=\"mb4\" (productSelected)=\"addItemSelectedVariant = $event\">\r\n </vdr-product-selector>\r\n <div *ngIf=\"addItemSelectedVariant\" class=\"flex mb4\">\r\n <img\r\n *ngIf=\"addItemSelectedVariant.productAsset as asset\"\r\n [src]=\"asset | assetPreview: 'tiny'\"\r\n class=\"mr4\"\r\n />\r\n <div>\r\n <strong class=\"mr4\">{{ addItemSelectedVariant.productVariantName }}</strong>\r\n <small>{{ addItemSelectedVariant.sku }}</small>\r\n <div>\r\n {{\r\n getSelectedItemPrice(addItemSelectedVariant)\r\n | localeCurrency: order.currencyCode\r\n }}\r\n </div>\r\n </div>\r\n </div>\r\n <ng-container *ngFor=\"let customField of orderLineCustomFields\">\r\n <vdr-custom-field-control\r\n [readonly]=\"!addItemSelectedVariant\"\r\n [customField]=\"customField\"\r\n [customFieldsFormGroup]=\"addItemCustomFieldsForm\"\r\n entityName=\"OrderLine\"\r\n [compact]=\"true\"\r\n ></vdr-custom-field-control>\r\n </ng-container>\r\n <button\r\n class=\"btn btn-secondary\"\r\n [disabled]=\"!addItemSelectedVariant || addItemCustomFieldsForm.invalid\"\r\n (click)=\"addItemToOrder(addItemSelectedVariant)\"\r\n >\r\n {{ 'order.add-item-to-order' | translate }}\r\n </button>\r\n </clr-accordion-content>\r\n </clr-accordion-panel>\r\n <clr-accordion-panel>\r\n <clr-accordion-title>{{ 'order.set-coupon-codes' | translate }}</clr-accordion-title>\r\n <clr-accordion-content *clrIfExpanded>\r\n <ng-select\r\n [items]=\"availableCouponCodes$ | async\"\r\n appendTo=\"body\"\r\n bindLabel=\"code\"\r\n bindValue=\"code\"\r\n [addTag]=\"false\"\r\n [multiple]=\"true\"\r\n [hideSelected]=\"true\"\r\n [minTermLength]=\"2\"\r\n typeToSearchText=\"\"\r\n [typeahead]=\"couponCodeInput$\"\r\n [formControl]=\"couponCodesControl\"\r\n >\r\n <ng-template ng-option-tmp let-item=\"item\">\r\n <vdr-chip>{{ item.code }}</vdr-chip>\r\n {{ item.promotionName }}\r\n </ng-template>\r\n </ng-select>\r\n </clr-accordion-content>\r\n </clr-accordion-panel>\r\n\r\n <clr-accordion-panel>\r\n <clr-accordion-title>{{ 'order.add-surcharge' | translate }}</clr-accordion-title>\r\n <clr-accordion-content *clrIfExpanded>\r\n <form [formGroup]=\"surchargeForm\" (submit)=\"addSurcharge(surchargeForm.value)\">\r\n <vdr-form-field [label]=\"'common.description' | translate\" for=\"description\"\r\n ><input id=\"description\" type=\"text\" formControlName=\"description\"\r\n /></vdr-form-field>\r\n <vdr-form-field [label]=\"'order.product-sku' | translate\" for=\"sku\"\r\n ><input id=\"sku\" type=\"text\" formControlName=\"sku\"\r\n /></vdr-form-field>\r\n <vdr-form-field [label]=\"'common.price' | translate\" for=\"price\">\r\n <vdr-currency-input\r\n [currencyCode]=\"order.currencyCode\"\r\n id=\"price\"\r\n formControlName=\"price\"\r\n ></vdr-currency-input>\r\n </vdr-form-field>\r\n <vdr-form-field\r\n [label]=\"\r\n 'catalog.price-includes-tax-at'\r\n | translate: { rate: surchargeForm.get('taxRate')?.value }\r\n \"\r\n for=\"priceIncludesTax\"\r\n ><input\r\n id=\"priceIncludesTax\"\r\n type=\"checkbox\"\r\n clrCheckbox\r\n formControlName=\"priceIncludesTax\"\r\n /></vdr-form-field>\r\n <vdr-form-field [label]=\"'order.tax-rate' | translate\" for=\"taxRate\">\r\n <vdr-affixed-input suffix=\"%\"\r\n ><input\r\n id=\"taxRate\"\r\n type=\"number\"\r\n min=\"0\"\r\n max=\"100\"\r\n formControlName=\"taxRate\"\r\n /></vdr-affixed-input>\r\n </vdr-form-field>\r\n <vdr-form-field [label]=\"'order.tax-description' | translate\" for=\"taxDescription\"\r\n ><input id=\"taxDescription\" type=\"text\" formControlName=\"taxDescription\"\r\n /></vdr-form-field>\r\n <button\r\n class=\"btn btn-secondary\"\r\n [disabled]=\"\r\n surchargeForm.invalid ||\r\n surchargeForm.pristine ||\r\n surchargeForm.get('price')?.value === 0\r\n \"\r\n >\r\n {{ 'order.add-surcharge' | translate }}\r\n </button>\r\n </form>\r\n </clr-accordion-content>\r\n </clr-accordion-panel>\r\n <clr-accordion-panel>\r\n <clr-accordion-title>{{ 'order.edit-shipping-address' | translate }}</clr-accordion-title>\r\n <clr-accordion-content *clrIfExpanded>\r\n <vdr-address-form\r\n [formGroup]=\"shippingAddressForm\"\r\n [availableCountries]=\"availableCountries$ | async\"\r\n [customFields]=\"addressCustomFields\"\r\n ></vdr-address-form>\r\n </clr-accordion-content>\r\n </clr-accordion-panel>\r\n <clr-accordion-panel>\r\n <clr-accordion-title>{{ 'order.edit-billing-address' | translate }}</clr-accordion-title>\r\n <clr-accordion-content *clrIfExpanded>\r\n <vdr-address-form\r\n [formGroup]=\"billingAddressForm\"\r\n [availableCountries]=\"availableCountries$ | async\"\r\n [customFields]=\"addressCustomFields\"\r\n ></vdr-address-form>\r\n </clr-accordion-content>\r\n </clr-accordion-panel>\r\n </clr-accordion>\r\n </div>\r\n <div class=\"clr-col-lg-4 order-cards\">\r\n <div class=\"card\">\r\n <div class=\"card-header\">\r\n {{ 'order.modification-summary' | translate }}\r\n </div>\r\n <div class=\"card-block\">\r\n <ul>\r\n <li *ngIf=\"modifyOrderInput.addItems?.length\">\r\n {{\r\n 'order.modification-adding-items'\r\n | translate: { count: modifyOrderInput.addItems?.length }\r\n }}\r\n </li>\r\n <li *ngIf=\"modifyOrderInput.adjustOrderLines?.length\">\r\n {{\r\n 'order.modification-adjusting-lines'\r\n | translate: { count: modifyOrderInput.adjustOrderLines?.length }\r\n }}\r\n </li>\r\n <li *ngIf=\"modifyOrderInput.surcharges?.length\">\r\n {{\r\n 'order.modification-adding-surcharges'\r\n | translate: { count: modifyOrderInput.surcharges?.length }\r\n }}\r\n </li>\r\n <li *ngIf=\"shippingAddressForm.dirty\">\r\n {{ 'order.modification-updating-shipping-address' | translate }}\r\n </li>\r\n <li *ngIf=\"billingAddressForm.dirty\">\r\n {{ 'order.modification-updating-billing-address' | translate }}\r\n </li>\r\n </ul>\r\n </div>\r\n <div class=\"card-block\">\r\n <label class=\"clr-control-label\">{{ 'order.note' | translate }}</label>\r\n <textarea [(ngModel)]=\"note\" name=\"note\" clrTextarea required></textarea>\r\n <clr-checkbox-wrapper class=\"\">\r\n <input type=\"checkbox\" clrCheckbox [(ngModel)]=\"recalculateShipping\" />\r\n <label>{{ 'order.modification-recalculate-shipping' | translate }}</label>\r\n </clr-checkbox-wrapper>\r\n </div>\r\n <div class=\"card-footer\">\r\n <button\r\n class=\"btn btn-primary\"\r\n [disabled]=\"!canPreviewChanges()\"\r\n (click)=\"previewAndModify(order)\"\r\n >\r\n {{ 'order.preview-changes' | translate }}\r\n </button>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n",
2398
2401
  changeDetection: i0.ChangeDetectionStrategy.OnPush,
2399
- styles: [".order-table .is-cancelled td{text-decoration:line-through;background-color:var(--color-component-bg-200)}.order-table .sub-total td{border-top:1px dashed var(--color-component-border-200)}.order-table .total td{font-weight:bold;border-top:1px dashed var(--color-component-border-200)}.order-table td.custom-fields-row{border-top-style:dashed;border-top-color:var(--color-grey-200)}.order-table .order-line-custom-fields{display:flex;flex-wrap:wrap}.order-table .order-line-custom-fields .custom-field{text-align:start;max-width:200px;overflow:hidden;text-overflow:ellipsis;margin-bottom:6px;margin-right:18px}.order-table .order-line-custom-field{background-color:var(--color-component-bg-100)}.order-table .order-line-custom-field .custom-field-ellipsis{color:var(--color-text-300)}.order-table .net-price{font-size:11px;color:var(--color-text-300)}.order-table .promotions-label{-webkit-text-decoration:underline dotted var(--color-text-200);text-decoration:underline dotted var(--color-text-200);font-size:11px;margin-top:6px;cursor:pointer;text-transform:lowercase}.order-table .thumb img{width:50px;height:50px}.order-table tr.modified td{background-color:var(--color-warning-100)}\n"]
2402
+ styles: [".order-table .is-cancelled td{text-decoration:line-through;background-color:var(--color-component-bg-200)}.order-table .sub-total td{border-top:1px dashed var(--color-component-border-200)}.order-table .total td{font-weight:bold;border-top:1px dashed var(--color-component-border-200)}.order-table td.custom-fields-row{border-top-style:dashed;border-top-color:var(--color-grey-200)}.order-table .order-line-custom-fields{display:flex;flex-wrap:wrap}.order-table .order-line-custom-fields .custom-field{text-align:start;max-width:200px;overflow:hidden;text-overflow:ellipsis;margin-bottom:6px;margin-right:18px}.order-table .order-line-custom-field{background-color:var(--color-component-bg-100)}.order-table .order-line-custom-field .custom-field-ellipsis{color:var(--color-text-300)}.order-table .net-price{font-size:11px;color:var(--color-text-300)}.order-table .promotions-label{-webkit-text-decoration:underline dotted var(--color-text-200);text-decoration:underline dotted var(--color-text-200);font-size:11px;margin-top:6px;cursor:pointer;text-transform:lowercase}.order-table .thumb img{width:50px;height:50px}.order-table tr.modified td{background-color:var(--color-warning-100)}.order-table .order-line-custom-field{text-align:start}\n"]
2400
2403
  },] }
2401
2404
  ];
2402
2405
  OrderEditorComponent.ctorParameters = function () { return [