change dashboard -> recipe

This commit is contained in:
Kenta420 2023-10-06 09:11:01 +07:00
parent e95078307b
commit 36be0426f6
9 changed files with 71 additions and 40 deletions

View file

@ -1,131 +0,0 @@
import { NgIf } from '@angular/common';
import { Component, EventEmitter, OnInit } from '@angular/core';
import { FormControl, FormGroup, ReactiveFormsModule } from '@angular/forms';
import { ActivatedRoute, Router, RouterLink } from '@angular/router';
import { isEqual } from 'lodash';
import { delay } from 'rxjs';
import { RecipeService } from 'src/app/core/services/recipe.service';
import { ConfirmModal } from 'src/app/shared/modal/confirm/confirm-modal.component';
interface RecipeDetail {
productCode: string;
name: string;
otherName: string;
description: string;
otherDescription: string;
price: number;
isUse: boolean;
isShow: boolean;
disable: boolean;
}
interface RecipeMetaData {
productCode: string;
name: string;
otherName: string;
description: string;
otherDescription: string;
picture: string;
}
@Component({
selector: 'app-recipe-details',
templateUrl: './recipe-details.component.html',
standalone: true,
imports: [NgIf, RouterLink, ReactiveFormsModule, ConfirmModal],
})
export class RecipeDetailsComponent implements OnInit {
title: string = 'Recipe Detail';
recipeMetaData: RecipeMetaData | null = null;
originalRecipeDetail: RecipeDetail | null = null;
isLoaded: boolean = false;
constructor(
private _route: ActivatedRoute,
private _router: Router,
private _recipeService: RecipeService
) {}
recipeDetail = new FormGroup({
productCode: new FormControl<string>(''),
name: new FormControl<string>(''),
otherName: new FormControl<string>(''),
description: new FormControl<string>(''),
otherDescription: new FormControl<string>(''),
price: new FormControl<number>(0),
isUse: new FormControl<boolean>(false),
isShow: new FormControl<boolean>(false),
disable: new FormControl<boolean>(false),
});
ngOnInit() {
this._recipeService
.getRecipesById(this._route.snapshot.params['productCode'])
.subscribe(({ recipe, recipeMetaData }) => {
this.title = recipe.name + ' | ' + recipe.productCode;
this.recipeDetail.patchValue({
productCode: recipe.productCode,
name: recipe.name,
otherName: recipe.otherName,
description: recipe.Description,
otherDescription: recipe.otherDescription,
price: recipe.cashPrice,
isUse: recipe.isUse,
isShow: recipe.isShow,
disable: recipe.disable,
});
this.originalRecipeDetail = {
productCode: recipe.productCode,
name: recipe.name,
otherName: recipe.otherName,
description: recipe.Description,
otherDescription: recipe.otherDescription,
price: recipe.cashPrice,
isUse: recipe.isUse,
isShow: recipe.isShow,
disable: recipe.disable,
};
this.recipeMetaData = recipeMetaData;
this.isLoaded = true;
});
}
showConfirmSaveModal: EventEmitter<boolean> = new EventEmitter<boolean>();
showConfirmCloseModal: EventEmitter<boolean> = new EventEmitter<boolean>();
confirmSave = {
title: 'The changes detected!',
message: 'Do you want to save changes?',
confirmCallBack: () => {
console.log('confirm save');
this._router.navigate(['..']);
},
};
confirmClose = {
title: 'The changes will be lost!',
message: 'Do you want to close without saving?',
confirmCallBack: () => {
console.log('confirm close');
this._router.navigate(['..']);
},
};
onPressConfirmSave() {
if (!isEqual(this.recipeDetail.value, this.originalRecipeDetail)) {
this.showConfirmSaveModal.emit(true);
} else {
this._router.navigate(['..']);
}
}
onPressConfirmClose() {
if (!isEqual(this.recipeDetail.value, this.originalRecipeDetail)) {
this.showConfirmCloseModal.emit(true);
} else {
this._router.navigate(['..']);
}
}
}