import { Component, OnInit } from '@angular/core';
import { IonBackButton, IonButtons, IonContent, IonHeader, IonIcon, IonItem, IonItemOption, IonItemOptions, IonItemSliding, IonLabel, IonList, IonThumbnail, IonTitle, IonToolbar } from '@ionic/angular/standalone';
import { addIcons } from 'ionicons';
import { heart, heartOutline, trash } from 'ionicons/icons';

interface CollectionItem {
  id: number;
  name: string;
  image: string;
  time?: Date;
}

@Component({
  selector: 'app-page-collections',
  templateUrl: './page-collections.page.html',
  styleUrls: ['./page-collections.page.scss'],
  standalone: false,
  // imports: []
})
export class PageCollectionsPage implements OnInit {
  collections: CollectionItem[] = [];

  constructor() {
    addIcons({ heart, heartOutline, trash });
  }

  ngOnInit() {
    this.loadCollections();
  }

  loadCollections() {
    // 模拟数据 - 实际应该从本地存储或API获取
    this.collections = [
      {
        id: 1,
        name: '意大利肉酱面',
        image: 'https://images.unsplash.com/photo-1555949258-eb67b1ef0ceb',
        time: new Date('2023-05-15')
      },
      {
        id: 2,
        name: '奶油蘑菇汤',
        image: 'https://images.unsplash.com/photo-1547592180-85f173990554',
        time: new Date('2023-05-10')
      },
      {
        id: 3,
        name: '番茄炒蛋',
        image: 'https://images.unsplash.com/photo-1582456891920-7a6a13cc5c4a',
        time: new Date('2023-05-05')
      }
    ];
  }

  removeCollection(id: number) {
    // 模拟删除操作 - 实际应该更新本地存储或API
    this.collections = this.collections.filter(item => item.id !== id);
  }
}