<!--
  Questo file fa parte di MyTown.
  MyTown è software libero: puoi ridistribuirlo e/o modificarlo secondo
  i termini della GNU Affero General Public License come pubblicata dalla
  Free Software Foundation, versione 3.
  Distribuito senza ALCUNA GARANZIA; vedi la GNU AGPL v3 per i dettagli.
  Copyright (C) Kondor Consulting & Services S.r.l.
  SPDX-License-Identifier: AGPL-3.0-or-later
-->
<ion-content class="asf-content">
  <div class="asf-wrap">
    <!-- Dati -->
    <div class="asf-card">
      <h3 class="asf-card-title">Dati assemblea</h3>

      <div class="asf-field">
        <label>Titolo *</label>
        <input class="asf-input" type="text" [(ngModel)]="asm.asm_title" placeholder="Es. Assemblea Ordinaria 2026" />
      </div>

      <div class="asf-field">
        <label>Tipo</label>
        <ion-select [(ngModel)]="asm.asm_type" interface="popover" class="asf-select">
          @for (t of tipoOptions; track t) {
            <ion-select-option [value]="t.value">{{ t.label }}</ion-select-option>
          }
        </ion-select>
      </div>

      <div class="asf-field">
        <label>1ª convocazione *</label>
        @if (dateReady) {
          <ion-datetime-button datetime="dt1" class="asf-dt"></ion-datetime-button>
          <ion-modal [keepContentsMounted]="true">
            <ng-template>
              <ion-datetime id="dt1" presentation="date-time" [(ngModel)]="asm.asm_first_call_dt" locale="it-IT" [firstDayOfWeek]="1" hourCycle="h23"></ion-datetime>
            </ng-template>
          </ion-modal>
        }
      </div>

      <div class="asf-field">
        <label>2ª convocazione</label>
        @if (dateReady) {
          <ion-datetime-button datetime="dt2" class="asf-dt"></ion-datetime-button>
          <ion-modal [keepContentsMounted]="true">
            <ng-template>
              <ion-datetime id="dt2" presentation="date-time" [(ngModel)]="asm.asm_second_call_dt" locale="it-IT" [firstDayOfWeek]="1" hourCycle="h23"></ion-datetime>
            </ng-template>
          </ion-modal>
        }
      </div>

      <div class="asf-field">
        <label>Luogo</label>
        <input class="asf-input" type="text" [(ngModel)]="asm.asm_location" placeholder="Luogo dell’assemblea" />
      </div>

      <div class="asf-field">
        <label>Descrizione</label>
        <textarea class="asf-input" rows="2" [(ngModel)]="asm.asm_description" placeholder="Note / descrizione"></textarea>
      </div>

      <div class="asf-toggle">
        <div>
          <span class="t-lbl">Prevede quorum millesimale</span>
          <span class="t-hint">Mostra millesimi e quorum nel dettaglio</span>
        </div>
        <ion-toggle [(ngModel)]="asm.asm_quorum"></ion-toggle>
      </div>
    </div>

    <!-- Ordine del giorno -->
    <div class="asf-card">
      <h3 class="asf-card-title">Ordine del giorno</h3>
      <p class="asf-card-hint">Una voce per riga.</p>
      <textarea class="asf-input" rows="5" [(ngModel)]="asm.asm_odg" placeholder="1. ...&#10;2. ...&#10;3. ..."></textarea>
    </div>

    <!-- Invitati -->
    <div class="asf-card">
      <div class="asf-card-head">
        <h3 class="asf-card-title">Invitati <span class="cnt">{{ nSelezionati }} / {{ invitati.length }}</span></h3>
        <div class="asf-selall">
          <button (click)="selezionaTutti(true)">Tutti</button>
          <button (click)="selezionaTutti(false)">Nessuno</button>
        </div>
      </div>
      @for (i of invitati; track i) {
        <div class="asf-inv" (click)="i.selected = !i.selected">
          <ion-checkbox [(ngModel)]="i.selected" (click)="$event.stopPropagation()"></ion-checkbox>
          <span>{{ i.display }}</span>
        </div>
      }
      @if (invitati.length === 0) {
        <p class="asf-card-hint">Nessun referente disponibile per il condominio.</p>
      }
    </div>
  </div>

  <!-- Action bar -->
  <div class="asf-actionbar">
    <button class="ab-btn light" (click)="annulla()">Annulla</button>
    <button class="ab-btn primary" [disabled]="saving" (click)="save()">
      <ion-icon name="save-outline"></ion-icon> {{ saving ? 'Salvataggio…' : 'Salva' }}
    </button>
  </div>
</ion-content>
