pakin/Taobin-Recipe-Manager
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

update test get recipe metadatas

Browse source
This commit is contained in:
Kenta420 2023-10-05 09:39:25 +07:00
parent 41812591b7
commit 7450796a6b
4 changed files with 95 additions and 37 deletions
Download patch file Download diff file Expand all files Collapse all files

24
client/src/app/core/services/recipe.service.ts
View file

@ -60,8 +60,28 @@ export class RecipeService {
return 'coffeethai02_580.json';
}
getRecipesById(id: string): Observable<Recipe01> {
return this._httpClient.get<Recipe01>(environment.api + '/recipes/' + id, {
getRecipesById(id: string): Observable<{
recipe: Recipe01;
recipeMetaData: {
productCode: string;
name: string;
otherName: string;
description: string;
otherDescription: string;
picture: string;
};
}> {
return this._httpClient.get<{
recipe: Recipe01;
recipeMetaData: {
productCode: string;
name: string;
otherName: string;
description: string;
otherDescription: string;
picture: string;
};
}>(environment.api + '/recipes/' + id, {
withCredentials: true,
responseType: 'json',
});

6
client/src/app/shared/modal/recipe-details/recipe-modal.component.html
View file

@ -24,7 +24,11 @@
<div class="modal-scroll">
<form class="flex flex-col gap-2" [formGroup]="recipeDetail">
<div class="flex gap-5">
<div class="bg-gray-500 w-[300px] h-[300px]">Picture</div>
<img
src="{{ recipeMetaData?.picture }}.png"
width="300"
height="400"
/>
<div class="grid grid-cols-2 gap-4 w-full">
<div class="flex items-center">
<label class="label"

52
client/src/app/shared/modal/recipe-details/recipe-modal.component.ts
View file

@ -22,6 +22,15 @@ interface RecipeDetail {
disable: boolean;
}
interface RecipeMetaData {
productCode: string;
name: string;
otherName: string;
description: string;
otherDescription: string;
picture: string;
}
@Component({
selector: 'recipe-modal',
templateUrl: './recipe-modal.component.html',
@ -45,6 +54,8 @@ export class RecipeModalComponent {
disable: new FormControl<boolean>(false),
});
recipeMetaData: RecipeMetaData | null = null;
originalRecipeDetail: RecipeDetail | null = null;
private detailModal: ElementRef<HTMLDialogElement> | null = null;
@ -61,10 +72,25 @@ export class RecipeModalComponent {
this.detailModal?.nativeElement.showModal();
if (this.detailModal?.nativeElement.open) {
this.recipeService.getRecipesById(this.id).subscribe((recipe) => {
this.title = recipe.name + ' | ' + recipe.productCode;
this.recipeDetail.patchValue(
{
this.recipeService
.getRecipesById(this.id)
.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,
},
{ emitEvent: false }
);
this.originalRecipeDetail = {
productCode: recipe.productCode,
name: recipe.name,
otherName: recipe.otherName,
@ -74,21 +100,9 @@ export class RecipeModalComponent {
isUse: recipe.isUse,
isShow: recipe.isShow,
disable: recipe.disable,
},
{ emitEvent: false }
);
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;
});
}
}