sxhundred/ISA-Frontend
1
0
Fork 0
mirror of https://dev.azure.com/hugendubel/ISA/_git/ISA-Frontend synced 2025-12-28 22:42:11 +01:00
Code Issues Packages Projects Releases Wiki Activity

Merged in bugfix/sprint-16-alex (pull request #1248)

Browse Source 
Bugfix/sprint 16 alex
This commit is contained in:
Aleksandras Mikuta
2020-04-02 09:21:34 +00:00
parent bf44536ff3 60dd879f63
commit 7b30ef25cb
10 changed files with 92 additions and 44 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
apps/sales/src/app/modules/remission/components/remission-add-product-to-shipping-document-partially-dialog/remission-add-product-to-shipping-document-partially-dialog.component.scss
View File

@@ -1,6 +1,7 @@
::ng-deep {
#remission-add-product-to-shipping-document-partially-modal {
.dropdown-options {
top: -11px;
right: 50%;
transform: translateX(50%);
}
@@ -74,6 +75,7 @@
padding-bottom: 7px;
outline: none;
caret-color: #f70400;
border-radius: 0;
}
}
}

4
apps/sales/src/app/modules/remission/components/remission-filter-item/remission-filter-item.component.html
View File

@@ -1,4 +1,4 @@
<div class="remission-filter-item">
<div class="remission-filter-item" #filterItem>
<div class="filter" (click)="toggle()">
<div id="filter" class="filter-title" [ngClass]="{ expanded: expanded }">
<span>{{ filter.name }}</span>
@@ -6,7 +6,7 @@
</div>
</div>
<ng-container *ngIf="expanded">
<div id="options" class="options" [@fadeIn]="expanded">
<div id="options" class="options" [@fadeIn]="expanded" #filterList>
<div class="options__container">
<ng-container *ngFor="let option of filter.options">
<div class="option" [ngClass]="{ selected: isFirstLevelItemSelected(option) }">

21
apps/sales/src/app/modules/remission/components/remission-filter-item/remission-filter-item.component.scss
View File

@@ -1,10 +1,6 @@
$device-height: 500px;
$tablet-height: 283px;
.remission-filter-item {
position: relative;
}
.filter {
.filter-title {
cursor: pointer;
@@ -28,19 +24,21 @@ $tablet-height: 283px;
.options {
position: absolute;
top: 35px;
margin-top: 2px;
z-index: 999;
background-color: white;
-moz-box-shadow: 0 0 20px 1px #dde5ec;
-webkit-box-shadow: 0 0 20px 1px #dde5ec;
box-shadow: 0 0 20px 1px #dde5ec;
border-radius: 4px;
padding-bottom: 10px;
width: 307px;
overflow: hidden;
z-index: 10;
box-sizing: border-box;
display: flex;
flex-direction: column;
&__container {
max-height: 305px;
flex-grow: 1;
overflow: scroll;
}
.option {
@@ -86,5 +84,10 @@ $tablet-height: 283px;
.action {
display: flex;
justify-content: center;
padding-top: 10px;
flex-shrink: 0;
app-button {
display: block;
margin: 10px 0;
}
}

76
apps/sales/src/app/modules/remission/components/remission-filter-item/remission-filter-item.component.ts
View File

@@ -1,4 +1,15 @@
import { Component, OnInit, Input, Output, EventEmitter, OnDestroy, ChangeDetectorRef } from '@angular/core';
import {
Component,
OnInit,
Input,
Output,
EventEmitter,
OnDestroy,
ChangeDetectorRef,
ViewChild,
ElementRef,
HostListener, AfterViewInit, Renderer2
} from '@angular/core';
import { Filter, FilterOption } from '@isa/remission';
import { fadeInAnimation } from '../../animations/fadeIn.animation';
import { growShrinkAnimation } from '../../animations/grow-shrink.animation';
@@ -17,15 +28,18 @@ import isEqual from 'lodash/isEqual';
styleUrls: ['./remission-filter-item.component.scss'],
animations: [fadeInAnimation, growShrinkAnimation]
})
export class RemissionFilterItemComponent implements OnInit, OnDestroy {
export class RemissionFilterItemComponent implements OnInit, OnDestroy, AfterViewInit {
@Input() filter: Filter;
@Input()
get remissionResourceType(): RemissionResourceType {
return this._remissionResourceType;
}
set remissionResourceType(value: RemissionResourceType) {
this._remissionResourceType = value;
}
@Output() closeOtherFilters = new EventEmitter<string>();
@Output() toggleChange = new EventEmitter();
@@ -42,7 +56,21 @@ export class RemissionFilterItemComponent implements OnInit, OnDestroy {
private previousSelectedOptions: FilterOption[] = [];
private _remissionResourceType: RemissionResourceType;
constructor(private store: Store, private remissionHelper: RemissionHelperService, private cdrf: ChangeDetectorRef) {}
private windowHeight;
@ViewChild('filterItem') filterItem: ElementRef;
@ViewChild('filterList') filterList: ElementRef;
@HostListener('window:resize', [])
public onResize() {
this.windowHeight = window.innerHeight;
}
constructor(
private store: Store,
private remissionHelper: RemissionHelperService,
private cdrf: ChangeDetectorRef,
private renderer: Renderer2
) {}
ngOnInit() {
this.areFilterOptionsGoups(this.filter);
@@ -52,6 +80,10 @@ export class RemissionFilterItemComponent implements OnInit, OnDestroy {
}
}
public ngAfterViewInit() {
this.windowHeight = window.innerHeight;
}
ngOnDestroy() {
this.destroy$.next();
}
@@ -66,7 +98,7 @@ export class RemissionFilterItemComponent implements OnInit, OnDestroy {
)
.subscribe(filterOptions => {
const flatFilterOptions = [];
this.filter.options.forEach(({ options }) => flatFilterOptions.push(...options));
this.filter.options.forEach(({options}) => flatFilterOptions.push(...options));
this.selectedOptions = flatFilterOptions.filter(item => filterOptions.includes(item.id));
this.selectedGroups = this.filter.options.filter(groupOptions => {
@@ -121,6 +153,17 @@ export class RemissionFilterItemComponent implements OnInit, OnDestroy {
this.remissionHelper.closeFilters$.pipe(takeUntil(this.destroy$)).subscribe(() => {
this.updateFilters();
});
this.remissionHelper.closeDropdowns$.pipe(takeUntil(this.destroy$)).subscribe(() => {
if (!this.expanded) {
return;
}
this.expanded = false;
this.previousSelectedGroups = [...this.selectedGroups];
this.previousSelectedOptions = [...this.selectedOptions];
this.toggleChange.emit(this.expanded);
this.setFilterHeight(this.expanded);
this.setFilterListHeight();
});
}
updateFilters() {
@@ -346,6 +389,7 @@ export class RemissionFilterItemComponent implements OnInit, OnDestroy {
}
this.toggleChange.emit(this.expanded);
this.setFilterHeight(this.expanded);
this.setFilterListHeight();
}
setFilterHeight(expanded: boolean) {
@@ -354,17 +398,29 @@ export class RemissionFilterItemComponent implements OnInit, OnDestroy {
if (expanded) {
const options = document.getElementById('options');
if (options) {
const height = options.getBoundingClientRect().height;
this.remissionHelper.setFilterHeight(height);
} else {
this.remissionHelper.setFilterHeight(0);
const h = options.getBoundingClientRect().height;
this.remissionHelper.setFilterHeight(h);
return;
}
} else {
this.remissionHelper.setFilterHeight(0);
}
this.remissionHelper.setFilterHeight(0);
});
}
setFilterListHeight() {
if (!this.filterList) {
return;
}
if (this.expanded && this.windowHeight && this.filterItem) {
const b = this.filterItem.nativeElement.getBoundingClientRect().bottom;
const h = this.windowHeight - b - 85;
this.renderer.setStyle(this.filterList.nativeElement, 'top', `${b}px`);
this.renderer.setStyle(this.filterList.nativeElement, 'height', `${h}px`);
return;
}
this.renderer.removeStyle(this.filterList.nativeElement, 'height');
}
public closeNotCurrentFilters(id: string) {
if (this.filter.id !== id) {
this.updateFilters();

2
apps/sales/src/app/modules/remission/components/remission-shipping-document/remission-shipping-document.component.scss
View File

@@ -64,7 +64,7 @@
justify-content: center;
span {
margin: 35px 0 30px;
margin: 34px 0 41px;
font-family: 'Open Sans';
font-size: 16px;
color: #89949e;

2
apps/sales/src/app/modules/remission/pages/remission-list-create/remission-list-create.component.html
View File

@@ -2,6 +2,7 @@
#remissionListContainer
id="remission-list-container"
class="remission-list-container scrollbar-visible"
(scroll)="onScroll()"
>
<div class="headers" *ngIf="resourceTypeSwitch">
<div class="header-item resource-type">
@@ -70,7 +71,6 @@
*ngIf="remissionProcess"
[remissionProcessId]="remissionProcess.id"
[remissionResourceType]="selectedRemissionResourceType"
(toggleChange)="filterToggled($event)"
></app-remission-filters>
</div>
<div

14
apps/sales/src/app/modules/remission/pages/remission-list-create/remission-list-create.component.ts
View File

@@ -528,16 +528,6 @@ export class RemissionListCreateComponent implements OnInit, OnDestroy {
this.navigateToAddProductToRemission();
}
filterToggled(state: boolean) {
if (state) {
setTimeout(() => {
// HIMA-1045 smooth scroll the expanded options into view
const container = document.getElementById('options');
container.scrollIntoView({ block: 'end', behavior: 'smooth' });
}, 300);
}
}
navigateToAddProductToRemission() {
const path = '/remission/search';
this.store.dispatch(
@@ -643,6 +633,10 @@ export class RemissionListCreateComponent implements OnInit, OnDestroy {
this.destroy$.next();
}
onScroll() {
this.remissionHelper.closeDropdowns();
}
private reinitializeFilters() {
const resourceTarget =
this.selectedSupplier === Side.LEFT

1
apps/sales/src/app/modules/remission/pages/remission-list-started/remission-list-started.component.html
View File

@@ -87,7 +87,6 @@
*ngIf="remissionProcess"
[remissionProcessId]="remissionProcess.id"
[remissionResourceType]="selectedRemissionResourceType"
(toggleChange)="filterToggled($event)"
></app-remission-filters>
</div>
<div

12
apps/sales/src/app/modules/remission/pages/remission-list-started/remission-list-started.component.ts
View File

@@ -494,16 +494,6 @@ export class RemissionListStartedComponent implements OnInit, OnDestroy {
this.navigateToFinishRemission();
}
filterToggled(state: boolean, elementRef: ElementRef) {
if (state) {
setTimeout(() => {
// HIMA-1045 smooth scroll the expanded options into view
const container = document.getElementById('options');
container.scrollIntoView({ block: 'end', behavior: 'smooth' });
}, 300);
}
}
navigateToFinishRemission() {
const path = '/remission/finish';
this.store.dispatch(
@@ -520,6 +510,8 @@ export class RemissionListStartedComponent implements OnInit, OnDestroy {
}
scrollHandler(event) {
this.remissionHelper.closeDropdowns();
const { clientHeight, scrollHeight, scrollTop } = event.target;
if (this.refetchProductsOnScroll()) {

2
apps/sales/src/app/modules/remission/services/remission-helper.service.ts
View File

@@ -19,6 +19,7 @@ export class RemissionHelperService {
addRemissionListItem$ = new Subject<RemissionProduct>();
updateRemissionListItem$ = new Subject<{ quantity: number; product: RemissionProduct }>();
filterHeight$ = new BehaviorSubject<number>(null);
closeDropdowns$ = new Subject();
constructor() {}
public deleteFilterOption = (option: FilterOption) => this.filteOptionsDeleteEvents$.next(option);
@@ -33,4 +34,5 @@ export class RemissionHelperService {
public updateRemissionListItem = (quantity: number, product: RemissionProduct) =>
this.updateRemissionListItem$.next({ quantity: quantity, product: product });
public setFilterHeight = (height: number) => this.filterHeight$.next(height);
public closeDropdowns = () => this.closeDropdowns$.next();
}