comanda.component.html 1.95 KB
<div class="container-fluid fade-in p-0">
  <div class="row m-1 fade-in disable-user-select">
    <div
      [ngClass]="{ 'swing-out-top-bck': comanda.estado === 3 }"
      class="col-2 col-1-5 p-1" *ngFor="let comanda of comandas">
      
      <div
        class="card-comanda fade-in d-flex align-items-end flex-column bg-danger rounded-xs shadow-sm border-0 h-100"
        [ngClass]="
        {
          'bg-light': comanda.estado === 1,
          'bg-danger': comanda.estado === 2,
          'bg-success': comanda.estado === 3
        }">
        <img class="card-img-top rounded-xs shadow-sm" src="{{apiImagenes}}/imagenes/cerealitas.jpg"/>
        <div class="row w-100 m-0 mt-2">
          <p class="col-12 px-2 mb-2 m-0 h6">Title</p>
          <p class="col-12 px-2 mb-2 m-0 h6"><small>Text</small></p>
        </div>
        <div class="row w-100 m-0 mb-2 mt-auto">
          <div
            class="col-12 px-2"
            *ngIf="comanda.estado === 1">
            <button
              class="btn btn-block btn-danger shadow-sm"
              (click)="updateComanda(comanda, 2, 'En elaboracion')">
              Elaborar
            </button>
          </div>
          <div
            class="col-12 px-2"
            *ngIf="comanda.estado === 2">
            <button
              class="btn btn-block btn-success shadow-sm"
              (click)="updateComanda(comanda, 3, 'Terminado')">
              Terminado
            </button>
          </div>
        </div>
        <div
          *ngIf="comanda.estado === 2"
          class="row w-100 mx-0 mb-2">
          <div class="col-12 px-2">
            <button
              class="btn btn-block btn-light btn-sm shadow-sm p-0"
              (click)="updateComanda(comanda, 1, 'Pagado')">
              <span class="pr-1 h6"><small>En espera</small></span>
              <i class="fa fa-undo text-warning" aria-hidden="true"></i>
            </button>
          </div>
        </div>
      </div>

    </div>
  </div>
</div>