Commit 5aee6bac60ec7cf84999572a91baefc72280ed6e

Authored by Marcelo Puebla
Exists in master and in 1 other branch validar_pve

Merge branch 'master' into 'master'

Master(efernandez)

See merge request !11
src/app/app-routing.module.ts
... ... @@ -3,11 +3,13 @@ import { Routes, RouterModule } from '@angular/router';
3 3 import { HomeComponent } from './components/home/home.component';
4 4 import { InicioComponent } from './components/inicio/inicio.component';
5 5 import { BusquedaProductosComponent } from './components/busqueda-productos/busqueda-productos.component';
  6 +import { ConfirmacionCarritoComponent } from './components/confirmacion-carrito/confirmacion-carrito.component';
6 7  
7 8 const routes: Routes = [
8 9 { path: 'home', component: HomeComponent },
9 10 { path: 'inicio', component: InicioComponent },
10 11 { path: 'busqueda-productos', component: BusquedaProductosComponent },
  12 + { path: 'confirmacion-carrito', component: ConfirmacionCarritoComponent },
11 13 { path: '**', redirectTo: '/home', pathMatch: 'full' },
12 14 ];
13 15  
... ... @@ -15,4 +17,5 @@ const routes: Routes = [
15 17 imports: [RouterModule.forRoot(routes)],
16 18 exports: [RouterModule]
17 19 })
  20 +
18 21 export class AppRoutingModule { }
src/app/app.module.ts
... ... @@ -13,6 +13,7 @@ import { CarouselComponent } from './components/carousel/carousel.component';
13 13 import { HomeComponent } from './components/home/home.component';
14 14 import { InicioComponent } from './components/inicio/inicio.component';
15 15 import { BusquedaProductosComponent } from './components/busqueda-productos/busqueda-productos.component';
  16 +import { ConfirmacionCarritoComponent } from './components/confirmacion-carrito/confirmacion-carrito.component';
16 17 //#endregion
17 18  
18 19 @NgModule({
... ... @@ -23,7 +24,8 @@ import { BusquedaProductosComponent } from './components/busqueda-productos/busq
23 24 CarouselComponent,
24 25 HomeComponent,
25 26 InicioComponent,
26   - BusquedaProductosComponent
  27 + BusquedaProductosComponent,
  28 + ConfirmacionCarritoComponent
27 29 ],
28 30 imports: [
29 31 BrowserModule,
src/app/components/confirmacion-carrito/confirmacion-carrito.component.html
... ... @@ -0,0 +1,48 @@
  1 +<app-header></app-header>
  2 +<div class="row">
  3 + <div class="col-10">
  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-light text-muted text-center">Pago <i class="fa fa-usd"></i></p>
  9 + </div>
  10 + </div>
  11 +
  12 + <div class="row m-4 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>¿Desea finalizar su compra?</h2>
  18 + <h3>Por favor, controle y confirme su compra.</h3>
  19 + </div>
  20 + <div class="col-sm-7">
  21 +
  22 + <div class="row pr-3 vh-50 overflow-scroll">
  23 + <div
  24 + class="col-4 p-2"
  25 + *ngFor="let producto of productos">
  26 + <div class="card card-effect bg-white rounded-sm shadow border-0">
  27 + <img src="../../../assets/img/descarga.jpg" class="card-img-top w-75 m-auto">
  28 + <div class="card-body">
  29 + <p class="h5 text-left m-0">{{producto.variable}}</p>
  30 + <div class="text-left">
  31 + <p class="m-0"><small>ASDASDSADASDSA</small></p>
  32 + <p class="m-0"><small>COD. 1222</small></p>
  33 + <p class="m-0"><strong>$ 563</strong></p>
  34 + </div>
  35 + </div>
  36 + </div>
  37 + </div>
  38 + </div>
  39 + </div>
  40 + <div class="col-sm-5">
  41 + <h3>TOTAL: $553</h3>
  42 + </div>
  43 +</div>
  44 +
  45 +<!-- SIDEBAR -->
  46 +</div>
  47 + <app-sidebar class="col-3 col-md-2 vh-100 bg-dark text-white"></app-sidebar>
  48 +</div>
src/app/components/confirmacion-carrito/confirmacion-carrito.component.scss
src/app/components/confirmacion-carrito/confirmacion-carrito.component.spec.ts
... ... @@ -0,0 +1,25 @@
  1 +import { async, ComponentFixture, TestBed } from '@angular/core/testing';
  2 +
  3 +import { ConfirmacionCarritoComponent } from './confirmacion-carrito.component';
  4 +
  5 +describe('ConfirmacionCarritoComponent', () => {
  6 + let component: ConfirmacionCarritoComponent;
  7 + let fixture: ComponentFixture<ConfirmacionCarritoComponent>;
  8 +
  9 + beforeEach(async(() => {
  10 + TestBed.configureTestingModule({
  11 + declarations: [ ConfirmacionCarritoComponent ]
  12 + })
  13 + .compileComponents();
  14 + }));
  15 +
  16 + beforeEach(() => {
  17 + fixture = TestBed.createComponent(ConfirmacionCarritoComponent);
  18 + component = fixture.componentInstance;
  19 + fixture.detectChanges();
  20 + });
  21 +
  22 + it('should create', () => {
  23 + expect(component).toBeTruthy();
  24 + });
  25 +});
src/app/components/confirmacion-carrito/confirmacion-carrito.component.ts
... ... @@ -0,0 +1,16 @@
  1 +import { Component, OnInit } from '@angular/core';
  2 +
  3 +@Component({
  4 + selector: 'app-confirmacion-carrito',
  5 + templateUrl: './confirmacion-carrito.component.html',
  6 + styleUrls: ['./confirmacion-carrito.component.scss']
  7 +})
  8 +export class ConfirmacionCarritoComponent implements OnInit {
  9 +
  10 + productos = [{}, {}, {}]
  11 + constructor() { }
  12 +
  13 + ngOnInit() {
  14 + }
  15 +
  16 +}
src/app/components/inicio/inicio.component.html
... ... @@ -91,4 +91,4 @@
91 91  
92 92 <!-- SIDEBAR -->
93 93 <app-sidebar class="col-3 col-md-2 vh-100 bg-dark text-white"></app-sidebar>
94   -</div>
95 94 \ No newline at end of file
  95 +</div>
src/app/components/sidebar/sidebar.component.html
... ... @@ -36,7 +36,7 @@
36 36 <h3 class="text-dark"><strong>{{total | currency}}</strong></h3>
37 37 </div>
38 38 <div class="col 12 p-0">
39   - <button type="button" class="btn btn-light shadow mb-2"><strong>Finalizar y pagar</strong></button>
  39 + <button type="button" class="btn btn-light shadow mb-2" routerLink="/confirmacion-carrito"><strong>Finalizar y pagar</strong></button>
40 40 <button type="button" class="btn btn-light shadow btn-sm" (click)="clearCar()">Cancelar</button>
41 41 </div>
42 42 </div>