import { Component, OnInit } from '@angular/core';
import {
  IonButton,
  IonButtons,
  IonContent,
  IonHeader,
  IonInput,
  IonItem,
  IonTitle,
  IonToolbar,
  ModalController,
} from '@ionic/angular/standalone';

@Component({
  selector: 'app-modal-edit-page',
  templateUrl: './modal-edit-page.page.html',
  styleUrls: ['./modal-edit-page.page.scss'],
  standalone: true,
  imports: [
    IonContent,
    IonHeader,
    IonTitle,
    IonToolbar,
    IonButtons,
    IonButton,
    IonItem,
    IonInput,
  ],
})
export class ModalEditPagePage implements OnInit {
  name: string = '';
  email: string = '';
  phoneNumber: string = '';
  sex: string = '';
  age: number = 0;
  height: number = 0;
  weight: number = 0;
  userInputEmail(ev: any) {
    this.email = ev.detail.value;
  }
  userInputPhoneNumber(ev: any) {
    this.phoneNumber = ev.detail.value;
  }
  userInputSex(ev: any) {
    this.sex = ev.detail.value;
  }
  userInputAge(ev: any) {
    this.age = ev.detail.value;
  }
  userInputHeight(ev: any) {
    this.height = ev.detail.value;
  }
  userInputWeight(ev: any) {
    this.weight = ev.detail.value;
  }

  constructor(private modalCtrl: ModalController) {
    let userCache = localStorage.getItem('userData');
    if (userCache) {
      let userData = JSON.parse(userCache);
      this.age = userData.age;
      this.sex = userData.sex;
      this.email = userData.email;
      this.phoneNumber = userData.phoneNumber;
      this.height = userData.height;
      this.weight = userData.weight;
    }
  }

  cancel() {
    return this.modalCtrl.dismiss(null, 'cancel');
  }

  confirm() {
    let userData = {
      email: this.email,
      phoneNumber: this.phoneNumber,
      sex: this.sex,
      age: this.age,
      height: this.height,
      weight: this.weight,
    };

    return this.modalCtrl.dismiss(userData, 'confirm');
  }

  ngOnInit() {}
}
