import { Component } from '@angular/core';  
import { CommonModule } from '@angular/common'; // 导入 CommonModule  
import { IonHeader, IonToolbar, IonTitle, IonContent, IonSearchbar, IonCard, IonCardHeader, IonCardTitle, IonCardSubtitle, IonCardContent, IonItem, IonLabel, IonList, IonFooter, AlertController } from '@ionic/angular/standalone';  
import { ExploreContainerComponent } from '../explore-container/explore-container.component';  
import { EditRatingStarComponent } from '../edit-rating-star/edit-rating-star.component';
import { Router } from '@angular/router';
import { IonButton } from '@ionic/angular/standalone';
import { IonIcon } from '@ionic/angular/standalone';
import { addIcons } from 'ionicons';
import { bagAddOutline, ellipsisHorizontalOutline, imagesOutline } from 'ionicons/icons';
import { CloudObject, CloudQuery } from 'src/lib/ncloud';
import { IonThumbnail } from '@ionic/angular/standalone';

addIcons({ bagAddOutline, imagesOutline, ellipsisHorizontalOutline}) 
@Component({  
  selector: 'app-tab1',  
  templateUrl: 'tab1.page.html',  
  styleUrls: ['tab1.page.scss'],  
  standalone: true,  
  imports: [  
    CommonModule, // 在 imports 中加入 CommonModule  
    IonHeader, IonToolbar, IonTitle, IonContent, IonSearchbar,   
    IonCard, IonCardHeader, IonCardTitle, IonCardSubtitle, IonCardContent,   
    IonItem, IonLabel, IonList, IonFooter, ExploreContainerComponent ,
    EditRatingStarComponent, IonButton, IonIcon,
    IonThumbnail
  ],  
})  
export class Tab1Page {
   constructor(private router: Router, private alertController: AlertController) {} 

   /**
  * 轮播图
  */
  images = [
    'https://s2.loli.net/2024/12/22/lE4XKeWr6v8jTqa.png',
    'https://s2.loli.net/2024/12/22/9v1bO8A4sESxWV6.png',
    'https://s2.loli.net/2024/12/22/I28ScHtd5jnULyo.png',
  ];
  currentSlide = 0;
  intervalId: any;
  setSlidePosition() {
    // 这里不需要额外的逻辑，因为在 HTML 中已经通过绑定实现
  }

  nextSlide() {
    this.currentSlide = (this.currentSlide + 1) % this.images.length;
  }

  prevSlide() {
    this.currentSlide = (this.currentSlide - 1 + this.images.length) % this.images.length;
  }

  goToSlide(index: number) {
    this.currentSlide = index;
  }

  startAutoSlide() {
    this.intervalId = setInterval(() => this.nextSlide(), 3000);
  }
  ngOnDestroy() {
    if (this.intervalId) {
      clearInterval(this.intervalId);
    }
  }

  goToPage1(){
    this.router.navigate(['/tabs/picture'])
  }

  goToPage2(){
    this.router.navigate(['/tabs/inquiry'])
  }

  goToKnowledge(knowledge: CloudObject){
    const objectId = knowledge.get('title'); // 假设你的主键字段为 'title'
    this.router.navigate(['/tabs/knowledge-page', { id: objectId }]);
  }

  goToKnowledgeTotal(){
    this.router.navigate(['/tabs/knowledge-total'])
  }

  // currentScore: number = 0; // 初始分值

  // handleScoreChange(newScore: number) {
  //   this.currentScore = newScore;
  //   console.log('新分值:', newScore); // 处理分值变化
  // }

  // items = [  
  //   {  
  //     title: '医疗技术',  
  //     description: '我们提供最新的医疗设备和技术，帮助提高医护质量和效率。',  
  //     image: 'https://tse3-mm.cn.bing.net/th/id/OIP-C.NHe6NqhU0qZ_qLO0DQ08pAHaFj?rs=1&pid=ImgDetMain'  
  //   },  
  //   {  
  //     title: '健康管理',   
  //     description: '专业的健康管理方案，确保您的身体健康得到最佳维护。',  
  //     image: ''  
  //   },  
  //   {  
  //     title: '护理服务',  
  //     description: '我们提供全面的护理服务，为患者提供贴心的照顾。',  
  //     image: 'https://tse1-mm.cn.bing.net/th/id/OIP-C.N6uSj6zCe2pDw7vA4fcYuAHaE7?w=214&h=180&c=7&r=0&o=5&dpr=1.5&pid=1.7'  
  //   }  
  // ];  

    ngOnInit() {
      // 生命周期：页面加载后，运行医生列表加载函数
      this.loadKnowledgeList()
    }
  
    // 创建用于数据列表存储的属性
    knowledgeList:Array<CloudObject> = []
    // 查询并加载医生列表的函数
    async loadKnowledgeList(){
      let query = new CloudQuery("Knowledge");
      const allKnowledge = await query.find();
      this.knowledgeList = allKnowledge.slice(0, 4);
    }

    async presentAlert() {
      const alert = await this.alertController.create({
        message: '敬请期待！',
        buttons: ['确定'],
      });
  
      await alert.present();
    }

  search(event: CustomEvent) {  
    const searchTerm = event.detail.value;  
    console.log('搜索内容:', searchTerm);  
    // 在这里可以添加搜索逻辑，如过滤 items 数组  
  }  
}