import { Component, OnInit } from '@angular/core';
import { ActivatedRoute } from '@angular/router';
import { NavController } from '@ionic/angular';
import { 
  IonHeader, IonToolbar, IonTitle, IonContent, 
  IonBackButton, IonButtons, IonList, IonItem, 
  IonThumbnail, IonLabel, IonButton, IonIcon 
} from '@ionic/angular/standalone';
import { addIcons } from 'ionicons';
import { 
  restaurant, chevronForward, timeOutline, 
  star, cloudUploadOutline, fastFoodOutline 
} from 'ionicons/icons';
import { importAllData } from '../../import-recipe-data';
import { CloudObject, CloudQuery } from 'src/lib/ncloud';

/**
 * 食谱接口定义
 * @interface Recipe
 */
interface Recipe {
  /** 食谱ID */
  id: number;
  /** 食谱标题 */
  title: string;
  /** 食谱图片URL */
  imageUrl: string;
  /** 食谱描述（可选） */
  description?: string;
  /** 烹饪时间（可选） */
  cookTime?: string;
  /** 评分（可选） */
  rating?: number;
}

/**
 * 分类食谱页面组件
 * @Component 装饰器定义组件元数据
 * @description 显示特定分类下的食谱列表
 */
@Component({
  selector: 'app-page-type',
  templateUrl: './page-type.page.html',
  styleUrls: ['./page-type.page.scss'],
  standalone: false
})
export class PageTypePage implements OnInit {
  /**
   * 当前分类名称
   * @type {string}
   */
  categoryName: string = '分类名称';

  /**
   * 食谱列表
   * @type {Recipe[]}
   */
  recipes: Recipe[] = [];

  /**
   * 构造函数
   * @param {ActivatedRoute} route 路由服务
   * @param {NavController} navCtrl 导航控制器
   */
  constructor(private route: ActivatedRoute, private navCtrl: NavController) {
    addIcons({ restaurant, chevronForward, timeOutline, star, cloudUploadOutline, fastFoodOutline });
  }

  /**
   * 组件初始化生命周期钩子
   * @returns {void}
   */
  ngOnInit(): void {
    this.categoryName = this.route.snapshot.paramMap.get('name') || '分类名称';
    this.loadRecipeList();
    this.ionViewWillEnter();
  }

  /**
   * 导入食谱数据
   * @returns {void}
   */
  importRecipeList(): void {
    importAllData();
  }

  /**
   * 食谱列表
   * @type {Array<CloudObject>}
   */
  recipeList: Array<CloudObject> = [];

  /**
   * 食谱分类列表
   * @type {Array<CloudObject>}
   */
  recipeCategoryList: Array<CloudObject> = [];

  /**
   * 加载食谱列表
   * @async
   * @returns {Promise<void>}
   */
  async loadRecipeList(): Promise<void> {
    let query1 = new CloudQuery("Recipe");
    this.recipeList = await query1.find(); 
    let query2 = new CloudQuery("RecipeCategory");
    this.recipeCategoryList = await query1.find();
  }

  /**
   * 当前分类ID
   * @type {string | null}
   */
  categoryId: string | null = null;

  /**
   * 页面即将进入时触发的生命周期钩子
   * @async
   * @returns {Promise<void>}
   */
  async ionViewWillEnter(): Promise<void> {
    this.categoryId = this.route.snapshot.paramMap.get('categoryId');
    console.log("categoryId:" + this.categoryId);
    
    if (this.categoryId) {
      await this.loadRecipesByCategory();
    }
  }

  /**
   * 分类食谱列表
   * @type {Array<CloudObject>}
   */
  categorieRecipes: Array<CloudObject> = [];

  /**
   * 分类列表
   * @type {Array<CloudObject>}
   */
  categories: Array<CloudObject> = [];

  /**
   * 按分类加载食谱
   * @async
   * @returns {Promise<void>}
   */
  async loadRecipesByCategory(): Promise<void> {
    let query1 = new CloudQuery("RecipeCategory");
    this.categories = await query1.find();
    let query = new CloudQuery("Recipe");
    query.include("category");
    console.log("id:" + this.categoryId);

    query.equalTo("category", this.categoryId);
    this.categorieRecipes = await query.find();
    console.log(this.categorieRecipes);
  }

  /**
   * 导航到食谱详情页
   * @param {CloudObject} recipe 食谱对象
   * @returns {void}
   */
  goToDetail(recipe: CloudObject): void {
    this.navCtrl.navigateForward(["tabs", "tab1", "page-detail", recipe.id]);
    console.log('Navigating to page-detail');
  }

  // 以下是预设数据（已注释）
  /**
   * @ignore
   * 加载模拟食谱数据
   * @returns {void}
   */
  /*
  loadRecipes(): void {
    this.recipes = [
      {
        id: 1,
        title: '经典意大利肉酱面',
        imageUrl: 'https://images.unsplash.com/photo-1555949258-eb67b1ef0ceb',
        description: '传统意大利风味肉酱面，酱汁浓郁，面条劲道',
        cookTime: '45分钟',
        rating: 4.5
      },
      // ...其他食谱数据
    ];
  }
  */
}