[HIMA-947] finished implementing add product to remission list

This commit is contained in:
Eraldo Hasanaj
2019-12-02 14:48:06 +01:00
parent eb60a2733c
commit b649abeb17
12 changed files with 161 additions and 24 deletions

View File

@@ -22,7 +22,7 @@ import { ReloadGoodsIn } from '../actions/goods-in.actions';
import { ReloadBranchProcess } from '../actions/branch-process.actions';
import { ReloadRemission } from '../actions/remission.actions';
export const SYNC_DATA_VERSION = 109;
export const SYNC_DATA_VERSION = 110;
export class AppStateModel {
currentProcesssId: number;

View File

@@ -1,4 +1,4 @@
<app-modal id="remission-add-product-to-remission-modal">
<app-modal id="remission-add-product-to-remission-modal" branch="true">
<div class="modal-wrapper">
<div class="header">
<lib-icon (click)="closeDialog()" height="21px" class="close-icon" name="close-branch" alt="close"></lib-icon>
@@ -18,9 +18,31 @@
</div>
<div class="group-quantity">
<div class="group">
<span>{{ product.productGroupName }}</span>
<div class="number">
<span>{{ product.productGroup }}</span>
</div>
<div>
<span>:</span>
</div>
<div class="name">
<span>{{ product.productGroupName }}</span>
</div>
</div>
<div class="quantity">
<app-dropdown
boldSelected="true"
(valueChanges)="quantityUpdated($event)"
[options]="quantityRange"
[selected]="quantity"
[showClosingArrow]="true"
[leftAligned]="true"
mode="branch"
boldSelected="true"
boldDdSelectedValue="true"
fitContent="true"
scrollable="true"
></app-dropdown>
</div>
<div class="quantity"></div>
</div>
</div>
@@ -49,8 +71,8 @@
<lib-icon (click)="closeTooltip()" height="11px" name="Delete-white"></lib-icon>
</div>
<div class="feature-tooltip-arrow-down" [style.marginLeft.px]="tooltipArrowMl" *ngIf="toolTipOpened"></div>
<div class="features">
<span *ngFor="let feature of product.features; let index = index" (click)="openTooltip(feature.name, index)">{{
<div class="features item" *ngIf="isArray(product.features)">
<span *ngFor="let feature of product.features; let index = index" (click)="openTooltip(feature.value, index)">{{
feature.key
}}</span>
</div>
@@ -62,14 +84,26 @@
(valueChanges)="reasonUpdated($event)"
[options]="reasons"
[selected]="reason"
[showClosingArrow]="true"
[leftAligned]="true"
mode="branch"
boldSelected="true"
boldDdSelectedValue="true"
></app-dropdown>
</div>
</div>
<div class="data" *ngIf="reasonError">
<div class="reason-error">
{{ reasonErrorMsg }}
</div>
</div>
</div>
</div>
</div>
</div>
<hr class="spacer branch" />
<div class="actions">
<app-button primary="true" (action)="addProdcutToList()">Hinzufügen</app-button>
</div>
</div>
</app-modal>

View File

@@ -1,10 +1,11 @@
@import '../../../../../assets/scss/variables';
.modal-wrapper {
font-family: 'Open Sans';
line-height: 21px;
margin: 16px 0;
display: flex;
flex-direction: column;
height: 383px;
.header {
.close-icon {
@@ -70,12 +71,22 @@
flex-direction: row;
.group {
span {
font-family: 'Open Sans';
font-size: 16px;
color: #596470;
font-size: 16px;
color: #596470;
display: flex;
flex-direction: row;
.name {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
max-width: 100px;
}
}
.quantity {
padding-left: 20px;
}
}
}
@@ -141,6 +152,17 @@
border-top: 10px solid #5a728a;
margin-top: -15px;
}
.reason-error {
font-family: 'Open Sans';
font-weight: bold;
font-size: 16px;
color: $hima-error-msg-color;
}
.dd-width {
width: fit-content;
}
}
}
@@ -155,4 +177,13 @@
}
}
}
.actions {
display: flex;
flex-direction: row;
justify-content: flex-end;
margin-top: 28px;
margin-right: 20px;
padding-bottom: 15px;
}
}

View File

@@ -3,6 +3,8 @@ import { RemissionProduct, RemissionService } from '@isa/remission';
import { ModalService } from '@libs/ui';
import { filter, take } from 'rxjs/operators';
import { isNullOrUndefined } from 'util';
import { NO_RESMISSION_REASON_SELECTED } from '../../constants/remission.constants';
import { RemissionHelperService } from '../../services/remission-helper.service';
@Component({
selector: 'app-add-product-to-remission-dialog',
@@ -20,7 +22,15 @@ export class AddProductToRemissionDialogComponent implements OnInit, OnDestroy {
tooltipArrowMl = 5;
reasons: string[];
reason: string;
constructor(private modalService: ModalService, private remissionService: RemissionService) {}
quantityRange = new Array(100).fill(0).map((_, index) => index + 1);
quantity = 1;
reasonError = false;
reasonErrorMsg = 'Wählen Sie einen Remi-Grund aus';
constructor(
private modalService: ModalService,
private remissionService: RemissionService,
private remissionHelper: RemissionHelperService
) {}
ngOnInit() {
console.log(this.product);
@@ -38,7 +48,7 @@ export class AddProductToRemissionDialogComponent implements OnInit, OnDestroy {
)
.subscribe(reasons => {
this.reasons = reasons;
this.reason = reasons[0];
this.reason = NO_RESMISSION_REASON_SELECTED;
});
}
@@ -73,4 +83,34 @@ export class AddProductToRemissionDialogComponent implements OnInit, OnDestroy {
closeTooltip() {
this.toolTipOpened = false;
}
quantityUpdated(quantity: number) {
this.quantity = quantity;
}
reasonUpdated(reason: string) {
this.reason = reason;
this.reasonError = false;
}
isArray(obj) {
return Array.isArray(obj);
}
addProdcutToList() {
if (this.reason === NO_RESMISSION_REASON_SELECTED) {
this.reasonError = true;
return;
}
this.remissionService
.addProductToRemit({ product: this.product, remissionReason: this.reason, remissionQuantity: this.quantity })
.pipe(take(1))
.subscribe(response => {
console.log('add product to remit response:', response);
this.reasonError = false;
this.remissionHelper.addRemissionListItem(response);
this.closeDialog();
});
}
}

View File

@@ -30,3 +30,5 @@ export const RESOURCE_TYPE_SWITCH = <DoubleChoiceSwitch>{
};
export const SUPPLIER_PLACEHOLDER = '${supplier}';
export const NO_RESMISSION_REASON_SELECTED = 'Auswählen';

View File

@@ -42,7 +42,7 @@
</div>
<div class="actions" *ngIf="listLoaded && remissionListHits > 0">
<div class="start-remission">
<app-button [primary]="true" (action)="openStartRemissionDialog()">Remission starten</app-button>
<app-button [primary]="true" [disabled]="!isIPad" (action)="openStartRemissionDialog()">Remission starten</app-button>
</div>
<div class="add-article">
<app-button *ngIf="!isIPad" (action)="openAddProductToRemission()">Artikel hinzufügen</app-button>

View File

@@ -111,9 +111,13 @@ export class RemissionListStartedComponent implements OnInit, OnDestroy {
.subscribe(hits => {
if (hits === 0) {
this.listLoaded = false;
this.toTopToBottomActions.showTopAction(false);
if (this.toTopToBottomActions) {
this.toTopToBottomActions.showTopAction(false);
}
} else {
this.toTopToBottomActions.showTopAction(true);
if (this.toTopToBottomActions) {
this.toTopToBottomActions.showTopAction(true);
}
this.listLoaded = true;
}
this.remissionListHits = hits;

View File

@@ -35,10 +35,16 @@
[style.top]="top + 'px'"
#container
>
<ul *ngIf="!isKeyValue" [ngClass]="{ scrollable: scrollable === true }">
<ul *ngIf="!isKeyValue" [ngClass]="{ scrollable: scrollable, 'fit-content': fitContent }">
<li
*ngFor="let item of options; let first = first; let last = last"
[ngClass]="{ selected: item === selected, branch: mode === 'branch', first: first, last: last }"
[ngClass]="{
selected: item === selected,
branch: mode === 'branch',
first: first,
last: last,
'selected-bold': boldDdSelectedValue
}"
(click)="onChange(item, $event)"
>
{{ item }}
@@ -48,10 +54,16 @@
</span>
</li>
</ul>
<ul *ngIf="isKeyValue" [ngClass]="{ scrollable: scrollable === true }">
<ul *ngIf="isKeyValue" [ngClass]="{ scrollable: scrollable, 'fit-content': fitContent }">
<li
*ngFor="let item of options; let first = first; let last = last"
[ngClass]="{ selected: item.value === selected, branch: mode === 'branch', first: first, last: last }"
[ngClass]="{
selected: item.value === selected,
branch: mode === 'branch',
first: first,
last: last,
'selected-bold': boldDdSelectedValue
}"
(click)="onChange(item, $event)"
>
{{ item.value }}

View File

@@ -97,6 +97,10 @@
min-width: 160px;
display: inline-block;
&.fit-content {
min-width: fit-content;
}
li {
&.first {
border-top-left-radius: 5px;
@@ -121,6 +125,10 @@
&.selected {
background-color: #dce2e9;
&.selected-bold {
font-weight: bold;
}
&.branch {
background-color: #cfd4d8;
}
@@ -149,6 +157,10 @@
min-width: 70px;
display: inline-block;
&.fit-content {
min-width: fit-content;
}
li {
padding: 7px 15px;
font-weight: 300;

View File

@@ -34,7 +34,9 @@ export class DropdownComponent {
@Input() showClosingArrow = false;
@Input() optionsUnder = false;
@Input() boldSelected = false;
@Input() boldDdSelectedValue = false;
@Input() mode = 'customer';
@Input() fitContent = false;
@Output() valueChanges: EventEmitter<any> = new EventEmitter();
isOpen = false;
absolute = false;

6
package-lock.json generated
View File

@@ -1095,9 +1095,9 @@
}
},
"@isa/remission": {
"version": "0.1.14",
"resolved": "https://pkgs.dev.azure.com/hugendubel/_packaging/hugendubel/npm/registry/@isa/remission/-/remission-0.1.14.tgz",
"integrity": "sha1-WcIikUxBtaaqZ5LYPVLnanARBYw=",
"version": "0.1.15",
"resolved": "https://pkgs.dev.azure.com/hugendubel/_packaging/hugendubel/npm/registry/@isa/remission/-/remission-0.1.15.tgz",
"integrity": "sha1-/uhceVTx4ShgkyQWtQBxO26BhNg=",
"requires": {
"tslib": "^1.9.0"
}

View File

@@ -38,7 +38,7 @@
"@isa/catsearch-api": "^0.0.25",
"@isa/print-api": "^0.0.25",
"@isa/remi-api": "^0.0.25",
"@isa/remission": "^0.1.14",
"@isa/remission": "^0.1.15",
"@ngxs/store": "^3.4.1",
"@types/faker": "^4.1.5",
"@zxing/ngx-scanner": "^1.3.0",