develop #5
|
@ -1,126 +0,0 @@
|
|||
<ng-container *ngIf="controls && recipe && materials && (!editionMode || 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-warn-button *ngIf="editionMode" (click)="deleteConfirmBox.show()">Supprimer</cre-warn-button>
|
||||
<cre-submit-button [form]="creForm" (submit)="submit()">Enregistrer</cre-submit-button>
|
||||
</cre-action-group>
|
||||
</cre-action-bar>
|
||||
|
||||
<cre-form #creForm [formControls]="controls" class="mx-auto">
|
||||
<cre-form-title *ngIf="!editionMode">Ajouter un mélange à la couleur {{recipe.company.name}}
|
||||
- {{recipe.name}}</cre-form-title>
|
||||
<cre-form-title *ngIf="editionMode">Modification du mélange {{mix.mixType.name}} de la
|
||||
couleur {{recipe.company.name}}
|
||||
- {{recipe.name}}</cre-form-title>
|
||||
|
||||
<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-form-content>
|
||||
</cre-form>
|
||||
</ng-container>
|
||||
|
||||
<table #matTable mat-table [dataSource]="mixMaterials" class="mx-auto mt-5">
|
||||
<ng-container matColumnDef="position">
|
||||
<th mat-header-cell *matHeaderCellDef>Position</th>
|
||||
<td mat-cell *matCellDef="let mixMaterial">
|
||||
{{mixMaterial.position}}
|
||||
</td>
|
||||
</ng-container>
|
||||
|
||||
<ng-container matColumnDef="buttonsPosition">
|
||||
<th mat-header-cell *matHeaderCellDef></th>
|
||||
<td mat-cell *matCellDef="let mixMaterial; let i = index">
|
||||
<ng-container *ngIf="(!hoveredMixMaterial && i === 0) || hoveredMixMaterial === mixMaterial">
|
||||
<button
|
||||
mat-mini-fab
|
||||
color="primary"
|
||||
class="mr-1"
|
||||
[disabled]="mixMaterial.position <= 1"
|
||||
(click)="decreasePosition(mixMaterial, matTable)">
|
||||
<mat-icon svgIcon="arrow-up"></mat-icon>
|
||||
</button>
|
||||
<button
|
||||
mat-mini-fab
|
||||
color="primary"
|
||||
[disabled]="mixMaterial.position >= mixMaterials.length"
|
||||
(click)="increasePosition(mixMaterial, matTable)">
|
||||
<mat-icon svgIcon="arrow-down"></mat-icon>
|
||||
</button>
|
||||
</ng-container>
|
||||
</td>
|
||||
</ng-container>
|
||||
|
||||
<ng-container matColumnDef="material">
|
||||
<th mat-header-cell *matHeaderCellDef>Produit</th>
|
||||
<td mat-cell *matCellDef="let mixMaterial">
|
||||
<!-- <mat-form-field *ngIf="materials">-->
|
||||
<!-- <mat-select-->
|
||||
<!-- [value]="mixMaterial.materialId"-->
|
||||
<!-- (valueChange)="setMixMaterialMaterial(mixMaterial, $event)">-->
|
||||
<!-- <mat-option-->
|
||||
<!-- *ngFor="let material of sortedMaterials(getAvailableMaterials(mixMaterial))"-->
|
||||
<!-- [value]="material.id">-->
|
||||
<!-- {{materialDisplayName(material)}}-->
|
||||
<!-- </mat-option>-->
|
||||
<!-- </mat-select>-->
|
||||
<!-- </mat-form-field>-->
|
||||
|
||||
|
||||
<cre-select [entries]="getAvailableMaterials(mixMaterial)"></cre-select>
|
||||
</td>
|
||||
</ng-container>
|
||||
|
||||
<ng-container matColumnDef="quantity">
|
||||
<th mat-header-cell *matHeaderCellDef>Quantité</th>
|
||||
<td mat-cell *matCellDef="let mixMaterial">
|
||||
<mat-form-field>
|
||||
<input matInput type="number" step="0.001" [(ngModel)]="mixMaterial.quantity"/>
|
||||
</mat-form-field>
|
||||
</td>
|
||||
</ng-container>
|
||||
|
||||
<ng-container matColumnDef="units">
|
||||
<th mat-header-cell *matHeaderCellDef>Unités</th>
|
||||
<td mat-cell *matCellDef="let mixMaterial" class="units-wrapper">
|
||||
<ng-container *ngIf="materials">
|
||||
<ng-container *ngIf="mixMaterial.isPercents">
|
||||
<p>%</p>
|
||||
</ng-container>
|
||||
<ng-container *ngIf="!mixMaterial.isPercents">
|
||||
<ng-container *ngIf="!hoveredMixMaterial || hoveredMixMaterial != mixMaterial">
|
||||
<span>{{units}}</span>
|
||||
</ng-container>
|
||||
<ng-container *ngIf="hoveredMixMaterial && hoveredMixMaterial == mixMaterial">
|
||||
<cre-unit-selector [(unit)]="units" [showLabel]="false" [short]="true"></cre-unit-selector>
|
||||
</ng-container>
|
||||
</ng-container>
|
||||
</ng-container>
|
||||
</td>
|
||||
</ng-container>
|
||||
|
||||
<ng-container matColumnDef="buttonRemove">
|
||||
<th mat-header-cell *matHeaderCellDef>
|
||||
<button mat-raised-button color="accent" (click)="addRow()">Ajouter</button>
|
||||
</th>
|
||||
<td mat-cell *matCellDef="let mixMaterial; let i = index">
|
||||
<ng-container *ngIf="hoveredMixMaterial && hoveredMixMaterial == mixMaterial">
|
||||
<button mat-raised-button color="warn" (click)="removeRow(i)">Retirer</button>
|
||||
</ng-container>
|
||||
</td>
|
||||
</ng-container>
|
||||
|
||||
<tr mat-header-row *matHeaderRowDef="tableColumns"></tr>
|
||||
<tr mat-row *matRowDef="let mixMaterial; columns: tableColumns" (mouseover)="hoveredMixMaterial = mixMaterial"></tr>
|
||||
</table>
|
||||
|
||||
<cre-confirm-box
|
||||
*ngIf="editionMode && mix"
|
||||
#deleteConfirmBox
|
||||
message="Voulez-vous vraiment supprimer le mélange {{mix.mixType.name}} de la recette {{recipe.company.name}} - {{recipe.name}}"
|
||||
(confirm)="delete()">
|
||||
</cre-confirm-box>
|
|
@ -1,6 +0,0 @@
|
|||
mat-card
|
||||
max-width: unset !important
|
||||
|
||||
td.units-wrapper p
|
||||
width: 3rem
|
||||
margin-bottom: 0
|
|
@ -1,214 +0,0 @@
|
|||
import {Component, EventEmitter, Input, Output, ViewChild} from '@angular/core'
|
||||
import {
|
||||
Mix,
|
||||
MixMaterial,
|
||||
MixMaterialDto,
|
||||
mixMaterialsAsMixMaterialsDto,
|
||||
Recipe,
|
||||
sortMixMaterialsDto
|
||||
} from '../../../shared/model/recipe.model'
|
||||
import {ErrorHandlingComponent} from '../../../shared/components/subscribing.component'
|
||||
import {MixService} from '../../services/mix.service'
|
||||
import {RecipeService} from '../../services/recipe.service'
|
||||
import {Material, materialComparator} from '../../../shared/model/material.model'
|
||||
import {MaterialService} from '../../../material/service/material.service'
|
||||
import {MaterialTypeService} from '../../../material-type/service/material-type.service'
|
||||
import {FormBuilder, FormControl, Validators} from '@angular/forms'
|
||||
import {UNIT_MILLILITER} from '../../../shared/units'
|
||||
import {MatTable} from '@angular/material/table'
|
||||
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 {CreInputEntry} from '../../../shared/components/inputs/inputs';
|
||||
import {CreForm, ICreForm} from '../../../shared/components/forms/forms';
|
||||
|
||||
@Component({
|
||||
selector: 'cre-mix-editor',
|
||||
templateUrl: './mix-editor.component.html',
|
||||
styleUrls: ['./mix-editor.component.sass']
|
||||
})
|
||||
export class MixEditorComponent extends ErrorHandlingComponent {
|
||||
@ViewChild(MatTable, {static: true}) 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[] = []
|
||||
|
||||
@Output() save = new EventEmitter<any>()
|
||||
|
||||
editionMode = false
|
||||
units = UNIT_MILLILITER
|
||||
hoveredMixMaterial: MixMaterial | null
|
||||
tableColumns = ['position', 'buttonsPosition', 'material', 'quantity', 'units', 'buttonRemove']
|
||||
|
||||
deleting = false
|
||||
errorHandlers = [{
|
||||
filter: error => error.type === 'notfound-mix-id',
|
||||
consumer: _ => this.urlUtils.navigateTo('/color/list')
|
||||
}, {
|
||||
filter: error => error.type === 'exists-material-name',
|
||||
messageProducer: error => `Un produit avec le nom '${error.name}' existe déjà`
|
||||
}, {
|
||||
filter: error => error.type === 'cannotdelete-mix',
|
||||
messageProducer: _ => 'Ce mélange est utilisé par un ou plusieurs autres mélanges'
|
||||
}, {
|
||||
filter: error => error.type === 'invalid-mixmaterial-first',
|
||||
messageProducer: _ => 'La quantité du premier ingrédient du mélange ne peut pas être exprimée en pourcentage'
|
||||
}]
|
||||
|
||||
controls: any
|
||||
materialTypeEntries$ = this.materialTypeService.all.pipe(
|
||||
map(materialTypes => materialTypes.map(materialType => new CreInputEntry(materialType.id, materialType.name))),
|
||||
)
|
||||
|
||||
private _mixMaterials: MixMaterialDto[] = []
|
||||
|
||||
constructor(
|
||||
private mixService: MixService,
|
||||
private recipeService: RecipeService,
|
||||
private materialService: MaterialService,
|
||||
private materialTypeService: MaterialTypeService,
|
||||
private accountService: AccountService,
|
||||
private formBuilder: FormBuilder,
|
||||
errorService: ErrorService,
|
||||
router: Router,
|
||||
activatedRoute: ActivatedRoute
|
||||
) {
|
||||
super(errorService, activatedRoute, router)
|
||||
}
|
||||
|
||||
ngOnInit() {
|
||||
super.ngOnInit()
|
||||
|
||||
this.mixId = this.urlUtils.parseIntUrlParam('id')
|
||||
if (this.mixId) {
|
||||
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.createControls()
|
||||
}
|
||||
|
||||
private createControls() {
|
||||
this.controls = {
|
||||
name: new FormControl(this.mix?.mixType.name, Validators.required),
|
||||
materialType: new FormControl(this.mix?.mixType.material.materialType.id, Validators.required)
|
||||
}
|
||||
}
|
||||
|
||||
addRow() {
|
||||
this.addBlankMixMaterial()
|
||||
this.mixTable.renderRows()
|
||||
}
|
||||
|
||||
removeRow(position: number) {
|
||||
this.mixMaterials.splice(position, 1)
|
||||
|
||||
// Decreases the position of each mix material above the removed one
|
||||
for (let i = position; i < this.mixMaterials.length; i++) {
|
||||
this.mixMaterials[i].position -= 1
|
||||
}
|
||||
|
||||
this.mixTable.renderRows()
|
||||
}
|
||||
|
||||
increasePosition(mixMaterial: MixMaterialDto, table: MatTable<any>) {
|
||||
this.updateMixMaterialPosition(mixMaterial, mixMaterial.position + 1)
|
||||
this.sort(table)
|
||||
}
|
||||
|
||||
decreasePosition(mixMaterial: MixMaterialDto, table: MatTable<any>) {
|
||||
this.updateMixMaterialPosition(mixMaterial, mixMaterial.position - 1)
|
||||
this.sort(table)
|
||||
}
|
||||
|
||||
sort(table: MatTable<any>) {
|
||||
this.mixMaterials = sortMixMaterialsDto(this.mixMaterials)
|
||||
table.renderRows()
|
||||
}
|
||||
|
||||
setMixMaterialMaterial(mixMaterial: MixMaterialDto, materialId: number) {
|
||||
mixMaterial.isPercents = this.materials.find(m => m.id === materialId).materialType.usePercentages
|
||||
mixMaterial.materialId = materialId
|
||||
}
|
||||
|
||||
submit() {
|
||||
this.save.emit({
|
||||
name: this.controls.name.value,
|
||||
recipeId: this.recipe.id,
|
||||
materialTypeId: this.controls.materialType.value,
|
||||
mixMaterials: this.mixMaterials,
|
||||
units: this.units
|
||||
})
|
||||
}
|
||||
|
||||
delete() {
|
||||
this.deleting = true
|
||||
this.subscribeAndNavigate(this.mixService.delete(this.mixId), `/color/edit/${this.recipe.id}`)
|
||||
}
|
||||
|
||||
getAvailableMaterials(mixMaterial: MixMaterialDto): CreInputEntry[] {
|
||||
// return this.materialService.all.pipe(
|
||||
// map(materials => materials.filter(material => {
|
||||
// return mixMaterial.materialId === material.id || this.mixMaterials.filter(mm => mm.materialId === material.id).length === 0
|
||||
// })),
|
||||
// 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))
|
||||
// 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)
|
||||
// .sort(materialComparator)
|
||||
// .map(material => new CreInputEntry(material.id, material.name))
|
||||
}
|
||||
|
||||
materialDisplayName(material: Material): string {
|
||||
if (material.materialType.prefix) {
|
||||
return `[${material.materialType.prefix}] ${material.name}`
|
||||
}
|
||||
return material.name
|
||||
}
|
||||
|
||||
get mixMaterials(): MixMaterialDto[] {
|
||||
return this._mixMaterials
|
||||
}
|
||||
|
||||
set mixMaterials(mixMaterials: MixMaterialDto[]) {
|
||||
this._mixMaterials = mixMaterials
|
||||
this.mixTable.renderRows()
|
||||
}
|
||||
|
||||
private addBlankMixMaterial() {
|
||||
const mixMaterial = new MixMaterialDto(null, 0, false, this.mixMaterials.length + 1)
|
||||
this.mixMaterials = [...this.mixMaterials, mixMaterial]
|
||||
}
|
||||
|
||||
private updateMixMaterialPosition(mixMaterial: MixMaterialDto, updatedPosition: number) {
|
||||
if (!this.mixMaterialAtPosition(updatedPosition)) {
|
||||
mixMaterial.position = updatedPosition
|
||||
} else {
|
||||
const conflictingStep = this.mixMaterialAtPosition(updatedPosition)
|
||||
conflictingStep.position = mixMaterial.position
|
||||
mixMaterial.position = updatedPosition
|
||||
}
|
||||
}
|
||||
|
||||
private mixMaterialAtPosition(position: number): MixMaterialDto {
|
||||
return this.mixMaterials.find(m => m.position === position)
|
||||
}
|
||||
}
|
|
@ -191,12 +191,13 @@ export class MixTableComponent extends SubscribingComponent {
|
|||
materialId: quantity.materialId,
|
||||
quantity: this.calculateQuantity(index),
|
||||
isPercents: quantity.isPercents,
|
||||
position: quantity.position
|
||||
position: quantity.position,
|
||||
units: UNIT_MILLILITER
|
||||
})
|
||||
}
|
||||
|
||||
private convertQuantities(newUnit: string) {
|
||||
this.mixMaterials.forEach(q => q.quantity = convertMixMaterialQuantity(q, this.units, newUnit))
|
||||
this.mixMaterials.forEach(q => q.quantity = convertMixMaterialQuantity(q, newUnit))
|
||||
this.units = newUnit
|
||||
}
|
||||
|
||||
|
|
|
@ -1,10 +1,10 @@
|
|||
<ng-container *ngIf="recipe">
|
||||
<cre-action-bar>
|
||||
<cre-action-group>
|
||||
<cre-primary-button>Retour</cre-primary-button>
|
||||
<cre-primary-button routerLink="/color/edit/{{recipe.id}}">Retour</cre-primary-button>
|
||||
</cre-action-group>
|
||||
<cre-action-group>
|
||||
<cre-submit-button [valid]="form.valid">Enregistrer</cre-submit-button>
|
||||
<cre-accent-button [disabled]="!form.valid" (click)="submit(form.formValues)">Enregistrer</cre-accent-button>
|
||||
</cre-action-group>
|
||||
</cre-action-bar>
|
||||
|
||||
|
|
|
@ -8,7 +8,7 @@
|
|||
<cre-table [hidden]="materialCount <= 0" class="mx-auto" [dataSource]="mixMaterials" [columns]="columns">
|
||||
<ng-container matColumnDef="position">
|
||||
<th mat-header-cell *matHeaderCellDef>Position</th>
|
||||
<td mat-cell *matCellDef="let mixMaterial">{{mixMaterial.position + 1}}</td>
|
||||
<td mat-cell *matCellDef="let mixMaterial">{{mixMaterial.position}}</td>
|
||||
</ng-container>
|
||||
|
||||
<ng-container matColumnDef="positionButtons">
|
||||
|
@ -16,8 +16,10 @@
|
|||
<td mat-cell *matCellDef="let mixMaterial">
|
||||
<cre-table-position-buttons
|
||||
[position]="mixMaterial.position"
|
||||
[min]="0"
|
||||
[max]="mixMaterials.length - 1"
|
||||
[min]="1"
|
||||
[max]="mixMaterials.length"
|
||||
[disableDecreaseButton]="isDecreasePositionButtonDisabled(mixMaterial)"
|
||||
[disableIncreaseButton]="isIncreasePositionButtonDisabled(mixMaterial)"
|
||||
(positionChange)="updatePosition(mixMaterial, $event)">
|
||||
</cre-table-position-buttons>
|
||||
</td>
|
||||
|
|
|
@ -8,6 +8,7 @@ import {takeUntil} from 'rxjs/operators'
|
|||
import {CreComboBoxComponent, CreInputEntry} from '../../shared/components/inputs/inputs'
|
||||
import {AccountService} from '../../accounts/services/account.service'
|
||||
import {Permission} from '../../shared/model/user'
|
||||
import {UNIT_MILLILITER} from "../../shared/units";
|
||||
|
||||
@Component({
|
||||
selector: 'cre-mix-materials-form',
|
||||
|
@ -51,11 +52,11 @@ export class MixMaterialsForm implements AfterViewInit, OnDestroy {
|
|||
|
||||
addRow() {
|
||||
const position = this.nextPosition
|
||||
const mixMaterial = new MixMaterialDto(null, 0, false, position)
|
||||
const mixMaterial = new MixMaterialDto(null, 0, false, position, UNIT_MILLILITER)
|
||||
|
||||
const materialIdControl = new FormControl(null, Validators.required)
|
||||
const quantityControl = new FormControl(0, Validators.required)
|
||||
const unitsControl = new FormControl(null, Validators.required)
|
||||
const materialIdControl = new FormControl(mixMaterial.materialId, Validators.required)
|
||||
const quantityControl = new FormControl(mixMaterial.quantity, Validators.required)
|
||||
const unitsControl = new FormControl(mixMaterial.units, Validators.required)
|
||||
|
||||
materialIdControl.valueChanges
|
||||
.pipe(takeUntil(this._destroy$))
|
||||
|
@ -85,7 +86,9 @@ export class MixMaterialsForm implements AfterViewInit, OnDestroy {
|
|||
}
|
||||
|
||||
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._availableMaterialsEntries = this._availableMaterialsEntries.filter(x => x.position !== mixMaterial.position)
|
||||
|
||||
for (let position = mixMaterial.position + 1; position < this.mixMaterials.length; position++) {
|
||||
this.updatePosition(this.getMixMaterialByPosition(position), position - 1, false)
|
||||
|
@ -121,6 +124,23 @@ export class MixMaterialsForm implements AfterViewInit, OnDestroy {
|
|||
return mixMaterial.materialId ? this._allMaterials.filter(x => x.id === mixMaterial.materialId)[0].materialType.usePercentages : false
|
||||
}
|
||||
|
||||
isDecreasePositionButtonDisabled(mixMaterial: MixMaterialDto): boolean {
|
||||
return mixMaterial.position <= 2 && this.areUnitsPercents(mixMaterial)
|
||||
}
|
||||
|
||||
isIncreasePositionButtonDisabled(mixMaterial: MixMaterialDto): boolean {
|
||||
if (mixMaterial.position === this.mixMaterials.length) {
|
||||
return true
|
||||
}
|
||||
|
||||
if (mixMaterial.position > 1) {
|
||||
return false
|
||||
}
|
||||
|
||||
const nextMixMaterial = this.getMixMaterialByPosition(mixMaterial.position + 1)
|
||||
return this.areUnitsPercents(nextMixMaterial)
|
||||
}
|
||||
|
||||
get hasMaterialEditPermission(): boolean {
|
||||
return this.accountService.hasPermission(Permission.EDIT_MATERIALS)
|
||||
}
|
||||
|
@ -129,6 +149,21 @@ export class MixMaterialsForm implements AfterViewInit, OnDestroy {
|
|||
return this._allMaterials ? this._allMaterials.length : 0
|
||||
}
|
||||
|
||||
get updatedMixMaterials(): MixMaterialDto[] {
|
||||
const updatedMixMaterials: MixMaterialDto[] = []
|
||||
this.mixMaterials.forEach(mixMaterial => {
|
||||
const controls = this.getControlsByPosition(mixMaterial.position).controls
|
||||
updatedMixMaterials.push({
|
||||
materialId: controls.materialId.value,
|
||||
quantity: controls.quantity.value,
|
||||
position: mixMaterial.position,
|
||||
units: controls.units.value,
|
||||
isPercents: this.areUnitsPercents(mixMaterial)
|
||||
})
|
||||
})
|
||||
return updatedMixMaterials
|
||||
}
|
||||
|
||||
get valid(): boolean {
|
||||
return this._controls
|
||||
.map(controls => controls.controls)
|
||||
|
@ -138,7 +173,7 @@ export class MixMaterialsForm implements AfterViewInit, OnDestroy {
|
|||
}
|
||||
|
||||
private get nextPosition(): number {
|
||||
return this.mixMaterials.length
|
||||
return this.mixMaterials.length + 1
|
||||
}
|
||||
|
||||
private getMixMaterialByPosition(position: number): MixMaterialDto {
|
||||
|
@ -170,7 +205,7 @@ export class MixMaterialsForm implements AfterViewInit, OnDestroy {
|
|||
return this._allMaterials
|
||||
.filter(material => {
|
||||
// Prevent use of percents in first position
|
||||
if (material.materialType.usePercentages && mixMaterial.position === 0) {
|
||||
if (material.materialType.usePercentages && mixMaterial.position <= 1) {
|
||||
return false
|
||||
}
|
||||
|
||||
|
|
|
@ -14,6 +14,7 @@ import {Material} from '../../shared/model/material.model'
|
|||
import {MaterialService} from '../../material/service/material.service'
|
||||
import {CreForm} from '../../shared/components/forms/forms'
|
||||
import {MixMaterialsForm} from './materials-form'
|
||||
import {MixSaveDto, MixService} from "../services/mix.service";
|
||||
|
||||
@Component({
|
||||
selector: 'cre-mix-add',
|
||||
|
@ -26,6 +27,7 @@ export class MixAdd extends SubscribingComponent {
|
|||
private _recipe: Recipe | null
|
||||
|
||||
constructor(
|
||||
private mixService: MixService,
|
||||
private recipeService: RecipeService,
|
||||
private materialTypeService: MaterialTypeService,
|
||||
private materialService: MaterialService,
|
||||
|
@ -49,6 +51,13 @@ export class MixAdd extends SubscribingComponent {
|
|||
)
|
||||
}
|
||||
|
||||
submit(dto: MixSaveDto) {
|
||||
this.subscribeAndNavigate(
|
||||
this.mixService.saveDto(dto),
|
||||
`/color/edit/${this.recipe.id}`
|
||||
)
|
||||
}
|
||||
|
||||
set recipe(recipe: Recipe) {
|
||||
this._recipe = recipe
|
||||
this.materials$ = this.materialService.getAllForMixCreation(recipe.id)
|
||||
|
@ -110,6 +119,15 @@ export class MixForm {
|
|||
@Input() materialTypes: Observable<MaterialType[]>
|
||||
@Input() materials: Observable<Material[]>
|
||||
|
||||
get formValues(): MixSaveDto {
|
||||
return {
|
||||
name: this.infoForm.mixName,
|
||||
recipeId: this.recipe.id,
|
||||
materialTypeId: this.infoForm.mixMaterialTypeId,
|
||||
mixMaterials: this.mixMaterialsForm.updatedMixMaterials
|
||||
}
|
||||
}
|
||||
|
||||
get valid(): boolean {
|
||||
return this.infoForm?.valid && this.mixMaterialsForm?.valid
|
||||
}
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
<cre-mix-editor
|
||||
*ngIf="recipe && materials"
|
||||
[recipe]="recipe"
|
||||
[materials]="materials"
|
||||
(save)="submit($event)">
|
||||
</cre-mix-editor>
|
||||
<!--<cre-mix-editor-->
|
||||
<!-- *ngIf="recipe && materials"-->
|
||||
<!-- [recipe]="recipe"-->
|
||||
<!-- [materials]="materials"-->
|
||||
<!-- (save)="submit($event)">-->
|
||||
<!--</cre-mix-editor>-->
|
||||
|
|
|
@ -54,7 +54,7 @@ export class MixAddComponent extends ErrorHandlingComponent {
|
|||
|
||||
submit(values) {
|
||||
this.subscribeAndNavigate(
|
||||
this.mixService.saveWithUnits(values.name, values.recipeId, values.materialTypeId, values.mixMaterials, values.units),
|
||||
this.mixService.saveWithUnits(values.name, values.recipeId, values.materialTypeId, values.mixMaterials),
|
||||
`/color/edit/${this.recipeId}`
|
||||
)
|
||||
}
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
<cre-mix-editor
|
||||
[mixId]="mixId"
|
||||
[recipe]="recipe"
|
||||
[materials]="materials"
|
||||
(save)="submit($event)">
|
||||
</cre-mix-editor>
|
||||
<!--<cre-mix-editor-->
|
||||
<!-- [mixId]="mixId"-->
|
||||
<!-- [recipe]="recipe"-->
|
||||
<!-- [materials]="materials"-->
|
||||
<!-- (save)="submit($event)">-->
|
||||
<!--</cre-mix-editor>-->
|
||||
|
|
|
@ -64,7 +64,7 @@ export class MixEditComponent extends ErrorHandlingComponent {
|
|||
}
|
||||
|
||||
this.subscribeAndNavigate(
|
||||
this.mixService.updateWithUnits(this.mixId, values.name, values.materialTypeId, values.mixMaterials, values.units),
|
||||
this.mixService.updateWithUnits(this.mixId, values.name, values.materialTypeId, values.mixMaterials),
|
||||
`/color/edit/${this.recipeId}`
|
||||
)
|
||||
}
|
||||
|
|
|
@ -9,7 +9,6 @@ import {RecipeInfoComponent} from './components/recipe-info/recipe-info.componen
|
|||
import {MixTableComponent} from './components/mix-table/mix-table.component'
|
||||
import {StepListComponent} from './components/step-list/step-list.component'
|
||||
import {StepTableComponent} from './components/step-table/step-table.component'
|
||||
import {MixEditorComponent} from './components/mix-editor/mix-editor.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'
|
||||
|
@ -32,7 +31,6 @@ import {MixMaterialsForm} from "./mix/materials-form";
|
|||
MixTableComponent,
|
||||
StepListComponent,
|
||||
StepTableComponent,
|
||||
MixEditorComponent,
|
||||
UnitSelectorComponent,
|
||||
MixAddComponent,
|
||||
MixEditComponent,
|
||||
|
|
|
@ -21,8 +21,17 @@ export class MixService {
|
|||
return this.api.get<Mix>(`/recipe/mix/${id}`)
|
||||
}
|
||||
|
||||
saveWithUnits(name: string, recipeId: number, materialTypeId: number, mixMaterials: MixMaterialDto[], units: string): Observable<void> {
|
||||
return this.save(name, recipeId, materialTypeId, this.convertMixMaterialsToMl(mixMaterials, units))
|
||||
saveDto(dto: MixSaveDto): Observable<void> {
|
||||
return this.saveWithUnits(
|
||||
dto.name,
|
||||
dto.recipeId,
|
||||
dto.materialTypeId,
|
||||
dto.mixMaterials,
|
||||
)
|
||||
}
|
||||
|
||||
saveWithUnits(name: string, recipeId: number, materialTypeId: number, mixMaterials: MixMaterialDto[]): Observable<void> {
|
||||
return this.save(name, recipeId, materialTypeId, this.convertMixMaterialsToMl(mixMaterials))
|
||||
}
|
||||
|
||||
save(name: string, recipeId: number, materialTypeId: number, mixMaterials: MixMaterialDto[]): Observable<void> {
|
||||
|
@ -36,8 +45,8 @@ export class MixService {
|
|||
return this.api.post('/recipe/mix', body)
|
||||
}
|
||||
|
||||
updateWithUnits(id: number, name: string, materialTypeId: number, mixMaterials: MixMaterialDto[], units: string): Observable<void> {
|
||||
return this.update(id, name, materialTypeId, this.convertMixMaterialsToMl(mixMaterials, units))
|
||||
updateWithUnits(id: number, name: string, materialTypeId: number, mixMaterials: MixMaterialDto[]): Observable<void> {
|
||||
return this.update(id, name, materialTypeId, this.convertMixMaterialsToMl(mixMaterials))
|
||||
}
|
||||
|
||||
update(id: number, name: string, materialTypeId: number, mixMaterials: MixMaterialDto[]): Observable<void> {
|
||||
|
@ -56,11 +65,12 @@ export class MixService {
|
|||
return this.api.delete(`/recipe/mix/${id}`)
|
||||
}
|
||||
|
||||
private convertMixMaterialsToMl(mixMaterials: MixMaterialDto[], units: string): MixMaterialDto[] {
|
||||
return mixMaterials.map(m => {
|
||||
m.quantity = convertMixMaterialQuantity(m, units, UNIT_MILLILITER)
|
||||
return m
|
||||
})
|
||||
private convertMixMaterialsToMl(mixMaterials: MixMaterialDto[]): MixMaterialDto[] {
|
||||
return mixMaterials.map(mixMaterial => ({
|
||||
...mixMaterial,
|
||||
quantity: convertMixMaterialQuantity(mixMaterial, UNIT_MILLILITER),
|
||||
units: UNIT_MILLILITER
|
||||
}))
|
||||
}
|
||||
|
||||
private appendMixMaterialsToBody(mixMaterials: MixMaterialDto[], body: any) {
|
||||
|
@ -74,3 +84,10 @@ export class MixService {
|
|||
}
|
||||
}
|
||||
|
||||
export interface MixSaveDto {
|
||||
name: string
|
||||
recipeId: number
|
||||
materialTypeId: number
|
||||
mixMaterials: MixMaterialDto[]
|
||||
}
|
||||
|
||||
|
|
|
@ -1,14 +1,13 @@
|
|||
<mat-form-field>
|
||||
<mat-label>{{label}}</mat-label>
|
||||
<mat-select [attr.formControl]="control ? control : null">
|
||||
<mat-select [formControl]="control">
|
||||
<ng-container *ngIf="entriesAreObservable">
|
||||
<ng-container
|
||||
*ngFor="let entry of (observableEntries | async)">
|
||||
<mat-option [value]="entry.key">{{entry.display || entry.value}}</mat-option>
|
||||
</ng-container>
|
||||
</ng-container>
|
||||
<ng-container
|
||||
*ngIf="!entriesAreObservable">
|
||||
<ng-container *ngIf="!entriesAreObservable">
|
||||
<mat-option *ngFor="let entry of arrayEntries" [value]="entry.key">
|
||||
{{entry.display || entry.value}}
|
||||
</mat-option>
|
||||
|
|
|
@ -3,14 +3,14 @@
|
|||
mat-mini-fab
|
||||
color="primary"
|
||||
class="mr-1"
|
||||
[disabled]="position <= min"
|
||||
[disabled]="disableDecreaseButton || position <= min"
|
||||
(click)="decreasePosition()">
|
||||
<mat-icon svgIcon="arrow-up"></mat-icon>
|
||||
</button>
|
||||
<button
|
||||
mat-mini-fab
|
||||
color="primary"
|
||||
[disabled]="position >= max"
|
||||
[disabled]="disableIncreaseButton || position >= max"
|
||||
(click)="increasePosition()">
|
||||
<mat-icon svgIcon="arrow-down"></mat-icon>
|
||||
</button>
|
||||
|
|
|
@ -95,6 +95,8 @@ export class CrePositionButtons {
|
|||
@Input() min = 0
|
||||
@Input() max: number
|
||||
@Input() hidden = false
|
||||
@Input() disableDecreaseButton = false
|
||||
@Input() disableIncreaseButton = false
|
||||
|
||||
@Output() positionChange = new EventEmitter<number>();
|
||||
|
||||
|
|
|
@ -1,6 +1,7 @@
|
|||
import {Material} from './material.model'
|
||||
import {Company} from './company.model'
|
||||
import {Group} from './user'
|
||||
import {UNIT_MILLILITER} from "../units";
|
||||
|
||||
export class Recipe {
|
||||
public id: number
|
||||
|
@ -53,7 +54,8 @@ export class MixMaterialDto {
|
|||
public materialId: number,
|
||||
public quantity: number,
|
||||
public isPercents: boolean,
|
||||
public position: number
|
||||
public position: number,
|
||||
public units: string
|
||||
) {
|
||||
}
|
||||
}
|
||||
|
@ -103,7 +105,8 @@ export function mixMaterialsAsMixMaterialsDto(mix: Mix): MixMaterialDto[] {
|
|||
m.material.id,
|
||||
m.quantity,
|
||||
m.material.materialType.usePercentages,
|
||||
m.position
|
||||
m.position,
|
||||
UNIT_MILLILITER
|
||||
)))
|
||||
}
|
||||
|
||||
|
|
|
@ -25,8 +25,8 @@ export const UNIT_RATIOS = {
|
|||
}
|
||||
}
|
||||
|
||||
export function convertMixMaterialQuantity(computedQuantity: MixMaterialDto, from: string, to: string): number {
|
||||
return !computedQuantity.isPercents ? convertQuantity(computedQuantity.quantity, from, to) : computedQuantity.quantity
|
||||
export function convertMixMaterialQuantity(mixMaterial: MixMaterialDto, to: string): number {
|
||||
return !mixMaterial.isPercents ? convertQuantity(mixMaterial.quantity, mixMaterial.units, to) : mixMaterial.quantity
|
||||
}
|
||||
|
||||
export function convertQuantity(quantity: number, from: string, to: string): number {
|
||||
|
|
Loading…
Reference in New Issue