src/app/modules/recipes/components/mix-editor/mix-editor.component.html

@@ -1,7 +1,7 @@
-<ng-container *ngIf="controls && recipe && materials && (!editionMode || mix)">
+<ng-container *ngIf="recipe && materials && (!editionMode || mix)">
   <cre-action-bar>
     <cre-action-group>
-      <cre-primary-button routerLink="/color/edit/{{recipe.id}}">Retour</cre-primary-button>
+      <cre-primary-button routerLink="/color/edit/{{recipeId}}">Retour</cre-primary-button>
     </cre-action-group>
     <cre-action-group>
       <cre-warn-button *ngIf="editionMode" (click)="deleteConfirmBox.show()">Supprimer</cre-warn-button>
@@ -18,8 +18,8 @@
 
     <cre-form-content>
       <cre-input [control]="controls.name" label="name" icon="form-textbox"></cre-input>
-      <!--      <cre-select [control]="controls.materialType" label="Type de produit"-->
-      <!--                  [entries]="materialTypeEntries$"></cre-select>-->
+      <cre-select [control]="controls.materialType" label="Type de produit"
+                  [entries]="materialTypeEntries$"></cre-select>
     </cre-form-content>
   </cre-form>
 </ng-container>
@@ -71,7 +71,7 @@
       <!--      </mat-form-field>-->
 
 
-      <!--      <cre-select [entries]="getAvailableMaterials(mixMaterial)"></cre-select>-->
+      <cre-select [entries]="getAvailableMaterials(mixMaterial)"></cre-select>
     </td>
   </ng-container>
 

src/app/modules/recipes/components/mix-editor/mix-editor.component.ts

@@ -20,7 +20,7 @@ import {ActivatedRoute, Router} from '@angular/router'
 import {ConfirmBoxComponent} from '../../../shared/components/confirm-box/confirm-box.component'
 import {AccountService} from '../../../accounts/services/account.service'
 import {ErrorService} from '../../../shared/service/error.service'
-import {map} from 'rxjs/operators';
+import {map, tap} from 'rxjs/operators';
 import {CreInputEntry} from '../../../shared/components/inputs/inputs';
 import {CreForm, ICreForm} from '../../../shared/components/forms/forms';
 
@@ -30,17 +30,19 @@ import {CreForm, ICreForm} from '../../../shared/components/forms/forms';
   styleUrls: ['./mix-editor.component.sass']
 })
 export class MixEditorComponent extends ErrorHandlingComponent {
-  @ViewChild(MatTable, {static: true}) mixTable: MatTable<MixMaterial>
+  @ViewChild('matTable') mixTable: MatTable<MixMaterial>
   @ViewChild('deleteConfirmBox') deleteConfirmBox: ConfirmBoxComponent
   @ViewChild(CreForm) creForm: ICreForm
 
   @Input() mixId: number | null
-  @Input() recipe: Recipe
-  @Input() mix: Mix | null
-  @Input() materials: Material[] = []
+  @Input() recipeId: number | null
+  @Input() materials: Material[]
 
   @Output() save = new EventEmitter<any>()
 
+  recipe: Recipe
+  mix: Mix | null
+
   editionMode = false
   units = UNIT_MILLILITER
   hoveredMixMaterial: MixMaterial | null
@@ -90,14 +92,33 @@ export class MixEditorComponent extends ErrorHandlingComponent {
       this.editionMode = true
     }
 
-    if (this.editionMode) {
-      this.mix = this.recipe.mixes.find(mix => mix.id === this.mixId)
-      this.mixMaterials = mixMaterialsAsMixMaterialsDto(this.mix)
-    } else {
-      this.addBlankMixMaterial()
-    }
+    this.fetchRecipe()
+    this.fetchMaterials()
+  }
 
-    this.createControls()
+  private fetchRecipe() {
+    this.subscribe(
+      this.recipeService.getById(this.recipeId),
+      recipe => {
+        this.recipe = recipe
+
+        if (this.editionMode) {
+          this.mix = this.recipe.mixes.find(mix => mix.id === this.mixId)
+          this.mixMaterials = mixMaterialsAsMixMaterialsDto(this.mix)
+        } else {
+          this.addBlankMixMaterial()
+        }
+
+        this.createControls()
+      }
+    )
+  }
+
+  private fetchMaterials() {
+    this.subscribe(
+      this.materialService.all,
+      materials => this.materials = materials
+    )
   }
 
   private createControls() {
@@ -146,7 +167,7 @@ export class MixEditorComponent extends ErrorHandlingComponent {
   submit() {
     this.save.emit({
       name: this.controls.name.value,
-      recipeId: this.recipe.id,
+      recipeId: this.recipeId,
       materialTypeId: this.controls.materialType.value,
       mixMaterials: this.mixMaterials,
       units: this.units
@@ -155,7 +176,7 @@ export class MixEditorComponent extends ErrorHandlingComponent {
 
   delete() {
     this.deleting = true
-    this.subscribeAndNavigate(this.mixService.delete(this.mixId), `/color/edit/${this.recipe.id}`)
+    this.subscribeAndNavigate(this.mixService.delete(this.mixId), `/color/edit/${this.recipeId}`)
   }
 
   getAvailableMaterials(mixMaterial: MixMaterialDto): CreInputEntry[] {
@@ -166,10 +187,8 @@ export class MixEditorComponent extends ErrorHandlingComponent {
     //   map(materials => this.sortedMaterials(materials)),
     //   map(materials => materials.map(material => new CreInputEntry(material.id, material.name)))
     // )
-    return this.materials
-      .filter(m => mixMaterial.materialId === m.id || this.mixMaterials.filter(mm => mm.materialId === m.id).length === 0)
-      .sort(materialComparator)
-      .map(material => new CreInputEntry(material.id, material.name))
+    console.log(this.materials.map(material => new CreInputEntry(material.id, material.name)))
+    return []
     // return this.materials.map(material => new CreInputEntry(material.id, material.name))
     // return this.materials
     //   .filter(m => mixMaterial.materialId === m.id || this.mixMaterials.filter(mm => mm.materialId === m.id).length === 0)

src/app/modules/recipes/pages/mix/mix-add/mix-add.component.html

@@ -1,6 +1,5 @@
 <cre-mix-editor
-  *ngIf="recipe && materials"
-  [recipe]="recipe"
+  [recipeId]="recipeId"
   [materials]="materials"
   (save)="submit($event)">
 </cre-mix-editor>

src/app/modules/recipes/pages/mix/mix-add/mix-add.component.ts

@@ -5,8 +5,6 @@ import {ActivatedRoute, Router} from '@angular/router'
 import {ErrorHandlingComponent} from '../../../../shared/components/subscribing.component'
 import {MixService} from '../../../services/mix.service'
 import {ErrorService} from '../../../../shared/service/error.service'
-import {Recipe} from "../../../../shared/model/recipe.model";
-import {RecipeService} from "../../../services/recipe.service";
 
 @Component({
   selector: 'cre-mix-add',
@@ -14,13 +12,10 @@ import {RecipeService} from "../../../services/recipe.service";
   styleUrls: ['./mix-add.component.sass']
 })
 export class MixAddComponent extends ErrorHandlingComponent {
-  materials: Material[] | null = [new Material(0, "Example", 1000, null, null)]
-  recipe: Recipe | null
-
-  private recipeId: number | null
+  recipeId: number | null
+  materials: Material[] | null
 
   constructor(
-    private recipeService: RecipeService,
     private materialService: MaterialService,
     private mixService: MixService,
     errorService: ErrorService,
@@ -34,21 +29,10 @@ export class MixAddComponent extends ErrorHandlingComponent {
     super.ngOnInit()
 
     this.recipeId = this.urlUtils.parseIntUrlParam('recipeId')
-    this.fetchRecipe()
-    // this.fetchMaterials()
-  }
 
-  private fetchRecipe() {
-    this.subscribe(
-      this.recipeService.getById(this.recipeId),
-      recipe => this.recipe = recipe
-    )
-  }
-
-  private fetchMaterials() {
     this.subscribe(
       this.materialService.getAllForMixCreation(this.recipeId),
-      materials => this.materials = materials
+      m => this.materials = m
     )
   }
 

src/app/modules/recipes/pages/mix/mix-edit/mix-edit.component.html

@@ -1,6 +1,6 @@
 <cre-mix-editor
   [mixId]="mixId"
-  [recipe]="recipe"
+  [recipeId]="recipeId"
   [materials]="materials"
   (save)="submit($event)">
 </cre-mix-editor>

src/app/modules/recipes/pages/mix/mix-edit/mix-edit.component.ts

@@ -4,10 +4,9 @@ import {ErrorHandlingComponent} from '../../../../shared/components/subscribing.
 import {Material} from '../../../../shared/model/material.model'
 import {MaterialService} from '../../../../material/service/material.service'
 import {MixService} from '../../../services/mix.service'
-import {ErrorService} from '../../../../shared/service/error.service'
-import {MixMaterialDto, Recipe} from '../../../../shared/model/recipe.model'
+import {ErrorHandlerComponent, ErrorService} from '../../../../shared/service/error.service'
+import {MixMaterialDto} from '../../../../shared/model/recipe.model'
 import {AlertService} from '../../../../shared/service/alert.service'
-import {RecipeService} from "../../../services/recipe.service";
 
 @Component({
   selector: 'cre-mix-edit',
@@ -16,13 +15,10 @@ import {RecipeService} from "../../../services/recipe.service";
 })
 export class MixEditComponent extends ErrorHandlingComponent {
   mixId: number | null
-  recipe: Recipe | null
+  recipeId: number | null
   materials: Material[] | null
 
-  private recipeId: number | null
-
   constructor(
-    private recipeService: RecipeService,
     private materialService: MaterialService,
     private mixService: MixService,
     private alertService: AlertService,
@@ -39,21 +35,9 @@ export class MixEditComponent extends ErrorHandlingComponent {
     this.mixId = this.urlUtils.parseIntUrlParam('id')
     this.recipeId = this.urlUtils.parseIntUrlParam('recipeId')
 
-    this.fetchRecipe()
-    this.fetchMaterials()
-  }
-
-  private fetchRecipe() {
-    this.subscribe(
-      this.recipeService.getById(this.recipeId),
-      recipe => this.recipe = recipe
-    )
-  }
-
-  private fetchMaterials() {
     this.subscribe(
       this.materialService.getAllForMixUpdate(this.mixId),
-      materials => this.materials = materials
+      m => this.materials = m
     )
   }
 

src/app/modules/shared/components/inputs/inputs.ts

@@ -50,7 +50,7 @@ export class CreInputComponent extends _CreInputBase implements AfterViewInit {
   @ViewChild('input') input: any
   @ContentChild(TemplateRef) errors: TemplateRef<any>
 
-  fieldRequired = false
+  fieldRequired = true
 
   ngAfterViewInit() {
     const element = this.input.nativeElement
@@ -399,12 +399,8 @@ export class CreSliderInputComponent {
   selector: 'cre-select',
   templateUrl: 'select.html'
 })
-export class CreSelectComponent extends _CreInputBase implements AfterViewInit {
-  @Input() entries: CreInputEntry[] | Observable<CreInputEntry[]>
-
-  ngAfterViewInit(): void {
-    console.log(this.entries)
-  }
+export class CreSelectComponent extends _CreInputBase {
+  @Input() entries: Observable<CreInputEntry[]> | CreInputEntry[]
 
   get entriesAreObservable(): boolean {
     return isObservable(this.entries)