<ion-header>
  <ion-toolbar>
    <ion-title>Segreteria</ion-title>
  </ion-toolbar>
</ion-header>

<ion-content>
  <div padding>
    <!--<ion-segment [(ngModel)]="segreteria">
      <ion-segment-button value="preventivi" (click)="redirectTo2p2()"> 
        Preventivi e Pagamenti
      </ion-segment-button>
      <ion-segment-button value="fatture">
        Fatture e Progetti
      </ion-segment-button>
      <ion-segment-button value="estratto">
        Estratto conto
      </ion-segment-button>
      <ion-segment-button value="solleciti">
        Solleciti 
      </ion-segment-button>
    </ion-segment>--> 
    <ion-tabs>
      <ion-tab-bar class="tabbar" [(ngModel)]="segreteria">
        <ion-tab-button value="preventivi" (click)="redirectTo2p2()">
          <ion-icon name="home"></ion-icon>
          <ion-label>Home</ion-label>
        </ion-tab-button>
        <ion-tab-button value="fatture" (click)="changeSel('fatture')">
          <ion-icon name="home"></ion-icon>
          <ion-label>Home</ion-label>
        </ion-tab-button>
        <ion-tab-button value="estratto" (click)="changeSel('estratto')"> 
          <ion-icon name="home"></ion-icon>
          <ion-label>Home</ion-label>
        </ion-tab-button>
        <ion-tab-button  value="solleciti" (click)="changeSel('solleciti')">
          <ion-icon name="home"></ion-icon>
          <ion-label>Home</ion-label>
        </ion-tab-button>
      </ion-tab-bar>
    </ion-tabs>
  </div>
  <div [ngSwitch]="segreteria"> 
    <ion-grid justify-content-center align-items-center *ngSwitchCase="'fatture'"> 
      <ion-row *ngIf="platform.is('desktop')">
        <ion-col>
          <ion-grid>
            <ion-row text-center center>
              <ion-col>
                <ion-label floating>Da:</ion-label>
              </ion-col>
              <ion-col>
                <input type="date" name="calendar" [(ngModel)]="date1">
              </ion-col>
              <ion-col>
                <ion-label floating>A:</ion-label>
              </ion-col>
              <ion-col>
                <input type="date" name="calendar" [(ngModel)]="date2">
              </ion-col>
              <ion-col>
                <ion-button color="light" (click)="cercaFatture()">Cerca</ion-button>
              </ion-col>
            </ion-row>
          </ion-grid>
        </ion-col>
        <ion-col></ion-col>
      </ion-row>
      <ion-row *ngIf="!platform.is('desktop')">
        <ion-col>
          <ion-grid>
            <ion-row text-center center>
              <ion-col>
                <ion-label floating>Da:</ion-label>
              </ion-col>
              <ion-col>
                <ion-icon name="calendar" (click)="setDateDa()"></ion-icon>
              </ion-col>
              <ion-col>
                {{date1}}
              </ion-col>
              <ion-col>
                <ion-label floating>A:</ion-label>
              </ion-col>
              <ion-col>
                  <ion-icon name="calendar" (click)="setDateA()"></ion-icon> 
              </ion-col>
              <ion-col>
                {{date2}}
              </ion-col>
              <ion-col>
                <ion-button color="light" (click)="cercaFatture()">Cerca</ion-button> 
              </ion-col>
            </ion-row>
          </ion-grid>
        </ion-col>
        <ion-col></ion-col>
      </ion-row>
      <ion-row class="row header" text-center>
        <ion-col class="col">
            <h3>Numero Progetto Notula</h3>
        </ion-col>
        <ion-col class="col">
            <h3>Data Progetto Notula</h3>
        </ion-col>
        <ion-col class="col">
            <h3>Numero Notula</h3>
        </ion-col>
        <ion-col class="col">
            <h3>Data Notula</h3>
        </ion-col>
        <ion-col class="col">
            <h3>Download Progetto Notula</h3>
        </ion-col>
        <ion-col class="col">
            <h3>Download Notula</h3>
        </ion-col>
      </ion-row>
      <ion-row *ngFor="let fattura of fatture; trackBy: trackByDoc" text-center center class="row"> 
        <ion-col class="col">
          <p>{{fattura.nrProgNotula}}</p>
        </ion-col>
        <ion-col class="col">
          <p>{{fattura.dataProgNotula}}</p>
        </ion-col>
        <ion-col class="col">
          <p>{{fattura.nrNotula}}</p>
        </ion-col>
        <ion-col class="col">
          <p>{{fattura.dataNotula}}</p>
        </ion-col>
        <ion-col class="col">
          <a *ngIf="!platform.is('desktop')" (click)="getNotula(fattura.id, fattura.nrProgNotula, true);" target="_blank" download>Clicca per scaricare il documento</a>
          <a *ngIf="platform.is('desktop')" href="{{fattura.urlProgNotula}}" target="_blank" download>Clicca per scaricare il documento</a>
        </ion-col>
        <ion-col class="col">
          <a *ngIf="!platform.is('desktop') && fattura.nrNotula != null" (click)="getNotula(fattura.id, fattura.nrNotula, false)" target="_blank" download>Clicca per scaricare il documento</a>
          <a *ngIf="platform.is('desktop') && fattura.nrNotula != null" href="{{fattura.urlNotula}}" target="_blank" download>Clicca per scaricare il documento</a>
        </ion-col>
      </ion-row>
    </ion-grid>
    <ion-list *ngSwitchCase="'estratto'">
      <ion-item><h2>Estratto Conto</h2></ion-item>
      <ion-item>
        <ion-label>Clicca per selezionare una Struttura</ion-label>
        <ion-select value="clienteSel" [(ngModel)]="idStrutturaSel" (ionChange)="cambiaStruttura()">
          <ion-select-option *ngFor="let struttura of strutture;" value="{{struttura.id}}">{{struttura.denominazione}}</ion-select-option> 
        </ion-select>
      </ion-item>
      <ion-item>
        <p>La Struttura selezionata è {{strutturaSel.denominazione}}</p>
      </ion-item>
      <ion-item>
          <a *ngIf="!platform.is('desktop')" (click)="getEstrattoConto(idCliente, 'EstrattoConto.pdf', strutturaSel.id);" target="_blank" download>Clicca per scaricare il documento</a>
          <a *ngIf="platform.is('desktop')" href="http://localhost:8080/stman/intranet/estrattoconto.do?idcliente={{idCliente}}&idstruttura={{strutturaSel.id}}" target="_blank" download>Download Estratto Conto</a>
      </ion-item>
    </ion-list>
    <ion-list *ngSwitchCase="'solleciti'">
      <ion-item>
        <h2>Solleciti</h2>
      </ion-item>
    </ion-list>
  </div>
</ion-content>

