Commit ceb40c2a7d06c691c64cca9dae6d96c31d4e03a2
Exists in
master
and in
1 other branch
Merge branch 'master' of git.focasoftware.com:angular/autoservicio
Showing
11 changed files
Show diff stats
src/app/app-routing.module.ts
... | ... | @@ -6,6 +6,7 @@ import { BusquedaProductosComponent } from './components/busqueda-productos/busq |
6 | 6 | import { ConfirmacionCarritoComponent } from './components/confirmacion-carrito/confirmacion-carrito.component'; |
7 | 7 | import { MasterComponent } from './components/master/master.component'; |
8 | 8 | import { AmbImagenesComponent } from './components/amb-imagenes/amb-imagenes.component'; |
9 | +import { PagoComponent } from './components/pago/pago.component'; | |
9 | 10 | |
10 | 11 | const routes: Routes = [ |
11 | 12 | { path: '', component: HomeComponent }, |
... | ... | @@ -17,7 +18,8 @@ const routes: Routes = [ |
17 | 18 | children: [ |
18 | 19 | { path: 'inicio', component: InicioComponent }, |
19 | 20 | { path: 'busqueda-productos', component: BusquedaProductosComponent }, |
20 | - { path: 'confirmacion-carrito', component: ConfirmacionCarritoComponent } | |
21 | + { path: 'confirmacion-carrito', component: ConfirmacionCarritoComponent }, | |
22 | + { path: 'pago', component: PagoComponent } | |
21 | 23 | ] |
22 | 24 | }, |
23 | 25 | { path: '**', redirectTo: '/home', pathMatch: 'full' }, |
src/app/app.module.ts
... | ... | @@ -21,6 +21,7 @@ import { MasterComponent } from './components/master/master.component'; |
21 | 21 | import { PopoverPromosComponent } from './components/popover-promos/popover-promos.component'; |
22 | 22 | import { PopoverSinonimosComponent } from './components/popover-sinonimos/popover-sinonimos.component'; |
23 | 23 | import { AmbImagenesComponent } from './components/amb-imagenes/amb-imagenes.component'; |
24 | +import { PagoComponent } from './components/pago/pago.component'; | |
24 | 25 | //#endregion |
25 | 26 | |
26 | 27 | @NgModule({ |
... | ... | @@ -36,7 +37,8 @@ import { AmbImagenesComponent } from './components/amb-imagenes/amb-imagenes.com |
36 | 37 | MasterComponent, |
37 | 38 | PopoverPromosComponent, |
38 | 39 | PopoverSinonimosComponent, |
39 | - AmbImagenesComponent | |
40 | + AmbImagenesComponent, | |
41 | + PagoComponent | |
40 | 42 | ], |
41 | 43 | imports: [ |
42 | 44 | BrowserModule, |
src/app/components/busqueda-productos/busqueda-productos.component.html
... | ... | @@ -20,49 +20,14 @@ |
20 | 20 | </div> |
21 | 21 | <ul class="list-group"> |
22 | 22 | <li |
23 | - [ngClass]="{active: categoria == 1}" | |
24 | - (click)="categoria = 1" | |
23 | + *ngFor="let categoria of categorias" | |
24 | + [ngClass]="{active: categoriaActive == categoria.id}" | |
25 | + (click)="categoriaActive = categoria.id; filterItems()" | |
25 | 26 | class="list-group-item list-group-item-action text-center my-1 p-2 h6"> |
26 | - Combos y Promociones | |
27 | - </li> | |
28 | - <li | |
29 | - [ngClass]="{active: categoria == 2}" | |
30 | - (click)="categoria = 2" | |
31 | - class="list-group-item list-group-item-action text-center my-1 p-2 h6 shadow-sm"> | |
32 | - Todos | |
33 | - </li> | |
34 | - <li | |
35 | - [ngClass]="{active: categoria == 3}" | |
36 | - (click)="categoria = 3" | |
37 | - class="list-group-item list-group-item-action text-center my-1 p-2 h6 shadow-sm"> | |
38 | - Bebidas | |
39 | - </li> | |
40 | - <li | |
41 | - [ngClass]="{active: categoria == 4}" | |
42 | - (click)="categoria = 4" | |
43 | - class="list-group-item list-group-item-action text-center my-1 p-2 h6 shadow-sm"> | |
44 | - Sandwicherรญa | |
45 | - </li> | |
46 | - <li | |
47 | - [ngClass]="{active: categoria == 5}" | |
48 | - (click)="categoria = 5" | |
49 | - class="list-group-item list-group-item-action text-center my-1 p-2 h6 shadow-sm"> | |
50 | - Panaderia | |
51 | - </li> | |
52 | - <li | |
53 | - [ngClass]="{active: categoria == 6}" | |
54 | - (click)="categoria = 6" | |
55 | - class="list-group-item list-group-item-action text-center my-1 p-2 h6 shadow-sm"> | |
56 | - Golosinas | |
57 | - </li> | |
58 | - <li | |
59 | - [ngClass]="{active: categoria == 7}" | |
60 | - (click)="categoria = 7" | |
61 | - class="list-group-item list-group-item-action text-center my-1 p-2 h6 shadow-sm"> | |
62 | - Tabaqueria | |
27 | + {{categoria.detalle}} | |
63 | 28 | </li> |
64 | 29 | </ul> |
65 | - </div> | |
30 | + </div> | |
66 | 31 | |
67 | 32 | <!-- SEARCH INPUT --> |
68 | 33 | <div *ngIf="productos.length > 0" class="fade-in col-sm-10"> |
src/app/components/busqueda-productos/busqueda-productos.component.ts
1 | 1 | import { Component, OnInit, APP_BOOTSTRAP_LISTENER } from '@angular/core'; |
2 | 2 | import { ProductoService } from 'src/app/services/producto.service'; |
3 | 3 | import { Producto } from 'src/app/wrappers/producto'; |
4 | +import { Categoria } from 'src/app/wrappers/categoria'; | |
4 | 5 | import { appSettings } from 'src/etc/AppSettings'; |
5 | 6 | import { Router } from '@angular/router'; |
6 | 7 | |
... | ... | @@ -14,17 +15,24 @@ export class BusquedaProductosComponent implements OnInit { |
14 | 15 | private productos: Producto[] = []; |
15 | 16 | private auxProductos: Producto[] = []; |
16 | 17 | private searchTerm: string = ''; |
18 | + private categoriaActive: number = null; | |
17 | 19 | private showSpinner: boolean = true; |
18 | - private categoria: Categorias = Categorias.todos; | |
19 | 20 | private apiUrl: string = appSettings.apiUrl; |
20 | 21 | private showBtnCargarProducto: boolean = false; |
22 | + private categorias: Categoria[] = []; | |
21 | 23 | |
22 | 24 | constructor( |
23 | 25 | private productoService: ProductoService, |
24 | 26 | private router: Router) { } |
25 | 27 | |
26 | 28 | ngOnInit() { |
27 | - | |
29 | + | |
30 | + this.productoService.getCategorias() | |
31 | + .subscribe((categorias: Categoria[]) => { | |
32 | + this.categorias = categorias; | |
33 | + this.categoriaActive = categorias[0].id; | |
34 | + }); | |
35 | + | |
28 | 36 | this.productoService.productoAcargar = undefined; |
29 | 37 | this.productoService.getAll() |
30 | 38 | .subscribe((data: Producto[]) => { |
... | ... | @@ -39,7 +47,8 @@ export class BusquedaProductosComponent implements OnInit { |
39 | 47 | filterItems() { |
40 | 48 | |
41 | 49 | this.auxProductos = this.productos.filter(x => { |
42 | - return x.DetArt.toLowerCase().includes(this.searchTerm.toLowerCase()) | |
50 | + return x.DetArt.toLowerCase().includes(this.searchTerm.toLowerCase()) && | |
51 | + x.categoria_selfservice == this.categoriaActive; | |
43 | 52 | }); |
44 | 53 | } |
45 | 54 | |
... | ... | @@ -66,12 +75,3 @@ export class BusquedaProductosComponent implements OnInit { |
66 | 75 | } |
67 | 76 | } |
68 | 77 | |
69 | -enum Categorias { | |
70 | - promosCombos = 1, | |
71 | - todos = 2, | |
72 | - bebidas = 3, | |
73 | - sandwicheria = 4, | |
74 | - panaderia = 5, | |
75 | - golosinas = 6, | |
76 | - tabaqueria = 7, | |
77 | -} |
src/app/components/pago/pago.component.html
... | ... | @@ -0,0 +1,36 @@ |
1 | +<div class="row"> | |
2 | + | |
3 | + <div class="col-12"> | |
4 | + | |
5 | + <!-- NOMBRE DE SECCION --> | |
6 | + <div class="row m-0"> | |
7 | + <div class="col-12 p-0"> | |
8 | + <p class="h5 py-1 bg-gray text-muted text-center">Pago <i class="fa fa-usd"></i></p> | |
9 | + </div> | |
10 | + </div> | |
11 | + | |
12 | + <div class="row m-3 d-flex align-items-center"> | |
13 | + <div class="col-4"> | |
14 | + <h1>Mi Compra <i class="fa fa-shopping-cart"></i></h1> | |
15 | + </div> | |
16 | + <div class="col-8"> | |
17 | + <h2>Seleccione medio de pago</h2> | |
18 | + </div> | |
19 | + </div> | |
20 | + | |
21 | + </div> | |
22 | + | |
23 | + <div class="col-6 card bg-white border-0 shadow rounded mb-auto"> | |
24 | + <h3>Pago con tarjeta de dรฉbito/crรฉdito</h3> | |
25 | + <div class="card-body"> | |
26 | + <img src="{{apiUrl}}/imagenes/posnet.jpg"> | |
27 | + </div> | |
28 | + </div> | |
29 | + | |
30 | + <div class="col-6 card bg-white border-0 shadow rounded mb-auto"> | |
31 | + <h3>Pago con QR mercado pago</h3> | |
32 | + <div class="card-body"> | |
33 | + <img src="{{apiUrl}}/imagenes/qrmp.jpg" alt=""> | |
34 | + </div> | |
35 | + </div> | |
36 | +</div> |
src/app/components/pago/pago.component.scss
src/app/components/pago/pago.component.spec.ts
... | ... | @@ -0,0 +1,25 @@ |
1 | +import { async, ComponentFixture, TestBed } from '@angular/core/testing'; | |
2 | + | |
3 | +import { PagoComponent } from './pago.component'; | |
4 | + | |
5 | +describe('PagoComponent', () => { | |
6 | + let component: PagoComponent; | |
7 | + let fixture: ComponentFixture<PagoComponent>; | |
8 | + | |
9 | + beforeEach(async(() => { | |
10 | + TestBed.configureTestingModule({ | |
11 | + declarations: [ PagoComponent ] | |
12 | + }) | |
13 | + .compileComponents(); | |
14 | + })); | |
15 | + | |
16 | + beforeEach(() => { | |
17 | + fixture = TestBed.createComponent(PagoComponent); | |
18 | + component = fixture.componentInstance; | |
19 | + fixture.detectChanges(); | |
20 | + }); | |
21 | + | |
22 | + it('should create', () => { | |
23 | + expect(component).toBeTruthy(); | |
24 | + }); | |
25 | +}); |
src/app/components/pago/pago.component.ts
... | ... | @@ -0,0 +1,18 @@ |
1 | +import { Component, OnInit } from '@angular/core'; | |
2 | +import { appSettings } from 'src/etc/AppSettings'; | |
3 | + | |
4 | +@Component({ | |
5 | + selector: 'app-pago', | |
6 | + templateUrl: './pago.component.html', | |
7 | + styleUrls: ['./pago.component.scss'] | |
8 | +}) | |
9 | +export class PagoComponent implements OnInit { | |
10 | + | |
11 | + private apiUrl: string = appSettings.apiUrl; | |
12 | + | |
13 | + constructor() { } | |
14 | + | |
15 | + ngOnInit() { | |
16 | + } | |
17 | + | |
18 | +} |
src/app/services/producto.service.ts
... | ... | @@ -25,14 +25,14 @@ export class ProductoService { |
25 | 25 | } |
26 | 26 | |
27 | 27 | getPromocion(sector, codigo): Observable<any> { |
28 | - | |
28 | + | |
29 | 29 | var url = `${appSettings.apiUrl}/promociones/incluir-articulo/${sector}/${codigo}`; |
30 | 30 | // var url = `${appSettings.apiUrl}/promociones/incluir-articulo/${2}/${1306}`; |
31 | 31 | return this.http.get(url); |
32 | 32 | } |
33 | 33 | |
34 | 34 | getPromocionSinonimos(sector, codigo): Observable<any> { |
35 | - | |
35 | + | |
36 | 36 | var url = `${appSettings.apiUrl}/promociones/incluir-articulo/${sector}/${codigo}`; |
37 | 37 | // var url = `${appSettings.apiUrl}/sinonimos/promo/${2}/${7}`; |
38 | 38 | return this.http.get(url); |
... | ... | @@ -42,4 +42,8 @@ export class ProductoService { |
42 | 42 | return this.http.post(`${appSettings.apiUrl}/imagenes/guardar`, body); |
43 | 43 | } |
44 | 44 | |
45 | + getCategorias() { | |
46 | + return this.http.get(`${appSettings.apiUrl}/categorias`); | |
47 | + } | |
48 | + | |
45 | 49 | } |
src/app/wrappers/categoria.ts