@colijnit/sharedcomponents 1.0.3 → 1.0.6

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

@@ -0,0 +1,111 @@
+import {Component, EventEmitter, Input, Output, ViewEncapsulation} from "@angular/core";
+import {PrintStockStickers} from "@colijnit/articleapi/build/model/print-stock-stickers";
+import {StockService} from "../../../service/stock.service";
+import {CoDropDownListFields} from "./co-drop-down-list-fields.interface";
+import {Printer} from "@colijnit/sharedapi/build/model/printer.bo";
+
+@Component({
+  selector: "co-stock-transfer",
+  template: `
+      <div class="stock-transfer">
+        <div class="stock-transfer-columns">
+          <div *ngIf="article" class="stock-transfer-left-column">
+            <co-input-text disabled
+                           [(model)]="article.standardWareHouse.description"
+                           [textContent]="article.standardWareHouse.description"
+                           [placeholder]="'Standaard magazijn'">
+            </co-input-text>
+            <co-input-text disabled
+                           [(model)]="article.standardLocation"
+                           [textContent]="article.standardLocation"
+                           [placeholder]="'Standaard locatie'">
+            </co-input-text>
+            <co-input-text disabled
+                           [(model)]="stockSticker.batch"
+                           [placeholder]="'Batch'">
+            </co-input-text>
+            <co-input-text disabled
+                           [(model)]="stockSticker.serial"
+                           [placeholder]="'Serie'">
+            </co-input-text>
+            <co-input-text
+              [(model)]="article.amount"
+              [placeholder]="'Aantal'">
+
+            </co-input-text>
+          </div>
+
+          <div class="stock-transfer-right-column">
+            <co-drop-down-list [collection]="allWarehouses"
+                               [fields]="allWarehousesDropdownFields"
+                               (modelChange)="handleSelectedWarehouse($event)"
+            >
+            </co-drop-down-list>
+            <co-drop-down-list>
+
+            </co-drop-down-list>
+            <co-input-text [placeholder]="'Voorraadstatus'">
+
+            </co-input-text>
+            <co-input-text [placeholder]="'Omschrijving'">
+
+            </co-input-text>
+          </div>
+        </div>
+
+        <div class="ok-cancel-buttons">
+          <co-button [textContent]="'Ok'" (click)="handleOkClick()"></co-button>
+          <co-button [textContent]="'Annuleren'" (click)="handleCancelClick()"></co-button>
+          <co-button [textContent]="'Sticker'" (click)="handleStickerClick()"></co-button>
+        </div>
+      </div>
+  `,
+  encapsulation: ViewEncapsulation.None
+})
+export class StockTransferComponent {
+
+  @Input()
+  public stockSticker: PrintStockStickers;
+
+  @Input()
+  public article: any;
+
+  @Input()
+  public articleWarehouse: any[];
+
+  @Input()
+  public allWarehouses: any[];
+
+  @Output()
+  public handleCancelClicked: EventEmitter<any> = new EventEmitter();
+
+  @Output()
+  public handleStickerClicked: EventEmitter<any> = new EventEmitter();
+
+  public allWarehousesDropdownFields: CoDropDownListFields = {value: "warehouseNo", text: "description"};
+
+  public showSendMethodDialog: boolean = false;
+
+  constructor(
+    private _stockService: StockService
+  ) {
+  }
+
+  public handleOkClick(): void {
+
+  }
+
+  public handleCancelClick(): void {
+    this.handleCancelClicked.emit();
+  }
+
+  public handleSelectedWarehouse(event): void {
+    console.log(event);
+  }
+
+  public async handleStickerClick(): Promise<void> {
+    this.handleStickerClicked.emit();
+    this.showSendMethodDialog = true;
+  }
+
+}

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

@@ -0,0 +1,78 @@
+import {Component, EventEmitter, HostBinding, Input, Output, ViewChild, ViewEncapsulation} from "@angular/core";
+import {StockService} from "../../service/stock.service";
+import {PrintStockStickers} from "@colijnit/articleapi/build/model/print-stock-stickers";
+
+@Component({
+  selector: "co-stock",
+  template: `
+      <div class="stock-info-container">
+        <co-stock-information [article]="articleExtended"></co-stock-information>
+        <hr>
+        <co-stock-information-grid *ngIf="showStockInformationGrid" (transferIconClicked)="handleStockTransferClick($event)"></co-stock-information-grid>
+        <co-stock-location *ngIf="showStockLocation" (backToStockLines)="backToStockLinesClicked()"></co-stock-location>
+        <co-stock-transfer *ngIf="showStockTransfer"
+                           (handleCancelClicked)="backToStock()"
+                           [article]="articleExtended"
+                           [stockSticker]="stockService.stockStickers"
+                           (handleStickerClicked)="handleStickerClicked.emit($event)"
+                           [articleWarehouse]="articleWarehouse"
+                           [allWarehouses]="allWarehouses"
+        >
+        </co-stock-transfer>
+      </div>
+  `,
+  encapsulation: ViewEncapsulation.None
+})
+export class StockComponent {
+
+  @ViewChild(StockComponent)
+  public stock: StockComponent;
+
+  @Output()
+  public handleStickerClicked: EventEmitter<any> = new EventEmitter();
+
+  @Input()
+  public set options(value: any) {
+    this.stockService.connectConnector(value);
+  }
+
+  @Input()
+  public articleExtended: any;
+
+  @Input()
+  public articleWarehouse: any[];
+
+  @Input()
+  public allWarehouses: any[];
+
+  @HostBinding("class.co-stock")
+  public showClass() {
+    return true;
+  }
+
+  public showStockInformationGrid: boolean = true;
+  public showStockLocation: boolean = false;
+  public showStockTransfer: boolean = false;
+
+  constructor(
+    public stockService: StockService
+  ) {
+  }
+
+  public backToStockLinesClicked(): void {
+    this.showStockLocation = false;
+    this.showStockInformationGrid = true;
+  }
+
+  public handleStockTransferClick(event): void {
+    this.showStockTransfer = !this.showStockTransfer;
+    this.showStockInformationGrid = !this.showStockInformationGrid;
+    this.stockService.stockStickers = new PrintStockStickers();
+  }
+
+  public backToStock(): void {
+    this.showStockTransfer = !this.showStockTransfer;
+    this.showStockInformationGrid = !this.showStockInformationGrid;
+  }
+
+}

package/projects/sharedcomponents/src/lib/components/stock/stock.module.ts

@@ -0,0 +1,47 @@
+import {NgModule} from "@angular/core";
+import {StockComponent} from "./stock.component";
+import {
+  ButtonModule,
+  CoGridModule,
+  DropDownModule, ImageModule,
+  InputComboBoxModule,
+  InputRadioButtonModule, InputTextModule, SimpleGridModule
+} from "@colijnit/corecomponents_v12";
+import {CommonModule} from "@angular/common";
+import {StockInformationComponent} from "./stock-information/stock-information.component";
+import {StockInformationGridComponent} from "./stock-information-grid/stock-information-grid.component";
+import {StockLocationComponent} from "./stock-location/stock-location.component";
+import {StockService} from "../../service/stock.service";
+import {IoneConnectorAdapterService} from "../../service/ione-connector-adapter.service";
+import {StockTransferComponent} from "./stock-transfer/stock-transfer.component";
+import {SendMethodDialogModule} from "../send-method-dialog/send-method-dialog.module";
+
+@NgModule({
+    imports: [
+        InputComboBoxModule,
+        CoGridModule,
+        ButtonModule,
+        CommonModule,
+        InputRadioButtonModule,
+        DropDownModule,
+        SimpleGridModule,
+        ImageModule,
+        InputTextModule,
+        SendMethodDialogModule
+    ],
+  declarations: [
+    StockComponent,
+    StockInformationComponent,
+    StockInformationGridComponent,
+    StockLocationComponent,
+    StockTransferComponent
+  ],
+    exports: [
+        StockComponent
+    ],
+    providers: [
+      StockService,
+      IoneConnectorAdapterService
+    ]
+})
+export class StockModule {}

package/projects/sharedcomponents/src/lib/components/stock/style/_layout.scss

@@ -0,0 +1,206 @@
+@import "../../../style/mixin";
+
+@include export-module('co-stock-layout') {
+  .co-stock {
+
+    .stock-info-container {
+      max-width: $sc-stock-info-container-width;
+      padding: $sc-stock-info-container-padding;
+    }
+
+    .stock-info {
+      margin-top: $sc-stock-info-margin;
+      padding: $sc-stock-info-padding;
+      display: inline-flex;
+      width: 90%;
+      justify-content: space-between;
+    }
+
+    .stock-info-row {
+      display: inline-flex;
+    }
+
+    .stock-info-row-image {
+      display: inline-flex;
+      gap: $sc-stock-gap;
+    }
+
+    .stock-image {
+      height: $sc-stock-image-height;
+    }
+
+    .stock-good-info {
+      display: block;
+    }
+
+    .stock-status {
+      display: grid;
+      gap: $sc-stock-gap;
+    }
+
+    .stock-info > div:not(:first-child) {
+      padding: 0 10px;
+      border-left: $sc-stock-border-left;
+    }
+
+    .stock-line {
+      font-weight: $sc-stock-line-font-weight;
+      margin: $sc-stock-line-margin;
+    }
+
+    .simple-grid-column-header-wrapper {
+      font-size: $sc-stock-simple-grid-header-fontsize;
+      display: flex;
+      flex-direction: row;
+      background-color: white;
+      border-bottom: $sc-stock-simple-grid-column-header-wrapper-border-bottom;
+    }
+
+    .simple-grid-column-header {
+      display: flex;
+      flex-direction: row;
+      padding-right: 5px;
+      flex-basis: 100%;
+    }
+
+    .simple-grid-row {
+      font-size: $sc-stock-simple-grid-row-fontsize;
+      display: flex;
+      flex-direction: row;
+      border: $sc-stock-simple-grid-row-border;
+      border-bottom: $sc-stock-simple-grid-row-border-bottom;
+    }
+
+    .simple-grid-column-cell {
+      display: flex;
+      padding: $sc-stock-simple-grid-column-cell-padding;
+      flex-basis: 100%;
+    }
+
+    .stock-lines-button {
+      margin-bottom: 5%;
+    }
+
+    .tab-link {
+      gap: 30px;
+      padding: 20px 20px;
+      &.hide {
+        display: none;
+      }
+
+      &.show {
+        display: flex;
+      }
+      flex-direction: row;
+    }
+
+    .tab-link > div {
+      margin: 25px 0;
+      padding-right: 10px;
+
+      &.inactive {
+        font-weight: normal;
+      }
+    }
+
+    .stock-grid {
+      margin: $sc-stock-grid-margin;
+    }
+
+    .buttons-wrapper {
+      display: flex;
+    }
+
+    .dropdown-wrapper {
+      display: flex;
+      float: right;
+      max-width: 20%;
+    }
+
+    .stock-location-group {
+      margin-bottom: 20px;
+      display: flex;
+    }
+
+    .stock-location-left-group {
+      float: left;
+      display: flex;
+      flex: 1;
+      justify-content: flex-start;
+    }
+
+    .stock-location-right-group {
+      float: right;
+      display: flex;
+      flex: 1;
+      justify-content: flex-end;
+    }
+
+    .stock-button-toolbar {
+      display: flex;
+      justify-content: space-between;
+      margin: 10px;
+    }
+
+    .stock-button-left-group {
+      display: flex;
+      flex: 1;
+      justify-content: flex-start;
+
+      .co-button {
+        margin-right: 10px;
+        width: 100px;
+      }
+    }
+    .stock-button-middle-group {
+      display: flex;
+      flex: 1;
+      margin-top: 10px;
+    }
+
+    .stock-transfer-right-column {
+      display: flex;
+      flex-direction: column;
+      width: 25%;
+      float: right;
+    }
+
+    .stock-transfer-left-column {
+      display: flex;
+      flex-direction: column;
+      width: 25%;
+      float: left;
+    }
+
+    .ok-cancel-buttons {
+      display: flex;
+      width: 100%;
+      justify-content: center;
+      padding: 25px;
+    }
+
+    .stock-transfer-columns {
+      display: flex;
+      width: 100%;
+      justify-content: space-around;
+    }
+
+    .tab-link-buttons {
+      cursor: $sc-stock-tab-link-buttons-pointer;
+    }
+
+    .active {
+      color: $sc-color-action;
+    }
+
+    .stock-button-back {
+      color: $sc-color-action;
+      cursor: pointer;
+    }
+
+    .drop-list-group {
+      height: $sc-stock-grid-height;
+      overflow-y: $sc-stock-grid-overflow-y;
+    }
+  }
+}

package/projects/sharedcomponents/src/lib/components/stock/style/_material-definition.scss

@@ -0,0 +1,20 @@
+$sc-stock-info-margin: 10px !default;
+$sc-stock-info-padding: 0 10px !default;
+$sc-stock-gap: 10px !default;
+$sc-stock-border-left: solid 1px lightgray !default;
+$sc-stock-line-margin: 10px 0 20px 0 !default;
+$sc-stock-line-font-weight: bold !default;
+$sc-stock-simple-grid-header-fontsize: 14px !default;
+$sc-stock-simple-grid-row-fontsize: 12px !default;
+$sc-stock-simple-grid-row-border-bottom: 1px solid black !default;
+$sc-stock-simple-grid-row-border: none !default;
+$sc-stock-simple-grid-column-cell-padding: 10px 5px !default;
+$sc-stock-tab-link-buttons-active-color: $sc-color-action !default;
+$sc-stock-tab-link-buttons-pointer: pointer !default;
+$sc-stock-grid-margin: 50px 0 0 0 !default;
+$sc-stock-simple-grid-column-header-wrapper-border-bottom: 1px solid black !default;
+$sc-stock-info-container-width: 100% !default;
+$sc-stock-info-container-padding: 0px !default;
+$sc-stock-image-height: 50px !default;
+$sc-stock-grid-height: 300px !default;
+$sc-stock-grid-overflow-y: auto !default;

package/{lib/components/stock/stock-transfer → projects/sharedcomponents/src/lib/components/stock}/style/material.scss

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

package/projects/sharedcomponents/src/lib/enum/icon.enum.ts

@@ -0,0 +1,22 @@
+/** AUTO GENERATED FILE. DO NOT CHANGE.. OR YOU WILL SUFFER THE CONSEQUENCES OF YOUR ACTIONS **/
+
+export enum Icon {
+    ArrowFatRight = "arrow_fat_right",
+    ArrowPointDown = "arrow_point_down",
+    ArrowPointLeft = "arrow_point_left",
+    ArrowPointRight = "arrow_point_right",
+    CalendarDay = "calendar_day",
+    Cancel = "cancel",
+    DeliveryTruck = "delivery_truck",
+    EditPencil = "edit_pencil",
+    Email = "email",
+    Pdf = "pdf",
+    PlusRound = "plus_round",
+    Print = "print",
+    SignatureField = "signature_field",
+    Tag = "tag",
+    ThickLines = "thick_lines",
+    ThinLines = "thin_lines",
+    Txt = "txt",
+    Xml = "xml"
+}

package/projects/sharedcomponents/src/lib/factory/business-object-factory.ts

@@ -0,0 +1,120 @@
+import {ComplexFieldDecorator} from "./decorators/complex-field.decorator";
+import {ComplexArrayDecorator} from "./decorators/complex-array.decorator";
+import {BooleanTextDecorator} from "./decorators/boolean.decorator";
+import {DateFieldFieldDecorator} from "./decorators/date-field.decorator";
+import {StringNumberDecorator} from "./decorators/string-number.decorator";
+import {isNill} from "../utils/is-nill.function";
+import {ArrayUtils} from "../utils/array-utils";
+import {BusinessObject} from "../model/business-object";
+
+// Factory service creates businessobjects, using their decorators in the process.
+export class BusinessObjectFactory {
+    constructor() {
+    }
+
+    /**
+     * Creates and returns a new business data object instance of given class, with all given data properties applied to it in a
+     * complex-aware style. That is, all properties on given class that are decorated with @ComplexField(..) or @ComplexArray(..) decorators
+     * become strongly typed business objects, with methods that are usable and such.
+     *
+     * @param modelClass
+     * @param {Object} rawData The object with all (possibly raw/flat/not alive) data to be applied to the created model object
+     */
+    public makeWithRawBackendData(modelClass: any, rawData: Object): BusinessObject {
+        if (!modelClass) {
+            return undefined;
+        }
+        if (typeof modelClass !== typeof BusinessObject) {
+            return undefined;
+        }
+
+        const model: BusinessObject = new modelClass();
+        this._copyAllPropertiesDecoratorProcessedFrom(rawData, model);
+        return model;
+    }
+
+    // see makeWithRawBackendData, this is a loop-wrapper around that method
+    public makeBOArrayFromRawBackendDataArray(modelClass: any, arrayOfRawDatas: Object[]): BusinessObject[] {
+        if (!modelClass) {
+            return undefined;
+        }
+
+        const trueClientBos: BusinessObject[] = [];
+        if (arrayOfRawDatas) {
+            for (let i: number = 0, len: number = arrayOfRawDatas.length; i < len; i++) {
+                trueClientBos.push(this.makeWithRawBackendData(modelClass, arrayOfRawDatas[i]));
+            }
+        }
+        return trueClientBos;
+    }
+
+    public instantiateNewBo(modelClass: any): BusinessObject {
+        return this.makeWithRawBackendData(modelClass, {});
+    }
+
+    /**
+     * Applies all properties of given 'source' object to the given 'destination' businessobject, if destination has that property.
+     * Works with the @ComplexField(), @ComplexArray, @BooleanText, @CoInject and @DateField annotations of given destination model.
+     *
+     * @param sourceData Raw data to copy to destination model
+     * @param {BusinessObject} destinationModel InOut: The annotated businessobject to apply source properties to
+     */
+    private _copyAllPropertiesDecoratorProcessedFrom(sourceData: any, destinationModel: BusinessObject): void {
+        if (!sourceData || !destinationModel) {
+            return;
+        }
+
+        // process all source data into destinationModel
+        for (const srcPropKey in sourceData) {
+            if (!sourceData.hasOwnProperty(srcPropKey)) {
+                continue;
+            }
+
+            const srcPropVal: any = sourceData[srcPropKey];
+
+            if (ComplexFieldDecorator.IsComplexField(destinationModel, srcPropKey)) {
+                const classOfField: any = ComplexFieldDecorator.GetComplexFieldType(destinationModel, srcPropKey);
+                destinationModel[srcPropKey] = this.makeWithRawBackendData(classOfField, srcPropVal);
+            } else if (ComplexArrayDecorator.IsComplexArray(destinationModel, srcPropKey)) {
+                const sourceArray: any[] = srcPropVal;
+                if (!sourceArray) {
+                    continue;
+                }
+                const classOfArrayItems: any = ComplexArrayDecorator.GetComplexArrayType(destinationModel, srcPropKey);
+                const tempArray: any[] = [];
+                for (let i: number = 0, len: number = sourceArray.length; i < len; i++) {
+                    tempArray.push(this.makeWithRawBackendData(classOfArrayItems, sourceArray[i]));
+                }
+                destinationModel[srcPropKey] = tempArray;
+            } else if (BooleanTextDecorator.IsBooleanTextField(destinationModel, srcPropKey)) {
+                // logical 'true' and 'false' also allowed as incoming values for @BooleanText() properties: then just copy their value
+                if (typeof srcPropVal === "boolean") {
+                    destinationModel[srcPropKey] = srcPropVal;
+                    // here, it should be a 'J' or 'N' (or 'T' or 'F'): assign the associated boolean value
+                } else {
+                    destinationModel[srcPropKey] = BooleanTextDecorator.GetLogicalBooleanValue(srcPropVal);
+                }
+            } else if (DateFieldFieldDecorator.IsDateField(destinationModel, srcPropKey)) {
+                destinationModel[srcPropKey] = DateFieldFieldDecorator.StringAsDate(srcPropVal);
+            } else if (StringNumberDecorator.IsStringNumber(destinationModel, srcPropKey)) {
+                destinationModel[srcPropKey] = StringNumberDecorator.StringAsNumber(srcPropVal);
+            }
+            // non-decorated prop
+            else {
+                if (isNill(srcPropVal)) {
+                    destinationModel[srcPropKey] = undefined;
+                } else if (Array.isArray(srcPropVal)) {
+                    destinationModel[srcPropKey] = ArrayUtils.CloneArray(srcPropVal);
+                } else if (typeof srcPropVal === "object") {
+                    if (srcPropVal instanceof Map) { //just copy the value in case of maps
+                        destinationModel[srcPropKey] = srcPropVal;
+                    } else {
+                        destinationModel[srcPropKey] = Object.assign({}, srcPropVal);
+                    }
+                } else {
+                    destinationModel[srcPropKey] = srcPropVal;
+                }
+            }
+        }
+    }
+}