Martin Macola / autoservicio

Commit 63caddaf6922821442162b573ada7346c2db43b7

Authored by Eric Fernandez 2019-09-03 12:04:33 -0300

Exists in master

Merge branch 'master' into 'master'

Master(mpuebla)

See merge request !68

Showing 13 changed files Show diff stats

src/app/app-routing.module.ts

Diff comments View file @ 63cadda

 import { NgModule } from '@angular/core';
 import { Routes, RouterModule } from '@angular/router';
 import { HomeComponent } from './components/home/home.component';
 import { InicioComponent } from './components/inicio/inicio.component';
 import { BusquedaProductosComponent } from './components/busqueda-productos/busqueda-productos.component';
 import { ConfirmacionCarritoComponent } from './components/confirmacion-carrito/confirmacion-carrito.component';
 import { MasterComponent } from './components/master/master.component';
-import { AmbImagenesComponent } from './components/amb-imagenes/amb-imagenes.component';
 import { PagoComponent } from './components/pago/pago.component';
 import { CancelarCompraComponent } from './components/cancelar-compra/cancelar-compra.component';
 import { MensajeFinalComponent } from './components/mensaje-final/mensaje-final.component';
+import { ComandaComponent } from './components/comanda/comanda.component';
 const routes: Routes = [
   { path: '', component: HomeComponent },
   { path: 'home', component: HomeComponent },
-  { path: 'abm-imagenes', component: AmbImagenesComponent },
   { path: 'confirmacion-carrito', component: ConfirmacionCarritoComponent },
   { path: 'pago', component: PagoComponent },
   { path: 'cancelar-compra', component: CancelarCompraComponent },
   { path: 'mensaje-final', component: MensajeFinalComponent },
+  { path: 'comanda', component: ComandaComponent },
   {
     path: '',
     component: MasterComponent,
     children: [
       { path: 'inicio', component: InicioComponent },
       { path: 'busqueda-productos', component: BusquedaProductosComponent }
     ]
   },
   { path: '**', redirectTo: '/home', pathMatch: 'full' },
 ];
 @NgModule({
   imports: [RouterModule.forRoot(routes, {onSameUrlNavigation: 'reload'})],
   exports: [RouterModule]
 })

src/app/app.module.ts

Diff comments View file @ 63cadda

 //#region MODULES
 import { BrowserModule } from '@angular/platform-browser';
 import { NgModule } from '@angular/core';
 import { AppRoutingModule } from './app-routing.module';
 import { HttpClientModule } from '@angular/common/http';
 import { FormsModule, ReactiveFormsModule } from '@angular/forms';
 import { TooltipModule } from 'ngx-bootstrap/tooltip';
 import { PopoverModule } from 'ngx-bootstrap/popover';
 import { CarouselModule } from 'ngx-bootstrap/carousel';
 import { PaginationModule } from 'ngx-bootstrap/pagination';
 //#endregion
 //#region Keyboard
 import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
 import { MatButtonModule } from '@angular/material/button';
 import { MatKeyboardModule } from '@ngx-material-keyboard/core';
 //#endregion
 //#region COMPONENTS
 import { AppComponent } from './app.component';
 import { HeaderComponent } from './components/header/header.component';
 import { SidebarComponent } from './components/sidebar/sidebar.component';
 import { HomeComponent } from './components/home/home.component';
 import { InicioComponent } from './components/inicio/inicio.component';
 import { BusquedaProductosComponent } from './components/busqueda-productos/busqueda-productos.component';
 import { ConfirmacionCarritoComponent } from './components/confirmacion-carrito/confirmacion-carrito.component';
 import { MasterComponent } from './components/master/master.component';
 import { PopoverPromosComponent } from './components/popover-promos/popover-promos.component';
 import { PopoverSinonimosComponent } from './components/popover-sinonimos/popover-sinonimos.component';
-import { AmbImagenesComponent } from './components/amb-imagenes/amb-imagenes.component';
 import { PagoComponent } from './components/pago/pago.component';
 import { CancelarCompraComponent } from './components/cancelar-compra/cancelar-compra.component';
 import { MensajeFinalComponent } from './components/mensaje-final/mensaje-final.component';
+import { ComandaComponent } from './components/comanda/comanda.component';
 //#endregion
 @NgModule({
   declarations: [
     AppComponent,
     HeaderComponent,
     SidebarComponent,
     HomeComponent,
     InicioComponent,
     BusquedaProductosComponent,
     ConfirmacionCarritoComponent,
     MasterComponent,
     PopoverPromosComponent,
     PopoverSinonimosComponent,
-    AmbImagenesComponent,
     PagoComponent,
     CancelarCompraComponent,
-    MensajeFinalComponent
+    MensajeFinalComponent,
+    ComandaComponent
   ],
   imports: [
     BrowserModule,
     AppRoutingModule,
     HttpClientModule,
     FormsModule,
     ReactiveFormsModule,
     ReactiveFormsModule.withConfig({ warnOnNgModelWithFormControl: 'never' }),
     TooltipModule.forRoot(),
     PopoverModule.forRoot(),
     BrowserAnimationsModule,
     MatKeyboardModule,
     MatButtonModule,
     CarouselModule.forRoot(),
     PaginationModule.forRoot()
   ],
   providers: [],
   bootstrap: [AppComponent]
 })

src/app/components/amb-imagenes/amb-imagenes.component.html

View file @ 63cadda

1	<app-header></app-header>		File was deleted
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">×</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="«"
99	lastText="»"
100	></pagination>
101	</div>
102	</div>
103
104	</div>
105		1	<app-header></app-header>

src/app/components/amb-imagenes/amb-imagenes.component.scss

View file @ 63cadda

1	.search .form-control-search {		File was deleted
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	}
19		1	.search .form-control-search {

src/app/components/amb-imagenes/amb-imagenes.component.spec.ts

View file @ 63cadda

1	import { async, ComponentFixture, TestBed } from '@angular/core/testing';		File was deleted
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	});
26		1	import { async, ComponentFixture, TestBed } from '@angular/core/testing';

src/app/components/amb-imagenes/amb-imagenes.component.ts

View file @ 63cadda

1	import { Component, OnInit } from '@angular/core';		File was deleted
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	}
125		1	import { Component, OnInit } from '@angular/core';

src/app/components/busqueda-productos/busqueda-productos.component.html

Diff comments View file @ 63cadda

1	<div class="row m-0 fade-in">	1	<div class="row m-0 fade-in">
2	<div class="col-12 p-0">	2	<div class="col-12 p-0">
3		3
4	<!-- NOMBRE DE SECCION -->	4	<!-- NOMBRE DE SECCION -->
5	<div class="row m-0">	5	<div class="row m-0">
6	<div class="col-12 p-0">	6	<div class="col-12 p-0">
7	<p class="h5 py-1 bg-gray text-muted text-center">	7	<p class="h5 py-1 bg-gray text-muted text-center">
8	Búsqueda	8	{{title}}
9	<i class="fa fa-search"></i>	9	<i *ngIf="title === 'Búsqueda'" class="fa fa-search"></i>
10	</p>	10	</p>
11	</div>	11	</div>
12	</div>	12	</div>
13		13
14	<div class="row m-3 disable-user-select">	14	<div class="row m-3 disable-user-select">
15		15
16	<!-- FILTROS -->	16	<!-- FILTROS -->
17	<div *ngIf="queMostrar != 'promociones'" class="col-sm-2 p-1">	17	<div *ngIf="queMostrar != 'promociones'" class="col-sm-2 p-1">
18	<div class="text-center">	18	<div class="text-center">
19	<p class="font-weight-bold text-muted border-bottom pb-2">Buscar por Categoría</p>	19	<p class="font-weight-bold text-muted border-bottom pb-2">Buscar por Categoría</p>
20	</div>	20	</div>
21	<ul class="list-group">	21	<ul class="list-group">
22	<li	22	<li
23	[ngClass]="{active: categoriaActive == 0}"	23	[ngClass]="{active: categoriaActive == 0}"
24	(click)="categoriaActive = 0; filterItems()"	24	(click)="categoriaActive = 0; filterItems()"
25	class="list-group-item list-group-item-action text-center my-1 p-2 h6">	25	class="list-group-item list-group-item-action text-center my-1 p-2 h6">
26	Todos	26	Todos
27	</li>	27	</li>
28	<li	28	<li
29	*ngFor="let categoria of categorias"	29	*ngFor="let categoria of categorias"
30	[ngClass]="{active: categoriaActive == categoria.id}"	30	[ngClass]="{active: categoriaActive == categoria.id}"
31	(click)="categoriaActive = categoria.id; filterItems()"	31	(click)="categoriaActive = categoria.id; filterItems()"
32	class="list-group-item list-group-item-action text-center my-1 p-2 h6">	32	class="list-group-item list-group-item-action text-center my-1 p-2 h6">
33	{{categoria.detalle}}	33	{{categoria.detalle}}
34	</li>	34	</li>
35	</ul>	35	</ul>
36	</div>	36	</div>
37		37
38	<!-- SEARCH INPUT -->	38	<!-- SEARCH INPUT -->
39	<div *ngIf="productos.length > 0" class="fade-in col">	39	<div *ngIf="productos.length > 0" class="fade-in col">
40		40
41	<div class="row search">	41	<div class="row search">
42	<div class="col-sm-10">	42	<div class="col-sm-10">
43	<span class="fa fa-search form-control-lg form-control-search pl-3"></span>	43	<span class="fa fa-search form-control-lg form-control-search pl-3"></span>
44	<input	44	<input
45	[matKeyboard]="'spanish'"	45	[matKeyboard]="'spanish'"
46	type="text"	46	type="text"
47	class="form-control form-control-lg shadow-sm rounded-pill px-5"	47	class="form-control form-control-lg shadow-sm rounded-pill px-5"
48	placeholder="Búsqueda productos"	48	placeholder="Búsqueda productos"
49	[(ngModel)]="searchTerm"	49	[(ngModel)]="searchTerm"
50	(ngModelChange)="filterItems()">	50	(ngModelChange)="filterItems()">
51	</div>	51	</div>
52	<!-- BOTON VOLVER -->	52	<!-- BOTON VOLVER -->
53	<div class="col-sm-2">	53	<div class="col-sm-2">
54	<button	54	<button
55	type="button"	55	type="button"
56	class="btn btn-light btn-lg shadow-sm"	56	class="btn btn-light btn-lg shadow-sm"
57	[routerLink]="['/inicio']">	57	[routerLink]="['/inicio']">
58	<span class="font-weight-normal h6 pr-2">Volver</span>	58	<span class="font-weight-normal h6 pr-2">Volver</span>
59	<i class="fa fa-undo text-warning" aria-hidden="true"></i>	59	<i class="fa fa-undo text-warning" aria-hidden="true"></i>
60	</button>	60	</button>
61	</div>	61	</div>
62	<div class="col-sm-12 my-2 h5">	62	<div class="col-sm-12 my-2 h5">
63	<button	63	<button
64	class="btn btn-outline-primary badge badge-light px-2 shadow-sm"	64	class="btn btn-outline-primary badge badge-light px-2 shadow-sm"
65	[ngClass]="{'active': ordenandoByVendidos}"	65	[ngClass]="{'active': ordenandoByVendidos}"
66	(click)="ordenandoByVendidos = !ordenandoByVendidos; ordenar()"	66	(click)="ordenandoByVendidos = !ordenandoByVendidos; ordenar()"
67	>Más vendidos</button>	67	>Más vendidos</button>
68	</div>	68	</div>
69	</div>	69	</div>
70	<!-- LISTA DE PRODUCTOS -->	70	<!-- LISTA DE PRODUCTOS -->
71	<div class="row align-items-start vh-70 overflow-scroll disable-user-select">	71	<div class="row align-items-start vh-70 overflow-scroll disable-user-select">
72	<div	72	<div
73	class="col-4 p-2"	73	class="col-4 p-2"
74	*ngFor="let producto of auxProductos">	74	*ngFor="let producto of auxProductos">
75	<div	75	<div
76	class="card-effect bg-white rounded-sm shadow border-0"	76	class="card-effect bg-white rounded-sm shadow border-0"
77	(click)="elegirProducto(producto)">	77	(click)="elegirProducto(producto)">
78	<img src="{{apiImagenes}}/imagenes/{{producto.imagenes[0].imagen}}" class="rounded-sm w-100 m-auto">	78	<img src="{{apiImagenes}}/imagenes/{{producto.imagenes[0].imagen}}" class="rounded-sm w-100 m-auto">
79	<div class="p-2">	79	<div class="p-2">
80	<p class="h6 min-h-40 text-left m-0"><small>{{producto.DET_LAR}}</small></p>	80	<p class="h6 min-h-40 text-left m-0"><small>{{producto.DET_LAR}}</small></p>
81	<div class="row m-0">	81	<div class="row m-0">
82	<div class="col-12 my-auto pt-2 pr-2 p-0">	82	<div class="col-12 my-auto pt-2 pr-2 p-0">
83	<p class="text-right m-0 h6">{{producto.PreVen \| currency}}</p>	83	<p class="text-right m-0 h6">{{producto.PreVen \| currency}}</p>
84	</div>	84	</div>
85	</div>	85	</div>
86	</div>	86	</div>
87	</div>	87	</div>
88	</div>	88	</div>
89	</div>	89	</div>
90	</div>	90	</div>
91		91
92	<!-- SPINNER -->	92	<!-- SPINNER -->
93	<div	93	<div
94	*ngIf="productos.length === 0 && showSpinner"	94	*ngIf="productos.length === 0 && showSpinner"
95	class="col-sm-10 p-0 align-self-center text-center">	95	class="col-sm-10 p-0 align-self-center text-center">
96	<div class="spinner-border spinner-lg text-secondary" role="status"></div>	96	<div class="spinner-border spinner-lg text-secondary" role="status"></div>
97	<span class="text-secondary m-2 h5">Cargando información.</span>	97	<span class="text-secondary m-2 h5">Cargando información.</span>
98	</div>	98	</div>
99		99
100	</div>	100	</div>
101		101
102	</div>	102	</div>
103		103
104	</div>	104	</div>
105		105

src/app/components/busqueda-productos/busqueda-productos.component.ts

Diff comments View file @ 63cadda

1	import { Component, OnInit, EventEmitter } from '@angular/core';	1	import { Component, OnInit, EventEmitter } from '@angular/core';
2	import { ProductoService } from 'src/app/services/producto.service';	2	import { ProductoService } from 'src/app/services/producto.service';
3	import { Producto } from 'src/app/wrappers/producto';	3	import { Producto } from 'src/app/wrappers/producto';
4	import { Categoria } from 'src/app/wrappers/categoria';	4	import { Categoria } from 'src/app/wrappers/categoria';
5	import { appSettings } from 'src/etc/AppSettings';	5	import { appSettings } from 'src/etc/AppSettings';
6	import { Router } from '@angular/router';	6	import { Router } from '@angular/router';
7		7
8	@Component({	8	@Component({
9	selector: 'app-busqueda-productos',	9	selector: 'app-busqueda-productos',
10	templateUrl: './busqueda-productos.component.html',	10	templateUrl: './busqueda-productos.component.html',
11	styleUrls: ['./busqueda-productos.component.scss']	11	styleUrls: ['./busqueda-productos.component.scss']
12	})	12	})
13	export class BusquedaProductosComponent implements OnInit {	13	export class BusquedaProductosComponent implements OnInit {
14		14
15	private productos: Producto[] = [];	15	private productos: Producto[] = [];
16	private auxProductos: Producto[] = [];	16	private auxProductos: Producto[] = [];
17	private searchTerm: string = '';	17	private searchTerm: string = '';
18	private categoriaActive: number = null;	18	private categoriaActive: number = null;
19	private showSpinner: boolean = true;	19	private showSpinner: boolean = true;
20	private queMostrar: string = 'todo';	20	private queMostrar: string = 'todos';
21	private apiImagenes: string = appSettings.apiImagenes;	21	private apiImagenes: string = appSettings.apiImagenes;
22	private categorias: Categoria[] = [];	22	private categorias: Categoria[] = [];
23	private blurFocus = new EventEmitter();	23	private blurFocus = new EventEmitter();
24	private ordenandoByVendidos = true;	24	private ordenandoByVendidos = true;
		25	private title: string = 'Búsqueda'
25		26
26	constructor(	27	constructor(
27	private productoService: ProductoService,	28	private productoService: ProductoService,
28	private router: Router) { }	29	private router: Router) { }
29		30
30	ngOnInit() {	31	ngOnInit() {
31		32
32	this.queMostrar = this.productoService.mostrar;	33	this.queMostrar = this.productoService.mostrar;
33		34
34	this.productoService.getCategorias()	35	this.productoService.getCategorias()
35	.subscribe((categorias: Categoria[]) => {	36	.subscribe((categorias: Categoria[]) => {
36		37
37	switch (this.queMostrar) {	38	switch (this.queMostrar) {
38	case 'todos':	39	case 'todos':
39	this.categorias = categorias;	40	this.categorias = categorias;
40	this.categoriaActive = 0;	41	this.categoriaActive = 0;
		42	this.title = 'Búsqueda';
41	break;	43	break;
42	case 'promociones':	44	case 'promociones':
43	this.categorias = categorias;	45	this.categorias = categorias;
44	this.categoriaActive = 1;	46	this.categoriaActive = 1;
45	break;	47	this.title = 'Promociones';
46	case 'ordenar':	48	break;
47		49	case 'ordenar':
48	this.categorias = categorias.filter((categoria: Categoria) => {	50
49	return categoria.ES_PEDIDO;	51	this.categorias = categorias.filter((categoria: Categoria) => {
50	});	52	return categoria.ES_PEDIDO;
51		53	});
52	this.categoriaActive = 0;	54
		55	this.categoriaActive = 0;
		56	this.title = 'Ordenar';
53		57
54	break;	58	break;
55	default:	59	default:
56	break;	60	break;
57	}	61	}
58		62
59	});	63	});
60		64
61	this.productoService.productoAcargar = undefined;	65	this.productoService.productoAcargar = undefined;
62	this.productoService.getAll()	66	this.productoService.getAll()
63	.subscribe((data: Producto[]) => {	67	.subscribe((data: Producto[]) => {
64		68
65	this.setProductosSinImagen(data);	69	this.setProductosSinImagen(data);
66		70
67	if (this.queMostrar == 'ordenar') {	71	if (this.queMostrar == 'ordenar') {
68		72
69	this.categorias.forEach((categoria: Categoria) => {	73	this.categorias.forEach((categoria: Categoria) => {
70		74
71	let tempProductos = data.filter((producto: Producto) => {	75	let tempProductos = data.filter((producto: Producto) => {
72	return producto.categoria_selfservice == categoria.id;	76	return producto.categoria_selfservice == categoria.id;
73	});	77	});
74		78
75	this.productos = this.productos.concat(tempProductos);	79	this.productos = this.productos.concat(tempProductos);
76		80
77	});	81	});
78	} else {	82	} else {
79	this.productos = data;	83	this.productos = data;
80	}	84	}
81	this.filterItems();	85	this.filterItems();
82	this.ordenar();	86	this.ordenar();
83	}, (error) => {	87	}, (error) => {
84	this.showSpinner = false;	88	this.showSpinner = false;
85	console.error(error);	89	console.error(error);
86	});	90	});
87	}	91	}
88		92
89	filterItems() {	93	filterItems() {
90		94
91	this.auxProductos = this.productos.filter(x => {	95	this.auxProductos = this.productos.filter(x => {
92	if (this.categoriaActive === 0) {	96	if (this.categoriaActive === 0) {
93	return x.DET_LAR.toLowerCase().includes(this.searchTerm.toLowerCase());	97	return x.DET_LAR.toLowerCase().includes(this.searchTerm.toLowerCase());
94	}	98	}
95	else {	99	else {
96	return x.DET_LAR.toLowerCase().includes(this.searchTerm.toLowerCase()) &&	100	return x.DET_LAR.toLowerCase().includes(this.searchTerm.toLowerCase()) &&
97	x.categoria_selfservice === this.categoriaActive;	101	x.categoria_selfservice === this.categoriaActive;
98	}	102	}
99	});	103	});
100		104
101	}	105	}
102		106
103	agregarAlCarrito(producto: Producto) {	107	agregarAlCarrito(producto: Producto) {
104		108
105	producto.cantidad = 1;	109	producto.cantidad = 1;
106	this.productoService.productos.push(producto);	110	this.productoService.productos.push(producto);
107	}	111	}
108		112
109	ordenar() {	113	ordenar() {
110		114
111	if (this.ordenandoByVendidos) {	115	if (this.ordenandoByVendidos) {
112		116
113	this.auxProductos.sort((a, b) => {	117	this.auxProductos.sort((a, b) => {
114	return b.cantidadVendida - a.cantidadVendida;	118	return b.cantidadVendida - a.cantidadVendida;
115	});	119	});
116	} else {	120	} else {
117	this.filterItems();	121	this.filterItems();
118	}	122	}
119		123
120	}	124	}
121		125
122	private elegirProducto(producto: Producto) {	126	private elegirProducto(producto: Producto) {
123		127
124	if (producto.PRO) {	128	if (producto.PRO) {
125		129
126	let imagenes = producto.imagenes;	130	let imagenes = producto.imagenes;
127	this.productoService.getPromocionByCodigos(producto.CodSec, producto.CodArt)	131	this.productoService.getPromocionByCodigos(producto.CodSec, producto.CodArt)
128	.subscribe(res => {	132	.subscribe(res => {
129		133
130	this.productoService.productoAcargar = res[0];	134	this.productoService.productoAcargar = res[0];
131	this.productoService.productoAcargar.imagenes = imagenes;	135	this.productoService.productoAcargar.imagenes = imagenes;
132	this.router.navigate(['inicio']);	136	this.router.navigate(['inicio']);
133	},	137	},
134	error => { console.error(error); }	138	error => { console.error(error); }
135	);	139	);
136	} else {	140	} else {
137		141
138	this.productoService.productoAcargar = producto;	142	this.productoService.productoAcargar = producto;
139	this.router.navigate(['inicio']);	143	this.router.navigate(['inicio']);
140	}	144	}
141		145
142	}	146	}
143		147
144	private setProductosSinImagen(productos: Producto[]) {	148	private setProductosSinImagen(productos: Producto[]) {
145		149
146	productos.forEach((producto: Producto) => {	150	productos.forEach((producto: Producto) => {
147	producto.imagenes = producto.imagenes.length == 0 ?	151	producto.imagenes = producto.imagenes.length == 0 ?
148	[{ imagen: 'noImage.jpg' }] : producto.imagenes;	152	[{ imagen: 'noImage.jpg' }] : producto.imagenes;
149	})	153	})
150	}	154	}
151	}	155	}
152		156

src/app/components/comanda/comanda.component.html

Diff comments View file @ 63cadda

File was created	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>
	38

src/app/components/comanda/comanda.component.scss

Diff comments View file @ 63cadda

File was created	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	}
	29

src/app/components/comanda/comanda.component.spec.ts

Diff comments View file @ 63cadda

File was created	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	});
	26

src/app/components/comanda/comanda.component.ts

Diff comments View file @ 63cadda

File was created	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	}
	20

src/app/services/producto.service.ts

Diff comments View file @ 63cadda

 import { Injectable } from '@angular/core';
 import { HttpClient } from '@angular/common/http';
 import { Observable } from 'rxjs';
 import { appSettings } from 'src/etc/AppSettings';
 import { Producto } from '../wrappers/producto';
 @Injectable({
   providedIn: 'root'
 })
 export class ProductoService {
   productos: Producto[] = [];
   productoAcargar: Producto;
   promoAcargar: Producto;
   mostrar: string;
   constructor(private http: HttpClient) { }
   getProductoById(id): Observable<any> {
     return this.http.get(`${appSettings.apiUrl}/articulos/${id}`);
   }
-  getAll(page: number = 1): Observable<any> {
+  getAll(): Observable<any> {
     return this.http.get(`${appSettings.apiUrl}/articulos/`);
   }
   getAllWithPaginator(page: number = 1): Observable<any> {
     return this.http.get(`${appSettings.apiUrl}/articulos/${page}`);
   }
   setProductos(producto: Producto) {
     for (let i = 0; i < this.productos.length; i++) {
       if (this.productos[i].id === producto.id) {
         if (producto.PRO) {
           if (this.promosIdenticas(this.productos[i], producto)) {
             this.productos[i].cantidad++;
             return;
           } else {
             break;
           }
         }
         this.productos[i].cantidad++;
         return;
       }
     }
     this.productos.push(producto);
   }
   getPromocionByCodigos(sector, codigo): Observable<any> {
     var url = `${appSettings.apiUrl}/promociones/by-codigos/${sector}/${codigo}`;
     // var url = `${appSettings.apiUrl}/promociones/by-codigos/${2}/${7}`;
     return this.http.get(url);
   }
   getPromociones(sector, codigo): Observable<any> {
     var url = `${appSettings.apiUrl}/promociones/incluir-articulo/${sector}/${codigo}`;
     // var url = `${appSettings.apiUrl}/promociones/incluir-articulo/${2}/${1306}`;
     return this.http.get(url);
   }
   getPromocionSinonimos(sector, codigo): Observable<any> {
     var url = `${appSettings.apiUrl}/sinonimos/promo/${sector}/${codigo}`;
     // var url = `${appSettings.apiUrl}/sinonimos/promo/${2}/${7}`;
     return this.http.get(url);
   }
-  saveInBase(body): Observable<any> {
-    return this.http.post(`${appSettings.apiUrl}/imagenes/guardar`, body);
-  }
-  deleteImage(body): Observable<any> {
-    return this.http.post(`${appSettings.apiUrl}/imagen/borrar`, body);
-  }
   getCategorias() {
     return this.http.get(`${appSettings.apiUrl}/categorias`);
   }
   pagar(medioPago: string) {
     return this.http.post(`${appSettings.apiUrl}/comprobante/guardar/${medioPago}`, {
       productos: this.productos
     });
   }
   private promosIdenticas(promoEnCarrito: Producto, promo: Producto) {
     var sonIdenticas = true;
     var productosPromoCarrito = promoEnCarrito.productos;
     var productosPromoAcargar = promo.productos;
     if (productosPromoCarrito.length !== productosPromoAcargar.length) {
       return false;
     }
     for (let i = 0; i < productosPromoCarrito.length; i++) {
       if (productosPromoCarrito[i].id !== productosPromoAcargar[i].id) {
         return false;
       }
     }
     return sonIdenticas;
   }
 }