Commit 3c066629175295b00031cfa6f15317d04573470b

Authored by Marcelo Puebla
1 parent a197254536
Exists in master

Cambio para poder hacer scrol en al pantalla de comanda.

src/app/components/comanda/comanda.component.html
1   -<div class="container-fluid fade-in p-0">
  1 +<div class="container-fluid h-100 fade-in p-0 pr-2">
2 2  
3 3 <div class="row z-index-0 fixed-top m-0 w-100">
4 4 <div class="col-12 p-3">
... ... @@ -6,60 +6,65 @@
6 6 </div>
7 7 </div>
8 8  
9   - <div class="row pt-5 m-2">
  9 + <div class="row pt-5 m-3">
10 10 <div class="col-12">
11 11 <p class="m-0 h2 text-center">Pedidos a elaborar</p>
12 12 </div>
13 13 </div>
14 14  
15   - <div class="card-columns m-1 fade-in disable-user-select">
16   - <div
17   - *ngFor="let comanda of comandas"
18   - class="card fade-in rounded-xs shadow-sm"
19   - [ngClass]="{
20   - 'bg-light': comanda.estado === 1,
21   - 'bg-danger': comanda.estado === 2,
22   - 'bg-success swing-out-top-bck': comanda.estado === 3
23   - }">
24   - <div class="card-body p-2">
25   - <p class="h1 card-title text-center mb-1">{{comanda.id.toString().slice(comanda.id.toString().length - 2)}}</p>
26   - <!-- TODO: Implementar moment -->
27   - <p class="card-title text-center mb-1">{{comanda.fechafinelaboracion | date: 'dd-MM-yyyy HH:mm' : '+0000'}}</p>
28   - <p
29   - *ngFor="let detalle of comanda.detalles"
30   - [ngClass]="
31   - {
32   - 'border-secondary': comanda.estado === 1,
33   - 'border-light': comanda.estado != 1
34   - }"
35   - class="card-text border-top pt-2 mb-2">
36   - <small>
37   - {{detalle.articulo.DET_LAR}}
38   - </small><br>
39   - <small>
40   - CANT. {{detalle.cantidad}}
41   - </small>
42   - </p>
43   - <button
44   - *ngIf="comanda.estado === 1"
45   - class="btn btn-block btn-danger shadow-sm"
46   - (click)="updateComanda(comanda, 2, 'En elaboracion')">
47   - Elaborar
48   - </button>
49   - <button
50   - *ngIf="comanda.estado === 2"
51   - class="btn btn-block btn-success shadow-sm"
52   - (click)="updateComanda(comanda, 3, 'Terminado')">
53   - Terminar
54   - </button>
55   - <button
56   - *ngIf="comanda.estado === 2"
57   - class="btn btn-block btn-light btn-sm shadow-sm p-0"
58   - (click)="updateComanda(comanda, 1, 'Pagado')">
59   - <span class="pr-2 h6"><small>Deshacer</small></span>
60   - <i class="fa fa-undo text-warning" aria-hidden="true"></i>
61   - </button>
  15 + <div class="row h-85 m-0 overflow-scroll">
  16 + <div class="col-12 px-2">
  17 + <div class="card-columns h-100 m-1 fade-in disable-user-select">
  18 + <div
  19 + *ngFor="let comanda of comandas"
  20 + class="card fade-in rounded-xs shadow-sm"
  21 + [ngClass]="{
  22 + 'bg-light': comanda.estado === 1,
  23 + 'bg-danger': comanda.estado === 2,
  24 + 'bg-success swing-out-top-bck': comanda.estado === 3
  25 + }">
  26 + <div class="card-body p-2">
  27 + <p class="h1 card-title text-center mb-1">{{comanda.id.toString().slice(comanda.id.toString().length - 2)}}</p>
  28 + <!-- TODO: Implementar moment -->
  29 + <p class="card-title text-center mb-1">{{comanda.fechafinelaboracion | date: 'dd-MM-yyyy HH:mm' : '+0000'}}</p>
  30 + <p
  31 + *ngFor="let detalle of comanda.detalles"
  32 + [ngClass]="
  33 + {
  34 + 'border-secondary': comanda.estado === 1,
  35 + 'border-light': comanda.estado != 1
  36 + }"
  37 + class="card-text border-top pt-2 mb-2">
  38 + <small>
  39 + {{detalle.articulo.DET_LAR}}
  40 + </small><br>
  41 + <small>
  42 + CANT. {{detalle.cantidad}}
  43 + </small>
  44 + </p>
  45 + <button
  46 + *ngIf="comanda.estado === 1"
  47 + class="btn btn-block btn-danger shadow-sm"
  48 + (click)="updateComanda(comanda, 2, 'En elaboracion')">
  49 + Elaborar
  50 + </button>
  51 + <button
  52 + *ngIf="comanda.estado === 2"
  53 + class="btn btn-block btn-success shadow-sm"
  54 + (click)="updateComanda(comanda, 3, 'Terminado')">
  55 + Terminar
  56 + </button>
  57 + <button
  58 + *ngIf="comanda.estado === 2"
  59 + class="btn btn-block btn-light btn-sm shadow-sm p-0"
  60 + (click)="updateComanda(comanda, 1, 'Pagado')">
  61 + <span class="pr-2 h6"><small>Deshacer</small></span>
  62 + <i class="fa fa-undo text-warning" aria-hidden="true"></i>
  63 + </button>
  64 + </div>
  65 + </div>
62 66 </div>
63 67 </div>
64 68 </div>
  69 +
65 70 </div>
src/app/components/comanda/comanda.component.scss
... ... @@ -9,6 +9,10 @@
9 9 }
10 10 }
11 11  
  12 +.h-85{
  13 + height: 85% !important;
  14 +}
  15 +
12 16 @media (min-width: 1200px) {
13 17 .card-columns {
14 18 column-count: 7 !important;