@colijnit/transaction 12.1.13 → 12.1.16

package/lib/component/{seller-information/seller-information.component.d.ts → avatar/avatar.component.d.ts}

@@ -1,13 +1,15 @@
 import { TransactionService } from "../../service/transaction.service";
 import { RelationListObject } from "@colijnit/transactionapi/build/model/relation-list-object.bo";
-export declare class SellerInformationComponent {
-    private _service;
+import { SharedService } from "../../service/shared.service";
+export declare class AvatarComponent {
+    private _transactionService;
+    private _sharedService;
     set relationId(value: number);
     get relationId(): number;
     relation: RelationListObject;
     showClass(): boolean;
     image: string;
     private _relationId;
-    constructor(_service: TransactionService);
+    constructor(_transactionService: TransactionService, _sharedService: SharedService);
     private _getRelation;
 }

package/lib/component/avatar/avatar.module.d.ts

@@ -0,0 +1,2 @@
+export declare class AvatarModule {
+}

package/lib/component/{seller-information → avatar}/style/_layout.scss

@@ -1,13 +1,13 @@
 @import "../../../style/mixin";
 
-@include export-module('co-seller-information-layout') {
-  .co-seller-information {
+@include export-module('co-avatar-layout') {
+  .co-avatar {
     display: flex;
     align-items: center;
     justify-content: center;
-    font-family: $tp-co-seller-information-font-family;
-    height: $tp-co-seller-information-image-size;
-    width: $tp-co-seller-information-image-size;
+    font-family: $tp-co-avatar-font-family;
+    height: $tp-co-avatar-image-size;
+    width: $tp-co-avatar-image-size;
     border-radius: 50%;
     background: #0084de; // todo make dynamic
     svg {

package/lib/component/avatar/style/_material-definition.scss

@@ -0,0 +1,2 @@
+$tp-co-avatar-font-family: $tp-font-family !default;
+$tp-co-avatar-image-size: 50px !default;

package/lib/component/avatar/style/_theme.scss

@@ -0,0 +1,7 @@
+@import "../../../style/mixin";
+@import "./material-definition";
+
+@include export-module('co-avatar-theme') {
+  .co-avatar {
+  }
+}

package/lib/component/{order-confirmation-grid → avatar}/style/material.scss

@@ -1,4 +1,3 @@
-@import "../../../style/variables";
 @import "./material-definition";
 @import "./layout";
 @import "./theme";

package/lib/component/checkout/checkout-overview-delivery-edit/checkout-overview-delivery-edit.component.d.ts

@@ -30,6 +30,7 @@ export declare class CheckoutOverviewDeliveryEditComponent implements OnInit {
     deliveryMethodFields: TextValueContainer;
     deliveryTypeIdx: number;
     changeLocationPopup: boolean;
+    transactionDefinitive: boolean;
     newAddress: Address;
     preferredDateOptions: TextValueContainer[];
     addressToEdit: Address;
@@ -59,6 +60,7 @@ export declare class CheckoutOverviewDeliveryEditComponent implements OnInit {
     changePreferredDeliveryDate2(preferredDateOption: string): void;
     onMarketingCodeChange(marketingCode: string): void;
     onChangeLocationCancelClick(): void;
+    handleTransactionDefinitive(definitive: boolean): Promise<void>;
     private calculateDeliveryCosts;
     private calculateAssemblyCosts;
 }

package/lib/component/checkout/checkout-overview-delivery-edit/style/material.scss

@@ -1,4 +1,3 @@
-@import "../../../../style/variables";
 @import "./material-definition";
 @import "./layout";
 @import "./theme";

package/lib/component/checkout/checkout-overview-relation-edit/style/material.scss

@@ -1,4 +1,3 @@
-@import "../../../../style/variables";
 @import "./material-definition";
 @import "./layout";
 @import "./theme";

package/lib/component/checkout/checkout-relation-suggestions-list/style/material.scss

@@ -1,4 +1,3 @@
-@import "../../../../style/variables";
 @import "./material-definition";
 @import "./layout";
 @import "./theme";

package/lib/component/checkout/checkout-relation-suggestions-list-item/style/material.scss

@@ -1,4 +1,3 @@
-@import "../../../../style/variables";
 @import "./material-definition";
 @import "./layout";
 @import "./theme";

package/lib/component/checkout/style/material.scss

@@ -1,4 +1,3 @@
-@import "../../../style/variables";
 @import "./material-definition";
 @import "./layout";
 @import "./theme";
@@ -6,5 +5,5 @@
 @import "../checkout-overview-delivery-edit/style/material";
 @import "../../relation-address/style/material";
 @import "../../stepper/style/material";
-@import "../../seller-information/style/material";
+@import "../../avatar/style/material";
 @import "../../payment/style/material";

package/lib/component/confirmation-dialog/style/material.scss

@@ -1,4 +1,3 @@
-@import "../../../style/variables";
 @import "./material-definition";
 @import "./layout";
 @import "./theme";

package/lib/component/core/base/components/transaction-header-block/style/_layout.scss

@@ -0,0 +1,53 @@
+@import "../../../../../../style/mixin";
+
+@include export-module('cc-transaction-header-block-layout') {
+  .co-transaction-header-block {
+    font-family: $tp-transaction-header-block-font-family;
+    font-size: $tp-transaction-header-block-font-size;
+    display: flex;
+    flex-direction: column;
+    min-width: $tp-transaction-header-block-width;
+    padding: $tp-transaction-header-block-padding;
+    margin: $tp-transaction-header-block-margin;
+    overflow: hidden;
+    border: $tp-transaction-header-block-border;
+    border-width: $tp-transaction-header-block-border-width;
+    line-height: $tp-transaction-header-block-line-height;
+    border-radius: $tp-transaction-header-block-border-radius;
+    .transaction-header-block-header {
+      font-family: $tp-transaction-header-block-label-font-family;
+      font-size: $tp-transaction-header-block-label-font-size;
+      font-weight: $tp-transaction-header-block-label-font-weight;
+      display: flex;
+      flex-direction: row;
+      align-items: center;
+      margin: $tp-transaction-header-block-header-margin;
+      justify-content: space-between;
+      min-height: $tp-transaction-header-block-header-min-height;
+    }
+    .transaction-header-content {
+      display: flex;
+      column-gap: 10px;
+    }
+    .transaction-header-block-content {
+      display: flex;
+      justify-content: space-between;
+      flex-basis: 1px;
+      column-gap: $tp-transaction-header-block-content-column-gap;
+      .transaction-header-block-content-first {
+        //min-width: 130px;
+      }
+      .transaction-header-block-content-second {
+        //min-width: 130px;
+      }
+      .transaction-header-block-content-third {
+        //min-width: 130px;
+      }
+    }
+    .transaction-header-block-divider {
+      height: 70%;
+      width: 1px;
+      align-self: center;
+    }
+  }
+}

package/lib/component/core/base/components/transaction-header-block/style/_material-definition.scss

@@ -0,0 +1,20 @@
+$tp-transaction-header-block-font-family: $tp-font-family !default;
+$tp-transaction-header-block-font-size: $tp-font-size !default;
+$tp-transaction-header-block-label-font-family: $tp-transaction-header-font-family !default;
+$tp-transaction-header-block-label-font-size: $tp-transaction-header-font-size !default;
+$tp-transaction-header-block-label-font-color: $tp-transaction-header-font-color !default;
+$tp-transaction-header-block-label-font-weight: bold !default;
+$tp-transaction-header-block-header-margin: 0 !default;
+$tp-transaction-header-block-header-min-height: 40px !default;
+
+$tp-transaction-header-block-content-divider-background: $tp-color-border !default;
+$tp-transaction-header-block-content-column-gap: 20px !default;
+
+$tp-transaction-header-block-width: 200px !default;
+$tp-transaction-header-block-margin: 0 !default;
+$tp-transaction-header-block-padding: 4px 20px !default;
+$tp-transaction-header-block-border: 1px solid !default;
+$tp-transaction-header-block-border-radius: 10px !default;
+$tp-transaction-header-block-border-color: $tp-color-border !default;
+$tp-transaction-header-block-border-width: 1px !default;
+$tp-transaction-header-block-line-height: 20px !default;

package/lib/component/core/base/components/transaction-header-block/style/_theme.scss

@@ -0,0 +1,11 @@
+@import "../../../../../../style/mixin";
+
+@include export-module('cc-transaction-header-block-theme') {
+  .co-transaction-header-block {
+    border-color: $tp-transaction-header-block-border-color;
+
+    .transaction-header-block-divider {
+      background: $tp-transaction-header-block-content-divider-background;
+    }
+  }
+}

package/lib/component/core/base/components/transaction-header-block/style/material.scss

@@ -0,0 +1,4 @@
+@import "../../../../../../style/mixin";
+@import "./_material-definition";
+@import "./_layout";
+@import "./_theme";

package/lib/component/core/base/components/transaction-header-block/transaction-header-block.component.d.ts

@@ -0,0 +1,8 @@
+import { TemplateRef } from "@angular/core";
+export declare class TransactionHeaderBlockComponent {
+    headerBlockTemplate: TemplateRef<any>;
+    firstBlockTemplate: TemplateRef<any>;
+    secondBlockTemplate: TemplateRef<any>;
+    thirdBlockTemplate: TemplateRef<any>;
+    showClass(): boolean;
+}

package/lib/component/core/base/components/transaction-header-block/transaction-header-block.module.d.ts

@@ -0,0 +1,2 @@
+export declare class TransactionHeaderBlockModule {
+}

package/lib/component/core/base/style/material.scss

@@ -1,4 +1,3 @@
-@import "../../../../style/variables";
 @import "./material-definition";
 @import "./layout";
 @import "./theme";

package/lib/component/core/base/transaction-grid-base.component.d.ts

@@ -0,0 +1,25 @@
+import { EventEmitter, QueryList } from "@angular/core";
+import { TransactionLineInfo } from "@colijnit/transactionapi/build/model/transaction-line-info.bo";
+import { Icon } from "../../../enum/icon.enum";
+import { ColumnAlign, SimpleGridColumnDirective } from "@colijnit/corecomponents_v12";
+import { TransactionImageService } from "../../../service/transaction-image.service";
+export declare abstract class TransactionGridBaseComponent {
+    protected imageService: TransactionImageService;
+    readonly icons: typeof Icon;
+    readonly align: typeof ColumnAlign;
+    set content(columnComponents: QueryList<SimpleGridColumnDirective>);
+    transactionId: number;
+    set transactionLines(value: TransactionLineInfo[]);
+    get transactionLines(): TransactionLineInfo[];
+    sidePanelClicked: EventEmitter<TransactionLineInfo>;
+    rowVisible: EventEmitter<any>;
+    extraColumns: SimpleGridColumnDirective[];
+    private _transactionLines;
+    constructor(imageService: TransactionImageService);
+    handleDrop(data: {
+        from: number;
+        to: number;
+    }): void;
+    openSidePanel(line: TransactionLineInfo): void;
+    private _getImages;
+}

package/lib/component/core/characteristic-answer/characteristic-answer.component.scss

@@ -1,4 +1,3 @@
-@import "../../../style/variables";
 /*
 @import "src/style/styles";
 

package/lib/component/core/icon/icon.component.scss

@@ -1,4 +1,3 @@
-@import "../../../style/variables";
 /*
 @import "src/style/styles";
 

package/lib/component/core/image-display/style/material.scss

@@ -1,4 +1,3 @@
-@import "../../../../style/variables";
 @import "./material-definition";
 @import "./layout";
 @import "./theme";

package/lib/component/core/relation/customer-groups.component.d.ts

@@ -1,5 +1,5 @@
 import { EventEmitter, OnInit } from "@angular/core";
-import { IOneConnectorAdapterService } from "../../../service/ione-connector-adapter.service";
+import { TransactionConnectorService } from "../../../service/transaction-connector.service";
 import { CustomerGroup } from "@colijnit/transactionapi/build/model/customer-group.bo";
 export declare class CustomerGroupsComponent implements OnInit {
     private _connector;
@@ -8,6 +8,6 @@ export declare class CustomerGroupsComponent implements OnInit {
     modelChange: EventEmitter<CustomerGroup>;
     customerGroups: CustomerGroup[];
     fields: Object;
-    constructor(_connector: IOneConnectorAdapterService);
+    constructor(_connector: TransactionConnectorService);
     ngOnInit(): Promise<void>;
 }

package/lib/component/core/stock-status-indicator/stock-status-indicator.component.scss

@@ -1,4 +1,3 @@
-@import "../../../style/variables";
 /*
 @import "src/style/styles";
 

package/lib/component/delivery-type-tile/style/material.scss

@@ -1,4 +1,3 @@
-@import "../../../style/variables";
 @import "./material-definition";
 @import "./layout";
 @import "./theme";

package/lib/component/order-confirmation-create/style/material.scss

@@ -1,4 +1,3 @@
-@import "../../../style/variables";
 @import "./material-definition";
 @import "./layout";
 @import "./theme";

package/lib/component/payment/payment.component.d.ts

@@ -1,18 +1,35 @@
 import { OnInit } from "@angular/core";
 import { Icon } from "../../enum/icon.enum";
 import { TransactionService } from "../../service/transaction.service";
+import { PaymentService } from "../../service/payment.service";
+import { SharedService } from "../../service/shared.service";
+import { PaymentMethod } from "@colijnit/transactionapi/build/model/payment-method.bo";
+import { PaymentViewmodel } from "../../model/payment.viewmodel";
 export declare class PaymentComponent implements OnInit {
     private _transactionService;
+    private _sharedService;
+    private _paymentService;
     readonly icons: typeof Icon;
+    transactionUuid: string;
     amount: number;
+    currencyCode: number;
     showClass(): boolean;
     paymentMethodIdx: number;
-    paymentMethods: {
-        icon: Icon;
-        description: string;
-    }[];
+    cashRegisterIdx: number;
+    paymentMethods: PaymentViewmodel[];
     cashRegisters: any[];
-    constructor(_transactionService: TransactionService);
+    showCashRegisters: boolean;
+    showKeyPad: boolean;
+    constructor(_transactionService: TransactionService, _sharedService: SharedService, _paymentService: PaymentService);
     ngOnInit(): void;
+    paymentMethodSelected(method: PaymentMethod, index: number): void;
+    handlePayment(): void;
+    handleKeyPadModelChange(model: number): void;
+    /**
+     *
+     * @private
+     */
+    private _prepareCashRegisters;
     private _getCashRegisters;
+    private _getPaymentMethods;
 }

package/lib/component/payment/style/_layout.scss

@@ -33,11 +33,20 @@
       column-gap: 5px;
       flex-wrap: wrap;
     }
+    .payment-to-pay-wrapper {
+      display: grid;
+      grid-template-columns: 50% 50%;
+      grid-template-rows: auto auto;
+      row-gap: 10px;
+      column-gap: 10px;
+    }
     .payment-to-pay {
       display: flex;
       flex-direction: column;
       align-items: flex-start;
       row-gap: $tp-payment-row-gap;
+      grid-column: 1 / 1;
+      grid-row: 1 / 1;
     }
     .payment-amount {
       display: flex;
@@ -47,8 +56,21 @@
       font-family: $tp-payment-amount-font-family;
       font-size: $tp-payment-amount-font-size;
       font-weight: $tp-payment-amount-font-weight;
-      padding: $tp-payment-amount-padding;
       border-radius: 5px;
+      height: 100%;
+      width: 100%;
+    }
+    .payment-to-pay-button {
+      grid-column: 1 / 1;
+      grid-row: 2 / 2;
+      .co-button {
+        justify-content: center;
+        border-radius: 5px;
+      }
+    }
+    .payment-to-pay-keypad {
+      grid-column: 2 / 2;
+      grid-row: 1 / 3;
     }
   }
 }

package/lib/component/payment/style/_material-definition.scss

@@ -10,7 +10,6 @@ $tp-payment-row-gap: 20px !default;
 $tp-payment-amount-font-family: $tp-font-family !default;
 $tp-payment-amount-font-size: 32px !default;
 $tp-payment-amount-font-weight: bold !default;
-$tp-payment-amount-padding: 25px 90px !default;
 $tp-payment-amount-color: rgba(0, 0, 0, 0.5) !default;
 $tp-payment-amount-border: 1px solid !default;
 $tp-payment-amount-border-color: $tp-color-border !default;

package/lib/component/payment/style/_theme.scss

@@ -12,5 +12,29 @@
       border-color: $tp-payment-amount-border-color;
       background-color: $tp-payment-amount-background-color;
     }
+    .payment-to-pay-button {
+      .co-button {
+        background-color: $tp-color-colijn-orange;
+      }
+    }
+    .payment-to-pay-keypad {
+      .key-pad-wrapper {
+        background: transparent;
+        border-color: $tp-payment-amount-border-color;
+      }
+      .key-pad-button {
+        background-color: $tp-payment-amount-background-color;
+        color: $tp-payment-amount-color;
+        font-weight: bold;
+        .co-icon {
+          svg { // for fontawesome icons
+            fill: $tp-payment-amount-color;
+          }
+          & [fill] { // for own icons
+            fill: $tp-payment-amount-color;
+          }
+        }
+      }
+    }
   }
 }

package/lib/component/payment/style/material.scss

@@ -1,4 +1,3 @@
-@import "../../../style/variables";
 @import "./material-definition";
 @import "./layout";
 @import "./theme";

package/lib/component/payment-tile/payment-tile.component.d.ts

@@ -3,6 +3,7 @@ import { Icon } from "../../enum/icon.enum";
 export declare class PaymentTileComponent {
     selected: boolean;
     icon: Icon;
+    image: string;
     description: string;
     selectedChange: EventEmitter<boolean>;
     showClass(): boolean;

package/lib/component/payment-tile/style/_layout.scss

@@ -13,10 +13,11 @@
     }
     .payment-tile-description {
     }
-    .payment-tile-icon {
+    .payment-tile-icon, .payment-tile-image {
       display: block;
       height: 80%;
       width: 50%;
+      object-fit: contain;
     }
   }
 }

package/lib/component/payment-tile/style/material.scss

@@ -1,4 +1,3 @@
-@import "../../../style/variables";
 @import "./material-definition";
 @import "./layout";
 @import "./theme";

package/lib/component/relation-address/relation-address.component.d.ts

@@ -1,7 +1,7 @@
 import { EventEmitter, OnInit } from "@angular/core";
 import { Address } from "@colijnit/transactionapi/build/model/address.bo";
 import { Country } from "@colijnit/transactionapi/build/model/country.bo";
-import { IOneConnectorAdapterService } from "../../service/ione-connector-adapter.service";
+import { TransactionConnectorService } from "../../service/transaction-connector.service";
 import { DictionaryService } from "../../service/dictionary.service";
 import { FormMasterService } from "@colijnit/corecomponents_v12";
 export declare class RelationAddressComponent implements OnInit {
@@ -16,7 +16,7 @@ export declare class RelationAddressComponent implements OnInit {
     showClass(): boolean;
     countries: Country[];
     fields: Object;
-    constructor(_dictionary: DictionaryService, _connector: IOneConnectorAdapterService, _formMasterService: FormMasterService);
+    constructor(_dictionary: DictionaryService, _connector: TransactionConnectorService, _formMasterService: FormMasterService);
     postalCodeCheckErrorMessage: string;
     private _prevPostalCodeForCheck;
     private _prevHouseNoForCheck;

package/lib/component/relation-address/style/material.scss

@@ -1,4 +1,3 @@
-@import "../../../style/variables";
 @import "./material-definition";
 @import "./layout";
 @import "./theme";

package/lib/component/relation-address-select/style/material.scss

@@ -1,4 +1,3 @@
-@import "../../../style/variables";
 @import "./material-definition";
 @import "./layout";
 @import "./theme";

package/lib/component/relation-address-tile/style/material.scss

@@ -1,4 +1,3 @@
-@import "../../../style/variables";
 @import "./material-definition";
 @import "./layout";
 @import "./theme";

package/lib/component/shared/transaction-article-text/style/material.scss

@@ -1,4 +1,3 @@
-@import "../../../../style/variables";
 @import "./material-definition";
 @import "./layout";
 @import "./theme";

package/lib/component/shared/transaction-article-text-overview/style/material.scss

@@ -1,4 +1,3 @@
-@import "../../../../style/variables";
 @import "./material-definition";
 @import "./layout";
 @import "./theme";

package/lib/component/shopping-cart/style/material.scss

@@ -1,4 +1,3 @@
-@import "../../../style/variables";
 @import "./material-definition";
 @import "./layout";
 @import "./theme";

package/lib/component/shopping-cart-OLD/shopping-cart-manager/shopping-cart-manager.component.scss

@@ -1,4 +1,3 @@
-//@import "src/style/variables";
 //@import "src/style/styles";
 
 /*

package/lib/component/shopping-cart-preview/style/material.scss

@@ -1,4 +1,3 @@
-@import "../../../style/variables";
 @import "./material-definition";
 @import "./layout";
 @import "./theme";

package/lib/component/stepper/style/material.scss

@@ -1,4 +1,3 @@
-@import "../../../style/variables";
 @import "./material-definition";
 @import "./layout";
 @import "./theme";

package/lib/component/tile/style/material.scss

@@ -1,4 +1,3 @@
-@import "../../../style/variables";
 @import "./material-definition";
 @import "./layout";
 @import "./theme";

package/lib/component/transaction/style/_layout.scss

@@ -2,17 +2,8 @@
 
 @include export-module('co-transaction-layout') {
   .co-transaction {
-    .transaction-view-mode-buttons {
-      display: flex;
-      flex-direction: row;
-      justify-content: flex-end;
-      align-items: center;
-      .view-button {
-        padding: 0;
-        height: $tp-transaction-view-mode-button-height;
-        border-radius: $tp-transaction-view-mode-button-border-radius;
-      }
-    }
+    display: block;
+    padding: $tp-transaction-padding;
     .transaction-footer-wrapper {
       display: flex;
       flex-direction: row;
@@ -24,8 +15,17 @@
     }
     .transaction-lines-header {
       display: flex;
-      justify-content: space-between;
-      margin: 10px 0 10px 0;
+      justify-content: flex-end;
+      align-items: center;
+      padding: $tp-transaction-transaction-lines-header-padding;
+      .transaction-lines-header-item {
+        flex-basis: 30%;
+      }
+    }
+    &.show-quick-access, &.show-button-bar {
+      .transaction-lines-header {
+        justify-content: space-between;
+      }
     }
   }
 }

package/lib/component/transaction/style/_material-definition.scss

@@ -1,7 +1,3 @@
-$tp-transaction-view-mode-button-height: 30px !default;
-$tp-transaction-view-mode-button-background-color: $tp-color-dark !default;
-$tp-transaction-view-mode-button-selected-background-color: $tp-color-action !default;
-$tp-transaction-view-mode-button-background-color-hover: $tp-color-light !default;
-$tp-transaction-view-mode-button-border-radius: 3px !default;
-
 $tp-transaction-totals-margin: 15px 0 !default;
+$tp-transaction-padding: 25px !default;
+$tp-transaction-transaction-lines-header-padding: 20px 0 !default;

package/lib/component/transaction/style/_theme.scss

@@ -2,23 +2,5 @@
 
 @include export-module('co-transaction-theme') {
   .co-transaction {
-    .transaction-view-mode-buttons {
-      .view-button {
-        [fill] {
-          fill: $tp-transaction-view-mode-button-background-color;
-        }
-        &:hover {
-          [fill] {
-            fill: $tp-transaction-view-mode-button-background-color-hover;
-          }
-        }
-        &.selected {
-          background-color: $tp-transaction-view-mode-button-selected-background-color;
-          [fill] {
-            fill: $tp-transaction-view-mode-button-background-color-hover;
-          }
-        }
-      }
-    }
   }
 }