import {Component} from '@angular/core';
import {ActivatedRoute, Router} from "@angular/router";
import {SubscribingComponent} from "../../../../shared/components/subscribing.component";
import {Material} from "../../../../shared/model/material.model";
import {MaterialService} from "../../../../material/service/material.service";
import {MixService} from "../../../services/mix.service";

@Component({
  selector: 'cre-mix-edit',
  templateUrl: './mix-edit.component.html',
  styleUrls: ['./mix-edit.component.sass']
})
export class MixEditComponent extends SubscribingComponent {
  mixId: number | null
  recipeId: number | null
  materials: Material[] | null

  constructor(
    private materialService: MaterialService,
    private mixService: MixService,
    router: Router,
    activatedRoute: ActivatedRoute
  ) {
    super(activatedRoute, router)
  }

  ngOnInit(): void {
    super.ngOnInit()

    this.mixId = this.urlUtils.parseIntUrlParam('id')
    this.recipeId = this.urlUtils.parseIntUrlParam('recipeId')

    this.subscribe(
      this.materialService.getAllForMixUpdate(this.mixId),
      {next: m => this.materials = m}
    )
  }

  submit(values) {
    this.subscribe(
      this.mixService.updateWithUnits(this.mixId, values.name, values.materialTypeId, values.mixMaterials, values.units),
      {next: () => this.urlUtils.navigateTo(`/color/edit/${this.recipeId}`)}
    )
  }
}
