products.html 1.1 KB

12345678910111213141516171819202122232425262728293031323334353637383940
  1. <ion-header>
  2. <ion-navbar>
  3. <button ion-button menuToggle>
  4. <ion-icon name="menu"></ion-icon>
  5. </button>
  6. <ion-title>Productos</ion-title>
  7. <ion-buttons end>
  8. <button ion-button icon-only>
  9. <i class="fa fa-search fa-lg"></i>
  10. </button>
  11. </ion-buttons>
  12. </ion-navbar>
  13. </ion-header>
  14. <ion-content>
  15. <ion-list>
  16. <ion-item *ngFor="let item of getItems()" (doubleTap)="openOptions(item)" [ngClass]="{ 'selected-item': item === getSelectedItem() }">
  17. <ion-thumbnail item-left>
  18. <img src="./assets/images/product.png" *ngIf="!item.image_medium"/>
  19. <img [src]="item.image_medium | sanitizeUrl" *ngIf="item.image_medium"/>
  20. </ion-thumbnail>
  21. <h2>{{ item.name }}</h2>
  22. <p>
  23. <strong>Precio:</strong>
  24. {{ item.list_price }}
  25. </p>
  26. <p>
  27. <strong>Cantidad:</strong>
  28. {{ item.qty_available }}
  29. </p>
  30. </ion-item>
  31. </ion-list>
  32. <div class="no-items" *ngIf="!hasItems()">
  33. <h2>Sin elementos</h2>
  34. </div>
  35. <ion-fab right bottom>
  36. <button ion-fab (click)="goToDetails()">
  37. <ion-icon name="add"></ion-icon>
  38. </button>
  39. </ion-fab>
  40. </ion-content>