All files / src/app/shared/components/product/product-variation-select product-variation-select.component.ts

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
4x
4x
4x
4x
 
4x
4x
 
4x
 
 
 
 
 
 
4x
3x
 
 
 
3x
 
 
3x
 
 
 
 
 
3x
 
 
3x
 
 
 
1x
 
 
 
import { ChangeDetectionStrategy, Component, OnInit } from '@angular/core';
import { Observable, combineLatest } from 'rxjs';
import { filter, map } from 'rxjs/operators';
import { v4 as uuid } from 'uuid';
 
import { ProductContextFacade } from 'ish-core/facades/product-context.facade';
import { ProductVariationHelper } from 'ish-core/models/product-variation/product-variation.helper';
import { VariationOptionGroup } from 'ish-core/models/product-variation/variation-option-group.model';
import { ProductHelper } from 'ish-core/models/product/product.helper';
 
@Component({
  selector: 'ish-product-variation-select',
  templateUrl: './product-variation-select.component.html',
  changeDetection: ChangeDetectionStrategy.OnPush,
})
export class ProductVariationSelectComponent implements OnInit {
  uuid = uuid();
  variationOptions$: Observable<VariationOptionGroup[]>;
  visible$: Observable<boolean>;
 
  constructor(private context: ProductContextFacade) {}
 
  ngOnInit() {
    this.variationOptions$ = combineLatest([
      this.context.select('product').pipe(filter(ProductHelper.isVariationProduct)),
      this.context.select('variations'),
      this.context.select('productMaster'),
    ]).pipe(
      map(([product, variations, masterProduct]) =>
        ProductVariationHelper.buildVariationOptionGroups(product, masterProduct, variations)
      )
    );
    this.visible$ = this.context.select('displayProperties', 'variations');
  }
 
  optionChange(event: { group: string; value: string }) {
    this.context.changeVariationOption(event.group, event.value);
  }
}