import { Component, OnInit } from '@angular/core';
import { ActivatedRoute } from '@angular/router';
import { NavController } from '@ionic/angular';
import { IonBackButton, IonButtons, IonContent, IonHeader, IonItem, IonLabel, IonList, IonThumbnail, IonTitle, IonToolbar } from '@ionic/angular/standalone';

interface Recipe {
  id: number;
  title: string;
  imageUrl: string;
  description?: string;
  cookTime?: string;
  rating?: number;
}

@Component({
  selector: 'app-page-type',
  templateUrl: './page-type.page.html',
  styleUrls: ['./page-type.page.scss'],
  standalone: false,
  //imports: [IonHeader, IonToolbar, IonTitle, IonContent, IonBackButton, IonButtons, IonList, IonItem, IonThumbnail, IonLabel]
})
export class PageTypePage implements OnInit {
  categoryName: string = '分类名称';
  recipes: Recipe[] = [];

  constructor(private route: ActivatedRoute,private navCtrl: NavController) {}

  ngOnInit() {
    // 从路由参数获取分类名称
    this.categoryName = this.route.snapshot.paramMap.get('name') || '分类名称';
    
    // 加载该分类下的菜品数据
    this.loadRecipes();
  }

  loadRecipes() {
    // 模拟数据 - 实际应用中应该从API获取
    this.recipes = [
      {
        id: 1,
        title: '经典意大利肉酱面',
        imageUrl: 'https://images.unsplash.com/photo-1555949258-eb67b1ef0ceb',
        description: '传统意大利风味肉酱面，酱汁浓郁，面条劲道',
        cookTime: '45分钟',
        rating: 4.5
      },
      {
        id: 2,
        title: '奶油蘑菇意面',
        imageUrl: 'https://images.unsplash.com/photo-1611270629569',
        description: '奶油香浓，蘑菇鲜美，意面口感绝佳',
        cookTime: '30分钟',
        rating: 4.8
      },
      {
        id: 3,
        title: '番茄罗勒意面',
        imageUrl: 'https://images.unsplash.com/photo-1608755728476',
        description: '新鲜番茄与罗勒的完美结合，清爽可口',
        cookTime: '25分钟',
        rating: 4.3
      },
      {
        id: 4,
        title: '海鲜意大利面',
        imageUrl: 'https://images.unsplash.com/photo-1516100882582',
        description: '多种海鲜搭配，鲜香浓郁',
        cookTime: '35分钟',
        rating: 4.7
      },
      {
        id: 5,
        title: '千层面',
        imageUrl: 'https://images.unsplash.com/photo-1611273426858',
        description: '层层美味，奶酪与肉酱的完美融合',
        cookTime: '60分钟',
        rating: 4.9
      }
    ];
  }

  goToDetail() {
    this.navCtrl.navigateForward(["tabs","tab1","page-detail"]);
    console.log('Navigating to page-detail');
  }
}