Martin Macola / autoservicio

Download as
Browse Code ยป

Commit 930ae70b354976022bf624ca9b21a00774f4bc30

Authored by Eric Fernandez
2 parents d2dcb1b9f9 10f7e2aa3d
Exists in master

Merge branch 'master' into 'master' 

Master(mpuebla)

See merge request !28
Showing 9 changed files   Show diff stats
src/app/app-routing.module.ts
Diff comments   View file @ 930ae70
... ... @@ -12,13 +12,13 @@ const routes: Routes = [
12 12 { path: '', component: HomeComponent },
13 13 { path: 'home', component: HomeComponent },
14 14 { path: 'abm-imagenes', component: AmbImagenesComponent },
  15 + { path: 'confirmacion-carrito', component: ConfirmacionCarritoComponent },
15 16 {
16 17 path: '',
17 18 component: MasterComponent,
18 19 children: [
19 20 { path: 'inicio', component: InicioComponent },
20 21 { path: 'busqueda-productos', component: BusquedaProductosComponent },
21   - { path: 'confirmacion-carrito', component: ConfirmacionCarritoComponent },
22 22 { path: 'pago', component: PagoComponent }
23 23 ]
24 24 },
src/app/app.module.ts
Diff comments   View file @ 930ae70
... ... @@ -12,7 +12,6 @@ import { PopoverModule } from 'ngx-bootstrap/popover';
12 12 import { AppComponent } from './app.component';
13 13 import { HeaderComponent } from './components/header/header.component';
14 14 import { SidebarComponent } from './components/sidebar/sidebar.component';
15   -import { CarouselComponent } from './components/carousel/carousel.component';
16 15 import { HomeComponent } from './components/home/home.component';
17 16 import { InicioComponent } from './components/inicio/inicio.component';
18 17 import { BusquedaProductosComponent } from './components/busqueda-productos/busqueda-productos.component';
... ... @@ -29,7 +28,6 @@ import { PagoComponent } from './components/pago/pago.component';
29 28 AppComponent,
30 29 HeaderComponent,
31 30 SidebarComponent,
32   - CarouselComponent,
33 31 HomeComponent,
34 32 InicioComponent,
35 33 BusquedaProductosComponent,
src/app/components/carousel/carousel.component.html
View file @ 930ae70
... ... @@ -1,28 +0,0 @@
1   -<div id="carouselExampleSlidesOnly" class="carousel slide" data-ride="carousel">
2   - <div class="carousel-inner">
3   - <div class="carousel-item active">
4   - <div class="card" style="width: 18rem;">
5   - <div class="card-body">
6   - <h5 class="card-title">Card title</h5>
7   - <h6 class="card-subtitle mb-2 text-muted">Card subtitle</h6>
8   - <p class="card-text">Some quick example text to build on the card title and make up the bulk of the
9   - card's content.</p>
10   - <a href="#" class="card-link">Card link</a>
11   - <a href="#" class="card-link">Another link</a>
12   - </div>
13   - </div>
14   - </div>
15   - <div class="carousel-item">
16   - <div class="card" style="width: 18rem;">
17   - <div class="card-body">
18   - <h5 class="card-title">Card title 2222</h5>
19   - <h6 class="card-subtitle mb-2 text-muted">Card subtitle</h6>
20   - <p class="card-text">Some quick example text to build on the card title and make up the bulk of the
21   - card's content.</p>
22   - <a href="#" class="card-link">Card link</a>
23   - <a href="#" class="card-link">Another link</a>
24   - </div>
25   - </div>
26   - </div>
27   - </div>
28   -</div>
29 0 \ No newline at end of file
src/app/components/carousel/carousel.component.scss
View file @ 930ae70
src/app/components/carousel/carousel.component.spec.ts
View file @ 930ae70
... ... @@ -1,25 +0,0 @@
1   -import { async, ComponentFixture, TestBed } from '@angular/core/testing';
2   -
3   -import { CarouselComponent } from './carousel.component';
4   -
5   -describe('CarouselComponent', () => {
6   - let component: CarouselComponent;
7   - let fixture: ComponentFixture<CarouselComponent>;
8   -
9   - beforeEach(async(() => {
10   - TestBed.configureTestingModule({
11   - declarations: [ CarouselComponent ]
12   - })
13   - .compileComponents();
14   - }));
15   -
16   - beforeEach(() => {
17   - fixture = TestBed.createComponent(CarouselComponent);
18   - component = fixture.componentInstance;
19   - fixture.detectChanges();
20   - });
21   -
22   - it('should create', () => {
23   - expect(component).toBeTruthy();
24   - });
25   -});
src/app/components/carousel/carousel.component.ts
View file @ 930ae70
... ... @@ -1,15 +0,0 @@
1   -import { Component, OnInit } from '@angular/core';
2   -
3   -@Component({
4   - selector: 'app-carousel',
5   - templateUrl: './carousel.component.html',
6   - styleUrls: ['./carousel.component.scss']
7   -})
8   -export class CarouselComponent implements OnInit {
9   -
10   - constructor() { }
11   -
12   - ngOnInit() {
13   - }
14   -
15   -}
src/app/components/confirmacion-carrito/confirmacion-carrito.component.html
Diff comments   View file @ 930ae70
1   -<div class="row">
2   - <div class="col-12">
  1 +<div class="row m-0 fade-in bg-primary-gradient disable-user-select">
  2 + <div class="col-12 p-0 vh-100">
  3 +
  4 + <!-- TOP HEADER -->
  5 + <app-header></app-header>
3 6  
4 7 <!-- NOMBRE DE SECCION -->
5 8 <div class="row m-0">
6 9 <div class="col-12 p-0">
7   - <p class="h5 py-1 bg-gray text-muted text-center">Pago <i class="fa fa-usd"></i></p>
  10 + <p class="h5 py-1 bg-gray text-muted text-center m-0">
  11 + Pagar
  12 + <i class="fa fa-usd"></i>
  13 + </p>
8 14 </div>
9 15 </div>
10 16  
11   - <div class="row m-3 d-flex align-items-center">
12   - <div class="col-4">
13   - <h1>Mi Compra <i class="fa fa-shopping-cart "></i></h1>
14   - </div>
15   - <div class="col-8">
16   - <h2>ยฟDesea finalizar su compra?</h2>
17   - <h3>Por favor, controle y confirme su compra.</h3>
18   - </div>
19   - <div class="col-sm-7">
20   -
21   - <div class="row pr-3 vh-50 overflow-scroll">
22   - <div class="col-4 p-2" *ngFor="let producto of productos">
23   - <div class="card card-effect bg-white rounded-sm shadow border-0">
24   - <img src="{{apiUrl}}/imagenes/{{producto.imagenes[0].imagen}}" class="card-img-top w-75 m-auto">
25   - <div class="card-body">
26   - <p class="h5 text-left m-0">{{producto.variable}}</p>
27   - <div class="text-left">
28   - <p class="m-0"><small>ASDASDSADASDSA</small></p>
29   - <p class="m-0"><small>COD. 1222</small></p>
30   - <p class="m-0"><strong>$ 563</strong></p>
  17 + <div class="row m-0">
  18 + <div class="col-12">
  19 +
  20 + <!-- TEXTO DE IZQUIERDA -->
  21 + <div class="row mx-2 mt-4 text-white">
  22 + <div class="col-sm-2 my-auto">
  23 + <p class="h2">Mi Compra
  24 + <i class="fa fa-shopping-cart "></i>
  25 + </p>
  26 + </div>
  27 + <div class="col-sm-4 my-auto">
  28 + <p class="h3">ยฟDesea finalizar su compra?</p>
  29 + <p class="h4">Por favor, controle y confirme su compra.</p>
  30 + </div>
  31 + </div>
  32 +
  33 + <div class="row">
  34 + <!-- GRILLA DE PRODUCTOS DE MI COMPRA -->
  35 + <div class="col-sm-7">
  36 + <div class="row ml-4 pr-3 vh-70 overflow-scroll text-dark">
  37 + <div class="col-4 p-2" *ngFor="let producto of productos">
  38 + <div class="bg-white rounded-sm shadow border-0">
  39 + <img src="{{apiUrl}}/imagenes/testImg.jpg" class="rounded-sm w-100 m-auto">
  40 + <div class="p-2">
  41 + <p class="h6 text-left m-0">ZARAZA</p>
  42 + <div class="row justify-content-between m-0">
  43 + <div class="col-12 p-0">
  44 + <div class="text-left">
  45 + <p class="m-0 h6"><small>ZARAZA DETALLE</small></p>
  46 + <p class="m-0 h6"><small>COD. 5656</small></p>
  47 + </div>
  48 + </div>
  49 + <div class="col-12 my-auto pt-2 pr-2 p-0">
  50 + <p class="text-right m-0 h6">{{20 | currency}}</p>
  51 + </div>
  52 + </div>
  53 + </div>
  54 + </div>
  55 + </div>
  56 + </div>
  57 + </div>
  58 +
  59 + <div class="col-sm-5">
  60 + <div class="row ml-3">
  61 + <!-- TICKET -->
  62 + <div class="col-sm-7">
  63 + <div class="card rounded-sm shadow">
  64 + <div class="card-body">
  65 + <p class="h5 card-title">Su Ticket</p>
  66 + <p class="h6 card-text text-left mt-4 pr-2 vh-60 overflow-scroll">
  67 + Ticket detalle.
  68 + </p>
  69 + <p class="h4 card-text text-right mt-3 mb-0">
  70 + Total {{230 | currency}}
  71 + </p>
  72 + </div>
31 73 </div>
32 74 </div>
33 75 </div>
34 76 </div>
35 77 </div>
36   - </div>
37   - <div class="col-sm-5">
38   - <h3>TOTAL: $553</h3>
  78 +
  79 + <!-- OPCIONES ABAJO DERECHA -->
  80 + <div class="row m-0 fixed-bottom">
  81 + <div class="col-sm-2 offset-sm-10 p-0 mt-auto">
  82 + <div class="card m-2 rounded-top-sm mt-auto blue-gradient border-0">
  83 + <div class="card-body row m-0">
  84 + <div class="col-12 p-3">
  85 + <button
  86 + type="button"
  87 + class="btn btn-block btn-light shadow btn-sm shadow"
  88 + [routerLink]="['/inicio']">
  89 + <span class="pr-2">Volver</span>
  90 + <i class="fa fa-undo text-warning"></i>
  91 + </button>
  92 + <button type="button" class="btn btn-block btn-light btn-lg shadow mb-2 p-1">
  93 + <span class="font-weight-bold pr-2">Finalizar y Pagar</span>
  94 + <i class="fa fa-check text-success"></i>
  95 + </button>
  96 + <button
  97 + type="button"
  98 + class="btn btn-block btn-light shadow btn-sm shadow"
  99 + [routerLink]="['home']">
  100 + <span class="pr-2">Cancelar</span>
  101 + <i class="fa fa-times text-danger"></i>
  102 + </button>
  103 + </div>
  104 + </div>
  105 + </div>
  106 + </div>
  107 + </div>
  108 +
39 109 </div>
40 110 </div>
  111 +
41 112 </div>
  113 +
42 114 </div>
src/app/components/header/header.component.html
Diff comments   View file @ 930ae70
1   -<div class="row bg-light p-4 justify-content-between">
  1 +<div class="row m-0 bg-light p-4 justify-content-between">
2 2 <div class="col-auto">
3 3 <img src="{{apiUrl}}/imagenes/logoaxion.png">
4 4 </div>
... ... @@ -67,8 +67,8 @@ body {
67 67 border-radius: 10px;
68 68 height: 12px;
69 69 &:active {
70   - box-shadow: inset 0 0 8px rgba(255, 0, 0, 0.9);
71   - -webkit-box-shadow: inset 0 0 8px rgba(255, 0, 0, 0.9);
  70 + box-shadow: inset 0 0 8px $primary;
  71 + -webkit-box-shadow: inset 0 0 8px $primary;
72 72 }
73 73 }
74 74 &::-webkit-scrollbar-corner {