import { Component, OnInit } from '@angular/core';
import { ModalController, IonInput, IonItem, IonLabel, IonButton, IonCard, IonCardHeader, IonCardTitle, IonCardSubtitle, IonCardContent } from '@ionic/angular/standalone';
import { CloudObject } from 'src/lib/ncloud';
import { FormsModule } from '@angular/forms'; // 导入 FormsModule
import { CommonModule } from '@angular/common';

@Component({
  selector: 'app-throw-drift-bottle',
  templateUrl: './throw-drift-bottle.component.html',
  styleUrls: ['./throw-drift-bottle.component.scss'],
  standalone: true,
  imports: [
    IonCard,
    IonCardHeader,
    IonCardTitle,
    IonCardSubtitle,
    IonCardContent,
    IonButton,
    IonInput,
    IonItem,
    IonLabel,
    FormsModule,
    CommonModule
  ],
})
export class ThrowDriftBottleComponent implements OnInit {
  driftbottleData: { content: string } = { content: '' }; // 漂流瓶内容

  constructor(private modalCtrl: ModalController) {}

  ngOnInit() {}

  throw() {
    console.log('投掷漂流瓶:');
    console.log(`内容: ${this.driftbottleData.content}`);
    // 这里可以添加逻辑将漂流瓶内容发布到后端或其他处理
    const driftbottleData = {
      content: this.driftbottleData.content,
    };

    let driftbottle = new CloudObject("Driftbottle");
    driftbottle.set(driftbottleData);
    driftbottle.save().then(data => {
      console.log('漂流瓶已成功投掷', data);
      this.modalCtrl.dismiss(driftbottle, "confirm");
    }).catch(err => {
      console.error('投掷漂流瓶时出错');
    });
  }

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

export async function openThrowDriftBottleModal(modalCtrl: ModalController): Promise<any> {
  const modal = await modalCtrl.create({
    component: ThrowDriftBottleComponent,
    breakpoints: [0.7, 1.0],
    initialBreakpoint: 0.7
  });
  modal.present();

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

  if (role === 'confirm') {
    return data;
  }
  return null;
}