<ion-header>
	<ion-navbar>
		<button ion-button menuToggle>
            <ion-icon name="menu"></ion-icon>
        </button>
    	<ion-title>Clientes</ion-title>
  	</ion-navbar>
</ion-header>
<ion-content>
	<ion-list [virtualScroll]="getItems()" approxItemHeight="105px">
		<ion-item *virtualItem="let item" (doubleTap)="openOptions(item)" [ngClass]="{ 'selected-item': item === getSelectedItem() }">
			<ion-thumbnail item-left>
				<img src="./assets/images/customer.png" *ngIf="!item.image_medium"/>
				<img [src]="item.image_medium | sanitizeUrl" *ngIf="item.image_medium"/>
			</ion-thumbnail>

			<h2>{{ item.name }}</h2>
			<p>
				<strong>Ciudad:</strong>
				{{ item.city || "n/a" }}
			</p>
			<p>
				<strong>Celular:</strong>
				{{ item.mobile || "n/a" }}
			</p>
			<p>
				<strong>Email:</strong>
				{{ item.email || "n/a" }}
			</p>
		</ion-item>
	</ion-list>
	<ion-fab right bottom>
        <button ion-fab (click)="goToDetails()">
            <ion-icon name="add"></ion-icon>
        </button>
    </ion-fab>
</ion-content>
