import { Component } from '@angular/core';
import { Router } from '@angular/router';
import {
  IonHeader,
  IonToolbar,
  IonTitle,
  IonContent,
  IonCard,
  IonCardContent,
  IonGrid,
  IonRow,
  IonCol,
  IonAvatar,
  IonButton,
  ModalController,
} from '@ionic/angular/standalone';
import { CloudUser } from 'src/lib/cyxncloud';
import { ModalEditPagePage } from '../page/modal-edit-page/modal-edit-page.page';
export interface User {
  avatar: string;
  username: string;
  age: number | null;
  sex: string;
  email: string;
  phoneNumber: string;
  height: number;
  weight: number;
  fans: number;
  likes: number;
}

@Component({
  selector: 'app-tab4',
  templateUrl: 'tab4.page.html',
  styleUrls: ['tab4.page.scss'],
  standalone: true,
  imports: [
    IonHeader,
    IonToolbar,
    IonTitle,
    IonContent,
    IonCard,
    IonGrid,
    IonRow,
    IonCol,
    IonAvatar,
    IonCardContent,
    IonButton,
  ],
})
export class Tab4Page {
  is_login: boolean = false;
  currentUser: CloudUser | null = null;
  userChangeInfo: any = '';
  user: User = {
    avatar: 'https://ionicframework.com/docs/img/demos/avatar.svg',
    username: '请登录',
    age: 0,
    sex: '-',
    email: '-',
    phoneNumber: '-',
    height: 0,
    weight: 0,
    fans: 0,
    likes: 0,
  };

  constructor(private router: Router, private modalCtrl: ModalController) {
    let userCache = localStorage.getItem('userData');
    if (userCache) {
      let userData = JSON.parse(userCache);
      this.user.avatar = userData.avatar;
      this.user.username = userData.username;
      this.user.age = userData.age;
      this.user.sex = userData.sex;
      this.user.email = userData.email;
      this.user.phoneNumber = userData.phoneNumber;
      this.user.height = userData.height;
      this.user.weight = userData.weight;
      this.user.fans = userData.fans;
      this.user.likes = userData.likes;
      let is_loginCache = localStorage.getItem('is_login');
      this.is_login = is_loginCache === 'true' ? true : false;
    }
  }
  navigateTo(path: string) {
    this.router.navigate([`/${path}`]);
  }

  async openModal() {
    const modal = await this.modalCtrl.create({
      component: ModalEditPagePage,
    });
    modal.present();

    const { data, role } = await modal.onWillDismiss();

    if (role === 'confirm') {
      // this.message = `Hello, ${data}!`;
      console.log(data);
      this.userChangeInfo = data;
      this.updateUser();
    }
  }
  // async login() {
  //   this.is_login = true;
  //   let user = new CloudUser();
  //   this.currentUser = await user.login('cyx', 'cyx123456');
  //   if (this.currentUser) {
  //     console.log(this.currentUser);

  //     this.user.avatar = this.currentUser.data.avatar;
  //     this.user.username = this.currentUser.data.username;
  //     this.user.age = this.currentUser.data.age;
  //     this.user.sex = this.currentUser.data.sex;
  //     this.user.email = this.currentUser.data.email;
  //     this.user.phoneNumber = this.currentUser.data.phoneNumber;
  //     this.user.fans = this.currentUser.data.fans;
  //     this.user.likes = this.currentUser.data.likes;
  //     localStorage.setItem('userData', JSON.stringify(this.currentUser.data));
  //     localStorage.setItem('is_login', 'true');
  //   }
  // }
  async logout() {
    this.is_login = false;
    let user = new CloudUser();
    let flag = await user.logout();
    localStorage.removeItem('user');
    localStorage.removeItem('is_login');
  }
  async updateUser() {
    // let userCache = localStorage.getItem('userData');
    // if (userCache) {
    //   let userData = JSON.parse(userCache);
    //   console.log(userData);

    //   this.currentUser = userData;
    // }

    Object.keys(this.userChangeInfo).forEach((key) => {
      if (key == 'age') {
        this.userChangeInfo[key] = Number(this.userChangeInfo[key]);
      }
      if (key == 'height') {
        this.userChangeInfo[key] = Number(this.userChangeInfo[key]);
      }
      if (key == 'weight') {
        this.userChangeInfo[key] = Number(this.userChangeInfo[key]);
      }
    });
    let user = new CloudUser();
    let res = await user.update(this.userChangeInfo);
    console.log('成功更新用户信息');
  }
}
