import { Component, OnInit } from '@angular/core';
import { ActionSheetController, AlertController } from '@ionic/angular';
import Parse from 'parse';

@Component({
  selector: 'app-tab4',
  templateUrl: './tab4.page.html',
  styleUrls: ['./tab4.page.scss'],
})
export class Tab4Page implements OnInit {
  rating: number = 0;
  user: Parse.User | undefined;
  userData: any = {
    username: '',
    email: '',
    phone: '',
    gender: '',
    tags: '',
    birthday: '' // 添加生日属性
  };

  stars: string[] = Array(5).fill('star-outline');
  hoverIndex: number = -1;
  ratedIndex: number = -1;

  constructor(private actionSheetCtrl: ActionSheetController, private alertCtrl: AlertController) {}

  ngOnInit() {
    this.fetchUserData();
  }

  async fetchUserData() {
    try {
      const currentUser = Parse.User.current();
      if (currentUser) {
        this.user = currentUser;
        this.userData = {
          username: currentUser.get('username'),
          email: currentUser.get('email'),
          phone: currentUser.get('phone'),
          gender: currentUser.get('gender'),
          tags: currentUser.get('tags'),
          birthday: currentUser.get('birthday') // 获取生日属性
        };
      }
    } catch (error) {
      console.error('Error fetching user data:', error);
    }
  }

  async saveUserData() {
    try {
      if (this.user) {
        this.user.set('username', this.userData.username);
        this.user.set('email', this.userData.email);
        this.user.set('phone', this.userData.phone);
        this.user.set('gender', this.userData.gender);
        this.user.set('tags', this.userData.tags);
        this.user.set('birthday', this.userData.birthday); // 保存生日属性
        await this.user.save();
        console.log('User data saved successfully');
      }
    } catch (error) {
      console.error('Error saving user data:', error);
    }
  }

  async presentActionSheet() {
    const actionSheet = await this.actionSheetCtrl.create({
      header: 'Actions',
      buttons: [
        {
          text: 'QQ',
          icon: 'logo-qq',
          handler: () => {
            this.shareToApp('qq');
          }
        },
        {
          text: '微信',
          icon: 'logo-wechat',
          handler: () => {
            this.shareToApp('wechat');
          }
        },
        {
          text: '微博',
          icon: 'logo-weibo',
          handler: () => {
            this.shareToApp('weibo');
          }
        },
        {
          text: 'Cancel',
          role: 'cancel',
          handler: () => {
            console.log('Cancel clicked');
          }
        }
      ],
    });

    await actionSheet.present();
  }

  shareToApp(app: string) {
    let url = '';
    switch (app) {
      case 'qq':
        url = 'mqq://';
        break;
      case 'wechat':
        url = 'weixin://';
        break;
      case 'weibo':
        url = 'sinaweibo://';
        break;
    }
    window.location.href = url;
  }

  rate(index: number) {
    this.ratedIndex = index;
    this.hoverIndex = -1;
    this.stars = this.stars.map((_, i) => (i <= index ? 'star' : 'star-outline'));
    console.log('Rated: ' + (index + 1) + ' stars');
    this.presentRatingAlert(index + 1);
  }

  hover(index: number) {
    this.hoverIndex = index;
    this.stars = this.stars.map((_, i) => (i <= index ? 'star' : 'star-outline'));
  }

  resetHover() {
    this.hoverIndex = -1;
    this.stars = this.stars.map((_, i) => (i <= this.ratedIndex ? 'star' : 'star-outline'));
  }

  async presentRatingAlert(rating: number) {
    const alert = await this.alertCtrl.create({
      header: 'Rating',
      message: `You have rated ${rating} stars.`,
      buttons: ['OK']
    });

    await alert.present();
  }
}