order.html 3.0 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283
  1. <ion-header>
  2. <ion-navbar>
  3. <ion-title>{{ title }}</ion-title>
  4. <ion-buttons end>
  5. <button ion-button icon-only [disabled]="!getCart().isValid()" (click)="submit()">
  6. <i class="fa fa-save fa-lg"></i>
  7. </button>
  8. </ion-buttons>
  9. </ion-navbar>
  10. </ion-header>
  11. <ion-content>
  12. <form>
  13. <ion-item-divider>
  14. Cliente
  15. </ion-item-divider>
  16. <ion-item (tap)="selectCustomer()">
  17. <ion-input type="text" placeholder="Toque aquí para seleccionar" readonly value="{{ getCustomerName() }}"></ion-input>
  18. </ion-item>
  19. <ion-item-divider>
  20. Productos
  21. </ion-item-divider>
  22. <ion-list>
  23. <ion-item *ngFor="let item of getItems()" >
  24. <ion-thumbnail item-left>
  25. <img src="./assets/images/product.png" *ngIf="!item.hasImage()" />
  26. <img [src]="item.getImage() | sanitizeUrl" *ngIf="item.hasImage()" />
  27. </ion-thumbnail>
  28. <div (doubleTap)="openOptions(item)">
  29. <h2>{{ item.getProductName() }}</h2>
  30. <p>
  31. <strong>Precio:</strong>
  32. {{ item.getPrice() }}
  33. </p>
  34. <p>
  35. <strong>Cantidad:</strong>
  36. {{ item.getQuantity() }}
  37. </p>
  38. <p>
  39. <strong>Subtotal:</strong>
  40. {{ item.getSubtotal() }}
  41. </p>
  42. </div>
  43. <div item-right>
  44. <button ion-button icon-only color="light" (click)="updateQuantity(item, 1)">
  45. <i class="fa fa-plus"></i>
  46. </button>
  47. <button ion-button icon-only color="light" (click)="updateQuantity(item, -1)">
  48. <i class="fa fa-minus"></i>
  49. </button>
  50. </div>
  51. </ion-item>
  52. <ion-item class="empty-cart" *ngIf="getCart().empty()">
  53. <button ion-button icon-left (click)="selectProduct()">
  54. <ion-icon name="add"></ion-icon>
  55. Agregar un producto
  56. </button>
  57. </ion-item>
  58. </ion-list>
  59. <ion-item-divider>
  60. Total
  61. </ion-item-divider>
  62. <ion-item>
  63. <ion-input type="number" value="{{ getTotal() }}" readonly></ion-input>
  64. </ion-item>
  65. </form>
  66. <ion-fab right bottom>
  67. <button ion-fab>
  68. <ion-icon name="menu"></ion-icon>
  69. </button>
  70. <ion-fab-list side="top">
  71. <button ion-fab (click)="selectCustomer()">
  72. <i class="fa fa-user fa-lg"></i>
  73. </button>
  74. <button ion-fab (click)="openBarcodeReader()">
  75. <i class="fa fa-barcode fa-lg"></i>
  76. </button>
  77. <button ion-fab (click)="selectProduct()">
  78. <i class="fa fa-cart-plus fa-lg"></i>
  79. </button>
  80. </ion-fab-list>
  81. </ion-fab>
  82. </ion-content>