@deenruv/admin-ui 1.0.17-dev.31 → 1.0.17-dev.33

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.
@@ -690,6 +690,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
690
690
  type: Input
691
691
  }] } });
692
692
 
693
+ function getOrderLineAsset(line) {
694
+ return line.featuredAsset ?? line.productVariant.featuredAsset ?? line.productVariant.product.featuredAsset;
695
+ }
693
696
  class OrderTableComponent {
694
697
  constructor() {
695
698
  this.isDraft = false;
@@ -697,6 +700,7 @@ class OrderTableComponent {
697
700
  this.remove = new EventEmitter();
698
701
  this.orderLineCustomFieldsVisible = false;
699
702
  this.customFieldsForLine = {};
703
+ this.getOrderLineAsset = getOrderLineAsset;
700
704
  }
701
705
  get visibleOrderLineCustomFields() {
702
706
  return this.orderLineCustomFieldsVisible ? this.orderLineCustomFields : [];
@@ -756,11 +760,11 @@ class OrderTableComponent {
756
760
  }
757
761
  }
758
762
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: OrderTableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
759
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: OrderTableComponent, selector: "vdr-order-table", inputs: { order: "order", orderLineCustomFields: "orderLineCustomFields", isDraft: "isDraft" }, outputs: { adjust: "adjust", remove: "remove" }, ngImport: i0, template: "<vdr-order-data-table id=\"order-detail-list\" [items]=\"order.lines\" [order]=\"order\">\n <vdr-dt2-column id=\"id\" [heading]=\"'common.id' | translate\" [hiddenByDefault]=\"true\">\n <ng-template let-line=\"item\">\n {{ line.id }}\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column\n id=\"created-at\"\n [heading]=\"'common.created-at' | translate\"\n [hiddenByDefault]=\"true\"\n >\n <ng-template let-line=\"item\">\n {{ line.createdAt | localeDate : 'short' }}\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column\n id=\"updated-at\"\n [heading]=\"'common.updated-at' | translate\"\n [hiddenByDefault]=\"true\"\n >\n <ng-template let-line=\"item\">\n {{ line.updatedAt | localeDate : 'short' }}\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'common.image' | translate\" id=\"image\">\n <ng-template let-line=\"item\">\n <div class=\"image-placeholder\">\n <img\n *ngIf=\"line.featuredAsset as asset; else imagePlaceholder\"\n [src]=\"asset | assetPreview : 'tiny'\"\n />\n <ng-template #imagePlaceholder>\n <div class=\"placeholder\">\n <clr-icon shape=\"image\" size=\"48\"></clr-icon>\n </div>\n </ng-template>\n </div>\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'order.product-name' | translate\" id=\"product-name\">\n <ng-template let-line=\"item\">\n {{ line.productVariant.name }}\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'order.product-sku' | translate\" id=\"product-sku\" [optional]=\"false\">\n <ng-template let-line=\"item\">\n {{ line.productVariant.sku }}\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'order.unit-price' | translate\" id=\"unit-price\">\n <ng-template let-line=\"item\">\n <div class=\"unit-price\">\n {{ line.unitPriceWithTax | localeCurrency : order.currencyCode }}\n <div class=\"net-price\" [title]=\"'order.net-price' | translate\">\n {{ line.unitPrice | localeCurrency : order.currencyCode }}\n </div>\n </div>\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'order.quantity' | translate\" id=\"quantity\" [optional]=\"false\">\n <ng-template let-line=\"item\">\n <ng-container *ngIf=\"!isDraft; else draft\">\n <div class=\"flex\">\n <div\n *ngIf=\"line.orderPlacedQuantity && line.quantity !== line.orderPlacedQuantity\"\n class=\"order-placed-quantity\"\n [title]=\"'order.original-quantity-at-checkout' | translate\"\n >\n {{ line.orderPlacedQuantity }}\n </div>\n <div>{{ line.quantity }}</div>\n </div>\n </ng-container>\n <ng-template #draft>\n <div class=\"flex\">\n <input\n class=\"draft-qty\"\n type=\"number\"\n min=\"0\"\n #qtyInput\n [value]=\"line.quantity\"\n (blur)=\"draftInputBlur(line, qtyInput.valueAsNumber)\"\n />\n <button class=\"icon-button\" (click)=\"remove.emit({ lineId: line.id })\">\n <clr-icon shape=\"trash\"></clr-icon>\n </button>\n </div>\n </ng-template>\n <vdr-line-refunds [line]=\"line\" [payments]=\"order.payments\"></vdr-line-refunds>\n <vdr-line-fulfillment\n [line]=\"line\"\n [orderState]=\"order.state\"\n [allOrderFulfillments]=\"order.fulfillments\"\n ></vdr-line-fulfillment>\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-custom-field-column\n *ngFor=\"let customField of orderLineCustomFields\"\n [customField]=\"customField\"\n />\n <vdr-order-total-column [heading]=\"'order.total' | translate\" id=\"total\" [optional]=\"false\">\n <ng-template let-line=\"item\">\n <div class=\"unit-price\">\n {{ line.linePriceWithTax | localeCurrency : order.currencyCode }}\n <div class=\"net-price\" [title]=\"'order.net-price' | translate\">\n {{ line.linePrice | localeCurrency : order.currencyCode }}\n </div>\n </div>\n\n <ng-container *ngIf=\"getLineDiscounts(line) as discounts\">\n <vdr-dropdown *ngIf=\"discounts.length\">\n <div class=\"promotions-label\" vdrDropdownTrigger>\n {{ 'order.promotions-applied' | translate }}\n </div>\n <vdr-dropdown-menu>\n <div class=\"line-promotion\" *ngFor=\"let discount of discounts\">\n <a class=\"promotion-name\" [routerLink]=\"getPromotionLink(discount)\">{{\n discount.description\n }}</a>\n <div class=\"promotion-amount\">\n {{ discount.amountWithTax | localeCurrency : order.currencyCode }}\n <div class=\"net-price\" [title]=\"'order.net-price' | translate\">\n {{ discount.amount | localeCurrency : order.currencyCode }}\n </div>\n </div>\n </div>\n </vdr-dropdown-menu>\n </vdr-dropdown>\n </ng-container>\n </ng-template>\n </vdr-order-total-column>\n</vdr-order-data-table>\n", styles: [":host .is-cancelled td{text-decoration:line-through;background-color:var(--color-component-bg-200)}:host .sub-total td{border-top:1px dashed var(--color-component-border-200)}:host .total td{font-weight:700;border-top:1px dashed var(--color-component-border-200)}:host td.custom-fields-row{border-top-style:dashed;border-top-color:var(--color-grey-200)}:host img{border-radius:var(--border-radius-img)}:host .order-line-custom-fields{display:flex;flex-wrap:wrap}:host .order-line-custom-fields .custom-field{text-align:start;max-width:200px;overflow:hidden;text-overflow:ellipsis;margin-bottom:6px;margin-inline-end:18px}:host .draft-qty{max-width:48px}:host .order-line-custom-field{background-color:var(--color-component-bg-100)}:host .order-line-custom-field .custom-field-ellipsis{color:var(--color-text-300)}:host .net-price{font-size:11px;color:var(--color-text-300);line-height:14px}:host .promotions-label{text-decoration:underline dotted var(--color-text-200);font-size:11px;margin-top:6px;cursor:pointer;text-transform:lowercase}:host .thumb img{width:50px;height:50px}:host .shipping-method-name{font-size:var(--font-size-xs);margin-inline-end:2px}:host .order-placed-quantity{text-decoration:line-through;color:var(--color-text-300);margin-inline-end:2px}::ng-deep .line-promotion{display:flex;justify-content:space-between;padding:6px 12px}::ng-deep .line-promotion .promotion-amount{margin-inline-start:12px}::ng-deep .line-promotion .net-price{font-size:11px;color:var(--color-text-300)}\n"], dependencies: [{ kind: "directive", type: i3.ClrIconCustomTag, selector: "clr-icon" }, { kind: "directive", type: i2$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i1.FormFieldControlDirective, selector: "input, textarea, select, vdr-currency-input" }, { kind: "component", type: i1.DropdownComponent, selector: "vdr-dropdown", inputs: ["manualToggle"] }, { kind: "component", type: i1.DropdownMenuComponent, selector: "vdr-dropdown-menu", inputs: ["vdrPosition", "customClasses"] }, { kind: "directive", type: i1.DropdownTriggerDirective, selector: "[vdrDropdownTrigger]" }, { kind: "component", type: i1.DataTable2ColumnComponent, selector: "vdr-dt2-column", inputs: ["id", "expand", "heading", "align", "sort", "optional", "hiddenByDefault", "orderable"], exportAs: ["row"] }, { kind: "component", type: i1.DataTableCustomFieldColumnComponent, selector: "vdr-dt2-custom-field-column", inputs: ["customField", "sorts"], exportAs: ["row"] }, { kind: "component", type: LineFulfillmentComponent, selector: "vdr-line-fulfillment", inputs: ["line", "allOrderFulfillments", "orderState"] }, { kind: "component", type: LineRefundsComponent, selector: "vdr-line-refunds", inputs: ["line", "payments"] }, { kind: "component", type: OrderDataTableComponent, selector: "vdr-order-data-table", inputs: ["order"] }, { kind: "component", type: OrderTotalColumnComponent, selector: "vdr-order-total-column", exportAs: ["row"] }, { kind: "pipe", type: i4.TranslatePipe, name: "translate" }, { kind: "pipe", type: i1.AssetPreviewPipe, name: "assetPreview" }, { kind: "pipe", type: i1.LocaleDatePipe, name: "localeDate" }, { kind: "pipe", type: i1.LocaleCurrencyPipe, name: "localeCurrency" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
763
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: OrderTableComponent, selector: "vdr-order-table", inputs: { order: "order", orderLineCustomFields: "orderLineCustomFields", isDraft: "isDraft" }, outputs: { adjust: "adjust", remove: "remove" }, ngImport: i0, template: "<vdr-order-data-table id=\"order-detail-list\" [items]=\"order.lines\" [order]=\"order\">\n <vdr-dt2-column id=\"id\" [heading]=\"'common.id' | translate\" [hiddenByDefault]=\"true\">\n <ng-template let-line=\"item\">\n {{ line.id }}\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column\n id=\"created-at\"\n [heading]=\"'common.created-at' | translate\"\n [hiddenByDefault]=\"true\"\n >\n <ng-template let-line=\"item\">\n {{ line.createdAt | localeDate : 'short' }}\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column\n id=\"updated-at\"\n [heading]=\"'common.updated-at' | translate\"\n [hiddenByDefault]=\"true\"\n >\n <ng-template let-line=\"item\">\n {{ line.updatedAt | localeDate : 'short' }}\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'common.image' | translate\" id=\"image\">\n <ng-template let-line=\"item\">\n <div class=\"image-placeholder\">\n <img\n *ngIf=\"getOrderLineAsset(line) as asset; else imagePlaceholder\"\n [src]=\"asset | assetPreview : 'tiny'\"\n />\n <ng-template #imagePlaceholder>\n <div class=\"placeholder\">\n <clr-icon shape=\"image\" size=\"48\"></clr-icon>\n </div>\n </ng-template>\n </div>\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'order.product-name' | translate\" id=\"product-name\">\n <ng-template let-line=\"item\">\n {{ line.productVariant.name }}\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'order.product-sku' | translate\" id=\"product-sku\" [optional]=\"false\">\n <ng-template let-line=\"item\">\n {{ line.productVariant.sku }}\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'order.unit-price' | translate\" id=\"unit-price\">\n <ng-template let-line=\"item\">\n <div class=\"unit-price\">\n {{ line.unitPriceWithTax | localeCurrency : order.currencyCode }}\n <div class=\"net-price\" [title]=\"'order.net-price' | translate\">\n {{ line.unitPrice | localeCurrency : order.currencyCode }}\n </div>\n </div>\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'order.quantity' | translate\" id=\"quantity\" [optional]=\"false\">\n <ng-template let-line=\"item\">\n <ng-container *ngIf=\"!isDraft; else draft\">\n <div class=\"flex\">\n <div\n *ngIf=\"line.orderPlacedQuantity && line.quantity !== line.orderPlacedQuantity\"\n class=\"order-placed-quantity\"\n [title]=\"'order.original-quantity-at-checkout' | translate\"\n >\n {{ line.orderPlacedQuantity }}\n </div>\n <div>{{ line.quantity }}</div>\n </div>\n </ng-container>\n <ng-template #draft>\n <div class=\"flex\">\n <input\n class=\"draft-qty\"\n type=\"number\"\n min=\"0\"\n #qtyInput\n [value]=\"line.quantity\"\n (blur)=\"draftInputBlur(line, qtyInput.valueAsNumber)\"\n />\n <button class=\"icon-button\" (click)=\"remove.emit({ lineId: line.id })\">\n <clr-icon shape=\"trash\"></clr-icon>\n </button>\n </div>\n </ng-template>\n <vdr-line-refunds [line]=\"line\" [payments]=\"order.payments\"></vdr-line-refunds>\n <vdr-line-fulfillment\n [line]=\"line\"\n [orderState]=\"order.state\"\n [allOrderFulfillments]=\"order.fulfillments\"\n ></vdr-line-fulfillment>\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-custom-field-column\n *ngFor=\"let customField of orderLineCustomFields\"\n [customField]=\"customField\"\n />\n <vdr-order-total-column [heading]=\"'order.total' | translate\" id=\"total\" [optional]=\"false\">\n <ng-template let-line=\"item\">\n <div class=\"unit-price\">\n {{ line.linePriceWithTax | localeCurrency : order.currencyCode }}\n <div class=\"net-price\" [title]=\"'order.net-price' | translate\">\n {{ line.linePrice | localeCurrency : order.currencyCode }}\n </div>\n </div>\n\n <ng-container *ngIf=\"getLineDiscounts(line) as discounts\">\n <vdr-dropdown *ngIf=\"discounts.length\">\n <div class=\"promotions-label\" vdrDropdownTrigger>\n {{ 'order.promotions-applied' | translate }}\n </div>\n <vdr-dropdown-menu>\n <div class=\"line-promotion\" *ngFor=\"let discount of discounts\">\n <a class=\"promotion-name\" [routerLink]=\"getPromotionLink(discount)\">{{\n discount.description\n }}</a>\n <div class=\"promotion-amount\">\n {{ discount.amountWithTax | localeCurrency : order.currencyCode }}\n <div class=\"net-price\" [title]=\"'order.net-price' | translate\">\n {{ discount.amount | localeCurrency : order.currencyCode }}\n </div>\n </div>\n </div>\n </vdr-dropdown-menu>\n </vdr-dropdown>\n </ng-container>\n </ng-template>\n </vdr-order-total-column>\n</vdr-order-data-table>\n", styles: [":host .is-cancelled td{text-decoration:line-through;background-color:var(--color-component-bg-200)}:host .sub-total td{border-top:1px dashed var(--color-component-border-200)}:host .total td{font-weight:700;border-top:1px dashed var(--color-component-border-200)}:host td.custom-fields-row{border-top-style:dashed;border-top-color:var(--color-grey-200)}:host img{border-radius:var(--border-radius-img)}:host .order-line-custom-fields{display:flex;flex-wrap:wrap}:host .order-line-custom-fields .custom-field{text-align:start;max-width:200px;overflow:hidden;text-overflow:ellipsis;margin-bottom:6px;margin-inline-end:18px}:host .draft-qty{max-width:48px}:host .order-line-custom-field{background-color:var(--color-component-bg-100)}:host .order-line-custom-field .custom-field-ellipsis{color:var(--color-text-300)}:host .net-price{font-size:11px;color:var(--color-text-300);line-height:14px}:host .promotions-label{text-decoration:underline dotted var(--color-text-200);font-size:11px;margin-top:6px;cursor:pointer;text-transform:lowercase}:host .thumb img{width:50px;height:50px}:host .shipping-method-name{font-size:var(--font-size-xs);margin-inline-end:2px}:host .order-placed-quantity{text-decoration:line-through;color:var(--color-text-300);margin-inline-end:2px}::ng-deep .line-promotion{display:flex;justify-content:space-between;padding:6px 12px}::ng-deep .line-promotion .promotion-amount{margin-inline-start:12px}::ng-deep .line-promotion .net-price{font-size:11px;color:var(--color-text-300)}\n"], dependencies: [{ kind: "directive", type: i3.ClrIconCustomTag, selector: "clr-icon" }, { kind: "directive", type: i2$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i1.FormFieldControlDirective, selector: "input, textarea, select, vdr-currency-input" }, { kind: "component", type: i1.DropdownComponent, selector: "vdr-dropdown", inputs: ["manualToggle"] }, { kind: "component", type: i1.DropdownMenuComponent, selector: "vdr-dropdown-menu", inputs: ["vdrPosition", "customClasses"] }, { kind: "directive", type: i1.DropdownTriggerDirective, selector: "[vdrDropdownTrigger]" }, { kind: "component", type: i1.DataTable2ColumnComponent, selector: "vdr-dt2-column", inputs: ["id", "expand", "heading", "align", "sort", "optional", "hiddenByDefault", "orderable"], exportAs: ["row"] }, { kind: "component", type: i1.DataTableCustomFieldColumnComponent, selector: "vdr-dt2-custom-field-column", inputs: ["customField", "sorts"], exportAs: ["row"] }, { kind: "component", type: LineFulfillmentComponent, selector: "vdr-line-fulfillment", inputs: ["line", "allOrderFulfillments", "orderState"] }, { kind: "component", type: LineRefundsComponent, selector: "vdr-line-refunds", inputs: ["line", "payments"] }, { kind: "component", type: OrderDataTableComponent, selector: "vdr-order-data-table", inputs: ["order"] }, { kind: "component", type: OrderTotalColumnComponent, selector: "vdr-order-total-column", exportAs: ["row"] }, { kind: "pipe", type: i4.TranslatePipe, name: "translate" }, { kind: "pipe", type: i1.AssetPreviewPipe, name: "assetPreview" }, { kind: "pipe", type: i1.LocaleDatePipe, name: "localeDate" }, { kind: "pipe", type: i1.LocaleCurrencyPipe, name: "localeCurrency" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
760
764
  }
761
765
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: OrderTableComponent, decorators: [{
762
766
  type: Component,
763
- args: [{ selector: 'vdr-order-table', changeDetection: ChangeDetectionStrategy.OnPush, template: "<vdr-order-data-table id=\"order-detail-list\" [items]=\"order.lines\" [order]=\"order\">\n <vdr-dt2-column id=\"id\" [heading]=\"'common.id' | translate\" [hiddenByDefault]=\"true\">\n <ng-template let-line=\"item\">\n {{ line.id }}\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column\n id=\"created-at\"\n [heading]=\"'common.created-at' | translate\"\n [hiddenByDefault]=\"true\"\n >\n <ng-template let-line=\"item\">\n {{ line.createdAt | localeDate : 'short' }}\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column\n id=\"updated-at\"\n [heading]=\"'common.updated-at' | translate\"\n [hiddenByDefault]=\"true\"\n >\n <ng-template let-line=\"item\">\n {{ line.updatedAt | localeDate : 'short' }}\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'common.image' | translate\" id=\"image\">\n <ng-template let-line=\"item\">\n <div class=\"image-placeholder\">\n <img\n *ngIf=\"line.featuredAsset as asset; else imagePlaceholder\"\n [src]=\"asset | assetPreview : 'tiny'\"\n />\n <ng-template #imagePlaceholder>\n <div class=\"placeholder\">\n <clr-icon shape=\"image\" size=\"48\"></clr-icon>\n </div>\n </ng-template>\n </div>\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'order.product-name' | translate\" id=\"product-name\">\n <ng-template let-line=\"item\">\n {{ line.productVariant.name }}\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'order.product-sku' | translate\" id=\"product-sku\" [optional]=\"false\">\n <ng-template let-line=\"item\">\n {{ line.productVariant.sku }}\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'order.unit-price' | translate\" id=\"unit-price\">\n <ng-template let-line=\"item\">\n <div class=\"unit-price\">\n {{ line.unitPriceWithTax | localeCurrency : order.currencyCode }}\n <div class=\"net-price\" [title]=\"'order.net-price' | translate\">\n {{ line.unitPrice | localeCurrency : order.currencyCode }}\n </div>\n </div>\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'order.quantity' | translate\" id=\"quantity\" [optional]=\"false\">\n <ng-template let-line=\"item\">\n <ng-container *ngIf=\"!isDraft; else draft\">\n <div class=\"flex\">\n <div\n *ngIf=\"line.orderPlacedQuantity && line.quantity !== line.orderPlacedQuantity\"\n class=\"order-placed-quantity\"\n [title]=\"'order.original-quantity-at-checkout' | translate\"\n >\n {{ line.orderPlacedQuantity }}\n </div>\n <div>{{ line.quantity }}</div>\n </div>\n </ng-container>\n <ng-template #draft>\n <div class=\"flex\">\n <input\n class=\"draft-qty\"\n type=\"number\"\n min=\"0\"\n #qtyInput\n [value]=\"line.quantity\"\n (blur)=\"draftInputBlur(line, qtyInput.valueAsNumber)\"\n />\n <button class=\"icon-button\" (click)=\"remove.emit({ lineId: line.id })\">\n <clr-icon shape=\"trash\"></clr-icon>\n </button>\n </div>\n </ng-template>\n <vdr-line-refunds [line]=\"line\" [payments]=\"order.payments\"></vdr-line-refunds>\n <vdr-line-fulfillment\n [line]=\"line\"\n [orderState]=\"order.state\"\n [allOrderFulfillments]=\"order.fulfillments\"\n ></vdr-line-fulfillment>\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-custom-field-column\n *ngFor=\"let customField of orderLineCustomFields\"\n [customField]=\"customField\"\n />\n <vdr-order-total-column [heading]=\"'order.total' | translate\" id=\"total\" [optional]=\"false\">\n <ng-template let-line=\"item\">\n <div class=\"unit-price\">\n {{ line.linePriceWithTax | localeCurrency : order.currencyCode }}\n <div class=\"net-price\" [title]=\"'order.net-price' | translate\">\n {{ line.linePrice | localeCurrency : order.currencyCode }}\n </div>\n </div>\n\n <ng-container *ngIf=\"getLineDiscounts(line) as discounts\">\n <vdr-dropdown *ngIf=\"discounts.length\">\n <div class=\"promotions-label\" vdrDropdownTrigger>\n {{ 'order.promotions-applied' | translate }}\n </div>\n <vdr-dropdown-menu>\n <div class=\"line-promotion\" *ngFor=\"let discount of discounts\">\n <a class=\"promotion-name\" [routerLink]=\"getPromotionLink(discount)\">{{\n discount.description\n }}</a>\n <div class=\"promotion-amount\">\n {{ discount.amountWithTax | localeCurrency : order.currencyCode }}\n <div class=\"net-price\" [title]=\"'order.net-price' | translate\">\n {{ discount.amount | localeCurrency : order.currencyCode }}\n </div>\n </div>\n </div>\n </vdr-dropdown-menu>\n </vdr-dropdown>\n </ng-container>\n </ng-template>\n </vdr-order-total-column>\n</vdr-order-data-table>\n", styles: [":host .is-cancelled td{text-decoration:line-through;background-color:var(--color-component-bg-200)}:host .sub-total td{border-top:1px dashed var(--color-component-border-200)}:host .total td{font-weight:700;border-top:1px dashed var(--color-component-border-200)}:host td.custom-fields-row{border-top-style:dashed;border-top-color:var(--color-grey-200)}:host img{border-radius:var(--border-radius-img)}:host .order-line-custom-fields{display:flex;flex-wrap:wrap}:host .order-line-custom-fields .custom-field{text-align:start;max-width:200px;overflow:hidden;text-overflow:ellipsis;margin-bottom:6px;margin-inline-end:18px}:host .draft-qty{max-width:48px}:host .order-line-custom-field{background-color:var(--color-component-bg-100)}:host .order-line-custom-field .custom-field-ellipsis{color:var(--color-text-300)}:host .net-price{font-size:11px;color:var(--color-text-300);line-height:14px}:host .promotions-label{text-decoration:underline dotted var(--color-text-200);font-size:11px;margin-top:6px;cursor:pointer;text-transform:lowercase}:host .thumb img{width:50px;height:50px}:host .shipping-method-name{font-size:var(--font-size-xs);margin-inline-end:2px}:host .order-placed-quantity{text-decoration:line-through;color:var(--color-text-300);margin-inline-end:2px}::ng-deep .line-promotion{display:flex;justify-content:space-between;padding:6px 12px}::ng-deep .line-promotion .promotion-amount{margin-inline-start:12px}::ng-deep .line-promotion .net-price{font-size:11px;color:var(--color-text-300)}\n"] }]
767
+ args: [{ selector: 'vdr-order-table', changeDetection: ChangeDetectionStrategy.OnPush, template: "<vdr-order-data-table id=\"order-detail-list\" [items]=\"order.lines\" [order]=\"order\">\n <vdr-dt2-column id=\"id\" [heading]=\"'common.id' | translate\" [hiddenByDefault]=\"true\">\n <ng-template let-line=\"item\">\n {{ line.id }}\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column\n id=\"created-at\"\n [heading]=\"'common.created-at' | translate\"\n [hiddenByDefault]=\"true\"\n >\n <ng-template let-line=\"item\">\n {{ line.createdAt | localeDate : 'short' }}\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column\n id=\"updated-at\"\n [heading]=\"'common.updated-at' | translate\"\n [hiddenByDefault]=\"true\"\n >\n <ng-template let-line=\"item\">\n {{ line.updatedAt | localeDate : 'short' }}\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'common.image' | translate\" id=\"image\">\n <ng-template let-line=\"item\">\n <div class=\"image-placeholder\">\n <img\n *ngIf=\"getOrderLineAsset(line) as asset; else imagePlaceholder\"\n [src]=\"asset | assetPreview : 'tiny'\"\n />\n <ng-template #imagePlaceholder>\n <div class=\"placeholder\">\n <clr-icon shape=\"image\" size=\"48\"></clr-icon>\n </div>\n </ng-template>\n </div>\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'order.product-name' | translate\" id=\"product-name\">\n <ng-template let-line=\"item\">\n {{ line.productVariant.name }}\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'order.product-sku' | translate\" id=\"product-sku\" [optional]=\"false\">\n <ng-template let-line=\"item\">\n {{ line.productVariant.sku }}\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'order.unit-price' | translate\" id=\"unit-price\">\n <ng-template let-line=\"item\">\n <div class=\"unit-price\">\n {{ line.unitPriceWithTax | localeCurrency : order.currencyCode }}\n <div class=\"net-price\" [title]=\"'order.net-price' | translate\">\n {{ line.unitPrice | localeCurrency : order.currencyCode }}\n </div>\n </div>\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-column [heading]=\"'order.quantity' | translate\" id=\"quantity\" [optional]=\"false\">\n <ng-template let-line=\"item\">\n <ng-container *ngIf=\"!isDraft; else draft\">\n <div class=\"flex\">\n <div\n *ngIf=\"line.orderPlacedQuantity && line.quantity !== line.orderPlacedQuantity\"\n class=\"order-placed-quantity\"\n [title]=\"'order.original-quantity-at-checkout' | translate\"\n >\n {{ line.orderPlacedQuantity }}\n </div>\n <div>{{ line.quantity }}</div>\n </div>\n </ng-container>\n <ng-template #draft>\n <div class=\"flex\">\n <input\n class=\"draft-qty\"\n type=\"number\"\n min=\"0\"\n #qtyInput\n [value]=\"line.quantity\"\n (blur)=\"draftInputBlur(line, qtyInput.valueAsNumber)\"\n />\n <button class=\"icon-button\" (click)=\"remove.emit({ lineId: line.id })\">\n <clr-icon shape=\"trash\"></clr-icon>\n </button>\n </div>\n </ng-template>\n <vdr-line-refunds [line]=\"line\" [payments]=\"order.payments\"></vdr-line-refunds>\n <vdr-line-fulfillment\n [line]=\"line\"\n [orderState]=\"order.state\"\n [allOrderFulfillments]=\"order.fulfillments\"\n ></vdr-line-fulfillment>\n </ng-template>\n </vdr-dt2-column>\n <vdr-dt2-custom-field-column\n *ngFor=\"let customField of orderLineCustomFields\"\n [customField]=\"customField\"\n />\n <vdr-order-total-column [heading]=\"'order.total' | translate\" id=\"total\" [optional]=\"false\">\n <ng-template let-line=\"item\">\n <div class=\"unit-price\">\n {{ line.linePriceWithTax | localeCurrency : order.currencyCode }}\n <div class=\"net-price\" [title]=\"'order.net-price' | translate\">\n {{ line.linePrice | localeCurrency : order.currencyCode }}\n </div>\n </div>\n\n <ng-container *ngIf=\"getLineDiscounts(line) as discounts\">\n <vdr-dropdown *ngIf=\"discounts.length\">\n <div class=\"promotions-label\" vdrDropdownTrigger>\n {{ 'order.promotions-applied' | translate }}\n </div>\n <vdr-dropdown-menu>\n <div class=\"line-promotion\" *ngFor=\"let discount of discounts\">\n <a class=\"promotion-name\" [routerLink]=\"getPromotionLink(discount)\">{{\n discount.description\n }}</a>\n <div class=\"promotion-amount\">\n {{ discount.amountWithTax | localeCurrency : order.currencyCode }}\n <div class=\"net-price\" [title]=\"'order.net-price' | translate\">\n {{ discount.amount | localeCurrency : order.currencyCode }}\n </div>\n </div>\n </div>\n </vdr-dropdown-menu>\n </vdr-dropdown>\n </ng-container>\n </ng-template>\n </vdr-order-total-column>\n</vdr-order-data-table>\n", styles: [":host .is-cancelled td{text-decoration:line-through;background-color:var(--color-component-bg-200)}:host .sub-total td{border-top:1px dashed var(--color-component-border-200)}:host .total td{font-weight:700;border-top:1px dashed var(--color-component-border-200)}:host td.custom-fields-row{border-top-style:dashed;border-top-color:var(--color-grey-200)}:host img{border-radius:var(--border-radius-img)}:host .order-line-custom-fields{display:flex;flex-wrap:wrap}:host .order-line-custom-fields .custom-field{text-align:start;max-width:200px;overflow:hidden;text-overflow:ellipsis;margin-bottom:6px;margin-inline-end:18px}:host .draft-qty{max-width:48px}:host .order-line-custom-field{background-color:var(--color-component-bg-100)}:host .order-line-custom-field .custom-field-ellipsis{color:var(--color-text-300)}:host .net-price{font-size:11px;color:var(--color-text-300);line-height:14px}:host .promotions-label{text-decoration:underline dotted var(--color-text-200);font-size:11px;margin-top:6px;cursor:pointer;text-transform:lowercase}:host .thumb img{width:50px;height:50px}:host .shipping-method-name{font-size:var(--font-size-xs);margin-inline-end:2px}:host .order-placed-quantity{text-decoration:line-through;color:var(--color-text-300);margin-inline-end:2px}::ng-deep .line-promotion{display:flex;justify-content:space-between;padding:6px 12px}::ng-deep .line-promotion .promotion-amount{margin-inline-start:12px}::ng-deep .line-promotion .net-price{font-size:11px;color:var(--color-text-300)}\n"] }]
764
768
  }], propDecorators: { order: [{
765
769
  type: Input
766
770
  }], orderLineCustomFields: [{
@@ -3653,5 +3657,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
3653
3657
  * Generated bundle index. Do not edit.
3654
3658
  */
3655
3659
 
3656
- export { AddManualPaymentDialogComponent, CancelOrderDialogComponent, CouponCodeSelectorComponent, DraftOrderDetailComponent, DraftOrderVariantSelectorComponent, FulfillOrderDialogComponent, FulfillmentCardComponent, FulfillmentDetailComponent, FulfillmentStateLabelComponent, GET_COUPON_CODE_SELECTOR_PROMOTION_LIST, GET_CUSTOMER_ADDRESSES, GET_ORDER_STATE, GET_SELLER_ORDERS, LineFulfillmentComponent, LineRefundsComponent, ModificationDetailComponent, NODE_HEIGHT, ORDER_DETAIL_QUERY, OrderCustomFieldsCardComponent, OrderDataTableComponent, OrderDetailComponent, OrderEditResultType, OrderEditorComponent, OrderEditsPreviewDialogComponent, OrderGuard, OrderHistoryComponent, OrderHistoryEntryHostComponent, OrderListComponent, OrderModificationSummaryComponent, OrderModule, OrderPaymentCardComponent, OrderProcessEdgeComponent, OrderProcessGraphComponent, OrderProcessGraphDialogComponent, OrderProcessNodeComponent, OrderStateSelectDialogComponent, OrderTableComponent, OrderTotalColumnComponent, OrderTransitionService, PaymentDetailComponent, PaymentForRefundSelectorComponent, PaymentStateLabelComponent, RefundDetailComponent, RefundOrderDialogComponent, RefundStateLabelComponent, SET_ORDER_CUSTOMER_MUTATION, SelectAddressDialogComponent, SelectCustomerDialogComponent, SelectShippingMethodDialogComponent, SellerOrdersCardComponent, SettleRefundDialogComponent, SimpleItemListComponent, createRoutes, getRefundablePayments };
3660
+ export { AddManualPaymentDialogComponent, CancelOrderDialogComponent, CouponCodeSelectorComponent, DraftOrderDetailComponent, DraftOrderVariantSelectorComponent, FulfillOrderDialogComponent, FulfillmentCardComponent, FulfillmentDetailComponent, FulfillmentStateLabelComponent, GET_COUPON_CODE_SELECTOR_PROMOTION_LIST, GET_CUSTOMER_ADDRESSES, GET_ORDER_STATE, GET_SELLER_ORDERS, LineFulfillmentComponent, LineRefundsComponent, ModificationDetailComponent, NODE_HEIGHT, ORDER_DETAIL_QUERY, OrderCustomFieldsCardComponent, OrderDataTableComponent, OrderDetailComponent, OrderEditResultType, OrderEditorComponent, OrderEditsPreviewDialogComponent, OrderGuard, OrderHistoryComponent, OrderHistoryEntryHostComponent, OrderListComponent, OrderModificationSummaryComponent, OrderModule, OrderPaymentCardComponent, OrderProcessEdgeComponent, OrderProcessGraphComponent, OrderProcessGraphDialogComponent, OrderProcessNodeComponent, OrderStateSelectDialogComponent, OrderTableComponent, OrderTotalColumnComponent, OrderTransitionService, PaymentDetailComponent, PaymentForRefundSelectorComponent, PaymentStateLabelComponent, RefundDetailComponent, RefundOrderDialogComponent, RefundStateLabelComponent, SET_ORDER_CUSTOMER_MUTATION, SelectAddressDialogComponent, SelectCustomerDialogComponent, SelectShippingMethodDialogComponent, SellerOrdersCardComponent, SettleRefundDialogComponent, SimpleItemListComponent, createRoutes, getOrderLineAsset, getRefundablePayments };
3657
3661
  //# sourceMappingURL=deenruv-admin-ui-order.mjs.map