<h2 mat-dialog-title>{{ title }}</h2>

<mat-dialog-content [formGroup]="schoolYearForm">
  <!-- Mostra errore validatore custom a livello di form -->
   <mat-error *ngIf="schoolYearForm.hasError('dateRange') && (schoolYearForm.get('start_date')?.touched || schoolYearForm.get('end_date')?.touched)">
      La data di fine deve essere successiva alla data di inizio.
   </mat-error>

  <div class="form-grid">

    <mat-form-field appearance="fill" class="full-width-field">
      <mat-label>Nome Anno Scolastico (es. 2024/2025)</mat-label>
      <input matInput formControlName="name" required>
      <mat-error *ngIf="schoolYearForm.get('name')?.hasError('required')">
        Il nome è obbligatorio.
      </mat-error>
    </mat-form-field>

    <mat-form-field appearance="fill">
      <mat-label>Data Inizio</mat-label>
      <input matInput [matDatepicker]="startPicker" formControlName="start_date" required readonly>
      <mat-hint>GG/MM/AAAA</mat-hint>
      <mat-datepicker-toggle matSuffix [for]="startPicker"></mat-datepicker-toggle>
      <mat-datepicker #startPicker></mat-datepicker>
       <mat-error *ngIf="schoolYearForm.get('start_date')?.hasError('required')">
        La data di inizio è obbligatoria.
      </mat-error>
    </mat-form-field>

    <mat-form-field appearance="fill">
      <mat-label>Data Fine</mat-label>
      <input matInput [matDatepicker]="endPicker" formControlName="end_date" required readonly>
      <mat-hint>GG/MM/AAAA</mat-hint>
      <mat-datepicker-toggle matSuffix [for]="endPicker"></mat-datepicker-toggle>
      <mat-datepicker #endPicker></mat-datepicker>
       <mat-error *ngIf="schoolYearForm.get('end_date')?.hasError('required')">
        La data di fine è obbligatoria.
      </mat-error>
    </mat-form-field>

     <div class="full-width-field">
        <mat-checkbox formControlName="is_active" labelPosition="after">
            Anno Scolastico Attivo (Questo disattiverà automaticamente altri anni attivi)
        </mat-checkbox>
     </div>

  </div>
</mat-dialog-content>

<mat-dialog-actions align="end">
  <button mat-button (click)="onCancel()">Annulla</button>
  <!-- Abilita solo se valido (include validatore custom dateRange) -->
  <button mat-raised-button color="primary" (click)="onSave()" [disabled]="!schoolYearForm.valid">
    {{ isEditMode ? 'Salva Modifiche' : 'Aggiungi' }}
  </button>
</mat-dialog-actions>
