import { Component, OnInit } from '@angular/core';
import { IonModal, IonHeader, IonToolbar, IonTitle, IonContent, IonList, IonItem, IonLabel, IonAvatar, IonButton, IonChip, IonIcon, IonBadge, IonText, IonCard, IonSegmentButton, IonSegment, IonCol, IonRow, IonGrid, IonButtons, IonFooter, ToastController } from '@ionic/angular/standalone';
import { ExploreContainerComponent } from '../../explore-container/explore-container.component';
import { addIcons } from 'ionicons';
import { airplane, bluetooth, call, wifi, star, checkmarkCircle } from 'ionicons/icons';
import { Router } from '@angular/router';
import { CommonModule } from '@angular/common';
import { FormsModule } from '@angular/forms';
import { CloudObject, CloudUser } from 'src/lib/ncloud';

addIcons({ airplane, bluetooth, call, wifi });

interface Doctor {
  avatar: string;
  name: string;
  title: string;
  department: string;
  hospital: string;
  hospitalLevel: string;
  hospitalType: string;
  expertise: string;
  rating: number;
  consultations: string;
  recommendations: number;
  tags?: string[];
  prices: {
    text: number;
    voice: number;
    video: number;
  }
  isVerified?: boolean;
  isExpert?: boolean;
}

interface ConsultOption {
  id: number;
  title: string;
  icon: string;
  price: number;
  unit: string;
  isAvailable: boolean; // 是否可用
  isSelected?: boolean; // 是否被选中
}

@Component({
  selector: 'inquiry-human',
  templateUrl: './inquiry-human.component.html',
  styleUrls: ['./inquiry-human.component.scss'],
  standalone: true,
  imports: [
    IonHeader, IonToolbar, IonTitle, IonContent, ExploreContainerComponent, CommonModule,
    IonLabel, IonItem, IonList, IonAvatar, IonButton, IonChip, IonIcon, IonBadge,
    IonText, IonCard, IonSegment, IonSegmentButton, FormsModule, IonCol, IonRow, IonGrid,
    IonModal, IonButtons, IonFooter
  ]
})
export class InquiryHumanComponent implements OnInit {
  options: ConsultOption[] = [
    {
      id: 1,
      title: '图文咨询',
      icon: 'chatbubbles',
      price: 120,
      unit: '次',
      isAvailable: true,
      isSelected: true
    },
    {
      id: 2,
      title: '电话咨询',
      icon: 'call',
      price: 200,
      unit: '次起',
      isAvailable: true
    },
    {
      id: 3,
      title: '视频问诊',
      icon: 'videocam',
      price: 0,
      unit: '',
      isAvailable: false
    },
    {
      id: 4,
      title: '私人医生',
      icon: 'person',
      price: 0,
      unit: '',
      isAvailable: false
    },
    {
      id: 5,
      title: '预约',
      icon: 'calendar',
      price: 0,
      unit: '',
      isAvailable: false
    }
  ];

  selectOption(option: ConsultOption) {
    if (!option.isAvailable) return;
    this.options.forEach(opt => opt.isSelected = false);
    option.isSelected = true;
  }

  isModalOpen = false;
  isPaymentModalOpen = false; // 新增状态变量
  doctor: any;
  currentUser: CloudUser 
  constructor(
    private router: Router,
    private toastController: ToastController // 注入 ToastController
  ) {
      addIcons({star,checkmarkCircle});
      this.currentUser = new CloudUser();
     }

  ngOnInit() { }

  back: string = "<";
  backhome(){
    this.router.navigate(['/tabs/tab1']);
  }
  selectedSegment = '全部';
  segments = ['全部', '妇科', '儿科', '皮肤性病科', '内科'];

  doctors: Doctor[] = [
    {
      avatar: 'https://app.fmode.cn/dev/jxnu/202226701019/doctor7.png',
      name: '张伟',
      title: '主任医师',
      department: '消化内科',
      hospital: '首都医科大学附属北京友谊..',
      hospitalLevel: '三甲',
      hospitalType: '百强医院',
      expertise: '擅长：结肠息肉和息肉病、胃息肉、幽门螺杆菌感染、慢性胃炎、胃食管反流、慢性萎缩性胃炎、糜烂性胃炎...',
      rating: 5.0,
      consultations: '1.1万',
      recommendations: 100,
      prices: {
        text: 100,
        voice: 150,
        video: 300
      },
      tags: ['百强医院', '可开处方', '从业24年', '擅长消化系统疾病', '可开处方'],
      isVerified: true,
      isExpert: true,
    },
    // ... 其他医生数据 ...
  ];

  openDetailModal(doctor?: any) {
    this.isModalOpen = true;
    this.doctor = doctor;
  }
  closeDetailModal() {
    this.isModalOpen = false;
    this.doctor = null;
  }

  goToDoctorDetail(doctor: Doctor) {
    // this.router.navigate(['/doctor-detail'], { state: { doctor: doctor } });
  }

  segmentChanged(event: any) {
    this.selectedSegment = event.detail.value;
    console.log(this.selectedSegment);
  }

  async openConsult(){
    const selectedOption = this.options.find(option => option.isSelected);
    if (!selectedOption) {
      // 显示 Toast 提示用户选择咨询方式
      const toast = await this.toastController.create({
        message: '请先选择咨询方式',
        duration: 2000,
        position: 'bottom'
      });
      toast.present();
      return;
    }

    if (selectedOption.title === '图文咨询' || selectedOption.title === '电话咨询') {
      this.isPaymentModalOpen = true;
    } else {
      // 处理其他选项（如需要）
    }
  }

  closePaymentModal() {
    this.isPaymentModalOpen = false;
  }
  appoint(id:any){
    let appointment = new CloudObject('appointment')
    appointment.set({
      doctor: {
        __type:"Pointer",
        className:"doctor",
        objectId:id
      },
      user: {
        __type:"Pointer",
        className:"user",
        objectId:this.currentUser.id
      },
      
      }
    )
  }
}