@colijnit/sharedcomponents 1.0.5 → 1.0.6

package/projects/sharedcomponents/src/lib/components/send-method-dialog/style/_layout.scss

@@ -0,0 +1,186 @@
+@import "../../../style/mixin";
+@import "../../../style/variables";
+
+@include export-module('ione-send-method-dialog-layout') {
+  .ione-send-method-dialog {
+    .send-method-dialog-wrapper {
+      font-family: $sc-font-family;
+    }
+
+    .dialog-content-wrapper {
+      padding: 0 20px 0 20px;
+      min-width: 350px;
+      min-height: 415px;
+      overflow: hidden;
+    }
+
+    .send-options-wrapper {
+      display: flex;
+      justify-content: center;
+    }
+
+    .custom-button-wrapper {
+      width: 45px;
+      height: 45px;
+      background-color: #f5f5fa;
+      padding: 5px;
+      margin: 5px;
+      border-radius: 10px;
+      cursor: pointer;
+
+      co-icon {
+        width: 100%;
+        height: 100%;
+      }
+    }
+
+    .selected-option {
+      background-color: #3e7eff;
+
+      co-icon svg {
+        path {
+          fill: white
+        }
+        rect {
+          fill: white
+        }
+      }
+    }
+
+    .email-option-content {
+      display: flex;
+      flex-direction: column;
+      margin: 10px 0 10px;
+    }
+
+    .emails-container {
+      display: flex;
+      flex-direction: column;
+    }
+
+    .lov-wrapper {
+      margin: 15px 0 10px;
+      border: 1px solid #f6f6f8;
+      border-radius: 10px;
+      padding: 10px;
+    }
+
+    .input-checkbox-wrapper {
+      padding: 5px;
+    }
+
+    .input-number-wrapper {
+      width: 85px;
+      height: 52px;
+      margin: 5px;
+    }
+
+    .print-footer-wrapper {
+      display: flex;
+      justify-content: center;
+    }
+
+    .print-button {
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      width: 120px;
+    }
+
+    .number-picker {
+      height: 52px;
+    }
+
+    .signature-button-wrapper {
+      display: flex;
+      justify-content: center;
+    }
+
+    .signature-button {
+      width: 75px;
+    }
+
+    .standard-printer-wrapper {
+      width: 100%;
+      margin: 15px 0 15px;
+      display: flex;
+      flex-direction: column;
+      justify-content: center;
+    }
+
+    .standard-printer-link {
+      display: flex;
+      align-items: center;
+      cursor: pointer;
+
+      co-icon svg {
+        polygon {
+          fill: #3e7eff
+        }
+      }
+    }
+
+    .arrow-icon {
+      width: 30px;
+      height: 40px;
+    }
+
+    .standard-printer-message {
+      font-family: $sc-font-family;
+      font-weight: bold;
+      color: #3e7eff;
+      font-size: 0.9em;
+    }
+
+    .standard-printer-selections {
+      display: flex;
+      flex-direction: column;
+    }
+
+    .printer-content-container {
+      display: flex;
+      flex-direction: column;
+      align-items: center;
+      padding-top: 20px;
+    }
+
+    .selected-printer-wrapper {
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+    }
+
+    .printer-option-list-item {
+      display: flex;
+      align-items: center;
+    }
+
+    .printer-details {
+      display: flex;
+      flex-direction: column;
+    }
+
+    .printer-name {
+      font-weight: bold;
+    }
+
+    .printer-icon {
+      height: 50px;
+      width: 50px;
+      margin-right: 10px;
+    }
+
+    .select-printer-arrow {
+      width: 25px;
+      height: 25px;
+    }
+
+    .clickable {
+      cursor: pointer;
+    }
+
+    .selection {
+      padding: 10px;
+    }
+  }
+}

package/projects/sharedcomponents/src/lib/components/send-method-dialog/style/_material-definition.scss

@@ -0,0 +1 @@
+$cc-co-input-number-picker-border-color: #757575;

package/projects/sharedcomponents/src/lib/components/send-method-dialog/style/_theme.scss

@@ -0,0 +1,7 @@
+@import "../../../style/mixin";
+
+@include export-module('ione-send-method-dialog-theme') {
+  .ione-send-method-dialog {
+
+  }
+}

package/projects/sharedcomponents/src/lib/components/stock/stock-information/stock-information.component.ts

@@ -0,0 +1,59 @@
+import {Component, Input, OnInit, ViewEncapsulation} from "@angular/core";
+
+@Component({
+  selector: "co-stock-information",
+  template: `
+      <div class="stock-info">
+        <div class="stock-info-row">
+          <div class="stock-info-row-image">
+            <div class="stock-image">
+              <co-image class="stock-image" [source]="article?.imageData"></co-image>
+            </div>
+          </div>
+          <div class="stock-good-info">
+            <div>
+              <span [textContent]="article?.name"></span>
+            </div>
+            <div>
+              <span [textContent]="article?.articleNumber"></span>
+            </div>
+          </div>
+        </div>
+        <div class="stock-status">
+          <label [textContent]="article?.stockStatus"></label>
+        </div>
+        <div class="stock-status">
+          <label [textContent]="'STOCK'"></label>
+          <span></span>
+        </div>
+        <div class="stock-status">
+          <label [textContent]="article?.stockAvailable"></label>
+          <span>totalAmountAvailable</span>
+        </div>
+        <div class="stock-status">
+          <label [textContent]="'ECONOMICAL_STOCK'"></label>
+          <span></span>
+        </div>
+        <div class="stock-status">
+          <label [textContent]="'PHYSICAL_STOCK'"></label>
+          <span></span>
+        </div>
+      </div>
+  `,
+  encapsulation: ViewEncapsulation.None
+})
+export class StockInformationComponent {
+
+  public stockStatus: string = "medium";
+  public image: string;
+  public show: boolean = false;
+  public hideOrShowLocationTab: boolean = false;
+
+  @Input()
+  public article: any;
+
+  constructor(
+  ) {
+  }
+
+}

package/projects/sharedcomponents/src/lib/components/stock/stock-information-grid/stock-information-grid.component.ts

@@ -0,0 +1,278 @@
+import {Component, Output, ViewChild, ViewEncapsulation, EventEmitter} from "@angular/core";
+import {StockService} from "../../../service/stock.service";
+
+@Component({
+  selector: "co-stock-information-grid",
+  template: `
+    <div class="tab-link show" *ngIf="hideOrShowTabs">
+      <span class="tab-link-buttons"
+            *ngFor="let tab of tabs"
+            (click)="handleTabClick(tab)"
+            [textContent]="tab"
+            [class.active]="tab === activeTab"
+      ></span>
+    </div>
+
+    <div class="stock-line">
+      <div [textContent]="activeTabText"></div>
+
+    </div>
+
+    <div class="stock-grid">
+      <co-simple-grid *ngIf="activeTab === tabs[0] && hideOrShowTabs"
+                      [data]="stockInformation"
+      >
+          <co-simple-grid-column [headerText]="'WAREHOUSE'" [field]="'warehouseNumber'"></co-simple-grid-column>
+          <co-simple-grid-column [headerText]="'DESCRIPTION'" [field]="'warehouseDescription'"></co-simple-grid-column>
+          <co-simple-grid-column [headerText]="'STOCK'" [field]="'amountInStock'"></co-simple-grid-column>
+          <co-simple-grid-column [headerText]="'AVAILABLE_STOCK'" [field]="'amountAvailable'"></co-simple-grid-column>
+          <co-simple-grid-column [headerText]="'ECONOMICAL_STOCK'" [field]="'amountLaterAvailable'"></co-simple-grid-column>
+          <co-simple-grid-column [headerText]="'LOCATION'" [field]="'location'">
+            <ng-template let-row="row">
+              <a [textContent]="'bekijken'" (click)="onLocationClick($event)"></a>
+            </ng-template>
+          </co-simple-grid-column>
+      </co-simple-grid>
+
+      <co-simple-grid *ngIf="activeTab === tabs[1]"
+                      [data]="inOrderInformation"
+      >
+        <co-simple-grid-column [headerText]="'IN_ORDER2'" [field]="'inOrder'"></co-simple-grid-column>
+        <co-simple-grid-column [headerText]="'CUSTOMER'" [field]="'customer'"></co-simple-grid-column>
+        <co-simple-grid-column [headerText]="'DATE'" [field]="'orderDate'"></co-simple-grid-column>
+        <co-simple-grid-column [headerText]="'AMOUNT'" [field]="'orderAmount'"></co-simple-grid-column>
+        <co-simple-grid-column [headerText]="'WAREHOUSE'" [field]="'warehouseNumber'"></co-simple-grid-column>
+        <co-simple-grid-column [headerText]="'DESCRIPTION'" [field]="'warehouseDescription'"></co-simple-grid-column>
+        <co-simple-grid-column [headerText]="'STOCK'" [field]="'amountInStock'"></co-simple-grid-column>
+        <co-simple-grid-column [headerText]="'COMMISSION2'" [field]="'commission'"></co-simple-grid-column>
+        <co-simple-grid-column [headerText]="'TRANSFER'" [field]="'transfer'">
+          <ng-template let-row="row">
+
+          </ng-template>
+        </co-simple-grid-column>
+        <co-simple-grid-column [headerText]="'STICKER'" [field]="'sticker'">
+          <ng-template let-row="row">
+
+          </ng-template>
+        </co-simple-grid-column>
+      </co-simple-grid>
+
+      <co-simple-grid *ngIf="activeTab === tabs[2]"
+                      [data]="orderInformation"
+      >
+        <co-simple-grid-column [headerText]="'PURCHASE_ORDER_NR'" [field]="'purchaseOrderNo'"></co-simple-grid-column>
+        <co-simple-grid-column [headerText]="'DATE'" [field]="'orderDate'"></co-simple-grid-column>
+        <co-simple-grid-column [headerText]="'AMOUNT'" [field]="'orderAmount'"></co-simple-grid-column>
+        <co-simple-grid-column [headerText]="'RESERVED'" [field]="'reserved'"></co-simple-grid-column>
+        <co-simple-grid-column [headerText]="'FREE_STOCK'" [field]="'freeStock'"></co-simple-grid-column>
+        <co-simple-grid-column [headerText]="'DELIVERY_DATE1'" [field]="'deliveryDate'"></co-simple-grid-column>
+        <co-simple-grid-column [headerText]="'RESERVE'" [field]="'reservation'"></co-simple-grid-column>
+      </co-simple-grid>
+    </div>
+
+    <div class="stock-grid" *ngIf="hideOrShowLocationTab">
+      <div class="stock-location-group">
+        <div class="stock-location-left-group">
+          <span class="stock-button-back" [textContent]="'BACK_TO_STOCK_LINES'" (click)="handleBackToStockClick()"></span>
+        </div>
+        <div class="stock-location-right-group">
+          <co-input-combo-box [(model)]="dataWareHouseCode"
+                              [fields]="dataWareHouseFields"
+                              [placeholder]="'WAREHOUSE'"
+                              [required]="true"
+          ></co-input-combo-box>
+        </div>
+      </div>
+
+      <co-simple-grid [data]="stockLocationInformation"
+      >
+        <div class="stock-location-group">
+          <div class="stock-location-left-group">
+            <co-button class="stock-lines-button" [textContent]="'BACK_TO_STOCK_LINES'" (click)="handleBackToStockClick()"></co-button>
+          </div>
+        </div>
+        <co-simple-grid-column [headerText]="'WAREHOUSE'" [field]="'location'"></co-simple-grid-column>
+        <co-simple-grid-column [headerText]="'BATCH'" [field]="'batch'"></co-simple-grid-column>
+        <co-simple-grid-column [headerText]="'SERIAL_NO'" [field]="'serialNo'"></co-simple-grid-column>
+        <co-simple-grid-column [headerText]="'STOCK'" [field]="'amountInStock'"></co-simple-grid-column>
+        <co-simple-grid-column [headerText]="'ALLOCATED'" [field]="'allocated'"></co-simple-grid-column>
+        <co-simple-grid-column [headerText]="'AVAILABLE_STOCK'" [field]="'amountAvailable'"></co-simple-grid-column>
+        <co-simple-grid-column [headerText]="'TRANSFER'" [field]="'transfer'">
+          <ng-template let-row="row">
+              <span [textContent]="'Transfer'" (click)="handleStockTransferClick($event)"></span>
+          </ng-template>
+        </co-simple-grid-column>
+        <co-simple-grid-column [headerText]="'STICKER'" [field]="'sticker'">
+          <ng-template let-row="row">
+
+          </ng-template>
+        </co-simple-grid-column>
+      </co-simple-grid>
+    </div>
+
+    <div class="stock-grid" *ngIf="showStockHistory">
+      <co-simple-grid [data]="stockHistoryInformation"
+      >
+        <co-simple-grid-column [headerText]="'WAREHOUSE'" [field]="'location'"></co-simple-grid-column>
+        <co-simple-grid-column [headerText]="'BATCH'" [field]="'batch'"></co-simple-grid-column>
+        <co-simple-grid-column [headerText]="'SERIAL_NO'" [field]="'serialNo'"></co-simple-grid-column>
+        <co-simple-grid-column [headerText]="'STOCK'" [field]="'amountInStock'"></co-simple-grid-column>
+        <co-simple-grid-column [headerText]="'ALLOCATED'" [field]="'allocated'"></co-simple-grid-column>
+        <co-simple-grid-column [headerText]="'AVAILABLE_STOCK'" [field]="'amountAvailable'"></co-simple-grid-column>
+        <co-simple-grid-column [headerText]="'STICKER'" [field]="'sticker'">
+          <ng-template let-row="row">
+
+          </ng-template>
+        </co-simple-grid-column>
+      </co-simple-grid>
+    </div>
+
+    <div class="stock-button-toolbar">
+      <div class="stock-button-left-group">
+        <co-button [label]="'HISTORY'" (click)="handleHistoryClick()"></co-button>
+      </div>
+      <div class="stock-button-middle-group">
+        <div class="button-left">
+          <co-button [textContent]="'Ok'" (click)="onOkClick()"></co-button>
+        </div>
+        <div class="button-right">
+          <co-button [textContent]="'Annuleren'" (click)="onCancelClick()"></co-button>
+        </div>
+      </div>
+    </div>
+  `,
+  encapsulation: ViewEncapsulation.None
+})
+export class StockInformationGridComponent {
+
+  @ViewChild(StockInformationGridComponent)
+  public stock: StockInformationGridComponent;
+
+  @Output()
+  public readonly locationLineClicked: EventEmitter<[]> = new EventEmitter();
+
+  @Output()
+  public readonly transferIconClicked: EventEmitter<[]> = new EventEmitter();
+
+  public readonly MAX_GRID_ROWS: number = 10;
+
+  public stockStatus: string = "medium";
+  public image: string;
+  public show: boolean = false;
+  public hideOrShowLocationTab: boolean = false;
+  public showStockHistory: boolean = false;
+
+  public data: any[] = [
+    {test: "test"}
+  ];
+
+  public stockInformation: Object[] = [
+    {warehouseNumber: "1", warehouseDescription: "Colijn IT Warehouse", amountInStock: "17", amountAvailable: "13", amountLaterAvailable: "4", location: "test"},
+    {warehouseNumber: "2", warehouseDescription: "Colijn IT Warehouse", amountInStock: "17", amountAvailable: "13", amountLaterAvailable: "4", location: "Test nummer 2"},
+    {warehouseNumber: "3", warehouseDescription: "Colijn IT Warehouse", amountInStock: "17", amountAvailable: "13", amountLaterAvailable: "4", location: "Amundsenweg"},
+  ];
+  public stockLocationInformation: Object[] = [
+    {location: "title 1", batch: "1", serialNo: "1", amountInStock: "1", allocated: "1", amountAvailable: "1"},
+    {location: "title 2", amountInStock: "2"},
+    {location: "title 3", amountInStock: "3"},
+    {location: "title 4", amountInStock: "4"},
+    {location: "title 5", amountInStock: "5"},
+  ];
+  public inOrderInformation: Object[] = [
+    {inOrder: "275432", customer: "Test customer", orderDate: "date", orderAmount: "2", warehouseNumber: "8", warehouseDescription: "A nice warehouse", amountInStock: "17", commission: "4014321"},
+    {inOrder: "275432", customer: "Test customer", orderDate: "date", orderAmount: "2", warehouseNumber: "8", warehouseDescription: "A nice warehouse", amountInStock: "17", commission: "4014321"},
+    {inOrder: "275432", customer: "Test customer", orderDate: "date", orderAmount: "2", warehouseNumber: "8", warehouseDescription: "A nice warehouse", amountInStock: "17", commission: "4014321"},
+    {inOrder: "275432", customer: "Test customer", orderDate: "date", orderAmount: "2", warehouseNumber: "8", warehouseDescription: "A nice warehouse", amountInStock: "17", commission: "4014321"},
+    {inOrder: "275432", customer: "Test customer", orderDate: "date", orderAmount: "2", warehouseNumber: "8", warehouseDescription: "A nice warehouse", amountInStock: "17", commission: "4014321"},
+  ];
+  public stockHistoryInformation: Object[] = [
+
+  ];
+  public orderInformation: any[] = [];
+
+  public stockColumns: any[] = [];
+  public stockLocationColumns: any[] = [];
+  public inOrderColumns: any[] = [];
+  public orderColumns: any[] = [];
+
+  public hideOrShowTabs: boolean = true;
+
+  public dataWareHouseCode: number = 0;
+  public dataWareHouseFields: Object = { text: "warehouseDescription", value: "warehouseNumber" };
+
+  public tabs: string[] = [
+    "STOCK",
+    "IN_ORDER2",
+    "ORDERS1"
+  ];
+  public activeTab: string = this.tabs[0];
+
+  public get activeTabText(): string {
+    switch (this.activeTab) {
+      case this.tabs[0]:
+        return "Voorraadregels";
+      case this.tabs[1]:
+        return "Gevonden in order(s)";
+      case this.tabs[2]:
+        return "Gevonden in bestellingen";
+      default:
+        return "Voorraadlocatie regels";
+    }
+  }
+
+  constructor(
+    private _stockService: StockService
+  ) {
+  }
+
+  public handleTabClick(tabData): void {
+    this.activeTab = tabData;
+  }
+
+  public onLocationClick(event): void {
+    // this.locationLineClicked.emit(event[0].location);
+    this.hideOrShowTabs = false;
+    this.hideOrShowLocationTab = true;
+  }
+
+  public onRowClick(args: any): void {
+  }
+
+  public onPopupClose(): void {
+    this.show = false;
+  }
+
+  public handleHistoryClick(): void {
+    this.showStockHistory = true;
+  }
+
+  public handleCloseClick(): void {
+    this.onPopupClose();
+  }
+
+  public handleStockTransferClick(event): void {
+    this.transferIconClicked.emit(event);
+  }
+
+  public async handleBackToStockClick(): Promise<void> {
+    this.activeTab = this.tabs[0];
+    this.hideOrShowTabs = true;
+    this.hideOrShowLocationTab = false;
+  }
+
+  public handleStickerClick(): void {
+
+  }
+
+  public handleTransferClick(): void {
+
+  }
+
+  public onOkClick(): void {
+
+  }
+
+  public onCancelClick(): void {
+
+  }
+}

package/projects/sharedcomponents/src/lib/components/stock/stock-location/stock-location.component.ts

@@ -0,0 +1,82 @@
+import {Component, EventEmitter,Output, ViewEncapsulation} from "@angular/core";
+
+@Component({
+  selector: "co-stock-location",
+  template: `
+    <div class="stock-location-wrapper">
+      <div class="buttons-wrapper">
+        <div class="stock-button-left-group">
+          <span class="stock-button-back" [textContent]="'BACK_TO_STOCK_LINES'" (click)="backToStockInformation()"></span>
+        </div>
+        <div class="dropdown-wrapper">
+          <co-drop-down-list></co-drop-down-list>
+        </div>
+      </div>
+
+      <div class="stock-grid">
+
+      </div>
+      <div class="button-wrapper">
+        <div class="button-left">
+          <co-button (click)="onOkClick()"></co-button>
+        </div>
+        <div class="button-right">
+          <co-button (click)="onCancelClick()"></co-button>
+        </div>
+      </div>
+    </div>
+
+  `,
+  encapsulation: ViewEncapsulation.None
+})
+export class StockLocationComponent {
+
+  @Output()
+  public backToStockLines: EventEmitter<any> = new EventEmitter();
+
+  public readonly MAX_GRID_ROWS: number = 10;
+
+  public stockLocationColumns: any[] = [];
+
+  public stockLocation: Object[] = [
+    {location: "title 1", batch: "1", serieNo: "1", amountInStock: "1", allocated: "1", amountAvailable: "1"},
+    {location: "title 2", amountInStock: "2"},
+    {location: "title 3", amountInStock: "3"},
+    {location: "title 4", amountInStock: "4"},
+    {location: "title 5", amountInStock: "5"},
+  ];
+
+  constructor(
+  ) {
+    this.stockLocationColumns.push(
+      {field: "location", headerText: "WAREHOUSE", editType: "none"},
+      {field: "batch", headerText: "BATCH"},
+      {field: "serieNo", headerText: "SERIAL_NO"},
+      {field: "amountInStock", headerText: "STOCK", textAlign: "Right", editType: "numericEdit"},
+      {field: "allocated", headerText: "ALLOCATED", textAlign: "Right"},
+      {field: "amountAvailable", headerText: "AVAILABLE_STOCK", textAlign: "Right"},
+      {field: "PhysicalStock", headerText: "PHYSICAL_STOCK", textAlign: "Right"},
+      {field: "Valuta", headerText: "VALUTA", textAlign: "Right"},
+      {field: "PurchasePrice", headerText: "PURSCHASE_PRICE", textAlign: "Right"},
+      {field: "SupplierNo", headerText: "SUPPLIER_NO", textAlign: "Right"},
+      {field: "Transfer", headerText: "TRANSFER"},
+      {field: "sticker", headerText: "STICKER"},
+    );
+  }
+
+  public backToStockInformation(): void {
+    this.backToStockLines.emit();
+  }
+
+  public onStickerClick(event): void {
+    console.log('test');
+  }
+
+  public onOkClick(): void {
+
+  }
+
+  public onCancelClick(): void {
+
+  }
+}

package/{lib/components/stock/stock-transfer/co-drop-down-list-fields.interface.d.ts → projects/sharedcomponents/src/lib/components/stock/stock-transfer/co-drop-down-list-fields.interface.ts}

@@ -1,4 +1,4 @@
 export interface CoDropDownListFields {
-    text: string;
-    value: string;
+  text: string;
+  value: string;
 }