Commit e1e219322e5b883add65fc82e608b896c751d9f8

Authored by Eric Fernandez
Exists in master

Merge branch 'master' into 'master'

Master(mpuebla)

See merge request !98
src/app/components/comanda/comanda.component.html
1 <div class="container-fluid fade-in p-0"> 1 <div class="container-fluid fade-in p-0">
2
3 <div class="row m-2">
4 <div class="col-12">
5 <p class="m-0 h2 text-center">Pedidos a elaborar</p>
6 </div>
7 </div>
8
2 <div class="card-columns m-1 fade-in disable-user-select"> 9 <div class="card-columns m-1 fade-in disable-user-select">
3 <div 10 <div
4 *ngFor="let comanda of comandas" 11 *ngFor="let comanda of comandas"
5 class="card fade-in rounded-xs shadow-sm" 12 class="card fade-in rounded-xs shadow-sm"
6 [ngClass]="{ 13 [ngClass]="{
7 'bg-light': comanda.estado === 1, 14 'bg-light': comanda.estado === 1,
8 'bg-danger': comanda.estado === 2, 15 'bg-danger': comanda.estado === 2,
9 'bg-success swing-out-top-bck': comanda.estado === 3 16 'bg-success swing-out-top-bck': comanda.estado === 3
10 }"> 17 }">
11 <div class="card-body p-2"> 18 <div class="card-body p-2">
12 <p class="h5 card-title text-center mb-1">{{comanda.id.toString().slice(comanda.id.toString().length - 2)}}.</p> 19 <p class="h5 card-title text-center mb-1">{{comanda.id.toString().slice(comanda.id.toString().length - 2)}}.</p>
13 <p 20 <p
14 *ngFor="let detalle of comanda.detalles" 21 *ngFor="let detalle of comanda.detalles"
15 [ngClass]=" 22 [ngClass]="
16 { 23 {
17 'border-secondary': comanda.estado === 1, 24 'border-secondary': comanda.estado === 1,
18 'border-light': comanda.estado != 1 25 'border-light': comanda.estado != 1
19 }" 26 }"
20 class="card-text border-top pt-2 mb-2"> 27 class="card-text border-top pt-2 mb-2">
21 <small> 28 <small>
22 {{detalle.articulo.DET_LAR}} 29 {{detalle.articulo.DET_LAR}}
23 </small> 30 </small>
24 </p> 31 </p>
25 <button 32 <button
26 *ngIf="comanda.estado === 1" 33 *ngIf="comanda.estado === 1"
27 class="btn btn-block btn-danger shadow-sm" 34 class="btn btn-block btn-danger shadow-sm"
28 (click)="updateComanda(comanda, 2, 'En elaboracion')"> 35 (click)="updateComanda(comanda, 2, 'En elaboracion')">
29 Elaborar 36 Elaborar
30 </button> 37 </button>
31 <button 38 <button
32 *ngIf="comanda.estado === 2" 39 *ngIf="comanda.estado === 2"
33 class="btn btn-block btn-success shadow-sm" 40 class="btn btn-block btn-success shadow-sm"
34 (click)="updateComanda(comanda, 3, 'Terminado')"> 41 (click)="updateComanda(comanda, 3, 'Terminado')">
35 Terminado 42 Terminado
36 </button> 43 </button>
37 <button 44 <button
38 *ngIf="comanda.estado === 2" 45 *ngIf="comanda.estado === 2"
39 class="btn btn-block btn-light btn-sm shadow-sm p-0" 46 class="btn btn-block btn-light btn-sm shadow-sm p-0"
40 (click)="updateComanda(comanda, 1, 'Pagado')"> 47 (click)="updateComanda(comanda, 1, 'Pagado')">
41 <span class="pr-1 h6"><small>En espera</small></span> 48 <span class="pr-1 h6"><small>En espera</small></span>
42 <i class="fa fa-undo text-warning" aria-hidden="true"></i> 49 <i class="fa fa-undo text-warning" aria-hidden="true"></i>
43 </button> 50 </button>
44 </div> 51 </div>
45 </div> 52 </div>
46 </div> 53 </div>
47 </div> 54 </div>
48 55
src/app/components/popover-promos/popover-promos.component.html
1 <div class="card-body fade-left"> 1 <div class="card-body fade-left">
2 <div class="row"> 2 <div class="row">
3 <div class="col text-left"> 3 <div class="col text-left">
4 <p class="h5 card-title"> 4 <p class="h5 card-title">
5 Este producto forma parte<br> 5 Sugerencias<br>
6 de Combos y Promociones 6 COMBOS Y PROMOCIONES
7 </p> 7 </p>
8 </div> 8 </div>
9 </div> 9 </div>
10 10
11 <div class="overflow-scroll popover-size pr-2"> 11 <div class="overflow-scroll popover-size pr-2">
12 <div 12 <div
13 class="row my-2" 13 class="row my-2"
14 *ngFor="let promo of popoverContent"> 14 *ngFor="let promo of popoverContent">
15 <div class="col text-dark"> 15 <div class="col text-dark">
16 <div 16 <div
17 class="bg-white card-effect rounded-sm p-2 px-3" 17 class="bg-white card-effect rounded-sm p-2 px-3"
18 (click)="seleccionarPromo(promo)"> 18 (click)="seleccionarPromo(promo)">
19 <div class="row justify-content-between"> 19 <div class="row justify-content-between">
20 <div class="col-12 text-left"> 20 <div class="col-12 text-left">
21 <p class="h5 mb-0"> 21 <p class="h5 mb-0">
22 <small class="font-weight-bold">{{promo.DetArt}}</small> 22 <small class="font-weight-bold">{{promo.DetArt}}</small>
23 </p> 23 </p>
24 </div> 24 </div>
25 <div class="col-12 text-right mt-2"> 25 <div class="col-12 text-right mt-2">
26 <p class="h4 font-weight-bold mb-0"> 26 <p class="h4 font-weight-bold mb-0">
27 {{promo.PreVen | currency}} 27 {{promo.PreVen | currency}}
28 </p> 28 </p>
29 </div> 29 </div>
30 </div> 30 </div>
31 </div> 31 </div>
32 </div> 32 </div>
33 </div> 33 </div>
34 </div> 34 </div>
35 35
36 <div class="row mt-3 justify-content-end"> 36 <div class="row mt-3 justify-content-end">
37 <div class="col-auto"> 37 <div class="col-auto">
38 <button 38 <button
39 type="button" 39 type="button"
40 class="btn btn-sm btn-light shadow" 40 class="btn btn-sm btn-light shadow"
41 (click)="hide()"> 41 (click)="hide()">
42 <span class="pr-2">No, gracias</span> 42 <span class="pr-2">No, gracias</span>
43 <i class="fa fa-times text-danger" aria-hidden="true"></i> 43 <i class="fa fa-times text-danger" aria-hidden="true"></i>
44 </button> 44 </button>
45 </div> 45 </div>
46 </div> 46 </div>
47 47
48 </div> 48 </div>
49 49
src/assets/scss/bootstrap-override.scss
1 @import "../../../node_modules/bootstrap/scss/functions"; 1 @import "../../../node_modules/bootstrap/scss/functions";
2 @import "../../../node_modules/bootstrap/scss/variables"; 2 @import "../../../node_modules/bootstrap/scss/variables";
3 @import "../../../node_modules/bootstrap/scss/mixins"; 3 @import "../../../node_modules/bootstrap/scss/mixins";
4 4
5 $primary: #2872ae; 5 $primary: #2872ae;
6 6
7 $theme-colors: ( 7 $theme-colors: (
8 primary: $primary, 8 primary: $primary,
9 light: white 9 light: white
10 ); 10 );
11 11
12 .popover { 12 .popover {
13 transform: translate3d(-425px, 0, -34px) !important; 13 transform: translate3d(-100%, 0, -34px) !important;
14 min-width: 350px !important; 14 min-width: 350px !important;
15 max-width: 425px !important; 15 max-width: 65% !important;
16 border: none !important; 16 border: none !important;
17 border-radius: 1.5rem !important; 17 border-radius: 1.5rem !important;
18 padding: 0 !important; 18 padding: 0 !important;
19 background-color: $primary !important; 19 background-color: $primary !important;
20 .popover-body { 20 .popover-body {
21 padding: 0 !important; 21 padding: 0 !important;
22 } 22 }
23 } 23 }
24 24
25 .bs-popover-left .arrow::after, 25 .bs-popover-left .arrow::after,
26 .bs-popover-auto[x-placement^="left"] .arrow::after { 26 .bs-popover-auto[x-placement^="left"] .arrow::after {
27 border-left-color: $primary !important; 27 border-left-color: $primary !important;
28 } 28 }
29 29
30 .bs-popover-right .arrow::after, 30 .bs-popover-right .arrow::after,
31 .bs-popover-auto[x-placement^="right"] .arrow::after { 31 .bs-popover-auto[x-placement^="right"] .arrow::after {
32 border-right-color: $primary !important; 32 border-right-color: $primary !important;
33 } 33 }
34 34
35 .bs-popover-top .arrow::after, 35 .bs-popover-top .arrow::after,
36 .bs-popover-auto[x-placement^="top"] .arrow::after { 36 .bs-popover-auto[x-placement^="top"] .arrow::after {
37 border-top-color: $primary !important; 37 border-top-color: $primary !important;
38 } 38 }
39 39
40 .bs-popover-bottom .arrow::after, 40 .bs-popover-bottom .arrow::after,
41 .bs-popover-auto[x-placement^="bottom"] .arrow::after { 41 .bs-popover-auto[x-placement^="bottom"] .arrow::after {
42 border-bottom-color: $primary !important; 42 border-bottom-color: $primary !important;
43 } 43 }
44 44
45 .list-group-item.active { 45 .list-group-item.active {
46 background-color: $primary !important; 46 background-color: $primary !important;
47 border-color: $primary !important; 47 border-color: $primary !important;
48 } 48 }
49 49
50 .custom-radio .custom-control-label::before { 50 .custom-radio .custom-control-label::before {
51 background-color: $primary !important; 51 background-color: $primary !important;
52 border-color: $white !important; 52 border-color: $white !important;
53 border-width: 2px !important; 53 border-width: 2px !important;
54 } 54 }
55 55
56 .custom-control-input { 56 .custom-control-input {
57 border-color: $white !important; 57 border-color: $white !important;
58 background-color: $primary !important; 58 background-color: $primary !important;
59 color: $primary !important; 59 color: $primary !important;
60 &:checked ~ .custom-control-label::before { 60 &:checked ~ .custom-control-label::before {
61 border-color: $white !important; 61 border-color: $white !important;
62 color: #fff !important; 62 color: #fff !important;
63 background-color: $primary !important; 63 background-color: $primary !important;
64 } 64 }
65 &:focus ~ .custom-control-label::before { 65 &:focus ~ .custom-control-label::before {
66 border-color: $white !important; 66 border-color: $white !important;
67 box-shadow: 0 0 0 0.2rem rgba(255, 255, 255, 0.7) !important; 67 box-shadow: 0 0 0 0.2rem rgba(255, 255, 255, 0.7) !important;
68 } 68 }
69 } 69 }
70 70
71 .carousel-control { 71 .carousel-control {
72 visibility: hidden !important; 72 visibility: hidden !important;
73 } 73 }
74 74
75 .carousel, .carousel-inner, .item { 75 .carousel, .carousel-inner, .item {
76 height: 100% !important; 76 height: 100% !important;
77 &:focus{ 77 &:focus{
78 outline: none !important; 78 outline: none !important;
79 } 79 }
80 } 80 }
81 81
82 @import "../../../node_modules/bootstrap/scss/bootstrap"; 82 @import "../../../node_modules/bootstrap/scss/bootstrap";
83 83