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

Bugfix/sprint 16 alex
This commit is contained in:
Aleksandras Mikuta
2020-04-03 10:45:40 +00:00
9 changed files with 72 additions and 26 deletions

View File

@@ -1,25 +1,45 @@
<div class="remission-filter-item" #filterItem>
<div class="filter" (click)="toggle()">
<div id="filter" class="filter-title" [ngClass]="{ expanded: expanded }">
<div class="remission-filter-item"
#filterItem>
<div class="filter"
(click)="toggle()">
<div id="filter"
class="filter-title"
[ngClass]="{ expanded: expanded }">
<span>{{ filter.name }}</span>
<lib-icon class="icon" [rotateBackwards]="expanded" transition="all 0.2s linear" width="17px" name="Arrow_Down_2_branch"></lib-icon>
<lib-icon class="icon"
[rotateBackwards]="expanded"
transition="all 0.2s linear"
width="17px"
name="Arrow_Down_2_branch"></lib-icon>
</div>
</div>
<ng-container *ngIf="expanded">
<div id="options" class="options" [@fadeIn]="expanded" #filterList>
<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) }">
<span class="check-icon" (click)="toggleFirstLevelItem(option)">
<div class="option"
[ngClass]="{ selected: isFirstLevelItemSelected(option) }">
<span class="check-icon"
(click)="toggleFirstLevelItem(option)">
<div class="check-box-wrapper">
<lib-icon class="check-box" height="22px" name="Check_box_b"></lib-icon>
<lib-icon class="check-box"
height="22px"
name="Check_box_b"></lib-icon>
</div>
<div class="check-mark-wrapper">
<lib-icon class="check-mark" name="Check_f_b" *ngIf="isFirstLevelItemSelected(option)"></lib-icon>
<lib-icon class="check-mark"
name="Check_f_b"
*ngIf="isFirstLevelItemSelected(option)"></lib-icon>
</div>
</span>
<div class="option-name" (click)="toggleFirstLevelItem(option)">{{ option.name }}</div>
<span *ngIf="hasGrouping && !hideSubFilters" class="grouping-arrow" (click)="toggleExpandedGrouping(option)">
<div class="option-name"
(click)="toggleFirstLevelItem(option)">{{ option.name }}</div>
<span *ngIf="hasGrouping && !hideSubFilters"
class="grouping-arrow"
(click)="toggleExpandedGrouping(option)">
<lib-icon
[rotateBackwards]="isGroupExpanded(option)"
transition="all 0.2s linear"
@@ -29,16 +49,23 @@
</span>
</div>
<ng-container *ngIf="hasGrouping && option.options && isGroupExpanded(option)">
<div class="sub-items-wrapper" @growShrink>
<hr class="branch" />
<div class="sub-items-wrapper"
@growShrink>
<hr class="branch"/>
<ng-container *ngFor="let subOption of option.options">
<div class="option" [ngClass]="{ selected: isOptionsSelected(subOption) }" (click)="toggleOption(subOption, true, option)">
<div class="option"
[ngClass]="{ selected: isOptionsSelected(subOption) }"
(click)="toggleOption(subOption, true, option)">
<span class="check-icon">
<div class="check-box-wrapper">
<lib-icon class="check-box" height="22px" name="Check_box_b"></lib-icon>
<lib-icon class="check-box"
height="22px"
name="Check_box_b"></lib-icon>
</div>
<div class="check-mark-wrapper">
<lib-icon class="check-mark" name="Check_f_b" *ngIf="isOptionsSelected(subOption)"></lib-icon>
<lib-icon class="check-mark"
name="Check_f_b"
*ngIf="isOptionsSelected(subOption)"></lib-icon>
</div>
</span>
<div class="option-name">{{ subOption.name }}</div>
@@ -46,11 +73,14 @@
</ng-container>
</div>
</ng-container>
<hr class="branch" />
<hr class="branch"/>
</ng-container>
</div>
<div class="action">
<app-button primary="true" [disabled]="updateInactive" (action)="updateFilters()">Filtern</app-button>
<app-button primary="true"
[disabled]="updateInactive"
(action)="updateFilters()">Filtern
</app-button>
</div>
</div>
</ng-container>

View File

@@ -42,6 +42,7 @@ $tablet-height: 283px;
flex-direction: column;
&__container {
position: relative;
flex-grow: 1;
overflow: scroll;
}

View File

@@ -1,12 +1,12 @@
<div class="filters-wrapper">
<ng-container *ngIf="loadItems">
<div class="filter-group">
<div class="filter" *ngFor="let filter of filters">
<div class="filter" *ngFor="let filter of filters; let i = index">
<app-remission-filter-item
[remissionResourceType]="remissionResourceType"
(closeOtherFilters)="closeOtherFilters($event)"
[filter]="filter"
(toggleChange)="toggleChange.emit($event)"
(toggleChange)="toggleChangeEmit($event, i)"
#filterItem
></app-remission-filter-item>
</div>

View File

@@ -42,6 +42,8 @@ export class RemissionFiltersComponent implements OnInit, OnDestroy {
destroy$ = new Subject();
loadItems = true;
private _remissionResourceType: RemissionResourceType;
private _filtersEpanded: boolean[] = [];
constructor(private cdr: ChangeDetectorRef, private remissionService: RemissionService) {}
ngOnInit() {
@@ -74,4 +76,10 @@ export class RemissionFiltersComponent implements OnInit, OnDestroy {
});
}
}
toggleChangeEmit(value: boolean, index: number) {
this._filtersEpanded[index] = value;
const emit = !!this._filtersEpanded.find(v => v);
this.toggleChange.emit(!!emit);
}
}

View File

@@ -2,8 +2,9 @@
#remissionListContainer
id="remission-list-container"
class="remission-list-container"
(scroll)="onScroll()"
>
[perfectScrollbar]="{minScrollbarLength: 20}"
[disabled]="filtersExpanded"
(scroll)="onScroll()">
<div class="headers" *ngIf="resourceTypeSwitch">
<div class="header-item resource-type">
<lib-double-choice-switch
@@ -71,6 +72,7 @@
*ngIf="remissionProcess"
[remissionProcessId]="remissionProcess.id"
[remissionResourceType]="selectedRemissionResourceType"
(toggleChange)="filtersExpanded = $event"
></app-remission-filters>
</div>
<div

View File

@@ -122,8 +122,9 @@ export class RemissionListCreateComponent implements OnInit, OnDestroy {
isNative = false;
searchedRemissionProduct: RemissionProduct;
showOverflowInitialMessage = true;
lastScrollTop = 0;
filtersExpanded = false;
private resetFilters = false;
constructor(
private remissionService: RemissionService,
private store: Store,

View File

@@ -25,9 +25,10 @@
id="remission-list-container"
#remissionListContainer
class="remission-list-container"
[perfectScrollbar]="{minScrollbarLength: 20}"
[disabled]="filtersExpanded"
(scroll)="scrollHandler($event)"
*ngIf="!shippingDocumentCreationPage && loaded"
>
*ngIf="!shippingDocumentCreationPage && loaded">
<div id="top-marker"></div>
<div class="headers" *ngIf="resourceTypeSwitch">
<div class="header-item resource-type">
@@ -87,6 +88,7 @@
*ngIf="remissionProcess"
[remissionProcessId]="remissionProcess.id"
[remissionResourceType]="selectedRemissionResourceType"
(toggleChange)="filtersExpanded = $event"
></app-remission-filters>
</div>
<div

View File

@@ -106,7 +106,6 @@ export class RemissionListStartedComponent implements OnInit, OnDestroy {
rightSupplier: RemissionSupplier;
};
remissionProcess: RemissionProcess;
searchedRemissionProcess: RemissionProcess;
resourceTypeSwitch = RESOURCE_TYPE_SWITCH;
remissionProcessStatuses: RemissionProcessStatuses;
processNeedsToBeRestoredFromCache = false;
@@ -128,6 +127,7 @@ export class RemissionListStartedComponent implements OnInit, OnDestroy {
fetchLastProducts$ = new Subject<void>();
// Feature Flag: Indicates whether to load entire remission list on navigate to bottom
loadAllProductsOnNavigateToBottom = false;
filtersExpanded = false;
constructor(
private remissionService: RemissionService,

View File

@@ -67,6 +67,7 @@ import { RemissionsOverviewCardContentComponent } from './components/remissions-
import { RemissionDetailsComponent } from './pages/remission-details/remission-details.component';
import { RemissionDetailsProductComponent } from './components/remission-details-product/remission-details-product.component';
import { RemissionDetailsPrimaryCtaComponent } from './components/remission-details-primary-cta/remission-details-primary-cta.component';
import { PerfectScrollbarModule } from 'ngx-perfect-scrollbar';
@NgModule({
declarations: [
@@ -109,6 +110,7 @@ import { RemissionDetailsPrimaryCtaComponent } from './components/remission-deta
RemissionClientRoutingModule,
DoubleChoiceSwitchModule,
ProgressBarModule,
PerfectScrollbarModule,
SmallDoubleChoiceSwitchModule,
IconModule,
ButtonModule,