sendung-lib 0.0.6 → 0.0.8

package/fesm2022/sendung-lib.mjs

@@ -6,12 +6,14 @@ import { CollapseModule } from 'ngx-bootstrap/collapse';
 import * as i3 from 'ngx-bootstrap/tabs';
 import { TabsModule } from 'ngx-bootstrap/tabs';
 import { FaIconComponent } from '@fortawesome/angular-fontawesome';
-import { faInfoCircle, faImage, faCaretUp, faCaretDown } from '@fortawesome/free-solid-svg-icons';
+import { faInfoCircle, faImage, faCaretUp, faCaretDown, faBoxOpen, faPallet, faCogs, faWeightHanging, faClock, faPencilAlt } from '@fortawesome/free-solid-svg-icons';
 import * as i1 from 'ngx-bootstrap/modal';
 import { ModalModule } from 'ngx-bootstrap/modal';
 import { NgClass } from '@angular/common';
 import * as i2 from 'ngx-lightbox';
 import { BehaviorSubject } from 'rxjs';
+import * as i1$1 from '@angular/forms';
+import { FormsModule } from '@angular/forms';
 
 class SendungLibService {
     constructor() { }
@@ -326,7 +328,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
 class FormService {
     constructor() {
         this.submittedForm = new BehaviorSubject(null);
-        this.dienste = new BehaviorSubject('');
+        this.dienste = new BehaviorSubject(null);
         this.dienste$ = this.dienste.asObservable();
         this.allowedDienste = new BehaviorSubject([]);
         this.shipmentInfo = new BehaviorSubject([]);
@@ -1083,32 +1085,289 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
                 type: Input
             }] } });
 
+class AktuelleDatenComponent {
+    constructor(formService) {
+        this.formService = formService;
+        this.faBoxOpen = faBoxOpen;
+        this.faPallet = faPallet;
+        this.faCogs = faCogs;
+        this.faWeightHanging = faWeightHanging;
+        this.dienste = [];
+    }
+    ngOnInit() {
+        if (this.shipmentInfoDetails.dienste !== null) {
+            this.shipmentInfoDetails.dienste.forEach((dienste) => {
+                this.dienste.push(dienste);
+            });
+        }
+        setTimeout(() => {
+            console.log(this.allowedDienste);
+        }, 3000);
+        let filteredAllowed = this.allowedDienste.map((allowedDienst) => {
+            return allowedDienst.bezeichnung;
+        });
+        this.displayDiensteToCorrect = this.dienste.filter((displayDienste) => filteredAllowed.includes(displayDienste.bezeichnung));
+        this.formService.allowedDienste.next(this.displayDiensteToCorrect);
+        this.colli = this.shipmentInfoDetails.colli;
+        this.palette = this.shipmentInfoDetails.paletten;
+        this.gewicht = this.shipmentInfoDetails.gesamtgewicht;
+        this.displayDienste = this.shipmentInfoDetails.dienste;
+    }
+    showDienste(param) {
+        const dienste = [];
+        param.map((dienst) => {
+            if (dienst.anzeigeKuerzel !== null) {
+                dienste.push(dienst.anzeigeKuerzel);
+            }
+        });
+        return dienste.join(', ');
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: AktuelleDatenComponent, deps: [{ token: FormService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: AktuelleDatenComponent, isStandalone: true, selector: "lib-aktuelle-daten", inputs: { shipmentInfoDetails: "shipmentInfoDetails", allowedDienste: "allowedDienste" }, ngImport: i0, template: "<p>Aktuelle Werte</p>\r\n<div class=\"d-flex justify-content-between\">\r\n  <div class=\"p-2\">\r\n    <fa-icon [icon]=\"faBoxOpen\" class=\"iconSize\"></fa-icon>\r\n    {{ colli }}\r\n  </div>\r\n  <div class=\"p-2\">\r\n    <fa-icon [icon]=\"faPallet\" class=\"iconSize\"></fa-icon>\r\n    {{ palette }}\r\n  </div>\r\n  <div class=\"p-2\">\r\n    <fa-icon [icon]=\"faWeightHanging\" class=\"iconSize\"></fa-icon>\r\n    {{ gewicht }} Kg\r\n  </div>\r\n  <div class=\"p-2\">\r\n    <fa-icon [icon]=\"faCogs\" class=\"iconSize icon-stack mr-2\"></fa-icon>\r\n    @if (displayDiensteToCorrect.length !== 0) {\r\n      <span>{{ showDienste(dienste) }}</span>\r\n    } @else {\r\n      <span>{{ showDienste(dienste) }}</span>\r\n    }\r\n  </div>\r\n</div>\r\n", styles: [".iconSize{font-size:22px!important}.icon-stack{position:relative;display:inline-block;height:2em;vertical-align:middle}.icon-stack-1x,.icon-stack-2x,.icon-stack-3x{position:absolute;left:0;width:100%;text-align:right}.icon-stack-1x{line-height:inherit}.icon-stack-2x{font-size:1.5em}.icon-stack-3x{font-size:2em}\n"], dependencies: [{ kind: "component", type: FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "animation", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "classes", "transform", "a11yRole"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: AktuelleDatenComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'lib-aktuelle-daten', standalone: true, imports: [
+                        FaIconComponent
+                    ], template: "<p>Aktuelle Werte</p>\r\n<div class=\"d-flex justify-content-between\">\r\n  <div class=\"p-2\">\r\n    <fa-icon [icon]=\"faBoxOpen\" class=\"iconSize\"></fa-icon>\r\n    {{ colli }}\r\n  </div>\r\n  <div class=\"p-2\">\r\n    <fa-icon [icon]=\"faPallet\" class=\"iconSize\"></fa-icon>\r\n    {{ palette }}\r\n  </div>\r\n  <div class=\"p-2\">\r\n    <fa-icon [icon]=\"faWeightHanging\" class=\"iconSize\"></fa-icon>\r\n    {{ gewicht }} Kg\r\n  </div>\r\n  <div class=\"p-2\">\r\n    <fa-icon [icon]=\"faCogs\" class=\"iconSize icon-stack mr-2\"></fa-icon>\r\n    @if (displayDiensteToCorrect.length !== 0) {\r\n      <span>{{ showDienste(dienste) }}</span>\r\n    } @else {\r\n      <span>{{ showDienste(dienste) }}</span>\r\n    }\r\n  </div>\r\n</div>\r\n", styles: [".iconSize{font-size:22px!important}.icon-stack{position:relative;display:inline-block;height:2em;vertical-align:middle}.icon-stack-1x,.icon-stack-2x,.icon-stack-3x{position:absolute;left:0;width:100%;text-align:right}.icon-stack-1x{line-height:inherit}.icon-stack-2x{font-size:1.5em}.icon-stack-3x{font-size:2em}\n"] }]
+        }], ctorParameters: () => [{ type: FormService }], propDecorators: { shipmentInfoDetails: [{
+                type: Input
+            }], allowedDienste: [{
+                type: Input
+            }] } });
+
+class KorrekturDatenComponent {
+    constructor(fb, cd, formService) {
+        this.fb = fb;
+        this.cd = cd;
+        this.formService = formService;
+        // Icons
+        this.faBoxOpen = faBoxOpen;
+        this.faPallet = faPallet;
+        this.faCogs = faCogs;
+        this.faClock = faClock;
+        this.faWeightHanging = faWeightHanging;
+        this.showTimePicker = true;
+        this.setDeliveryTime = false;
+        this.isColPalValid = true;
+        this.isGewichtValid = true;
+        this.displayError = false;
+        this.colli = 0;
+        this.palette = 0;
+        this.totalColliAndPalette = 0;
+        this.emptyString = '';
+        this.selbstabholer = false;
+        this.keepWeight = '';
+        this.submitCloseModalEvent = new EventEmitter();
+        this.setTime();
+    }
+    setTime() {
+        let now = new Date();
+        let hours = ('0' + now.getHours()).slice(-2);
+        let minutes = ('0' + now.getMinutes()).slice(-2);
+        let str = hours + ':' + minutes;
+        this.timeToDisplay = str;
+    }
+    activateAbholer(event) {
+        this.selbstabholer = event.currentTarget.checked;
+        this.formService.selbstabholer.next(this.selbstabholer);
+    }
+    ngOnInit() {
+        this.totalColliAndPalette = this.shipmentInfoDetails.colli + this.shipmentInfoDetails.paletten;
+        this.keepWeight = this.shipmentInfoDetails.gesamtgewicht;
+        this.keepColli = this.shipmentInfoDetails.colli;
+        this.keepPalette = this.shipmentInfoDetails.paletten;
+        // Wenn der User keine Dienstkorrektur durchführt, dann wird der aktuelle Dienst übernommen
+        this.shipmentInfoDetails.dienste.map((currentDienst) => {
+            if (currentDienst.anzeigeKuerzel !== null) {
+                this.dienste.forEach((allowedDienste) => {
+                    if (allowedDienste.code === currentDienst.code) {
+                        this.selectedDropdownDienst = currentDienst;
+                        this.getDienstData(this.selectedDropdownDienst);
+                    }
+                });
+            }
+        });
+        this.filterSaturdayFromCombobox();
+        this.sortedDienste(this.dienste);
+    }
+    filterSaturdayFromCombobox() {
+        this.dienste.map((dienst, index) => {
+            if (dienst.code === 'SAMSTAG') {
+                this.dienste.splice(index, 1);
+            }
+        });
+    }
+    checkTotalOfColliAndPalette(inputtype, value) {
+        if (value.model === '' && inputtype === 'colli') {
+            this.shipmentInfoDetails.colli = 0;
+        }
+        else if (value.model === '' && inputtype === 'palette') {
+            this.shipmentInfoDetails.paletten = 0;
+        }
+        if (this.isCorrectedValuesNotNull()) {
+            this.colli = +this.shipmentInfoDetails.colli;
+            this.palette = +this.shipmentInfoDetails.paletten;
+            const correctedColliAndPalette = this.colli + this.palette;
+            this.totalColliAndPalette === correctedColliAndPalette ? this.isColPalValid = true : this.isColPalValid = false;
+            this.cd.detectChanges();
+        }
+        else {
+            this.isColPalValid = false;
+            this.cd.detectChanges();
+        }
+    }
+    isCorrectedValuesNotNull() {
+        const colli = this.shipmentInfoDetails.colli;
+        const palette = this.shipmentInfoDetails.paletten;
+        const colliValidate = colli !== null && colli >= 0;
+        const palValidate = palette !== null && palette >= 0;
+        return colliValidate && palValidate;
+    }
+    onSubmit(isCorrectedValue) {
+        if (isCorrectedValue) {
+            this.shipmentInfoDetails.datumUhrzeit = this.formatedDateString(new Date());
+            const requestObject = {
+                colli: this.shipmentInfoDetails.colli,
+                palette: this.shipmentInfoDetails.paletten,
+                gewicht: this.shipmentInfoDetails.gesamtgewicht,
+                dienste: this.selectedDropdownDienst,
+                diensttypid: this.selectedDropdownDienst.id,
+                datumUhrzeit: this.shipmentInfoDetails.datumUhrzeit
+            };
+            this.formService.getSubmittedForm(requestObject);
+        }
+        else {
+            this.shipmentInfoDetails.gesamtgewicht = this.keepWeight;
+            this.shipmentInfoDetails.colli = this.keepColli;
+            this.shipmentInfoDetails.paletten = this.keepPalette;
+        }
+        this.submitCloseModalEvent.emit(isCorrectedValue);
+    }
+    getDienstData(event) {
+        this.selectedDienst = event?.code;
+        this.selectedDienst === 'SONDER' ? this.setDeliveryTime = true : this.setDeliveryTime = false;
+        this.diensttypId = event?.id;
+    }
+    sortedDienste(dienste) {
+        dienste.map((dienst) => {
+            switch (dienst.code) {
+                case 'PLUS8':
+                    dienst.sortId = 1;
+                    break;
+                case 'PLUS9':
+                    dienst.sortId = 2;
+                    break;
+                case 'FRUEH':
+                    dienst.sortId = 3;
+                    break;
+                case 'VORMITTAG':
+                    dienst.sortId = 4;
+                    break;
+                case 'NORMAL':
+                    dienst.sortId = 5;
+                    break;
+                case 'ABEND':
+                    dienst.sortId = 6;
+                    break;
+                case 'SONDER':
+                    dienst.sortId = 7;
+                    break;
+            }
+        });
+        this.dienste.sort((a, b) => a.sortId - b.sortId);
+    }
+    formatedDateString(event) {
+        const month = (event.getMonth() + 1);
+        const parsingDate = event.getDate() <= 9 ? '0' + event.getDate() : event.getDate();
+        const parsingMonth = month <= 9 ? '0' + month : month;
+        const date = parsingDate + '.' + parsingMonth + '.' + event.getFullYear() + ' ' + this.timeToDisplay + ':00';
+        return date;
+    }
+    checkChange(event) {
+        let pointToComma = event.target.value.replace(/(\d),(?=\d)/g, '$1.');
+        let inputAsInt = Number(pointToComma);
+        if (inputAsInt >= 0 && inputAsInt < 25000) {
+            this.displayError = false;
+            this.isGewichtValid = true;
+            this.cd.detectChanges();
+            return this.shipmentInfoDetails.gesamtgewicht = inputAsInt.toString();
+        }
+        else {
+            this.displayError = true;
+            this.isGewichtValid = false;
+            this.cd.detectChanges();
+            return this.shipmentInfoDetails.gesamtgewicht;
+        }
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: KorrekturDatenComponent, deps: [{ token: i1$1.FormBuilder }, { token: i0.ChangeDetectorRef }, { token: FormService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: KorrekturDatenComponent, isStandalone: true, selector: "lib-korrektur-daten", inputs: { shipmentInfoDetails: "shipmentInfoDetails", dienste: "dienste" }, outputs: { submitCloseModalEvent: "submitCloseModalEvent" }, ngImport: i0, template: "<p>Korrigierte Werte</p>\r\n<form class=\"text-left border border-light\" #addresForm=\"ngForm\">\r\n  <div class=\"d-flex justify-content-between\">\r\n\r\n    <fa-icon [icon]=\"faBoxOpen\" class=\"iconSizeBox mr-2\"></fa-icon>\r\n    <input type=\"text\" id=\"colli\" class=\"form-control inputWidth mr-2\" placeholder=\"Anzahl Colli\" name=\"colli\"\r\n           #colli='ngModel'\r\n           [(ngModel)]=\"shipmentInfoDetails.colli\" (change)=\"checkTotalOfColliAndPalette('colli', colli)\">\r\n\r\n    <fa-icon [icon]=\"faPallet\" class=\"iconSize mr-2\"></fa-icon>\r\n    <input type=\"text\" id=\"palette\" class=\"form-control inputWidth mr-2\" placeholder=\"Anzahl Paletten\" name=\"paletten\"\r\n           #paletten='ngModel'\r\n           [(ngModel)]=\"shipmentInfoDetails.paletten\" (change)=\"checkTotalOfColliAndPalette('palette', paletten)\">\r\n  </div>\r\n\r\n  <div class=\"d-flex justify-content-between mt-2\">\r\n    <fa-icon [icon]=\"faWeightHanging\" class=\"iconSize mr-2\"></fa-icon>\r\n    <input type=\"text\" id=\"gewicht\" class=\"form-control inputWidth mr-2\" placeholder=\"Gewicht in Kg\" name=\"gewicht\"\r\n           #gewicht='ngModel'\r\n           (change)=\"checkChange($event)\"\r\n           [ngClass]=\"{'displayErrorBorder': this.displayError === true}\"\r\n           [ngModel]=\"shipmentInfoDetails.gesamtgewicht\">\r\n\r\n    <fa-icon [icon]=\"faCogs\" class=\"iconSize  mr-2\"></fa-icon>\r\n    <select class=\"form-control inputWidth mr-2\" id=\"dienste\" [attr.disabled]=\"selbstabholer? '': null\" name=\"dienstt\"\r\n            #dienstt='ngModel' [(ngModel)]=\"selectedDropdownDienst\" (ngModelChange)=\"getDienstData($event)\">\r\n      <option disabled [value]=\"selectedDropdownDienst\">Dienst ausw\u00E4hlen</option>\r\n      @for (dienst of dienste; track dienst) {\r\n        <option [ngValue]=\"dienst\">{{ dienst.bezeichnung }}</option>\r\n      }\r\n    </select>\r\n  </div>\r\n\r\n  @if (setDeliveryTime) {\r\n    <div class=\"d-flex deliveryTime\">\r\n      <fa-icon [icon]=\"faClock\" class=\"iconSize mr-2\"></fa-icon>\r\n      <input type=\"time\" class=\"form-control\" id=\"datumUhrzeit\" name=\"uhrzeit\" #uhrzeit='ngModel'\r\n             [(ngModel)]=\"timeToDisplay\">\r\n    </div>\r\n  }\r\n\r\n  @if (!selectedDienst) {\r\n    <div>\r\n      <input class=\"selbstabholerCheckbox\" type=\"checkbox\" id=\"Selbstabholer\" name=\"Selbstabholer\"\r\n             (change)=\"activateAbholer($event)\">\r\n      <label for=\"Selbstabholer\">Selbstabholer</label>\r\n    </div>\r\n  }\r\n\r\n  <div class=\"d-flex flex-row-reverse mt-5\">\r\n    <div class=\"p-2\">\r\n      <button class=\"btn btn-block btn-success\" [disabled]=\"!isColPalValid! || !isGewichtValid\"\r\n              (click)=\"onSubmit(true)\">Speichern\r\n      </button>\r\n    </div>\r\n    <div class=\"p-2\">\r\n      <button class=\"btn btn-block btn-danger\" (click)=\"onSubmit(false)\">Abbrechen</button>\r\n    </div>\r\n  </div>\r\n  @if (!isColPalValid || !isGewichtValid) {\r\n    <span class=\"text-danger\">\r\n        <p>Fehler! Bitte \u00FCberpr\u00FCfen Sie Ihre Eingaben. Colli und Paletten Stimmen nicht \u00FCberein oder das eingegebene Gewicht befindet sich nicht zwischen 0 und 25000 kg. </p>\r\n    </span>\r\n  }\r\n</form>\r\n", styles: [".myClass{background-color:red}.iconSize{font-size:22px!important}.iconSizeBox{font-size:19px!important}.icon-stack{position:relative;display:inline-block;height:2em;vertical-align:middle}.icon-stack-1x,.icon-stack-2x,.icon-stack-3x{position:absolute;left:0;width:100%;text-align:right}.icon-stack-1x{line-height:inherit}.icon-stack-2x{font-size:1.5em}.icon-stack-3x{font-size:2em}.selbstabholerCheckbox{margin:.4rem;margin-top:24px}.inputWidth{width:40%}.deliveryTime{width:30%;margin-top:.5rem}.displayErrorBorder{border:lightcoral 1px solid}\n"], dependencies: [{ kind: "component", type: FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "animation", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "classes", "transform", "a11yRole"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$1.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i1$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$1.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i1$1.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: KorrekturDatenComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'lib-korrektur-daten', standalone: true, imports: [
+                        FaIconComponent,
+                        FormsModule,
+                        NgClass
+                    ], template: "<p>Korrigierte Werte</p>\r\n<form class=\"text-left border border-light\" #addresForm=\"ngForm\">\r\n  <div class=\"d-flex justify-content-between\">\r\n\r\n    <fa-icon [icon]=\"faBoxOpen\" class=\"iconSizeBox mr-2\"></fa-icon>\r\n    <input type=\"text\" id=\"colli\" class=\"form-control inputWidth mr-2\" placeholder=\"Anzahl Colli\" name=\"colli\"\r\n           #colli='ngModel'\r\n           [(ngModel)]=\"shipmentInfoDetails.colli\" (change)=\"checkTotalOfColliAndPalette('colli', colli)\">\r\n\r\n    <fa-icon [icon]=\"faPallet\" class=\"iconSize mr-2\"></fa-icon>\r\n    <input type=\"text\" id=\"palette\" class=\"form-control inputWidth mr-2\" placeholder=\"Anzahl Paletten\" name=\"paletten\"\r\n           #paletten='ngModel'\r\n           [(ngModel)]=\"shipmentInfoDetails.paletten\" (change)=\"checkTotalOfColliAndPalette('palette', paletten)\">\r\n  </div>\r\n\r\n  <div class=\"d-flex justify-content-between mt-2\">\r\n    <fa-icon [icon]=\"faWeightHanging\" class=\"iconSize mr-2\"></fa-icon>\r\n    <input type=\"text\" id=\"gewicht\" class=\"form-control inputWidth mr-2\" placeholder=\"Gewicht in Kg\" name=\"gewicht\"\r\n           #gewicht='ngModel'\r\n           (change)=\"checkChange($event)\"\r\n           [ngClass]=\"{'displayErrorBorder': this.displayError === true}\"\r\n           [ngModel]=\"shipmentInfoDetails.gesamtgewicht\">\r\n\r\n    <fa-icon [icon]=\"faCogs\" class=\"iconSize  mr-2\"></fa-icon>\r\n    <select class=\"form-control inputWidth mr-2\" id=\"dienste\" [attr.disabled]=\"selbstabholer? '': null\" name=\"dienstt\"\r\n            #dienstt='ngModel' [(ngModel)]=\"selectedDropdownDienst\" (ngModelChange)=\"getDienstData($event)\">\r\n      <option disabled [value]=\"selectedDropdownDienst\">Dienst ausw\u00E4hlen</option>\r\n      @for (dienst of dienste; track dienst) {\r\n        <option [ngValue]=\"dienst\">{{ dienst.bezeichnung }}</option>\r\n      }\r\n    </select>\r\n  </div>\r\n\r\n  @if (setDeliveryTime) {\r\n    <div class=\"d-flex deliveryTime\">\r\n      <fa-icon [icon]=\"faClock\" class=\"iconSize mr-2\"></fa-icon>\r\n      <input type=\"time\" class=\"form-control\" id=\"datumUhrzeit\" name=\"uhrzeit\" #uhrzeit='ngModel'\r\n             [(ngModel)]=\"timeToDisplay\">\r\n    </div>\r\n  }\r\n\r\n  @if (!selectedDienst) {\r\n    <div>\r\n      <input class=\"selbstabholerCheckbox\" type=\"checkbox\" id=\"Selbstabholer\" name=\"Selbstabholer\"\r\n             (change)=\"activateAbholer($event)\">\r\n      <label for=\"Selbstabholer\">Selbstabholer</label>\r\n    </div>\r\n  }\r\n\r\n  <div class=\"d-flex flex-row-reverse mt-5\">\r\n    <div class=\"p-2\">\r\n      <button class=\"btn btn-block btn-success\" [disabled]=\"!isColPalValid! || !isGewichtValid\"\r\n              (click)=\"onSubmit(true)\">Speichern\r\n      </button>\r\n    </div>\r\n    <div class=\"p-2\">\r\n      <button class=\"btn btn-block btn-danger\" (click)=\"onSubmit(false)\">Abbrechen</button>\r\n    </div>\r\n  </div>\r\n  @if (!isColPalValid || !isGewichtValid) {\r\n    <span class=\"text-danger\">\r\n        <p>Fehler! Bitte \u00FCberpr\u00FCfen Sie Ihre Eingaben. Colli und Paletten Stimmen nicht \u00FCberein oder das eingegebene Gewicht befindet sich nicht zwischen 0 und 25000 kg. </p>\r\n    </span>\r\n  }\r\n</form>\r\n", styles: [".myClass{background-color:red}.iconSize{font-size:22px!important}.iconSizeBox{font-size:19px!important}.icon-stack{position:relative;display:inline-block;height:2em;vertical-align:middle}.icon-stack-1x,.icon-stack-2x,.icon-stack-3x{position:absolute;left:0;width:100%;text-align:right}.icon-stack-1x{line-height:inherit}.icon-stack-2x{font-size:1.5em}.icon-stack-3x{font-size:2em}.selbstabholerCheckbox{margin:.4rem;margin-top:24px}.inputWidth{width:40%}.deliveryTime{width:30%;margin-top:.5rem}.displayErrorBorder{border:lightcoral 1px solid}\n"] }]
+        }], ctorParameters: () => [{ type: i1$1.FormBuilder }, { type: i0.ChangeDetectorRef }, { type: FormService }], propDecorators: { shipmentInfoDetails: [{
+                type: Input
+            }], dienste: [{
+                type: Input
+            }], submitCloseModalEvent: [{
+                type: Output
+            }] } });
+
+class KorrekturButtonCellComponent {
+    constructor(modalService, formService) {
+        this.modalService = modalService;
+        this.formService = formService;
+        this.faPencilAlt = faPencilAlt;
+        console.log('this.formService.dienste$: ', this.formService.dienste$);
+        this.formService.dienste$.subscribe((dienste) => {
+            console.log('DIENSTE: ', dienste);
+            if (dienste) {
+                this.dienste = dienste;
+            }
+        });
+    }
+    agInit(params) {
+        this.params = params;
+        this.gridApi = params.api;
+    }
+    openModal(template) {
+        const config = {
+            backdrop: 'static',
+            keyboard: false,
+            animated: true,
+            ignoreBackdropClick: true,
+        };
+        this.modalRef = this.modalService.show(template, config);
+    }
+    closeModal(event) {
+        this.modalRef.hide();
+    }
+    refresh() {
+        return true;
+    }
+    afterGuiAttached(params) {
+    }
+    close() {
+        this.modalRef.hide();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: KorrekturButtonCellComponent, deps: [{ token: i1.BsModalService }, { token: FormService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: KorrekturButtonCellComponent, isStandalone: true, selector: "lib-korrektur-button-cell", ngImport: i0, template: "<fa-icon (click)=\"openModal(template)\" style=\"cursor: pointer; position: center\" [icon]=\"faPencilAlt\"></fa-icon>\r\n\r\n<ng-template #template>\r\n  <div class=\"modal-header\">\r\n    <h4 class=\"modal-title pull-left\">Sendungskorrektur</h4>\r\n\r\n  </div>\r\n  <div class=\"modal-body text-left\">\r\n    <div class=\"\">\r\n      <lib-aktuelle-daten [shipmentInfoDetails]=\"params.data\" [allowedDienste]=\"dienste\"></lib-aktuelle-daten>\r\n    </div>\r\n    <hr>\r\n    <div class=\"\">\r\n      <lib-korrektur-daten\r\n        (submitCloseModalEvent)=\"closeModal($event)\"\r\n        [shipmentInfoDetails]=\"params.data\"\r\n        [dienste]=\"dienste\">\r\n      </lib-korrektur-daten>\r\n    </div>\r\n  </div>\r\n</ng-template>\r\n", styles: [""], dependencies: [{ kind: "component", type: AktuelleDatenComponent, selector: "lib-aktuelle-daten", inputs: ["shipmentInfoDetails", "allowedDienste"] }, { kind: "component", type: KorrekturDatenComponent, selector: "lib-korrektur-daten", inputs: ["shipmentInfoDetails", "dienste"], outputs: ["submitCloseModalEvent"] }, { kind: "component", type: FaIconComponent, selector: "fa-icon", inputs: ["icon", "title", "animation", "spin", "pulse", "mask", "styles", "flip", "size", "pull", "border", "inverse", "symbol", "rotate", "fixedWidth", "classes", "transform", "a11yRole"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: KorrekturButtonCellComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'lib-korrektur-button-cell', standalone: true, imports: [
+                        AktuelleDatenComponent,
+                        KorrekturDatenComponent,
+                        FaIconComponent
+                    ], template: "<fa-icon (click)=\"openModal(template)\" style=\"cursor: pointer; position: center\" [icon]=\"faPencilAlt\"></fa-icon>\r\n\r\n<ng-template #template>\r\n  <div class=\"modal-header\">\r\n    <h4 class=\"modal-title pull-left\">Sendungskorrektur</h4>\r\n\r\n  </div>\r\n  <div class=\"modal-body text-left\">\r\n    <div class=\"\">\r\n      <lib-aktuelle-daten [shipmentInfoDetails]=\"params.data\" [allowedDienste]=\"dienste\"></lib-aktuelle-daten>\r\n    </div>\r\n    <hr>\r\n    <div class=\"\">\r\n      <lib-korrektur-daten\r\n        (submitCloseModalEvent)=\"closeModal($event)\"\r\n        [shipmentInfoDetails]=\"params.data\"\r\n        [dienste]=\"dienste\">\r\n      </lib-korrektur-daten>\r\n    </div>\r\n  </div>\r\n</ng-template>\r\n" }]
+        }], ctorParameters: () => [{ type: i1.BsModalService }, { type: FormService }] });
+
 class SendungInformationComponent {
-    // @Input() set shipmentInfoDetails(data: Observable<any[]>) {
-    //   let loadingInterval = setInterval(() => {
-    //     if (this.gridApi) {
-    //       if (data) {
-    //         data.subscribe((shipmentInfo: any) => {
-    //           this.gridApi.setGridOption('rowData', shipmentInfo);
-    //           this.formService.shipmentInfo.next(shipmentInfo);
-    //         });
-    //       }
-    //       clearInterval(loadingInterval);
-    //     }
-    //   }, 200);
-    // }
-    // @Input() set dienste(data: Observable<any>) {
-    //   let loadingInterval = setInterval(() => {
-    //     if (this.gridApi) {
-    //       if (data) {
-    //         data.subscribe((dienste) => {
-    //           this.formService.setDienste(dienste);
-    //         });
-    //       }
-    //       clearInterval(loadingInterval);
-    //     }
-    //   }, 200);
-    // }
     constructor(formService) {
         this.formService = formService;
         this.isCollapsed = true;
@@ -1170,14 +1429,15 @@ class SendungInformationComponent {
                 cellStyle: { textAlign: 'center' },
                 cellRenderer: RadioaktivCellComponent
             },
-            // {
-            //   headerName: '',
-            //   cellRendererFramework: KorrekturButtonCellComponentComponent,
-            //   maxWidth: 60
-            // },
+            {
+                headerName: '',
+                cellRenderer: KorrekturButtonCellComponent,
+                maxWidth: 60
+            },
         ];
     }
     ngOnInit() {
+        console.log('TEST NG-OnInit');
         this.formService.submittedForm.subscribe((correctedValueForm => {
             if (correctedValueForm !== null) {
                 this.sendCorrectedValues.emit(correctedValueForm);
@@ -1185,6 +1445,11 @@ class SendungInformationComponent {
                 this.formService.submittedForm.next(null);
             }
         }));
+        this.shipmentInfoDetails.subscribe((shipmentInfo) => {
+            if (shipmentInfo) {
+                console.log('SHIPMENT-INFO: ', shipmentInfo);
+            }
+        });
     }
     gridReady(params) {
         this.gridApi = params.api;
@@ -1213,6 +1478,7 @@ class SendungInformationComponent {
     }
     showDienste(param) {
         const dienste = [];
+        console.log(param.data);
         param.data?.dienste?.map((dienst) => {
             if (dienst.anzeigeKuerzel !== null) {
                 dienste.push(dienst.anzeigeKuerzel);