// symptom-input.modal.ts
import { Component } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { IonicModule, ModalController } from '@ionic/angular';

@Component({
  standalone: true,
  imports: [IonicModule, FormsModule],
  template: `
    <ion-header>
      <ion-toolbar>
        <ion-title>症状描述</ion-title>
        <ion-buttons slot="end">
          <ion-button (click)="dismiss()">关闭</ion-button>
        </ion-buttons>
      </ion-toolbar>
    </ion-header>

    <ion-content>
      <ion-textarea
        [(ngModel)]="symptomDescription"
        placeholder="请详细描述您的症状（如：头痛3天，伴有恶心呕吐）"
        autoGrow
        rows="5"
      ></ion-textarea>
    </ion-content>

    <ion-footer>
      <ion-toolbar>
        <ion-button
          expand="block"
          (click)="submit()"
          [disabled]="!symptomDescription.trim()">
          提交
        </ion-button>
      </ion-toolbar>
    </ion-footer>
  `,
  styles: [`
    ion-textarea {
      background: var(--ion-color-light);
      border-radius: 8px;
      margin: 16px;
      padding: 8px;
    }
  `]
})
export class SymptomInputModalComponent {
  symptomDescription = '';
  constructor(private modalCtrl:ModalController){}

  submit() {
    this.modalCtrl.dismiss(this.symptomDescription.trim());
  }

  dismiss() {
    this.modalCtrl.dismiss(null);
  }
}
