添加菜品

projects/admin/src/app/components/dish-form/dish-form.component.html

@@ -141,18 +141,18 @@
             <ul class="mt-4">
                 <li class="mb-2" *ngFor="let f of foodItemSelected;let i = index">
                     <div class="flex items-center">
-                        <div class="w-40 pr-2">
+                        <!-- <div class="w-1/2 pr-2">
                             <button nz-button nzBlock>
                                 {{f.value}}-{{f.text}}：
                             </button>
-                        </div>
+                        </div> -->
                         <!-- <div class="pr-2">
                             <nz-select class="!w-[200px]" nzPlaceHolder="食材标签"
                                        formControlName="tag">
                             </nz-select>
                         </div> -->
                         <div class="flex-1 pr-2">
-                            <nz-input-group [nzAddOnAfter]="'g'" class="w-full">
+                            <nz-input-group nzAddOnBefore="{{f.value}}-{{f.text}}：" [nzAddOnAfter]="'g'" class="w-full">
                                 <input
                                        nz-input
                                        type="number"
@@ -161,11 +161,11 @@
                                        placeholder="请输入{{f.value}}-{{f.text}}重量" />
                             </nz-input-group>
                         </div>
-                        <div>
+                        <!-- <div>
                             <button nz-button (click)="removeFood(i)">
                                 <span nz-icon nzType="delete"></span>
                             </button>
-                        </div>
+                        </div> -->
                     </div>
                 </li>
             </ul>

projects/admin/src/app/components/dish-form/dish-form.component.ts

@@ -121,14 +121,24 @@ export class DishFormComponent {
 	}
 
 	setValues() {
-		console.log("this.orgs", this.orgs, this.data);
 		this.orgListOfOption = this.orgs.map((i) => ({ text: i.name, value: i.id }));
+
 		if (this.data) {
 			this.allMonth = this.allMonth.map((i) =>
 				(this.data.month ?? []).includes(i.value) ? { ...i, checked: true } : i
 			);
 			this.monthCheckEffect();
-			// console.log("allMonth", allMonth);
+
+			this.foods.forEach((f) => {
+				const item = { text: f.name, value: f.key };
+				this.foodListOfOption.push(item);
+				this.searchedFood.push(item);
+				const num = this.data.ingredient[f.key];
+				if (num) {
+					this.foodItemSelected.push({ num, ...item });
+					this.foodSelected.push(f.key);
+				}
+			});
 			this.formGroup.patchValue({
 				...this.data,
 				vendors: [this.data.vender],
@@ -184,7 +194,19 @@ export class DishFormComponent {
 	}
 
 	onFoodSelected(v: string[]) {
-		this.foodItemSelected = this.searchedFood.filter((f) => v.includes(f.value));
+		this.foodItemSelected = [];
+		this.searchedFood.forEach((item) => {
+			if (this.foodItemSelected.some((s) => s.value === item.value)) {
+				return;
+			}
+			if (v.includes(item.value)) {
+				this.foodItemSelected.push(item);
+			}
+		});
+
+		// this.foodItemSelected = this.searchedFood.filter((f) => {
+		//     return v.includes(f.value)
+		// });
 	}
 
 	addFood() {

projects/admin/src/app/pages/dish/dish.component.html

@@ -56,19 +56,19 @@
                             </div>
                         </ng-container>
                         <ng-container *ngSwitchCase="'vender'">
-                            {{tableOrg[data]?.name || '-'}}
+                            {{ tableOrg[data] ? tableOrg[data].name : '-'}}
                         </ng-container>
                         <ng-container *ngSwitchCase="'foodArr'">
                             <div class=" flex flex-wrap">
-                                <nz-tag *ngFor="let item of data" class="m-1">
+                                <ng-container *ngFor="let item of data">
-                                    {{item.label}}：{{item.value}}{{item.measurement}}
+                                    <nz-tag *ngIf="tableFoods[item.key]" class="m-1">
-                                </nz-tag>
+                                        {{tableFoods[item.key]['name']}}：{{item.value}} g
+                                    </nz-tag>
+                                </ng-container>
                             </div>
                         </ng-container>
                         <ng-container *ngSwitchDefault>
-
                             {{data}}
-
                         </ng-container>
                     </ng-container>
                 </ng-template>

projects/admin/src/app/pages/dish/dish.component.ts

@@ -7,6 +7,7 @@ import { ApiService } from "@cdk/services";
 import { Subject, debounceTime, distinctUntilChanged, filter, lastValueFrom, switchMap, takeUntil, tap } from "rxjs";
 import { NzModalService } from "ng-zorro-antd/modal";
 import { NzMessageService } from "ng-zorro-antd/message";
+import { ResponseType } from "@cdk/types";
 
 @Component({
 	selector: "app-dish",
@@ -46,6 +47,8 @@ export class DishComponent {
 
 	tableOrg: { [k: number]: OrgDTO } = {};
 
+	tableFoods: { [k: string]: any } = {};
+
 	listOfOption: Array<{ value: number; text: string }> = [];
 
 	nzFilterOption = (): boolean => true;
@@ -119,22 +122,48 @@ export class DishComponent {
 	fetchData(query: AnyObject, pager: AnyObject) {
 		return this.api.getDishPage(pager, query).pipe(
 			tap((res) => {
-				if (Array.isArray(res.body.content)) {
+				this.getTableColumData(res);
-					this.api.getOrgList({ vendors: res.body.content.map((i) => i.vender) }).subscribe((org) => {
-						if (Array.isArray(org.body)) {
-							this.tableOrg = org.body.reduce((a, c) => {
-								return {
-									...a,
-									[c.id]: c,
-								};
-							}, {} as AnyObject);
-						}
-					});
-				}
 			})
 		);
 	}
 
+	getTableColumData(res: ResponseType) {
+		if (Array.isArray(res.body.content)) {
+			const vendors = res.body.content.map((i: any) => i.vender);
+			const foodKeys = new Set(
+				res.body.content.reduce((a: string[], c: any) => {
+					return a.concat(Object.keys(c.ingredient ?? {}));
+				}, [] as string[])
+			);
+
+			if (vendors.length > 0) {
+				this.api.getOrgList({ vendors }).subscribe((org) => {
+					if (Array.isArray(org.body)) {
+						this.tableOrg = org.body.reduce((a, c) => {
+							return {
+								...a,
+								[c.id]: c,
+							};
+						}, {} as AnyObject);
+					}
+				});
+			}
+			if (foodKeys.size > 0) {
+				this.api.getFoodList({ keys: Array.from(foodKeys) }).subscribe((foods) => {
+					if (Array.isArray(foods.body)) {
+						this.tableFoods = foods.body.reduce((a, c) => {
+							return {
+								...a,
+								[c.key]: c,
+							};
+						}, {} as AnyObject);
+						console.log("this.tableFoods", this.tableFoods);
+					}
+				});
+			}
+		}
+	}
+
 	showFoodForm(data?: any) {
 		this.drawerRef = this.drawer.create({
 			nzTitle: data ? "编辑菜品" : "新增菜品",
@@ -143,6 +172,7 @@ export class DishComponent {
 			nzContentParams: {
 				data,
 				orgs: Object.values(this.tableOrg),
+				foods: Object.values(this.tableFoods),
 			},
 			nzFooter: this.formFooterTpl,
 		});