Commit 98909d6d41f8dec661de71abbbb9d7ee98702cd3

Authored by Benjamin Rodriguez
Exists in develop

Merge branch 'develop' of git.focasoftware.com:angular/autoservicio-axion

src/app/app-routing.module.ts
1 import { NgModule } from '@angular/core'; 1 import { NgModule } from '@angular/core';
2 import { Routes, RouterModule } from '@angular/router'; 2 import { Routes, RouterModule } from '@angular/router';
3 import { SplashScreenComponent } from './modules/splash-screen/splash-screen.component'; 3 import { SplashScreenComponent } from './modules/splash-screen/splash-screen.component';
4 import { AdminComponent } from './modules/admin/admin.component'; 4 import { AdminComponent } from './modules/admin/admin.component';
5 5
6 const routes: Routes = [ 6 const routes: Routes = [
7 { path: '', component: SplashScreenComponent }, 7 { path: '', component: SplashScreenComponent },
8 { 8 {
9 path: '', 9 path: '',
10 component: AdminComponent, 10 component: AdminComponent,
11 children: [ 11 children: [
12 { 12 {
13 path: 'info-formas-pago', 13 path: 'info-formas-pago',
14 loadChildren: () => import('./modules/info-formas-pago/info-formas-pago.module').then(m => m.InfoFormasPagoModule) 14 loadChildren: () => import('./modules/info-formas-pago/info-formas-pago.module').then(m => m.InfoFormasPagoModule)
15 }, 15 },
16 { 16 {
17 path: 'opcion-pedido', 17 path: 'opcion-pedido',
18 loadChildren: () => import('./modules/opcion-pedido/opcion-pedido.module').then(m => m.OpcionPedidoModule) 18 loadChildren: () => import('./modules/opcion-pedido/opcion-pedido.module').then(m => m.OpcionPedidoModule)
19 }, 19 },
20 { 20 {
21 path: 'seleccion-articulos', 21 path: 'seleccion-articulos',
22 loadChildren: () => import('./modules/seleccion-articulos/seleccion-articulos.module').then(m => m.SeleccionArticulosModule) 22 loadChildren: () => import('./modules/seleccion-articulos/seleccion-articulos.module').then(m => m.SeleccionArticulosModule)
23 }, 23 },
24 { 24 {
25 path: 'carrito', 25 path: 'carrito',
26 loadChildren: () => import('./modules/carrito/carrito.module').then(m => m.CarritoModule) 26 loadChildren: () => import('./modules/carrito/carrito.module').then(m => m.CarritoModule)
27 }, 27 },
28 { 28 {
29 path: 'forma-pago', 29 path: 'forma-pago',
30 loadChildren: () => import('./modules/forma-pago/forma-pago.module').then(m => m.FormaPagoModule) 30 loadChildren: () => import('./modules/forma-pago/forma-pago.module').then(m => m.FormaPagoModule)
31 }, 31 },
32 { 32 {
33 path: 'pago-electronico', 33 path: 'pago-electronico',
34 loadChildren: () => import('./modules/pago-electronico/pago-electronico.module').then(m => m.PagoElectronicoModule) 34 loadChildren: () => import('./modules/pago-electronico/pago-electronico.module').then(m => m.PagoElectronicoModule)
35 }, 35 },
36 { 36 {
37 path: 'pago-tarjeta', 37 path: 'pago-tarjeta',
38 loadChildren: () => import('./modules/pago-tarjeta/pago-tarjeta.module').then(m => m.PagoTarjetaModule) 38 loadChildren: () => import('./modules/pago-tarjeta/pago-tarjeta.module').then(m => m.PagoTarjetaModule)
39 }, 39 },
40 ] 40 ]
41 }, 41 },
42 { 42 {
43 path: 'mensaje-final', 43 path: 'mensaje-final',
44 loadChildren: () => import('./modules/mensaje-final/mensaje-final.module').then(m => m.MensajeFinalModule) 44 loadChildren: () => import('./modules/mensaje-final/mensaje-final.module').then(m => m.MensajeFinalModule)
45 }, 45 },
46 { 46 {
47 path: 'pedidos-salientes', 47 path: 'pedidos-salientes',
48 loadChildren: () => import('./modules/pedidos-salientes/pedidos-salientes.module').then(m => m.PedidosSalientesModule) 48 loadChildren: () => import('./modules/pedidos-salientes/pedidos-salientes.module').then(m => m.PedidosSalientesModule)
49 }, 49 },
50 { 50 {
51 path: 'comanda', 51 path: 'comanda',
52 loadChildren: () => import('./modules/comanda/comanda.module').then(m => m.ComandaModule) 52 loadChildren: () => import('./modules/comanda/comanda.module').then(m => m.ComandaModule)
53 }, 53 },
54 { 54 {
55 path: 'cancelar-compra', 55 path: 'cancelar-compra',
56 loadChildren: () => import('./modules/cancelar-compra/cancelar-compra.module').then(m => m.CancelarCompraModule) 56 loadChildren: () => import('./shared/cancelar-compra/cancelar-compra.module').then(m => m.CancelarCompraModule)
57 }, 57 },
58 { path: '**', redirectTo: '', pathMatch: 'full' }, 58 { path: '**', redirectTo: '', pathMatch: 'full' },
59 ]; 59 ];
60 60
61 @NgModule({ 61 @NgModule({
62 imports: [RouterModule.forRoot(routes, { useHash: true })], 62 imports: [RouterModule.forRoot(routes, { useHash: true })],
63 exports: [RouterModule] 63 exports: [RouterModule]
64 }) 64 })
65 export class AppRoutingModule { } 65 export class AppRoutingModule { }
66 66
src/app/modules/cancelar-compra/cancelar-compra-routing.module.ts
1 import { NgModule, Component } from '@angular/core'; File was deleted
2 import { Routes, RouterModule } from '@angular/router';
3 import { CancelarCompraComponent } from './cancelar-compra.component';
4
5
6 const routes: Routes = [
7 { path: '', component: CancelarCompraComponent }
8 ];
9
10 @NgModule({
11 imports: [RouterModule.forChild(routes)],
12 exports: [RouterModule]
13 })
14 export class CancelarCompraRoutingModule { }
15 1 import { NgModule, Component } from '@angular/core';
src/app/modules/cancelar-compra/cancelar-compra.component.html
1 <div class="row justify-content-center mt-2 h-15"> File was deleted
2 <img class="h-100 w-auto my-auto" src="../../../assets/img/logo-spot.svg">
3 </div>
4 <div class="row mx-auto h-70">
5 <div class="col-12 align-self-center">
6 <div class="row mt-5 mx-0 justify-content-around">
7 <div class="col-12 col-sm-8 col-md-6 col-lg-3">
8 <div class="p-3 bg-white text-center shadow-lg rounded">
9 <p class="mt-4 h4">NECESITA</p>
10 <p class="font-weight-bold text-secondary my-4 h2">más tiempo</p>
11 <p class="mb-4 h4">PARA SU PEDIDO?</p>
12 </div>
13 </div>
14 </div>
15 <!-- BUTTONS -->
16 <div class="row mx-0 mt-5 justify-content-center">
17 <div class="col-auto px-0 align-self-start">
18 <div
19 class="row mx-0 py-1 btn-effect bg-primary badge-pill"
20 (click)="volverPreviousPage()">
21 <div class="col-auto align-self-center text-white">continuar compra</div>
22 <div class="col-auto align-self-center p-0">
23 <img
24 draggable="false"
25 ondragstart="return false;"
26 (contextmenu)="false"
27 class="p-1 icon-30"
28 src="assets/img/ir.svg">
29 </div>
30 </div>
31 </div>
32 </div>
33 <div class="row mx-0 mt-4 justify-content-center">
34 <div class="col-auto px-0 align-self-start">
35 <div
36 class="row mx-0 py-1 btn-effect bg-grey badge-pill"
37 (click)="limpiarCarritoYvolver()">
38 <div class="col-auto align-self-center">cancelar compra</div>
39 <div class="col-auto align-self-center p-0">
40 <img
41 draggable="false"
42 ondragstart="return false;"
43 (contextmenu)="false"
44 class="p-1 icon-30"
45 src="assets/img/icono-cancelar-color.svg">
46 </div>
47 </div>
48 </div>
49 </div>
50 </div>
51 </div>
52 1 <div class="row justify-content-center mt-2 h-15">
src/app/modules/cancelar-compra/cancelar-compra.component.scss
1 .bg-grey { File was deleted
2 background-color: rgb(212, 212, 212);
3 }
4 1 .bg-grey {
src/app/modules/cancelar-compra/cancelar-compra.component.spec.ts
1 import { async, ComponentFixture, TestBed } from '@angular/core/testing'; File was deleted
2
3 import { CancelarCompraComponent } from './cancelar-compra.component';
4
5 describe('CancelarCompraComponent', () => {
6 let component: CancelarCompraComponent;
7 let fixture: ComponentFixture<CancelarCompraComponent>;
8
9 beforeEach(async(() => {
10 TestBed.configureTestingModule({
11 declarations: [ CancelarCompraComponent ]
12 })
13 .compileComponents();
14 }));
15
16 beforeEach(() => {
17 fixture = TestBed.createComponent(CancelarCompraComponent);
18 component = fixture.componentInstance;
19 fixture.detectChanges();
20 });
21
22 it('should create', () => {
23 expect(component).toBeTruthy();
24 });
25 });
26 1 import { async, ComponentFixture, TestBed } from '@angular/core/testing';
src/app/modules/cancelar-compra/cancelar-compra.component.ts
1 import { Component, OnInit, OnDestroy } from '@angular/core'; File was deleted
2 import { Location } from '@angular/common';
3 import { ArticuloService } from 'src/app/services/articulo/articulo.service';
4 import { Router } from '@angular/router';
5
6 @Component({
7 selector: 'app-cancelar-compra',
8 templateUrl: './cancelar-compra.component.html',
9 styleUrls: ['./cancelar-compra.component.scss']
10 })
11 export class CancelarCompraComponent implements OnInit, OnDestroy {
12 timer: any;
13
14 constructor(
15 private location: Location,
16 private router: Router,
17 private articuloService: ArticuloService
18 ) { }
19
20 ngOnInit() {
21 this.timer = setTimeout(() => {
22 this.limpiarCarritoYvolver();
23 }, 90000);
24 }
25
26 ngOnDestroy() {
27 clearTimeout(this.timer);
28 }
29
30 volverPreviousPage() {
31 this.location.back();
32 }
33
34 limpiarCarritoYvolver() {
35 this.articuloService.carrito = [];
36 this.router.navigate(['/']);
37 }
38 }
39 1 import { Component, OnInit, OnDestroy } from '@angular/core';
src/app/modules/cancelar-compra/cancelar-compra.module.ts
1 import { NgModule } from '@angular/core'; File was deleted
2 import { CommonModule } from '@angular/common';
3
4 import { CancelarCompraRoutingModule } from './cancelar-compra-routing.module';
5 import { CancelarCompraComponent } from './cancelar-compra.component';
6
7
8 @NgModule({
9 declarations: [CancelarCompraComponent],
10 imports: [
11 CommonModule,
12 CancelarCompraRoutingModule
13 ]
14 })
15 export class CancelarCompraModule { }
16 1 import { NgModule } from '@angular/core';
src/app/shared/cancelar-compra/cancelar-compra-routing.module.ts
File was created 1 import { NgModule, Component } from '@angular/core';
2 import { Routes, RouterModule } from '@angular/router';
3 import { CancelarCompraComponent } from './cancelar-compra.component';
4
5
6 const routes: Routes = [
7 { path: '', component: CancelarCompraComponent }
8 ];
9
10 @NgModule({
11 imports: [RouterModule.forChild(routes)],
12 exports: [RouterModule]
13 })
14 export class CancelarCompraRoutingModule { }
15
src/app/shared/cancelar-compra/cancelar-compra.component.html
File was created 1 <div class="row justify-content-center mt-2 h-15">
2 <img class="h-100 w-auto my-auto" src="../../../assets/img/logo-spot.svg">
3 </div>
4 <div class="row mx-auto h-70">
5 <div class="col-12 align-self-center">
6 <div class="row mt-5 mx-0 justify-content-around">
7 <div class="col-12 col-sm-8 col-md-6 col-lg-4">
8 <div class="p-3 bg-white text-center shadow-lg rounded">
9 <p class="mt-4 h4">NECESITA</p>
10 <p class="font-weight-bold text-secondary my-4 h2">más tiempo</p>
11 <p class="mb-4 h4">PARA SU PEDIDO?</p>
12 </div>
13 </div>
14 </div>
15 <!-- BUTTONS -->
16 <div class="row mx-0 mt-5 justify-content-center">
17 <div class="col-auto px-0 align-self-start">
18 <div
19 class="row mx-0 py-1 btn-effect bg-primary badge-pill"
20 (click)="volverPreviousPage()">
21 <div class="col-auto align-self-center text-white">continuar compra</div>
22 <div class="col-auto align-self-center p-0">
23 <img
24 draggable="false"
25 ondragstart="return false;"
26 (contextmenu)="false"
27 class="p-1 icon-30"
28 src="assets/img/ir.svg">
29 </div>
30 </div>
31 </div>
32 </div>
33 <div class="row mx-0 mt-4 justify-content-center">
34 <div class="col-auto px-0 align-self-start">
35 <div
36 class="row mx-0 py-1 btn-effect bg-grey badge-pill"
37 (click)="limpiarCarritoYvolver()">
38 <div class="col-auto align-self-center">cancelar compra</div>
39 <div class="col-auto align-self-center p-0">
40 <img
41 draggable="false"
42 ondragstart="return false;"
43 (contextmenu)="false"
44 class="p-1 icon-30"
45 src="assets/img/icono-cancelar-color.svg">
46 </div>
47 </div>
48 </div>
49 </div>
50 </div>
51 </div>
52
src/app/shared/cancelar-compra/cancelar-compra.component.scss
File was created 1 .bg-grey {
2 background-color: rgb(212, 212, 212);
3 }
4
src/app/shared/cancelar-compra/cancelar-compra.component.spec.ts
File was created 1 import { async, ComponentFixture, TestBed } from '@angular/core/testing';
2
3 import { CancelarCompraComponent } from './cancelar-compra.component';
4
5 describe('CancelarCompraComponent', () => {
6 let component: CancelarCompraComponent;
7 let fixture: ComponentFixture<CancelarCompraComponent>;
8
9 beforeEach(async(() => {
10 TestBed.configureTestingModule({
11 declarations: [ CancelarCompraComponent ]
12 })
13 .compileComponents();
14 }));
15
16 beforeEach(() => {
17 fixture = TestBed.createComponent(CancelarCompraComponent);
18 component = fixture.componentInstance;
19 fixture.detectChanges();
20 });
21
22 it('should create', () => {
23 expect(component).toBeTruthy();
24 });
25 });
26
src/app/shared/cancelar-compra/cancelar-compra.component.ts
File was created 1 import { Component, OnInit, OnDestroy } from '@angular/core';
2 import { Location } from '@angular/common';
3 import { ArticuloService } from 'src/app/services/articulo/articulo.service';
4 import { Router } from '@angular/router';
5
6 @Component({
7 selector: 'app-cancelar-compra',
8 templateUrl: './cancelar-compra.component.html',
9 styleUrls: ['./cancelar-compra.component.scss']
10 })
11 export class CancelarCompraComponent implements OnInit, OnDestroy {
12 timer: any;
13
14 constructor(
15 private location: Location,
16 private router: Router,
17 private articuloService: ArticuloService
18 ) { }
19
20 ngOnInit() {
21 this.timer = setTimeout(() => {
22 this.limpiarCarritoYvolver();
23 }, 90000);
24 }
25
26 ngOnDestroy() {
27 clearTimeout(this.timer);
28 }
29
30 volverPreviousPage() {
31 this.location.back();
32 }
33
34 limpiarCarritoYvolver() {
35 this.articuloService.carrito = [];
36 this.router.navigate(['/']);
37 }
38 }
39
src/app/shared/cancelar-compra/cancelar-compra.module.ts
File was created 1 import { NgModule } from '@angular/core';
2 import { CommonModule } from '@angular/common';
3
4 import { CancelarCompraRoutingModule } from './cancelar-compra-routing.module';
5 import { CancelarCompraComponent } from './cancelar-compra.component';
6
7
8 @NgModule({
9 declarations: [CancelarCompraComponent],
10 imports: [
11 CommonModule,
12 CancelarCompraRoutingModule
13 ]
14 })
15 export class CancelarCompraModule { }
16
src/scss/typography.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 $font-size-base: 1rem; 5 $font-size-base: 1rem;
6 $font-size-display-base: null;
6 $type-scales: ( 7 $type-scales: (
7 minor-second: 1.067, 8 minor-second: 1.067,
8 major-second: 1.125, 9 major-second: 1.125,
9 minor-third: 1.2, 10 minor-third: 1.2,
10 major-third: 1.25, 11 major-third: 1.25,
11 perfect-fourth: 1.333, 12 perfect-fourth: 1.333,
12 augmented-fourth: 1.414, 13 augmented-fourth: 1.414,
13 perfect-fifth: 1.5, 14 perfect-fifth: 1.5,
14 golden-ratio: 1.618 15 golden-ratio: 1.618
15 ); 16 );
16 17
17 $heading-type-scale-base: minor-third; 18 $heading-type-scale-base: minor-third;
18 $display-type-scale-base: minor-third; 19 $display-type-scale-base: minor-third;
19 @function check-type-scale-value($scale) { 20 @function check-type-scale-value($scale) {
20 @if map-has-key($type-scales, $scale) { 21 @if map-has-key($type-scales, $scale) {
21 @return map-get($type-scales, $scale); 22 @return map-get($type-scales, $scale);
22 } @else if type-of($scale) == number and unitless($scale) { 23 } @else if type-of($scale) == number and unitless($scale) {
23 @return $scale; 24 @return $scale;
24 } @else { 25 } @else {
25 @error "Sorry, `#{$scale}` is not a unitless number value or a pre-defined key in the $type-scales map."; 26 @error "Sorry, `#{$scale}` is not a unitless number value or a pre-defined key in the $type-scales map.";
26 } 27 }
27 } 28 }
28 @mixin create-heading-type-scale($scale) { 29 @mixin create-heading-type-scale($scale) {
29 $the-heading-type-scale: check-type-scale-value($scale); 30 $the-heading-type-scale: check-type-scale-value($scale);
30 $font-size-h6: $font-size-base; 31 $font-size-h6: $font-size-base;
31 $font-size-h5: $font-size-h6 * $the-heading-type-scale; 32 $font-size-h5: $font-size-h6 * $the-heading-type-scale;
32 $font-size-h4: $font-size-h5 * $the-heading-type-scale; 33 $font-size-h4: $font-size-h5 * $the-heading-type-scale;
33 $font-size-h3: $font-size-h4 * $the-heading-type-scale; 34 $font-size-h3: $font-size-h4 * $the-heading-type-scale;
34 $font-size-h2: $font-size-h3 * $the-heading-type-scale; 35 $font-size-h2: $font-size-h3 * $the-heading-type-scale;
35 $font-size-h1: $font-size-h2 * $the-heading-type-scale; 36 $font-size-h1: $font-size-h2 * $the-heading-type-scale;
36 $font-size-display-base: $font-size-h1 !global; 37 $font-size-display-base: $font-size-h1 !global;
37 38
38 h1, 39 h1,
39 .h1 { 40 .h1 {
40 font-size: $font-size-h1; 41 font-size: $font-size-h1;
41 } 42 }
42 h2, 43 h2,
43 .h2 { 44 .h2 {
44 font-size: $font-size-h2; 45 font-size: $font-size-h2;
45 } 46 }
46 h3, 47 h3,
47 .h3 { 48 .h3 {
48 font-size: $font-size-h3; 49 font-size: $font-size-h3;
49 } 50 }
50 h4, 51 h4,
51 .h4 { 52 .h4 {
52 font-size: $font-size-h4; 53 font-size: $font-size-h4;
53 } 54 }
54 h5, 55 h5,
55 .h5 { 56 .h5 {
56 font-size: $font-size-h5; 57 font-size: $font-size-h5;
57 } 58 }
58 h6, 59 h6,
59 .h6 { 60 .h6 {
60 font-size: $font-size-h6; 61 font-size: $font-size-h6;
61 } 62 }
62 } 63 }
63 64
64 @mixin create-display-type-scale($scale) { 65 @mixin create-display-type-scale($scale) {
65 $the-display-type-scale: check-type-scale-value($scale); 66 $the-display-type-scale: check-type-scale-value($scale);
66 $font-size-display-4: $font-size-display-base + $font-size-base; 67 $font-size-display-4: $font-size-display-base + $font-size-base;
67 $font-size-display-3: $font-size-display-4 * $the-display-type-scale; 68 $font-size-display-3: $font-size-display-4 * $the-display-type-scale;
68 $font-size-display-2: $font-size-display-3 * $the-display-type-scale; 69 $font-size-display-2: $font-size-display-3 * $the-display-type-scale;
69 $font-size-display-1: $font-size-display-2 * $the-display-type-scale; 70 $font-size-display-1: $font-size-display-2 * $the-display-type-scale;
70 71
71 .display-4 { 72 .display-4 {
72 font-size: $font-size-display-4; 73 font-size: $font-size-display-4;
73 } 74 }
74 .display-3 { 75 .display-3 {
75 font-size: $font-size-display-3; 76 font-size: $font-size-display-3;
76 } 77 }
77 .display-2 { 78 .display-2 {
78 font-size: $font-size-display-2; 79 font-size: $font-size-display-2;
79 } 80 }
80 .display-1 { 81 .display-1 {
81 font-size: $font-size-display-1; 82 font-size: $font-size-display-1;
82 } 83 }
83 } 84 }
84 85
85 html { 86 html {
86 font-size: 14px; 87 font-size: 14px;
87 @media (min-width: 768px) { 88 @media (min-width: 768px) {
88 font-size: 16px; 89 font-size: 16px;
89 } 90 }
90 @media (min-width: 992px) { 91 @media (min-width: 992px) {
91 font-size: 18px; 92 font-size: 18px;
92 } 93 }
93 } 94 }
94 95
95 @include create-heading-type-scale($heading-type-scale-base); 96 @include create-heading-type-scale($heading-type-scale-base);
96 @include create-display-type-scale($display-type-scale-base); 97 @include create-display-type-scale($display-type-scale-base);
97 @media (min-width: 768px) { 98 @media (min-width: 768px) {
98 @include create-heading-type-scale(minor-third); 99 @include create-heading-type-scale(minor-third);
99 } 100 }
100 101
101 @import "node_modules/bootstrap/scss/bootstrap"; 102 @import "node_modules/bootstrap/scss/bootstrap";
102 103