@colijnit/transaction 261.20.50 → 261.20.52

package/projects/transaction/src/lib/component/transaction-internal/transaction-internal.component.ts

@@ -0,0 +1,910 @@
+import {ChangeDetectorRef, Component, ComponentRef, ElementRef, EventEmitter, HostBinding, HostListener, Input, OnDestroy, OnInit, Output, QueryList, ViewChild, ViewChildren, ViewEncapsulation} from '@angular/core';
+import {TransactionTypeCategory} from '../../enum/transaction-type-category.enum';
+import {ContentViewMode, OverlayService} from '@colijnit/corecomponents_v12';
+import {Icon} from '../../enum/icon.enum';
+import {TransactionCfgName} from '../../enum/transaction-cfg-name.enum';
+import {TransactionLineSidePanelComponent} from '../transaction-line-side-panel/transaction-line-side-panel.component';
+import {CustomerFullObject} from '@colijnit/relationapi/build/model/customer-full-object.bo';
+import {TransactionInfoResponse} from '@colijnit/transactionapi/build/model/transaction-info-response.bo';
+import {TransactionLineInfo} from '@colijnit/transactionapi/build/model/transaction-line-info.bo';
+import {StatusBarCfgNames} from '../../interface/status-bar-cfg-names.interface';
+import {Subscription} from 'rxjs';
+import {IconCacheService} from '../../service/icon-cache.service';
+import {TransactionService} from '../../service/transaction.service';
+import {TransactionEventService} from '../../service/transaction-event.service';
+import {TransactionScreenConfigurationService} from '../../service/transaction-screen-configuration.service';
+import {TransactionDialogService} from '../../service/transaction-dialog.service';
+import {TransactionBarButton} from '../../model/transaction-bar-button';
+import {TransactionAddTextLineRequest} from '@colijnit/transactionapi/build/model/transaction-add-text-line-request.bo';
+import {OrderLineSetDTO} from '@colijnit/transactionapi/build/model/order-line-set-dto';
+import {OrderLineSetInfo} from '@colijnit/transactionapi/build/model/order-line-set-info.bo';
+import {TransactionAddOrderLineSetTextLineRequest} from '@colijnit/transactionapi/build/model/transaction-add-order-line-set-text-line-request';
+import {TransactionConnectorService} from '../../service/transaction-connector.service';
+import {PurchaseConfirmationService} from '../../service/purchase-confirmation.service';
+import {isNill} from '@colijnit/ioneconnector/build/utils/function/is-nill.function';
+import {PosOrderData} from '../../model/pos-order-data';
+import {TransactionKind} from '@colijnit/transactionapi/build/enum/transaction-kind.enum';
+import {TransactionMarginInfo} from '@colijnit/transactionapi/build/model/transaction-margin-info.bo';
+import {DeliveryPlanningService} from '../delivery-planning/service/delivery-planning.service';
+import {PlanOrder} from '@colijnit/transactionapi/build/model/plan-order.bo';
+import {Planning} from '@colijnit/transactionapi/build/model/planning.bo';
+import {TransactionBaseService} from '../../service/transaction-base.service';
+import {TransactionHeaderService} from '../core/base/service/transaction-header.service';
+import {LineSelectionService} from '../../service/line-selection.service';
+import {TransactionLineCopyRequest} from '@colijnit/transactionapi/build/model/transaction-line-copy-request.bo';
+import {TransactionSalesReservationService} from '../transaction-reservation/service/transaction-sales-reservation.service';
+import {SalesPerson} from '@colijnit/relationapi/build/model/sales-person.bo';
+import {TransactionSalesPersonInputComponent} from '../transaction-sales-person-input/transaction-sales-person-input.component';
+import {Form} from '@colijnit/mainapi/build/model/form.bo';
+import {TableName} from '@colijnit/mainapi/build/enum/table-name.enum';
+import {FormResponse} from '@colijnit/mainapi/build/model/form-response.bo';
+import {DeliveryPlanningOverviewPopupComponent} from '../delivery-planning-main/component/delivery-planning-overview/component/delivery-planning-overview-popup/delivery-planning-overview-popup.component';
+import {FormBuilderUserFormComponent} from '@colijnit/sharedcomponents';
+import {Relation} from '@colijnit/relationapi/build/model/relation.bo';
+import {Container} from "@colijnit/mainapi/build/model/container.bo";
+
+@Component({
+    selector: 'co-transaction-internal',
+    template: `
+      @if (loaded && customerPortal) {
+        @if (transaction.transactionInfo.transactionKind !== 'S' && (transaction.transactionInfo.transactionKind !== 'O' && activeCategory !== category.SalesOrderQuotationActivities)) {
+          <div class="transaction-lines-wrapper"
+            >
+            <co-transaction-header-customer-portal [showPreferredPlanning]="showPreferredPlanning" [transaction]="transaction"></co-transaction-header-customer-portal>
+            <co-transaction-lines
+              [activeCategory]="activeCategory"
+              [customerPortal]="customerPortal">
+            </co-transaction-lines>
+          </div>
+        }
+        @if (transaction && transaction.transactionInfo && transaction.transactionInfo.transactionKind === 'S') {
+          <div class="transaction-lines-wrapper">
+            <co-transaction-service-overview
+              [posOrderData]="posOrderData">
+            </co-transaction-service-overview>
+          </div>
+        }
+          @if (transaction && transaction.transactionInfo && transaction.transactionInfo.transactionKind === 'O' && activeCategory === category.SalesOrderQuotationActivities ) {
+              <div class="transaction-lines-wrapper">
+                  <co-transaction-line-activities [transactionId]="transaction.transactionInfo.id"></co-transaction-line-activities>
+              </div>
+          }
+      }
+      @if (loaded  && !customerPortal) {
+        <co-click-block></co-click-block>
+        @if (showHeader) {
+          <co-transaction-header [transaction]="transaction"></co-transaction-header>
+        }
+        <div class="transaction-lines-header">
+          @if (!service.invalidTransaction) {
+            @if (showQuickAccess) {
+              <co-transaction-quick-access class="transaction-lines-header-item"
+                [transactionKind]="transaction.transactionInfo.transactionKind"
+                [activeCategory]="activeCategory"
+                [planningLines]="transactionPlanning"
+                >
+              </co-transaction-quick-access>
+            }
+            @if (showButtonBar) {
+              <co-transaction-button-bar
+                class="transaction-lines-header-item"
+                [selectedCategory]="activeCategory"
+                (buttonClicked)="handleButtonBarButtonClicked($event)">
+              </co-transaction-button-bar>
+            }
+            <div class="transaction-lines-header-item right">
+              <co-transaction-header-handled-by
+                [transaction]="transaction"
+                [screenConfigurationObject]="cfgNames.HeaderHandledBy"
+                (click)="handleShowSalesPersonInput($event)"
+                #salesPersonAvatar
+                >
+              </co-transaction-header-handled-by>
+              <co-avatar
+                class="transaction-sales-avatar"
+                [relationId]="transaction.transactionInfo.branch?.relationId"
+                [screenConfigurationObject]="cfgNames.HeaderBranch"
+                [screenConfigNativeElement]="true"
+                [showBranchNr]="true">
+              </co-avatar>
+              @if (!shouldShowTiles() && showViewModeButtons) {
+                <co-view-mode-buttons
+                  [showViewModes]="[viewModes.List, viewModes.Tiles]"
+                  (viewModeChange)="handleViewModeChange($event)">
+                </co-view-mode-buttons>
+              }
+            </div>
+          }
+        </div>
+        <div class="transaction-lines-content-wrapper">
+          <!--<co-transaction-document-button-bar [transaction]="transaction"></co-transaction-document-button-bar>-->
+          <div class="transaction-lines-content">
+            @if (activeCategory === category.ServiceOrderService && transaction && transaction.transactionInfo && transaction.transactionInfo.transactionKind === 'S') {
+              <div>
+                <co-transaction-service-overview [posOrderData]="posOrderData"></co-transaction-service-overview>
+              </div>
+            }
+            @if (activeCategory === category.SalesOrderActivities || activeCategory === category.SalesOrderQuotationActivities && transaction && transaction.transactionInfo && transaction.transactionInfo.transactionKind === 'O') {
+                <div>
+                    <co-transaction-line-activities [transactionId]="transaction.transactionInfo.id"></co-transaction-line-activities>
+                </div>
+              }
+            @if (activeViewMode === viewModes.Tiles || shouldShowTiles()) {
+              <div class="transaction-tiles-wrapper">
+                <co-transaction-cards
+                  [activeCategory]="activeCategory"
+                  [class.planning-cards]="transactionPlanning">
+                </co-transaction-cards>
+              </div>
+            }
+            @if ((activeViewMode === viewModes.List && !shouldShowTiles()) && activeCategory !== category.ServiceOrderService) {
+              <div class="transaction-lines-wrapper"
+                >
+                <co-transaction-lines
+                  [activeCategory]="activeCategory"
+                  [planningLines]="transactionPlanning"
+                  [class.planning-lines]="transactionPlanning">
+                </co-transaction-lines>
+              </div>
+            }
+            @if (activeCategory !== category.SalesOrderQuotationActivities && activeCategory !== category.SalesOrderActivities) {
+            <div class="transaction-footer-wrapper">
+              <div class="transaction-footer-left">
+                @if (!service.invalidTransaction) {
+                  @if ((activeCategory === categories.SalesOrderCashRegister && !transactionHeaderService.readonly) ||
+                    (activeCategory === categories.SalesOrderOverview  && !(service && service.invoiceCompleted && !service.canChangeSalesOrderWhenFullyInvoiced)) ||
+                    activeCategory === categories.PurchaseOrderOverview ||
+                    activeCategory === categories.SalesOrderQuotation ||
+                    activeCategory === categories.ServiceOrderOverview) {
+                    <co-add-product
+                      >
+                    </co-add-product>
+                  }
+                  @if ((activeCategory === categories.SalesOrderCashRegister && !transactionHeaderService.readonly) ||
+                    activeCategory === categories.SalesOrderOverview ||
+                    activeCategory === categories.PurchaseOrderOverview ||
+                    activeCategory === categories.SalesOrderQuotation ||
+                    activeCategory === categories.ServiceOrderOverview) {
+                    <co-transaction-button
+                      class="custom-width text-rule"
+                      [iconData]="iconCacheService.getIcon(icons.TextSolid)"
+                      (click)="handleTransactionText()">
+                    </co-transaction-button>
+                  }
+                }
+              </div>
+              <div class="transaction-footer-center">
+                @if (activeCategory === categories.SalesOrderMarginInfo) {
+                  <co-transaction-margin></co-transaction-margin>
+                }
+              </div>
+              @if ((activeCategory !== category.ServiceOrderService && activeCategory !== category.SalesOrderPurchase)) {
+                <co-transaction-totals
+                  [showDiscount]="!service.invalidTransaction">
+                </co-transaction-totals>
+              }
+            </div>
+            }
+          </div>
+          @if (transaction && (transaction.transactionInfo.transactionKind === transactionKind.CashDesk && !fullyInvoiced() && !headerReadOnly)) {
+            <co-transaction-lines-side-panel
+              [posOrderData]="posOrderData"
+              [transaction]="transaction">
+            </co-transaction-lines-side-panel>
+          }
+          <!--        <co-transaction-line-side-panel *ngIf="showSidePanel"-->
+          <!--          [transaction]="transaction"-->
+          <!--          [transactionInfo]="transaction.transactionInfo"-->
+          <!--          [transactionLine]="sidePanelTransactionLine"-->
+          <!--          [activeCategory]="activeCategory"-->
+          <!--          (cancelClick)="showSidePanel = false">-->
+        <!--        </co-transaction-line-side-panel>-->
+        @if (showReservationPopup) {
+          <co-transaction-sales-reservation-popup [transactionId]="transaction.transactionInfo.id"></co-transaction-sales-reservation-popup>
+        }
+        <!--Popup voor wijzigen volgorde van tekstregels-->
+        @if (showArticleTextOverview) {
+          <co-transaction-article-text-overview
+            [transactionInfo]="transaction.transactionInfo"
+            [transactionLine]="transactionLine"
+            (closeClick)="closeArticleTextOverview()"
+            (cancelClick)="closeArticleTextOverview()">
+          </co-transaction-article-text-overview>
+        }
+        <!--Popup voor aanmaken en updaten transactietekstregels-->
+        @if (showTransactionText) {
+          <co-transaction-article-text
+            [header]="'ORDER_TEXT_LINE' | localize"
+            [transactionUuid]="transaction.transactionInfo.uuid"
+            [editText]="textToEdit"
+            [orderLineSetDTO]="selectedOrderLineSetDTO"
+            [transactionLine]="transactionLine"
+            (saveClick)="saveTransactionLineText($event)"
+            (closeClick)="closeTransactionText()"
+            (cancelClick)="closeTransactionText()"
+            (saveOrderLineSetClick)="saveOrderLineSet($event)">
+          </co-transaction-article-text>
+        }
+        <!--Popup voor aanmaken en updaten artikeltekstregels-->
+        @if (showArticleText) {
+          <co-transaction-article-text
+            [header]="'PRODUCT_DESCRIPTION_AND_TEXTS' | localize"
+            [transactionUuid]="transaction.transactionInfo.uuid"
+            [showArticleImageDescription]="transactionLine.articleBound"
+            [showImage]="false"
+            [articleLineNr]="transactionLine.lineNr"
+            [articleRef]="transactionLine.articleNumber"
+            [transactionLine]="transactionLine"
+            [editText]="textToEdit"
+            (saveClick)="saveArticleLineText($event)"
+            (closeClick)="closeArticleText()"
+            (cancelClick)="closeArticleText()">
+          </co-transaction-article-text>
+        }
+        @if (showConversionAssistant)  {
+           <co-transaction-line-conversion-assistant
+             [transactionLine]="transactionLine"
+             (saveClick)="updateArticleLineAmount($event)"
+             (closeClick)="closeConversionAssistantDialog()"
+             (cancelClick)="closeConversionAssistantDialog()">
+           </co-transaction-line-conversion-assistant>
+        }
+        @if (showCopyOrderDialog) {
+          <co-transaction-copy-order
+            (closeDialog)="showCopyOrderDialog = false">
+          </co-transaction-copy-order>
+        }
+        @if (showPlanningPopup) {
+          <co-delivery-planning-overview-popup #planningPopup
+          ></co-delivery-planning-overview-popup>
+        }
+        <!-- Pop up voor voorraad-->
+        @if (showArticleStockPopup) {
+          <co-transaction-article-stock-dialog
+            [article]="stockGoodId"
+            (closeClick)="closeArticleStockPopup()">
+          </co-transaction-article-stock-dialog>
+        }
+        @if (form && showUserForm) {
+          <co-form-builder-user-form #formBuilderUserFormComponent [userForm]="formResponse" [form]="form"  [table]="formTable" [key]="this.formKey" [lineUUID]="lineUUID" (cancelForm)="handleCancelUserForm()" (errorMessage)="handleUserFormError($event)" (saveForm)="handleSaveForm($event)"></co-form-builder-user-form>
+        }
+      </div>
+      }
+      `,
+    providers: [
+        TransactionHeaderService,
+        TransactionSalesReservationService
+    ],
+    encapsulation: ViewEncapsulation.None,
+    standalone: false
+})
+export class TransactionInternalComponent implements OnInit, OnDestroy {
+  public readonly categories: typeof TransactionTypeCategory = TransactionTypeCategory;
+  public readonly viewModes: typeof ContentViewMode = ContentViewMode;
+  public readonly icons: typeof Icon = Icon;
+  public readonly cfgNames: typeof TransactionCfgName = TransactionCfgName;
+  public readonly transactionKind: typeof TransactionKind = TransactionKind;
+  public readonly category: typeof TransactionTypeCategory = TransactionTypeCategory;
+  public screenWidth: number;
+
+  @ViewChild('salesPersonAvatar', { read: ElementRef }) set child(content: ElementRef) {
+    if (content) {
+      this._salesPersonAvatarComponentRef = content;
+    }
+  }
+
+
+  private _planningPopupCompRef: DeliveryPlanningOverviewPopupComponent;
+
+
+  @ViewChild('planningPopup')
+  public set planningPopup( component: DeliveryPlanningOverviewPopupComponent ) {
+    this._planningPopupCompRef = component;
+    this._changeDetector.detectChanges();
+  }
+
+  @ViewChild('formBuilderUserFormComponent')
+  public userFormComponent: FormBuilderUserFormComponent;
+
+
+  @ViewChildren(TransactionLineSidePanelComponent)
+  public sidePanelComponents: QueryList<TransactionLineSidePanelComponent>;
+
+  @Input()
+  public set confirmationAnalysisId(value: number) {
+    this._confirmationAnalysisId = value;
+    if (value) {
+      this.service.activeRubric = TransactionTypeCategory.PurchaseOrderOrderConfirmation;
+      this.activeCategory = TransactionTypeCategory.PurchaseOrderOrderConfirmation;
+    }
+    this._purchaseConfirmationService.confirmationAnalysisId = this._confirmationAnalysisId;
+  }
+
+  public get confirmationAnalysisId(): number {
+    return this._confirmationAnalysisId;
+  }
+
+  @Input()
+  public posOrderData: PosOrderData;
+
+  @Input()
+  public set transaction(value: TransactionInfoResponse) {
+    if (value) {
+      this._transaction = value;
+    }
+  }
+
+  public get transaction(): TransactionInfoResponse {
+    return this._transaction;
+  }
+
+  @Input()
+  public showHeader: boolean = true;
+
+  @Input()
+  public showViewModeButtons: boolean = true;
+
+  @Input()
+  public set transactionPlanning(value: boolean) {
+    this._transactionPlanning = value;
+    if (value) {
+      this.activeCategory = TransactionTypeCategory.SalesOrderPlanning;
+    }
+  }
+  public get transactionPlanning(): boolean {
+    return this._transactionPlanning;
+  }
+  private _transactionPlanning: boolean = false;
+
+  @Input()
+  public customerPortal: boolean = false;
+
+  @Input()
+  public resetActiveRubric: boolean = false;
+
+  //This output exists for bundle purposes.
+  @Output()
+  public serviceRequested: EventEmitter<{ transactionNr: number, transactionId: number, lineNr: number }> = new EventEmitter<{ transactionNr: number, transactionId: number, lineNr: number }>();
+
+  @HostBinding('class.show-quick-access')
+  @Input()
+  public showQuickAccess: boolean = true;
+
+  @HostBinding('class.show-button-bar')
+  @Input()
+  public showButtonBar: boolean = true;
+
+  @HostBinding('class.co-transaction-internal')
+  public showClass() {
+    return true;
+  }
+
+  @HostListener('window:resize', ['$event'])
+  onResize(event: any): void {
+    this.screenWidth = event.target.innerWidth;
+  }
+
+  public activeViewMode: ContentViewMode = ContentViewMode.List;
+  public activeCategory: TransactionTypeCategory;
+  public sidePanelTransactionLine: TransactionLineInfo;
+  public transactionLine: TransactionLineInfo;
+  public selectedOrderLineSetDTO: OrderLineSetDTO;
+  public showSidePanel: boolean = false;
+  public shouldShowSidePanel: boolean = false;
+  public showArticleTextOverview: boolean = false;
+  public showReservationPopup: boolean = false;
+  public showTransactionText: boolean = false;
+  public showArticleText: boolean = false;
+  public showConversionAssistant: boolean = false;
+  public showCopyOrderDialog: boolean = false;
+  public showArticleStockPopup: boolean = false;
+  public showPreferredPlanning: boolean = false;
+  public showPlanningPopup: boolean = false;
+  public showUserForm: boolean = false;
+  public stockGoodId: number;
+  public salesPeople: SalesPerson[] = [];
+  public showSalesPersonInput: boolean = false;
+
+  public loaded: boolean = false;
+  public textToEdit: string;
+  public relation: Relation = new CustomerFullObject();
+  public historicTransactionLines: TransactionLineInfo[] | null;
+  public transactionMarginInfo: TransactionMarginInfo = new TransactionMarginInfo();
+  public form: Form;
+  public formResponse: FormResponse;
+  public formKey: string = "";
+  public formTable: TableName = TableName.Transactions;
+  public lineUUID: string = "";
+
+  public lineDraggedOver: number;
+  public headerReadOnly: boolean;
+
+  public statusBarConfigNames: StatusBarCfgNames = {
+    statusBarBT: this.cfgNames.StatusBarBT,
+    statusBarTG: this.cfgNames.StatusBarTG,
+    statusBarPA: this.cfgNames.StatusBarPA,
+    statusBarPV: this.cfgNames.StatusBarPV,
+    statusBarTP: this.cfgNames.StatusBarTP,
+    statusBarGT: this.cfgNames.StatusBarGT,
+    statusBarGP: this.cfgNames.StatusBarGP,
+    statusBarGL: this.cfgNames.StatusBarGL,
+    statusBarGF: this.cfgNames.StatusBarGF,
+    statusBarIB: this.cfgNames.StatusBarIB,
+    statusBarNT: this.cfgNames.StatusBarNT,
+    statusBarBN: this.cfgNames.StatusBarBN,
+    statusBarBG: this.cfgNames.StatusBarBG,
+    statusBarFC: this.cfgNames.StatusBarFC
+  };
+
+  private _subs: Subscription[] = [];
+  private _transaction: TransactionInfoResponse = new TransactionInfoResponse();
+  private _confirmationAnalysisId: number;
+  private _editArticleTextRefLineNr: number;
+  private _salesPersonInputComponentRef: ComponentRef<any>;
+  private _salesPersonAvatarComponentRef: ElementRef;
+  private _containerForFillMode: Container = null;
+
+  constructor(
+    public iconCacheService: IconCacheService,
+    public service: TransactionService,
+    public deliveryPlanningService: DeliveryPlanningService,
+    private _transactionConnectorService: TransactionConnectorService,
+    private _transactionEventService: TransactionEventService,
+    private _screenConfigurationService: TransactionScreenConfigurationService,
+    private _dialogService: TransactionDialogService,
+    private _purchaseConfirmationService: PurchaseConfirmationService,
+    private _transactionBaseService: TransactionBaseService,
+    private _changeDetector: ChangeDetectorRef,
+    public transactionHeaderService: TransactionHeaderService,
+    private _overlayService: OverlayService,
+    private _lineSelection: LineSelectionService //Do not remove this. While it is not directly used it has its own important subscriptions.
+  ) {
+  }
+
+  ngOnInit() {
+    this._subs.push(
+      this.service.transactionUpdated.subscribe((transaction: TransactionInfoResponse) => {
+        if (transaction) {
+          this.shouldShowSidePanel = false;
+          this.transaction = transaction;
+          this.transactionHeaderService.transaction = transaction;
+
+          this._changeDetector.markForCheck();
+          this.updateTransactionLine();
+          // if (transaction?.transactionInfo?.uuid) {
+          //   this.getTransactionMarginInfo(transaction?.transactionInfo?.uuid);
+          // }
+          if (this._containerForFillMode && this.transaction && this.transaction.transactionInfo.transactionKind === TransactionKind.PurchaseOrder) {
+            this._transactionEventService.activeRubricChange.next({category: TransactionTypeCategory.PurchaseOrderTransport});
+          }
+        }
+      }),
+      this.service.relationUpdated.subscribe((relation: Relation) => {
+        if (relation) {
+          this.relation = relation;
+          this.transactionHeaderService.relation = relation;
+          this._changeDetector.detectChanges();
+        }
+      }),
+      this.service.transactionKindSet.subscribe((set: boolean) => {
+        if (set) {
+          this.activeCategory = this.confirmationAnalysisId ? TransactionTypeCategory.PurchaseOrderOrderConfirmation : this.service.activeRubric;
+        }
+      }),
+      this._transactionConnectorService.connectionInitialized.subscribe((initialized: boolean) => {
+        if (initialized) {
+          this.loaded = true;
+          this._transactionConnectorService.getSalesPersons(this.transaction.transactionInfo ? this.transaction.transactionInfo.transactionDate : null).then(r => this.salesPeople = r);
+        }
+      }),
+      this.transactionHeaderService.reservationPopupToggle.subscribe((value: boolean) => {
+        if (value) {
+          this.showReservationPopup = !this.showReservationPopup;
+        } else {
+          this.showReservationPopup = false;
+        }
+      }),
+      this._transactionEventService.activeRubricChange.subscribe((rubric:{ category:TransactionTypeCategory, sidepanel: boolean}) => {
+        this.activeCategory = rubric.category;
+        if( rubric.category === TransactionTypeCategory.SalesOrderPlanning) {
+          this._transactionConnectorService.getPlanOrder(this.transaction.transactionInfo.id).then( (planOrder: PlanOrder) => {
+            this.service.currentPlanOrder = planOrder;
+            this._transactionEventService.newPlanOrderEvent.next();
+          });
+        }
+        this._transactionEventService.toggleSalesQuotationMarginInfo.subscribe( (salesQuotationMarginOverviewToggled: boolean) => {
+         if(salesQuotationMarginOverviewToggled && this.transaction.transactionInfo.transactionKind === TransactionKind.SalesQuotation) {
+           this._transactionEventService.activeRubricChange.next({category: TransactionTypeCategory.SalesOrderMarginInfo})
+         } else {
+           this._transactionEventService.activeRubricChange.next({category: TransactionTypeCategory.SalesOrderQuotation});
+         }
+        })
+
+        if(!!rubric.sidepanel) {
+          this._transactionEventService.openSidePanel.next(this.transaction.transactionLines[0]);
+        }
+      }),
+      this._transactionEventService.transportContainerChosen.subscribe((container: Container) => {
+        this._containerForFillMode = container;
+        if (this._containerForFillMode && this.transaction && this.transaction.transactionInfo.transactionKind === TransactionKind.PurchaseOrder) {
+          this._transactionEventService.activeRubricChange.next({category: TransactionTypeCategory.PurchaseOrderTransport});
+        }
+      }),
+      // this._purchaseConfirmationService.confirmationNeeded.subscribe((needed: boolean) => {
+      //   if (needed) {
+      //     this.shouldShowSidePanel = true;
+      //     this.handleShowSidePanel(this.transaction.transactionLines[0], true);
+      //   }
+      // }),
+      this._transactionEventService.transactionLineDraggedOver.subscribe((lineNr) => {
+        this.lineDraggedOver = lineNr;
+      }),
+      this._transactionEventService.headerReadOnlyChange.subscribe((headerReadOnly) => {
+        if (headerReadOnly !== undefined) {
+          this.headerReadOnly = headerReadOnly;
+        }
+      }),
+      this._transactionEventService.lineUserFormResponseRequest.subscribe(async (formRequest: {formId: number, lineUUID: string, openUserForm: boolean, formResponseId?: number}) => {
+        if(formRequest && formRequest.openUserForm) {
+          let line: TransactionLineInfo = this.transaction.transactionLines.find( line => line.uuid === formRequest.lineUUID);
+          if(line) {
+            if(line.formResponseId || formRequest.formResponseId) {
+              this.formResponse = await this._transactionConnectorService.getFormResponse(line.formResponseId ? line.formResponseId : formRequest.formResponseId);
+            }
+            this.form = await this._transactionConnectorService.getFormById(formRequest.formId);
+            this.lineUUID = formRequest.lineUUID;
+            if (this.form) {
+              this.showUserForm = true;
+              this._changeDetector.detectChanges();
+            }
+          }
+        }
+      }),
+      this.deliveryPlanningService.showPlanningPopup.subscribe( openPlanningPopup => {
+        if(this._planningPopupCompRef) {
+          this._planningPopupCompRef.planOrder = this.deliveryPlanningService.currentPlanningPlanOrder;
+          this._planningPopupCompRef.week = this.deliveryPlanningService.currentPlanningWeek;
+          this._planningPopupCompRef.transportDay = this.deliveryPlanningService.currentPlanningTransportDay;
+          this.showPlanningPopup = true;
+        }
+      }),
+      // this._transactionEventService.openSidePanel.subscribe((line) => this.handleShowSidePanel(line)),
+      this._transactionEventService.openArticleTextOverview.subscribe((line) => this.handleShowArticleTextOverview(line)),
+      this._transactionEventService.addTransactionText.subscribe((line) => this.handleShowTransactionText(line)),
+      this._transactionEventService.addArticleText.subscribe((line) => this.handleShowArticleText(line)),
+      this._transactionEventService.requestConversionAssistant.subscribe((line) => this.handleShowConversionAssistant(line)),
+      this._transactionEventService.editTransactionText.subscribe((line) => this.handleEditTransactionText(line)),
+      this._transactionEventService.editArticleText.subscribe((line) => this.handleEditArticleText(line)),
+      this._transactionEventService.createServiceButtonClicked.subscribe((lineNr) => this.handleCreateServiceRequest(lineNr)),
+      this._transactionEventService.viewStockButtonClick.subscribe((goodId) => this.handleViewStock(goodId)),
+      this._transactionEventService.copyLineButtonClick.subscribe((line) => this.handleCopyTransactionLine(line)),
+      this._transactionEventService.showError.subscribe((e) =>
+        this._dialogService.showError(e.message, e.localize, e.details)),
+      this._transactionEventService.copyOrder.subscribe(() => this.showCopyOrderDialog = true),
+      this._transactionEventService.fillContainerSuccess.subscribe(() => {
+         this.service.commitAndRefreshTransaction();
+      }),
+      this._transactionEventService.removeFromContainerSuccess.subscribe(() => {
+         this.service.commitAndRefreshTransaction();
+      })
+    );
+    this.screenWidth = window.innerWidth;
+
+    if (this.resetActiveRubric) {
+      this._transactionBaseService.setDefaultActiveRubricFromTransactionKind();
+    }
+  }
+
+  public ngOnDestroy(): void {
+    this._subs.forEach(s => s.unsubscribe());
+  }
+
+  public async handleButtonBarButtonClicked(button: TransactionBarButton): Promise<void> {
+    this.activeCategory = button.category;
+  }
+
+  public async checkPreferredPlanning(): Promise<void> {
+    if (this.transaction && this.transaction.transactionInfo.id) {
+      this.showPreferredPlanning = await this._transactionConnectorService.getPAStatusFromTransaction(this.transaction.transactionInfo.id);
+    }
+  }
+
+  public handleTransactionText(): void {
+    this._transactionEventService.addTransactionText.next(this.transactionLine);
+  }
+
+  public handleShowArticleTextOverview(line: TransactionLineInfo): void {
+    if (line) {
+      this.transactionLine = line;
+      this.showArticleTextOverview = true;
+    }
+  }
+
+  public handleShowTransactionText(line: TransactionLineInfo): void {
+    this.transactionLine = undefined;
+    this.textToEdit = undefined;
+    this.selectedOrderLineSetDTO = new OrderLineSetDTO();
+    this.showTransactionTextDialog();
+  }
+
+  public handleShowArticleText(line: TransactionLineInfo): void {
+    if (line) {
+      this.textToEdit = undefined;
+      this.transactionLine = line;
+      this.showArticleTextDialog();
+    }
+  }
+
+  public handleShowConversionAssistant(line: TransactionLineInfo): void {
+    if (line) {
+      this.transactionLine = line;
+      this.showConversionAssistantDialog();
+    }
+  }
+
+  public async saveTransactionLineText(data: { request: TransactionAddTextLineRequest, new: boolean }): Promise<void> {
+    if (!data.new) { //update
+      await this.service.updateTextLine(data.request.transactionUuid, this.transactionLine.uuid, data.request.showOnDocuments, data.request.text);
+    } else {
+      await this.service.addTextLine(
+        data.request.showOnDocuments,
+        data.request.text,
+        0,
+        data.request.articleBound,
+        0,
+        0,
+        0);
+    }
+
+    this._hideTransactionTextDialog();
+  }
+
+  public async saveOrderLineSet(data: { request: OrderLineSetDTO, new: boolean }): Promise<void> {
+    if (!data.new) {
+      await this.service.updateOrderLineSet(data.request);
+      await this.service.updateTextLine(data.request.transactionUuid, this.transactionLine.uuid, data.request.showOnDocuments, data.request.title);
+    } else {
+      const newRequest: TransactionAddOrderLineSetTextLineRequest = new TransactionAddOrderLineSetTextLineRequest();
+      newRequest.orderLineSetText = data.request.text;
+      newRequest.amount = data.request.amount;
+      newRequest.categoryId = data.request.categoryId;
+      newRequest.color = data.request.color;
+      newRequest.transactionUuid = data.request.transactionUuid;
+      newRequest.showOnDocuments = data.request.showOnDocuments;
+      newRequest.text = data.request.title;
+      await this.service.addOrderLineSet(newRequest);
+    }
+    this._hideTransactionTextDialog();
+  }
+
+  public async saveArticleLineText(data: { request: TransactionAddTextLineRequest, new: boolean }): Promise<void> {
+    if (!data.new) { //update
+      await this.service.updateTextLine(data.request.transactionUuid, this.transactionLine.uuid, data.request.showOnDocuments, data.request.text);
+      this._transactionEventService.articleLineTextAddedOrChanged.next(this._editArticleTextRefLineNr);
+    } else {
+      await this.service.addTextLine(
+        data.request.showOnDocuments,
+        data.request.text,
+        0,
+        true,
+        data.request.refArticleLineNr
+      );
+      this._transactionEventService.articleLineTextAddedOrChanged.next(this.transactionLine.lineNr);
+    }
+    this._hideArticleTextDialog();
+  }
+
+  public handleEditTransactionText(line: TransactionLineInfo): void {
+    this.transactionLine = line;
+    this.selectedOrderLineSetDTO = this._getOrderLineSetIfExists(line);
+    if (isNill(this.selectedOrderLineSetDTO)) {
+      this.textToEdit = line.text;
+    }
+    if (line.isText) {
+      this.showTransactionTextDialog();
+    }
+    // if (line.articleBoundConcatenatedText && line.articleBoundConcatenatedText.length > 0) {
+    //   this.showArticleTextOverviewDialog();
+    // }
+  }
+
+  public handleEditArticleText(line: TransactionLineInfo): void {
+    this.textToEdit = line.text;
+    this.transactionLine = line;
+    this._editArticleTextRefLineNr = line.refLineNr;
+    this._hideArticleTextOverviewDialog();
+    this.showArticleTextDialog();
+  }
+
+  public async updateArticleLineAmount(amount: number): Promise<void> {
+    if (this.transaction && this.transaction.transactionInfo && this.transactionLine && this.transactionLine.amount !== amount) {
+      this.closeConversionAssistantDialog();
+      await this.service.checkLockandChangeTransactionLineQuantity(this.transaction.transactionInfo.uuid, this.transactionLine.uuid, amount);
+    }
+  }
+
+  public handleCopyTransactionLine(line: TransactionLineInfo): void {
+    const copyRequest:TransactionLineCopyRequest = new TransactionLineCopyRequest;
+    copyRequest.lineUuid = line.uuid;
+    copyRequest.transactionUuid = this.transaction.transactionInfo.uuid;
+    this.service.copyTransactionLine(copyRequest);
+  }
+
+  public handleCreateServiceRequest(lineNr: number): void {
+    if (lineNr && this.transaction) {
+      this._transactionEventService.requestCreateServiceOrderFromTransactionLine.next({transaction: this.transaction, lineNr: lineNr});
+      //added for bundle purposes so we can pass the value along without the event service. Use the event service in all other cases.
+      this.serviceRequested.emit({transactionNr: this.transaction.transactionInfo.transactionNr, transactionId: this.transaction.transactionInfo.id, lineNr: lineNr});
+    }
+  }
+
+  public handleViewStock(goodId: number): void {
+    this.stockGoodId = goodId;
+    this.showArticleStockPopup = true;
+  }
+
+  public closeArticleStockPopup(): void {
+    this.showArticleStockPopup = false;
+  }
+
+  public closeArticleText(): void {
+    this._hideArticleTextDialog();
+  }
+
+  public closeTransactionText(): void {
+    this._hideTransactionTextDialog();
+  }
+
+  public closeArticleTextOverview(): void {
+    this._hideArticleTextOverviewDialog();
+  }
+
+  public showTransactionTextDialog(): void {
+    this.showTransactionText = true;
+  }
+
+  public showArticleTextDialog(): void {
+    this.showArticleText = true;
+  }
+
+  public showArticleTextOverviewDialog(): void {
+    this.showArticleTextOverview = true;
+  }
+
+  public showConversionAssistantDialog(): void {
+    this.showConversionAssistant = true;
+  }
+
+  public closeConversionAssistantDialog(): void {
+    this.showConversionAssistant = false;
+  }
+
+  public shouldShowTiles(): boolean {
+    // Adjust the width condition as needed
+    return this.screenWidth < 1280; // Show the div if screen width is smaller than 1280px
+  }
+
+  public fullyInvoiced(): boolean {
+    return (this.transaction &&
+      this.transaction.transactionInfo &&
+      this.transaction.transactionInfo.headerInfoStatus &&
+      this.transaction.transactionInfo.headerInfoStatus.hasOwnProperty('isFullyInvoiced') &&
+      this.transaction.transactionInfo.headerInfoStatus.isFullyInvoiced);
+  }
+
+  private _getOrderLineSetIfExists(line: TransactionLineInfo): OrderLineSetDTO {
+    if (!line.orderLineSetCode) {
+      return null;
+    } else {
+      const lineSet: OrderLineSetInfo = this.transaction.transactionInfo.orderLineSets.find(set => set.orderLineSetCode === line.orderLineSetCode);
+      if (!lineSet) {
+        return null;
+      } else {
+        let DTO: OrderLineSetDTO = new OrderLineSetDTO();
+        DTO.orderLineSetCode = lineSet.orderLineSetCode;
+        DTO.orderLineSetId = lineSet.orderLineSetId;
+        DTO.text = lineSet.text;
+        DTO.amount = lineSet.amount;
+        DTO.title = lineSet.title;
+        DTO.color = lineSet.color;
+        DTO.categoryId = lineSet.categoryId;
+        return DTO;
+      }
+    }
+  }
+
+  private _hideArticleTextDialog(): void {
+    this.showArticleText = false;
+  }
+
+  private _hideTransactionTextDialog(): void {
+    this.showTransactionText = false;
+  }
+
+  private _hideArticleTextOverviewDialog(): void {
+    this.showArticleTextOverview = false;
+  }
+
+  private updateTransactionLine(): void {
+    if (this.transactionLine) {
+      this.transactionLine = this.transaction.transactionLines
+        .find((line) => line.lineNr === this.transactionLine.lineNr);
+    }
+    if (this.sidePanelTransactionLine) {
+      this.sidePanelTransactionLine = this.transaction.transactionLines
+        .find((line) => line.lineNr === this.sidePanelTransactionLine.lineNr);
+    }
+    // if (this.shouldShowSidePanel && this.transaction.transactionLines && this.transaction.transactionLines.length > 0) {
+    //   this.handleShowSidePanel(this.transaction.transactionLines[0]);
+    // }
+  }
+
+  // private _prepareHeader(): void {
+  //     if (this._screenConfigurationService.getObjectConfigurationFor(this.cfgNames.RelationInfoHeader).immediatelyHidden() &&
+  //         this._screenConfigurationService.getObjectConfigurationFor(this.cfgNames.OrderInfoHeader).immediatelyHidden() &&
+  //         this._screenConfigurationService.getObjectConfigurationFor(this.cfgNames.PaymentInfoHeader).immediatelyHidden() &&
+  //         this._screenConfigurationService.getObjectConfigurationFor(this.cfgNames.DeliveryInfoHeader).immediatelyHidden()) {
+  //         // nothing to see here
+  //         this.showHeader = false;
+  //     }
+  // }
+
+  public handleViewModeChange(mode: ContentViewMode) {
+    this.activeViewMode = mode;
+  }
+
+  public async handleShowSalesPersonInput(event: MouseEvent): Promise<void> {
+    event.preventDefault();
+    event.stopPropagation();
+    if (this.showSalesPersonInput) {
+      return;
+    }
+    if (this._salesPersonAvatarComponentRef) {
+      this._salesPersonInputComponentRef = this._overlayService.createComponent(TransactionSalesPersonInputComponent,
+        {parentForOverlay: this._salesPersonAvatarComponentRef, collection: this.salesPeople},
+        {salesPersonClicked: (salesPerson: SalesPerson) => this._commitTransactionSalesPerson(salesPerson), close: () => this._handleCloseSalesPersonInput()});
+      this.showSalesPersonInput = true;
+    }
+  }
+
+  public handleCancelUserForm() {
+    this.showUserForm = false;
+    this.formResponse = undefined;
+    this.form = undefined;
+  }
+
+  public async handleUserFormError(error: string) {
+    await this._dialogService.showError(error, true);
+  }
+
+  public async handleSaveForm(formResponse: FormResponse) {
+
+    let response: TransactionInfoResponse = await this._transactionConnectorService.upsertTransactionLineFormResponse(this.transactionHeaderService.transaction.transactionInfo.uuid,this.lineUUID, formResponse);
+    let line: TransactionLineInfo = response.transactionLines.find(line => line.uuid === this.lineUUID);
+    this._transactionEventService.saveFormResponse.next({lineUUID: this.lineUUID, formResponseId: line.formResponseId, final: formResponse.isFinal});
+    this._changeDetector.detectChanges();
+  }
+
+  private _handleCloseSalesPersonInput(): void {
+    this.service.rollback().then(() => {
+      this._overlayService.removeComponent(this._salesPersonInputComponentRef);
+      this.showSalesPersonInput = false;
+    })
+  }
+
+  private async _commitTransactionSalesPerson(relation: SalesPerson): Promise<boolean> {
+    if (this.transaction.transactionInfo.handledBy === relation.relationId) {
+      this._handleCloseSalesPersonInput()
+      return
+    }
+    const oldSalesPerson: number = this.transaction.transactionInfo.handledBy;
+    const success: boolean = await this.service.updateHeaderTransactionHanldedBy(this.transaction.transactionInfo.uuid, relation.relationId, true, true);
+    if (!success) {
+      this.transaction.transactionInfo.handledBy = oldSalesPerson;
+      return success;
+    }
+    this._overlayService.removeComponent(this._salesPersonInputComponentRef);
+    this.showSalesPersonInput = false;
+    return true;
+  }
+}