import { ChangeDetectionStrategy, Component, inject } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { MatButtonModule } from '@angular/material/button';
import { MatFormFieldModule } from '@angular/material/form-field';
import { MatInputModule } from '@angular/material/input';
import { MatSelectModule } from '@angular/material/select';
import { DialogCloseDirective, DialogRef } from '@ngneat/dialog';
import { MatRadioModule } from '@angular/material/radio';

@Component({
  template: `<div class="flex flex-col items-center justify-start p-4">
    <div class="text-lg font-bold pb-2">Genehmigung benötigt?</div>
    <p>Prüfen Sie ob bei dem Patienten eine Genehmigung benötigt wird</p>
    <hr />
    <form #form="ngForm" class="flex flex-col w-full">
      <div class="flex flex-col p-2">
        <label>Wird eine Genehmigung benötigt?</label>
        <mat-radio-group
          [(ngModel)]="approvalNeeded"
          name="approvalNeeded"
          required
        >
          <mat-radio-button [value]="false"> Nein </mat-radio-button>
          <mat-radio-button [value]="true"> Ja </mat-radio-button>
        </mat-radio-group>
      </div>
      <div class="flex justify-end pt-4">
        <button mat-stroked-button class="mr-2" dialogClose>Abbrechen</button>
        <button
          mat-flat-button
          color="primary"
          [disabled]="form.invalid"
          [dialogClose]="approvalNeeded"
        >
          Bestätigen
        </button>
      </div>
    </form>
  </div>`,
  standalone: true,
  imports: [
    DialogCloseDirective,
    MatFormFieldModule,
    MatButtonModule,
    MatRadioModule,
    MatInputModule,
    MatSelectModule,
    FormsModule,
  ],
  changeDetection: ChangeDetectionStrategy.OnPush,
})
export class ApprovalStateDecisionComponent {
  ref: DialogRef<any> = inject(DialogRef);

  approvalNeeded = undefined;
}
