@colijnit/transaction 12.1.48 → 12.1.50

package/fesm2015/colijnit-transaction.js

@@ -65,17 +65,19 @@ import { ResolveHeaderPendingReasonRequest } from '@colijnit/transactionapi/buil
 import { DocDeliveryBatch } from '@colijnit/transactionapi/build/model/doc-delivery-batch.bo';
 import { NULL_CUSTOMER_FULL_OBJECT, NULL_RELATION_OBJECT } from '@colijnit/transactionapi/build/model/nul-relation-object';
 import { RelationKind } from '@colijnit/transactionapi/build/enum/relation-kind.enum';
-import { FormMasterService, CoDialogModule, ButtonModule, CollapsibleModule, InputCheckboxModule, InputTextModule, InputComboBoxModule, FormModule, InputRadioButtonModule, IconModule, InputListboxModule, DropDownModule, CoOrientation, CoDirection, ColumnAlign, SimpleGridColumnDirective, ObserveVisibilityModule, PriceDisplayPipeModule, InputDatePickerModule, Carousel3dModule, InputDatePickerComponent, InputTextareaComponent, InputTextareaModule, InputTextComponent, InputSearchModule, InputNumberPickerModule, CoDialogPromptModule, MultiSelectListModule, PopupModule, CoSidebarModule, CoGridModule, CoRichTextEditorModule, CarouselModule, SimpleGridModule, GridToolbarButtonModule, InputDateRangePickerModule, ClickoutsideModule, FilterItemModule, PaginationModule, PaginationBarModule, IconCollapseHandleModule } from '@colijnit/corecomponents_v12';
+import { FormMasterService, CoDialogModule, ButtonModule, CollapsibleModule, InputCheckboxModule, InputTextModule, InputComboBoxModule, FormModule, InputRadioButtonModule, IconModule, InputTextComponent, InputListboxModule, DropDownModule, ColumnAlign, SimpleGridColumnDirective, ObserveVisibilityModule, ColorSequenceService, PriceDisplayPipeModule, InputDatePickerModule, Carousel3dModule, InputDatePickerComponent, InputTextareaComponent, InputTextareaModule, InputSearchModule, InputNumberPickerModule, CoDialogPromptModule, MultiSelectListModule, PopupModule, CoSidebarModule, CoGridModule, CoRichTextEditorModule, CarouselModule, SimpleGridModule, GridToolbarButtonModule, InputDateRangePickerModule, ClickoutsideModule, CoOrientation, CoDirection, FilterItemModule, PaginationModule, PaginationBarModule, IconCollapseHandleModule } from '@colijnit/corecomponents_v12';
 import { FlexModule } from '@angular/flex-layout';
 import { AddressType } from '@colijnit/transactionapi/build/enum/address-type.enum';
 import { trigger, state, style, transition, animate } from '@angular/animations';
 import { CommonModule, DatePipe } from '@angular/common';
 import { FormsModule, ReactiveFormsModule } from '@angular/forms';
 import { Address } from '@colijnit/transactionapi/build/model/address.bo';
+import { TransactionTotal } from '@colijnit/transactionapi/build/model/transaction-total.bo';
+import { DiscountType } from '@colijnit/transactionapi/build/enum/discount-type.enum';
 import { moveItemInArray, DragDropModule } from '@angular/cdk/drag-drop';
 import { TransactionAddTextLineRequest } from '@colijnit/transactionapi/build/model/transaction-add-text-line-request.bo';
-import { TransactionSearchViewRequest } from '@colijnit/transactionapi/build/model/transaction-search-view-request';
 import { PagingParameters } from '@colijnit/transactionapi/build/model/paging-parameters';
+import { TransactionSearchViewRequest } from '@colijnit/transactionapi/build/model/transaction-search-view-request';
 import { RelationKind as RelationKind$1 } from '@colijnit/articleapi/build/enum/relation-kind.enum';
 import { StockStatus } from '@colijnit/transactionapi/build/enum/refcode/stock-status.enum';
 import { ReceiveGoodsForPurchaseOrderRequest } from '@colijnit/transactionapi/build/model/receive-goods-for-purchase-order-request.bo';
@@ -92,7 +94,6 @@ import { ContactOption } from '@colijnit/transactionapi/build/model/contact-opti
 import { BusinessObjectUtils } from '@colijnit/transactionapi/build/utils/business-object-utils';
 import { ScrollingModule } from '@angular/cdk/scrolling';
 import { RelationSmallObject } from '@colijnit/transactionapi/build/model/relation-small-object.bo';
-import { DiscountType } from '@colijnit/transactionapi/build/enum/discount-type.enum';
 import { ReceiveGoodsForPurchaseOrderCorrectionRequest } from '@colijnit/transactionapi/build/model/receive-goods-for-purchase-order-correction-request.bo';
 import { PurchaseOrderLineReceiptCorrectionDetails } from '@colijnit/transactionapi/build/model/purchase-order-line-receipt-correction-details.bo';
 import { GetPurchasePortalLine } from '@colijnit/transactionapi/build/model/get-purchase-portal-line';
@@ -177,6 +178,7 @@ class Dictionary {
     constructor() {
         this.strings = {
             "nl": {
+                "0_RESULTS_FOUND": "0 resultaten gevonden",
                 "ACCOUNT_DETAILS": "Accountgegevens",
                 "ACCOUNT_EXPLANATION": "Het e-mailadres en wachtwoord zijn nodig om toegang te krijgen tot de gegevens. " +
                     "Ook zullen we je via dit e-mailadres op de hoogte houden van de status van bestellingen.",
@@ -440,6 +442,7 @@ class Dictionary {
                 "RECEIVED": "Ontvangst",
                 "RECEIVED_DELIVERED": "Binnengemeld / geleverd",
                 "RECEIVED_DATE": "Ontvangst datum",
+                "REDISTRIBUTE_DISCOUNT": "Herverdeel korting",
                 "REFERENCE": "Referentie",
                 "REFERENCE_RELATION": "Ref. relatie",
                 "RELATION_NUMBER": "Relatienummer",
@@ -526,6 +529,7 @@ class Dictionary {
             "de": {},
             "fr": {},
             "en": {
+                "0_RESULTS_FOUND": "0 results found",
                 "ACCOUNT_DETAILS": "Account details",
                 "ACCOUNT_EXPLANATION": "E-mailaddress and password are needed to gain access to the data. We also notify you on this e-mailaddress about the order status",
                 "ACTIVE": "Active",
@@ -771,6 +775,7 @@ class Dictionary {
                 "RECEIPT_DETAILS": "Receipt details",
                 "RECEIVED": "Received",
                 "RECEIVED_DATE": "Received date",
+                "REDISTRIBUTE_DISCOUNT": "Redistribute discount",
                 "RECEIVED_DELIVERED": "Received / delivered",
                 "REFERENCE": "Reference",
                 "REFERENCE_RELATION": "Ref. relation",
@@ -2411,7 +2416,7 @@ class TransactionFilterPopupBaseComponent {
         });
         this.viewModelsFiltered = this.viewModels.slice();
         if (!this.useModel && this.viewModels.length > 0) {
-            this.valueChange.next(this.viewModels[0].value);
+            this.valueChange.next(this.value ? this.value : this.viewModels[0].value);
         }
     }
     _doSearch() {
@@ -4112,6 +4117,23 @@ class TransactionConnectorAdapterService {
             }
         });
     }
+    changeHeaderTransactionDiscount(uuid, type, amount) {
+        return __awaiter(this, void 0, void 0, function* () {
+            const request = {
+                transactionUuid: uuid,
+                orderDiscountType: type,
+                discountValue: amount
+            };
+            const response = yield this.connector.setTransactionDiscounts(request);
+            if (response && response.validationResult && response.validationResult.success) {
+                return this._boFactory.makeWithRawBackendData(TransactionInfoResponse, response.resultObject);
+            }
+            else {
+                this._handleExceptionFromResponse(response);
+                return null;
+            }
+        });
+    }
     changeHeaderTransactionToDownPay(uuid, downPayment) {
         return __awaiter(this, void 0, void 0, function* () {
             const request = {
@@ -4766,6 +4788,11 @@ class TransactionConnectorService {
             return this._adapterService.changeHeaderTransactionMarketing(uuid, code);
         });
     }
+    changeHeaderTransactionDiscount(uuid, type, amount) {
+        return __awaiter(this, void 0, void 0, function* () {
+            return this._adapterService.changeHeaderTransactionDiscount(uuid, type, amount);
+        });
+    }
     changeHeaderTransactionToDownPay(uuid, downPayment) {
         return __awaiter(this, void 0, void 0, function* () {
             return this._adapterService.changeHeaderTransactionToDownPay(uuid, downPayment);
@@ -5139,6 +5166,7 @@ class PendingReasonService {
     }
     _showWarehouseCcDialog(uuid, quantity, commissionCode, warehouseNr, reason, type) {
         return __awaiter(this, void 0, void 0, function* () {
+            commissionCode = "2";
             const reasonRequest = new ResolveLinePendingReasonRequest(uuid, reason, type);
             const response = yield this.dialogService.showWarehouseCC(quantity, commissionCode, warehouseNr);
             if (response.button === AppPopupButtonType.Ok) {
@@ -5421,6 +5449,17 @@ class TransactionService extends PendingReasonService {
             return false;
         });
     }
+    updateHeaderTransactionDiscount(uuid, type, amount) {
+        return __awaiter(this, void 0, void 0, function* () {
+            const response = yield this.connector.changeHeaderTransactionDiscount(uuid, type, amount);
+            if (response) {
+                const success = yield this.handleHeaderOperationStatuses(response);
+                this.rememberCurrentTransaction(response);
+                return success;
+            }
+            return false;
+        });
+    }
     updateQuantityTransactionLine(uuid, lineUuid, quantity) {
         return __awaiter(this, void 0, void 0, function* () {
             const response = yield this.connector.changeTransactionLineQuantity(uuid, lineUuid, quantity);
@@ -7747,7 +7786,7 @@ TileComponent.decorators = [
                 template: `
     <div class="co-tile-wrapper" (click)="selectedChange.emit(selected)">
       <div class="co-tile-select-wrapper">
-        <co-input-radio-button [checked]="selected" (modelChange)="selectedChange.emit($event)"></co-input-radio-button>
+        <co-input-radio-button [model]="selected" (modelChange)="selectedChange.emit($event)"></co-input-radio-button>
       </div>
       <div class="co-tile-content-wrapper">
         <ng-content></ng-content>
@@ -8014,6 +8053,7 @@ class TransactionTotalsComponent {
     constructor() {
         this.showDiscount = false;
         this.discountClick = new EventEmitter();
+        this.showDiscountDialog = false;
     }
     showClass() {
         return true;
@@ -8025,337 +8065,672 @@ TransactionTotalsComponent.decorators = [
                 template: `
     <div class="transaction-totals-wrapper">
       <span class="totals-gross label" [textContent]="'ORDER_GROSS' | localize"></span>
-      <span class="totals-gross value" [textContent]="totals?.grossAmount | coCurrency: true"></span>
-      <ng-container *ngIf="totals?.discountAmount">
+      <span class="totals-gross value" [textContent]="transactionTotal?.grossAmount | coCurrency: true"></span>
+      <ng-container *ngIf="transactionTotal?.discountAmount">
         <span class="totals-discount-amount label" [textContent]="'DISCOUNT_AMOUNT' | localize"></span>
-        <span class="totals-discount-amount value" [textContent]="totals?.discountAmount | coCurrency: true"></span>
+        <span class="totals-discount-amount value" [class.transaction-negative-value]="transactionTotal?.discountAmount < 0" [textContent]="transactionTotal?.discountAmount | coCurrency: true"></span>
       </ng-container>
-      <ng-container *ngIf="totals?.transactionDiscountAmount">
+      <ng-container *ngIf="transactionTotal?.transactionDiscountAmount">
         <span class="totals-discount label" [textContent]="'TRANSACTION_DISCOUNT' | localize"></span>
-        <span class="totals-discount value" [textContent]="totals?.transactionDiscountAmount | coCurrency: true"></span>
+        <span class="totals-discount value" [class.transaction-negative-value]="transactionTotal?.transactionDiscountAmount < 0" [textContent]="transactionTotal?.transactionDiscountAmount | coCurrency: true"></span>
       </ng-container>
-      <ng-container *ngIf="totals?.transactionDiscountPercentage">
+      <ng-container *ngIf="transactionTotal?.transactionDiscountPercentage">
         <span class="totals-discount-percentage label" [textContent]="'TRANSACTION_DISCOUNT_PERC' | localize"></span>
-        <span class="totals-discount-percentage value" [textContent]="totals?.transactionDiscountPercentage.toString() | append:' %'"></span>
+        <span class="totals-discount-percentage value" [class.transaction-negative-value]="transactionTotal?.transactionDiscountPercentage < 0" [textContent]="transactionTotal?.transactionDiscountPercentage.toString() | append:' %'"></span>
       </ng-container>
       <span class="totals-net label" [textContent]="'ORDER_NET'| localize"></span>
-      <span class="totals-net value" [textContent]="totals?.netAmount | coCurrency: true"></span>
-      <a *ngIf="showDiscount" class="add-discount label" (click)="discountClick.emit($event)" [textContent]="'ADD_DISCOUNTS' | localize"></a>
+      <span class="totals-net value" [textContent]="transactionTotal?.netAmount | coCurrency: true"></span>
+      <a *ngIf="showDiscount" class="add-discount label" (click)="showDiscountDialog = true" [textContent]="'ADD_DISCOUNTS' | localize"></a>
     </div>
+    <co-dialog-transaction-header-discount class="discount-dialog" *ngIf="showDiscountDialog"
+                                           [transactionInfo]="transactionInfo"
+                                           [transactionTotal]="transactionTotal"
+                                           (close)="showDiscountDialog = false">
+    </co-dialog-transaction-header-discount>
   `,
                 encapsulation: ViewEncapsulation.None
             },] }
 ];
 TransactionTotalsComponent.propDecorators = {
-    totals: [{ type: Input }],
+    transactionInfo: [{ type: Input }],
+    transactionTotal: [{ type: Input }],
     showDiscount: [{ type: Input }],
     discountClick: [{ type: Output }],
     showClass: [{ type: HostBinding, args: ["class.co-transaction-totals",] }]
 };
 
-class TransactionTotalsModule {
-}
-TransactionTotalsModule.decorators = [
-    { type: NgModule, args: [{
-                imports: [
-                    CommonModule,
-                    CoreModule,
-                    PipeModule
-                ],
-                declarations: [
-                    TransactionTotalsComponent
-                ],
-                exports: [
-                    TransactionTotalsComponent
-                ]
-            },] }
-];
-
-class TransactionArticleTextComponent {
-    constructor(service) {
-        this.service = service;
-        this.closeClick = new EventEmitter();
-        this.cancelClick = new EventEmitter();
-        this.saveClick = new EventEmitter();
-        this.showOverviewDialog = false;
-        this.standardTexts = [];
-        this.documents = [];
-        this.fields = { text: "description", value: "textId" };
-        this.fieldsDocuments = { text: "description", value: "code" };
-        this.transactionAddTextLineRequest = new TransactionAddTextLineRequest();
+class TransactionHeaderBaseComponent extends TransactionFilterPopupBaseComponent {
+    constructor() {
+        super(...arguments);
+        this.readonly = false;
+        this._transactionInfo = new TransactionInfo();
+        this._transactionTotal = new TransactionTotal();
     }
-    set transactionLine(value) {
+    set transactionInfo(value) {
         if (value) {
-            this.transactionAddTextLineRequest.transactionUuid = value.uuid;
-            this.transactionAddTextLineRequest.text = value.text;
+            this._transactionInfo = value;
+            this.transactionInfoSet();
         }
     }
-    set articleRef(value) {
+    get transactionInfo() {
+        return this._transactionInfo;
+    }
+    set transactionTotal(value) {
         if (value) {
-            this._articleRef = value;
+            this._transactionTotal = value;
+            this.transactionTotalSet();
         }
     }
-    get articleRef() {
-        return this._articleRef;
+    get transactionTotal() {
+        return this._transactionTotal;
     }
-    set editText(value) {
-        this.transactionAddTextLineRequest.text = value;
+    get model() {
+        return this._transactionInfo;
     }
-    set articleLineNr(value) {
-        if (value) {
-            this.transactionAddTextLineRequest.refArticleLineNr = value;
-        }
+    // overridden by descendents
+    transactionInfoSet() {
     }
-    showClass() {
-        return true;
+    // overridden by descendents
+    transactionTotalSet() {
     }
-    ngOnInit() {
-        return __awaiter(this, void 0, void 0, function* () {
-            this.standardTexts = yield this.service.getStandardTexts("NL");
-            this.documents = yield this.service.getTextTypes("NL");
-        });
+}
+TransactionHeaderBaseComponent.decorators = [
+    { type: Directive }
+];
+TransactionHeaderBaseComponent.propDecorators = {
+    transactionInfo: [{ type: Input }],
+    transactionTotal: [{ type: Input }]
+};
+
+class DialogTransactionHeaderBaseComponent extends TransactionHeaderBaseComponent {
+    constructor() {
+        super(...arguments);
+        this.buttonType = AppPopupButtonType;
+        this.close = new EventEmitter();
     }
-    onOkClick(event) {
-        this.saveClick.next(this.transactionAddTextLineRequest);
+    onClose(eventType, output) {
+        return;
     }
-    onCancelClick(event) {
-        this.cancelClick.next(event);
+    handleValueChange(value) {
+        this.value = value;
     }
-    onSelectStandardText(value) {
-        this.transactionAddTextLineRequest.text = (this.standardTexts.find(x => x.textId === value)).text;
+    handleOkClick() {
+        this.onClose(AppPopupButtonType.Ok, this.value);
     }
-    handleDocumentsChange(docs) {
+    handleSearch(text) {
+        this.searchText = text;
+    }
+    handleClose(type) {
+        this.close.emit();
+        this.onClose(type);
     }
 }
-TransactionArticleTextComponent.decorators = [
+DialogTransactionHeaderBaseComponent.decorators = [
+    { type: Directive }
+];
+DialogTransactionHeaderBaseComponent.propDecorators = {
+    close: [{ type: Output }]
+};
+
+class DialogTransactionHeaderDiscountComponent extends DialogTransactionHeaderBaseComponent {
+    constructor(_transactionService) {
+        super();
+        this._transactionService = _transactionService;
+    }
+    showClass() {
+        return true;
+    }
+    redistributeDiscount() {
+        return __awaiter(this, void 0, void 0, function* () {
+            yield this._transactionService.updateHeaderTransactionDiscount(this.transactionInfo.uuid, DiscountType.TransactionDiscountAmount, this.transactionTotal.transactionDiscountAmount);
+        });
+    }
+}
+DialogTransactionHeaderDiscountComponent.decorators = [
     { type: Component, args: [{
-                selector: "co-transaction-article-text",
+                selector: "co-dialog-transaction-header-discount",
                 template: `
-    <co-dialog (closeClick)="closeClick.emit($event)" [headerTemplate]="headerTemplate" [footerTemplate]="footerTemplate">
-      <div class="article-text-content-wrapper">
-        <div class="editor-wrapper">
-          <textarea class="article-text"
-                    [(ngModel)]="transactionAddTextLineRequest.text"
-          ></textarea>
+    <co-dialog [headerTemplate]="dialogHeader" (closeClick)="handleClose(buttonType.Ok)">
+      <div class="transaction-discount-wrapper co-transaction-small-toolbar">
+        <div class="two-column-grid">
+          <co-transaction-header-discount-percentage [transactionInfo]="transactionInfo" [transactionTotal]="transactionTotal"></co-transaction-header-discount-percentage>
+          <co-transaction-header-discount-amount [transactionInfo]="transactionInfo" [transactionTotal]="transactionTotal"></co-transaction-header-discount-amount>
         </div>
-        <div class="option-wrapper">
-          <co-input-listbox
-            [collection]="documents"
-            [fields]="fieldsDocuments"
-            [placeholder]="'FOR_DOCUMENTS' | localize"
-            [value]="transactionAddTextLineRequest.showOnDocuments"
-            [showCheckbox]="true"
-            (modelChange)="handleDocumentsChange($event)"
-          ></co-input-listbox>
-          <co-drop-down-list
-            [collection]="standardTexts"
-            [fields]="fields"
-            [placeholder]="'STANDARD_TEXTS' | localize"
-            (modelChange)="onSelectStandardText($event)"
-          ></co-drop-down-list>
+        <div class="two-column-grid">
+          <co-transaction-header-discount-transaction-total [transactionInfo]="transactionInfo" [transactionTotal]="transactionTotal"></co-transaction-header-discount-transaction-total>
+          <div class="transaction-line-button custom-width" (click)="redistributeDiscount()">
+              <span class="co-transaction-overflow-ellipsis transaction-discount"
+                    [textContent]="'REDISTRIBUTE_DISCOUNT' | localize"></span>
+          </div>
+        </div>
+        <div class="transaction-discount-overview">
+          <div class="transaction-discount-overview-item">
+            <div class="title" [textContent]="'ORDER_GROSS' | localize"></div>
+            <div class="value" [textContent]="transactionTotal.grossAmount | coCurrency"></div>
+          </div>
+          <div class="transaction-discount-overview-item">
+            <div class="title" [textContent]="'DISCOUNT' | localize"></div>
+            <div class="value" [class.transaction-negative-value]="transactionTotal.discountAmount < 0" [textContent]="transactionTotal.discountAmount | coCurrency"></div>
+          </div>
+          <div class="transaction-discount-overview-item">
+            <div class="title" [textContent]="'ASSEMBLY_COSTS' | localize"></div>
+            <div class="value" [class.transaction-negative-value]="transactionTotal.assemblyCosts < 0" [textContent]="transactionTotal.assemblyCosts | coCurrency"></div>
+          </div>
+          <div class="transaction-discount-overview-item">
+            <div class="title" [textContent]="'SURCHARGE_AMOUNT' | localize"></div>
+            <div class="value" [class.transaction-negative-value]="transactionTotal.surchargeAmount < 0" [textContent]="transactionTotal.surchargeAmount | coCurrency"></div>
+          </div>
+          <div class="transaction-discount-overview-item">
+            <div class="title" [textContent]="'DELIVERY_COSTS' | localize"></div>
+            <div class="value" [textContent]="'NOT_IMPLEMENTED_YET'"></div>
+          </div>
+          <div class="transaction-discount-overview-item total">
+            <div class="title" [textContent]="'ORDER_NET' | localize"></div>
+            <div class="value" [class.transaction-negative-value]="transactionTotal.netAmount < 0" [textContent]="transactionTotal.netAmount | coCurrency"></div>
+          </div>
         </div>
       </div>
     </co-dialog>
-    <ng-template #headerTemplate><span [textContent]="header"></span></ng-template>
-    <ng-template #footerTemplate>
-      <div class="button-wrapper">
-        <co-button [label]="'OK' | localize" (click)="onOkClick($event)"></co-button>
-        <co-button [label]="'CANCEL' | localize " (click)="onCancelClick($event)"></co-button>
-      </div>
+    <ng-template #dialogHeader>
+      <div class="dialog-header-title" [textContent]="'DISCOUNT_PRICE_INFORMATION' | localize"></div>
     </ng-template>
-
   `,
                 encapsulation: ViewEncapsulation.None
             },] }
 ];
-TransactionArticleTextComponent.ctorParameters = () => [
+DialogTransactionHeaderDiscountComponent.ctorParameters = () => [
     { type: TransactionService }
 ];
-TransactionArticleTextComponent.propDecorators = {
-    header: [{ type: Input }],
-    transactionLine: [{ type: Input }],
-    articleRef: [{ type: Input }],
-    editText: [{ type: Input }],
-    articleLineNr: [{ type: Input }],
-    closeClick: [{ type: Output }],
-    cancelClick: [{ type: Output }],
-    saveClick: [{ type: Output }],
-    showClass: [{ type: HostBinding, args: ["class.co-transaction-article-text",] }]
+DialogTransactionHeaderDiscountComponent.propDecorators = {
+    showClass: [{ type: HostBinding, args: ["class.co-dialog-transaction-header-discount",] }]
 };
 
-class TransactionArticleTextModule {
-}
-TransactionArticleTextModule.decorators = [
-    { type: NgModule, args: [{
-                imports: [
-                    CommonModule,
-                    CoreModule,
-                    FormsModule,
-                    CoDialogModule,
-                    InputCheckboxModule,
-                    InputListboxModule,
-                    DropDownModule,
-                    ButtonModule,
-                    PipeModule
-                ],
-                declarations: [
-                    TransactionArticleTextComponent
-                ],
-                exports: [
-                    TransactionArticleTextComponent
-                ]
-            },] }
-];
-
-// The different view modes for search
-var SearchViewMode;
-(function (SearchViewMode) {
-    SearchViewMode[SearchViewMode["FullScreen"] = 0] = "FullScreen";
-    SearchViewMode[SearchViewMode["SideBar"] = 1] = "SideBar";
-})(SearchViewMode || (SearchViewMode = {}));
-
-var SearchBarViewMode;
-(function (SearchBarViewMode) {
-    SearchBarViewMode[SearchBarViewMode["Expanded"] = 0] = "Expanded";
-    SearchBarViewMode[SearchBarViewMode["Collapsed"] = 1] = "Collapsed";
-})(SearchBarViewMode || (SearchBarViewMode = {}));
-class TransactionSearchComponent {
-    constructor(transactionSearchService) {
-        this.transactionSearchService = transactionSearchService;
-        this.searchViewModes = SearchViewMode;
-        this.orientations = CoOrientation;
-        this.directionRight = CoDirection.Right;
-        this.transactionClick = new EventEmitter();
-        this.searchViewModeChange = new EventEmitter();
+class TransactionHeaderDiscountPercentageComponent extends TransactionHeaderBaseComponent {
+    constructor(_transactionService) {
+        super();
+        this._transactionService = _transactionService;
+        this.showLabel = true;
+        this.defaultEditMode = true;
+        this._editMode = false;
     }
-    set transactionType(value) {
-        this._transactionType = value;
-        this.transactionSearchService.transactionType = this._transactionType;
+    set child(content) {
+        if (content) {
+            this.input = content;
+            this.input.commit = (amount) => this.commit(amount);
+            if (this._editMode) {
+                this.input.requestFocus();
+            }
+        }
     }
-    get transactionType() {
-        return this._transactionType;
+    set editMode(value) {
+        this._editMode = value;
+        if (this._editMode && this.input) {
+            this.input.doFocus();
+        }
     }
-    showClass() {
-        return true;
+    get editMode() {
+        return this._editMode;
     }
-    onTransactionClick(transaction) {
-        if (this.transactionSearchService.activeSearchViewMode === this.searchViewModes.FullScreen) {
-            this.collapseSearchBar();
+    handleClick(event) {
+        event.preventDefault();
+        event.stopPropagation();
+        if (!this.readonly) {
+            this.editMode = true;
         }
-        this._scrollToTop();
-        this.transactionClick.emit(transaction);
     }
-    onSearchViewResizeClick() {
-        if (this.transactionSearchService.activeSearchViewMode === this.searchViewModes.SideBar) {
-            this.transactionSearchService.activeSearchViewMode = this.searchViewModes.FullScreen;
+    commit(amount) {
+        return __awaiter(this, void 0, void 0, function* () {
+            if (this.transactionTotal && this.transactionTotal.transactionDiscountPercentage !== amount) {
+                const oldPercentage = this.transactionTotal.transactionDiscountPercentage;
+                const success = yield this._transactionService.updateHeaderTransactionDiscount(this.transactionInfo.uuid, DiscountType.TransactionDiscountPercentage, amount);
+                if (!success) {
+                    this.input.model = amount;
+                }
+                return success;
+            }
+            return true;
+        });
+    }
+    transactionSet() {
+        this.readonly = this.readonly || !this.transactionInfo.deliveryDateDefinitive;
+    }
+}
+TransactionHeaderDiscountPercentageComponent.decorators = [
+    { type: Component, args: [{
+                selector: "co-transaction-header-discount-percentage",
+                template: `
+    <span *ngIf="(!editMode  || readonly) && !defaultEditMode" [textContent]="transactionTotal.transactionDiscountPercentage"></span>
+    <co-input-text #input *ngIf="editMode || defaultEditMode"
+                   [type]="'number'"
+                   [placeholder]="showLabel ? ('DISCOUNT_PERCENTAGE' | localize) : ''"
+                   [showSaveCancel]="!readonly"
+                   [readonly]="readonly"
+                   [model]="transactionTotal.transactionDiscountPercentage"
+                   (blur)="editMode = false"
+    ></co-input-text>
+  `,
+                encapsulation: ViewEncapsulation.None
+            },] }
+];
+TransactionHeaderDiscountPercentageComponent.ctorParameters = () => [
+    { type: TransactionService }
+];
+TransactionHeaderDiscountPercentageComponent.propDecorators = {
+    child: [{ type: ViewChild, args: ['input', { read: InputTextComponent },] }],
+    showLabel: [{ type: Input }],
+    defaultEditMode: [{ type: Input }],
+    editMode: [{ type: Input }],
+    handleClick: [{ type: HostListener, args: ["click", ["$event"],] }]
+};
+
+class TransactionHeaderDiscountPercentageModule {
+}
+TransactionHeaderDiscountPercentageModule.decorators = [
+    { type: NgModule, args: [{
+                imports: [
+                    CommonModule,
+                    InputTextModule,
+                    PipeModule
+                ],
+                declarations: [
+                    TransactionHeaderDiscountPercentageComponent
+                ],
+                exports: [
+                    TransactionHeaderDiscountPercentageComponent
+                ]
+            },] }
+];
+
+class TransactionHeaderDiscountAmountComponent extends TransactionHeaderBaseComponent {
+    constructor(_transactionService) {
+        super();
+        this._transactionService = _transactionService;
+        this.showLabel = true;
+        this.defaultEditMode = true;
+        this._editMode = false;
+    }
+    set child(content) {
+        if (content) {
+            this.input = content;
+            this.input.commit = (amount) => this.commit(amount);
+            if (this._editMode) {
+                this.input.requestFocus();
+            }
         }
-        else {
-            this.transactionSearchService.activeSearchViewMode = this.searchViewModes.SideBar;
+    }
+    set editMode(value) {
+        this._editMode = value;
+        if (this._editMode && this.input) {
+            this.input.doFocus();
         }
-        this.searchViewModeChange.emit(this.transactionSearchService.activeSearchViewMode);
     }
-    onSideCollapseHandleClick() {
-        this.toggleSearchBar();
+    get editMode() {
+        return this._editMode;
     }
-    toggleSearchBar() {
-        if (this.transactionSearchService.collapsed || this.transactionSearchService.fullscreen) {
-            this.expandSearchBar();
+    handleClick(event) {
+        event.preventDefault();
+        event.stopPropagation();
+        if (!this.readonly) {
+            this.editMode = true;
         }
-        else {
-            this.collapseSearchBar();
+    }
+    commit(amount) {
+        return __awaiter(this, void 0, void 0, function* () {
+            if (this.transactionTotal && this.transactionTotal.transactionDiscountAmount !== amount) {
+                const oldAmount = this.transactionTotal.transactionDiscountAmount;
+                const success = yield this._transactionService.updateHeaderTransactionDiscount(this.transactionInfo.uuid, DiscountType.TransactionDiscountAmount, amount);
+                if (!success) {
+                    this.input.model = amount;
+                }
+                return success;
+            }
+            return true;
+        });
+    }
+    transactionSet() {
+        this.readonly = this.readonly || !this.transactionInfo.deliveryDateDefinitive;
+    }
+}
+TransactionHeaderDiscountAmountComponent.decorators = [
+    { type: Component, args: [{
+                selector: "co-transaction-header-discount-amount",
+                template: `
+    <span *ngIf="(!editMode  || readonly) && !defaultEditMode" [textContent]="transactionTotal.transactionDiscountAmount"></span>
+    <co-input-text #input *ngIf="editMode || defaultEditMode"
+                   [type]="'number'"
+                   [placeholder]="showLabel ? ('DISCOUNT_AMOUNT' | localize) : ''"
+                   [showSaveCancel]="!readonly"
+                   [readonly]="readonly"
+                   [model]="transactionTotal.transactionDiscountAmount"
+                   (blur)="editMode = false"
+    ></co-input-text>
+  `,
+                encapsulation: ViewEncapsulation.None
+            },] }
+];
+TransactionHeaderDiscountAmountComponent.ctorParameters = () => [
+    { type: TransactionService }
+];
+TransactionHeaderDiscountAmountComponent.propDecorators = {
+    child: [{ type: ViewChild, args: ['input', { read: InputTextComponent },] }],
+    showLabel: [{ type: Input }],
+    defaultEditMode: [{ type: Input }],
+    editMode: [{ type: Input }],
+    handleClick: [{ type: HostListener, args: ["click", ["$event"],] }]
+};
+
+class TransactionHeaderDiscountAmountModule {
+}
+TransactionHeaderDiscountAmountModule.decorators = [
+    { type: NgModule, args: [{
+                imports: [
+                    CommonModule,
+                    InputTextModule,
+                    PipeModule
+                ],
+                declarations: [
+                    TransactionHeaderDiscountAmountComponent
+                ],
+                exports: [
+                    TransactionHeaderDiscountAmountComponent
+                ]
+            },] }
+];
+
+class TransactionHeaderDiscountTransactionTotalComponent extends TransactionHeaderBaseComponent {
+    constructor(_transactionService) {
+        super();
+        this._transactionService = _transactionService;
+        this.showLabel = true;
+        this.defaultEditMode = true;
+        this._editMode = false;
+    }
+    set child(content) {
+        if (content) {
+            this.input = content;
+            this.input.commit = (amount) => this.commit(amount);
+            if (this._editMode) {
+                this.input.requestFocus();
+            }
         }
     }
-    collapseSearchBar() {
-        this.transactionSearchService.activeSearchViewMode = this.searchViewModes.SideBar;
-        this.transactionSearchService.activeSearchBarViewMode = SearchBarViewMode.Collapsed;
-        this.searchViewModeChange.emit(this.searchViewModes.SideBar);
+    set editMode(value) {
+        this._editMode = value;
+        if (this._editMode && this.input) {
+            this.input.doFocus();
+        }
     }
-    expandSearchBar() {
-        this.transactionSearchService.activeSearchViewMode = this.searchViewModes.SideBar;
-        this.transactionSearchService.activeSearchBarViewMode = SearchBarViewMode.Expanded;
-        this.searchViewModeChange.emit(this.searchViewModes.SideBar);
+    get editMode() {
+        return this._editMode;
     }
-    calculateClasses() {
-        return {
-            'fullscreen': this.transactionSearchService.fullscreen,
-            'sidebar': !this.transactionSearchService.fullscreen,
-            'collapsed': this.transactionSearchService.collapsed,
-            'expanded': !this.transactionSearchService.collapsed,
-        };
+    handleClick(event) {
+        event.preventDefault();
+        event.stopPropagation();
+        if (!this.readonly) {
+            this.editMode = true;
+        }
     }
-    _scrollToTop() {
-        window.scrollTo({ top: 0, behavior: 'smooth' });
+    commit(amount) {
+        return __awaiter(this, void 0, void 0, function* () {
+            if (this.transactionTotalAmount !== amount) {
+                const success = yield this._transactionService.updateHeaderTransactionDiscount(this.transactionInfo.uuid, DiscountType.OrderTotal, amount);
+                if (!success) {
+                    this.input.model = amount;
+                }
+                else {
+                    this.transactionTotalAmount = undefined;
+                }
+                return success;
+            }
+            return true;
+        });
+    }
+    transactionSet() {
+        this.readonly = this.readonly || !this.transactionInfo.deliveryDateDefinitive;
     }
 }
-TransactionSearchComponent.decorators = [
+TransactionHeaderDiscountTransactionTotalComponent.decorators = [
     { type: Component, args: [{
-                selector: 'co-transaction-search',
+                selector: "co-transaction-header-discount-transaction-total",
                 template: `
-    <div class="transaction-search-main-wrapper">
-      <div class="transaction-search-wrapper"
-           [ngClass]="calculateClasses()">
-        <div class="transaction-filter-wrapper narrow-scrollbar"
-             [ngClass]="calculateClasses()"
-             *ngIf="transactionSearchService.showFilterSidebar" @showHideFilterSidebar>
-          <co-transaction-filter
-            [transactionType]="transactionType"
-            [activeSearchViewMode]="transactionSearchService.activeSearchViewMode"
-            (closeButtonClick)="transactionSearchService.handleHideFilter()"
-            (resetFilterClick)="transactionSearchService.handleResetFilter()"></co-transaction-filter>
+    <co-input-text #input *ngIf="editMode || defaultEditMode"
+                   [type]="'number'"
+                   [placeholder]="showLabel ? ('TRANSACTION_TOTAL' | localize) : ''"
+                   [showSaveCancel]="!readonly"
+                   [readonly]="readonly"
+                   [(model)]="transactionTotalAmount"
+                   (blur)="editMode = false"
+    ></co-input-text>
+  `,
+                encapsulation: ViewEncapsulation.None
+            },] }
+];
+TransactionHeaderDiscountTransactionTotalComponent.ctorParameters = () => [
+    { type: TransactionService }
+];
+TransactionHeaderDiscountTransactionTotalComponent.propDecorators = {
+    child: [{ type: ViewChild, args: ['input', { read: InputTextComponent },] }],
+    showLabel: [{ type: Input }],
+    defaultEditMode: [{ type: Input }],
+    editMode: [{ type: Input }],
+    handleClick: [{ type: HostListener, args: ["click", ["$event"],] }]
+};
+
+class TransactionHeaderDiscountTransactionTotalModule {
+}
+TransactionHeaderDiscountTransactionTotalModule.decorators = [
+    { type: NgModule, args: [{
+                imports: [
+                    CommonModule,
+                    InputTextModule,
+                    PipeModule
+                ],
+                declarations: [
+                    TransactionHeaderDiscountTransactionTotalComponent
+                ],
+                exports: [
+                    TransactionHeaderDiscountTransactionTotalComponent
+                ]
+            },] }
+];
+
+class DialogTransactionHeaderDiscountModule {
+}
+DialogTransactionHeaderDiscountModule.decorators = [
+    { type: NgModule, args: [{
+                imports: [
+                    CommonModule,
+                    CoDialogModule,
+                    TransactionHeaderDiscountPercentageModule,
+                    TransactionHeaderDiscountAmountModule,
+                    TransactionHeaderDiscountTransactionTotalModule,
+                    PipeModule
+                ],
+                declarations: [
+                    DialogTransactionHeaderDiscountComponent
+                ],
+                exports: [
+                    DialogTransactionHeaderDiscountComponent
+                ]
+            },] }
+];
+
+class TransactionTotalsModule {
+}
+TransactionTotalsModule.decorators = [
+    { type: NgModule, args: [{
+                imports: [
+                    CommonModule,
+                    CoreModule,
+                    PipeModule,
+                    DialogTransactionHeaderDiscountModule
+                ],
+                declarations: [
+                    TransactionTotalsComponent
+                ],
+                exports: [
+                    TransactionTotalsComponent
+                ]
+            },] }
+];
+
+class TransactionArticleTextComponent {
+    constructor(service) {
+        this.service = service;
+        this.closeClick = new EventEmitter();
+        this.cancelClick = new EventEmitter();
+        this.saveClick = new EventEmitter();
+        this.showOverviewDialog = false;
+        this.standardTexts = [];
+        this.documents = [];
+        this.fields = { text: "description", value: "textId" };
+        this.fieldsDocuments = { text: "description", value: "code" };
+        this.transactionAddTextLineRequest = new TransactionAddTextLineRequest();
+    }
+    set transactionLine(value) {
+        if (value) {
+            this.transactionAddTextLineRequest.transactionUuid = value.uuid;
+            this.transactionAddTextLineRequest.text = value.text;
+        }
+    }
+    set articleRef(value) {
+        if (value) {
+            this._articleRef = value;
+        }
+    }
+    get articleRef() {
+        return this._articleRef;
+    }
+    set editText(value) {
+        this.transactionAddTextLineRequest.text = value;
+    }
+    set articleLineNr(value) {
+        if (value) {
+            this.transactionAddTextLineRequest.refArticleLineNr = value;
+        }
+    }
+    showClass() {
+        return true;
+    }
+    ngOnInit() {
+        return __awaiter(this, void 0, void 0, function* () {
+            this.standardTexts = yield this.service.getStandardTexts("NL");
+            this.documents = yield this.service.getTextTypes("NL");
+        });
+    }
+    onOkClick(event) {
+        this.saveClick.next(this.transactionAddTextLineRequest);
+    }
+    onCancelClick(event) {
+        this.cancelClick.next(event);
+    }
+    onSelectStandardText(value) {
+        this.transactionAddTextLineRequest.text = (this.standardTexts.find(x => x.textId === value)).text;
+    }
+    handleDocumentsChange(docs) {
+    }
+}
+TransactionArticleTextComponent.decorators = [
+    { type: Component, args: [{
+                selector: "co-transaction-article-text",
+                template: `
+    <co-dialog (closeClick)="closeClick.emit($event)" [headerTemplate]="headerTemplate" [footerTemplate]="footerTemplate">
+      <div class="article-text-content-wrapper">
+        <div class="editor-wrapper">
+          <textarea class="article-text"
+                    [(ngModel)]="transactionAddTextLineRequest.text"
+          ></textarea>
         </div>
-        <div class="transaction-search-result-wrapper"
-             [class.fullscreen]="transactionSearchService.fullscreen"
-             [class.sidebar]="!transactionSearchService.fullscreen"
-             [class.collapsed]="transactionSearchService.collapsed"
-             [class.expanded]="!transactionSearchService.collapsed"
-        >
-          <co-transaction-search-result
-            [transactionType]="transactionType"
-            [activeSearchViewMode]="transactionSearchService.activeSearchViewMode"
-            (filterClick)="transactionSearchService.toggleFilter()"
-            (transactionClick)="onTransactionClick($event)"
-            (resizeClick)="onSearchViewResizeClick()"
-            (closeClick)="collapseSearchBar()"
-          ></co-transaction-search-result>
+        <div class="option-wrapper">
+          <co-input-listbox
+            [collection]="documents"
+            [fields]="fieldsDocuments"
+            [placeholder]="'FOR_DOCUMENTS' | localize"
+            [value]="transactionAddTextLineRequest.showOnDocuments"
+            [showCheckbox]="true"
+            (modelChange)="handleDocumentsChange($event)"
+          ></co-input-listbox>
+          <co-drop-down-list
+            [collection]="standardTexts"
+            [fields]="fields"
+            [placeholder]="'STANDARD_TEXTS' | localize"
+            (modelChange)="onSelectStandardText($event)"
+          ></co-drop-down-list>
         </div>
       </div>
-      <div class="transaction-search-content-wrapper"
-           [class.fullscreen]="transactionSearchService.fullscreen"
-           [class.sidebar]="!transactionSearchService.fullscreen"
-           [class.collapsed]="transactionSearchService.collapsed"
-           [class.expanded]="!transactionSearchService.collapsed"
-      >
-        <ng-content></ng-content>
+    </co-dialog>
+    <ng-template #headerTemplate><span [textContent]="header"></span></ng-template>
+    <ng-template #footerTemplate>
+      <div class="button-wrapper">
+        <co-button [label]="'OK' | localize" (click)="onOkClick($event)"></co-button>
+        <co-button [label]="'CANCEL' | localize " (click)="onCancelClick($event)"></co-button>
       </div>
-    </div>
+    </ng-template>
+
   `,
-                animations: [
-                    trigger("showHideFilterSidebar", [
-                        state("void", style({ transform: 'translateX(-100%)' })),
-                        state("*", style({ transform: 'translateX(0)' })),
-                        transition("void <=> *", animate("200ms ease-in-out"))
-                    ])
-                ],
                 encapsulation: ViewEncapsulation.None
             },] }
 ];
-TransactionSearchComponent.ctorParameters = () => [
-    { type: TransactionSearchService }
+TransactionArticleTextComponent.ctorParameters = () => [
+    { type: TransactionService }
 ];
-TransactionSearchComponent.propDecorators = {
-    transactionType: [{ type: Input }],
-    transactionClick: [{ type: Output }],
-    searchViewModeChange: [{ type: Output }],
-    showClass: [{ type: HostBinding, args: ["class.co-transaction-search",] }]
+TransactionArticleTextComponent.propDecorators = {
+    header: [{ type: Input }],
+    transactionLine: [{ type: Input }],
+    articleRef: [{ type: Input }],
+    editText: [{ type: Input }],
+    articleLineNr: [{ type: Input }],
+    closeClick: [{ type: Output }],
+    cancelClick: [{ type: Output }],
+    saveClick: [{ type: Output }],
+    showClass: [{ type: HostBinding, args: ["class.co-transaction-article-text",] }]
 };
 
+class TransactionArticleTextModule {
+}
+TransactionArticleTextModule.decorators = [
+    { type: NgModule, args: [{
+                imports: [
+                    CommonModule,
+                    CoreModule,
+                    FormsModule,
+                    CoDialogModule,
+                    InputCheckboxModule,
+                    InputListboxModule,
+                    DropDownModule,
+                    ButtonModule,
+                    PipeModule
+                ],
+                declarations: [
+                    TransactionArticleTextComponent
+                ],
+                exports: [
+                    TransactionArticleTextComponent
+                ]
+            },] }
+];
+
+// The different view modes for search
+var SearchViewMode;
+(function (SearchViewMode) {
+    SearchViewMode[SearchViewMode["FullScreen"] = 0] = "FullScreen";
+    SearchViewMode[SearchViewMode["SideBar"] = 1] = "SideBar";
+})(SearchViewMode || (SearchViewMode = {}));
+
+// The different view modes for search
+var SearchbarViewMode;
+(function (SearchbarViewMode) {
+    SearchbarViewMode[SearchbarViewMode["Expanded"] = 0] = "Expanded";
+    SearchbarViewMode[SearchbarViewMode["Collapsed"] = 1] = "Collapsed";
+})(SearchbarViewMode || (SearchbarViewMode = {}));
+
 class TransactionSearchService {
     constructor(_transactionService) {
         this._transactionService = _transactionService;
         this.searchRequest = new TransactionSearchViewRequest();
         this.previousSearchRequest = new TransactionSearchViewRequest();
         this.activeSearchViewMode = SearchViewMode.FullScreen;
-        this.activeSearchBarViewMode = SearchBarViewMode.Expanded;
+        this.activeSearchBarViewMode = SearchbarViewMode.Expanded;
         this.showFilterSidebar = false;
         this.transactions = [];
         this.labelBasedOnTransactionType = new Map([
@@ -8364,7 +8739,6 @@ class TransactionSearchService {
             [TransactionKind.ServiceOrder, "SERVICEORDERS"]
         ]);
         this.transactionsPerPage = 20;
-        this.resultCount = 0;
         this._currentPage = 1;
         this._transactionType = TransactionKind.SalesOrder;
     }
@@ -8393,8 +8767,9 @@ class TransactionSearchService {
         const lowerBound = ((this.currentPage - 1) * this.transactionsPerPage) + 1;
         this.searchRequest.paging = new PagingParameters(lowerBound, lowerBound + this.transactionsPerPage - 1, this.transactionsPerPage);
         this._transactionService.searchTransactions(this.searchRequest).then((result) => {
-            this.transactions = result.transactions;
-            this.resultCount = result.count;
+            var _a, _b;
+            this.transactions = (_a = result.transactions) !== null && _a !== void 0 ? _a : [];
+            this.resultCount = (_b = result.count) !== null && _b !== void 0 ? _b : undefined;
         });
         this.setPreviousSearchRequest();
     }
@@ -8420,7 +8795,7 @@ class TransactionSearchService {
         return this.activeSearchViewMode === SearchViewMode.FullScreen;
     }
     get collapsed() {
-        return this.activeSearchBarViewMode === SearchBarViewMode.Collapsed;
+        return this.activeSearchBarViewMode === SearchbarViewMode.Collapsed;
     }
     toggleFilter() {
         this.showFilterSidebar = !this.showFilterSidebar;
@@ -9620,57 +9995,23 @@ TransactionLineActionButtonsComponent.decorators = [
                 encapsulation: ViewEncapsulation.None
             },] }
 ];
-TransactionLineActionButtonsComponent.ctorParameters = () => [
-    { type: IconCacheService },
-    { type: TransactionService },
-    { type: DictionaryService }
-];
-TransactionLineActionButtonsComponent.propDecorators = {
-    transactionLine: [{ type: Input }],
-    alignDirection: [{ type: Input }],
-    waitingForUserAction: [{ type: Output }],
-    sidePanelButtonClicked: [{ type: Output }],
-    showClass: [{ type: HostBinding, args: ["class.co-transaction-line-action-buttons",] }]
-};
-
-class DialogTransactionLineDeliveryMethodComponent extends DialogTransactionLineBaseComponent {
-    showClass() {
-        return true;
-    }
-}
-DialogTransactionLineDeliveryMethodComponent.decorators = [
-    { type: Component, args: [{
-                selector: "co-dialog-transaction-line-delivery-method",
-                template: `
-    <co-dialog [headerTemplate]="dialogHeader" [footerTemplate]="footerTemplate" [showCloseIcon]="useModel" (closeClick)="handleClose(buttonType.Ok)">
-      <co-transaction-line-delivery-method
-        [autoClose]="autoClose"
-        [useModel]="useModel"
-        [transactionInfo]="transactionInfo"
-        [transactionLine]="transactionLine"
-        [searchText]="searchText"
-        (closeAfterCommit)="handleClose(buttonType.Ok)"
-        (valueChange)="handleValueChange($event)"></co-transaction-line-delivery-method>
-    </co-dialog>
-    <ng-template #dialogHeader>
-      <co-dialog-header-search [title]="'DELIVERY_METHOD'" (search)="handleSearch($event)"></co-dialog-header-search>
-    </ng-template>
-    <ng-template #footerTemplate>
-      <div class="dialog-footer-button-wrapper" *ngIf="!useModel">
-        <co-button [label]="'OK' | localize" (click)="handleOkClick()"></co-button>
-      </div>
-    </ng-template>
-  `,
-                encapsulation: ViewEncapsulation.None
-            },] }
-];
-DialogTransactionLineDeliveryMethodComponent.propDecorators = {
-    showClass: [{ type: HostBinding, args: ["class.co-dialog-transaction-line-delivery-method",] }]
+TransactionLineActionButtonsComponent.ctorParameters = () => [
+    { type: IconCacheService },
+    { type: TransactionService },
+    { type: DictionaryService }
+];
+TransactionLineActionButtonsComponent.propDecorators = {
+    transactionLine: [{ type: Input }],
+    alignDirection: [{ type: Input }],
+    waitingForUserAction: [{ type: Output }],
+    sidePanelButtonClicked: [{ type: Output }],
+    showClass: [{ type: HostBinding, args: ["class.co-transaction-line-action-buttons",] }]
 };
 
 class TransactionLinesLineBaseComponent {
     constructor() {
         this.icons = Icon;
+        this.lineChange = new EventEmitter();
         this.waitingForUserAction = new EventEmitter();
         this.preview = false;
         this.readonly = false;
@@ -9698,6 +10039,7 @@ TransactionLinesLineBaseComponent.decorators = [
 TransactionLinesLineBaseComponent.propDecorators = {
     line: [{ type: Input }],
     transactionId: [{ type: Input }],
+    lineChange: [{ type: Output }],
     waitingForUserAction: [{ type: Output }],
     showClass: [{ type: HostBinding, args: ["class.co-transaction-base-line",] }],
     preview: [{ type: HostBinding, args: ["class.preview",] }, { type: Input }],
@@ -9706,135 +10048,6 @@ TransactionLinesLineBaseComponent.propDecorators = {
     isArticle: [{ type: HostBinding, args: ["class.is-article",] }]
 };
 
-class DialogTransactionLineVatComponent extends DialogTransactionLineBaseComponent {
-    showClass() {
-        return true;
-    }
-}
-DialogTransactionLineVatComponent.decorators = [
-    { type: Component, args: [{
-                selector: "co-dialog-transaction-line-vat",
-                template: `
-    <co-dialog [headerTemplate]="dialogHeader" [footerTemplate]="footerTemplate" [showCloseIcon]="useModel" (closeClick)="handleClose(buttonType.Ok)">
-      <co-transaction-line-vat
-        [autoClose]="autoClose"
-        [useModel]="useModel"
-        [transactionLine]="transactionLine"
-        [searchText]="searchText"
-        (closeAfterCommit)="handleClose(buttonType.Ok)"
-        (valueChange)="handleValueChange($event)"
-      ></co-transaction-line-vat>
-    </co-dialog>
-    <ng-template #dialogHeader>
-      <co-dialog-header-search [title]="'VAT'" (search)="handleSearch($event)"></co-dialog-header-search>
-    </ng-template>
-    <ng-template #footerTemplate>
-      <div class="dialog-footer-button-wrapper" *ngIf="!useModel">
-        <co-button [label]="'OK' | localize" (click)="handleOkClick()"></co-button>
-      </div>
-    </ng-template>
-    `,
-                encapsulation: ViewEncapsulation.None
-            },] }
-];
-DialogTransactionLineVatComponent.propDecorators = {
-    showClass: [{ type: HostBinding, args: ["class.co-dialog-transaction-line-vat",] }]
-};
-
-class DialogTransactionLineDiscountComponent extends DialogTransactionLineBaseComponent {
-    constructor(_dialogService, _service) {
-        super();
-        this._dialogService = _dialogService;
-        this._service = _service;
-        this.showPriceListDialog = false;
-    }
-    showClass() {
-        return true;
-    }
-    openThePriceListDialog() {
-        this.showPriceListDialog = true;
-    }
-    transactionLineSet() {
-        this._loadLinePricelist();
-    }
-    transactionInfoSet() {
-        this.readonly = this.readonly || this.transactionInfo.transactionDefinitive;
-    }
-    _loadLinePricelist() {
-        return __awaiter(this, void 0, void 0, function* () {
-            if (this.transactionLine && this.transactionLine.isArticle) {
-                this._service.getPriceLists().then((lists) => {
-                    const priceList = lists.find(l => l.code === this.transactionLine.priceListCode);
-                    this.transactionLine.priceListDescription = priceList ? priceList.description : "";
-                });
-            }
-        });
-    }
-}
-DialogTransactionLineDiscountComponent.decorators = [
-    { type: Component, args: [{
-                selector: "co-dialog-transaction-line-discount",
-                template: `
-    <co-dialog [headerTemplate]="dialogHeader" (closeClick)="handleClose(buttonType.Ok)">
-      <div class="transaction-line-discount-wrapper co-transaction-small-toolbar">
-        <div class="two-column-grid">
-          <co-transaction-line-line-discount [transactionLine]="transactionLine"></co-transaction-line-line-discount>
-          <co-transaction-line-discount-amount [transactionLine]="transactionLine"></co-transaction-line-discount-amount>
-        </div>
-        <div class="two-column-grid">
-          <co-transaction-line-special-discount [transactionLine]="transactionLine"></co-transaction-line-special-discount>
-          <co-transaction-line-quantum-discount [transactionLine]="transactionLine"></co-transaction-line-quantum-discount>
-        </div>
-        <div class="two-column-grid">
-          <co-input-text [placeholder]="'SURCHARGE_AMOUNT' | localize" [model]="transactionLine.surchargeAmount" [readonly]="readonly"></co-input-text>
-          <co-input-text [placeholder]="'BUSINESS_RULE_DISCOUNT' | localize" [model]="'NIET_GEIMPLEMENTEERD'" [readonly]="readonly"></co-input-text>
-        </div>
-        <div class="transaction-line-discount-overview">
-          <div class="transaction-line-discount-overview-item">
-            <div class="title" [textContent]="'TRANSACTION_DISCOUNT' | localize"></div>
-            <div class="value" [class.negative]="transactionLine.discountAmount < 0" [textContent]="transactionLine.discountAmount | coCurrency"></div>
-          </div>
-          <div class="transaction-line-discount-overview-item">
-            <div class="title" [textContent]="'BUSINESS_RULE_DISCOUNT' | localize"></div>
-            <div class="value" [textContent]="'NIET_GEIMPLEMENTEERD'"></div>
-          </div>
-          <div class="transaction-line-discount-overview-item">
-            <div class="title" [textContent]="'QUANTUM_DISCOUNT' | localize"></div>
-            <div class="value" [class.negative]="transactionLine.quantumDiscount < 0" [textContent]="transactionLine.quantumDiscount | coCurrency"></div>
-          </div>
-          <div class="transaction-line-discount-overview-item">
-            <div class="title" [textContent]="'SURCHARGE_AMOUNT' | localize"></div>
-            <div class="value" [class.negative]="transactionLine.surchargeAmount < 0" [textContent]="transactionLine.surchargeAmount | coCurrency"></div>
-          </div>
-          <div class="transaction-line-discount-overview-item total">
-            <div class="title" [textContent]="'TOTAL_LINE_DISCOUNT' | localize"></div>
-            <div class="value" [class.negative]="transactionLine.lineTotalDiscountAmount < 0" [textContent]="transactionLine.lineTotalDiscountAmount | coCurrency"></div>
-          </div>
-        </div>
-      </div>
-    </co-dialog>
-    <ng-template #dialogHeader>
-      <div class="dialog-header-title" [textContent]="'DISCOUNT_PRICE_INFORMATION' | localize"></div>
-      <div class="transaction-line-button big" (click)="openThePriceListDialog()">
-        <span class="co-transaction-overflow-ellipsis" [textContent]="transactionLine.priceListDescription"></span>
-      </div>
-    </ng-template>
-    <co-dialog-transaction-line-price-list *ngIf="showPriceListDialog"
-        [transactionLine]="transactionLine"
-        (close)="showPriceListDialog = false"
-    ></co-dialog-transaction-line-price-list>
-  `,
-                encapsulation: ViewEncapsulation.None
-            },] }
-];
-DialogTransactionLineDiscountComponent.ctorParameters = () => [
-    { type: DialogService },
-    { type: TransactionService }
-];
-DialogTransactionLineDiscountComponent.propDecorators = {
-    showClass: [{ type: HostBinding, args: ["class.co-dialog-transaction-line-discount",] }]
-};
-
 class TransactionOverviewLineComponent extends TransactionLinesLineBaseComponent {
     constructor(service, iconCacheService, _dialogService, _dictionaryService) {
         super();
@@ -9845,6 +10058,8 @@ class TransactionOverviewLineComponent extends TransactionLinesLineBaseComponent
         this.stock = StockStatus.Low;
         this.mouseOver = false;
         this.readonly = false;
+        this.showDialogVat = false;
+        this.showDialogDiscount = false;
         this.subscriptions = [];
     }
     showClass() {
@@ -9856,16 +10071,17 @@ class TransactionOverviewLineComponent extends TransactionLinesLineBaseComponent
     handleMouseLeave(event) {
         this.mouseOver = false;
     }
+    ngOnChanges(changes) {
+        console.log(changes);
+    }
     ngOnInit() {
         this.subscriptions.push(this.lineSet.subscribe((set) => {
             if (set) {
                 this.localAmount = this._line.amount;
-                this._loadLineCommissionCode();
-                this._loadLineWarehouse();
-                this._loadLineDeliveryMethod();
                 this._loadLineVat();
             }
         }));
+        this.transactionKind = this.service.currentTransaction.transactionInfo.transactionKind;
     }
     ngOnDestroy() {
         this.subscriptions.forEach((subscription) => subscription.unsubscribe());
@@ -9883,51 +10099,6 @@ class TransactionOverviewLineComponent extends TransactionLinesLineBaseComponent
         this.transactionLineActionButtons.textToEdit = text;
         this.transactionLineActionButtons.showArticleTextDialog();
     }
-    openCommissionCodeDialog() {
-        this._dialogService.showTransactionLineComponent(DialogTransactionLineCommissionCodeComponent, this.line);
-    }
-    openWarehouseDialog() {
-        this._dialogService.showTransactionLineComponent(DialogTransactionLineWarehouseComponent, this.line);
-    }
-    openDeliveryMethodDialog() {
-        this._dialogService.showTransactionLineComponent(DialogTransactionLineDeliveryMethodComponent, this.line);
-    }
-    openVatDialog() {
-        this._dialogService.showTransactionLineComponent(DialogTransactionLineVatComponent, this.line);
-    }
-    openDiscountDialog() {
-        this._dialogService.showTransactionLineComponent(DialogTransactionLineDiscountComponent, this.line);
-    }
-    _loadLineCommissionCode() {
-        return __awaiter(this, void 0, void 0, function* () {
-            if (this.line && this.line.isArticle) {
-                this.service.getCommissionCodes('NL').then((codes) => {
-                    const commissionCode = codes.find(c => c.code === this.line.commissionCode);
-                    this.line.commissionDescription = commissionCode ? commissionCode.description : "";
-                });
-            }
-        });
-    }
-    _loadLineWarehouse() {
-        return __awaiter(this, void 0, void 0, function* () {
-            if (this.line && this.line.isArticle) {
-                this.service.getWarehouses().then((warehouses) => {
-                    const warehouse = warehouses.find(w => w.warehouseNo === this.line.warehouseNumber);
-                    this.line.warehouseDescription = warehouse ? warehouse.description : "";
-                });
-            }
-        });
-    }
-    _loadLineDeliveryMethod() {
-        return __awaiter(this, void 0, void 0, function* () {
-            if (this.line && this.line.isArticle) {
-                this.service.getDeliveryMethods().then((methods) => {
-                    const method = methods.find(m => m.code === this.line.deliveryMethodCode);
-                    this.line.deliveryMethodDescription = method ? method.description : "";
-                });
-            }
-        });
-    }
     _loadLineVat() {
         return __awaiter(this, void 0, void 0, function* () {
             if (this.line && this.line.isArticle) {
@@ -9952,12 +10123,13 @@ TransactionOverviewLineComponent.decorators = [
             </div>
           </div>
           <div *ngIf=!preview class="transaction-line-extended-wrapper">
-            <co-transaction-line-commission-button [line]="line"></co-transaction-line-commission-button>
-            <co-transaction-line-warehouse-button [line]="line"></co-transaction-line-warehouse-button>
-            <co-transaction-line-delivery-button [line]="line"></co-transaction-line-delivery-button>
-            <co-transaction-line-delivery-date-button [line]="line" class="two-column"></co-transaction-line-delivery-date-button>
+            <co-transaction-line-commission-button [transactionLine]="line" [transactionInfo]="service.currentTransaction.transactionInfo"></co-transaction-line-commission-button>
+            <co-transaction-line-warehouse-button [transactionLine]="line" [transactionInfo]="service.currentTransaction.transactionInfo"></co-transaction-line-warehouse-button>
+            <co-transaction-line-delivery-button [transactionLine]="line" [transactionInfo]="service.currentTransaction.transactionInfo"></co-transaction-line-delivery-button>
+            <co-transaction-line-delivery-date-button [transactionLine]="line" class="two-column"></co-transaction-line-delivery-date-button>
+            <co-transaction-line-statusbar [transaction]="line" [transactionKind]="transactionKind"></co-transaction-line-statusbar>
           </div>
-          <div *ngIf="!preview" class="transaction-line-button" (click)="openVatDialog()">
+          <div *ngIf="!preview" class="transaction-line-button" (click)="showDialogVat = true">
             <span class="co-transaction-overflow-ellipsis" [textContent]="line.vatDescription"></span>
           </div>
           <div class="transaction-line-totals">
@@ -9966,8 +10138,8 @@ TransactionOverviewLineComponent.decorators = [
                                        [showLabel]="false"
                                        [defaultEditMode]="false"
             ></co-transaction-line-price>
-            <div class="transaction-line-button custom-width" (click)="openDiscountDialog()">
-              <span class="co-transaction-overflow-ellipsis transaction-line-discount" [class.negative]="line.lineTotalDiscountAmount < 0"
+            <div class="transaction-line-button custom-width transaction-line-totals-discount" (click)="showDialogDiscount = true">
+              <span class="co-transaction-overflow-ellipsis" [class.transaction-negative-value]="line.lineTotalDiscountAmount < 0"
                     [textContent]="(line.lineTotalDiscountAmount | coCurrency) || ('DISCOUNT' | localize)"></span>
             </div>
             <div *ngIf=!preview class="transaction-line-totals-amount">
@@ -9986,6 +10158,17 @@ TransactionOverviewLineComponent.decorators = [
         </div>
       </ng-container>
     </co-transaction-base-line>
+    <co-dialog-transaction-line-vat *ngIf="showDialogVat"
+                                    [autoClose]="true"
+                                    [transactionInfo]="service.currentTransaction.transactionInfo"
+                                    [transactionLine]="line"
+                                    (close)="showDialogVat = false">
+    </co-dialog-transaction-line-vat>
+    <co-dialog-transaction-line-discount *ngIf="showDialogDiscount"
+                                         [transactionInfo]="service.currentTransaction.transactionInfo"
+                                         [transactionLine]="line"
+                                         (close)="showDialogDiscount = false"
+    ></co-dialog-transaction-line-discount>
   `,
                 encapsulation: ViewEncapsulation.None
             },] }
@@ -10021,6 +10204,7 @@ class TransactionOrderDeliveryLineComponent extends TransactionLinesLineBaseComp
         this._subscriptions.push(this._transactionEventService.selectAllLines.subscribe((value) => {
             this.selected = value;
         }));
+        this.transactionKind = this.service.currentTransaction.transactionInfo.transactionKind;
     }
     ngOnDestroy() {
         this._subscriptions.forEach(s => s.unsubscribe());
@@ -10035,12 +10219,12 @@ TransactionOrderDeliveryLineComponent.decorators = [
     <co-transaction-base-line [line]="line" [preview]="preview" [checkbox]="true" [checkboxValue]="selected" [actionButtons]="false">
       <div class="transaction-line-buttons-grid">
         <div class="row-1">
-          <co-transaction-line-warehouse-button [line]="line"></co-transaction-line-warehouse-button>
-          <co-transaction-line-delivery-button [line]="line"></co-transaction-line-delivery-button>
+          <co-transaction-line-warehouse-button [transactionLine]="line" [transactionInfo]="service.currentTransaction.transactionInfo"></co-transaction-line-warehouse-button>
+          <co-transaction-line-delivery-button [transactionLine]="line" [transactionInfo]="service.currentTransaction.transactionInfo"></co-transaction-line-delivery-button>
         </div>
         <div class="row-2">
-          <co-transaction-line-delivery-date-button [line]="line"></co-transaction-line-delivery-date-button>
-          <co-status-bar class="status-bar"></co-status-bar>
+          <co-transaction-line-delivery-date-button [transactionLine]="line"></co-transaction-line-delivery-date-button>
+          <co-transaction-line-statusbar [transaction]="line" [transactionKind]="transactionKind"></co-transaction-line-statusbar>
         </div>
       </div>
       <div class="transaction-line-totals">
@@ -10261,7 +10445,7 @@ TransactionReceiveGoodsLineComponent.decorators = [
                 template: `
     <co-transaction-base-line [line]="viewModel" [preview]="preview" [actionButtons]="false" (click)="handleLineClicked($event)">
       <div class="line-content-wrapper">
-        <co-transaction-line-warehouse-button [readonly]="true" [line]="viewModel"></co-transaction-line-warehouse-button>
+        <co-transaction-line-warehouse-button [transactionLine]="viewModel" [transactionInfo]="service.currentTransaction.transactionInfo"></co-transaction-line-warehouse-button>
         <co-transaction-line-warehouse-location-button [readonly]="viewModel.quantityReceived === viewModel.amount" [line]="viewModel"></co-transaction-line-warehouse-location-button>
         <co-editable-label class="transaction-line-totals-total price"
                            [model]="viewModel.amount.toString() + 'x'"
@@ -10483,6 +10667,9 @@ class TransactionLineComponent {
     showClass() {
         return true;
     }
+    ngOnChanges(changes) {
+        this._prepareProps();
+    }
     _prepareContent() {
         if (!this._transactionType || !this._activeCategory || !this._transactionLineContainer) {
             return;
@@ -10498,12 +10685,7 @@ class TransactionLineComponent {
             .resolveComponentFactory(componentClass)
             .create(this.injector);
         this.appRef.attachView(this._componentRef.hostView);
-        this._componentRef.instance.preview = this.preview;
-        this._componentRef.instance.selected = this.selected;
-        this._componentRef.instance.line = this.line;
-        this._componentRef.instance.transactionId = this.transactionId;
-        this._componentRef.instance.waitingForUserAction = this.waitingForUserAction;
-        this._componentRef.instance.lineVisible = this.lineVisible;
+        this._prepareProps();
         const domElem = this._componentRef.hostView
             .rootNodes[0];
         this._transactionLineContainer.nativeElement.appendChild(domElem);
@@ -10511,12 +10693,22 @@ class TransactionLineComponent {
             this.appRef.detachView(this._componentRef.hostView);
         });
     }
+    _prepareProps() {
+        if (this._componentRef) {
+            this._componentRef.instance.preview = this.preview;
+            this._componentRef.instance.selected = this.selected;
+            this._componentRef.instance.line = this.line;
+            this._componentRef.instance.transactionId = this.transactionId;
+            this._componentRef.instance.waitingForUserAction = this.waitingForUserAction;
+            this._componentRef.instance.lineVisible = this.lineVisible;
+        }
+    }
 }
 TransactionLineComponent.decorators = [
     { type: Component, args: [{
                 selector: "co-transaction-line",
                 template: `
-    <div #transactionLine observeVisibility (visible)="this.lineVisible.next()"></div>
+    <div #transactionLine observeVisibility (visible)="lineVisible.next()"></div>
     `,
                 encapsulation: ViewEncapsulation.None
             },] }
@@ -10571,6 +10763,8 @@ class TransactionLinesComponent {
         this.saveTransactionLine = new EventEmitter();
         this.showTransactionArticleText = false;
         this.userActionRequired = false;
+        this.hasComponent = true;
+        this._activeCategory = TransactionTypeCategory.SalesOrderOverview;
     }
     set activeCategory(value) {
         this._activeCategory = value;
@@ -10630,9 +10824,6 @@ class TransactionLinesComponent {
         this.saveTransactionLine.next(transactionLine);
         this._hideArticleTextDialog();
     }
-    transactionLineComponent() {
-        return !!this._mappingService.getTransactionLineComponent(this.service.currentTransaction.transactionInfo.transactionKind, this._activeCategory);
-    }
     _showArticleTextDialog() {
         this.showTransactionArticleText = true;
     }
@@ -10641,6 +10832,7 @@ class TransactionLinesComponent {
     }
     _handleCategory() {
         return __awaiter(this, void 0, void 0, function* () {
+            this.hasComponent = !!this._mappingService.getTransactionLineComponent(this.service.currentTransaction.transactionInfo.transactionKind, this._activeCategory);
             if (this._activeCategory === TransactionTypeCategory.PurchaseOrderReceivedGoods) {
                 if (this.transactionLines.find(l => l.isLocationRequired)) {
                     const response = yield this._dialogService.showWarehouseLocation(this.transactionLines[0].warehouseNumber, false, false, true);
@@ -10669,7 +10861,7 @@ TransactionLinesComponent.decorators = [
                    [class.show]="line === selectedTransactionLine && transactionLines.length > 1" cdkDragHandle
                    [iconData]="iconCacheService.getIcon(icons.GripDotsVerticalSolid)">
           </co-icon>
-          <co-transaction-line *ngIf="transactionLineComponent()"
+          <co-transaction-line *ngIf="hasComponent"
                                [transactionType]="service.currentTransaction.transactionInfo.transactionKind"
                                [activeCategory]="activeCategory"
                                [transactionId]="transactionId"
@@ -10767,7 +10959,10 @@ ShoppingCartPreviewComponent.decorators = [
       ></co-transaction-lines>
     </div>
     <div class="preview-totals-wrapper">
-      <co-transaction-totals [totals]="service.currentTransaction.transactionTotal"></co-transaction-totals>
+      <co-transaction-totals
+        [transactionInfo]="service.currentTransaction.transactionInfo"
+        [transactionTotal]="service.currentTransaction.transactionTotal"
+      ></co-transaction-totals>
     </div>
     <div class="cart-buttons">
       <a class="button-edit-cart" [textContent]="'EDIT_CART' | localize"
@@ -10891,9 +11086,10 @@ SharedService.ctorParameters = () => [
 ];
 
 class AvatarComponent {
-    constructor(_transactionService, _sharedService) {
+    constructor(_transactionService, _sharedService, _colorSequenceService) {
         this._transactionService = _transactionService;
         this._sharedService = _sharedService;
+        this._colorSequenceService = _colorSequenceService;
     }
     set image(value) {
         this._image = value;
@@ -10911,6 +11107,13 @@ class AvatarComponent {
     showClass() {
         return true;
     }
+    set initials(value) {
+        this._initials = value;
+        this._setBackgroundColor();
+    }
+    get initials() {
+        return this._initials;
+    }
     ngAfterViewInit() {
         this._getRelation();
     }
@@ -10947,6 +11150,11 @@ class AvatarComponent {
             });
         }
     }
+    _setBackgroundColor() {
+        if (this.relation) {
+            this.backgroundColor = this._colorSequenceService.getRandomColor(this.relation.relationId);
+        }
+    }
 }
 AvatarComponent.decorators = [
     { type: Component, args: [{
@@ -10964,13 +11172,15 @@ AvatarComponent.decorators = [
 ];
 AvatarComponent.ctorParameters = () => [
     { type: TransactionService },
-    { type: SharedService }
+    { type: SharedService },
+    { type: ColorSequenceService }
 ];
 AvatarComponent.propDecorators = {
     image: [{ type: Input }],
     relationId: [{ type: Input }],
     relation: [{ type: Input }],
-    showClass: [{ type: HostBinding, args: ["class.co-avatar",] }]
+    showClass: [{ type: HostBinding, args: ["class.co-avatar",] }],
+    backgroundColor: [{ type: HostBinding, args: ["style.background-color",] }]
 };
 
 class AvatarModule {
@@ -11469,18 +11679,13 @@ RelationTypeComponent.decorators = [
                 template: `
     <div class="default-data-row">
       <co-input-radio-button class="default-width"
-                             [name]="'type'"
                              [label]="'PRIVATE_PERSON' | localize"
-                             [value]="relType.Private"
-                             [checked]="relation.type === relType.Private"
+                             [model]="relation.type === relType.Private"
                              (modelChange)="handleChangeRelationType(relType.Private)"
       ></co-input-radio-button>
       <co-input-radio-button class="default-width"
-                             [name]="'type'"
                              [label]="'COMPANY' | localize"
-                             [value]="relType.Company"
-                             [(model)]="relation.type"
-                             [checked]="relation.type === relType.Company"
+                             [model]="relation.type === relType.Company"
                              (modelChange)="handleChangeRelationType(relType.Company)"
       ></co-input-radio-button>
     </div>
@@ -11630,24 +11835,18 @@ RelationGeneralComponent.decorators = [
       </div>
       <div class="default-data-row">
         <co-input-radio-button class="default-width"
-                               [name]="'gender'"
                                [label]="'MALE' | localize"
-                               [value]="genderType.Male"
-                               [checked]="relation.gender === genderType.Male"
+                               [model]="relation.gender === genderType.Male"
                                (modelChange)="changeGenderType(genderType.Male)"
         ></co-input-radio-button>
         <co-input-radio-button class="default-width"
-                               [name]="'gender'"
                                [label]="'FEMALE' | localize "
-                               [value]="genderType.Female"
-                               [checked]="relation.gender === genderType.Female"
+                               [model]="relation.gender === genderType.Female"
                                (modelChange)="changeGenderType(genderType.Female)"
         ></co-input-radio-button>
         <co-input-radio-button class="default-width"
-                               [name]="'gender'"
                                [label]="'UNKNOWN' | localize"
-                               [value]="genderType.Unspecified"
-                               [checked]="relation.gender === genderType.Unspecified"
+                               [model]="relation.gender === genderType.Unspecified"
                                (modelChange)="changeGenderType(genderType.Unspecified)"
         ></co-input-radio-button>
       </div>
@@ -11735,6 +11934,8 @@ class RelationSuggestionsListItemComponent {
         return true;
     }
     handleClick(event) {
+        event.preventDefault();
+        event.stopPropagation();
         this.selectionSelected.next(this.suggestion);
     }
 }
@@ -12212,7 +12413,9 @@ class TransactionHeaderDeliveryComponent extends TransactionBaseComponent {
     showClass() {
         return true;
     }
-    showTheDeliveryMethodDialog() {
+    showTheDeliveryMethodDialog(event) {
+        event.preventDefault();
+        event.stopPropagation();
         this.showDeliveryMethodDialog = true;
     }
     transactionSet() {
@@ -12239,7 +12442,7 @@ TransactionHeaderDeliveryComponent.decorators = [
     >
     </co-transaction-header-block>
     <ng-template #headerBlock>
-      <div class="header-delivery-method" (click)="showTheDeliveryMethodDialog()">
+      <div class="header-delivery-method" (click)="showTheDeliveryMethodDialog($event)">
         <co-icon class="header-delivery-truck-icon" [iconData]="iconService.getIcon(icons.TruckFastSolid)"></co-icon>
         <span [textContent]="deliveryMethod?.description"></span>
       </div>
@@ -12267,8 +12470,7 @@ TransactionHeaderDeliveryComponent.decorators = [
       ></co-transaction-header-preferred-delivery-date>
     </ng-template>
     <ng-template #thirdBlock>
-      <div class="header-delivery-partial-delivery-label co-transaction-label" [textContent]="'PART_DELIVERY' | localize"></div>
-      <co-input-checkbox class="header-delivery-partial-delivery" [model]="transactionInfo.allowPartialDelivery"></co-input-checkbox>
+      <co-transaction-header-partial-delivery class="co-transaction-label" [transactionInfo]="transactionInfo"></co-transaction-header-partial-delivery>
     </ng-template>
     <co-dialog *ngIf="showDialog" [headerTemplate]="headerTemplate" (closeClick)="showDialog = false">
       <ng-template #headerTemplate>
@@ -12321,9 +12523,10 @@ TransactionHeaderBlockComponent.decorators = [
     { type: Component, args: [{
                 selector: "co-transaction-header-block",
                 template: `
-    <div #wrapper class="transaction-header-block-wrapper">
+    <div #wrapper class="transaction-header-block-wrapper" (click)="headerClick.emit($event)">
       <div class="transaction-header-block-header">
         <ng-container [ngTemplateOutlet]="headerBlockTemplate"></ng-container>
+        <div class="transaction-header-extended-dots" *ngIf="hasDetails" [textContent]="!hasDetails ? '' : '...'" (click)="headerClick.emit($event)"></div>
       </div>
       <div class="transaction-header-block-content">
         <div class="transaction-header-block-content-first" *ngIf="firstBlockTemplate">
@@ -12338,7 +12541,6 @@ TransactionHeaderBlockComponent.decorators = [
           <ng-container [ngTemplateOutlet]="thirdBlockTemplate"></ng-container>
         </div>
       </div>
-      <div class="transaction-header-extended-dots" *ngIf="hasDetails" [textContent]="!hasDetails ? '' : '...'" (click)="headerClick.emit($event)"></div>
     </div>
   `,
                 encapsulation: ViewEncapsulation.None
@@ -12370,35 +12572,6 @@ TransactionHeaderBlockModule.decorators = [
             },] }
 ];
 
-class TransactionHeaderBaseComponent extends TransactionFilterPopupBaseComponent {
-    constructor() {
-        super(...arguments);
-        this.readonly = false;
-        this._transactionInfo = new TransactionInfo();
-    }
-    set transactionInfo(value) {
-        if (value) {
-            this._transactionInfo = value;
-            this.transactionInfoSet();
-        }
-    }
-    get transactionInfo() {
-        return this._transactionInfo;
-    }
-    get model() {
-        return this._transactionInfo;
-    }
-    // overridden by descendents
-    transactionInfoSet() {
-    }
-}
-TransactionHeaderBaseComponent.decorators = [
-    { type: Directive }
-];
-TransactionHeaderBaseComponent.propDecorators = {
-    transactionInfo: [{ type: Input }]
-};
-
 class TransactionHeaderDeliveryDateComponent extends TransactionHeaderBaseComponent {
     constructor(_transactionService) {
         super();
@@ -12426,6 +12599,8 @@ class TransactionHeaderDeliveryDateComponent extends TransactionHeaderBaseCompon
         return this._editMode;
     }
     handleClick(event) {
+        event.preventDefault();
+        event.stopPropagation();
         if (!this.readonly) {
             this.editMode = true;
         }
@@ -12523,6 +12698,8 @@ class TransactionHeaderRemarksComponent extends TransactionHeaderBaseComponent {
         return this._editMode;
     }
     handleClick(event) {
+        event.preventDefault();
+        event.stopPropagation();
         if (!this.readonly) {
             this.editMode = true;
         }
@@ -12616,6 +12793,8 @@ class TransactionHeaderReferenceComponent extends TransactionHeaderBaseComponent
         return this._editMode;
     }
     handleClick(event) {
+        event.preventDefault();
+        event.stopPropagation();
         if (!this.readonly) {
             this.editMode = true;
         }
@@ -12709,6 +12888,8 @@ class TransactionHeaderRelationReferenceComponent extends TransactionHeaderBaseC
         return this._editMode;
     }
     handleClick(event) {
+        event.preventDefault();
+        event.stopPropagation();
         if (!this.readonly) {
             this.editMode = true;
         }
@@ -12871,6 +13052,9 @@ class TransactionLineCheckboxListComponent {
             this.itemHeight = this.scrollingItem.nativeElement.offsetHeight;
         }
     }
+    handleCheckboxChecked(checked, row) {
+        this.checked.emit(row);
+    }
     handleChecked(event, row) {
         event.preventDefault();
         event.stopPropagation();
@@ -12882,12 +13066,12 @@ TransactionLineCheckboxListComponent.decorators = [
                 selector: "co-transaction-line-checkbox-list",
                 template: `
     <cdk-virtual-scroll-viewport [itemSize]="itemHeight" class="virtual-scroll-container co-transaction-small-toolbar">
-      <div *cdkVirtualFor="let row of collection" #scrollingItem class="virtual-scroll-item">
+      <div *cdkVirtualFor="let row of collection" #scrollingItem class="virtual-scroll-item" (click)="handleChecked($event, row)">
         <div class="checkbox-wrapper">
           <co-input-checkbox
             [model]="row.checked"
             [readonly]="readonly"
-            (click)="handleChecked($event, row)"
+            (modelChange)="handleCheckboxChecked($event, row)"
           ></co-input-checkbox>
         </div>
         <div class="label-wrapper">
@@ -12974,6 +13158,8 @@ class TransactionHeaderPreferredDeliveryDateComponent extends TransactionHeaderB
         return this._editMode;
     }
     handleClick(event) {
+        event.preventDefault();
+        event.stopPropagation();
         if (!this.readonly) {
             this.editMode = true;
         }
@@ -13042,37 +13228,7 @@ TransactionHeaderPreferredDeliveryDateModule.decorators = [
                     TransactionHeaderPreferredDeliveryDateComponent
                 ]
             },] }
-];
-
-class DialogTransactionHeaderBaseComponent extends TransactionHeaderBaseComponent {
-    constructor() {
-        super(...arguments);
-        this.buttonType = AppPopupButtonType;
-        this.close = new EventEmitter();
-    }
-    onClose(eventType, output) {
-        return;
-    }
-    handleValueChange(value) {
-        this.value = value;
-    }
-    handleOkClick() {
-        this.onClose(AppPopupButtonType.Ok, this.value);
-    }
-    handleSearch(text) {
-        this.searchText = text;
-    }
-    handleClose(type) {
-        this.close.emit();
-        this.onClose(type);
-    }
-}
-DialogTransactionHeaderBaseComponent.decorators = [
-    { type: Directive }
-];
-DialogTransactionHeaderBaseComponent.propDecorators = {
-    close: [{ type: Output }]
-};
+];
 
 class DialogTransactionHeaderDeliveryMethodComponent extends DialogTransactionHeaderBaseComponent {
     showClass() {
@@ -13272,41 +13428,11 @@ TransactionHeaderDeliveryOptionsModule.decorators = [
             },] }
 ];
 
-class TransactionHeaderDeliveryModule {
-}
-TransactionHeaderDeliveryModule.decorators = [
-    { type: NgModule, args: [{
-                imports: [
-                    CommonModule,
-                    CoreModule,
-                    TransactionHeaderBlockModule,
-                    InputCheckboxModule,
-                    IconModule,
-                    PipeModule,
-                    InputDatePickerModule,
-                    TransactionHeaderDeliveryDateModule,
-                    CoDialogModule,
-                    TransactionHeaderDeliveryOptionsModule,
-                    TransactionHeaderRemarksModule,
-                    TransactionHeaderReferenceModule,
-                    TransactionHeaderRelationReferenceModule,
-                    TransactionHeaderDeliveryMethodModule,
-                    TransactionHeaderPreferredDeliveryDateModule,
-                    DialogTransactionHeaderDeliveryMethodModule
-                ],
-                declarations: [
-                    TransactionHeaderDeliveryComponent
-                ],
-                exports: [
-                    TransactionHeaderDeliveryComponent
-                ]
-            },] }
-];
-
 class TransactionHeaderPartialDeliveryComponent extends TransactionHeaderBaseComponent {
     constructor(_transactionService) {
         super();
         this._transactionService = _transactionService;
+        this.showClass = true;
     }
     commitPartialDelivery(allow) {
         return __awaiter(this, void 0, void 0, function* () {
@@ -13331,7 +13457,7 @@ TransactionHeaderPartialDeliveryComponent.decorators = [
                 template: `
     <co-input-checkbox
       [readonly]="readonly"
-      [label]="'PART_DELIVERIES' | localize"
+      [label]="'PART_DELIVERY' | localize"
       [model]="transactionInfo.allowPartialDelivery"
       (modelChange)="commitPartialDelivery($event)">
     </co-input-checkbox>
@@ -13341,7 +13467,10 @@ TransactionHeaderPartialDeliveryComponent.decorators = [
 ];
 TransactionHeaderPartialDeliveryComponent.ctorParameters = () => [
     { type: TransactionService }
-];
+];
+TransactionHeaderPartialDeliveryComponent.propDecorators = {
+    showClass: [{ type: HostBinding, args: ["class.co-transaction-header-partial-delivery",] }]
+};
 
 class TransactionHeaderPartialDeliveryModule {
 }
@@ -13361,6 +13490,38 @@ TransactionHeaderPartialDeliveryModule.decorators = [
             },] }
 ];
 
+class TransactionHeaderDeliveryModule {
+}
+TransactionHeaderDeliveryModule.decorators = [
+    { type: NgModule, args: [{
+                imports: [
+                    CommonModule,
+                    CoreModule,
+                    TransactionHeaderBlockModule,
+                    InputCheckboxModule,
+                    IconModule,
+                    PipeModule,
+                    InputDatePickerModule,
+                    TransactionHeaderDeliveryDateModule,
+                    CoDialogModule,
+                    TransactionHeaderDeliveryOptionsModule,
+                    TransactionHeaderRemarksModule,
+                    TransactionHeaderReferenceModule,
+                    TransactionHeaderRelationReferenceModule,
+                    TransactionHeaderDeliveryMethodModule,
+                    TransactionHeaderPreferredDeliveryDateModule,
+                    DialogTransactionHeaderDeliveryMethodModule,
+                    TransactionHeaderPartialDeliveryModule
+                ],
+                declarations: [
+                    TransactionHeaderDeliveryComponent
+                ],
+                exports: [
+                    TransactionHeaderDeliveryComponent
+                ]
+            },] }
+];
+
 class TransactionHeaderDownpaymentPercentageComponent extends TransactionHeaderBaseComponent {
     constructor(_transactionService) {
         super();
@@ -13388,6 +13549,8 @@ class TransactionHeaderDownpaymentPercentageComponent extends TransactionHeaderB
         return this._editMode;
     }
     handleClick(event) {
+        event.preventDefault();
+        event.stopPropagation();
         if (!this.readonly) {
             this.editMode = true;
         }
@@ -13482,6 +13645,8 @@ class TransactionHeaderDownpaymentAmountComponent extends TransactionHeaderBaseC
         return this._editMode;
     }
     handleClick(event) {
+        event.preventDefault();
+        event.stopPropagation();
         if (!this.readonly) {
             this.editMode = true;
         }
@@ -13553,6 +13718,7 @@ class TransactionHeaderDefinitiveComponent extends TransactionHeaderBaseComponen
     constructor(_transactionService) {
         super();
         this._transactionService = _transactionService;
+        this.showClass = true;
     }
     commitTransactionDefinitive(definitive) {
         return __awaiter(this, void 0, void 0, function* () {
@@ -13587,7 +13753,10 @@ TransactionHeaderDefinitiveComponent.decorators = [
 ];
 TransactionHeaderDefinitiveComponent.ctorParameters = () => [
     { type: TransactionService }
-];
+];
+TransactionHeaderDefinitiveComponent.propDecorators = {
+    showClass: [{ type: HostBinding, args: ["class.co-transaction-header-definitive",] }]
+};
 
 class TransactionHeaderDefinitiveModule {
 }
@@ -14112,7 +14281,7 @@ class TransactionComponent {
         this.showQuickAccess = true;
         this.showButtonBar = true;
         this.activeViewMode = ContentViewMode.List;
-        this.showDiscountsSidebar = false;
+        this.activeCategory = TransactionTypeCategory.SalesOrderOverview;
         this._subs = [];
         this._transaction = new TransactionInfoResponse();
         this._subs.push(this._service.transactionUpdated.subscribe((transaction) => {
@@ -14148,13 +14317,6 @@ class TransactionComponent {
     ngOnDestroy() {
         this._subs.forEach(s => s.unsubscribe());
     }
-    addDiscount() {
-        this.showDiscountsSidebar = true;
-        // TODO
-        // this.transactionDiscountPercentage = this.service.currentTransaction.transactionDiscountPercentage;
-        // this.transactionDiscountAmount = this.service.currentTransaction.transactionDiscountAmount;
-        // this.transactionTotal = undefined;
-    }
     saveTransactionLine(transactionAddTextLineRequest) {
         if (transactionAddTextLineRequest.transactionUuid) { //update
         }
@@ -14229,10 +14391,12 @@ TransactionComponent.decorators = [
       -->
     </div>
     <div class="transaction-footer-wrapper">
-      <co-transaction-totals [totals]="transaction.transactionTotal" [showDiscount]="true" (discountClick)="addDiscount()"></co-transaction-totals>
+      <co-transaction-totals
+        [transactionInfo]="transaction.transactionInfo"
+        [transactionTotal]="transaction.transactionTotal"
+        [showDiscount]="true"
+      ></co-transaction-totals>
     </div>
-    <co-discount *ngIf="showDiscountsSidebar">
-    </co-discount>
   `,
                 encapsulation: ViewEncapsulation.None
             },] }
@@ -14546,9 +14710,18 @@ TransactionHeaderRelationModule.decorators = [
 ];
 
 class TransactionHeaderOrderComponent extends TransactionBaseComponent {
+    constructor() {
+        super(...arguments);
+        this.showDiscountDialog = false;
+    }
     showClass() {
         return true;
     }
+    handleShowDiscountDialog(event) {
+        event.preventDefault();
+        event.stopPropagation();
+        this.showDiscountDialog = true;
+    }
 }
 TransactionHeaderOrderComponent.decorators = [
     { type: Component, args: [{
@@ -14563,19 +14736,30 @@ TransactionHeaderOrderComponent.decorators = [
     </co-transaction-header-block>
     <ng-template #headerBlock>
       <div class="header-block-label" [textContent]="transactionInfo.branch?.familyName"></div>
+      <div class="header-order-definitive">
+        <co-transaction-header-definitive [transactionInfo]="transactionInfo"></co-transaction-header-definitive>
+      </div>
     </ng-template>
     <ng-template #firstBlock>
       <span class="header-order-total-label co-transaction-label" [textContent]="'ORDER_TOTAL' | localize"></span>
       <div class="header-order-total" [textContent]="transactionTotal.netAmount | priceDisplay"></div>
     </ng-template>
     <ng-template #secondBlock>
-      <span class="header-order-line-amount-label co-transaction-label" [textContent]="'ORDER_LINES' | localize"></span>
-      <div class="header-order-line-amount" [textContent]="transactionLines.length"></div>
+      <div class="transaction-line-button custom-width" (click)="handleShowDiscountDialog($event)">
+        <span class="co-transaction-label" [textContent]="'DISCOUNT' | localize"></span>
+        <span class="co-transaction-overflow-ellipsis transaction-discount" [class.transaction-negative-value]="transactionTotal.discountAmount < 0"
+              [textContent]="transactionTotal.discountAmount | coCurrency"></span>
+      </div>
     </ng-template>
     <ng-template #thirdBlock>
-      <div class="header-order-definitive-label co-transaction-label" [textContent]="'DEFINITIVE' | localize"></div>
-      <co-input-checkbox [model]="true"></co-input-checkbox>
+      <span class="header-order-line-amount-label co-transaction-label" [textContent]="'ORDER_LINES' | localize"></span>
+      <div class="header-order-line-amount" [textContent]="transactionLines.length"></div>
     </ng-template>
+    <co-dialog-transaction-header-discount class="discount-dialog" *ngIf="showDiscountDialog"
+                                           [transactionInfo]="transactionInfo"
+                                           [transactionTotal]="transactionTotal"
+                                           (close)="showDiscountDialog = false">
+    </co-dialog-transaction-header-discount>
   `,
                 encapsulation: ViewEncapsulation.None
             },] }
@@ -14593,7 +14777,9 @@ TransactionHeaderOrderModule.decorators = [
                     TransactionHeaderBlockModule,
                     InputCheckboxModule,
                     PipeModule,
-                    PriceDisplayPipeModule
+                    PriceDisplayPipeModule,
+                    DialogTransactionHeaderDiscountModule,
+                    TransactionHeaderDefinitiveModule
                 ],
                 declarations: [
                     TransactionHeaderOrderComponent
@@ -14617,7 +14803,9 @@ class TransactionHeaderPaymentComponent extends TransactionBaseComponent {
     showClass() {
         return true;
     }
-    openPayment() {
+    openPayment(event) {
+        event.preventDefault();
+        event.stopPropagation();
         this.showPaymentDialog = true;
     }
 }
@@ -14635,7 +14823,7 @@ TransactionHeaderPaymentComponent.decorators = [
     </co-transaction-header-block>
     <ng-template #headerBlock>
       <div class="header-block-label" [textContent]="'BALANCE' | localize"></div>
-      <div class="header-block-balance" *ngIf="transactionInfo.transactionKind !== transactionKind.PurchaseOrder" (click)="openPayment()">
+      <div class="header-block-balance" *ngIf="transactionInfo.transactionKind !== transactionKind.PurchaseOrder" (click)="openPayment($event)">
         <co-icon class="payment-icon" [iconData]="iconService.getIcon(icons.CreditCardSolid)"></co-icon>
         <div class="payment-payed-wrapper">
           <span class="payment-paid" [textContent]="200 | priceDisplay"></span>
@@ -14712,7 +14900,8 @@ TransactionHeaderPaymentModule.decorators = [
                     PaymentModule,
                     IconModule,
                     TransactionHeaderDownpaymentPercentageModule,
-                    TransactionHeaderDownpaymentAmountModule
+                    TransactionHeaderDownpaymentAmountModule,
+                    DialogTransactionHeaderDiscountModule
                 ],
                 declarations: [
                     TransactionHeaderPaymentComponent
@@ -15142,6 +15331,8 @@ class TransactionLinePriceComponent extends TransactionLineBaseComponent {
         return this._editMode;
     }
     handleClick(event) {
+        event.preventDefault();
+        event.stopPropagation();
         if (!this.readonly) {
             this.editMode = true;
         }
@@ -15438,6 +15629,8 @@ class TransactionLineDeliveryDateComponent extends TransactionLineBaseComponent
         return this._editMode;
     }
     handleClick(event) {
+        event.preventDefault();
+        event.stopPropagation();
         if (!this.readonly) {
             this.editMode = true;
         }
@@ -16004,6 +16197,8 @@ class TransactionLineDescriptionComponent extends TransactionLineBaseComponent {
         return this._editMode;
     }
     handleClick(event) {
+        event.preventDefault();
+        event.stopPropagation();
         if (!this.readonly) {
             this.editMode = true;
         }
@@ -17352,6 +17547,41 @@ DialogTransactionLineWarehouseModule.decorators = [
             },] }
 ];
 
+class DialogTransactionLineDeliveryMethodComponent extends DialogTransactionLineBaseComponent {
+    showClass() {
+        return true;
+    }
+}
+DialogTransactionLineDeliveryMethodComponent.decorators = [
+    { type: Component, args: [{
+                selector: "co-dialog-transaction-line-delivery-method",
+                template: `
+    <co-dialog [headerTemplate]="dialogHeader" [footerTemplate]="footerTemplate" [showCloseIcon]="useModel" (closeClick)="handleClose(buttonType.Ok)">
+      <co-transaction-line-delivery-method
+        [autoClose]="autoClose"
+        [useModel]="useModel"
+        [transactionInfo]="transactionInfo"
+        [transactionLine]="transactionLine"
+        [searchText]="searchText"
+        (closeAfterCommit)="handleClose(buttonType.Ok)"
+        (valueChange)="handleValueChange($event)"></co-transaction-line-delivery-method>
+    </co-dialog>
+    <ng-template #dialogHeader>
+      <co-dialog-header-search [title]="'DELIVERY_METHOD'" (search)="handleSearch($event)"></co-dialog-header-search>
+    </ng-template>
+    <ng-template #footerTemplate>
+      <div class="dialog-footer-button-wrapper" *ngIf="!useModel">
+        <co-button [label]="'OK' | localize" (click)="handleOkClick()"></co-button>
+      </div>
+    </ng-template>
+  `,
+                encapsulation: ViewEncapsulation.None
+            },] }
+];
+DialogTransactionLineDeliveryMethodComponent.propDecorators = {
+    showClass: [{ type: HostBinding, args: ["class.co-dialog-transaction-line-delivery-method",] }]
+};
+
 class DialogTransactionLineDeliveryMethodModule {
 }
 DialogTransactionLineDeliveryMethodModule.decorators = [
@@ -17373,6 +17603,41 @@ DialogTransactionLineDeliveryMethodModule.decorators = [
             },] }
 ];
 
+class DialogTransactionLineVatComponent extends DialogTransactionLineBaseComponent {
+    showClass() {
+        return true;
+    }
+}
+DialogTransactionLineVatComponent.decorators = [
+    { type: Component, args: [{
+                selector: "co-dialog-transaction-line-vat",
+                template: `
+    <co-dialog [headerTemplate]="dialogHeader" [footerTemplate]="footerTemplate" [showCloseIcon]="useModel" (closeClick)="handleClose(buttonType.Ok)">
+      <co-transaction-line-vat
+        [autoClose]="autoClose"
+        [useModel]="useModel"
+        [transactionLine]="transactionLine"
+        [searchText]="searchText"
+        (closeAfterCommit)="handleClose(buttonType.Ok)"
+        (valueChange)="handleValueChange($event)"
+      ></co-transaction-line-vat>
+    </co-dialog>
+    <ng-template #dialogHeader>
+      <co-dialog-header-search [title]="'VAT'" (search)="handleSearch($event)"></co-dialog-header-search>
+    </ng-template>
+    <ng-template #footerTemplate>
+      <div class="dialog-footer-button-wrapper" *ngIf="!useModel">
+        <co-button [label]="'OK' | localize" (click)="handleOkClick()"></co-button>
+      </div>
+    </ng-template>
+    `,
+                encapsulation: ViewEncapsulation.None
+            },] }
+];
+DialogTransactionLineVatComponent.propDecorators = {
+    showClass: [{ type: HostBinding, args: ["class.co-dialog-transaction-line-vat",] }]
+};
+
 class DialogTransactionLineVatModule {
 }
 DialogTransactionLineVatModule.decorators = [
@@ -17394,6 +17659,100 @@ DialogTransactionLineVatModule.decorators = [
             },] }
 ];
 
+class DialogTransactionLineDiscountComponent extends DialogTransactionLineBaseComponent {
+    constructor(_dialogService, _service) {
+        super();
+        this._dialogService = _dialogService;
+        this._service = _service;
+        this.showPriceListDialog = false;
+    }
+    showClass() {
+        return true;
+    }
+    openThePriceListDialog() {
+        this.showPriceListDialog = true;
+    }
+    transactionLineSet() {
+        this._loadLinePricelist();
+    }
+    transactionInfoSet() {
+        this.readonly = this.readonly || this.transactionInfo.transactionDefinitive;
+    }
+    _loadLinePricelist() {
+        return __awaiter(this, void 0, void 0, function* () {
+            if (this.transactionLine && this.transactionLine.isArticle) {
+                this._service.getPriceLists().then((lists) => {
+                    const priceList = lists.find(l => l.code === this.transactionLine.priceListCode);
+                    this.transactionLine.priceListDescription = priceList ? priceList.description : "";
+                });
+            }
+        });
+    }
+}
+DialogTransactionLineDiscountComponent.decorators = [
+    { type: Component, args: [{
+                selector: "co-dialog-transaction-line-discount",
+                template: `
+    <co-dialog [headerTemplate]="dialogHeader" (closeClick)="handleClose(buttonType.Ok)">
+      <div class="transaction-line-discount-wrapper co-transaction-small-toolbar">
+        <div class="two-column-grid">
+          <co-transaction-line-line-discount [transactionLine]="transactionLine"></co-transaction-line-line-discount>
+          <co-transaction-line-discount-amount [transactionLine]="transactionLine"></co-transaction-line-discount-amount>
+        </div>
+        <div class="two-column-grid">
+          <co-transaction-line-special-discount [transactionLine]="transactionLine"></co-transaction-line-special-discount>
+          <co-transaction-line-quantum-discount [transactionLine]="transactionLine"></co-transaction-line-quantum-discount>
+        </div>
+        <div class="two-column-grid">
+          <co-input-text [placeholder]="'SURCHARGE_AMOUNT' | localize" [model]="transactionLine.surchargeAmount" [readonly]="readonly"></co-input-text>
+          <co-input-text [placeholder]="'BUSINESS_RULE_DISCOUNT' | localize" [model]="'NIET_GEIMPLEMENTEERD'" [readonly]="readonly"></co-input-text>
+        </div>
+        <div class="transaction-line-discount-overview">
+          <div class="transaction-line-discount-overview-item">
+            <div class="title" [textContent]="'TRANSACTION_DISCOUNT' | localize"></div>
+            <div class="value" [class.transaction-negative-value]="transactionLine.discountAmount < 0" [textContent]="transactionLine.discountAmount | coCurrency"></div>
+          </div>
+          <div class="transaction-line-discount-overview-item">
+            <div class="title" [textContent]="'BUSINESS_RULE_DISCOUNT' | localize"></div>
+            <div class="value" [textContent]="'NIET_GEIMPLEMENTEERD'"></div>
+          </div>
+          <div class="transaction-line-discount-overview-item">
+            <div class="title" [textContent]="'QUANTUM_DISCOUNT' | localize"></div>
+            <div class="value" [class.transaction-negative-value]="transactionLine.quantumDiscount < 0" [textContent]="transactionLine.quantumDiscount | coCurrency"></div>
+          </div>
+          <div class="transaction-line-discount-overview-item">
+            <div class="title" [textContent]="'SURCHARGE_AMOUNT' | localize"></div>
+            <div class="value" [class.transaction-negative-value]="transactionLine.surchargeAmount < 0" [textContent]="transactionLine.surchargeAmount | coCurrency"></div>
+          </div>
+          <div class="transaction-line-discount-overview-item total">
+            <div class="title" [textContent]="'TOTAL_LINE_DISCOUNT' | localize"></div>
+            <div class="value" [class.transaction-negative-value]="transactionLine.lineTotalDiscountAmount < 0" [textContent]="transactionLine.lineTotalDiscountAmount | coCurrency"></div>
+          </div>
+        </div>
+      </div>
+    </co-dialog>
+    <ng-template #dialogHeader>
+      <div class="dialog-header-title" [textContent]="'DISCOUNT_PRICE_INFORMATION' | localize"></div>
+      <div class="transaction-line-button big" (click)="openThePriceListDialog()">
+        <span class="co-transaction-overflow-ellipsis" [textContent]="transactionLine.priceListDescription"></span>
+      </div>
+    </ng-template>
+    <co-dialog-transaction-line-price-list *ngIf="showPriceListDialog"
+        [transactionLine]="transactionLine"
+        (close)="showPriceListDialog = false"
+    ></co-dialog-transaction-line-price-list>
+  `,
+                encapsulation: ViewEncapsulation.None
+            },] }
+];
+DialogTransactionLineDiscountComponent.ctorParameters = () => [
+    { type: DialogService },
+    { type: TransactionService }
+];
+DialogTransactionLineDiscountComponent.propDecorators = {
+    showClass: [{ type: HostBinding, args: ["class.co-dialog-transaction-line-discount",] }]
+};
+
 class DialogTransactionLinePriceListComponent extends DialogTransactionLineBaseComponent {
     showClass() {
         return true;
@@ -18369,16 +18728,6 @@ class TransactionTileComponent {
     handleSidePanelButtonClicked() {
         this.showSidePanelClicked.next(this._transactionLine);
     }
-    getStatusColor(n) {
-        switch (n) {
-            case 0:
-                return '#5fdbb2';
-            case 1:
-                return '#f78852';
-            case 2:
-                return '#f23a3a';
-        }
-    }
     _loadLineImage() {
         return __awaiter(this, void 0, void 0, function* () {
             if (this._transactionLine && this._transactionLine.isArticle) {
@@ -18416,9 +18765,7 @@ TransactionTileComponent.decorators = [
       </div>
 
       <div class="transaction-order-status-row">
-        <div class="indicators-wrapper">
-          <div *ngFor="let n of [0, 1, 2]" [style.background]="getStatusColor(n)" class="transaction-order-status-indicator"></div>
-        </div>
+        <co-transaction-line-statusbar [transaction]="transactionLine" [transactionKind]="transactionType"></co-transaction-line-statusbar>
       </div>
 
       <div class="transaction-data-row center">
@@ -18484,7 +18831,8 @@ TransactionTileModule.decorators = [
                     IconModule,
                     PipeModule,
                     FormsModule,
-                    PriceDisplayPipeModule
+                    PriceDisplayPipeModule,
+                    TransactionLineStatusbarModule
                 ],
                 declarations: [
                     TransactionTileComponent
@@ -18521,6 +18869,8 @@ class EditableLabelComponent {
         return true;
     }
     handleClick(event) {
+        event.preventDefault();
+        event.stopPropagation();
         if (!this.readonly) {
             this.editMode = true;
         }
@@ -18779,33 +19129,47 @@ TransactionBaseLineModule.decorators = [
             },] }
 ];
 
-class TransactionLineCommissionButtonComponent {
-    constructor(_dialogService) {
-        this._dialogService = _dialogService;
+class TransactionLineCommissionButtonComponent extends TransactionLineBaseComponent {
+    constructor(_service) {
+        super();
+        this._service = _service;
+        this.showDialogCommissionCode = false;
     }
     showClass() {
         return true;
     }
-    openCommissionCodeDialog() {
-        this._dialogService.showTransactionLineComponent(DialogTransactionLineCommissionCodeComponent, this.line);
+    transactionLineSet() {
+        return __awaiter(this, void 0, void 0, function* () {
+            if (this.transactionLine && this.transactionLine.isArticle) {
+                this._service.getCommissionCodes('NL').then((codes) => {
+                    const commissionCode = codes.find(c => c.code === this.transactionLine.commissionCode);
+                    this.transactionLine.commissionDescription = commissionCode ? commissionCode.description : "";
+                });
+            }
+        });
     }
 }
 TransactionLineCommissionButtonComponent.decorators = [
     { type: Component, args: [{
                 selector: "co-transaction-line-commission-button",
                 template: `
-    <div class="transaction-line-button" (click)="openCommissionCodeDialog()">
-      <span class="co-transaction-overflow-ellipsis" [textContent]="line.commissionCode | append:' | ' | append:line.commissionDescription"></span>
+    <div class="transaction-line-button" (click)="showDialogCommissionCode = true">
+      <span class="co-transaction-overflow-ellipsis" [textContent]="transactionLine.commissionCode | append:' | ' | append:transactionLine.commissionDescription"></span>
     </div>
+    <co-dialog-transaction-line-commission-code *ngIf="showDialogCommissionCode"
+                                                [autoClose]="true"
+                                                [transactionInfo]="transactionInfo"
+                                                [transactionLine]="transactionLine"
+                                                (close)="showDialogCommissionCode = false"
+    ></co-dialog-transaction-line-commission-code>
   `,
                 encapsulation: ViewEncapsulation.None
             },] }
 ];
 TransactionLineCommissionButtonComponent.ctorParameters = () => [
-    { type: DialogService }
+    { type: TransactionService }
 ];
 TransactionLineCommissionButtonComponent.propDecorators = {
-    line: [{ type: Input }],
     showClass: [{ type: HostBinding, args: ["class.co-transaction-line-commission-button",] }]
 };
 
@@ -18815,7 +19179,8 @@ TransactionLineCommissionButtonModule.decorators = [
     { type: NgModule, args: [{
                 imports: [
                     CommonModule,
-                    PipeModule
+                    PipeModule,
+                    DialogTransactionLineCommissionCodeModule
                 ],
                 declarations: [
                     TransactionLineCommissionButtonComponent
@@ -18826,41 +19191,51 @@ TransactionLineCommissionButtonModule.decorators = [
             },] }
 ];
 
-class TransactionLineWarehouseButtonComponent {
-    constructor(iconCacheService, _dialogService) {
+class TransactionLineWarehouseButtonComponent extends TransactionLineBaseComponent {
+    constructor(iconCacheService, service) {
+        super();
         this.iconCacheService = iconCacheService;
-        this._dialogService = _dialogService;
+        this.service = service;
         this.icons = Icon;
-        this.readonly = false;
+        this.showDialogWarehouse = false;
     }
     showClass() {
         return true;
     }
-    openWarehouseDialog() {
-        if (!this.readonly) {
-            this._dialogService.showTransactionLineComponent(DialogTransactionLineWarehouseComponent, this.line);
-        }
+    transactionLineSet() {
+        return __awaiter(this, void 0, void 0, function* () {
+            if (this.transactionLine && this.transactionLine.isArticle) {
+                this.service.getWarehouses().then((warehouses) => {
+                    const warehouse = warehouses.find(w => w.warehouseNo === this.transactionLine.warehouseNumber);
+                    this.transactionLine.warehouseDescription = warehouse ? warehouse.description : "";
+                });
+            }
+        });
     }
 }
 TransactionLineWarehouseButtonComponent.decorators = [
     { type: Component, args: [{
                 selector: "co-transaction-line-warehouse-button",
                 template: `
-    <div class="transaction-line-button" [class.no-pointer]="readonly" (click)="openWarehouseDialog()">
+    <div class="transaction-line-button" [class.no-pointer]="readonly" (click)="showDialogWarehouse = true">
       <co-icon class="header-warehouse-icon" [iconData]="iconCacheService.getIcon(icons.Warehouse)"></co-icon>
-      <span class="co-transaction-overflow-ellipsis" [textContent]="line.warehouseNumber"></span>
+      <span class="co-transaction-overflow-ellipsis" [textContent]="transactionLine.warehouseNumber"></span>
     </div>
+    <co-dialog-transaction-line-warehouse *ngIf="showDialogWarehouse"
+                                          [autoClose]="true"
+                                          [transactionInfo]="transactionInfo"
+                                          [transactionLine]="transactionLine"
+                                          (close)="showDialogWarehouse = false"
+    ></co-dialog-transaction-line-warehouse>
   `,
                 encapsulation: ViewEncapsulation.None
             },] }
 ];
 TransactionLineWarehouseButtonComponent.ctorParameters = () => [
     { type: IconCacheService },
-    { type: DialogService }
+    { type: TransactionService }
 ];
 TransactionLineWarehouseButtonComponent.propDecorators = {
-    line: [{ type: Input }],
-    readonly: [{ type: Input }],
     showClass: [{ type: HostBinding, args: ["class.co-transaction-line-warehouse-button",] }]
 };
 
@@ -18870,7 +19245,8 @@ TransactionLineWarehouseButtonModule.decorators = [
     { type: NgModule, args: [{
                 imports: [
                     CommonModule,
-                    IconModule
+                    IconModule,
+                    DialogTransactionLineWarehouseModule
                 ],
                 declarations: [
                     TransactionLineWarehouseButtonComponent
@@ -18881,37 +19257,51 @@ TransactionLineWarehouseButtonModule.decorators = [
             },] }
 ];
 
-class TransactionLineDeliveryButtonComponent {
-    constructor(iconCacheService, _dialogService) {
+class TransactionLineDeliveryButtonComponent extends TransactionLineBaseComponent {
+    constructor(iconCacheService, service) {
+        super();
         this.iconCacheService = iconCacheService;
-        this._dialogService = _dialogService;
+        this.service = service;
         this.icons = Icon;
+        this.showDialogDeliveryMethod = false;
     }
     showClass() {
         return true;
     }
-    openDeliveryMethodDialog() {
-        this._dialogService.showTransactionLineComponent(DialogTransactionLineDeliveryMethodComponent, this.line);
+    transactionLineSet() {
+        return __awaiter(this, void 0, void 0, function* () {
+            if (this.transactionLine && this.transactionLine.isArticle) {
+                this.service.getDeliveryMethods().then((methods) => {
+                    const method = methods.find(m => m.code === this.transactionLine.deliveryMethodCode);
+                    this.transactionLine.deliveryMethodDescription = method ? method.description : "";
+                });
+            }
+        });
     }
 }
 TransactionLineDeliveryButtonComponent.decorators = [
     { type: Component, args: [{
                 selector: "co-transaction-line-delivery-button",
                 template: `
-    <div class="transaction-line-button big" (click)="openDeliveryMethodDialog()">
+    <div class="transaction-line-button big" (click)="showDialogDeliveryMethod = true">
       <co-icon class="header-delivery-truck-icon" [iconData]="iconCacheService.getIcon(icons.TruckFastSolid)"></co-icon>
-      <span class="co-transaction-overflow-ellipsis" [textContent]="line.deliveryMethodDescription"></span>
+      <span class="co-transaction-overflow-ellipsis" [textContent]="transactionLine.deliveryMethodDescription"></span>
     </div>
+    <co-dialog-transaction-line-delivery-method *ngIf="showDialogDeliveryMethod"
+                                                [autoClose]="true"
+                                                [transactionInfo]="transactionInfo"
+                                                [transactionLine]="transactionLine"
+                                                (close)="showDialogDeliveryMethod = false"
+    ></co-dialog-transaction-line-delivery-method>
   `,
                 encapsulation: ViewEncapsulation.None
             },] }
 ];
 TransactionLineDeliveryButtonComponent.ctorParameters = () => [
     { type: IconCacheService },
-    { type: DialogService }
+    { type: TransactionService }
 ];
 TransactionLineDeliveryButtonComponent.propDecorators = {
-    line: [{ type: Input }],
     showClass: [{ type: HostBinding, args: ["class.co-transaction-line-delivery-button",] }]
 };
 
@@ -18921,7 +19311,8 @@ TransactionLineDeliveryButtonModule.decorators = [
     { type: NgModule, args: [{
                 imports: [
                     CommonModule,
-                    IconModule
+                    IconModule,
+                    DialogTransactionLineDeliveryMethodModule
                 ],
                 declarations: [
                     TransactionLineDeliveryButtonComponent
@@ -18947,7 +19338,7 @@ TransactionLineDeliveryDateButtonComponent.decorators = [
                 template: `
     <div class="transaction-line-button custom-width no-border">
       <span [textContent]="'DELIVERY_DATE' | localize | append:':'" class="small-font"></span>
-      <span class="co-transaction-overflow-ellipsis" [textContent]="line.deliveryDate | date:'dd MMM YYYY'"></span>
+      <span class="co-transaction-overflow-ellipsis" [textContent]="transactionLine.deliveryDate | date:'dd MMM YYYY'"></span>
       <co-icon class="header-delivery-date-icon" [iconData]="iconCacheService.getIcon(icons.CalendarDayRegular)"></co-icon>
     </div>
   `,
@@ -18958,7 +19349,7 @@ TransactionLineDeliveryDateButtonComponent.ctorParameters = () => [
     { type: IconCacheService }
 ];
 TransactionLineDeliveryDateButtonComponent.propDecorators = {
-    line: [{ type: Input }],
+    transactionLine: [{ type: Input }],
     showClass: [{ type: HostBinding, args: ["class.co-transaction-line-delivery-date-button",] }]
 };
 
@@ -19002,7 +19393,10 @@ TransactionOverviewLineModule.decorators = [
                     TransactionLineCommissionButtonModule,
                     TransactionLineWarehouseButtonModule,
                     TransactionLineDeliveryButtonModule,
-                    TransactionLineDeliveryDateButtonModule
+                    TransactionLineDeliveryDateButtonModule,
+                    DialogTransactionLineVatModule,
+                    DialogTransactionLineDiscountModule,
+                    TransactionLineStatusbarModule
                 ],
                 declarations: [
                     TransactionOverviewLineComponent
@@ -19013,57 +19407,6 @@ TransactionOverviewLineModule.decorators = [
             },] }
 ];
 
-class StatusBarComponent {
-    constructor(iconCacheService) {
-        this.iconCacheService = iconCacheService;
-        this.icons = Icon;
-    }
-    showClass() {
-        return true;
-    }
-}
-StatusBarComponent.decorators = [
-    { type: Component, args: [{
-                selector: "co-status-bar",
-                template: `
-    <div>
-      <!--Tijdelijk visueel voorbeeld:-->
-      <div class="status-bar-icons-wrapper">
-        <co-icon class="color-green" [iconData]="this.iconCacheService.getIcon(this.icons.SquareFullSolid)"></co-icon>
-        <co-icon class="color-orange" [iconData]="this.iconCacheService.getIcon(this.icons.SquareFullSolid)"></co-icon>
-        <co-icon [iconData]="this.iconCacheService.getIcon(this.icons.SquareFull)"></co-icon>
-        <co-icon [iconData]="this.iconCacheService.getIcon(this.icons.SquareFull)"></co-icon>
-        <co-icon [iconData]="this.iconCacheService.getIcon(this.icons.SquareFull)"></co-icon>
-      </div>
-    </div>
-  `,
-                encapsulation: ViewEncapsulation.None
-            },] }
-];
-StatusBarComponent.ctorParameters = () => [
-    { type: IconCacheService }
-];
-StatusBarComponent.propDecorators = {
-    showClass: [{ type: HostBinding, args: ["class.co-status-bar",] }]
-};
-
-class StatusBarModule {
-}
-StatusBarModule.decorators = [
-    { type: NgModule, args: [{
-                imports: [
-                    CommonModule,
-                    IconModule
-                ],
-                declarations: [
-                    StatusBarComponent
-                ],
-                exports: [
-                    StatusBarComponent
-                ]
-            },] }
-];
-
 class TransactionOrderDeliveryLineModule {
 }
 TransactionOrderDeliveryLineModule.decorators = [
@@ -19074,10 +19417,10 @@ TransactionOrderDeliveryLineModule.decorators = [
                     TransactionLineWarehouseButtonModule,
                     TransactionLineDeliveryButtonModule,
                     TransactionLineDeliveryDateButtonModule,
-                    StatusBarModule,
                     EditableLabelModule,
                     PipeModule,
-                    InputNumberPickerModule
+                    InputNumberPickerModule,
+                    TransactionLineStatusbarModule
                 ],
                 declarations: [
                     TransactionOrderDeliveryLineComponent
@@ -19171,6 +19514,136 @@ ShoppingCartModule.decorators = [
             },] }
 ];
 
+class TransactionSearchComponent {
+    constructor(transactionSearchService) {
+        this.transactionSearchService = transactionSearchService;
+        this.searchViewModes = SearchViewMode;
+        this.orientations = CoOrientation;
+        this.directionRight = CoDirection.Right;
+        this.transactionClick = new EventEmitter();
+        this.searchViewModeChange = new EventEmitter();
+    }
+    set transactionType(value) {
+        this._transactionType = value;
+        this.transactionSearchService.transactionType = this._transactionType;
+    }
+    get transactionType() {
+        return this._transactionType;
+    }
+    showClass() {
+        return true;
+    }
+    onTransactionClick(transaction) {
+        if (this.transactionSearchService.activeSearchViewMode === this.searchViewModes.FullScreen) {
+            this.collapseSearchBar();
+        }
+        this._scrollToTop();
+        this.transactionClick.emit(transaction);
+    }
+    onSearchViewResizeClick() {
+        if (this.transactionSearchService.activeSearchViewMode === this.searchViewModes.SideBar) {
+            this.transactionSearchService.activeSearchViewMode = this.searchViewModes.FullScreen;
+        }
+        else {
+            this.transactionSearchService.activeSearchViewMode = this.searchViewModes.SideBar;
+        }
+        this.searchViewModeChange.emit(this.transactionSearchService.activeSearchViewMode);
+    }
+    onSideCollapseHandleClick() {
+        this.toggleSearchBar();
+    }
+    toggleSearchBar() {
+        if (this.transactionSearchService.collapsed || this.transactionSearchService.fullscreen) {
+            this.expandSearchBar();
+        }
+        else {
+            this.collapseSearchBar();
+        }
+    }
+    collapseSearchBar() {
+        this.transactionSearchService.activeSearchViewMode = this.searchViewModes.SideBar;
+        this.transactionSearchService.activeSearchBarViewMode = SearchbarViewMode.Collapsed;
+        this.searchViewModeChange.emit(this.searchViewModes.SideBar);
+    }
+    expandSearchBar() {
+        this.transactionSearchService.activeSearchViewMode = this.searchViewModes.SideBar;
+        this.transactionSearchService.activeSearchBarViewMode = SearchbarViewMode.Expanded;
+        this.searchViewModeChange.emit(this.searchViewModes.SideBar);
+    }
+    calculateClasses() {
+        return {
+            'fullscreen': this.transactionSearchService.fullscreen,
+            'sidebar': !this.transactionSearchService.fullscreen,
+            'collapsed': this.transactionSearchService.collapsed,
+            'expanded': !this.transactionSearchService.collapsed,
+        };
+    }
+    _scrollToTop() {
+        window.scrollTo({ top: 0, behavior: 'smooth' });
+    }
+}
+TransactionSearchComponent.decorators = [
+    { type: Component, args: [{
+                selector: 'co-transaction-search',
+                template: `
+    <div class="transaction-search-main-wrapper">
+      <div class="transaction-search-wrapper"
+           [ngClass]="calculateClasses()">
+        <div class="transaction-filter-wrapper narrow-scrollbar"
+             [ngClass]="calculateClasses()"
+             *ngIf="transactionSearchService.showFilterSidebar" @showHideFilterSidebar>
+          <co-transaction-filter
+            [transactionType]="transactionType"
+            [activeSearchViewMode]="transactionSearchService.activeSearchViewMode"
+            (closeButtonClick)="transactionSearchService.handleHideFilter()"
+            (resetFilterClick)="transactionSearchService.handleResetFilter()"></co-transaction-filter>
+        </div>
+        <div class="transaction-search-result-wrapper"
+             [class.fullscreen]="transactionSearchService.fullscreen"
+             [class.sidebar]="!transactionSearchService.fullscreen"
+             [class.collapsed]="transactionSearchService.collapsed"
+             [class.expanded]="!transactionSearchService.collapsed"
+        >
+          <co-transaction-search-result
+            [transactionType]="transactionType"
+            [activeSearchViewMode]="transactionSearchService.activeSearchViewMode"
+            (filterClick)="transactionSearchService.toggleFilter()"
+            (transactionClick)="onTransactionClick($event)"
+            (resizeClick)="onSearchViewResizeClick()"
+            (closeClick)="collapseSearchBar()"
+          ></co-transaction-search-result>
+        </div>
+      </div>
+      <div class="transaction-search-content-wrapper"
+           [class.fullscreen]="transactionSearchService.fullscreen"
+           [class.sidebar]="!transactionSearchService.fullscreen"
+           [class.collapsed]="transactionSearchService.collapsed"
+           [class.expanded]="!transactionSearchService.collapsed"
+      >
+        <ng-content></ng-content>
+      </div>
+    </div>
+  `,
+                animations: [
+                    trigger("showHideFilterSidebar", [
+                        state("void", style({ transform: 'translateX(-100%)' })),
+                        state("*", style({ transform: 'translateX(0)' })),
+                        transition("void <=> *", animate("200ms ease-in-out"))
+                    ])
+                ],
+                encapsulation: ViewEncapsulation.None
+            },] }
+];
+TransactionSearchComponent.ctorParameters = () => [
+    { type: TransactionSearchService }
+];
+TransactionSearchComponent.propDecorators = {
+    transactionType: [{ type: Input }],
+    transactionClick: [{ type: Output }],
+    searchViewModeChange: [{ type: Output }],
+    showClass: [{ type: HostBinding, args: ["class.co-transaction-search",] }]
+};
+
 class TransactionFilterComponent {
     constructor(_mappingService, _compFactoryResolver, appRef, injector, searchService) {
         this._mappingService = _mappingService;
@@ -19197,6 +19670,7 @@ class TransactionFilterComponent {
     }
     set activeSearchViewMode(value) {
         this._activeSearchViewMode = value;
+        //localStorage.setItem('viewMode', value);
     }
     get activeSearchViewMode() {
         return this._activeSearchViewMode;
@@ -19996,11 +20470,9 @@ TransactionFilterHistoricStateComponent.decorators = [
       [placeholder]="label"
       [customContent]="true">
       <co-input-radio-button *ngFor="let state of states"
-                             [name]="groupName"
-                             [value]="state.value"
                              [model]="state.checked"
                              [label]="state.label | localize"
-                             (modelChange)="handleStateChange($event)"
+                             (modelChange)="handleStateChange(state.value)"
       ></co-input-radio-button>
     </co-transaction-filter-item>
   `,
@@ -20368,8 +20840,8 @@ class TransactionStatusbarComponent {
             //this.getStatusbarLine(),// Factuurcheck todo: als BE gereed is
         ];
     }
-    getStatusbarLine(label, property) {
-        return { label: this._dictionary.get(label), percentage: this.calculatePercentage(property, this._total), count: property };
+    getStatusbarLine(label, quantity) {
+        return { label: this._dictionary.get(label), percentage: this.calculatePercentage(quantity, this._total) };
     }
     calculatePercentage(amount, totalAmount) {
         if (amount === 0 || totalAmount === 0) {
@@ -20522,11 +20994,12 @@ TransactionSearchHeaderComponent.decorators = [
                            [noIcon]="true"
                            [(model)]="searchService.searchRequest.general"
                            [placeholder]="'SEARCH_NUMBER_CUSTOMER_OR_DATE' | localize"
+                           [initFocus]="true"
                            (search)="searchService.searchTransactions()"></co-input-search>
         </div>
         <div>
           <co-button class="transaction-search-filter-button"
-                     
+
                      [iconData]="iconCacheService.getIcon(icon.BarsFilter)"
                      (click)="filterButtonClick.emit()">
           </co-button>
@@ -20883,37 +21356,41 @@ TransactionSearchResultComponent.decorators = [
       </co-transaction-search-header>
     </div>
 
-    <div class="transaction-search-result-content-tiles-wrapper" [ngClass]="fullscreen ? 'fullscreen' : 'sidebar'"
-         *ngIf="activeContentViewMode === contentViewModes.Tiles">
-      <div class="transaction-tile" *ngFor="let transaction of searchService.transactions">
-        <co-transaction-search-tile
-          [transaction]="transaction"
-          [transactionType]="transactionType"
-          [class]="transaction === selectedTransaction ? 'selected' : ''"
-          (transactionClick)="onTransactionClick($event)">
-        </co-transaction-search-tile>
+      <div class="transaction-search-result-content-tiles-wrapper" [ngClass]="fullscreen ? 'fullscreen' : 'sidebar'"
+           *ngIf="activeContentViewMode === contentViewModes.Tiles">
+        <div class="transaction-tile" *ngFor="let transaction of searchService.transactions">
+          <co-transaction-search-tile
+            [transaction]="transaction"
+            [transactionType]="transactionType"
+            [class]="transaction === selectedTransaction ? 'selected' : ''"
+            (transactionClick)="onTransactionClick($event)">
+          </co-transaction-search-tile>
+        </div>
       </div>
-    </div>
 
-    <div class="transaction-search-result-content-grid-wrapper" *ngIf="activeContentViewMode === contentViewModes.Grid">
-      <co-transaction-search-grid
-        [transactionType]="transactionType"
-        (transactionClick)="onTransactionClick($event)"
-      ></co-transaction-search-grid>
-    </div>
-    <co-pagination-bar *ngIf="searchService.transactions?.length > 0"
-                       [currentPage]="searchService.currentPage"
-                       [itemsPerPage]="searchService.transactionsPerPage"
-                       [totalItems]="searchService.resultCount"
-                       [previousLabel]="'PREVIOUS' | localize"
-                       [nextLabel]="'NEXT' | localize"
-                       [autoHide]="true"
-                       [directionLinks]="fullscreen"
-                       [paginationRange]="!fullscreen ? 6 : 8"
-                       (previousClick)="onPreviousClick()"
-                       (nextClick)="onNextClick()"
-                       (pageClick)="onPageClick($event)">
-    </co-pagination-bar>
+      <div class="transaction-search-result-content-grid-wrapper"
+           *ngIf="activeContentViewMode === contentViewModes.Grid">
+        <co-transaction-search-grid
+          [transactionType]="transactionType"
+          (transactionClick)="onTransactionClick($event)"
+        ></co-transaction-search-grid>
+      </div>
+      <co-pagination-bar *ngIf="searchService.transactions?.length > 0"
+                         [currentPage]="searchService.currentPage"
+                         [itemsPerPage]="searchService.transactionsPerPage"
+                         [totalItems]="searchService.resultCount"
+                         [previousLabel]="'PREVIOUS' | localize"
+                         [nextLabel]="'NEXT' | localize"
+                         [autoHide]="true"
+                         [directionLinks]="fullscreen"
+                         [paginationRange]="!fullscreen ? 6 : 8"
+                         (previousClick)="onPreviousClick()"
+                         (nextClick)="onNextClick()"
+                         (pageClick)="onPageClick($event)">
+      </co-pagination-bar>
+      <div class="empty-state-wrapper" *ngIf="this.searchService.transactions && this.searchService.resultCount === 0">
+        <span [textContent]="'0_RESULTS_FOUND' | localize"></span>
+      </div>
   `,
                 encapsulation: ViewEncapsulation.None
             },] }
@@ -21698,5 +22175,5 @@ TransactionLineGridModule.decorators = [
  * Generated bundle index. Do not edit.
  */
 
-export { CheckoutComponent, CheckoutModule, SearchBarViewMode, ShoppingCartComponent, ShoppingCartModule, ShoppingCartPreviewComponent, ShoppingCartPreviewModule, TransactionComponent, TransactionConfirmationDetailsComponent, TransactionConfirmationDetailsModule, TransactionConfirmationHistoryComponent, TransactionConfirmationHistoryModule, TransactionHeaderComponent, TransactionHeaderDeliveryComponent, TransactionHeaderDeliveryModule, TransactionHeaderModule, TransactionHeaderOrderComponent, TransactionHeaderOrderModule, TransactionHeaderRelationComponent, TransactionHeaderRelationModule, TransactionLineGridComponent, TransactionLineGridModule, TransactionLineStatusbarComponent, TransactionLineStatusbarModule, TransactionLinesComponent, TransactionLinesModule, TransactionModule, TransactionQuickAccessComponent, TransactionQuickAccessModule, TransactionQuickAccessOrderConfirmationComponent, TransactionQuickAccessOrderConfirmationModule, TransactionQuickAccessReceivedGoodsComponent, TransactionQuickAccessReceivedGoodsModule, TransactionSearchComponent, TransactionSearchModule, TransactionSearchService, TransactionService, TransactionStatusbarComponent, TransactionStatusbarModule, TransactionTotalsComponent, TransactionTotalsModule, PendingReasonService as ɵa, DialogService as ɵb, IconCacheService as ɵba, CharacteristicAnswerModule as ɵbb, CharacteristicAnswerComponent as ɵbc, WarehouseModule as ɵbd, WarehouseComponent as ɵbe, ImageDisplayComponent as ɵbf, IconComponent as ɵbg, CustomerGroupsComponent as ɵbh, StockStatusIndicatorComponent as ɵbi, LoaderComponent as ɵbj, LazyRenderMasterDirective as ɵbk, LazyRenderDirective as ɵbl, RelationAddressModule as ɵbm, RelationAddressComponent as ɵbn, RelationBaseComponent as ɵbo, RelationAddressSelectModule as ɵbp, RelationAddressTileModule as ɵbq, TileModule as ɵbr, TileComponent as ɵbs, RelationAddressTileComponent as ɵbt, RelationAddressSelectComponent as ɵbu, BusinessObjectFactory as ɵbv, StepperModule as ɵbw, StepperComponent as ɵbx, StepperStepComponent as ɵby, TransactionLineModule as ɵbz, DynamicComponentService as ɵc, TransactionLineComponent as ɵca, TransactionMappingService as ɵcb, TransactionArticleTextModule as ɵcc, TransactionArticleTextComponent as ɵcd, TransactionReceiveGoodsService as ɵce, TransactionEventService as ɵcf, AvatarModule as ɵcg, AvatarComponent as ɵch, SharedService as ɵci, SharedConnectorService as ɵcj, DeliveryTypeTileModule as ɵck, DeliveryTypeTileComponent as ɵcl, PaymentModule as ɵcm, PaymentTileModule as ɵcn, PaymentTileComponent as ɵco, PaymentQrCodeModule as ɵcp, PaymentQrCodeComponent as ɵcq, PaymentComponent as ɵcr, PaymentService as ɵcs, RelationTypeModule as ɵct, RelationTypeComponent as ɵcu, RelationGeneralModule as ɵcv, RelationSuggestionsListModule as ɵcw, RelationSuggestionsListItemModule as ɵcx, RelationSuggestionsListItemComponent as ɵcy, RelationSuggestionsListComponent as ɵcz, OptionsService as ɵd, RelationGeneralComponent as ɵda, RelationAddressesModule as ɵdb, RelationAddressesComponent as ɵdc, RelationContactDetailsModule as ɵdd, RelationContactDetailsComponent as ɵde, RelationPreferencesModule as ɵdf, RelationPreferencesComponent as ɵdg, TransactionHeaderBlockModule as ɵdh, TransactionHeaderBlockComponent as ɵdi, TransactionHeaderDeliveryDateModule as ɵdj, TransactionHeaderDeliveryDateComponent as ɵdk, TransactionHeaderBaseComponent as ɵdl, TransactionFilterPopupBaseComponent as ɵdm, TransactionHeaderDeliveryOptionsModule as ɵdn, TransactionHeaderDeliveryOptionsComponent as ɵdo, TransactionHeaderRemarksModule as ɵdp, TransactionHeaderRemarksComponent as ɵdq, TransactionHeaderReferenceModule as ɵdr, TransactionHeaderReferenceComponent as ɵds, TransactionHeaderRelationReferenceModule as ɵdt, TransactionHeaderRelationReferenceComponent as ɵdu, TransactionHeaderDeliveryMethodModule as ɵdv, TransactionLineCheckboxModule as ɵdw, TransactionLineCheckboxListComponent as ɵdx, TransactionHeaderDeliveryMethodComponent as ɵdy, TransactionHeaderPreferredDeliveryDateModule as ɵdz, DictionaryService as ɵe, TransactionHeaderPreferredDeliveryDateComponent as ɵea, DialogTransactionHeaderDeliveryMethodModule as ɵeb, DialogHeaderSearchModule as ɵec, DialogHeaderSearchComponent as ɵed, DialogTransactionHeaderDeliveryMethodComponent as ɵee, DialogTransactionHeaderBaseComponent as ɵef, TransactionBaseComponent as ɵeg, TransactionHeaderPartialDeliveryModule as ɵeh, TransactionHeaderPartialDeliveryComponent as ɵei, TransactionHeaderDownpaymentPercentageModule as ɵej, TransactionHeaderDownpaymentPercentageComponent as ɵek, TransactionHeaderDownpaymentAmountModule as ɵel, TransactionHeaderDownpaymentAmountComponent as ɵem, TransactionHeaderDefinitiveModule as ɵen, TransactionHeaderDefinitiveComponent as ɵeo, TransactionHeaderBranchModule as ɵep, TransactionHeaderBranchComponent as ɵeq, TransactionHeaderAdministrativeRelationModule as ɵer, TransactionHeaderAdministrativeRelationComponent as ɵes, TransactionHeaderMarketingModule as ɵet, TransactionHeaderMarketingComponent as ɵeu, CheckoutOverviewRelationEditComponent as ɵev, CheckoutOverviewDeliveryEditComponent as ɵew, CheckoutOverviewDeliveryAddressComponent as ɵex, CheckoutOverviewPaymentComponent as ɵey, CheckoutLoginComponent as ɵez, TransactionConnectorService as ɵf, TransactionFilterCategoriesModule as ɵfa, TransactionFilterCategoriesComponent as ɵfb, TransactionHeaderPaymentModule as ɵfc, TransactionHeaderPaymentComponent as ɵfd, TransactionLinesGridModule as ɵfe, TransactionBaseGridModule as ɵff, TransactionLineSidePanelModule as ɵfg, TransactionLineSidePanelDefaultModule as ɵfh, TransactionLinePriceModule as ɵfi, TransactionLinePriceComponent as ɵfj, TransactionLineBaseComponent as ɵfk, TransactionLinePriceListModule as ɵfl, TransactionLinePriceListComponent as ɵfm, TransactionLineVatModule as ɵfn, TransactionLineVatComponent as ɵfo, TransactionLineQuantityModule as ɵfp, TransactionLineQuantityComponent as ɵfq, TransactionLineLineDiscountModule as ɵfr, TransactionLineLineDiscountComponent as ɵfs, TransactionLineDeliveryMethodModule as ɵft, TransactionLineDeliveryMethodComponent as ɵfu, TransactionLineDeliveryDateModule as ɵfv, TransactionLineDeliveryDateComponent as ɵfw, TransactionLineReferenceModule as ɵfx, TransactionLineReferenceComponent as ɵfy, TransactionLineCommissionCodeModule as ɵfz, TransactionConnectorAdapterService as ɵg, TransactionLineCommissionCodeComponent as ɵga, TransactionLineWarehouseModule as ɵgb, TransactionLineWarehouseComponent as ɵgc, TransactionLineDiscountAmountModule as ɵgd, TransactionLineDiscountAmountComponent as ɵge, TransactionLineQuantumDiscountModule as ɵgf, TransactionLineQuantumDiscountComponent as ɵgg, TransactionLineSpecialDiscountModule as ɵgh, TransactionLineSpecialDiscountComponent as ɵgi, TransactionLineSupplierModule as ɵgj, TransactionLineSupplierComponent as ɵgk, TransactionLineDescriptionModule as ɵgl, TransactionLineDescriptionComponent as ɵgm, TransactionLineSidePanelDefaultComponent as ɵgn, TransactionReceivingGoodsHistoryModule as ɵgo, TransactionHistoryGridModule as ɵgp, TransactionHistoryGridStatusModule as ɵgq, TransactionHistoryGridStatusComponent as ɵgr, TransactionHistoryGridComponent as ɵgs, TransactionReceivingGoodsHistoryComponent as ɵgt, TransactionReceivingGoodsDetailsModule as ɵgu, TransactionReceivingGoodsDetailsComponent as ɵgv, ArticleService as ɵgw, TransactionButtonBarModule as ɵgx, TransactionButtonBarComponent as ɵgy, TransactionButtonBarButtonComponent as ɵgz, SelectMultipleCacheService as ɵh, TransactionLineSidePanelPurchaseModule as ɵha, DefaultOkCancelButtonsModule as ɵhb, DefaultOkCancelButtonsComponent as ɵhc, TransactionLineSidePanelPurchaseComponent as ɵhd, TransactionLineSidePanelComponent as ɵhe, DynamicBaseComponent as ɵhf, TransactionLineActionButtonsModule as ɵhg, TransactionArticleTextOverviewModule as ɵhh, TransactionArticleTextOverviewComponent as ɵhi, TransactionLineActionButtonsComponent as ɵhj, TransactionBaseGridComponent as ɵhk, TransactionGridBaseComponent as ɵhl, TransactionImageService as ɵhm, DialogTransactionLineCommissionCodeModule as ɵhn, DialogTransactionLineCommissionCodeComponent as ɵho, DialogTransactionLineBaseComponent as ɵhp, DialogTransactionLineWarehouseModule as ɵhq, DialogTransactionLineWarehouseComponent as ɵhr, DialogTransactionLineWarehouseCcModule as ɵhs, DialogTransactionLineWarehouseCcComponent as ɵht, DialogTransactionLineDeliveryMethodModule as ɵhu, DialogTransactionLineDeliveryMethodComponent as ɵhv, DialogTransactionLineVatModule as ɵhw, DialogTransactionLineVatComponent as ɵhx, DialogTransactionLineDiscountModule as ɵhy, DialogTransactionLinePriceListModule as ɵhz, BusinessObjectCacheManagerService as ɵi, DialogTransactionLinePriceListComponent as ɵia, DialogTransactionLineDiscountComponent as ɵib, TransactionLinesGridComponent as ɵic, DiscountModule as ɵid, DiscountComponent as ɵie, TransactionQuickAccessOverviewModule as ɵif, TransactionQuickAccessOverviewComponent as ɵig, TransactionQuickAccessOrderDeliveryModule as ɵih, TransactionQuickAccessOrderDeliveryComponent as ɵii, TransactionOrderConfirmationGridModule as ɵij, TransactionOrderConfirmationGridComponent as ɵik, TransactionReceivedGoodsGridModule as ɵil, DialogTransactionLineWarehouseLocationModule as ɵim, TransactionLineWarehouseLocationModule as ɵin, TransactionLineWarehouseLocationComponent as ɵio, DialogTransactionLineWarehouseLocationComponent as ɵip, TransactionLineWarehouseLocationButtonModule as ɵiq, TransactionLineWarehouseLocationButtonComponent as ɵir, TransactionReceivedGoodsGridComponent as ɵis, ViewModeButtonsModule as ɵit, ViewModeButtonsComponent as ɵiu, TransactionGridModule as ɵiv, TransactionGridComponent as ɵiw, TransactionTileModule as ɵix, TransactionTileComponent as ɵiy, TransactionOverviewLineModule as ɵiz, CacheField as ɵj, EditableLabelModule as ɵja, EditableLabelComponent as ɵjb, TransactionBaseLineModule as ɵjc, TransactionLineImageAndDescriptionModule as ɵjd, TransactionLineImageAndDescriptionComponent as ɵje, TransactionBaseLineComponent as ɵjf, TransactionLinesLineBaseComponent as ɵjg, TransactionLineCommissionButtonModule as ɵjh, TransactionLineCommissionButtonComponent as ɵji, TransactionLineWarehouseButtonModule as ɵjj, TransactionLineWarehouseButtonComponent as ɵjk, TransactionLineDeliveryButtonModule as ɵjl, TransactionLineDeliveryButtonComponent as ɵjm, TransactionLineDeliveryDateButtonModule as ɵjn, TransactionLineDeliveryDateButtonComponent as ɵjo, TransactionOverviewLineComponent as ɵjp, TransactionOrderDeliveryLineModule as ɵjq, StatusBarModule as ɵjr, StatusBarComponent as ɵjs, TransactionOrderDeliveryLineComponent as ɵjt, TransactionReceiveGoodsLineModule as ɵju, TransactionReceiveGoodsLineComponent as ɵjv, TransactionSearchResultModule as ɵjw, TransactionSearchSalesOrderTileModule as ɵjx, TransactionSearchSalesOrderTileComponent as ɵjy, TransactionSearchTileBaseComponent as ɵjz, SelectMultipleParameterizedCacheService as ɵk, TransactionSearchPurchaseOrderTileModule as ɵka, TransactionSearchPurchaseOrderTileComponent as ɵkb, TransactionSearchSalesOrderGridModule as ɵkc, TransactionSearchSalesOrderGridComponent as ɵkd, TransactionSearchGridBaseComponent as ɵke, TransactionSearchPurchaseOrderGridModule as ɵkf, TransactionSearchPurchaseOrderGridComponent as ɵkg, TransactionSearchHeaderModule as ɵkh, TransactionSearchHeaderComponent as ɵki, TransactionSearchGridModule as ɵkj, TransactionSearchGridComponent as ɵkk, TransactionSearchTileModule as ɵkl, TransactionSearchTileComponent as ɵkm, TransactionSearchResultComponent as ɵkn, TransactionSalesOrderFilterModule as ɵko, TransactionSalesOrderFilterContentOrderModule as ɵkp, TransactionFilterItemModule as ɵkq, TransactionFilterItemComponent as ɵkr, TransactionSalesOrderFilterContentOrderComponent as ɵks, TransactionFilterContentBaseComponent as ɵkt, FilterRequestService as ɵku, TransactionSalesOrderFilterContentLogisticsModule as ɵkv, TransactionFilterHistoricStateModule as ɵkw, TransactionFilterHistoricStateComponent as ɵkx, TransactionSalesOrderFilterContentLogisticsComponent as ɵky, TransactionSalesOrderFilterContentArticleModule as ɵkz, ErrorService as ɵl, TransactionSalesOrderFilterContentArticleComponent as ɵla, TransactionSalesOrderFilterComponent as ɵlb, TransactionFilterBaseComponent as ɵlc, TransactionPurchaseOrderFilterModule as ɵld, TransactionPurchaseOrderFilterContentOrderModule as ɵle, TransactionPurchaseOrderFilterContentOrderComponent as ɵlf, TransactionPurchaseOrderFilterContentLogisticsModule as ɵlg, TransactionPurchaseOrderFilterContentLogisticsComponent as ɵlh, TransactionPurchaseOrderFilterContentArticleModule as ɵli, TransactionPurchaseOrderFilterContentArticleComponent as ɵlj, TransactionPurchaseOrderFilterComponent as ɵlk, TransactionFilterModule as ɵll, TransactionFilterComponent as ɵlm, SelectSingleCacheService as ɵm, ArticleConnectorService as ɵn, CoreModule as ɵo, ConfirmationDialogModule as ɵp, PipeModule as ɵq, AppendPipe as ɵr, DeliveryTimePipe as ɵs, DateDurationPipe as ɵt, LocalizePipe as ɵu, CoCurrencyPipe as ɵv, SafeStylePipe as ɵw, SafeHtmlPipe as ɵx, ConfirmationDialogComponent as ɵy, DialogBaseComponent as ɵz };
+export { CheckoutComponent, CheckoutModule, SearchViewMode, SearchbarViewMode, ShoppingCartComponent, ShoppingCartModule, ShoppingCartPreviewComponent, ShoppingCartPreviewModule, TransactionComponent, TransactionConfirmationDetailsComponent, TransactionConfirmationDetailsModule, TransactionConfirmationHistoryComponent, TransactionConfirmationHistoryModule, TransactionHeaderComponent, TransactionHeaderDeliveryComponent, TransactionHeaderDeliveryModule, TransactionHeaderModule, TransactionHeaderOrderComponent, TransactionHeaderOrderModule, TransactionHeaderRelationComponent, TransactionHeaderRelationModule, TransactionLineGridComponent, TransactionLineGridModule, TransactionLineStatusbarComponent, TransactionLineStatusbarModule, TransactionLinesComponent, TransactionLinesModule, TransactionModule, TransactionQuickAccessComponent, TransactionQuickAccessModule, TransactionQuickAccessOrderConfirmationComponent, TransactionQuickAccessOrderConfirmationModule, TransactionQuickAccessReceivedGoodsComponent, TransactionQuickAccessReceivedGoodsModule, TransactionSearchComponent, TransactionSearchModule, TransactionSearchService, TransactionService, TransactionStatusbarComponent, TransactionStatusbarModule, TransactionTotalsComponent, TransactionTotalsModule, PendingReasonService as ɵa, DialogService as ɵb, IconCacheService as ɵba, CharacteristicAnswerModule as ɵbb, CharacteristicAnswerComponent as ɵbc, WarehouseModule as ɵbd, WarehouseComponent as ɵbe, ImageDisplayComponent as ɵbf, IconComponent as ɵbg, CustomerGroupsComponent as ɵbh, StockStatusIndicatorComponent as ɵbi, LoaderComponent as ɵbj, LazyRenderMasterDirective as ɵbk, LazyRenderDirective as ɵbl, RelationAddressModule as ɵbm, RelationAddressComponent as ɵbn, RelationBaseComponent as ɵbo, RelationAddressSelectModule as ɵbp, RelationAddressTileModule as ɵbq, TileModule as ɵbr, TileComponent as ɵbs, RelationAddressTileComponent as ɵbt, RelationAddressSelectComponent as ɵbu, BusinessObjectFactory as ɵbv, StepperModule as ɵbw, StepperComponent as ɵbx, StepperStepComponent as ɵby, TransactionLineModule as ɵbz, DynamicComponentService as ɵc, TransactionLineComponent as ɵca, TransactionMappingService as ɵcb, TransactionArticleTextModule as ɵcc, TransactionArticleTextComponent as ɵcd, TransactionReceiveGoodsService as ɵce, TransactionEventService as ɵcf, DialogTransactionHeaderDiscountModule as ɵcg, TransactionHeaderDiscountPercentageModule as ɵch, TransactionHeaderDiscountPercentageComponent as ɵci, TransactionHeaderBaseComponent as ɵcj, TransactionFilterPopupBaseComponent as ɵck, TransactionHeaderDiscountAmountModule as ɵcl, TransactionHeaderDiscountAmountComponent as ɵcm, TransactionHeaderDiscountTransactionTotalModule as ɵcn, TransactionHeaderDiscountTransactionTotalComponent as ɵco, DialogTransactionHeaderDiscountComponent as ɵcp, DialogTransactionHeaderBaseComponent as ɵcq, AvatarModule as ɵcr, AvatarComponent as ɵcs, SharedService as ɵct, SharedConnectorService as ɵcu, DeliveryTypeTileModule as ɵcv, DeliveryTypeTileComponent as ɵcw, PaymentModule as ɵcx, PaymentTileModule as ɵcy, PaymentTileComponent as ɵcz, OptionsService as ɵd, PaymentQrCodeModule as ɵda, PaymentQrCodeComponent as ɵdb, PaymentComponent as ɵdc, PaymentService as ɵdd, RelationTypeModule as ɵde, RelationTypeComponent as ɵdf, RelationGeneralModule as ɵdg, RelationSuggestionsListModule as ɵdh, RelationSuggestionsListItemModule as ɵdi, RelationSuggestionsListItemComponent as ɵdj, RelationSuggestionsListComponent as ɵdk, RelationGeneralComponent as ɵdl, RelationAddressesModule as ɵdm, RelationAddressesComponent as ɵdn, RelationContactDetailsModule as ɵdo, RelationContactDetailsComponent as ɵdp, RelationPreferencesModule as ɵdq, RelationPreferencesComponent as ɵdr, TransactionHeaderBlockModule as ɵds, TransactionHeaderBlockComponent as ɵdt, TransactionHeaderDeliveryDateModule as ɵdu, TransactionHeaderDeliveryDateComponent as ɵdv, TransactionHeaderDeliveryOptionsModule as ɵdw, TransactionHeaderDeliveryOptionsComponent as ɵdx, TransactionHeaderRemarksModule as ɵdy, TransactionHeaderRemarksComponent as ɵdz, DictionaryService as ɵe, TransactionHeaderReferenceModule as ɵea, TransactionHeaderReferenceComponent as ɵeb, TransactionHeaderRelationReferenceModule as ɵec, TransactionHeaderRelationReferenceComponent as ɵed, TransactionHeaderDeliveryMethodModule as ɵee, TransactionLineCheckboxModule as ɵef, TransactionLineCheckboxListComponent as ɵeg, TransactionHeaderDeliveryMethodComponent as ɵeh, TransactionHeaderPreferredDeliveryDateModule as ɵei, TransactionHeaderPreferredDeliveryDateComponent as ɵej, DialogTransactionHeaderDeliveryMethodModule as ɵek, DialogHeaderSearchModule as ɵel, DialogHeaderSearchComponent as ɵem, DialogTransactionHeaderDeliveryMethodComponent as ɵen, TransactionHeaderPartialDeliveryModule as ɵeo, TransactionHeaderPartialDeliveryComponent as ɵep, TransactionBaseComponent as ɵeq, TransactionHeaderDownpaymentPercentageModule as ɵer, TransactionHeaderDownpaymentPercentageComponent as ɵes, TransactionHeaderDownpaymentAmountModule as ɵet, TransactionHeaderDownpaymentAmountComponent as ɵeu, TransactionHeaderDefinitiveModule as ɵev, TransactionHeaderDefinitiveComponent as ɵew, TransactionHeaderBranchModule as ɵex, TransactionHeaderBranchComponent as ɵey, TransactionHeaderAdministrativeRelationModule as ɵez, TransactionConnectorService as ɵf, TransactionHeaderAdministrativeRelationComponent as ɵfa, TransactionHeaderMarketingModule as ɵfb, TransactionHeaderMarketingComponent as ɵfc, CheckoutOverviewRelationEditComponent as ɵfd, CheckoutOverviewDeliveryEditComponent as ɵfe, CheckoutOverviewDeliveryAddressComponent as ɵff, CheckoutOverviewPaymentComponent as ɵfg, CheckoutLoginComponent as ɵfh, TransactionFilterCategoriesModule as ɵfi, TransactionFilterCategoriesComponent as ɵfj, TransactionHeaderPaymentModule as ɵfk, TransactionHeaderPaymentComponent as ɵfl, TransactionLinesGridModule as ɵfm, TransactionBaseGridModule as ɵfn, TransactionLineSidePanelModule as ɵfo, TransactionLineSidePanelDefaultModule as ɵfp, TransactionLinePriceModule as ɵfq, TransactionLinePriceComponent as ɵfr, TransactionLineBaseComponent as ɵfs, TransactionLinePriceListModule as ɵft, TransactionLinePriceListComponent as ɵfu, TransactionLineVatModule as ɵfv, TransactionLineVatComponent as ɵfw, TransactionLineQuantityModule as ɵfx, TransactionLineQuantityComponent as ɵfy, TransactionLineLineDiscountModule as ɵfz, TransactionConnectorAdapterService as ɵg, TransactionLineLineDiscountComponent as ɵga, TransactionLineDeliveryMethodModule as ɵgb, TransactionLineDeliveryMethodComponent as ɵgc, TransactionLineDeliveryDateModule as ɵgd, TransactionLineDeliveryDateComponent as ɵge, TransactionLineReferenceModule as ɵgf, TransactionLineReferenceComponent as ɵgg, TransactionLineCommissionCodeModule as ɵgh, TransactionLineCommissionCodeComponent as ɵgi, TransactionLineWarehouseModule as ɵgj, TransactionLineWarehouseComponent as ɵgk, TransactionLineDiscountAmountModule as ɵgl, TransactionLineDiscountAmountComponent as ɵgm, TransactionLineQuantumDiscountModule as ɵgn, TransactionLineQuantumDiscountComponent as ɵgo, TransactionLineSpecialDiscountModule as ɵgp, TransactionLineSpecialDiscountComponent as ɵgq, TransactionLineSupplierModule as ɵgr, TransactionLineSupplierComponent as ɵgs, TransactionLineDescriptionModule as ɵgt, TransactionLineDescriptionComponent as ɵgu, TransactionLineSidePanelDefaultComponent as ɵgv, TransactionReceivingGoodsHistoryModule as ɵgw, TransactionHistoryGridModule as ɵgx, TransactionHistoryGridStatusModule as ɵgy, TransactionHistoryGridStatusComponent as ɵgz, SelectMultipleCacheService as ɵh, TransactionHistoryGridComponent as ɵha, TransactionReceivingGoodsHistoryComponent as ɵhb, TransactionReceivingGoodsDetailsModule as ɵhc, TransactionReceivingGoodsDetailsComponent as ɵhd, ArticleService as ɵhe, TransactionButtonBarModule as ɵhf, TransactionButtonBarComponent as ɵhg, TransactionButtonBarButtonComponent as ɵhh, TransactionLineSidePanelPurchaseModule as ɵhi, DefaultOkCancelButtonsModule as ɵhj, DefaultOkCancelButtonsComponent as ɵhk, TransactionLineSidePanelPurchaseComponent as ɵhl, TransactionLineSidePanelComponent as ɵhm, DynamicBaseComponent as ɵhn, TransactionLineActionButtonsModule as ɵho, TransactionArticleTextOverviewModule as ɵhp, TransactionArticleTextOverviewComponent as ɵhq, TransactionLineActionButtonsComponent as ɵhr, TransactionBaseGridComponent as ɵhs, TransactionGridBaseComponent as ɵht, TransactionImageService as ɵhu, DialogTransactionLineCommissionCodeModule as ɵhv, DialogTransactionLineCommissionCodeComponent as ɵhw, DialogTransactionLineBaseComponent as ɵhx, DialogTransactionLineWarehouseModule as ɵhy, DialogTransactionLineWarehouseComponent as ɵhz, BusinessObjectCacheManagerService as ɵi, DialogTransactionLineWarehouseCcModule as ɵia, DialogTransactionLineWarehouseCcComponent as ɵib, DialogTransactionLineDeliveryMethodModule as ɵic, DialogTransactionLineDeliveryMethodComponent as ɵid, DialogTransactionLineVatModule as ɵie, DialogTransactionLineVatComponent as ɵif, DialogTransactionLineDiscountModule as ɵig, DialogTransactionLinePriceListModule as ɵih, DialogTransactionLinePriceListComponent as ɵii, DialogTransactionLineDiscountComponent as ɵij, TransactionLinesGridComponent as ɵik, DiscountModule as ɵil, DiscountComponent as ɵim, TransactionQuickAccessOverviewModule as ɵin, TransactionQuickAccessOverviewComponent as ɵio, TransactionQuickAccessOrderDeliveryModule as ɵip, TransactionQuickAccessOrderDeliveryComponent as ɵiq, TransactionOrderConfirmationGridModule as ɵir, TransactionOrderConfirmationGridComponent as ɵis, TransactionReceivedGoodsGridModule as ɵit, DialogTransactionLineWarehouseLocationModule as ɵiu, TransactionLineWarehouseLocationModule as ɵiv, TransactionLineWarehouseLocationComponent as ɵiw, DialogTransactionLineWarehouseLocationComponent as ɵix, TransactionLineWarehouseLocationButtonModule as ɵiy, TransactionLineWarehouseLocationButtonComponent as ɵiz, CacheField as ɵj, TransactionReceivedGoodsGridComponent as ɵja, ViewModeButtonsModule as ɵjb, ViewModeButtonsComponent as ɵjc, TransactionGridModule as ɵjd, TransactionGridComponent as ɵje, TransactionTileModule as ɵjf, TransactionTileComponent as ɵjg, TransactionOverviewLineModule as ɵjh, EditableLabelModule as ɵji, EditableLabelComponent as ɵjj, TransactionBaseLineModule as ɵjk, TransactionLineImageAndDescriptionModule as ɵjl, TransactionLineImageAndDescriptionComponent as ɵjm, TransactionBaseLineComponent as ɵjn, TransactionLinesLineBaseComponent as ɵjo, TransactionLineCommissionButtonModule as ɵjp, TransactionLineCommissionButtonComponent as ɵjq, TransactionLineWarehouseButtonModule as ɵjr, TransactionLineWarehouseButtonComponent as ɵjs, TransactionLineDeliveryButtonModule as ɵjt, TransactionLineDeliveryButtonComponent as ɵju, TransactionLineDeliveryDateButtonModule as ɵjv, TransactionLineDeliveryDateButtonComponent as ɵjw, TransactionOverviewLineComponent as ɵjx, TransactionOrderDeliveryLineModule as ɵjy, TransactionOrderDeliveryLineComponent as ɵjz, SelectMultipleParameterizedCacheService as ɵk, TransactionReceiveGoodsLineModule as ɵka, TransactionReceiveGoodsLineComponent as ɵkb, TransactionSearchResultModule as ɵkc, TransactionSearchSalesOrderTileModule as ɵkd, TransactionSearchSalesOrderTileComponent as ɵke, TransactionSearchTileBaseComponent as ɵkf, TransactionSearchPurchaseOrderTileModule as ɵkg, TransactionSearchPurchaseOrderTileComponent as ɵkh, TransactionSearchSalesOrderGridModule as ɵki, TransactionSearchSalesOrderGridComponent as ɵkj, TransactionSearchGridBaseComponent as ɵkk, TransactionSearchPurchaseOrderGridModule as ɵkl, TransactionSearchPurchaseOrderGridComponent as ɵkm, TransactionSearchHeaderModule as ɵkn, TransactionSearchHeaderComponent as ɵko, TransactionSearchGridModule as ɵkp, TransactionSearchGridComponent as ɵkq, TransactionSearchTileModule as ɵkr, TransactionSearchTileComponent as ɵks, TransactionSearchResultComponent as ɵkt, TransactionSalesOrderFilterModule as ɵku, TransactionSalesOrderFilterContentOrderModule as ɵkv, TransactionFilterItemModule as ɵkw, TransactionFilterItemComponent as ɵkx, TransactionSalesOrderFilterContentOrderComponent as ɵky, TransactionFilterContentBaseComponent as ɵkz, ErrorService as ɵl, FilterRequestService as ɵla, TransactionSalesOrderFilterContentLogisticsModule as ɵlb, TransactionFilterHistoricStateModule as ɵlc, TransactionFilterHistoricStateComponent as ɵld, TransactionSalesOrderFilterContentLogisticsComponent as ɵle, TransactionSalesOrderFilterContentArticleModule as ɵlf, TransactionSalesOrderFilterContentArticleComponent as ɵlg, TransactionSalesOrderFilterComponent as ɵlh, TransactionFilterBaseComponent as ɵli, TransactionPurchaseOrderFilterModule as ɵlj, TransactionPurchaseOrderFilterContentOrderModule as ɵlk, TransactionPurchaseOrderFilterContentOrderComponent as ɵll, TransactionPurchaseOrderFilterContentLogisticsModule as ɵlm, TransactionPurchaseOrderFilterContentLogisticsComponent as ɵln, TransactionPurchaseOrderFilterContentArticleModule as ɵlo, TransactionPurchaseOrderFilterContentArticleComponent as ɵlp, TransactionPurchaseOrderFilterComponent as ɵlq, TransactionFilterModule as ɵlr, TransactionFilterComponent as ɵls, SelectSingleCacheService as ɵm, ArticleConnectorService as ɵn, CoreModule as ɵo, ConfirmationDialogModule as ɵp, PipeModule as ɵq, AppendPipe as ɵr, DeliveryTimePipe as ɵs, DateDurationPipe as ɵt, LocalizePipe as ɵu, CoCurrencyPipe as ɵv, SafeStylePipe as ɵw, SafeHtmlPipe as ɵx, ConfirmationDialogComponent as ɵy, DialogBaseComponent as ɵz };
 //# sourceMappingURL=colijnit-transaction.js.map