Martin Macola / autoservicio

Download as
Browse Code ยป

Commit 6dba37fd59e964cac5809fe1b6fe1ceba655bcab

Authored by Eric Fernandez
2 parents c4f4bf9a08 099c7c0baa
Exists in master

Merge branch 'master' into 'master' 

Master(mpuebla)

See merge request !60
Showing 6 changed files   Show diff stats
src/app/app.module.ts
Diff comments   View file @ 6dba37f
... ... @@ -6,6 +6,7 @@ import { HttpClientModule } from '@angular/common/http';
6 6 import { FormsModule, ReactiveFormsModule } from '@angular/forms';
7 7 import { TooltipModule } from 'ngx-bootstrap/tooltip';
8 8 import { PopoverModule } from 'ngx-bootstrap/popover';
  9 +import { CarouselModule } from 'ngx-bootstrap/carousel';
9 10 //#endregion
10 11  
11 12 //#region Keyboard
... ... @@ -59,7 +60,8 @@ import { MensajeFinalComponent } from './components/mensaje-final/mensaje-final.
59 60 PopoverModule.forRoot(),
60 61 BrowserAnimationsModule,
61 62 MatKeyboardModule,
62   - MatButtonModule
  63 + MatButtonModule,
  64 + CarouselModule.forRoot()
63 65 ],
64 66 providers: [],
65 67 bootstrap: [AppComponent]
src/app/components/home/home.component.html
Diff comments   View file @ 6dba37f
... ... @@ -18,26 +18,24 @@
18 18 <!-- INFO DE BIENVENIDA -->
19 19 <div class="row my-auto h-50 w-100">
20 20 <div class="col-3 col-lg-4 offset-lg-1 h-100 my-auto">
21   -
22   - <div id="carouselExampleSlidesOnly" class="carousel slide h-100" data-ride="carousel">
23   - <div class="carousel-inner h-100">
24   - <div class="carousel-item active h-100">
25   - <img
26   - src="{{apiUrl}}/imagenes/coca1.jpg"
27   - class="d-block rounded-sm shadow mw-100 h-100 w-auto mx-auto">
28   - </div>
29   - <div class="carousel-item h-100">
30   - <img
31   - src="{{apiUrl}}/imagenes/coca2.jpg"
32   - class="d-block rounded-sm shadow mw-100 h-100 w-auto mx-auto">
33   - </div>
34   - <div class="carousel-item h-100">
35   - <img
36   - src="{{apiUrl}}/imagenes/coca3.jpg"
37   - class="d-block rounded-sm shadow mw-100 h-100 w-auto mx-auto">
38   - </div>
39   - </div>
40   - </div>
  21 + <!-- CAROUSEL -->
  22 + <carousel [showIndicators]="false" [interval]="1500">
  23 + <slide class="h-100">
  24 + <img
  25 + src="{{apiUrl}}/imagenes/coca1.jpg"
  26 + class="fade-in d-block rounded-sm shadow mw-100 h-100 w-auto mx-auto">
  27 + </slide>
  28 + <slide class="h-100">
  29 + <img
  30 + src="{{apiUrl}}/imagenes/coca2.jpg"
  31 + class="fade-in d-block rounded-sm shadow mw-100 h-100 w-auto mx-auto">
  32 + </slide>
  33 + <slide class="h-100">
  34 + <img
  35 + src="{{apiUrl}}/imagenes/coca3.jpg"
  36 + class="fade-in d-block rounded-sm shadow mw-100 h-100 w-auto mx-auto">
  37 + </slide>
  38 + </carousel>
41 39  
42 40 </div>
43 41 <div class="col-9 col-lg-7 text-center text-white my-auto">
src/app/components/inicio/inicio.component.html
Diff comments   View file @ 6dba37f
... ... @@ -26,22 +26,29 @@
26 26 </div>
27 27 <p class="h5 card-text text-muted font-weight-light">Conozca las ofertas del momento.</p>
28 28 </div>
29   - <div id="carouselIndicators" class="carousel slide" data-ride="carousel">
30   - <div class="carousel-inner">
31   - <div class="carousel-item active">
32   - <img src="{{apiUrl}}/imagenes/beldent.jpg" class="d-block w-75 m-auto rounded">
33   - </div>
34   - <div class="carousel-item">
35   - <img src="{{apiUrl}}/imagenes/cafe con leche y medialunas.jpg" class="d-block w-75 m-auto rounded">
36   - </div>
37   - <div class="carousel-item">
38   - <img src="{{apiUrl}}/imagenes/Surtido bagley.jpg" class="d-block w-75 m-auto rounded">
39   - </div>
40   - <div class="carousel-item">
41   - <img src="{{apiUrl}}/imagenes/yogurisimo.jpg" class="d-block w-75 m-auto rounded">
42   - </div>
43   - </div>
44   - </div>
  29 + <!-- CAROUSEL -->
  30 + <carousel [showIndicators]="false" [interval]="1500">
  31 + <slide class="h-100">
  32 + <img
  33 + src="{{apiUrl}}/imagenes/beldent.jpg"
  34 + class="fade-in d-block w-75 m-auto rounded">
  35 + </slide>
  36 + <slide class="h-100">
  37 + <img
  38 + src="{{apiUrl}}/imagenes/cafe con leche y medialunas.jpg"
  39 + class="fade-in d-block w-75 m-auto rounded">
  40 + </slide>
  41 + <slide class="h-100">
  42 + <img
  43 + src="{{apiUrl}}/imagenes/Surtido bagley.jpg"
  44 + class="fade-in d-block w-75 m-auto rounded">
  45 + </slide>
  46 + <slide class="h-100">
  47 + <img
  48 + src="{{apiUrl}}/imagenes/yogurisimo.jpg"
  49 + class="fade-in d-block w-75 m-auto rounded">
  50 + </slide>
  51 + </carousel>
45 52 </div>
46 53  
47 54 <!-- ORDENAR -->
... ... @@ -72,7 +79,7 @@
72 79 *ngIf="promociones.length > 0 && sinonimos.length === 0"
73 80 [popover]="popoverDirective"
74 81 [popoverContent]="promociones"
75   - (promoSeleccionada)="promoSeleccionada($event)"
  82 + (promoSeleccionada)="promoSeleccionada($event, false)"
76 83 class="text-white rounded-sm border-0">
77 84 </app-popover-promos>
78 85 <app-popover-sinonimos
src/app/components/inicio/inicio.component.ts
Diff comments   View file @ 6dba37f
1   -import { Component, OnInit, ViewChild, HostListener } from '@angular/core';
  1 +import { Component, OnInit, ViewChild, HostListener, AfterViewInit } from '@angular/core';
2 2 import { PopoverDirective } from 'ngx-bootstrap';
3 3 import { appSettings } from 'src/etc/AppSettings';
4 4 import { Router } from '@angular/router';
... ... @@ -11,7 +11,7 @@ import { Sinonimo } from &#39;src/app/wrappers/sinonimo&#39;;
11 11 templateUrl: './inicio.component.html',
12 12 styleUrls: ['./inicio.component.scss']
13 13 })
14   -export class InicioComponent implements OnInit {
  14 +export class InicioComponent implements OnInit, AfterViewInit {
15 15  
16 16 private tienePromo = false;
17 17 private productoEsPromo = false;
... ... @@ -38,20 +38,36 @@ export class InicioComponent implements OnInit {
38 38  
39 39 constructor(
40 40 private router: Router,
41   - private productoService: ProductoService) { }
  41 + private productoService: ProductoService
  42 + ) { }
42 43  
43 44 ngOnInit() {
44 45  
45 46 this.productoAcargar = this.productoService.productoAcargar;
46   - if (this.productoAcargar) {
  47 + this.getProductos();
  48 + }
  49 +
  50 + ngAfterViewInit() {
  51 +
  52 + setTimeout(() => {
  53 + if (!this.productoAcargar) return;
  54 +
47 55 if (this.productoAcargar.PRO) {
48 56 this.promociones.push(this.productoAcargar);
49   - this.promoSeleccionada(this.productoAcargar);
  57 + this.promoSeleccionada(this.productoAcargar, true);
50 58 }
51   - else
  59 + else {
52 60 this.getPromociones();
53   - }
54   - this.getProductos();
  61 + }
  62 + })
  63 + }
  64 +
  65 + getProductos() {
  66 +
  67 + this.productoService.getAll()
  68 + .subscribe((productos: Producto[]) => {
  69 + this.productos = productos;
  70 + });
55 71 }
56 72  
57 73 getPromociones() {
... ... @@ -62,12 +78,10 @@ export class InicioComponent implements OnInit {
62 78 .subscribe((res: Producto[]) => {
63 79  
64 80 if (res.length === 0) {
65   - //Si no tiene promociones la cargarรก al carrito despues de un tiempo
66   - // setTimeout(() => {
  81 +
67 82 this.productoAcargar.cantidad = 1;
68 83 this.productoService.productos.push(this.productoAcargar);
69 84 this.productoAcargar = this.productoService.productoAcargar = undefined;
70   - // }, 2000)
71 85 } else {
72 86  
73 87 this.promociones = res;
... ... @@ -76,21 +90,8 @@ export class InicioComponent implements OnInit {
76 90 }, error => { console.error(error); })
77 91 }
78 92  
79   - getProductos() {
80   -
81   - this.productoService.getAll()
82   - .subscribe((productos: Producto[]) => {
83   - this.productos = productos;
84   - });
85   - }
86   -
87   - irBusquedaProductos(value) {
88   -
89   - this.productoService.mostrar = value;
90   - this.router.navigate(['busqueda-productos']);
91   - }
92   -
93 93 confirmarProducto() {
  94 +
94 95 var producto = this.promoAcargar ? this.promoAcargar : this.productoAcargar;
95 96 producto.cantidad = 1;
96 97 this.productoService.productos.push(producto);
... ... @@ -99,46 +100,24 @@ export class InicioComponent implements OnInit {
99 100 this.popoverDirective.hide();
100 101 }
101 102  
102   - deshacerCarga() {
  103 + promoSeleccionada($event: Producto, showPopover: boolean) {
103 104  
104   - if (this.sinonimos.length > 0) {
105   - this.sinonimos = [];
106   - this.popoverDirective.hide();
107   - }
  105 + this.productoService.getProductoById($event.id)
  106 + .subscribe((res: Producto) => {
  107 +
  108 + $event.imagenes = res.imagenes.length == 0 ? [{ imagen: 'noImage.jpg' }] : res.imagenes;
  109 + this.promoAcargar = $event;
108 110  
109   - if (this.promoAcargar) {
110   - this.promoAcargar = undefined;
111   - if (this.productoAcargar.PRO) {
112   - this.productoAcargar = undefined;
113   - this.promociones = [];
114   - this.popoverDirective.hide();
115   - } else {
116   - this.popoverDirective.show();
117   - }
118   - } else {
119   - this.productoAcargar = undefined;
120   - this.promociones = [];
121   - this.popoverDirective.hide();
122   - }
123   - }
124   -
125   - promoSeleccionada($event: Producto) {
126   -
127   - if ($event.tieneSinonimos) {
128   -
129   - this.productoService.getProductoById($event.id)
130   - .subscribe((res: Producto) => {
131   -
132   - $event.imagenes = res.imagenes;
133   - this.promoAcargar = $event;
  111 + if ($event.tieneSinonimos) {
134 112 this.getSinonimos(this.promoAcargar.CodSec, this.promoAcargar.CodArt);
135   - },
136   - error => { console.log(error); })
137   -
  113 + } else if (showPopover) {
  114 + this.popoverDirective.show();
  115 + } else {
  116 + this.popoverDirective.hide();
  117 + }
138 118  
139   - } else if (this.popoverDirective) {
140   - this.popoverDirective.hide();
141   - }
  119 + },
  120 + error => { console.log(error); })
142 121 }
143 122  
144 123 getSinonimos(sector, codigo) {
... ... @@ -161,10 +140,7 @@ export class InicioComponent implements OnInit {
161 140 })
162 141  
163 142 this.sinonimos = res;
164   - if (res.length > 0)
165   - this.popoverDirective.show();
166   - else
167   - this.popoverDirective.hide();
  143 + (this.sinonimos.length > 0) ? this.popoverDirective.show() : this.popoverDirective.hide();
168 144 })
169 145 }
170 146  
... ... @@ -198,4 +174,33 @@ export class InicioComponent implements OnInit {
198 174  
199 175 }
200 176  
  177 + irBusquedaProductos(value) {
  178 +
  179 + this.productoService.mostrar = value;
  180 + this.router.navigate(['busqueda-productos']);
  181 + }
  182 +
  183 + deshacerCarga() {
  184 +
  185 + if (this.sinonimos.length > 0) {
  186 + this.sinonimos = [];
  187 + this.popoverDirective.hide();
  188 + }
  189 +
  190 + if (this.promoAcargar) {
  191 + this.promoAcargar = undefined;
  192 + if (this.productoAcargar.PRO) {
  193 + this.productoAcargar = undefined;
  194 + this.promociones = [];
  195 + this.popoverDirective.hide();
  196 + } else {
  197 + this.popoverDirective.show();
  198 + }
  199 + } else {
  200 + this.productoAcargar = undefined;
  201 + this.promociones = [];
  202 + this.popoverDirective.hide();
  203 + }
  204 + }
  205 +
201 206 }
src/app/components/sidebar/sidebar.component.html
Diff comments   View file @ 6dba37f
... ... @@ -33,7 +33,7 @@
33 33 (click)="aumentarCantidad(producto)">
34 34 <i class="fa fa-plus" aria-hidden="true"></i>
35 35 </button>
36   - <div class="bg-white border border-white px-3 my-auto text-dark h5 shadow">
  36 + <div class="bg-white border border-white px-2 my-auto text-dark h5 shadow">
37 37 <small>{{producto.cantidad}}</small>
38 38 </div>
39 39 <button
src/assets/scss/bootstrap-override.scss
Diff comments   View file @ 6dba37f
... ... @@ -68,4 +68,15 @@ $theme-colors: (
68 68 }
69 69 }
70 70  
  71 +.carousel-control {
  72 + visibility: hidden !important;
  73 +}
  74 +
  75 +.carousel, .carousel-inner, .item {
  76 + height: 100% !important;
  77 + &:focus{
  78 + outline: none !important;
  79 + }
  80 +}
  81 +
71 82 @import "../../../node_modules/bootstrap/scss/bootstrap";