s202226701040/smarteat-app/src/app/meal-search/meal-search/meal-search.component.ts

import { CommonModule } from '@angular/common';
import { Component, Input, OnInit } from '@angular/core';
import { IonButton, IonButtons, IonCard, IonCardContent, IonCardHeader, IonCardSubtitle, IonCardTitle, IonContent, IonHeader, IonTitle, IonToolbar } from '@ionic/angular/standalone';
import { ModalController } from '@ionic/angular/standalone';
import { MealService } from 'src/app/meal/meal.service';
@Component({
  selector: 'app-meal-search',
  templateUrl: './meal-search.component.html',
  styleUrls: ['./meal-search.component.scss'],
  standalone:true,
  imports: [IonHeader,IonToolbar,IonContent,IonTitle,IonButton,IonButtons,IonCard,IonCardTitle,IonCardHeader,IonCardContent,CommonModule,IonCardSubtitle]
})
export class MealSearchComponent implements OnInit {
  @Input() searchQuery: string = '';  // 从父组件接收搜索词
  meals: any[] = [];  // 存储查询到的菜谱

  constructor(
    private mealService: MealService,
    private modalController: ModalController
  ) {}

  ngOnInit() {
    // 初始化时调用 searchMeals() 进行查询
    if (this.searchQuery.trim()) {
      this.searchMeals();
    }
  }

  // 根据搜索查询获取菜品
  searchMeals() {
    this.mealService.searchMealsByName(this.searchQuery).subscribe(
      (response) => {
        this.meals = response.meals || [];  // 将查询结果赋值给 meals
      },
      (error) => {
        console.error('查询失败', error);
        this.meals = [];  // 如果查询失败，则将 meals 置为空
      }
    );
  }

  // 关闭弹窗
  closeModal() {
    this.modalController.dismiss();
  }

  // 点击菜品查看详细信息
}