Commit 1b96d20ddfe4a5a34a2de02e09bc3b9e66a911c8

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

Creado servicio y movidos componentes.

Showing 52 changed files with 542 additions and 488 deletions   Show diff stats
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 { HomeComponent } from './home/home.component'; 3 import { HomeComponent } from './components/home/home.component';
4 import { InicioComponent } from './inicio/inicio.component'; 4 import { InicioComponent } from './components/inicio/inicio.component';
5 import { BusquedaProductosComponent } from './busqueda-productos/busqueda-productos.component'; 5 import { BusquedaProductosComponent } from './components/busqueda-productos/busqueda-productos.component';
6 6
7 const routes: Routes = [ 7 const routes: Routes = [
8 { path: 'home', component: HomeComponent }, 8 { path: 'home', component: HomeComponent },
9 { path: 'inicio', component: InicioComponent }, 9 { path: 'inicio', component: InicioComponent },
10 { path: 'busqueda-productos', component: BusquedaProductosComponent }, 10 { path: 'busqueda-productos', component: BusquedaProductosComponent },
11 { path: '**', redirectTo: '/home', pathMatch: 'full' }, 11 { path: '**', redirectTo: '/home', pathMatch: 'full' },
12 ]; 12 ];
13 13
14 @NgModule({ 14 @NgModule({
15 imports: [RouterModule.forRoot(routes)], 15 imports: [RouterModule.forRoot(routes)],
16 exports: [RouterModule] 16 exports: [RouterModule]
17 }) 17 })
18 export class AppRoutingModule { } 18 export class AppRoutingModule { }
19 19
src/app/app.module.ts
1 //#region MODULES
1 import { BrowserModule } from '@angular/platform-browser'; 2 import { BrowserModule } from '@angular/platform-browser';
2 import { NgModule } from '@angular/core'; 3 import { NgModule } from '@angular/core';
3
4 import { AppRoutingModule } from './app-routing.module'; 4 import { AppRoutingModule } from './app-routing.module';
5 import { HttpClientModule } from '@angular/common/http';
6 //#endregion
7
8 //#region COMPONENTS
5 import { AppComponent } from './app.component'; 9 import { AppComponent } from './app.component';
6 import { HeaderComponent } from './header/header.component'; 10 import { HeaderComponent } from './components/header/header.component';
7 import { SidebarComponent } from './sidebar/sidebar.component'; 11 import { SidebarComponent } from './components/sidebar/sidebar.component';
8 import { CarouselComponent } from './carousel/carousel.component'; 12 import { CarouselComponent } from './components/carousel/carousel.component';
9 import { HomeComponent } from './home/home.component'; 13 import { HomeComponent } from './components/home/home.component';
10 import { InicioComponent } from './inicio/inicio.component'; 14 import { InicioComponent } from './components/inicio/inicio.component';
11 import { BusquedaProductosComponent } from './busqueda-productos/busqueda-productos.component'; 15 import { BusquedaProductosComponent } from './components/busqueda-productos/busqueda-productos.component';
16 //#endregion
12 17
13 @NgModule({ 18 @NgModule({
14 declarations: [ 19 declarations: [
15 AppComponent, 20 AppComponent,
16 HeaderComponent, 21 HeaderComponent,
17 SidebarComponent, 22 SidebarComponent,
18 CarouselComponent, 23 CarouselComponent,
19 HomeComponent, 24 HomeComponent,
20 InicioComponent, 25 InicioComponent,
21 BusquedaProductosComponent 26 BusquedaProductosComponent
22 ], 27 ],
23 imports: [ 28 imports: [
24 BrowserModule, 29 BrowserModule,
25 AppRoutingModule 30 AppRoutingModule,
31 HttpClientModule
26 ], 32 ],
27 providers: [], 33 providers: [],
28 bootstrap: [AppComponent] 34 bootstrap: [AppComponent]
29 }) 35 })
30 export class AppModule { } 36 export class AppModule { }
src/app/busqueda-productos/busqueda-productos.component.html
1 <p>busqueda-productos works!</p> File was deleted
2 1 <p>busqueda-productos works!</p>
src/app/busqueda-productos/busqueda-productos.component.scss
src/app/busqueda-productos/busqueda-productos.component.spec.ts
1 import { async, ComponentFixture, TestBed } from '@angular/core/testing'; File was deleted
2
3 import { BusquedaProductosComponent } from './busqueda-productos.component';
4
5 describe('BusquedaProductosComponent', () => {
6 let component: BusquedaProductosComponent;
7 let fixture: ComponentFixture<BusquedaProductosComponent>;
8
9 beforeEach(async(() => {
10 TestBed.configureTestingModule({
11 declarations: [ BusquedaProductosComponent ]
12 })
13 .compileComponents();
14 }));
15
16 beforeEach(() => {
17 fixture = TestBed.createComponent(BusquedaProductosComponent);
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/busqueda-productos/busqueda-productos.component.ts
1 import { Component, OnInit } from '@angular/core'; File was deleted
2
3 @Component({
4 selector: 'app-busqueda-productos',
5 templateUrl: './busqueda-productos.component.html',
6 styleUrls: ['./busqueda-productos.component.scss']
7 })
8 export class BusquedaProductosComponent implements OnInit {
9
10 constructor() { }
11
12 ngOnInit() {
13 }
14
15 }
16 1 import { Component, OnInit } from '@angular/core';
src/app/carousel/carousel.component.html
1 <div id="carouselExampleSlidesOnly" class="carousel slide" data-ride="carousel"> File was deleted
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>
src/app/carousel/carousel.component.scss
src/app/carousel/carousel.component.spec.ts
1 import { async, ComponentFixture, TestBed } from '@angular/core/testing'; File was deleted
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 });
26 1 import { async, ComponentFixture, TestBed } from '@angular/core/testing';
src/app/carousel/carousel.component.ts
1 import { Component, OnInit } from '@angular/core'; File was deleted
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 }
16 1 import { Component, OnInit } from '@angular/core';
src/app/components/busqueda-productos/busqueda-productos.component.html
File was created 1 <div class="row m-0 fade-in">
2 <div class="col-10 p-0">
3 <!-- TOP HEADER -->
4 <app-header></app-header>
5
6 <!-- NOMBRE DE SECCION -->
7 <div class="row m-0">
8 <div class="col-12 p-0">
9 <p class="h5 py-1 bg-light text-muted font-weight-light text-center"><small>Búsqueda</small></p>
10 </div>
11 </div>
12
13 <div class="row m-4 d-flex align-items-center">
14
15 </div>
16
17 </div>
18
19 <!-- SIDEBAR -->
20 <app-sidebar class="col-3 col-md-2 vh-100 bg-dark text-white"></app-sidebar>
21 </div>
src/app/components/busqueda-productos/busqueda-productos.component.scss
src/app/components/busqueda-productos/busqueda-productos.component.spec.ts
File was created 1 import { async, ComponentFixture, TestBed } from '@angular/core/testing';
2
3 import { BusquedaProductosComponent } from './busqueda-productos.component';
4
5 describe('BusquedaProductosComponent', () => {
6 let component: BusquedaProductosComponent;
7 let fixture: ComponentFixture<BusquedaProductosComponent>;
8
9 beforeEach(async(() => {
10 TestBed.configureTestingModule({
11 declarations: [ BusquedaProductosComponent ]
12 })
13 .compileComponents();
14 }));
15
16 beforeEach(() => {
17 fixture = TestBed.createComponent(BusquedaProductosComponent);
18 component = fixture.componentInstance;
19 fixture.detectChanges();
20 });
21
22 it('should create', () => {
23 expect(component).toBeTruthy();
24 });
25 });
26
src/app/components/busqueda-productos/busqueda-productos.component.ts
File was created 1 import { Component, OnInit } from '@angular/core';
2
3 @Component({
4 selector: 'app-busqueda-productos',
5 templateUrl: './busqueda-productos.component.html',
6 styleUrls: ['./busqueda-productos.component.scss']
7 })
8 export class BusquedaProductosComponent implements OnInit {
9
10 constructor() { }
11
12 ngOnInit() {
13 }
14
15 }
16
src/app/components/carousel/carousel.component.html
File was created 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>
src/app/components/carousel/carousel.component.scss
src/app/components/carousel/carousel.component.spec.ts
File was created 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 });
26
src/app/components/carousel/carousel.component.ts
File was created 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 }
16
src/app/components/header/header.component.html
File was created 1 <div class="bg-danger py-1 py-sm-2 py-lg-5">
2 <p class="text-center">HEADER</p>
3 </div>
src/app/components/header/header.component.scss
src/app/components/header/header.component.spec.ts
File was created 1 import { async, ComponentFixture, TestBed } from '@angular/core/testing';
2
3 import { HeaderComponent } from './header.component';
4
5 describe('HeaderComponent', () => {
6 let component: HeaderComponent;
7 let fixture: ComponentFixture<HeaderComponent>;
8
9 beforeEach(async(() => {
10 TestBed.configureTestingModule({
11 declarations: [HeaderComponent]
12 })
13 .compileComponents();
14 }));
15
16 beforeEach(() => {
17 fixture = TestBed.createComponent(HeaderComponent);
18 component = fixture.componentInstance;
19 fixture.detectChanges();
20 });
21
22 it('should create', () => {
23 expect(component).toBeTruthy();
24 });
25 });
26
src/app/components/header/header.component.ts
File was created 1 import { Component, OnInit } from '@angular/core';
2
3 @Component({
4 selector: 'app-header',
5 templateUrl: './header.component.html',
6 styleUrls: ['./header.component.scss']
7 })
8 export class HeaderComponent implements OnInit {
9
10 constructor() { }
11
12 ngOnInit() {
13 }
14
15 }
16
src/app/components/home/home.component.html
File was created 1 <div class="container-fluid">
2 <div class="row">
3 <div class="col p-0">
4 <div class="vh-100 d-flex align-items-start flex-column disable-user-select">
5
6 <!-- HEADER -->
7 <div class="bg-dark py-1 py-sm-2 py-lg-5 w-100">
8 <p class="text-white text-center">HEADER</p>
9 </div>
10
11 <div class="h-100 w-100 position-relative">
12 <div class="background-image blur"></div>
13 <div class="row position-absolute w-100 h-100">
14 <div class="col-5 my-auto">
15 <!-- CAROUSEL -->
16 <div id="carouselExampleSlidesOnly" class="carousel slide" data-ride="carousel">
17 <div class="carousel-inner">
18 <div class="carousel-item active">
19 <img class="m-auto img-fluid d-block w-75"
20 src="https://encrypted-tbn0.gstatic.com/images?q=tbn%3AANd9GcQWhHnLeoxWeJeiBKvVg-9zDzppOVX_AY5tXpRuS7If0mzb_01b"
21 alt="">
22 </div>
23 <div class="carousel-item">
24 <img class="m-auto img-fluid d-block w-75"
25 src="https://encrypted-tbn0.gstatic.com/images?q=tbn%3AANd9GcQWhHnLeoxWeJeiBKvVg-9zDzppOVX_AY5tXpRuS7If0mzb_01b"
26 alt="">
27 </div>
28 </div>
29 </div>
30 </div>
31 <div class="col-7 my-auto">
32 <div class="text-center text-white">
33 <h1 class="display-2 font-weight-bold">¡BIENVENIDO!</h1>
34 <h1 class="display-3 font-weight-bold">Toque la pantalla<br>para comenzar.</h1>
35 </div>
36 </div>
37 </div>
38 </div>
39
40 <!-- FOOTER -->
41 <div class="bg-dark py-1 py-sm-2 py-lg-5 w-100">
42 <p class="text-white text-center">FOOTER</p>
43 </div>
44 </div>
45 </div>
46 </div>
47 </div>
src/app/components/home/home.component.scss
File was created 1 .background-image {
2 background-image: url(http://www.nortecorrientes.com/content/bucket/7/304027w980.jpg);
3 background-repeat: no-repeat;
4 background-size: cover;
5 position: absolute;
6 width: 100%;
7 height: 100%;
8 }
9
src/app/components/home/home.component.spec.ts
File was created 1 import { async, ComponentFixture, TestBed } from '@angular/core/testing';
2
3 import { HomeComponent } from './home.component';
4
5 describe('HomeComponent', () => {
6 let component: HomeComponent;
7 let fixture: ComponentFixture<HomeComponent>;
8
9 beforeEach(async(() => {
10 TestBed.configureTestingModule({
11 declarations: [HomeComponent]
12 })
13 .compileComponents();
14 }));
15
16 beforeEach(() => {
17 fixture = TestBed.createComponent(HomeComponent);
18 component = fixture.componentInstance;
19 fixture.detectChanges();
20 });
21
22 it('should create', () => {
23 expect(component).toBeTruthy();
24 });
25 });
26
src/app/components/home/home.component.ts
File was created 1 import { Component, OnInit, HostListener } from '@angular/core';
2 import { Router } from '@angular/router';
3
4 @Component({
5 selector: 'app-home',
6 templateUrl: './home.component.html',
7 styleUrls: ['./home.component.scss']
8 })
9 export class HomeComponent implements OnInit {
10
11 constructor(private router: Router) { }
12
13 ngOnInit() {
14 }
15
16 @HostListener('document:click', ['$event'])
17 documentClick(event: MouseEvent) {
18 this.router.navigate(['/inicio']);
19 }
20
21 }
22
src/app/components/inicio/inicio.component.html
File was created 1 <div class="row m-0 fade-in">
2 <div class="col-10 p-0">
3 <!-- TOP HEADER -->
4 <app-header></app-header>
5
6 <!-- NOMBRE DE SECCION -->
7 <div class="row m-0">
8 <div class="col-12 p-0">
9 <p class="h5 py-1 bg-light text-muted font-weight-light text-center"><small>Inicio</small></p>
10 </div>
11 </div>
12
13 <div class="row m-4 d-flex align-items-center">
14 <div class="col-md-5 d-flex align-items-end flex-column">
15
16 <!-- PROMOCIONES -->
17 <div class="card card-effect bg-white border-0 shadow rounded w-100 mb-auto">
18 <div class="card-body p-4">
19 <p class="h3 card-title">Promociones</p>
20 <p class="h5 card-text text-muted font-weight-light">Conozca las ofertas del momento.</p>
21 </div>
22 <div id="carouselIndicators" class="carousel slide mb-4" data-ride="carousel">
23 <ol class="carousel-indicators m-0">
24 <li data-target="#carouselIndicators" data-slide-to="0" class="bg-dark active"></li>
25 <li data-target="#carouselIndicators" data-slide-to="1" class="bg-dark"></li>
26 <li data-target="#carouselIndicators" data-slide-to="2" class="bg-dark"></li>
27 </ol>
28 <div class="carousel-inner">
29 <div class="carousel-item active">
30 <img src="../../assets/img/descarga.jpg" class="d-block w-50 m-auto rounded" alt="...">
31 </div>
32 <div class="carousel-item">
33 <img src="../../assets/img/descarga.jpg" class="d-block w-50 m-auto rounded" alt="...">
34 </div>
35 <div class="carousel-item">
36 <img src="../../assets/img/descarga.jpg" class="d-block w-50 m-auto rounded" alt="...">
37 </div>
38 </div>
39 </div>
40 </div>
41
42 <!-- ORDENAR -->
43 <div class="card card-effect bg-white border-0 shadow rounded w-100 mt-4">
44 <div class="card-body p-4">
45 <p class="h3 card-title">Ordenar</p>
46 <p class="h5 card-text text-muted font-weight-light">Arme su pedido y solo pase a retirar.</p>
47 </div>
48 <img class="card-img-bottom d-block w-50 mx-auto mb-4 rounded" src="../../assets/img/descarga.jpg">
49 </div>
50
51 </div>
52
53 <div class="col-md-7 d-flex align-items-end flex-column">
54
55 <!-- CARGAR PRODUCTOS -->
56 <div class="card card-effect bg-white border-0 shadow rounded w-100 mb-auto">
57 <div class="card-body p-4">
58 <p class="h3 card-title">Cargar Productos</p>
59 <p class="h5 card-text text-muted font-weight-light">
60 Coloque el código de<br>
61 barras o QR frente al scanner.
62 </p>
63 </div>
64 <div class="card bg-white border-0 w-75 mx-auto mb-4">
65 <img class="card-img-top d-block w-50 mx-auto rounded" src="../../assets/img/descarga.jpg">
66 <div class="card-body p-2">
67 <p class="m-0 card-text text-muted">Galletas Oreo x117 grs Chocolate.</p>
68 <p class="m-0 card-text text-muted">COD. 12121222</p>
69 </div>
70 </div>
71 </div>
72
73 <!-- BUSCAR PRODUCTOS -->
74 <div
75 (click)="goPage('busqueda-productos')"
76 class="card card-effect bg-white border-0 shadow rounded w-100 mt-4">
77 <div class="card-body p-4">
78 <p class="h3 card-title">Buscar Productos</p>
79 <p class="h5 card-text text-muted font-weight-light">
80 Busque aquí los productos<br>
81 que no tienen código
82 </p>
83 </div>
84 </div>
85
86 </div>
87
88 </div>
89
90 </div>
91
92 <!-- SIDEBAR -->
93 <app-sidebar class="col-3 col-md-2 vh-100 bg-dark text-white"></app-sidebar>
94 </div>
src/app/components/inicio/inicio.component.scss
src/app/components/inicio/inicio.component.spec.ts
File was created 1 import { async, ComponentFixture, TestBed } from '@angular/core/testing';
2
3 import { InicioComponent } from './inicio.component';
4
5 describe('InicioComponent', () => {
6 let component: InicioComponent;
7 let fixture: ComponentFixture<InicioComponent>;
8
9 beforeEach(async(() => {
10 TestBed.configureTestingModule({
11 declarations: [ InicioComponent ]
12 })
13 .compileComponents();
14 }));
15
16 beforeEach(() => {
17 fixture = TestBed.createComponent(InicioComponent);
18 component = fixture.componentInstance;
19 fixture.detectChanges();
20 });
21
22 it('should create', () => {
23 expect(component).toBeTruthy();
24 });
25 });
26
src/app/components/inicio/inicio.component.ts
File was created 1 import { Component, OnInit } from '@angular/core';
2 import { Router } from '@angular/router';
3
4 @Component({
5 selector: 'app-inicio',
6 templateUrl: './inicio.component.html',
7 styleUrls: ['./inicio.component.scss']
8 })
9 export class InicioComponent implements OnInit {
10
11 constructor(private router: Router) { }
12
13 ngOnInit() {
14 }
15
16 private goPage(pageUrl) {
17 this.router.navigate([pageUrl]);
18 }
19
20 }
21
src/app/components/sidebar/sidebar.component.html
File was created 1 <div class="d-flex align-items-center flex-column h-100 bg-dark pt-2 text-center">
2
3 <h4 class="border-bottom border-white"> Mi compra </h4>
4 <div class="overflow-auto mb-2">
5 <div class="card my-2 bg-primary border-0">
6 <img src="../../assets/img/descarga.jpg" class="card-img-top" alt="...">
7 <div class="card-body row m-0 p-0 px-1 py-1 shadow rounded">
8 <div class="col-8 p-0 text-left my-auto">
9 <p class="m-0 card-description">Galleta oreo x 199 gs Chocolate</p>
10 <p class="m-0 card-description"><small>COD: 1234567</small></p>
11 </div>
12 <div class="col-4 p-1 text-center my-auto">
13 {{90 | currency}}
14 </div>
15 </div>
16 <div class="row m-0 p-0">
17 <div class="col p-1 pb-1 mt-2">
18 <button type="button" class="btn btn-light btn-sm float-left my-auto">X</button>
19 <button type="button" class="btn btn-light btn-sm my-auto">X</button>
20 <div class="btn-group-sm btn-group float-right my-auto" role="group" aria-label="Basic example">
21 <button type="button" class="btn btn-light btn-sm mb-2">+</button>
22 <label for="" class="border border.white px-1">12</label>
23 <button type="button" class="btn btn-light btn-sm mb-2">-</button>
24 </div>
25 </div>
26 </div>
27 </div>
28 </div>
29
30 <div class="card mt-auto blue-gradient border-0">
31 <div class="card-body row">
32 <div class="col">
33 <h4 class="border-bottom border-secondary text-secondary">(1) item</h4>
34 <h3 class="text-secondary">Total</h3>
35 <h3 class="text-dark"><strong>{{5000 | currency}}</strong></h3>
36 </div>
37 <div class="col 12 p-0">
38 <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 btn-sm">Cancelar</button>
40 </div>
41 </div>
42 </div>
src/app/components/sidebar/sidebar.component.scss
File was created 1 .card-description{
2 font-size: 12px;
3 }
src/app/components/sidebar/sidebar.component.spec.ts
File was created 1 import { async, ComponentFixture, TestBed } from '@angular/core/testing';
2
3 import { SidebarComponent } from './sidebar.component';
4
5 describe('SidebarComponent', () => {
6 let component: SidebarComponent;
7 let fixture: ComponentFixture<SidebarComponent>;
8
9 beforeEach(async(() => {
10 TestBed.configureTestingModule({
11 declarations: [SidebarComponent]
12 })
13 .compileComponents();
14 }));
15
16 beforeEach(() => {
17 fixture = TestBed.createComponent(SidebarComponent);
18 component = fixture.componentInstance;
19 fixture.detectChanges();
20 });
21
22 it('should create', () => {
23 expect(component).toBeTruthy();
24 });
25 });
26
src/app/components/sidebar/sidebar.component.ts
File was created 1 import { Component, OnInit } from '@angular/core';
2
3 @Component({
4 selector: 'app-sidebar',
5 templateUrl: './sidebar.component.html',
6 styleUrls: ['./sidebar.component.scss']
7 })
8 export class SidebarComponent implements OnInit {
9
10 constructor() { }
11
12 ngOnInit() {
13 }
14
15 }
16
src/app/header/header.component.html
1 <div class="bg-danger py-1 py-sm-2 py-lg-5"> File was deleted
2 <p class="text-center">HEADER</p>
3 </div>
src/app/header/header.component.scss
src/app/header/header.component.spec.ts
1 import { async, ComponentFixture, TestBed } from '@angular/core/testing'; File was deleted
2
3 import { HeaderComponent } from './header.component';
4
5 describe('HeaderComponent', () => {
6 let component: HeaderComponent;
7 let fixture: ComponentFixture<HeaderComponent>;
8
9 beforeEach(async(() => {
10 TestBed.configureTestingModule({
11 declarations: [HeaderComponent]
12 })
13 .compileComponents();
14 }));
15
16 beforeEach(() => {
17 fixture = TestBed.createComponent(HeaderComponent);
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/header/header.component.ts
1 import { Component, OnInit } from '@angular/core'; File was deleted
2
3 @Component({
4 selector: 'app-header',
5 templateUrl: './header.component.html',
6 styleUrls: ['./header.component.scss']
7 })
8 export class HeaderComponent implements OnInit {
9
10 constructor() { }
11
12 ngOnInit() {
13 }
14
15 }
16 1 import { Component, OnInit } from '@angular/core';
src/app/home/home.component.html
1 <div class="container-fluid"> File was deleted
2 <div class="row">
3 <div class="col p-0">
4 <div class="vh-100 d-flex align-items-start flex-column disable-user-select">
5
6 <!-- HEADER -->
7 <div class="bg-dark py-1 py-sm-2 py-lg-5 w-100">
8 <p class="text-white text-center">HEADER</p>
9 </div>
10
11 <div class="h-100 w-100 position-relative">
12 <div class="background-image blur"></div>
13 <div class="row position-absolute w-100 h-100">
14 <div class="col-5 my-auto">
15 <!-- CAROUSEL -->
16 <div id="carouselExampleSlidesOnly" class="carousel slide" data-ride="carousel">
17 <div class="carousel-inner">
18 <div class="carousel-item active">
19 <img class="m-auto img-fluid d-block w-75"
20 src="https://encrypted-tbn0.gstatic.com/images?q=tbn%3AANd9GcQWhHnLeoxWeJeiBKvVg-9zDzppOVX_AY5tXpRuS7If0mzb_01b"
21 alt="">
22 </div>
23 <div class="carousel-item">
24 <img class="m-auto img-fluid d-block w-75"
25 src="https://encrypted-tbn0.gstatic.com/images?q=tbn%3AANd9GcQWhHnLeoxWeJeiBKvVg-9zDzppOVX_AY5tXpRuS7If0mzb_01b"
26 alt="">
27 </div>
28 </div>
29 </div>
30 </div>
31 <div class="col-7 my-auto">
32 <div class="text-center text-white">
33 <h1 class="display-2 font-weight-bold">¡BIENVENIDO!</h1>
34 <h1 class="display-3 font-weight-bold">Toque la pantalla<br>para comenzar.</h1>
35 </div>
36 </div>
37 </div>
38 </div>
39
40 <!-- FOOTER -->
41 <div class="bg-dark py-1 py-sm-2 py-lg-5 w-100">
42 <p class="text-white text-center">FOOTER</p>
43 </div>
44 </div>
45 </div>
46 </div>
47 </div>
src/app/home/home.component.scss
1 .background-image { File was deleted
2 background-image: url(http://www.nortecorrientes.com/content/bucket/7/304027w980.jpg);
3 background-repeat: no-repeat;
4 background-size: cover;
5 position: absolute;
6 width: 100%;
7 height: 100%;
8 }
9 1 .background-image {
src/app/home/home.component.spec.ts
1 import { async, ComponentFixture, TestBed } from '@angular/core/testing'; File was deleted
2
3 import { HomeComponent } from './home.component';
4
5 describe('HomeComponent', () => {
6 let component: HomeComponent;
7 let fixture: ComponentFixture<HomeComponent>;
8
9 beforeEach(async(() => {
10 TestBed.configureTestingModule({
11 declarations: [HomeComponent]
12 })
13 .compileComponents();
14 }));
15
16 beforeEach(() => {
17 fixture = TestBed.createComponent(HomeComponent);
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/home/home.component.ts
1 import { Component, OnInit, HostListener } from '@angular/core'; File was deleted
2 import { Router } from '@angular/router';
3
4 @Component({
5 selector: 'app-home',
6 templateUrl: './home.component.html',
7 styleUrls: ['./home.component.scss']
8 })
9 export class HomeComponent implements OnInit {
10
11 constructor(private router: Router) { }
12
13 ngOnInit() {
14 }
15
16 @HostListener('document:click', ['$event'])
17 documentClick(event: MouseEvent) {
18 this.router.navigate(['/inicio']);
19 }
20
21 }
22 1 import { Component, OnInit, HostListener } from '@angular/core';
src/app/inicio/inicio.component.html
1 <div class="row m-0 fade-in"> File was deleted
2 <div class="col-10 p-0">
3 <!-- TOP HEADER -->
4 <app-header></app-header>
5
6 <!-- NOMBRE DE SECCION -->
7 <div class="row m-0">
8 <div class="col-12 p-0">
9 <p class="h5 py-1 bg-light text-muted font-weight-light text-center"><small>Inicio</small></p>
10 </div>
11 </div>
12
13 <div class="row m-4 d-flex align-items-center">
14 <div class="col-md-5 d-flex align-items-end flex-column">
15
16 <!-- PROMOCIONES -->
17 <div class="card card-effect bg-white border-0 shadow rounded w-100 mb-auto">
18 <div class="card-body p-4">
19 <p class="h3 card-title">Promociones</p>
20 <p class="h5 card-text text-muted font-weight-light">Conozca las ofertas del momento.</p>
21 </div>
22 <div id="carouselIndicators" class="carousel slide mb-4" data-ride="carousel">
23 <ol class="carousel-indicators m-0">
24 <li data-target="#carouselIndicators" data-slide-to="0" class="bg-dark active"></li>
25 <li data-target="#carouselIndicators" data-slide-to="1" class="bg-dark"></li>
26 <li data-target="#carouselIndicators" data-slide-to="2" class="bg-dark"></li>
27 </ol>
28 <div class="carousel-inner">
29 <div class="carousel-item active">
30 <img src="../../assets/img/descarga.jpg" class="d-block w-50 m-auto rounded" alt="...">
31 </div>
32 <div class="carousel-item">
33 <img src="../../assets/img/descarga.jpg" class="d-block w-50 m-auto rounded" alt="...">
34 </div>
35 <div class="carousel-item">
36 <img src="../../assets/img/descarga.jpg" class="d-block w-50 m-auto rounded" alt="...">
37 </div>
38 </div>
39 </div>
40 </div>
41
42 <!-- ORDENAR -->
43 <div class="card card-effect bg-white border-0 shadow rounded w-100 mt-4">
44 <div class="card-body p-4">
45 <p class="h3 card-title">Ordenar</p>
46 <p class="h5 card-text text-muted font-weight-light">Arme su pedido y solo pase a retirar.</p>
47 </div>
48 <img class="card-img-bottom d-block w-50 mx-auto mb-4 rounded" src="../../assets/img/descarga.jpg">
49 </div>
50
51 </div>
52
53 <div class="col-md-7 d-flex align-items-end flex-column">
54
55 <!-- CARGAR PRODUCTOS -->
56 <div class="card card-effect bg-white border-0 shadow rounded w-100 mb-auto">
57 <div class="card-body p-4">
58 <p class="h3 card-title">Cargar Productos</p>
59 <p class="h5 card-text text-muted font-weight-light">
60 Coloque el código de<br>
61 barras o QR frente al scanner.
62 </p>
63 </div>
64 <div class="card bg-white border-0 w-75 mx-auto mb-4">
65 <img class="card-img-top d-block w-50 mx-auto rounded" src="../../assets/img/descarga.jpg">
66 <div class="card-body p-2">
67 <p class="m-0 card-text text-muted">Galletas Oreo x117 grs Chocolate.</p>
68 <p class="m-0 card-text text-muted">COD. 12121222</p>
69 </div>
70 </div>
71 </div>
72
73 <!-- BUSCAR PRODUCTOS -->
74 <div
75 (click)="goPage('busqueda-productos')"
76 class="card card-effect bg-white border-0 shadow rounded w-100 mt-4">
77 <div class="card-body p-4">
78 <p class="h3 card-title">Buscar Productos</p>
79 <p class="h5 card-text text-muted font-weight-light">
80 Busque aquí los productos<br>
81 que no tienen código
82 </p>
83 </div>
84 </div>
85
86 </div>
87
88 </div>
89
90 </div>
91
92 <!-- SIDEBAR -->
93 <app-sidebar class="col-3 col-md-2 vh-100 bg-dark text-white"></app-sidebar>
94 </div>
src/app/inicio/inicio.component.scss
src/app/inicio/inicio.component.spec.ts
1 import { async, ComponentFixture, TestBed } from '@angular/core/testing'; File was deleted
2
3 import { InicioComponent } from './inicio.component';
4
5 describe('InicioComponent', () => {
6 let component: InicioComponent;
7 let fixture: ComponentFixture<InicioComponent>;
8
9 beforeEach(async(() => {
10 TestBed.configureTestingModule({
11 declarations: [ InicioComponent ]
12 })
13 .compileComponents();
14 }));
15
16 beforeEach(() => {
17 fixture = TestBed.createComponent(InicioComponent);
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/inicio/inicio.component.ts
1 import { Component, OnInit } from '@angular/core'; File was deleted
2 import { Router } from '@angular/router';
3
4 @Component({
5 selector: 'app-inicio',
6 templateUrl: './inicio.component.html',
7 styleUrls: ['./inicio.component.scss']
8 })
9 export class InicioComponent implements OnInit {
10
11 constructor(private router: Router) { }
12
13 ngOnInit() {
14 }
15
16 private goPage(pageUrl) {
17 this.router.navigate([pageUrl]);
18 }
19
20 }
21 1 import { Component, OnInit } from '@angular/core';
src/app/services/producto.service.spec.ts
File was created 1 import { TestBed } from '@angular/core/testing';
2
3 import { ProductoService } from './producto.service';
4
5 describe('ProductoService', () => {
6 beforeEach(() => TestBed.configureTestingModule({}));
7
8 it('should be created', () => {
9 const service: ProductoService = TestBed.get(ProductoService);
10 expect(service).toBeTruthy();
11 });
12 });
13
src/app/services/producto.service.ts
File was created 1 import { Injectable } from '@angular/core';
2 import { HttpClient } from '@angular/common/http';
3 import { Observable } from 'rxjs';
4
5 @Injectable({
6 providedIn: 'root'
7 })
8 export class ProductoService {
9
10 constructor(private http: HttpClient) { }
11
12 getAll(): Observable<any> {
13 return this.http.get('http://10.231.45.179:4705/autoservicio/articulos')
14 }
15
16 }
17
src/app/sidebar/sidebar.component.html
1 <div class="d-flex align-items-center flex-column h-100 bg-dark pt-2 text-center"> File was deleted
2
3 <h4 class="border-bottom border-white"> Mi compra </h4>
4 <div class="overflow-auto mb-2">
5 <div class="card my-2 bg-primary border-0">
6 <img src="../../assets/img/descarga.jpg" class="card-img-top" alt="...">
7 <div class="card-body row m-0 p-0 px-1 py-1 shadow rounded">
8 <div class="col-8 p-0 text-left my-auto">
9 <p class="m-0 card-description">Galleta oreo x 199 gs Chocolate</p>
10 <p class="m-0 card-description"><small>COD: 1234567</small></p>
11 </div>
12 <div class="col-4 p-1 text-center my-auto">
13 {{90 | currency}}
14 </div>
15 </div>
16 <div class="row m-0 p-0">
17 <div class="col p-1 pb-1 mt-2">
18 <button type="button" class="btn btn-light btn-sm float-left my-auto">X</button>
19 <button type="button" class="btn btn-light btn-sm my-auto">X</button>
20 <div class="btn-group-sm btn-group float-right my-auto" role="group" aria-label="Basic example">
21 <button type="button" class="btn btn-light btn-sm mb-2">+</button>
22 <label for="" class="border border.white px-1">12</label>
23 <button type="button" class="btn btn-light btn-sm mb-2">-</button>
24 </div>
25 </div>
26 </div>
27 </div>
28 </div>
29
30 <div class="card mt-auto blue-gradient border-0">
31 <div class="card-body row">
32 <div class="col">
33 <h4 class="border-bottom border-secondary text-secondary">(1) item</h4>
34 <h3 class="text-secondary">Total</h3>
35 <h3 class="text-dark"><strong>{{5000 | currency}}</strong></h3>
36 </div>
37 <div class="col 12 p-0">
38 <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 btn-sm">Cancelar</button>
40 </div>
41 </div>
42 </div>
src/app/sidebar/sidebar.component.scss
1 .card-description{ File was deleted
2 font-size: 12px;
3 }
src/app/sidebar/sidebar.component.spec.ts
1 import { async, ComponentFixture, TestBed } from '@angular/core/testing'; File was deleted
2
3 import { SidebarComponent } from './sidebar.component';
4
5 describe('SidebarComponent', () => {
6 let component: SidebarComponent;
7 let fixture: ComponentFixture<SidebarComponent>;
8
9 beforeEach(async(() => {
10 TestBed.configureTestingModule({
11 declarations: [SidebarComponent]
12 })
13 .compileComponents();
14 }));
15
16 beforeEach(() => {
17 fixture = TestBed.createComponent(SidebarComponent);
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/sidebar/sidebar.component.ts
1 import { Component, OnInit } from '@angular/core'; File was deleted
2
3 @Component({
4 selector: 'app-sidebar',
5 templateUrl: './sidebar.component.html',
6 styleUrls: ['./sidebar.component.scss']
7 })
8 export class SidebarComponent implements OnInit {
9
10 constructor() { }
11
12 ngOnInit() {
13 }
14
15 }
16 1 import { Component, OnInit } from '@angular/core';