import { Component, OnInit, AfterViewInit, OnDestroy } from '@angular/core';
import {
  IonList, IonImg, IonContent, IonHeader, IonToolbar, IonTitle, IonCard, IonCardHeader, IonCardTitle,
  IonCardContent, IonAvatar, IonLabel, IonItem, IonButton, IonGrid, IonRow, IonCol, IonIcon, IonFooter, IonButtons
} from '@ionic/angular/standalone';
import { addIcons } from 'ionicons';
import { analyticsOutline, personCircleOutline, chatbubblesOutline, barbellOutline, ellipse, square } from 'ionicons/icons';
import Swiper from 'swiper';
import { Router } from '@angular/router';
import { CommonModule } from '@angular/common';
import { DiscountBannerComponent } from '../discount-banner/discount-banner.component';
import { TagInputComponent } from '../tag-input/tag-input.component';
@Component({
  selector: 'app-tab1',
  templateUrl: 'tab1.page.html',
  styleUrls: ['tab1.page.scss'],
  standalone: true,
  imports: [
    CommonModule,
    IonImg,
    IonContent,
    IonHeader,
    IonToolbar,
    IonTitle,
    IonCard,
    IonCardHeader,
    IonCardTitle,
    IonCardContent,
    IonAvatar,
    IonLabel,
    IonItem,
    IonButton,
    IonGrid,
    IonRow,
    IonCol,
    IonIcon,
    IonFooter,
    IonButtons,
    IonList,
    DiscountBannerComponent,
  ],
})
export class Tab1Page implements OnInit, AfterViewInit, OnDestroy {
  users = [
    {
      avatarUrl: '../assets/beautiful.jpg',
      name: '小敏',
      recommendation: '作为上班族，以前没时间去健身房，WisefitnessApp让我在家就能轻松锻炼，还能获取个性化饮食建议，健康生活触手可及！'
    },
    // 可以添加更多用户数据
  ];

  countdown: string = ''; // 倒计时字符串
  private countdownInterval: any; // 保存计时器引用

  constructor(private router: Router) { }

  ngOnInit() {
    // 添加图标
    addIcons({
      analyticsOutline,
      personCircleOutline,
      chatbubblesOutline,
      barbellOutline,
      ellipse,
      square
    });


  }

  ngAfterViewInit() {
    // 初始化 Swiper
    new Swiper('.swiper-container', {
      loop: true, // 开启循环
      pagination: {
        el: '.swiper-pagination', // 分页器
        clickable: true
      },
      autoplay: {
        delay: 5000 // 自动切换时间间隔
      }
    });
  }

  ngOnDestroy() {
    // 清除计时器
    if (this.countdownInterval) {
      clearInterval(this.countdownInterval);
    }
  }

  // 页面导航功能
  goToTestPage() {
    this.router.navigate(['tabs/test-page']);  // 跳转到 Test 页面
  }

  goToLogin() {
    this.router.navigate(['/login']);
  }

  goToReviews() {
    this.router.navigate(['/user-reviews']);
  }

  openPrivacyPolicy() {
    this.router.navigate(['/privacy-policy']);
  }

  openTermsOfService() {
    this.router.navigate(['/terms-of-service']);
  }
}
