s202226701018/wisdom-app/src/app/page/inquiry-human/inquiry-human.component.ts

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 } from '@ionic/angular/standalone';
import { ExploreContainerComponent } from '../../explore-container/explore-container.component';
import { addIcons } from 'ionicons';
import { airplane, bluetooth, call, wifi } from 'ionicons/icons';
import { Router } from '@angular/router';
import { CommonModule } from '@angular/common';
import { FormsModule } from '@angular/forms';

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,IonLabel,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;
  doctor: any;    

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

  constructor(
    private router: Router
  ) { }

  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,
    },
    {
      avatar: 'https://app.fmode.cn/dev/jxnu/202226701019/doctor6.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,
    },{
      avatar: 'https://app.fmode.cn/dev/jxnu/202226701019/doctor5.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,
    },{
      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,
    }
    ];
    goToDoctorDetail(doctor: Doctor) {
      // this.router.navigate(['/doctor-detail'], { state: { doctor: doctor } });
    }
  segmentChanged(event: any) {
    this.selectedSegment = event.detail.value;
    console.log(this.selectedSegment);
  }
  openConsult(){
    console.log("openConsult");
  }
}