Commit 6e8edd46b4a81e65bec16d55995269af254527c6

Authored by Marcelo Puebla
1 parent 2ee1df2a89

Creado modulo de pantalla final

src/app/app-routing.module.ts
... ... @@ -37,6 +37,10 @@ const routes: Routes = [
37 37 path: 'pago-tarjeta',
38 38 loadChildren: () => import('./modules/pago-tarjeta/pago-tarjeta.module').then(m => m.PagoTarjetaModule)
39 39 },
  40 + {
  41 + path: 'mensaje-final',
  42 + loadChildren: () => import('./modules/mensaje-final/mensaje-final.module').then(m => m.MensajeFinalModule)
  43 + },
40 44 ]
41 45 },
42 46 { path: '**', redirectTo: '', pathMatch: 'full' },
src/app/modules/mensaje-final/mensaje-final-routing.module.ts
... ... @@ -0,0 +1,13 @@
  1 +import { NgModule } from '@angular/core';
  2 +import { Routes, RouterModule } from '@angular/router';
  3 +import { MensajeFinalComponent } from './mensaje-final.component';
  4 +
  5 +const routes: Routes = [
  6 + { path: '', component: MensajeFinalComponent }
  7 +];
  8 +
  9 +@NgModule({
  10 + imports: [RouterModule.forChild(routes)],
  11 + exports: [RouterModule]
  12 +})
  13 +export class MensajeFinalRoutingModule { }
src/app/modules/mensaje-final/mensaje-final.component.html
... ... @@ -0,0 +1,53 @@
  1 +<div class="h-92 bg-white fade-in-left">
  2 + <div class="row mx-0 h-15">
  3 + <div class="col-12 px-0 h-80 my-auto">
  4 + <img
  5 + draggable="false"
  6 + ondragstart="return false;"
  7 + (contextmenu)="false"
  8 + class="d-block mx-auto h-100"
  9 + src="assets/img/logo-spot.svg">
  10 + </div>
  11 + </div>
  12 + <div class="h-85">
  13 + <div class="row mt-5 mx-3 h-auto">
  14 + <div class="col-12 px-0 py-2 align-self-center text-center">
  15 + <p class="h6 text-truncate">SEGUÍ ESTOS PASOS PARA</p>
  16 + <p class="h2 text-truncate text-secondary">retirar tu comida</p>
  17 + </div>
  18 + </div>
  19 + <div class="row h-auto mt-5 mx-0 justify-content-center text-center">
  20 + <div class="col-8 p-5 h-auto align-self-end border border-primary rounded">
  21 + <img
  22 + draggable="false"
  23 + ondragstart="return false;"
  24 + (contextmenu)="false"
  25 + class="img-in-top px-4 bg-white"
  26 + src="assets/img/ticket.svg">
  27 + <p class="h6 mb-2"><small>PRESENTÁ EL TICKET EN CAJA Y AGUARDÁ TU PEDIDO</small></p>
  28 + <p class="h2 text-primary">Número de pedido {{023}}</p>
  29 + </div>
  30 + </div>
  31 + <div class="row h-auto mt-6 mx-0 justify-content-center text-center">
  32 + <div class="col-8 p-5 h-auto align-self-end border border-primary rounded">
  33 + <img
  34 + draggable="false"
  35 + ondragstart="return false;"
  36 + (contextmenu)="false"
  37 + class="img-in-top px-4 bg-white"
  38 + src="assets/img/bebidas.svg">
  39 + <p class="h6">
  40 + <small>TUS BEBIDAS Y COMIDAS FRÍAS RETIRALAS EN LAS HELADERAS Y DISPENSERS</small>
  41 + </p>
  42 + </div>
  43 + </div>
  44 + <div class="row h-auto mt-5 mx-0 justify-content-center text-center">
  45 + <div class="col-8 p-5 h-auto align-self-end">
  46 + <p class="h2 text-info">
  47 + ¡Listo!<br>
  48 + Que lo disfrutes
  49 + </p>
  50 + </div>
  51 + </div>
  52 + </div>
  53 +</div>
src/app/modules/mensaje-final/mensaje-final.component.scss
... ... @@ -0,0 +1,3 @@
  1 +.mt-6 {
  2 + margin-top: 4.5rem;
  3 +}
src/app/modules/mensaje-final/mensaje-final.component.spec.ts
... ... @@ -0,0 +1,25 @@
  1 +import { async, ComponentFixture, TestBed } from '@angular/core/testing';
  2 +
  3 +import { MensajeFinalComponent } from './mensaje-final.component';
  4 +
  5 +describe('MensajeFinalComponent', () => {
  6 + let component: MensajeFinalComponent;
  7 + let fixture: ComponentFixture<MensajeFinalComponent>;
  8 +
  9 + beforeEach(async(() => {
  10 + TestBed.configureTestingModule({
  11 + declarations: [ MensajeFinalComponent ]
  12 + })
  13 + .compileComponents();
  14 + }));
  15 +
  16 + beforeEach(() => {
  17 + fixture = TestBed.createComponent(MensajeFinalComponent);
  18 + component = fixture.componentInstance;
  19 + fixture.detectChanges();
  20 + });
  21 +
  22 + it('should create', () => {
  23 + expect(component).toBeTruthy();
  24 + });
  25 +});
src/app/modules/mensaje-final/mensaje-final.component.ts
... ... @@ -0,0 +1,15 @@
  1 +import { Component, OnInit } from '@angular/core';
  2 +
  3 +@Component({
  4 + selector: 'app-mensaje-final',
  5 + templateUrl: './mensaje-final.component.html',
  6 + styleUrls: ['./mensaje-final.component.scss']
  7 +})
  8 +export class MensajeFinalComponent implements OnInit {
  9 +
  10 + constructor() { }
  11 +
  12 + ngOnInit() {
  13 + }
  14 +
  15 +}
src/app/modules/mensaje-final/mensaje-final.module.ts
... ... @@ -0,0 +1,15 @@
  1 +import { NgModule } from '@angular/core';
  2 +import { CommonModule } from '@angular/common';
  3 +
  4 +import { MensajeFinalRoutingModule } from './mensaje-final-routing.module';
  5 +import { MensajeFinalComponent } from './mensaje-final.component';
  6 +
  7 +
  8 +@NgModule({
  9 + declarations: [MensajeFinalComponent],
  10 + imports: [
  11 + CommonModule,
  12 + MensajeFinalRoutingModule
  13 + ]
  14 +})
  15 +export class MensajeFinalModule { }
src/assets/img/bebidas.svg
... ... @@ -0,0 +1,31 @@
  1 +<?xml version="1.0" encoding="UTF-8"?>
  2 +<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
  3 +<!-- Creator: CorelDRAW X7 -->
  4 +<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" width="52.8276mm" height="52.8282mm" version="1.1" style="shape-rendering:geometricPrecision; text-rendering:geometricPrecision; image-rendering:optimizeQuality; fill-rule:evenodd; clip-rule:evenodd"
  5 +viewBox="0 0 1388 1388"
  6 + xmlns:xlink="http://www.w3.org/1999/xlink">
  7 + <defs>
  8 + <style type="text/css">
  9 + <![CDATA[
  10 + .fil0 {fill:#AA006B}
  11 + .fil2 {fill:white}
  12 + .fil1 {fill:white;fill-opacity:0.521569}
  13 + ]]>
  14 + </style>
  15 + </defs>
  16 + <g id="Capa_x0020_1">
  17 + <metadata id="CorelCorpID_0Corel-Layer"/>
  18 + <g id="_2426853497008">
  19 + <path class="fil0" d="M1280 1388l-1172 0c-59,0 -108,-48 -108,-108l0 -1172c0,-59 49,-108 108,-108l1172 0c60,0 108,49 108,108l0 1172c0,60 -48,108 -108,108z"/>
  20 + <path class="fil1" d="M31 32c20,-20 47,-32 77,-32l1172 0c60,0 108,49 108,108l0 1172c0,30 -12,57 -32,76m-1325 -1324l0 0 0 0z"/>
  21 + </g>
  22 + <g id="_2426853498032">
  23 + <g>
  24 + <path class="fil2" d="M416 344l92 0c0,0 0,0 0,0 5,0 9,-1 12,-5 3,-3 5,-7 5,-12l0 -32c0,-30 -28,-55 -63,-55 -35,0 -63,25 -63,55l0 32c0,9 7,17 17,17z"/>
  25 + <path class="fil2" d="M1021 428c0,0 0,0 0,0 -1,0 -1,0 -1,0 -1,-1 -31,-13 -34,-57 -1,-9 -8,-16 -17,-16l-86 0c-9,0 -16,7 -17,16 -2,44 -32,56 -33,57 -1,0 -1,0 -1,0 0,0 -1,0 -1,0 -52,25 -84,71 -84,121l0 582c0,9 7,17 17,17l325 0c9,0 17,-8 17,-17l0 -582c0,-49 -33,-96 -85,-121zm-175 31c7,-3 43,-20 52,-70l56 0c10,51 47,68 53,70 40,19 65,54 65,90l0 283c-35,8 -101,16 -139,-2 -47,-22 -116,-7 -152,4l0 -285c0,-36 25,-71 65,-90zm-65 655l0 -245c18,-5 46,-12 74,-15l25 -1c15,1 28,3 39,8 22,11 49,14 76,14 29,0 58,-4 77,-8l0 247 -291 0z"/>
  26 + <path class="fil2" d="M880 344l92 0c0,0 0,0 0,0 5,0 9,-1 12,-5 4,-3 5,-7 5,-12l0 -32c0,-30 -28,-55 -63,-55 -35,0 -63,25 -63,55l0 32c0,9 7,17 17,17z"/>
  27 + <path class="fil2" d="M641 828l0 -279c0,-49 -32,-96 -84,-121 0,0 0,0 -1,0 0,0 0,0 0,0 -1,0 -32,-12 -34,-57 -1,-8 -8,-15 -17,-15l-86 0c-9,0 -16,7 -17,15 -2,44 -33,56 -34,57 0,0 0,0 0,0 -1,0 -1,0 -1,0 -52,25 -85,71 -85,121l0 279c0,0 0,0 0,0l0 303c0,9 8,17 17,17l325 0c10,0 17,-8 17,-17l0 -303 0 0zm-259 -369c6,-3 43,-20 52,-69l56 0c9,49 46,66 52,69 40,19 65,54 65,90l0 267c-11,4 -32,10 -56,12l-31 0c-17,-2 -34,-6 -50,-15 -56,-31 -120,-19 -153,-9l0 -255c0,-36 24,-71 65,-90zm-65 655l0 -274c11,-4 32,-10 57,-12l30 0c17,2 34,6 50,15 27,15 55,20 82,20 28,0 54,-6 71,-11l0 262 -290 0 0 0z"/>
  28 + </g>
  29 + </g>
  30 + </g>
  31 +</svg>
src/assets/img/ticket.svg
... ... @@ -0,0 +1,28 @@
  1 +<?xml version="1.0" encoding="UTF-8"?>
  2 +<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
  3 +<!-- Creator: CorelDRAW X7 -->
  4 +<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" width="52.8276mm" height="52.8282mm" version="1.1" style="shape-rendering:geometricPrecision; text-rendering:geometricPrecision; image-rendering:optimizeQuality; fill-rule:evenodd; clip-rule:evenodd"
  5 +viewBox="0 0 883 883"
  6 + xmlns:xlink="http://www.w3.org/1999/xlink">
  7 + <defs>
  8 + <style type="text/css">
  9 + <![CDATA[
  10 + .fil0 {fill:#AA006B}
  11 + .fil2 {fill:white}
  12 + .fil1 {fill:white;fill-opacity:0.521569}
  13 + ]]>
  14 + </style>
  15 + </defs>
  16 + <g id="Capa_x0020_1">
  17 + <metadata id="CorelCorpID_0Corel-Layer"/>
  18 + <g id="_2426876347456">
  19 + <path class="fil0" d="M814 883l-745 0c-38,0 -69,-30 -69,-69l0 -745c0,-38 31,-69 69,-69l745 0c38,0 69,31 69,69l0 745c0,39 -30,69 -69,69z"/>
  20 + <path class="fil1" d="M20 21c12,-13 30,-21 49,-21l745 0c38,0 69,31 69,69l0 745c0,19 -7,37 -20,49m-843 -842l0 0 0 0z"/>
  21 + </g>
  22 + <g id="_2426876350176">
  23 + <g>
  24 + <path class="fil2" d="M593 176l-303 0c-26,0 -47,21 -47,48l0 38c0,5 4,9 9,9l66 0 0 427c0,3 3,7 6,8 4,2 8,1 11,-2l12 -12 12 12c4,4 10,4 14,0 0,0 0,0 0,0l12 -12 12 12c4,4 10,4 13,0 0,0 0,0 1,0l12 -12 12 12c4,4 10,4 13,0 0,0 0,0 0,0l13 -12 12 12c4,4 10,4 13,0 0,0 0,0 0,0l13 -12 12 12c3,4 10,4 13,0 0,0 0,0 0,0l13 -12 12 12c3,4 9,4 13,0 0,0 0,0 0,0l12 -12 13 12c3,4 9,4 13,0 0,0 0,0 0,0l12 -12 13 12c1,2 4,3 6,3 2,0 3,0 4,-1 3,-1 6,-5 6,-8l0 -474c0,-27 -21,-48 -48,-48zm-331 48c0,-16 12,-29 28,-29 16,0 28,13 28,29l0 28 -56 0 0 -28 0 0zm360 451l-3 -3c-4,-4 -10,-4 -13,0 0,0 0,0 0,0l-13 12 -12 -12c-4,-4 -10,-4 -13,0 0,0 0,0 0,0l-13 12 -12 -12c-3,-4 -9,-4 -13,0 0,0 0,0 0,0l-12 12 -13 -12c-3,-4 -9,-4 -13,0 0,0 0,0 0,0l-12 12 -13 -12c-3,-4 -9,-4 -13,0 0,0 0,0 0,0l-12 12 -13 -12c-3,-4 -9,-4 -13,0 0,0 0,0 0,0l-12 12 -12 -12c-4,-4 -10,-4 -14,0 0,0 0,0 0,0l-12 12 -12 -12c-4,-4 -10,-4 -14,0 0,0 0,0 0,0l-3 3 0 -451c0,-11 -3,-21 -9,-29l265 0c16,0 29,13 29,29l0 451 0 0zm-266 -432c0,-6 5,-10 10,-10l152 0c5,0 9,4 9,10 0,5 -4,9 -9,9l-152 0c-5,0 -10,-4 -10,-9zm247 0c0,5 -4,9 -10,9l-38 0c-5,0 -9,-4 -9,-9 0,-6 4,-10 9,-10l38 0c6,0 10,4 10,10zm-247 75c0,-5 5,-9 10,-9l152 0c5,0 9,4 9,9 0,6 -4,10 -9,10l-152 0c-5,0 -10,-4 -10,-10zm247 0c0,6 -4,10 -10,10l-38 0c-5,0 -9,-4 -9,-10 0,-5 4,-9 9,-9l38 0c6,0 10,4 10,9zm-247 76c0,-5 5,-9 10,-9l152 0c5,0 9,4 9,9 0,6 -4,10 -9,10l-152 0c-5,0 -10,-4 -10,-10zm247 0c0,6 -4,10 -10,10l-38 0c-5,0 -9,-4 -9,-10 0,-5 4,-9 9,-9l38 0c6,0 10,4 10,9zm-85 86l-152 0c-5,0 -10,-5 -10,-10 0,-5 5,-9 10,-9l152 0c5,0 9,4 9,9 0,5 -4,10 -9,10zm85 -10c0,5 -4,10 -10,10l-38 0c-5,0 -9,-5 -9,-10 0,-5 4,-9 9,-9l38 0c6,0 10,4 10,9zm-228 85c0,6 5,10 10,10 16,0 28,13 28,29 0,11 -8,22 -19,26l0 2c0,5 -4,9 -9,9 -5,0 -10,-4 -10,-9l0 -2c-11,-4 -19,-15 -19,-27 0,-5 5,-9 10,-9 5,0 9,4 9,9 0,6 5,10 10,10 5,0 9,-4 9,-10 0,-5 -4,-9 -9,-9 -16,0 -29,-13 -28,-29 0,-12 7,-22 18,-26l0 -2c0,-5 5,-9 10,-9 5,0 9,4 9,9l0 2c12,4 19,14 19,26 0,6 -4,10 -9,10 -5,0 -10,-4 -10,-10 0,-5 -4,-9 -9,-9 -5,0 -10,4 -10,9zm228 67c0,5 -4,9 -10,9l-151 0c-6,0 -10,-4 -10,-9 0,-5 4,-10 10,-10l151 0c6,0 10,5 10,10z"/>
  25 + </g>
  26 + </g>
  27 + </g>
  28 +</svg>