Add edit support to new mix editor
This commit is contained in:
parent
6a5f74016f
commit
e332fee3ba
|
@ -1,5 +1,5 @@
|
||||||
import {Component, EventEmitter, Input, Output, ViewChild} from '@angular/core'
|
import {Component, EventEmitter, Input, Output, ViewChild} from '@angular/core'
|
||||||
import {Mix, MixMaterial, MixMaterialDto, mixMaterialsAsMixMaterialsDto, Recipe} from '../../../shared/model/recipe.model'
|
import {Mix, MixMaterial, MixMaterialDto, mixMaterialsToMixMaterialsDto, Recipe} from '../../../shared/model/recipe.model'
|
||||||
import {Subject} from 'rxjs'
|
import {Subject} from 'rxjs'
|
||||||
import {SubscribingComponent} from '../../../shared/components/subscribing.component'
|
import {SubscribingComponent} from '../../../shared/components/subscribing.component'
|
||||||
import {convertMixMaterialQuantity, UNIT_MILLILITER} from '../../../shared/units'
|
import {convertMixMaterialQuantity, UNIT_MILLILITER} from '../../../shared/units'
|
||||||
|
@ -60,7 +60,7 @@ export class MixTableComponent extends SubscribingComponent {
|
||||||
this.mixColumns = this.COLUMNS_EDIT
|
this.mixColumns = this.COLUMNS_EDIT
|
||||||
}
|
}
|
||||||
|
|
||||||
this.mixMaterials = mixMaterialsAsMixMaterialsDto(this.mix)
|
this.mixMaterials = mixMaterialsToMixMaterialsDto(this.mix)
|
||||||
|
|
||||||
this.subscribe(
|
this.subscribe(
|
||||||
this.units$,
|
this.units$,
|
||||||
|
|
|
@ -13,5 +13,8 @@
|
||||||
[recipe]="recipe"
|
[recipe]="recipe"
|
||||||
[materialTypes]="materialTypes$"
|
[materialTypes]="materialTypes$"
|
||||||
[materials]="materials$">
|
[materials]="materials$">
|
||||||
|
<cre-form-title>
|
||||||
|
Ajouter un mélange à la couleur {{recipe.company.name}} - {{recipe.name}}
|
||||||
|
</cre-form-title>
|
||||||
</cre-mix-form>
|
</cre-mix-form>
|
||||||
</ng-container>
|
</ng-container>
|
||||||
|
|
|
@ -0,0 +1,25 @@
|
||||||
|
<ng-container *ngIf="recipe && mix">
|
||||||
|
<cre-action-bar>
|
||||||
|
<cre-action-group>
|
||||||
|
<cre-primary-button routerLink="/color/edit/{{recipe.id}}">Retour</cre-primary-button>
|
||||||
|
</cre-action-group>
|
||||||
|
<cre-action-group>
|
||||||
|
<cre-accent-button
|
||||||
|
[disabled]="!form.valid"
|
||||||
|
(click)="submit(form.formValues)">
|
||||||
|
Enregistrer
|
||||||
|
</cre-accent-button>
|
||||||
|
</cre-action-group>
|
||||||
|
</cre-action-bar>
|
||||||
|
|
||||||
|
<cre-mix-form
|
||||||
|
#form
|
||||||
|
[recipe]="recipe"
|
||||||
|
[mix]="mix"
|
||||||
|
[materialTypes]="materialTypes$"
|
||||||
|
[materials]="materials$">
|
||||||
|
<cre-form-title>
|
||||||
|
Modification du mélange {{mix.mixType.name}} de la recette {{recipe.company.name}} - {{recipe.name}}
|
||||||
|
</cre-form-title>
|
||||||
|
</cre-mix-form>
|
||||||
|
</ng-container>
|
|
@ -1,8 +1,13 @@
|
||||||
<cre-mix-info-form
|
<cre-mix-info-form
|
||||||
[recipe]="recipe"
|
[recipe]="recipe"
|
||||||
|
[mix]="mix"
|
||||||
[materialTypes]="materialTypes">
|
[materialTypes]="materialTypes">
|
||||||
|
<cre-form-title>
|
||||||
|
<ng-content select="cre-form-title"></ng-content>
|
||||||
|
</cre-form-title>
|
||||||
</cre-mix-info-form>
|
</cre-mix-info-form>
|
||||||
|
|
||||||
<cre-mix-materials-form
|
<cre-mix-materials-form
|
||||||
[materials]="materials">
|
[materials]="materials"
|
||||||
|
[mix]="mix">
|
||||||
</cre-mix-materials-form>
|
</cre-mix-materials-form>
|
||||||
|
|
|
@ -1,6 +1,9 @@
|
||||||
<cre-form [formControls]="controls" class="mx-auto">
|
<cre-form [formControls]="controls" class="mx-auto">
|
||||||
|
<!-- <cre-form-title>-->
|
||||||
|
<!-- Ajouter un mélange à la couleur {{recipe.company.name}} - {{recipe.name}}-->
|
||||||
|
<!-- </cre-form-title>-->
|
||||||
<cre-form-title>
|
<cre-form-title>
|
||||||
Ajouter un mélange à la couleur {{recipe.company.name}} - {{recipe.name}}
|
<ng-content select="cre-form-title"></ng-content>
|
||||||
</cre-form-title>
|
</cre-form-title>
|
||||||
|
|
||||||
<cre-form-content>
|
<cre-form-content>
|
||||||
|
|
|
@ -0,0 +1,5 @@
|
||||||
|
<cre-combo-box
|
||||||
|
*ngIf="entries"
|
||||||
|
[control]="control"
|
||||||
|
[entries]="entries">
|
||||||
|
</cre-combo-box>
|
|
@ -28,10 +28,14 @@
|
||||||
<ng-container matColumnDef="material">
|
<ng-container matColumnDef="material">
|
||||||
<th mat-header-cell *matHeaderCellDef>Produit</th>
|
<th mat-header-cell *matHeaderCellDef>Produit</th>
|
||||||
<td mat-cell *matCellDef="let mixMaterial">
|
<td mat-cell *matCellDef="let mixMaterial">
|
||||||
<cre-combo-box
|
<cre-mix-materials-form-combo-box
|
||||||
|
[mixMaterial]="mixMaterial"
|
||||||
|
[mix]="mix"
|
||||||
|
[mixMaterials]="mixMaterials"
|
||||||
[control]="getControls(mixMaterial.position).materialId"
|
[control]="getControls(mixMaterial.position).materialId"
|
||||||
[entries]="getAvailableMaterialEntries(mixMaterial.position)">
|
[materials]="allMaterials"
|
||||||
</cre-combo-box>
|
[position]="mixMaterial.position">
|
||||||
|
</cre-mix-materials-form-combo-box>
|
||||||
</td>
|
</td>
|
||||||
</ng-container>
|
</ng-container>
|
||||||
|
|
||||||
|
|
|
@ -1,6 +1,6 @@
|
||||||
import {AfterViewInit, ChangeDetectorRef, Component, Input, OnDestroy, ViewChild, ViewChildren} from '@angular/core'
|
import {AfterViewInit, ChangeDetectorRef, Component, Input, OnDestroy, OnInit, ViewChild, ViewChildren} from '@angular/core'
|
||||||
import {CreTable} from '../../shared/components/tables/tables'
|
import {CreTable} from '../../shared/components/tables/tables'
|
||||||
import {MixMaterialDto, sortMixMaterialsDto} from '../../shared/model/recipe.model'
|
import {Mix, MixMaterialDto, mixMaterialsToMixMaterialsDto, sortMixMaterialsDto} from '../../shared/model/recipe.model'
|
||||||
import {Observable, Subject} from 'rxjs'
|
import {Observable, Subject} from 'rxjs'
|
||||||
import {Material, materialComparator} from '../../shared/model/material.model'
|
import {Material, materialComparator} from '../../shared/model/material.model'
|
||||||
import {FormControl, Validators} from '@angular/forms'
|
import {FormControl, Validators} from '@angular/forms'
|
||||||
|
@ -8,7 +8,55 @@ import {takeUntil} from 'rxjs/operators'
|
||||||
import {CreComboBoxComponent, CreInputEntry} from '../../shared/components/inputs/inputs'
|
import {CreComboBoxComponent, CreInputEntry} from '../../shared/components/inputs/inputs'
|
||||||
import {AccountService} from '../../accounts/services/account.service'
|
import {AccountService} from '../../accounts/services/account.service'
|
||||||
import {Permission} from '../../shared/model/user'
|
import {Permission} from '../../shared/model/user'
|
||||||
import {UNIT_MILLILITER} from "../../shared/units";
|
import {UNIT_MILLILITER} from '../../shared/units'
|
||||||
|
|
||||||
|
@Component({
|
||||||
|
selector: 'cre-mix-materials-form-combo-box',
|
||||||
|
templateUrl: 'materials-form-combo-box.html'
|
||||||
|
})
|
||||||
|
export class MixMaterialsFormComboBox implements OnInit {
|
||||||
|
@ViewChild(CreComboBoxComponent) comboBox: CreComboBoxComponent
|
||||||
|
|
||||||
|
@Input() mixMaterial: MixMaterialDto
|
||||||
|
@Input() mix: Mix | null
|
||||||
|
@Input() mixMaterials: MixMaterialDto[]
|
||||||
|
@Input() control: FormControl
|
||||||
|
@Input() materials: Material[]
|
||||||
|
@Input() position: number
|
||||||
|
|
||||||
|
entries: CreInputEntry[]
|
||||||
|
|
||||||
|
ngOnInit() {
|
||||||
|
this.entries = this.filterMaterials()
|
||||||
|
}
|
||||||
|
|
||||||
|
updateEntries() {
|
||||||
|
this.entries = this.filterMaterials()
|
||||||
|
this.comboBox.reloadEntries()
|
||||||
|
}
|
||||||
|
|
||||||
|
private filterMaterials(): CreInputEntry[] {
|
||||||
|
return this.materials
|
||||||
|
.filter(material => {
|
||||||
|
if (this.mix && this.mix.mixType.material.id === material.id) {
|
||||||
|
return false
|
||||||
|
}
|
||||||
|
|
||||||
|
// Prevent use of percents in first position
|
||||||
|
if (material.materialType.usePercentages && this.mixMaterial.position <= 1) {
|
||||||
|
return false
|
||||||
|
}
|
||||||
|
|
||||||
|
if (this.mixMaterial.materialId === material.id) {
|
||||||
|
return true
|
||||||
|
}
|
||||||
|
|
||||||
|
return this.mixMaterials.filter(x => x.materialId === material.id).length <= 0
|
||||||
|
})
|
||||||
|
.sort(materialComparator)
|
||||||
|
.map(material => new CreInputEntry(material.id, material.name, material.materialType.prefix ? `[${material.materialType.prefix}] ${material.name}` : material.name))
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
@Component({
|
@Component({
|
||||||
selector: 'cre-mix-materials-form',
|
selector: 'cre-mix-materials-form',
|
||||||
|
@ -16,16 +64,16 @@ import {UNIT_MILLILITER} from "../../shared/units";
|
||||||
})
|
})
|
||||||
export class MixMaterialsForm implements AfterViewInit, OnDestroy {
|
export class MixMaterialsForm implements AfterViewInit, OnDestroy {
|
||||||
@ViewChild(CreTable) table: CreTable<MixMaterialDto>
|
@ViewChild(CreTable) table: CreTable<MixMaterialDto>
|
||||||
@ViewChildren(CreComboBoxComponent) materialComboBoxes: CreComboBoxComponent[]
|
@ViewChildren(MixMaterialsFormComboBox) comboBoxes: MixMaterialsFormComboBox[]
|
||||||
|
|
||||||
@Input() materials: Observable<Material[]>
|
@Input() materials: Observable<Material[]>
|
||||||
@Input() mixMaterials: MixMaterialDto[] = []
|
@Input() mix: Mix | null
|
||||||
|
|
||||||
|
mixMaterials: MixMaterialDto[] = []
|
||||||
columns = ['position', 'positionButtons', 'material', 'quantity', 'units', 'endButton']
|
columns = ['position', 'positionButtons', 'material', 'quantity', 'units', 'endButton']
|
||||||
|
allMaterials: Material[]
|
||||||
|
|
||||||
private _allMaterials: Material[]
|
|
||||||
private _controls: ControlsByPosition[] = []
|
private _controls: ControlsByPosition[] = []
|
||||||
private _availableMaterialsEntries: MaterialEntriesByPosition[] = []
|
|
||||||
private _destroy$ = new Subject<boolean>()
|
private _destroy$ = new Subject<boolean>()
|
||||||
|
|
||||||
constructor(
|
constructor(
|
||||||
|
@ -37,9 +85,15 @@ export class MixMaterialsForm implements AfterViewInit, OnDestroy {
|
||||||
ngAfterViewInit() {
|
ngAfterViewInit() {
|
||||||
this.materials.subscribe({
|
this.materials.subscribe({
|
||||||
next: materials => {
|
next: materials => {
|
||||||
this._allMaterials = materials
|
this.allMaterials = materials
|
||||||
|
|
||||||
this.addRow()
|
if (!this.mix) {
|
||||||
|
this.addRow()
|
||||||
|
} else {
|
||||||
|
mixMaterialsToMixMaterialsDto(this.mix).forEach(x => this.insertRow(x))
|
||||||
|
}
|
||||||
|
|
||||||
|
this.table.renderRows()
|
||||||
this.cdRef.detectChanges()
|
this.cdRef.detectChanges()
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
@ -51,9 +105,12 @@ export class MixMaterialsForm implements AfterViewInit, OnDestroy {
|
||||||
}
|
}
|
||||||
|
|
||||||
addRow() {
|
addRow() {
|
||||||
const position = this.nextPosition
|
const mixMaterial = new MixMaterialDto(null, 0, false, this.nextPosition, UNIT_MILLILITER)
|
||||||
const mixMaterial = new MixMaterialDto(null, 0, false, position, UNIT_MILLILITER)
|
this.insertRow(mixMaterial)
|
||||||
|
this.table.renderRows()
|
||||||
|
}
|
||||||
|
|
||||||
|
insertRow(mixMaterial: MixMaterialDto) {
|
||||||
const materialIdControl = new FormControl(mixMaterial.materialId, Validators.required)
|
const materialIdControl = new FormControl(mixMaterial.materialId, Validators.required)
|
||||||
const quantityControl = new FormControl(mixMaterial.quantity, Validators.required)
|
const quantityControl = new FormControl(mixMaterial.quantity, Validators.required)
|
||||||
const unitsControl = new FormControl(mixMaterial.units, Validators.required)
|
const unitsControl = new FormControl(mixMaterial.units, Validators.required)
|
||||||
|
@ -65,30 +122,23 @@ export class MixMaterialsForm implements AfterViewInit, OnDestroy {
|
||||||
mixMaterial.materialId = materialId
|
mixMaterial.materialId = materialId
|
||||||
this.refreshAvailableMaterials()
|
this.refreshAvailableMaterials()
|
||||||
this.cdRef.detectChanges()
|
this.cdRef.detectChanges()
|
||||||
this.materialComboBoxes.forEach(comboBox => comboBox.reloadEntries())
|
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
||||||
|
this.mixMaterials.push(mixMaterial)
|
||||||
this._controls.push({
|
this._controls.push({
|
||||||
position,
|
position: mixMaterial.position,
|
||||||
controls: {
|
controls: {
|
||||||
materialId: materialIdControl,
|
materialId: materialIdControl,
|
||||||
quantity: quantityControl,
|
quantity: quantityControl,
|
||||||
units: unitsControl
|
units: unitsControl
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
this._availableMaterialsEntries.push({
|
|
||||||
position,
|
|
||||||
entries: this.filterMaterials(mixMaterial)
|
|
||||||
})
|
|
||||||
this.mixMaterials.push(mixMaterial)
|
|
||||||
this.table.renderRows()
|
|
||||||
}
|
}
|
||||||
|
|
||||||
removeRow(mixMaterial: MixMaterialDto) {
|
removeRow(mixMaterial: MixMaterialDto) {
|
||||||
this.mixMaterials = this.mixMaterials.filter(x => x.position !== mixMaterial.position)
|
this.mixMaterials = this.mixMaterials.filter(x => x.position !== mixMaterial.position)
|
||||||
this._controls = this._controls.filter(x => x.position !== mixMaterial.position)
|
this._controls = this._controls.filter(x => x.position !== mixMaterial.position)
|
||||||
this._availableMaterialsEntries = this._availableMaterialsEntries.filter(x => x.position !== mixMaterial.position)
|
|
||||||
|
|
||||||
for (let position = mixMaterial.position + 1; position < this.mixMaterials.length; position++) {
|
for (let position = mixMaterial.position + 1; position < this.mixMaterials.length; position++) {
|
||||||
this.updatePosition(this.getMixMaterialByPosition(position), position - 1, false)
|
this.updatePosition(this.getMixMaterialByPosition(position), position - 1, false)
|
||||||
|
@ -98,7 +148,6 @@ export class MixMaterialsForm implements AfterViewInit, OnDestroy {
|
||||||
updatePosition(mixMaterial: MixMaterialDto, newPosition: number, switchPositions = true) {
|
updatePosition(mixMaterial: MixMaterialDto, newPosition: number, switchPositions = true) {
|
||||||
const currentPosition = mixMaterial.position
|
const currentPosition = mixMaterial.position
|
||||||
const currentControls = this.getControlsByPosition(currentPosition)
|
const currentControls = this.getControlsByPosition(currentPosition)
|
||||||
const currentMaterialEntries = this.getMaterialEntriesByPosition(currentPosition)
|
|
||||||
|
|
||||||
// Update before current to prevent position conflicts
|
// Update before current to prevent position conflicts
|
||||||
if (switchPositions) {
|
if (switchPositions) {
|
||||||
|
@ -107,21 +156,21 @@ export class MixMaterialsForm implements AfterViewInit, OnDestroy {
|
||||||
|
|
||||||
mixMaterial.position = newPosition
|
mixMaterial.position = newPosition
|
||||||
currentControls.position = newPosition
|
currentControls.position = newPosition
|
||||||
currentMaterialEntries.position = newPosition
|
|
||||||
|
|
||||||
this.sortTable()
|
this.sortTable()
|
||||||
|
this.refreshAvailableMaterials()
|
||||||
}
|
}
|
||||||
|
|
||||||
getControls(position: number): MixMaterialControls {
|
getControls(position: number): MixMaterialControls {
|
||||||
return this.getControlsByPosition(position).controls
|
return this.getControlsByPosition(position).controls
|
||||||
}
|
}
|
||||||
|
|
||||||
getAvailableMaterialEntries(position: number): CreInputEntry[] {
|
|
||||||
return this.getMaterialEntriesByPosition(position).entries
|
|
||||||
}
|
|
||||||
|
|
||||||
areUnitsPercents(mixMaterial: MixMaterialDto): boolean {
|
areUnitsPercents(mixMaterial: MixMaterialDto): boolean {
|
||||||
return mixMaterial.materialId ? this._allMaterials.filter(x => x.id === mixMaterial.materialId)[0].materialType.usePercentages : false
|
if (!mixMaterial) {
|
||||||
|
return false
|
||||||
|
}
|
||||||
|
|
||||||
|
return mixMaterial.materialId ? this.allMaterials?.filter(x => x.id === mixMaterial.materialId)[0].materialType.usePercentages : false
|
||||||
}
|
}
|
||||||
|
|
||||||
isDecreasePositionButtonDisabled(mixMaterial: MixMaterialDto): boolean {
|
isDecreasePositionButtonDisabled(mixMaterial: MixMaterialDto): boolean {
|
||||||
|
@ -146,7 +195,7 @@ export class MixMaterialsForm implements AfterViewInit, OnDestroy {
|
||||||
}
|
}
|
||||||
|
|
||||||
get materialCount(): number {
|
get materialCount(): number {
|
||||||
return this._allMaterials ? this._allMaterials.length : 0
|
return this.allMaterials ? this.allMaterials.length : 0
|
||||||
}
|
}
|
||||||
|
|
||||||
get updatedMixMaterials(): MixMaterialDto[] {
|
get updatedMixMaterials(): MixMaterialDto[] {
|
||||||
|
@ -184,40 +233,14 @@ export class MixMaterialsForm implements AfterViewInit, OnDestroy {
|
||||||
return this._controls.filter(control => control.position === position)[0]
|
return this._controls.filter(control => control.position === position)[0]
|
||||||
}
|
}
|
||||||
|
|
||||||
private getMaterialEntriesByPosition(position: number): MaterialEntriesByPosition {
|
|
||||||
return this._availableMaterialsEntries.filter(control => control.position === position)[0]
|
|
||||||
}
|
|
||||||
|
|
||||||
private refreshAvailableMaterials() {
|
private refreshAvailableMaterials() {
|
||||||
this.mixMaterials
|
this.comboBoxes.forEach(x => x.updateEntries())
|
||||||
.sort((a, b) => a.position - b.position)
|
|
||||||
.forEach(mixMaterial => {
|
|
||||||
this.getMaterialEntriesByPosition(mixMaterial.position).entries = this.filterMaterials(mixMaterial)
|
|
||||||
})
|
|
||||||
}
|
}
|
||||||
|
|
||||||
private sortTable() {
|
private sortTable() {
|
||||||
this.mixMaterials = sortMixMaterialsDto(this.mixMaterials)
|
this.mixMaterials = sortMixMaterialsDto(this.mixMaterials)
|
||||||
this.table.renderRows()
|
this.table.renderRows()
|
||||||
}
|
}
|
||||||
|
|
||||||
private filterMaterials(mixMaterial: MixMaterialDto): CreInputEntry[] {
|
|
||||||
return this._allMaterials
|
|
||||||
.filter(material => {
|
|
||||||
// Prevent use of percents in first position
|
|
||||||
if (material.materialType.usePercentages && mixMaterial.position <= 1) {
|
|
||||||
return false
|
|
||||||
}
|
|
||||||
|
|
||||||
if (mixMaterial.materialId === material.id) {
|
|
||||||
return true
|
|
||||||
}
|
|
||||||
|
|
||||||
return this.mixMaterials.filter(x => x.materialId === material.id).length <= 0
|
|
||||||
})
|
|
||||||
.sort(materialComparator)
|
|
||||||
.map(material => new CreInputEntry(material.id, material.name, material.materialType.prefix ? `[${material.materialType.prefix}] ${material.name}` : material.name))
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
interface MixMaterialControls {
|
interface MixMaterialControls {
|
||||||
|
@ -230,8 +253,3 @@ interface ControlsByPosition {
|
||||||
position: number
|
position: number
|
||||||
controls: MixMaterialControls
|
controls: MixMaterialControls
|
||||||
}
|
}
|
||||||
|
|
||||||
interface MaterialEntriesByPosition {
|
|
||||||
position: number
|
|
||||||
entries: CreInputEntry[]
|
|
||||||
}
|
|
||||||
|
|
|
@ -1,6 +1,6 @@
|
||||||
import {Component, Input, OnInit, ViewChild} from '@angular/core'
|
import {Component, Directive, Input, OnInit, ViewChild} from '@angular/core'
|
||||||
import {SubscribingComponent} from '../../shared/components/subscribing.component'
|
import {SubscribingComponent} from '../../shared/components/subscribing.component'
|
||||||
import {Recipe} from '../../shared/model/recipe.model'
|
import {Mix, Recipe} from '../../shared/model/recipe.model'
|
||||||
import {ErrorService} from '../../shared/service/error.service'
|
import {ErrorService} from '../../shared/service/error.service'
|
||||||
import {ActivatedRoute, Router} from '@angular/router'
|
import {ActivatedRoute, Router} from '@angular/router'
|
||||||
import {RecipeService} from '../services/recipe.service'
|
import {RecipeService} from '../services/recipe.service'
|
||||||
|
@ -14,20 +14,17 @@ import {Material} from '../../shared/model/material.model'
|
||||||
import {MaterialService} from '../../material/service/material.service'
|
import {MaterialService} from '../../material/service/material.service'
|
||||||
import {CreForm} from '../../shared/components/forms/forms'
|
import {CreForm} from '../../shared/components/forms/forms'
|
||||||
import {MixMaterialsForm} from './materials-form'
|
import {MixMaterialsForm} from './materials-form'
|
||||||
import {MixSaveDto, MixService} from "../services/mix.service";
|
import {MixSaveDto, MixService, MixUpdateDto} from '../services/mix.service'
|
||||||
|
|
||||||
@Component({
|
@Directive()
|
||||||
selector: 'cre-mix-add',
|
abstract class _BaseMixPage extends SubscribingComponent {
|
||||||
templateUrl: 'add.html'
|
|
||||||
})
|
|
||||||
export class MixAdd extends SubscribingComponent {
|
|
||||||
materialTypes$ = this.materialTypeService.all
|
materialTypes$ = this.materialTypeService.all
|
||||||
materials$: Observable<Material[]>
|
materials$: Observable<Material[]>
|
||||||
|
|
||||||
private _recipe: Recipe | null
|
private _recipe: Recipe | null
|
||||||
|
|
||||||
constructor(
|
constructor(
|
||||||
private mixService: MixService,
|
protected mixService: MixService,
|
||||||
private recipeService: RecipeService,
|
private recipeService: RecipeService,
|
||||||
private materialTypeService: MaterialTypeService,
|
private materialTypeService: MaterialTypeService,
|
||||||
private materialService: MaterialService,
|
private materialService: MaterialService,
|
||||||
|
@ -51,13 +48,6 @@ export class MixAdd extends SubscribingComponent {
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|
||||||
submit(dto: MixSaveDto) {
|
|
||||||
this.subscribeAndNavigate(
|
|
||||||
this.mixService.saveDto(dto),
|
|
||||||
`/color/edit/${this.recipe.id}`
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
set recipe(recipe: Recipe) {
|
set recipe(recipe: Recipe) {
|
||||||
this._recipe = recipe
|
this._recipe = recipe
|
||||||
this.materials$ = this.materialService.getAllForMixCreation(recipe.id)
|
this.materials$ = this.materialService.getAllForMixCreation(recipe.id)
|
||||||
|
@ -66,6 +56,51 @@ export class MixAdd extends SubscribingComponent {
|
||||||
get recipe(): Recipe {
|
get recipe(): Recipe {
|
||||||
return this._recipe
|
return this._recipe
|
||||||
}
|
}
|
||||||
|
|
||||||
|
abstract submit(dto: MixSaveDto)
|
||||||
|
}
|
||||||
|
|
||||||
|
@Component({
|
||||||
|
selector: 'cre-mix-add',
|
||||||
|
templateUrl: 'add.html'
|
||||||
|
})
|
||||||
|
export class MixAdd extends _BaseMixPage {
|
||||||
|
submit(dto: MixSaveDto) {
|
||||||
|
this.subscribeAndNavigate(
|
||||||
|
this.mixService.saveDto(dto),
|
||||||
|
`/color/edit/${this.recipe.id}`
|
||||||
|
)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@Component({
|
||||||
|
selector: 'cre-mix-edit',
|
||||||
|
templateUrl: 'edit.html'
|
||||||
|
})
|
||||||
|
export class MixEdit extends _BaseMixPage {
|
||||||
|
mix: Mix
|
||||||
|
|
||||||
|
ngOnInit() {
|
||||||
|
super.ngOnInit()
|
||||||
|
|
||||||
|
this.fetchMix()
|
||||||
|
}
|
||||||
|
|
||||||
|
private fetchMix() {
|
||||||
|
const mixId = this.urlUtils.parseIntUrlParam('id')
|
||||||
|
|
||||||
|
this.subscribe(
|
||||||
|
this.mixService.getById(mixId),
|
||||||
|
mix => this.mix = mix
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
submit(dto: MixSaveDto) {
|
||||||
|
this.subscribeAndNavigate(
|
||||||
|
this.mixService.updateDto({...dto, id: this.mix.id}),
|
||||||
|
`/color/edit/${this.recipe.id}`
|
||||||
|
)
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@Component({
|
@Component({
|
||||||
|
@ -76,6 +111,7 @@ export class MixInfoForm implements OnInit {
|
||||||
@ViewChild(CreForm) form: CreForm
|
@ViewChild(CreForm) form: CreForm
|
||||||
|
|
||||||
@Input() recipe: Recipe
|
@Input() recipe: Recipe
|
||||||
|
@Input() mix: Mix | null
|
||||||
@Input() materialTypes: Observable<MaterialType[]>
|
@Input() materialTypes: Observable<MaterialType[]>
|
||||||
|
|
||||||
materialTypeEntries: Observable<CreInputEntry[]>
|
materialTypeEntries: Observable<CreInputEntry[]>
|
||||||
|
@ -89,8 +125,8 @@ export class MixInfoForm implements OnInit {
|
||||||
)
|
)
|
||||||
|
|
||||||
this.controls = {
|
this.controls = {
|
||||||
name: new FormControl(null, Validators.required),
|
name: new FormControl(this.mix?.mixType.name, Validators.required),
|
||||||
materialType: new FormControl(null, Validators.required)
|
materialType: new FormControl(this.mix?.mixType.material.materialType.id, Validators.required)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -116,6 +152,7 @@ export class MixForm {
|
||||||
@ViewChild(MixMaterialsForm) mixMaterialsForm: MixMaterialsForm
|
@ViewChild(MixMaterialsForm) mixMaterialsForm: MixMaterialsForm
|
||||||
|
|
||||||
@Input() recipe: Recipe
|
@Input() recipe: Recipe
|
||||||
|
@Input() mix: Mix | null
|
||||||
@Input() materialTypes: Observable<MaterialType[]>
|
@Input() materialTypes: Observable<MaterialType[]>
|
||||||
@Input() materials: Observable<Material[]>
|
@Input() materials: Observable<Material[]>
|
||||||
|
|
||||||
|
|
|
@ -1,6 +0,0 @@
|
||||||
<!--<cre-mix-editor-->
|
|
||||||
<!-- *ngIf="recipe && materials"-->
|
|
||||||
<!-- [recipe]="recipe"-->
|
|
||||||
<!-- [materials]="materials"-->
|
|
||||||
<!-- (save)="submit($event)">-->
|
|
||||||
<!--</cre-mix-editor>-->
|
|
|
@ -1,61 +0,0 @@
|
||||||
import {Component} from '@angular/core'
|
|
||||||
import {Material} from '../../../../shared/model/material.model'
|
|
||||||
import {MaterialService} from '../../../../material/service/material.service'
|
|
||||||
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',
|
|
||||||
templateUrl: './mix-add.component.html',
|
|
||||||
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
|
|
||||||
|
|
||||||
constructor(
|
|
||||||
private recipeService: RecipeService,
|
|
||||||
private materialService: MaterialService,
|
|
||||||
private mixService: MixService,
|
|
||||||
errorService: ErrorService,
|
|
||||||
router: Router,
|
|
||||||
activatedRoute: ActivatedRoute
|
|
||||||
) {
|
|
||||||
super(errorService, activatedRoute, router)
|
|
||||||
}
|
|
||||||
|
|
||||||
ngOnInit(): void {
|
|
||||||
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
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
submit(values) {
|
|
||||||
this.subscribeAndNavigate(
|
|
||||||
this.mixService.saveWithUnits(values.name, values.recipeId, values.materialTypeId, values.mixMaterials),
|
|
||||||
`/color/edit/${this.recipeId}`
|
|
||||||
)
|
|
||||||
}
|
|
||||||
}
|
|
|
@ -1,6 +0,0 @@
|
||||||
<!--<cre-mix-editor-->
|
|
||||||
<!-- [mixId]="mixId"-->
|
|
||||||
<!-- [recipe]="recipe"-->
|
|
||||||
<!-- [materials]="materials"-->
|
|
||||||
<!-- (save)="submit($event)">-->
|
|
||||||
<!--</cre-mix-editor>-->
|
|
|
@ -1,75 +0,0 @@
|
||||||
import {Component} from '@angular/core'
|
|
||||||
import {ActivatedRoute, Router} from '@angular/router'
|
|
||||||
import {ErrorHandlingComponent} 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'
|
|
||||||
import {ErrorService} from '../../../../shared/service/error.service'
|
|
||||||
import {MixMaterialDto, Recipe} from '../../../../shared/model/recipe.model'
|
|
||||||
import {AlertService} from '../../../../shared/service/alert.service'
|
|
||||||
import {RecipeService} from "../../../services/recipe.service";
|
|
||||||
|
|
||||||
@Component({
|
|
||||||
selector: 'cre-mix-edit',
|
|
||||||
templateUrl: './mix-edit.component.html',
|
|
||||||
styleUrls: ['./mix-edit.component.sass']
|
|
||||||
})
|
|
||||||
export class MixEditComponent extends ErrorHandlingComponent {
|
|
||||||
mixId: number | null
|
|
||||||
recipe: Recipe | null
|
|
||||||
materials: Material[] | null
|
|
||||||
|
|
||||||
private recipeId: number | null
|
|
||||||
|
|
||||||
constructor(
|
|
||||||
private recipeService: RecipeService,
|
|
||||||
private materialService: MaterialService,
|
|
||||||
private mixService: MixService,
|
|
||||||
private alertService: AlertService,
|
|
||||||
errorService: ErrorService,
|
|
||||||
router: Router,
|
|
||||||
activatedRoute: ActivatedRoute
|
|
||||||
) {
|
|
||||||
super(errorService, activatedRoute, router)
|
|
||||||
}
|
|
||||||
|
|
||||||
ngOnInit(): void {
|
|
||||||
super.ngOnInit()
|
|
||||||
|
|
||||||
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
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
submit(values) {
|
|
||||||
if(!this.mixMaterialsPositionAreValid(values.mixMaterials)) {
|
|
||||||
this.alertService.pushError('Les ingrédients ne peuvent pas avoir une position inférieure à 1')
|
|
||||||
return
|
|
||||||
}
|
|
||||||
|
|
||||||
this.subscribeAndNavigate(
|
|
||||||
this.mixService.updateWithUnits(this.mixId, values.name, values.materialTypeId, values.mixMaterials),
|
|
||||||
`/color/edit/${this.recipeId}`
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
private mixMaterialsPositionAreValid(mixMaterials: MixMaterialDto[]): boolean {
|
|
||||||
return !mixMaterials.find(m => m.position <= 0)
|
|
||||||
}
|
|
||||||
}
|
|
|
@ -1,11 +1,9 @@
|
||||||
import {NgModule} from '@angular/core';
|
import {NgModule} from '@angular/core'
|
||||||
import {RouterModule, Routes} from '@angular/router';
|
import {RouterModule, Routes} from '@angular/router'
|
||||||
import {CreRecipeExplore} from './explore';
|
import {CreRecipeExplore} from './explore'
|
||||||
import {MixEditComponent} from './pages/mix/mix-edit/mix-edit.component';
|
import {RecipeAdd, RecipeEdit} from './recipes'
|
||||||
import {MixAddComponent} from './pages/mix/mix-add/mix-add.component';
|
import {RecipeList} from './list'
|
||||||
import {RecipeAdd, RecipeEdit} from './recipes';
|
import {MixAdd, MixEdit} from './mix/mix'
|
||||||
import {RecipeList} from './list';
|
|
||||||
import {MixAdd} from "./mix/mix";
|
|
||||||
|
|
||||||
const routes: Routes = [{
|
const routes: Routes = [{
|
||||||
path: 'list',
|
path: 'list',
|
||||||
|
@ -21,7 +19,7 @@ const routes: Routes = [{
|
||||||
component: MixAdd
|
component: MixAdd
|
||||||
}, {
|
}, {
|
||||||
path: 'edit/mix/:recipeId/:id',
|
path: 'edit/mix/:recipeId/:id',
|
||||||
component: MixEditComponent
|
component: MixEdit
|
||||||
}, {
|
}, {
|
||||||
path: 'explore/:id',
|
path: 'explore/:id',
|
||||||
component: CreRecipeExplore
|
component: CreRecipeExplore
|
||||||
|
|
|
@ -10,19 +10,17 @@ import {MixTableComponent} from './components/mix-table/mix-table.component'
|
||||||
import {StepListComponent} from './components/step-list/step-list.component'
|
import {StepListComponent} from './components/step-list/step-list.component'
|
||||||
import {StepTableComponent} from './components/step-table/step-table.component'
|
import {StepTableComponent} from './components/step-table/step-table.component'
|
||||||
import {UnitSelectorComponent} from './components/unit-selector/unit-selector.component'
|
import {UnitSelectorComponent} from './components/unit-selector/unit-selector.component'
|
||||||
import {MixAddComponent} from './pages/mix/mix-add/mix-add.component'
|
|
||||||
import {MixEditComponent} from './pages/mix/mix-edit/mix-edit.component'
|
|
||||||
import {ImagesEditorComponent} from './components/images-editor/images-editor.component'
|
import {ImagesEditorComponent} from './components/images-editor/images-editor.component'
|
||||||
import {MixesCardComponent} from './components/mixes-card/mixes-card.component'
|
import {MixesCardComponent} from './components/mixes-card/mixes-card.component'
|
||||||
import {MatSortModule} from '@angular/material/sort'
|
import {MatSortModule} from '@angular/material/sort'
|
||||||
import {CreInputsModule} from '../shared/components/inputs/inputs.module';
|
import {CreInputsModule} from '../shared/components/inputs/inputs.module'
|
||||||
import {CreButtonsModule} from '../shared/components/buttons/buttons.module';
|
import {CreButtonsModule} from '../shared/components/buttons/buttons.module'
|
||||||
import {RecipeAdd, RecipeEdit, RecipeForm} from './recipes';
|
import {RecipeAdd, RecipeEdit, RecipeForm} from './recipes'
|
||||||
import {CreActionBarModule} from '../shared/components/action-bar/action-bar.module';
|
import {CreActionBarModule} from '../shared/components/action-bar/action-bar.module'
|
||||||
import {RecipeList} from './list';
|
import {RecipeList} from './list'
|
||||||
import {MixAdd, MixForm, MixInfoForm} from "./mix/mix";
|
import {MixAdd, MixEdit, MixForm, MixInfoForm} from './mix/mix'
|
||||||
import {CreTablesModule} from "../shared/components/tables/tables.module";
|
import {CreTablesModule} from '../shared/components/tables/tables.module'
|
||||||
import {MixMaterialsForm} from "./mix/materials-form";
|
import {MixMaterialsForm, MixMaterialsFormComboBox} from './mix/materials-form'
|
||||||
|
|
||||||
@NgModule({
|
@NgModule({
|
||||||
declarations: [
|
declarations: [
|
||||||
|
@ -32,8 +30,6 @@ import {MixMaterialsForm} from "./mix/materials-form";
|
||||||
StepListComponent,
|
StepListComponent,
|
||||||
StepTableComponent,
|
StepTableComponent,
|
||||||
UnitSelectorComponent,
|
UnitSelectorComponent,
|
||||||
MixAddComponent,
|
|
||||||
MixEditComponent,
|
|
||||||
ImagesEditorComponent,
|
ImagesEditorComponent,
|
||||||
MixesCardComponent,
|
MixesCardComponent,
|
||||||
RecipeForm,
|
RecipeForm,
|
||||||
|
@ -41,9 +37,11 @@ import {MixMaterialsForm} from "./mix/materials-form";
|
||||||
RecipeEdit,
|
RecipeEdit,
|
||||||
RecipeList,
|
RecipeList,
|
||||||
MixAdd,
|
MixAdd,
|
||||||
|
MixEdit,
|
||||||
MixForm,
|
MixForm,
|
||||||
MixInfoForm,
|
MixInfoForm,
|
||||||
MixMaterialsForm
|
MixMaterialsForm,
|
||||||
|
MixMaterialsFormComboBox
|
||||||
],
|
],
|
||||||
exports: [
|
exports: [
|
||||||
UnitSelectorComponent
|
UnitSelectorComponent
|
||||||
|
|
|
@ -45,6 +45,15 @@ export class MixService {
|
||||||
return this.api.post('/recipe/mix', body)
|
return this.api.post('/recipe/mix', body)
|
||||||
}
|
}
|
||||||
|
|
||||||
|
updateDto(dto: MixUpdateDto): Observable<void> {
|
||||||
|
return this.updateWithUnits(
|
||||||
|
dto.id,
|
||||||
|
dto.name,
|
||||||
|
dto.materialTypeId,
|
||||||
|
dto.mixMaterials
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
updateWithUnits(id: number, name: string, materialTypeId: number, mixMaterials: MixMaterialDto[]): Observable<void> {
|
updateWithUnits(id: number, name: string, materialTypeId: number, mixMaterials: MixMaterialDto[]): Observable<void> {
|
||||||
return this.update(id, name, materialTypeId, this.convertMixMaterialsToMl(mixMaterials))
|
return this.update(id, name, materialTypeId, this.convertMixMaterialsToMl(mixMaterials))
|
||||||
}
|
}
|
||||||
|
@ -91,3 +100,10 @@ export interface MixSaveDto {
|
||||||
mixMaterials: MixMaterialDto[]
|
mixMaterials: MixMaterialDto[]
|
||||||
}
|
}
|
||||||
|
|
||||||
|
export interface MixUpdateDto {
|
||||||
|
id: number
|
||||||
|
name: string
|
||||||
|
materialTypeId: number
|
||||||
|
mixMaterials: MixMaterialDto[]
|
||||||
|
}
|
||||||
|
|
||||||
|
|
|
@ -196,14 +196,6 @@ export class CreComboBoxComponent {
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
|
|
||||||
if (this.control.value) {
|
|
||||||
this.internalControl.setValue(this.findEntryByKey(this.control.value)?.value)
|
|
||||||
}
|
|
||||||
|
|
||||||
if (this.control.disabled) {
|
|
||||||
this.internalControl.disable()
|
|
||||||
}
|
|
||||||
|
|
||||||
this.internalControl = new FormControl({
|
this.internalControl = new FormControl({
|
||||||
value: null,
|
value: null,
|
||||||
disabled: false
|
disabled: false
|
||||||
|
@ -222,6 +214,14 @@ export class CreComboBoxComponent {
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
||||||
|
if (this.control.value) {
|
||||||
|
this.internalControl.setValue(this.findEntryByKey(this.control.value)?.value)
|
||||||
|
}
|
||||||
|
|
||||||
|
if (this.control.disabled) {
|
||||||
|
this.internalControl.disable()
|
||||||
|
}
|
||||||
|
|
||||||
this.reloadEntries()
|
this.reloadEntries()
|
||||||
this._controlsInitialized = true
|
this._controlsInitialized = true
|
||||||
}
|
}
|
||||||
|
|
|
@ -100,7 +100,7 @@ export function sortRecipeSteps(steps: RecipeStep[]): RecipeStep[] {
|
||||||
return steps.sort((a, b) => a.position - b.position)
|
return steps.sort((a, b) => a.position - b.position)
|
||||||
}
|
}
|
||||||
|
|
||||||
export function mixMaterialsAsMixMaterialsDto(mix: Mix): MixMaterialDto[] {
|
export function mixMaterialsToMixMaterialsDto(mix: Mix): MixMaterialDto[] {
|
||||||
return sortMixMaterialsDto(mix.mixMaterials.map(m => new MixMaterialDto(
|
return sortMixMaterialsDto(mix.mixMaterials.map(m => new MixMaterialDto(
|
||||||
m.material.id,
|
m.material.id,
|
||||||
m.quantity,
|
m.quantity,
|
||||||
|
|
Loading…
Reference in New Issue