Commit 63caddaf6922821442162b573ada7346c2db43b7

Authored by Eric Fernandez
Exists in master and in 1 other branch validar_pve

Merge branch 'master' into 'master'

Master(mpuebla)

See merge request !68
src/app/app-routing.module.ts
... ... @@ -5,19 +5,19 @@ import { InicioComponent } from './components/inicio/inicio.component';
5 5 import { BusquedaProductosComponent } from './components/busqueda-productos/busqueda-productos.component';
6 6 import { ConfirmacionCarritoComponent } from './components/confirmacion-carrito/confirmacion-carrito.component';
7 7 import { MasterComponent } from './components/master/master.component';
8   -import { AmbImagenesComponent } from './components/amb-imagenes/amb-imagenes.component';
9 8 import { PagoComponent } from './components/pago/pago.component';
10 9 import { CancelarCompraComponent } from './components/cancelar-compra/cancelar-compra.component';
11 10 import { MensajeFinalComponent } from './components/mensaje-final/mensaje-final.component';
  11 +import { ComandaComponent } from './components/comanda/comanda.component';
12 12  
13 13 const routes: Routes = [
14 14 { path: '', component: HomeComponent },
15 15 { path: 'home', component: HomeComponent },
16   - { path: 'abm-imagenes', component: AmbImagenesComponent },
17 16 { path: 'confirmacion-carrito', component: ConfirmacionCarritoComponent },
18 17 { path: 'pago', component: PagoComponent },
19 18 { path: 'cancelar-compra', component: CancelarCompraComponent },
20 19 { path: 'mensaje-final', component: MensajeFinalComponent },
  20 + { path: 'comanda', component: ComandaComponent },
21 21 {
22 22 path: '',
23 23 component: MasterComponent,
src/app/app.module.ts
... ... @@ -27,10 +27,10 @@ import { ConfirmacionCarritoComponent } from './components/confirmacion-carrito/
27 27 import { MasterComponent } from './components/master/master.component';
28 28 import { PopoverPromosComponent } from './components/popover-promos/popover-promos.component';
29 29 import { PopoverSinonimosComponent } from './components/popover-sinonimos/popover-sinonimos.component';
30   -import { AmbImagenesComponent } from './components/amb-imagenes/amb-imagenes.component';
31 30 import { PagoComponent } from './components/pago/pago.component';
32 31 import { CancelarCompraComponent } from './components/cancelar-compra/cancelar-compra.component';
33 32 import { MensajeFinalComponent } from './components/mensaje-final/mensaje-final.component';
  33 +import { ComandaComponent } from './components/comanda/comanda.component';
34 34 //#endregion
35 35  
36 36 @NgModule({
... ... @@ -45,10 +45,10 @@ import { MensajeFinalComponent } from './components/mensaje-final/mensaje-final.
45 45 MasterComponent,
46 46 PopoverPromosComponent,
47 47 PopoverSinonimosComponent,
48   - AmbImagenesComponent,
49 48 PagoComponent,
50 49 CancelarCompraComponent,
51   - MensajeFinalComponent
  50 + MensajeFinalComponent,
  51 + ComandaComponent
52 52 ],
53 53 imports: [
54 54 BrowserModule,
src/app/components/amb-imagenes/amb-imagenes.component.html
... ... @@ -1,104 +0,0 @@
1   -<app-header></app-header>
2   -
3   -<div class="container-fluid">
4   - <div class="row m-3">
5   - <div class="col">
6   - <p class="h2">Configuración de imágenes</p>
7   - </div>
8   - </div>
9   -
10   - <div class="row mx-3 search">
11   - <div class="col">
12   - <span class="fa fa-search form-control-lg form-control-search pl-3"></span>
13   - <input
14   - type="text"
15   - class="form-control form-control-lg shadow-sm rounded-pill px-5"
16   - placeholder="Búsqueda productos"
17   - [(ngModel)]="searchTerm"
18   - (ngModelChange)="filterItems()">
19   - </div>
20   - </div>
21   -
22   - <div class="row m-3 vh-60 overflow-scroll">
23   - <div class="col">
24   - <h5>Productos</h5>
25   - <table class="table table-striped table-hover table-borderless shadow">
26   - <thead>
27   - <tr class="bg-primary text-center text-white shadow-sm">
28   - <th>Nombre</th>
29   - <th colspan="2">Imagen</th>
30   - </tr>
31   - </thead>
32   - <tbody>
33   - <tr class="shadow-sm" *ngFor="let articulo of auxProductos">
34   - <td class="align-middle">
35   - <p class="m-0">{{articulo.DET_LAR}}</p>
36   - <p class="m-0"><small>Descripción: {{articulo.DET_LAR}}</small></p>
37   - <p class="m-0"><small>Sector: {{articulo.CodSec}}</small></p>
38   - <p class="m-0"><small>Código: {{articulo.CodArt}}</small></p>
39   - </td>
40   - <td>
41   - <img
42   - *ngIf="articulo.imagenes.length == 0"
43   - class="fade-in w-100 mx-auto img-fluid"
44   - src="{{apiImagenes}}/imagenes/noImage.jpg">
45   - <carousel [interval]="false">
46   - <slide *ngFor="let item of articulo.imagenes; let index = index">
47   - <img
48   - *ngIf="!item.fromGallery"
49   - class="fade-in img-fluid w-100"
50   - src="{{apiImagenes}}/imagenes/{{item.imagen}}">
51   - <img
52   - *ngIf="item.fromGallery"
53   - class="fade-in img-fluid w-100"
54   - src="{{item.base64}}">
55   - <button
56   - (click)="deleteImage(articulo.imagenes, index)"
57   - type="button"
58   - class="btn btn-light btn-delete-image position-absolute close">
59   - <span aria-hidden="true">&times;</span>
60   - </button>
61   - </slide>
62   - </carousel>
63   - </td>
64   - <td class="align-middle text-center">
65   - <div class="custom-file">
66   - <input
67   - type="file"
68   - class="custom-file-input"
69   - id="customFileLang"
70   - accept="image/*"
71   - (change)="onFileSelected($event, articulo)"
72   - lang="es"
73   - multiple>
74   - <label class="custom-file-label text-left pr-5" for="customFileLang">
75   - <small>Seleccionar archivo</small>
76   - </label>
77   - </div>
78   - </td>
79   - </tr>
80   - </tbody>
81   - </table>
82   - </div>
83   - </div>
84   -
85   - <div class="row" *ngIf="paginationData">
86   - <div class="col">
87   - <pagination
88   - [rotate]="false"
89   - [(ngModel)]="paginationData.page"
90   - [totalItems]="paginationData.rowCount"
91   - [maxSize]="paginationData.pageCount"
92   - [itemsPerPage]="paginationData.pageSize"
93   - (pageChanged)="pageChanged($event)"
94   - [boundaryLinks]="true"
95   - [disabled]="disabledPaginador"
96   - previousText="&lsaquo;"
97   - nextText="&rsaquo;"
98   - firstText="&laquo;"
99   - lastText="&raquo;"
100   - ></pagination>
101   - </div>
102   - </div>
103   -
104   -</div>
src/app/components/amb-imagenes/amb-imagenes.component.scss
... ... @@ -1,18 +0,0 @@
1   -.search .form-control-search {
2   - position: absolute;
3   - z-index: 2;
4   - display: block;
5   - text-align: center;
6   - pointer-events: none;
7   - color: #aaa;
8   - line-height: inherit;
9   -}
10   -
11   -.custom-file-input:lang(es) ~ .custom-file-label::after {
12   - content: "Elegir";
13   -}
14   -
15   -.btn-delete-image {
16   - top: 0;
17   - left: 95%;
18   -}
src/app/components/amb-imagenes/amb-imagenes.component.spec.ts
... ... @@ -1,25 +0,0 @@
1   -import { async, ComponentFixture, TestBed } from '@angular/core/testing';
2   -
3   -import { AmbImagenesComponent } from './amb-imagenes.component';
4   -
5   -describe('AmbImagenesComponent', () => {
6   - let component: AmbImagenesComponent;
7   - let fixture: ComponentFixture<AmbImagenesComponent>;
8   -
9   - beforeEach(async(() => {
10   - TestBed.configureTestingModule({
11   - declarations: [ AmbImagenesComponent ]
12   - })
13   - .compileComponents();
14   - }));
15   -
16   - beforeEach(() => {
17   - fixture = TestBed.createComponent(AmbImagenesComponent);
18   - component = fixture.componentInstance;
19   - fixture.detectChanges();
20   - });
21   -
22   - it('should create', () => {
23   - expect(component).toBeTruthy();
24   - });
25   -});
src/app/components/amb-imagenes/amb-imagenes.component.ts
... ... @@ -1,124 +0,0 @@
1   -import { Component, OnInit } from '@angular/core';
2   -import { appSettings } from 'src/etc/AppSettings';
3   -import { ProductoService } from 'src/app/services/producto.service';
4   -import { Producto } from 'src/app/wrappers/producto';
5   -import { HttpClient } from '@angular/common/http';
6   -
7   -@Component({
8   - selector: 'app-amb-imagenes',
9   - templateUrl: './amb-imagenes.component.html',
10   - styleUrls: ['./amb-imagenes.component.scss']
11   -})
12   -
13   -export class AmbImagenesComponent implements OnInit {
14   -
15   - apiUrl = appSettings.apiImagenes;
16   - articulos: Producto[] = [];
17   - private auxProductos: Producto[] = [];
18   - private searchTerm: string = '';
19   - private paginationData: any;
20   - private disabledPaginador: boolean = false;
21   -
22   - constructor(private productoService: ProductoService, private http: HttpClient) { }
23   -
24   - ngOnInit() {
25   -
26   - this.productoService.getAllWithPaginator()
27   - .subscribe((res) => {
28   -
29   - this.articulos = res.data;
30   - this.paginationData = res.pagination;
31   - this.filterItems();
32   - }, error => console.error(error));
33   - }
34   -
35   - onFileSelected(event, articulo: Producto) {
36   -
37   - let auxFiles: FileList = event.target.files;
38   - Array.from(auxFiles).forEach(file => {
39   -
40   - this.onLoad(file)
41   - .then(result => {
42   - // articulo.imagenes.push({
43   - // name: file.name + articulo.CodArt + articulo.CodSec,
44   - // fromGallery: true,
45   - // imagen: result,
46   - // id_articulo: articulo.id
47   - // });
48   - let imagenAguardar = {
49   - imagen: {
50   - name: `${articulo.CodSec}${articulo.CodArt}${file.name}`,
51   - base64: result,
52   - codigo: articulo.CodArt,
53   - sector: articulo.CodSec,
54   - id_articulo: articulo.id
55   - },
56   - articulo: articulo
57   - };
58   - this.saveInBase(imagenAguardar);
59   - });
60   - })
61   - }
62   -
63   - filterItems() {
64   -
65   - this.auxProductos = this.articulos.filter(x => {
66   - return x.DET_LAR.toLowerCase().includes(this.searchTerm.toLowerCase()) ||
67   - x.CodArt.toString().includes(this.searchTerm.toLowerCase()) ||
68   - x.CodSec.toString().includes(this.searchTerm.toLowerCase());
69   - });
70   - }
71   -
72   - saveInBase(imagenAguardar) {
73   -
74   - this.productoService.saveInBase(imagenAguardar.imagen)
75   - .subscribe(res => {
76   - imagenAguardar.imagen['id'] = res[0];
77   - imagenAguardar.imagen['fromGallery'] = true;
78   - imagenAguardar.articulo.imagenes.push(imagenAguardar.imagen);
79   - }, error => console.error(error));
80   - }
81   -
82   - onLoad(file) {
83   -
84   - return new Promise((resolve, reject) => {
85   -
86   - var fr = new FileReader();
87   -
88   - fr.onload = function () {
89   -
90   - resolve(fr.result);
91   - };
92   -
93   - fr.readAsDataURL(file);
94   - });
95   -
96   - }
97   -
98   - deleteImage(imagenes, index: number) {
99   -
100   - if (!imagenes[index].name) {
101   - imagenes[index].name = imagenes[index].imagen;
102   - }
103   -
104   - this.productoService.deleteImage(imagenes[index])
105   - .subscribe(res => {
106   -
107   - if (res) {
108   - imagenes.splice(index, 1);
109   - }
110   - }, error => console.error(error));
111   - }
112   -
113   - pageChanged(event: any): void {
114   - this.disabledPaginador = true;
115   - this.productoService.getAllWithPaginator(event.page)
116   - .subscribe((res) => {
117   - this.disabledPaginador = false;
118   - this.articulos = res.data;
119   - this.paginationData = res.pagination;
120   - this.filterItems();
121   - }, error => console.error(error));
122   - }
123   -
124   -}
src/app/components/busqueda-productos/busqueda-productos.component.html
... ... @@ -5,8 +5,8 @@
5 5 <div class="row m-0">
6 6 <div class="col-12 p-0">
7 7 <p class="h5 py-1 bg-gray text-muted text-center">
8   - Búsqueda
9   - <i class="fa fa-search"></i>
  8 + {{title}}
  9 + <i *ngIf="title === 'Búsqueda'" class="fa fa-search"></i>
10 10 </p>
11 11 </div>
12 12 </div>
src/app/components/busqueda-productos/busqueda-productos.component.ts
... ... @@ -17,11 +17,12 @@ export class BusquedaProductosComponent implements OnInit {
17 17 private searchTerm: string = '';
18 18 private categoriaActive: number = null;
19 19 private showSpinner: boolean = true;
20   - private queMostrar: string = 'todo';
  20 + private queMostrar: string = 'todos';
21 21 private apiImagenes: string = appSettings.apiImagenes;
22 22 private categorias: Categoria[] = [];
23 23 private blurFocus = new EventEmitter();
24 24 private ordenandoByVendidos = true;
  25 + private title: string = 'Búsqueda'
25 26  
26 27 constructor(
27 28 private productoService: ProductoService,
... ... @@ -38,18 +39,21 @@ export class BusquedaProductosComponent implements OnInit {
38 39 case 'todos':
39 40 this.categorias = categorias;
40 41 this.categoriaActive = 0;
  42 + this.title = 'Búsqueda';
41 43 break;
42   - case 'promociones':
43   - this.categorias = categorias;
44   - this.categoriaActive = 1;
45   - break;
46   - case 'ordenar':
47   -
48   - this.categorias = categorias.filter((categoria: Categoria) => {
49   - return categoria.ES_PEDIDO;
50   - });
51   -
52   - this.categoriaActive = 0;
  44 + case 'promociones':
  45 + this.categorias = categorias;
  46 + this.categoriaActive = 1;
  47 + this.title = 'Promociones';
  48 + break;
  49 + case 'ordenar':
  50 +
  51 + this.categorias = categorias.filter((categoria: Categoria) => {
  52 + return categoria.ES_PEDIDO;
  53 + });
  54 +
  55 + this.categoriaActive = 0;
  56 + this.title = 'Ordenar';
53 57  
54 58 break;
55 59 default:
src/app/components/comanda/comanda.component.html
... ... @@ -0,0 +1,37 @@
  1 +<div class="container-fluid p-0">
  2 + <div class="row m-1 fade-in disable-user-select">
  3 + <div class="col-2 col-1-5 p-1" *ngFor="let item of itemsArray">
  4 + <div
  5 + class="card rounded-sm shadow-sm"
  6 + [ngClass]="{ 'green-card': false, 'red-card': false }"
  7 + >
  8 + <img
  9 + class="card-img-top rounded-sm shadow"
  10 + src="{{ apiImagenes }}/imagenes/cerealitas.jpg"
  11 + />
  12 + <div class="card-body px-1 py-2">
  13 + <p class="h6 card-title">Title</p>
  14 + <p class="card-text">Text</p>
  15 + <button class="btn btn-block btn-danger shadow p-1">Elaborar</button>
  16 + <button class="btn btn-block btn-success shadow p-1">
  17 + Terminado
  18 + </button>
  19 + <div class="row mt-2 m-0">
  20 + <div class="col-6 p-0 pr-1">
  21 + <button class="btn btn-block btn-secondary btn-sm shadow p-0">
  22 + <span class="pr-1 h7"><small>Eliminar</small></span>
  23 + <i class="fa fa-trash" aria-hidden="true"></i>
  24 + </button>
  25 + </div>
  26 + <div class="col-6 p-0 pl-1">
  27 + <button class="btn btn-block btn-light btn-sm shadow p-0">
  28 + <span class="pr-1 h7"><small>En espera</small></span>
  29 + <i class="fa fa-undo text-warning" aria-hidden="true"></i>
  30 + </button>
  31 + </div>
  32 + </div>
  33 + </div>
  34 + </div>
  35 + </div>
  36 + </div>
  37 +</div>
src/app/components/comanda/comanda.component.scss
... ... @@ -0,0 +1,28 @@
  1 +@media (min-width: 1200px) {
  2 + .col-1-5 {
  3 + flex: 0 0 12.5%;
  4 + max-width: 12.5%;
  5 + position: relative;
  6 + width: 100%;
  7 + padding-right: 15px;
  8 + padding-left: 15px;
  9 + }
  10 +}
  11 +
  12 +.h7 {
  13 + font-size: 0.75rem;
  14 +}
  15 +
  16 +.red-card {
  17 + background-color: #8c000e;
  18 + .card-body {
  19 + color: #fff;
  20 + }
  21 +}
  22 +
  23 +.green-card {
  24 + background-color: #00751B;
  25 + .card-body {
  26 + color: #fff;
  27 + }
  28 +}
src/app/components/comanda/comanda.component.spec.ts
... ... @@ -0,0 +1,25 @@
  1 +import { async, ComponentFixture, TestBed } from '@angular/core/testing';
  2 +
  3 +import { ComandaComponent } from './comanda.component';
  4 +
  5 +describe('ComandaComponent', () => {
  6 + let component: ComandaComponent;
  7 + let fixture: ComponentFixture<ComandaComponent>;
  8 +
  9 + beforeEach(async(() => {
  10 + TestBed.configureTestingModule({
  11 + declarations: [ ComandaComponent ]
  12 + })
  13 + .compileComponents();
  14 + }));
  15 +
  16 + beforeEach(() => {
  17 + fixture = TestBed.createComponent(ComandaComponent);
  18 + component = fixture.componentInstance;
  19 + fixture.detectChanges();
  20 + });
  21 +
  22 + it('should create', () => {
  23 + expect(component).toBeTruthy();
  24 + });
  25 +});
src/app/components/comanda/comanda.component.ts
... ... @@ -0,0 +1,19 @@
  1 +import { Component, OnInit } from '@angular/core';
  2 +import { appSettings } from 'src/etc/AppSettings';
  3 +
  4 +@Component({
  5 + selector: 'app-comanda',
  6 + templateUrl: './comanda.component.html',
  7 + styleUrls: ['./comanda.component.scss']
  8 +})
  9 +export class ComandaComponent implements OnInit {
  10 +
  11 + private apiImagenes = appSettings.apiImagenes;
  12 + private itemsArray = [{},{},{},{},{},{},{},{}]
  13 +
  14 + constructor() { }
  15 +
  16 + ngOnInit() {
  17 + }
  18 +
  19 +}
src/app/services/producto.service.ts
... ... @@ -21,7 +21,7 @@ export class ProductoService {
21 21 return this.http.get(`${appSettings.apiUrl}/articulos/${id}`);
22 22 }
23 23  
24   - getAll(page: number = 1): Observable<any> {
  24 + getAll(): Observable<any> {
25 25  
26 26 return this.http.get(`${appSettings.apiUrl}/articulos/`);
27 27 }
... ... @@ -74,14 +74,6 @@ export class ProductoService {
74 74 return this.http.get(url);
75 75 }
76 76  
77   - saveInBase(body): Observable<any> {
78   - return this.http.post(`${appSettings.apiUrl}/imagenes/guardar`, body);
79   - }
80   -
81   - deleteImage(body): Observable<any> {
82   - return this.http.post(`${appSettings.apiUrl}/imagen/borrar`, body);
83   - }
84   -
85 77 getCategorias() {
86 78 return this.http.get(`${appSettings.apiUrl}/categorias`);
87 79 }