import { Component, OnInit } from '@angular/core';
import { Router } from '@angular/router';
import { IonBackButton, IonButtons, IonContent, IonHeader, IonIcon, IonItem, IonLabel, IonList, IonThumbnail, IonTitle, IonToolbar, NavController } from '@ionic/angular/standalone';
import { addIcons } from 'ionicons';
import { heart, heartOutline, timeOutline, trash } from 'ionicons/icons';
import { CloudObject, CloudQuery } from 'src/lib/ncloud';

interface HistoryItem {
  id: number;
  name: string;
  image: string;
}

@Component({
  selector: 'app-page-records',
  templateUrl: './page-records.page.html',
  styleUrls: ['./page-records.page.scss'],
  standalone: false,
  // imports: [IonHeader, IonToolbar, IonTitle, IonContent, IonBackButton, IonButtons, IonIcon, 
            // IonList, IonItem, IonThumbnail, IonLabel]
})
export class PageRecordsPage implements OnInit {
  historyList: HistoryItem[] = [];

  constructor(private navCtrl: NavController,private router:Router) { 
    addIcons({ heart, heartOutline, trash });
  }
  ngOnInit() {
    // // 模拟数据 - 实际应该从本地存储获取
    // this.historyList = [
    //   {
    //     id: 1,
    //     name: '意大利肉酱面',
    //     image: 'https://images.unsplash.com/photo-1555949258-eb67b1ef0ceb'
    //   },
    //   {
    //     id: 2,
    //     name: '奶油蘑菇汤',
    //     image: 'https://images.unsplash.com/photo-1547592180-85f173990554'
    //   },
    //   {
    //     id: 3,
    //     name: '番茄炒蛋',
    //     image: 'https://images.unsplash.com/photo-1582456891920-7a6a13cc5c4a'
    //   }
    // ];
    this.loadRecipeFavoriteList();
  }

  recipeRecordList: CloudObject[] = []; // 存储RecipeFavorite的CloudObject
  recipeDataList: any[] = []; // 存储Recipe表的完整data数据
  
  async loadRecipeFavoriteList() {
    const query = new CloudQuery("RecipeHistory");
    query.include("recipe"); // 联查Recipe表
    const favorites = await query.find();

    console.log('favorites',favorites);
    
    
    this.recipeRecordList = favorites.map(fav => fav.get("recipe"));
    // this.recipeDataList = this.recipeFavoriteList.map(recipe => recipe.data);
    
    console.log("Recipe数据列表:", this.recipeRecordList);
  }

  goToDetail(recipeId: any) {
    // this.navCtrl.navigateForward(["tabs", "tab1", "page-detail", recipe.objectId]);
    this.navCtrl.navigateForward(`/tabs/tab3/page-records/page-records-detail/${recipeId}`);
    console.log('Navigating to page-detail');
  }
}