Martin Macola / autoservicio

Browse Code »

Commit 5c153abaaa7f60beb56715051955db88c8046241

Authored by Eric Fernandez 2019-09-02 16:11:47 -0300

2 parents 62dcd06107 e83a1724e1

Exists in master

conflicts

Showing 22 changed files Show diff stats

angular.json

Diff comments View file @ 5c153ab

 {
   "$schema": "./node_modules/@angular/cli/lib/config/schema.json",
   "version": 1,
   "newProjectRoot": "projects",
   "projects": {
     "autoservicio": {
       "projectType": "application",
       "schematics": {
         "@schematics/angular:component": {
           "style": "scss"
         }
       },
       "root": "",
       "sourceRoot": "src",
       "prefix": "app",
       "architect": {
         "build": {
           "builder": "@angular-devkit/build-angular:browser",
           "options": {
             "outputPath": "dist/autoservicio",
             "index": "src/index.html",
             "main": "src/main.ts",
             "polyfills": "src/polyfills.ts",
             "tsConfig": "tsconfig.app.json",
             "assets": [
               "src/favicon.ico",
               "src/assets"
             ],
             "styles": [
               "./node_modules/bootstrap/dist/css/bootstrap.min.css",
               "./node_modules/font-awesome/css/font-awesome.min.css",
               "src/styles.scss"
             ],
             "scripts": [
               "./node_modules/jquery/dist/jquery.min.js",
               "./node_modules/popper.js/dist/umd/popper.min.js",
               "./node_modules/bootstrap/dist/js/bootstrap.min.js"
             ]
           },
           "configurations": {
             "production": {
               "fileReplacements": [
                 {
                   "replace": "src/environments/environment.ts",
                   "with": "src/environments/environment.prod.ts"
                 }
               ],
               "optimization": true,
               "outputHashing": "all",
               "sourceMap": false,
               "extractCss": true,
               "namedChunks": false,
               "aot": true,
               "extractLicenses": true,
               "vendorChunk": false,
               "buildOptimizer": true,
               "budgets": [
                 {
                   "type": "initial",
                   "maximumWarning": "2mb",
                   "maximumError": "5mb"
                 }
               ]
             }
           }
         },
         "serve": {
           "builder": "@angular-devkit/build-angular:dev-server",
           "options": {
             "browserTarget": "autoservicio:build"
           },
           "configurations": {
             "production": {
               "browserTarget": "autoservicio:build:production"
             }
           }
         },
         "extract-i18n": {
           "builder": "@angular-devkit/build-angular:extract-i18n",
           "options": {
             "browserTarget": "autoservicio:build"
           }
         },
         "test": {
           "builder": "@angular-devkit/build-angular:karma",
           "options": {
             "main": "src/test.ts",
             "polyfills": "src/polyfills.ts",
             "tsConfig": "tsconfig.spec.json",
             "karmaConfig": "karma.conf.js",
             "assets": [
               "src/favicon.ico",
               "src/assets"
             ],
             "styles": [
               "./node_modules/bootstrap/dist/css/bootstrap.min.css",
               "src/styles.scss"
             ],
-            "scripts": []
+            "scripts": [
+              "node_modules/jquery/dist/jquery.slim.min.js",
+              "node_modules/popper.js/dist/umd/popper.min.js",
+              "node_modules/bootstrap/dist/js/bootstrap.min.js"
+            ]
           }
         },
         "lint": {
           "builder": "@angular-devkit/build-angular:tslint",
           "options": {
             "tsConfig": [
               "tsconfig.app.json",
               "tsconfig.spec.json",
               "e2e/tsconfig.json"
             ],
             "exclude": [
               "**/node_modules/**"
             ]
           }
         },
         "e2e": {
           "builder": "@angular-devkit/build-angular:protractor",
           "options": {
             "protractorConfig": "e2e/protractor.conf.js",
             "devServerTarget": "autoservicio:serve"
           },
           "configurations": {
             "production": {
               "devServerTarget": "autoservicio:serve:production"
             }
           }
         }
       }
     }
   },
   "defaultProject": "autoservicio"
 }

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

Diff comments View file @ 5c153ab

1	<app-header></app-header>	1	<app-header></app-header>
2		2
3	<div class="container-fluid">	3	<div class="container-fluid">
4	<div class="row m-3">	4	<div class="row m-3">
5	<div class="col">	5	<div class="col">
6	<p class="h2">Configuración de imágenes</p>	6	<p class="h2">Configuración de imágenes</p>
7	</div>	7	</div>
8	</div>	8	</div>
9		9
10	<div class="row mx-3 search">	10	<div class="row mx-3 search">
11	<div class="col">	11	<div class="col">
12	<span class="fa fa-search form-control-lg form-control-search pl-3"></span>	12	<span class="fa fa-search form-control-lg form-control-search pl-3"></span>
13	<input	13	<input
14	type="text"	14	type="text"
15	class="form-control form-control-lg shadow-sm rounded-pill px-5"	15	class="form-control form-control-lg shadow-sm rounded-pill px-5"
16	placeholder="Búsqueda productos"	16	placeholder="Búsqueda productos"
17	[(ngModel)]="searchTerm"	17	[(ngModel)]="searchTerm"
18	(ngModelChange)="filterItems()">	18	(ngModelChange)="filterItems()">
19	</div>	19	</div>
20	</div>	20	</div>
21		21
22	<div class="row m-3 vh-60 overflow-scroll">	22	<div class="row m-3 vh-60 overflow-scroll">
23	<div class="col">	23	<div class="col">
24	<h5>Productos</h5>	24	<h5>Productos</h5>
25	<table class="table table-striped table-hover table-borderless shadow">	25	<table class="table table-striped table-hover table-borderless shadow">
26	<thead>	26	<thead>
27	<tr class="bg-primary text-center text-white shadow-sm">	27	<tr class="bg-primary text-center text-white shadow-sm">
28	<th>Nombre</th>	28	<th>Nombre</th>
29	<th colspan="2">Imagen</th>	29	<th colspan="2">Imagen</th>
30	</tr>	30	</tr>
31	</thead>	31	</thead>
32	<tbody>	32	<tbody>
33	<tr class="shadow-sm" *ngFor="let articulo of auxProductos">	33	<tr class="shadow-sm" *ngFor="let articulo of auxProductos">
34	<td class="align-middle">	34	<td class="align-middle">
35	<p class="m-0">{{articulo.DET_LAR}}</p>	35	<p class="m-0">{{articulo.DET_LAR}}</p>
36	<p class="m-0"><small>Descripción: {{articulo.DET_LAR}}</small></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>	37	<p class="m-0"><small>Sector: {{articulo.CodSec}}</small></p>
38	<p class="m-0"><small>Código: {{articulo.CodArt}}</small></p>	38	<p class="m-0"><small>Código: {{articulo.CodArt}}</small></p>
39	</td>	39	</td>
40	<td>	40	<td>
41	<img	41	<img
42	*ngIf="articulo.imagenes.length == 0"	42	*ngIf="articulo.imagenes.length == 0"
43	class="fade-in w-100 mx-auto img-fluid"	43	class="fade-in w-100 mx-auto img-fluid"
44	src="{{apiUrl}}/imagenes/noImage.jpg">	44	src="{{apiImagenes}}/imagenes/noImage.jpg">
45	<carousel [interval]="false">	45	<carousel [interval]="false">
46	<slide *ngFor="let item of articulo.imagenes; let index = index">	46	<slide *ngFor="let item of articulo.imagenes; let index = index">
47	<img	47	<img
48	*ngIf="!item.fromGallery"	48	*ngIf="!item.fromGallery"
49	class="fade-in img-fluid w-100"	49	class="fade-in img-fluid w-100"
50	src="{{apiUrl}}/imagenes/{{item.imagen}}">	50	src="{{apiImagenes}}/imagenes/{{item.imagen}}">
51	<img	51	<img
52	*ngIf="item.fromGallery"	52	*ngIf="item.fromGallery"
53	class="fade-in img-fluid w-100"	53	class="fade-in img-fluid w-100"
54	src="{{item.base64}}">	54	src="{{item.base64}}">
55	<button	55	<button
56	(click)="deleteImage(articulo.imagenes, index)"	56	(click)="deleteImage(articulo.imagenes, index)"
57	type="button"	57	type="button"
58	class="btn btn-light btn-delete-image position-absolute close">	58	class="btn btn-light btn-delete-image position-absolute close">
59	<span aria-hidden="true">×</span>	59	<span aria-hidden="true">×</span>
60	</button>	60	</button>
61	</slide>	61	</slide>
62	</carousel>	62	</carousel>
63	</td>	63	</td>
64	<td class="align-middle text-center">	64	<td class="align-middle text-center">
65	<div class="custom-file">	65	<div class="custom-file">
66	<input	66	<input
67	type="file"	67	type="file"
68	class="custom-file-input"	68	class="custom-file-input"
69	id="customFileLang"	69	id="customFileLang"
70	accept="image/*"	70	accept="image/*"
71	(change)="onFileSelected($event, articulo)"	71	(change)="onFileSelected($event, articulo)"
72	lang="es"	72	lang="es"
73	multiple>	73	multiple>
74	<label class="custom-file-label text-left pr-5" for="customFileLang">	74	<label class="custom-file-label text-left pr-5" for="customFileLang">
75	<small>Seleccionar archivo</small>	75	<small>Seleccionar archivo</small>
76	</label>	76	</label>
77	</div>	77	</div>
78	</td>	78	</td>
79	</tr>	79	</tr>
80	</tbody>	80	</tbody>
81	</table>	81	</table>
82	</div>	82	</div>
83	</div>	83	</div>
84		84
85	<div class="row" *ngIf="paginationData">	85	<div class="row" *ngIf="paginationData">
86	<div class="col">	86	<div class="col">
87	<pagination	87	<pagination
88	[rotate]="false"	88	[rotate]="false"
89	[(ngModel)]="paginationData.page"	89	[(ngModel)]="paginationData.page"
90	[totalItems]="paginationData.rowCount"	90	[totalItems]="paginationData.rowCount"
91	[maxSize]="paginationData.pageCount"	91	[maxSize]="paginationData.pageCount"
92	[itemsPerPage]="paginationData.pageSize"	92	[itemsPerPage]="paginationData.pageSize"
93	(pageChanged)="pageChanged($event)"	93	(pageChanged)="pageChanged($event)"
94	[boundaryLinks]="true"	94	[boundaryLinks]="true"
95	[disabled]="disabledPaginador"	95	[disabled]="disabledPaginador"
96	previousText="&lsaquo;"	96	previousText="&lsaquo;"
97	nextText="&rsaquo;"	97	nextText="&rsaquo;"
98	firstText="«"	98	firstText="«"
99	lastText="»"	99	lastText="»"
100	></pagination>	100	></pagination>
101	</div>	101	</div>
102	</div>	102	</div>
103		103
104	</div>	104	</div>
105		105

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

Diff comments View file @ 5c153ab

1	import { Component, OnInit } from '@angular/core';	1	import { Component, OnInit } from '@angular/core';
2	import { appSettings } from 'src/etc/AppSettings';	2	import { appSettings } from 'src/etc/AppSettings';
3	import { ProductoService } from 'src/app/services/producto.service';	3	import { ProductoService } from 'src/app/services/producto.service';
4	import { Producto } from 'src/app/wrappers/producto';	4	import { Producto } from 'src/app/wrappers/producto';
5	import { HttpClient } from '@angular/common/http';	5	import { HttpClient } from '@angular/common/http';
6		6
7	@Component({	7	@Component({
8	selector: 'app-amb-imagenes',	8	selector: 'app-amb-imagenes',
9	templateUrl: './amb-imagenes.component.html',	9	templateUrl: './amb-imagenes.component.html',
10	styleUrls: ['./amb-imagenes.component.scss']	10	styleUrls: ['./amb-imagenes.component.scss']
11	})	11	})
12		12
13	export class AmbImagenesComponent implements OnInit {	13	export class AmbImagenesComponent implements OnInit {
14		14
15	apiUrl = appSettings.apiUrl;	15	apiUrl = appSettings.apiImagenes;
16	articulos: Producto[] = [];	16	articulos: Producto[] = [];
17	private auxProductos: Producto[] = [];	17	private auxProductos: Producto[] = [];
18	private searchTerm: string = '';	18	private searchTerm: string = '';
19	private paginationData: any;	19	private paginationData: any;
20	private disabledPaginador: boolean = false;	20	private disabledPaginador: boolean = false;
21		21
22	constructor(private productoService: ProductoService, private http: HttpClient) { }	22	constructor(private productoService: ProductoService, private http: HttpClient) { }
23		23
24	ngOnInit() {	24	ngOnInit() {
25		25
26	this.productoService.getAllWithPaginator()	26	this.productoService.getAllWithPaginator()
27	.subscribe((res) => {	27	.subscribe((res) => {
28		28
29	this.articulos = res.data;	29	this.articulos = res.data;
30	this.paginationData = res.pagination;	30	this.paginationData = res.pagination;
31	this.filterItems();	31	this.filterItems();
32	}, error => console.error(error));	32	}, error => console.error(error));
33	}	33	}
34		34
35	onFileSelected(event, articulo: Producto) {	35	onFileSelected(event, articulo: Producto) {
36		36
37	let auxFiles: FileList = event.target.files;	37	let auxFiles: FileList = event.target.files;
38	Array.from(auxFiles).forEach(file => {	38	Array.from(auxFiles).forEach(file => {
39		39
40	this.onLoad(file)	40	this.onLoad(file)
41	.then(result => {	41	.then(result => {
42	// articulo.imagenes.push({	42	// articulo.imagenes.push({
43	// name: file.name + articulo.CodArt + articulo.CodSec,	43	// name: file.name + articulo.CodArt + articulo.CodSec,
44	// fromGallery: true,	44	// fromGallery: true,
45	// imagen: result,	45	// imagen: result,
46	// id_articulo: articulo.id	46	// id_articulo: articulo.id
47	// });	47	// });
48	let imagenAguardar = {	48	let imagenAguardar = {
49	imagen: {	49	imagen: {
50	name: `${articulo.CodSec}${articulo.CodArt}${file.name}`,	50	name: `${articulo.CodSec}${articulo.CodArt}${file.name}`,
51	base64: result,	51	base64: result,
52	codigo: articulo.CodArt,	52	codigo: articulo.CodArt,
53	sector: articulo.CodSec,	53	sector: articulo.CodSec,
54	id_articulo: articulo.id	54	id_articulo: articulo.id
55	},	55	},
56	articulo: articulo	56	articulo: articulo
57	};	57	};
58	this.saveInBase(imagenAguardar);	58	this.saveInBase(imagenAguardar);
59	});	59	});
60	})	60	})
61	}	61	}
62		62
63	filterItems() {	63	filterItems() {
64		64
65	this.auxProductos = this.articulos.filter(x => {	65	this.auxProductos = this.articulos.filter(x => {
66	return x.DET_LAR.toLowerCase().includes(this.searchTerm.toLowerCase()) \|\|	66	return x.DET_LAR.toLowerCase().includes(this.searchTerm.toLowerCase()) \|\|
67	x.CodArt.toString().includes(this.searchTerm.toLowerCase()) \|\|	67	x.CodArt.toString().includes(this.searchTerm.toLowerCase()) \|\|
68	x.CodSec.toString().includes(this.searchTerm.toLowerCase());	68	x.CodSec.toString().includes(this.searchTerm.toLowerCase());
69	});	69	});
70	}	70	}
71		71
72	saveInBase(imagenAguardar) {	72	saveInBase(imagenAguardar) {
73		73
74	this.productoService.saveInBase(imagenAguardar.imagen)	74	this.productoService.saveInBase(imagenAguardar.imagen)
75	.subscribe(res => {	75	.subscribe(res => {
76	imagenAguardar.imagen['id'] = res[0];	76	imagenAguardar.imagen['id'] = res[0];
77	imagenAguardar.imagen['fromGallery'] = true;	77	imagenAguardar.imagen['fromGallery'] = true;
78	imagenAguardar.articulo.imagenes.push(imagenAguardar.imagen);	78	imagenAguardar.articulo.imagenes.push(imagenAguardar.imagen);
79	}, error => console.error(error));	79	}, error => console.error(error));
80	}	80	}
81		81
82	onLoad(file) {	82	onLoad(file) {
83		83
84	return new Promise((resolve, reject) => {	84	return new Promise((resolve, reject) => {
85		85
86	var fr = new FileReader();	86	var fr = new FileReader();
87		87
88	fr.onload = function () {	88	fr.onload = function () {
89		89
90	resolve(fr.result);	90	resolve(fr.result);
91	};	91	};
92		92
93	fr.readAsDataURL(file);	93	fr.readAsDataURL(file);
94	});	94	});
95		95
96	}	96	}
97		97
98	deleteImage(imagenes, index: number) {	98	deleteImage(imagenes, index: number) {
99		99
100	if (!imagenes[index].name) {	100	if (!imagenes[index].name) {
101	imagenes[index].name = imagenes[index].imagen;	101	imagenes[index].name = imagenes[index].imagen;
102	}	102	}
103		103
104	this.productoService.deleteImage(imagenes[index])	104	this.productoService.deleteImage(imagenes[index])
105	.subscribe(res => {	105	.subscribe(res => {
106		106
107	if (res) {	107	if (res) {
108	imagenes.splice(index, 1);	108	imagenes.splice(index, 1);
109	}	109	}
110	}, error => console.error(error));	110	}, error => console.error(error));
111	}	111	}
112		112
113	pageChanged(event: any): void {	113	pageChanged(event: any): void {
114	this.disabledPaginador = true;	114	this.disabledPaginador = true;
115	this.productoService.getAllWithPaginator(event.page)	115	this.productoService.getAllWithPaginator(event.page)
116	.subscribe((res) => {	116	.subscribe((res) => {
117	this.disabledPaginador = false;	117	this.disabledPaginador = false;
118	this.articulos = res.data;	118	this.articulos = res.data;
119	this.paginationData = res.pagination;	119	this.paginationData = res.pagination;
120	this.filterItems();	120	this.filterItems();
121	}, error => console.error(error));	121	}, error => console.error(error));
122	}	122	}
123		123
124	}	124	}
125		125

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

Diff comments View file @ 5c153ab

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	Búsqueda
9	<i class="fa fa-search"></i>	9	<i 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="{{apiUrl}}/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 @ 5c153ab

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 = 'todo';
21	private apiUrl: string = appSettings.apiUrl;	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		25
26	constructor(	26	constructor(
27	private productoService: ProductoService,	27	private productoService: ProductoService,
28	private router: Router) { }	28	private router: Router) { }
29		29
30	ngOnInit() {	30	ngOnInit() {
31		31
32	this.queMostrar = this.productoService.mostrar;	32	this.queMostrar = this.productoService.mostrar;
33		33
34	this.productoService.getCategorias()	34	this.productoService.getCategorias()
35	.subscribe((categorias: Categoria[]) => {	35	.subscribe((categorias: Categoria[]) => {
36		36
37	switch (this.queMostrar) {	37	switch (this.queMostrar) {
38	case 'todos':	38	case 'todos':
39	this.categorias = categorias;	39	this.categorias = categorias;
40	this.categoriaActive = 0;	40	this.categoriaActive = 0;
41	break;	41	break;
42	case 'promociones':	42	case 'promociones':
43	this.categorias = categorias;	43	this.categorias = categorias;
44	this.categoriaActive = 1;	44	this.categoriaActive = 1;
45	break;	45	break;
46	case 'ordenar':	46	case 'ordenar':
47		47
48	this.categorias = categorias.filter((categoria: Categoria) => {	48	this.categorias = categorias.filter((categoria: Categoria) => {
49	return categoria.ES_PEDIDO;	49	return categoria.ES_PEDIDO;
50	});	50	});
51		51
52	this.categoriaActive = 0;	52	this.categoriaActive = 0;
53		53
54	break;	54	break;
55	default:	55	default:
56	break;	56	break;
57	}	57	}
58		58
59	});	59	});
60		60
61	this.productoService.productoAcargar = undefined;	61	this.productoService.productoAcargar = undefined;
62	this.productoService.getAll()	62	this.productoService.getAll()
63	.subscribe((data: Producto[]) => {	63	.subscribe((data: Producto[]) => {
64		64
65	this.setProductosSinImagen(data);	65	this.setProductosSinImagen(data);
66		66
67	if (this.queMostrar == 'ordenar') {	67	if (this.queMostrar == 'ordenar') {
68		68
69	this.categorias.forEach((categoria: Categoria) => {	69	this.categorias.forEach((categoria: Categoria) => {
70		70
71	let tempProductos = data.filter((producto: Producto) => {	71	let tempProductos = data.filter((producto: Producto) => {
72	return producto.categoria_selfservice == categoria.id;	72	return producto.categoria_selfservice == categoria.id;
73	});	73	});
74		74
75	this.productos = this.productos.concat(tempProductos);	75	this.productos = this.productos.concat(tempProductos);
76		76
77	});	77	});
78	} else {	78	} else {
79	this.productos = data;	79	this.productos = data;
80	}	80	}
81	this.filterItems();	81	this.filterItems();
82	this.ordenar();	82	this.ordenar();
83	}, (error) => {	83	}, (error) => {
84	this.showSpinner = false;	84	this.showSpinner = false;
85	console.error(error);	85	console.error(error);
86	});	86	});
87	}	87	}
88		88
89	filterItems() {	89	filterItems() {
90		90
91	this.auxProductos = this.productos.filter(x => {	91	this.auxProductos = this.productos.filter(x => {
92	if (this.categoriaActive === 0) {	92	if (this.categoriaActive === 0) {
93	return x.DET_LAR.toLowerCase().includes(this.searchTerm.toLowerCase());	93	return x.DET_LAR.toLowerCase().includes(this.searchTerm.toLowerCase());
94	}	94	}
95	else {	95	else {
96	return x.DET_LAR.toLowerCase().includes(this.searchTerm.toLowerCase()) &&	96	return x.DET_LAR.toLowerCase().includes(this.searchTerm.toLowerCase()) &&
97	x.categoria_selfservice === this.categoriaActive;	97	x.categoria_selfservice === this.categoriaActive;
98	}	98	}
99	});	99	});
100		100
101	}	101	}
102		102
103	agregarAlCarrito(producto: Producto) {	103	agregarAlCarrito(producto: Producto) {
104		104
105	producto.cantidad = 1;	105	producto.cantidad = 1;
106	this.productoService.productos.push(producto);	106	this.productoService.productos.push(producto);
107	}	107	}
108		108
109	ordenar() {	109	ordenar() {
110		110
111	if (this.ordenandoByVendidos) {	111	if (this.ordenandoByVendidos) {
112		112
113	this.auxProductos.sort((a, b) => {	113	this.auxProductos.sort((a, b) => {
114	return b.cantidadVendida - a.cantidadVendida;	114	return b.cantidadVendida - a.cantidadVendida;
115	});	115	});
116	} else {	116	} else {
117	this.filterItems();	117	this.filterItems();
118	}	118	}
119		119
120	}	120	}
121		121
122	private elegirProducto(producto: Producto) {	122	private elegirProducto(producto: Producto) {
123		123
124	if (producto.PRO) {	124	if (producto.PRO) {
125		125
126	let imagenes = producto.imagenes;	126	let imagenes = producto.imagenes;
127	this.productoService.getPromocionByCodigos(producto.CodSec, producto.CodArt)	127	this.productoService.getPromocionByCodigos(producto.CodSec, producto.CodArt)
128	.subscribe(res => {	128	.subscribe(res => {
129		129
130	this.productoService.productoAcargar = res[0];	130	this.productoService.productoAcargar = res[0];
131	this.productoService.productoAcargar.imagenes = imagenes;	131	this.productoService.productoAcargar.imagenes = imagenes;
132	this.router.navigate(['inicio']);	132	this.router.navigate(['inicio']);
133	},	133	},
134	error => { console.error(error); }	134	error => { console.error(error); }
135	);	135	);
136	} else {	136	} else {
137		137
138	this.productoService.productoAcargar = producto;	138	this.productoService.productoAcargar = producto;
139	this.router.navigate(['inicio']);	139	this.router.navigate(['inicio']);
140	}	140	}
141		141
142	}	142	}
143		143
144	private setProductosSinImagen(productos: Producto[]) {	144	private setProductosSinImagen(productos: Producto[]) {
145		145
146	productos.forEach((producto: Producto) => {	146	productos.forEach((producto: Producto) => {
147	producto.imagenes = producto.imagenes.length == 0 ?	147	producto.imagenes = producto.imagenes.length == 0 ?
148	[{ imagen: 'noImage.jpg' }] : producto.imagenes;	148	[{ imagen: 'noImage.jpg' }] : producto.imagenes;
149	})	149	})
150	}	150	}
151	}	151	}
152		152

src/app/components/cancelar-compra/cancelar-compra.component.html

Diff comments View file @ 5c153ab

1	<div class="container-fluid fade-in p-0 disable-user-select">	1	<div class="container-fluid fade-in p-0 disable-user-select">
2		2
3	<!-- INFO -->	3	<!-- INFO -->
4	<div class="row vh-100 py-5 m-0 w-100 bg-primary-gradient-horizontal">	4	<div class="row vh-100 py-5 m-0 w-100 bg-primary-gradient-horizontal">
5	<div class="col-4 offset-1">	5	<div class="col-4 offset-1">
6	<div class="row h-100">	6	<div class="row h-100">
7	<div class="col-12 my-auto">	7	<div class="col-12 my-auto">
8	<div class="card rounded">	8	<div class="card rounded">
9	<img src="{{apiUrl}}/imagenes/atencion.svg" class="w-50 mx-auto mt-5 mb-4">	9	<img src="{{apiImagenes}}/imagenes/atencion.svg" class="w-50 mx-auto mt-5 mb-4">
10	<div class="mb-5 mt-4">	10	<div class="mb-5 mt-4">
11	<p class="display-3 card-text text-center font-weight-bold">	11	<p class="display-3 card-text text-center font-weight-bold">
12	Atención	12	Atención
13	</p>	13	</p>
14	</div>	14	</div>
15	</div>	15	</div>
16	</div>	16	</div>
17	</div>	17	</div>
18	</div>	18	</div>
19	<div class="col-6 text-center text-white my-auto">	19	<div class="col-6 text-center text-white my-auto">
20	<p class="display-3 font-weight-bold mb-5">	20	<p class="display-3 font-weight-bold mb-5">
21	¿Desea Cancelar su compra?	21	¿Desea Cancelar su compra?
22	</p>	22	</p>
23	<div class="d-flex justify-content-center mt-2">	23	<div class="d-flex justify-content-center mt-2">
24	<button type="button" class="btn btn-lg btn-light shadow mr-4" (click)="volverPreviousPage()">	24	<button type="button" class="btn btn-lg btn-light shadow mr-4" (click)="volverPreviousPage()">
25	<span class="pr-2">Continuar con mi compra</span>	25	<span class="pr-2">Continuar con mi compra</span>
26	<i class="fa fa-undo text-warning"></i>	26	<i class="fa fa-undo text-warning"></i>
27	</button>	27	</button>
28	<button type="button" class="btn btn-lg btn-light shadow ml-4" (click)="limpiarCarritoYvolver()">	28	<button type="button" class="btn btn-lg btn-light shadow ml-4" (click)="limpiarCarritoYvolver()">
29	<span class="pr-2">Si, Cancelar</span>	29	<span class="pr-2">Si, Cancelar</span>
30	<i class="fa fa-times text-danger"></i>	30	<i class="fa fa-times text-danger"></i>
31	</button>	31	</button>
32	</div>	32	</div>
33	</div>	33	</div>
34	</div>	34	</div>
35		35
36	</div>	36	</div>
37		37

src/app/components/cancelar-compra/cancelar-compra.component.ts

Diff comments View file @ 5c153ab

1	import { Component, OnInit, OnDestroy } from '@angular/core';	1	import { Component, OnInit, OnDestroy } from '@angular/core';
2	import { appSettings } from 'src/etc/AppSettings';	2	import { appSettings } from 'src/etc/AppSettings';
3	import { Location } from '@angular/common';	3	import { Location } from '@angular/common';
4	import { Router } from '@angular/router';	4	import { Router } from '@angular/router';
5	import { ProductoService } from 'src/app/services/producto.service';	5	import { ProductoService } from 'src/app/services/producto.service';
6		6
7	@Component({	7	@Component({
8	selector: 'app-cancelar-compra',	8	selector: 'app-cancelar-compra',
9	templateUrl: './cancelar-compra.component.html',	9	templateUrl: './cancelar-compra.component.html',
10	styleUrls: ['./cancelar-compra.component.scss']	10	styleUrls: ['./cancelar-compra.component.scss']
11	})	11	})
12	export class CancelarCompraComponent implements OnInit, OnDestroy {	12	export class CancelarCompraComponent implements OnInit, OnDestroy {
13		13
14	private apiUrl: string = appSettings.apiUrl;	14	private apiImagenes: string = appSettings.apiImagenes;
15	private timer: any;	15	private timer: any;
16		16
17	constructor(	17	constructor(
18	private location: Location,	18	private location: Location,
19	private router: Router,	19	private router: Router,
20	private productoService: ProductoService	20	private productoService: ProductoService
21	) { }	21	) { }
22		22
23	ngOnInit() {	23	ngOnInit() {
24		24
25	this.timer = setTimeout(() => {	25	this.timer = setTimeout(() => {
26	this.limpiarCarritoYvolver();	26	this.limpiarCarritoYvolver();
27	}, 30000)	27	}, 30000)
28	}	28	}
29		29
30	ngOnDestroy() {	30	ngOnDestroy() {
31		31
32	clearTimeout(this.timer);	32	clearTimeout(this.timer);
33	}	33	}
34		34
35	volverPreviousPage() {	35	volverPreviousPage() {
36		36
37	this.location.back();	37	this.location.back();
38	}	38	}
39		39
40	limpiarCarritoYvolver() {	40	limpiarCarritoYvolver() {
41		41
42	this.productoService.productoAcargar = undefined;	42	this.productoService.productoAcargar = undefined;
43	this.productoService.promoAcargar = undefined;	43	this.productoService.promoAcargar = undefined;
44	this.productoService.productos = [];	44	this.productoService.productos = [];
45	this.router.navigate(['/home']);	45	this.router.navigate(['/home']);
46	}	46	}
47		47
48	}	48	}
49		49

src/app/components/confirmacion-carrito/confirmacion-carrito.component.html

Diff comments View file @ 5c153ab

1	<div	1	<div
2	class="row m-0 fade-in bg-primary-gradient disable-user-select"	2	class="row m-0 fade-in bg-primary-gradient disable-user-select"
3	(click)="reiniciarTimer">	3	(click)="reiniciarTimer">
4	<div class="col-12 p-0 vh-100">	4	<div class="col-12 p-0 vh-100">
5		5
6	<!-- TOP HEADER -->	6	<!-- TOP HEADER -->
7	<app-header></app-header>	7	<app-header></app-header>
8		8
9	<!-- NOMBRE DE SECCION -->	9	<!-- NOMBRE DE SECCION -->
10	<div class="row m-0">	10	<div class="row m-0">
11	<div class="col-12 p-0">	11	<div class="col-12 p-0">
12	<p class="h5 py-1 bg-gray text-muted text-center m-0">	12	<p class="h5 py-1 bg-gray text-muted text-center m-0">
13	Pagar	13	Pagar
14	<i class="fa fa-usd"></i>	14	<i class="fa fa-usd"></i>
15	</p>	15	</p>
16	</div>	16	</div>
17	</div>	17	</div>
18		18
19	<div class="row m-0">	19	<div class="row m-0">
20	<div class="col-12">	20	<div class="col-12">
21		21
22	<!-- TEXTO DE IZQUIERDA -->	22	<!-- TEXTO DE IZQUIERDA -->
23	<div class="row mx-2 mt-4 text-white">	23	<div class="row mx-2 mt-4 text-white">
24	<div class="col-sm-auto my-auto">	24	<div class="col-sm-auto my-auto">
25	<p class="h2">Mi Compra	25	<p class="h2">Mi Compra
26	<i class="fa fa-shopping-cart "></i>	26	<i class="fa fa-shopping-cart "></i>
27	</p>	27	</p>
28	</div>	28	</div>
29	<div class="col-sm-7 my-auto">	29	<div class="col-sm-7 my-auto">
30	<p class="h4">Por favor, controle y confirme su compra.</p>	30	<p class="h4">Por favor, controle y confirme su compra.</p>
31	</div>	31	</div>
32	</div>	32	</div>
33		33
34	<div class="row">	34	<div class="row">
35	<!-- GRILLA DE PRODUCTOS DE MI COMPRA -->	35	<!-- GRILLA DE PRODUCTOS DE MI COMPRA -->
36	<div class="col-sm-7">	36	<div class="col-sm-7">
37	<div class="row ml-4 pr-3 vh-70 overflow-scroll text-dark">	37	<div class="row ml-4 pr-3 vh-70 overflow-scroll text-dark">
38	<div class="col-4 p-2" *ngFor="let producto of productos">	38	<div class="col-4 p-2" *ngFor="let producto of productos">
39	<div class="bg-white rounded-sm shadow border-0">	39	<div class="bg-white rounded-sm shadow border-0">
40	<img	40	<img
41	src="{{apiUrl}}/imagenes/{{producto.imagenes[0].imagen}}"	41	src="{{apiImagenes}}/imagenes/{{producto.imagenes[0].imagen}}"
42	class="shadow rounded-sm w-100 m-auto">	42	class="shadow rounded-sm w-100 m-auto">
43	<div class="p-2">	43	<div class="p-2">
44	<p class="h6 min-h-55 text-left m-0">	44	<p class="h6 min-h-55 text-left m-0">
45	<small>	45	<small>
46	{{producto.DET_LAR}}	46	{{producto.DET_LAR}}
47	</small>	47	</small>
48	</p>	48	</p>
49	<div class="row m-0">	49	<div class="row m-0">
50	<div class="col-12 my-auto pt-2 pr-2 p-0">	50	<div class="col-12 my-auto pt-2 pr-2 p-0">
51	<p class="text-right m-0 h6">	51	<p class="text-right m-0 h6">
52	{{producto.PreVen \| currency}}	52	{{producto.PreVen \| currency}}
53	</p>	53	</p>
54	</div>	54	</div>
55	</div>	55	</div>
56	</div>	56	</div>
57	</div>	57	</div>
58	</div>	58	</div>
59	</div>	59	</div>
60	</div>	60	</div>
61		61
62	<div class="col-sm-5 pl-0">	62	<div class="col-sm-5 pl-0">
63	<div class="row ml-3">	63	<div class="row ml-3">
64	<!-- TICKET -->	64	<!-- TICKET -->
65	<div class="col-sm-7 p-0">	65	<div class="col-sm-7 p-0">
66	<div class="card rounded-sm shadow">	66	<div class="card rounded-sm shadow">
67	<div class="card-body">	67	<div class="card-body">
68	<p class="h5 card-title">Su Ticket</p>	68	<p class="h5 card-title">Su Ticket</p>
69	<div class="row mt-4 m-0">	69	<div class="row mt-4 m-0">
70	<div class="col-12 p-0 mb-2">	70	<div class="col-12 p-0 mb-2">
71	<p class="h6 m-0 card-text text-left">	71	<p class="h6 m-0 card-text text-left">
72	<small class="font-weight-bold">DESCRIPCIÓN</small>	72	<small class="font-weight-bold">DESCRIPCIÓN</small>
73	</p>	73	</p>
74	<p class="h6 m-0 card-text text-left">	74	<p class="h6 m-0 card-text text-left">
75	<small class="font-weight-bold">CANTIDAD X PRECIO UNITARIO</small>	75	<small class="font-weight-bold">CANTIDAD X PRECIO UNITARIO</small>
76	</p>	76	</p>
77	</div>	77	</div>
78	</div>	78	</div>
79	<div class="row vh-50 px-2 overflow-scroll m-0">	79	<div class="row vh-50 px-2 overflow-scroll m-0">
80	<div class="col-12 p-0 mb-2" *ngFor="let producto of productos">	80	<div class="col-12 p-0 mb-2" *ngFor="let producto of productos">
81	<p class="h6 m-0 card-text text-left">	81	<p class="h6 m-0 card-text text-left">
82	<small>{{producto.DET_LAR}}</small>	82	<small>{{producto.DET_LAR}}</small>
83	</p>	83	</p>
84	<div class="row d-flex justify-content-between m-0">	84	<div class="row d-flex justify-content-between m-0">
85	<div class="col p-0">	85	<div class="col p-0">
86	<p class="h6 m-0 card-text text-left">	86	<p class="h6 m-0 card-text text-left">
87	<small>{{producto.cantidad}} x {{producto.PreVen \| currency}}</small>	87	<small>{{producto.cantidad}} x {{producto.PreVen \| currency}}</small>
88	</p>	88	</p>
89	</div>	89	</div>
90	<div class="col p-0">	90	<div class="col p-0">
91	<p class="h6 m-0 card-text text-right">	91	<p class="h6 m-0 card-text text-right">
92	<small>{{(producto.PreVen) * (producto.cantidad) \| currency}}</small>	92	<small>{{(producto.PreVen) * (producto.cantidad) \| currency}}</small>
93	</p>	93	</p>
94	</div>	94	</div>
95	</div>	95	</div>
96	</div>	96	</div>
97	</div>	97	</div>
98	<p class="h4 font-weight-bold card-text text-right mt-3 mb-0">	98	<p class="h4 font-weight-bold card-text text-right mt-3 mb-0">
99	Total {{getTotal() \| currency}}	99	Total {{getTotal() \| currency}}
100	</p>	100	</p>
101	</div>	101	</div>
102	</div>	102	</div>
103	</div>	103	</div>
104	</div>	104	</div>
105	</div>	105	</div>
106	</div>	106	</div>
107		107
108	<!-- OPCIONES ABAJO DERECHA -->	108	<!-- OPCIONES ABAJO DERECHA -->
109	<div class="row m-0 fixed-bottom">	109	<div class="row m-0 fixed-bottom">
110	<div class="col-sm-2 offset-sm-10 p-0 mt-auto">	110	<div class="col-sm-2 offset-sm-10 p-0 mt-auto">
111	<div class="card m-2 rounded-top-sm mt-auto blue-gradient border-0">	111	<div class="card m-2 rounded-top-sm mt-auto blue-gradient border-0">
112	<div class="card-body row m-0">	112	<div class="card-body row m-0">
113	<div class="col-12 p-3">	113	<div class="col-12 p-3">
114	<button	114	<button
115	type="button"	115	type="button"
116	class="btn btn-block btn-light shadow btn-sm shadow"	116	class="btn btn-block btn-light shadow btn-sm shadow"
117	(click)="volverPreviousPage()">	117	(click)="volverPreviousPage()">
118	<span class="pr-2">Volver</span>	118	<span class="pr-2">Volver</span>
119	<i class="fa fa-undo text-warning"></i>	119	<i class="fa fa-undo text-warning"></i>
120	</button>	120	</button>
121	<button [routerLink]="['/pago']" type="button" class="btn btn-block btn-light btn-lg shadow mb-2 p-1">	121	<button [routerLink]="['/pago']" type="button" class="btn btn-block btn-light btn-lg shadow mb-2 p-1">
122	<span class="font-weight-bold pr-2">Finalizar y Pagar</span>	122	<span class="font-weight-bold pr-2">Finalizar y Pagar</span>
123	<i class="fa fa-check text-success"></i>	123	<i class="fa fa-check text-success"></i>
124	</button>	124	</button>
125	<button	125	<button
126	type="button"	126	type="button"
127	class="btn btn-block btn-light shadow btn-sm shadow"	127	class="btn btn-block btn-light shadow btn-sm shadow"
128	[routerLink]="['/cancelar-compra']">	128	[routerLink]="['/cancelar-compra']">
129	<span class="pr-2">Cancelar</span>	129	<span class="pr-2">Cancelar</span>
130	<i class="fa fa-times text-danger"></i>	130	<i class="fa fa-times text-danger"></i>
131	</button>	131	</button>
132	</div>	132	</div>
133	</div>	133	</div>
134	</div>	134	</div>
135	</div>	135	</div>
136	</div>	136	</div>
137		137
138	</div>	138	</div>
139	</div>	139	</div>
140		140
141	</div>	141	</div>
142		142
143	</div>	143	</div>
144		144

src/app/components/confirmacion-carrito/confirmacion-carrito.component.ts

Diff comments View file @ 5c153ab

1	import { Component, OnInit, OnDestroy } from '@angular/core';	1	import { Component, OnInit, OnDestroy } from '@angular/core';
2	import { appSettings } from 'src/etc/AppSettings';	2	import { appSettings } from 'src/etc/AppSettings';
3	import { Location } from '@angular/common';	3	import { Location } from '@angular/common';
4	import { ProductoService } from 'src/app/services/producto.service';	4	import { ProductoService } from 'src/app/services/producto.service';
5	import { Producto } from 'src/app/wrappers/producto';	5	import { Producto } from 'src/app/wrappers/producto';
6	import { Router } from '@angular/router';	6	import { Router } from '@angular/router';
7		7
8	@Component({	8	@Component({
9	selector: 'app-confirmacion-carrito',	9	selector: 'app-confirmacion-carrito',
10	templateUrl: './confirmacion-carrito.component.html',	10	templateUrl: './confirmacion-carrito.component.html',
11	styleUrls: ['./confirmacion-carrito.component.scss']	11	styleUrls: ['./confirmacion-carrito.component.scss']
12	})	12	})
13	export class ConfirmacionCarritoComponent implements OnInit, OnDestroy {	13	export class ConfirmacionCarritoComponent implements OnInit, OnDestroy {
14		14
15	private productos: Producto[] = [];	15	private productos: Producto[] = [];
16	private total: number = 0;	16	private total: number = 0;
17	private apiUrl: string = appSettings.apiUrl;	17	private apiImagenes: string = appSettings.apiImagenes;
18	private timerReposo: any;	18	private timerReposo: any;
19		19
20	constructor(	20	constructor(
21	private location: Location,	21	private location: Location,
22	private productoService: ProductoService,	22	private productoService: ProductoService,
23	private router: Router	23	private router: Router
24	) { }	24	) { }
25		25
26	ngOnInit() {	26	ngOnInit() {
27		27
28	this.timerReposo = setTimeout(() => {	28	this.timerReposo = setTimeout(() => {
29		29
30	this.router.navigate(['cancelar-compra']);	30	this.router.navigate(['cancelar-compra']);
31	}, 90000)	31	}, 90000)
32	this.productos = this.productoService.productos;	32	this.productos = this.productoService.productos;
33	}	33	}
34		34
35	ngOnDestroy() {	35	ngOnDestroy() {
36		36
37	clearTimeout(this.timerReposo);	37	clearTimeout(this.timerReposo);
38	}	38	}
39		39
40	volverPreviousPage() {	40	volverPreviousPage() {
41		41
42	this.location.back();	42	this.location.back();
43	}	43	}
44		44
45	getTotal() {	45	getTotal() {
46		46
47	var subTotal = 0;	47	var subTotal = 0;
48	this.productos.forEach(producto => {	48	this.productos.forEach(producto => {
49		49
50	subTotal = subTotal + (producto.PreVen * producto.cantidad);	50	subTotal = subTotal + (producto.PreVen * producto.cantidad);
51	});	51	});
52	return this.total = subTotal;	52	return this.total = subTotal;
53	}	53	}
54		54
55	reiniciarTimer() {	55	reiniciarTimer() {
56		56
57	clearTimeout(this.timerReposo);	57	clearTimeout(this.timerReposo);
58	this.timerReposo = setTimeout(() => {	58	this.timerReposo = setTimeout(() => {
59		59
60	this.router.navigate(['cancelar-compra']);	60	this.router.navigate(['cancelar-compra']);
61	}, 90000)	61	}, 90000)
62	}	62	}
63		63
64	}	64	}
65		65

src/app/components/header/header.component.html

Diff comments View file @ 5c153ab

1	<div class="row m-0 bg-light p-4 justify-content-between">	1	<div class="row m-0 bg-light p-4 justify-content-between">
2	<div class="col-6">	2	<div class="col-6">
3	<img class="w-25 float-left" src="{{apiUrl}}/imagenes/logoempresa.png">	3	<img class="w-25 float-left" src="{{apiImagenes}}/imagenes/logoempresa.png">
4	</div>	4	</div>
5	<div class="col-6">	5	<div class="col-6">
6	<img class="w-25 float-right" src="{{apiUrl}}/imagenes/logodebo.png">	6	<img class="w-25 float-right" src="{{apiImagenes}}/imagenes/logodebo.png">
7	</div>	7	</div>
8	</div>	8	</div>
9		9

src/app/components/header/header.component.ts

Diff comments View file @ 5c153ab

1	import { Component, OnInit } from '@angular/core';	1	import { Component, OnInit } from '@angular/core';
2	import { appSettings } from 'src/etc/AppSettings';	2	import { appSettings } from 'src/etc/AppSettings';
3		3
4	@Component({	4	@Component({
5	selector: 'app-header',	5	selector: 'app-header',
6	templateUrl: './header.component.html',	6	templateUrl: './header.component.html',
7	styleUrls: ['./header.component.scss']	7	styleUrls: ['./header.component.scss']
8	})	8	})
9	export class HeaderComponent implements OnInit {	9	export class HeaderComponent implements OnInit {
10		10
11	private apiUrl : string = appSettings.apiUrl;	11	private apiImagenes : string = appSettings.apiImagenes;
12		12
13	constructor() { }	13	constructor() { }
14		14
15	ngOnInit() {	15	ngOnInit() {
16	}	16	}
17		17
18	}	18	}
19		19

src/app/components/home/home.component.html

Diff comments View file @ 5c153ab

1	<div class="container-fluid p-0">	1	<div class="container-fluid p-0">
2	<img	2	<img
3	src="{{apiUrl}}/imagenes/homeBackground.jpg"	3	src="{{apiImagenes}}/imagenes/homeBackground.jpg"
4	class="background-image vh-100 w-100">	4	class="background-image vh-100 w-100">
5	<div class="row m-0">	5	<div class="row m-0">
6	<div class="col p-0">	6	<div class="col p-0">
7	<div	7	<div
8	class="vh-100 fade-in d-flex align-items-start flex-column disable-user-select"	8	class="vh-100 fade-in d-flex align-items-start flex-column disable-user-select"
9	[routerLink]="['/inicio']">	9	[routerLink]="['/inicio']">
10		10
11	<!-- HEADER -->	11	<!-- HEADER -->
12	<div class="row m-0 w-100 bg-primary-gradient-horizontal">	12	<div class="row m-0 w-100 bg-primary-gradient-horizontal">
13	<div class="col-6 bg-white p-3 rounded-bottom-right">	13	<div class="col-6 bg-white p-3 rounded-bottom-right">
14	<img class="w-25 mx-auto d-block" src="{{apiUrl}}/imagenes/logoempresa.png">	14	<img class="w-25 mx-auto d-block" src="{{apiImagenes}}/imagenes/logoempresa.png">
15	</div>	15	</div>
16	</div>	16	</div>
17		17
18	<!-- INFO DE BIENVENIDA -->	18	<!-- INFO DE BIENVENIDA -->
19	<div class="row my-auto h-50 w-100">	19	<div class="row my-auto h-50 w-100">
20	<div class="col-3 col-lg-4 offset-lg-1 h-100 my-auto">	20	<div class="col-3 col-lg-4 offset-lg-1 h-100 my-auto">
21	<!-- CAROUSEL -->	21	<!-- CAROUSEL -->
22	<carousel [showIndicators]="false" [interval]="1500">	22	<carousel [showIndicators]="false" [interval]="1500">
23	<slide class="h-100">	23	<slide class="h-100">
24	<img	24	<img
25	src="{{apiUrl}}/imagenes/coca1.jpg"	25	src="{{apiImagenes}}/imagenes/coca1.jpg"
26	class="fade-in d-block rounded-sm shadow mw-100 h-100 w-auto mx-auto">	26	class="fade-in d-block rounded-sm shadow mw-100 h-100 w-auto mx-auto">
27	</slide>	27	</slide>
28	<slide class="h-100">	28	<slide class="h-100">
29	<img	29	<img
30	src="{{apiUrl}}/imagenes/coca2.jpg"	30	src="{{apiImagenes}}/imagenes/coca2.jpg"
31	class="fade-in d-block rounded-sm shadow mw-100 h-100 w-auto mx-auto">	31	class="fade-in d-block rounded-sm shadow mw-100 h-100 w-auto mx-auto">
32	</slide>	32	</slide>
33	<slide class="h-100">	33	<slide class="h-100">
34	<img	34	<img
35	src="{{apiUrl}}/imagenes/coca3.jpg"	35	src="{{apiImagenes}}/imagenes/coca3.jpg"
36	class="fade-in d-block rounded-sm shadow mw-100 h-100 w-auto mx-auto">	36	class="fade-in d-block rounded-sm shadow mw-100 h-100 w-auto mx-auto">
37	</slide>	37	</slide>
38	</carousel>	38	</carousel>
39		39
40	</div>	40	</div>
41	<div class="col-9 col-lg-7 text-center text-white my-auto">	41	<div class="col-9 col-lg-7 text-center text-white my-auto">
42	<p class="display-2 font-weight-bold mb-5">¡BIENVENIDO!</p>	42	<p class="display-2 font-weight-bold mb-5">¡BIENVENIDO!</p>
43	<p class="display-3 m-0 font-weight-bold">Toque la pantalla<br>para comenzar</p>	43	<p class="display-3 m-0 font-weight-bold">Toque la pantalla<br>para comenzar</p>
44	</div>	44	</div>
45	</div>	45	</div>
46		46
47	<!-- FOOTER -->	47	<!-- FOOTER -->
48	<div class="row m-0 w-100 bg-gray">	48	<div class="row m-0 w-100 bg-gray">
49	<div class="col-6 bg-white offset-6 p-3 rounded-top-left">	49	<div class="col-6 bg-white offset-6 p-3 rounded-top-left">
50	<img class="w-25 mx-auto d-block" src="{{apiUrl}}/imagenes/logodebo.png">	50	<img class="w-25 mx-auto d-block" src="{{apiImagenes}}/imagenes/logodebo.png">
51	</div>	51	</div>
52	</div>	52	</div>
53		53
54	</div>	54	</div>
55	</div>	55	</div>
56	</div>	56	</div>
57	</div>	57	</div>
58		58

src/app/components/home/home.component.ts

Diff comments View file @ 5c153ab

1	import { Component, OnInit, HostListener } from '@angular/core';	1	import { Component, OnInit, HostListener } from '@angular/core';
2	import { Router } from '@angular/router';	2	import { Router } from '@angular/router';
3	import { appSettings } from 'src/etc/AppSettings';	3	import { appSettings } from 'src/etc/AppSettings';
4		4
5	@Component({	5	@Component({
6	selector: 'app-home',	6	selector: 'app-home',
7	templateUrl: './home.component.html',	7	templateUrl: './home.component.html',
8	styleUrls: ['./home.component.scss']	8	styleUrls: ['./home.component.scss']
9	})	9	})
10	export class HomeComponent implements OnInit {	10	export class HomeComponent implements OnInit {
11		11
12	private apiUrl: string = appSettings.apiUrl;	12	private apiImagenes: string = appSettings.apiImagenes;
13		13
14	constructor() { }	14	constructor() { }
15		15
16	ngOnInit() {	16	ngOnInit() {
17	}	17	}
18		18
19	}	19	}
20		20

src/app/components/inicio/inicio.component.html

Diff comments View file @ 5c153ab

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">Inicio</p>	7	<p class="h5 py-1 bg-gray text-muted text-center">Inicio</p>
8	</div>	8	</div>
9	</div>	9	</div>
10		10
11	<div class="row m-3 d-flex align-items-start disable-user-select">	11	<div class="row m-3 d-flex align-items-start disable-user-select">
12	<div class="col-md-5 d-flex align-items-end flex-column">	12	<div class="col-md-5 d-flex align-items-end flex-column">
13		13
14	<!-- PROMOCIONES -->	14	<!-- PROMOCIONES -->
15	<div	15	<div
16	(click)="irBusquedaProductos('promociones')"	16	(click)="irBusquedaProductos('promociones')"
17	class="card card-effect bg-white border-0 shadow rounded w-100 mb-auto">	17	class="card card-effect bg-white border-0 shadow rounded w-100 mb-auto">
18	<div class="card-body text-left px-4 py-3">	18	<div class="card-body text-left px-4 py-3">
19	<div class="row">	19	<div class="row">
20	<div class="col-auto">	20	<div class="col-auto">
21	<p class="h3 card-title">Promociones</p>	21	<p class="h3 card-title">Promociones</p>
22	</div>	22	</div>
23	<div class="col-auto p-0">	23	<div class="col-auto p-0">
24	<img src="{{apiUrl}}/imagenes/primario.promociones.png" class="icon-dim m-0">	24	<img src="{{apiImagenes}}/imagenes/primario.promociones.png" class="icon-dim m-0">
25	</div>	25	</div>
26	</div>	26	</div>
27	<p class="h5 card-text text-muted font-weight-light">Conozca las ofertas del momento.</p>	27	<p class="h5 card-text text-muted font-weight-light">Conozca las ofertas del momento.</p>
28	</div>	28	</div>
29	<!-- CAROUSEL -->	29	<!-- CAROUSEL -->
30	<carousel [showIndicators]="false" [interval]="1500">	30	<carousel [showIndicators]="false" [interval]="1500">
31	<slide class="h-100">	31	<slide class="h-100">
32	<img	32	<img
33	src="{{apiUrl}}/imagenes/beldent.jpg"	33	src="{{apiImagenes}}/imagenes/beldent.jpg"
34	class="fade-in d-block w-75 m-auto rounded">	34	class="fade-in d-block w-75 m-auto rounded">
35	</slide>	35	</slide>
36	<slide class="h-100">	36	<slide class="h-100">
37	<img	37	<img
38	src="{{apiUrl}}/imagenes/cafe con leche y medialunas.jpg"	38	src="{{apiImagenes}}/imagenes/cafe con leche y medialunas.jpg"
39	class="fade-in d-block w-75 m-auto rounded">	39	class="fade-in d-block w-75 m-auto rounded">
40	</slide>	40	</slide>
41	<slide class="h-100">	41	<slide class="h-100">
42	<img	42	<img
43	src="{{apiUrl}}/imagenes/Surtido bagley.jpg"	43	src="{{apiImagenes}}/imagenes/Surtido bagley.jpg"
44	class="fade-in d-block w-75 m-auto rounded">	44	class="fade-in d-block w-75 m-auto rounded">
45	</slide>	45	</slide>
46	<slide class="h-100">	46	<slide class="h-100">
47	<img	47	<img
48	src="{{apiUrl}}/imagenes/yogurisimo.jpg"	48	src="{{apiImagenes}}/imagenes/yogurisimo.jpg"
49	class="fade-in d-block w-75 m-auto rounded">	49	class="fade-in d-block w-75 m-auto rounded">
50	</slide>	50	</slide>
51	</carousel>	51	</carousel>
52	</div>	52	</div>
53		53
54	<!-- ORDENAR -->	54	<!-- ORDENAR -->
55	<div (click)="irBusquedaProductos('ordenar')"	55	<div (click)="irBusquedaProductos('ordenar')"
56	class="card card-effect bg-white border-0 shadow rounded w-100 mt-4">	56	class="card card-effect bg-white border-0 shadow rounded w-100 mt-4">
57	<div class="card-body text-left px-4 py-3">	57	<div class="card-body text-left px-4 py-3">
58	<div class="row">	58	<div class="row">
59	<div class="col-auto">	59	<div class="col-auto">
60	<p class="h3 card-title">Ordenar Pedido</p>	60	<p class="h3 card-title">Ordenar Pedido</p>
61	</div>	61	</div>
62	<div class="col-auto p-0">	62	<div class="col-auto p-0">
63	<img src="{{apiUrl}}/imagenes/primario.ordenar.png" class="icon-dim">	63	<img src="{{apiImagenes}}/imagenes/primario.ordenar.png" class="icon-dim">
64	</div>	64	</div>
65	</div>	65	</div>
66	<p class="h5 card-text text-muted font-weight-light">Arme su pedido y solo pase a retirar.</p>	66	<p class="h5 card-text text-muted font-weight-light">Arme su pedido y solo pase a retirar.</p>
67	</div>	67	</div>
68	<img	68	<img
69	class="card-img-bottom d-block w-100 mx-auto rounded"	69	class="card-img-bottom d-block w-100 mx-auto rounded"
70	src="{{apiUrl}}/imagenes/cafe.jpg">	70	src="{{apiImagenes}}/imagenes/cafe.jpg">
71	</div>	71	</div>
72	</div>	72	</div>
73		73
74	<div class="col-md-7 d-flex align-items-end flex-column mt-4 mt-md-0">	74	<div class="col-md-7 d-flex align-items-end flex-column mt-4 mt-md-0">
75		75
76	<!-- CARGAR PRODUCTOS -->	76	<!-- CARGAR PRODUCTOS -->
77	<ng-template #popTemplate>	77	<ng-template #popTemplate>
78	<app-popover-promos	78	<app-popover-promos
79	*ngIf="promociones.length > 0 && sinonimos.length === 0"	79	*ngIf="promociones.length > 0 && sinonimos.length === 0"
80	[popover]="popoverDirective"	80	[popover]="popoverDirective"
81	[popoverContent]="promociones"	81	[popoverContent]="promociones"
82	(promoSeleccionada)="promoSeleccionada($event, false)"	82	(promoSeleccionada)="promoSeleccionada($event, false)"
83	class="text-white rounded-sm border-0">	83	class="text-white rounded-sm border-0">
84	</app-popover-promos>	84	</app-popover-promos>
85	<app-popover-sinonimos	85	<app-popover-sinonimos
86	*ngIf="sinonimos.length > 0"	86	*ngIf="sinonimos.length > 0"
87	[popover]="popoverDirective"	87	[popover]="popoverDirective"
88	[popoverContent]="sinonimos"	88	[popoverContent]="sinonimos"
89	(productosPersonalizados)="productosPersonalizados($event)"	89	(productosPersonalizados)="productosPersonalizados($event)"
90	class="text-white rounded-sm border-0">	90	class="text-white rounded-sm border-0">
91	</app-popover-sinonimos>	91	</app-popover-sinonimos>
92	</ng-template>	92	</ng-template>
93	<div	93	<div
94	placement="left"	94	placement="left"
95	triggers=""	95	triggers=""
96	[popover]="popTemplate"	96	[popover]="popTemplate"
97	class="w-100"	97	class="w-100"
98	#pop="bs-popover">	98	#pop="bs-popover">
99	<div class="card bg-white border-0 shadow rounded mb-auto">	99	<div class="card bg-white border-0 shadow rounded mb-auto">
100	<div class="card-body text-left px-4 py-3">	100	<div class="card-body text-left px-4 py-3">
101	<div class="row">	101	<div class="row">
102	<div class="col-auto">	102	<div class="col-auto">
103	<p class="h3 card-title">Cargar Productos</p>	103	<p class="h3 card-title">Cargar Productos</p>
104	</div>	104	</div>
105	<div class="col-auto p-0">	105	<div class="col-auto p-0">
106	<img src="{{apiUrl}}/imagenes/escanear.png" class="icon-dim mb-2">	106	<img src="{{apiImagenes}}/imagenes/escanear.png" class="icon-dim mb-2">
107	</div>	107	</div>
108	</div>	108	</div>
109	<p class="h5 card-text text-muted font-weight-light">	109	<p class="h5 card-text text-muted font-weight-light">
110	Coloque un producto frente<br>	110	Coloque un producto frente<br>
111	al lector de códigos o selecciónelo en pantalla.	111	al lector de códigos o selecciónelo en pantalla.
112	</p>	112	</p>
113	</div>	113	</div>
114	<div class="row m-4">	114	<div class="row m-4">
115	<div class="col card bg-white shadow border-0 w-75 p-0 mx-auto rounded-sm">	115	<div class="col card bg-white shadow border-0 w-75 p-0 mx-auto rounded-sm">
116	<!-- IMAGEN DE ESCANER -->	116	<!-- IMAGEN DE ESCANER -->
117	<img	117	<img
118	*ngIf="!productoAcargar"	118	*ngIf="!productoAcargar"
119	class="card-img-top d-block w-100 mx-auto rounded-sm"	119	class="card-img-top d-block w-100 mx-auto rounded-sm"
120	src="{{apiUrl}}/imagenes/escanner.jpg">	120	src="{{apiImagenes}}/imagenes/escanner.jpg">
121		121
122	<!-- PRODUCTO A CARGAR -->	122	<!-- PRODUCTO A CARGAR -->
123	<div class="fade-in m-0" *ngIf="productoAcargar && !promoAcargar">	123	<div class="fade-in m-0" *ngIf="productoAcargar && !promoAcargar">
124	<img	124	<img
125	class="card-img-top d-block w-75 mx-auto rounded-sm"	125	class="card-img-top d-block w-75 mx-auto rounded-sm"
126	src="{{apiUrl}}/imagenes/{{productoAcargar.imagenes[0].imagen}}">	126	src="{{apiImagenes}}/imagenes/{{productoAcargar.imagenes[0].imagen}}">
127		127
128	<div class="row justify-content-between m-3">	128	<div class="row justify-content-between m-3">
129	<div class="col-12 text-left px-1">	129	<div class="col-12 text-left px-1">
130	<p class="h6 font-weight-bold mb-0">{{productoAcargar.DET_LAR}}</p>	130	<p class="h6 font-weight-bold mb-0">{{productoAcargar.DET_LAR}}</p>
131	</div>	131	</div>
132	<div class="col-12 text-right mt-2">	132	<div class="col-12 text-right mt-2">
133	<p class="h5 font-weight-bold mb-0">{{productoAcargar.PreVen \| currency}}</p>	133	<p class="h5 font-weight-bold mb-0">{{productoAcargar.PreVen \| currency}}</p>
134	</div>	134	</div>
135	</div>	135	</div>
136	</div>	136	</div>
137		137
138	<!-- PROMO A CARGAR -->	138	<!-- PROMO A CARGAR -->
139	<div class="fade-in m-0" *ngIf="promoAcargar">	139	<div class="fade-in m-0" *ngIf="promoAcargar">
140	<img	140	<img
141	class="card-img-top d-block w-100 mx-auto rounded-sm"	141	class="card-img-top d-block w-100 mx-auto rounded-sm"
142	src="{{apiUrl}}/imagenes/{{promoAcargar.imagenes[0].imagen}}">	142	src="{{apiImagenes}}/imagenes/{{promoAcargar.imagenes[0].imagen}}">
143		143
144	<div class="row justify-content-between m-3">	144	<div class="row justify-content-between m-3">
145	<div class="col-12 text-left px-1">	145	<div class="col-12 text-left px-1">
146	<p class="h6 font-weight-bold mb-0">{{promoAcargar.DET_LAR}}</p>	146	<p class="h6 font-weight-bold mb-0">{{promoAcargar.DET_LAR}}</p>
147	</div>	147	</div>
148	<div class="col-12 text-right mt-2 align-self-end">	148	<div class="col-12 text-right mt-2 align-self-end">
149	<p class="h5 font-weight-bold mb-0">{{promoAcargar.PreVen \| currency}}</p>	149	<p class="h5 font-weight-bold mb-0">{{promoAcargar.PreVen \| currency}}</p>
150	</div>	150	</div>
151	</div>	151	</div>
152	</div>	152	</div>
153		153
154	</div>	154	</div>
155	<!-- BOTONES DE CARGAR PRODUCTOS-->	155	<!-- BOTONES DE CARGAR PRODUCTOS-->
156	<div	156	<div
157	class="col-5 pr-0"	157	class="col-5 pr-0"
158	*ngIf="promociones.length > 0">	158	*ngIf="promociones.length > 0">
159	<button	159	<button
160	*ngIf="!promoAcargar \|\| sinonimos.length == 0"	160	*ngIf="!promoAcargar \|\| sinonimos.length == 0"
161	type="button"	161	type="button"
162	class="btn btn-primary btn-block shadow-sm"	162	class="btn btn-primary btn-block shadow-sm"
163	(click)="pop.show()">	163	(click)="pop.show()">
164	<span class="pr-2">Mostrar promociones</span>	164	<span class="pr-2">Mostrar promociones</span>
165	<i class="fa fa-bullhorn fa-flip-horizontal" aria-hidden="true"></i>	165	<i class="fa fa-bullhorn fa-flip-horizontal" aria-hidden="true"></i>
166	</button>	166	</button>
167	<button	167	<button
168	type="button"	168	type="button"
169	class="btn btn-light btn-block shadow-sm my-3"	169	class="btn btn-light btn-block shadow-sm my-3"
170	(click)="confirmarProducto()">	170	(click)="confirmarProducto()">
171	<span class="pr-2 font-weight-bold">Confirmar</span>	171	<span class="pr-2 font-weight-bold">Confirmar</span>
172	<i class="fa fa-check text-success" aria-hidden="true"></i>	172	<i class="fa fa-check text-success" aria-hidden="true"></i>
173	</button>	173	</button>
174	<button	174	<button
175	type="button"	175	type="button"
176	class="btn btn-light btn-block shadow-sm"	176	class="btn btn-light btn-block shadow-sm"
177	(click)="deshacerCarga()">	177	(click)="deshacerCarga()">
178	<span class="pr-2">Deshacer</span>	178	<span class="pr-2">Deshacer</span>
179	<i class="fa fa-undo text-warning" aria-hidden="true"></i>	179	<i class="fa fa-undo text-warning" aria-hidden="true"></i>
180	</button>	180	</button>
181	</div>	181	</div>
182	</div>	182	</div>
183	</div>	183	</div>
184	</div>	184	</div>
185		185
186	<!-- BUSCAR PRODUCTOS -->	186	<!-- BUSCAR PRODUCTOS -->
187	<div (click)="irBusquedaProductos('todos')"	187	<div (click)="irBusquedaProductos('todos')"
188	class="card card-effect bg-white border-0 shadow rounded w-100 mt-4">	188	class="card card-effect bg-white border-0 shadow rounded w-100 mt-4">
189	<div class="card-body text-left px-4 py-3">	189	<div class="card-body text-left px-4 py-3">
190	<div class="row">	190	<div class="row">
191	<div class="col-auto">	191	<div class="col-auto">
192	<p class="h3 card-title">Buscar Productos</p>	192	<p class="h3 card-title">Buscar Productos</p>
193	<p class="h5 card-text text-muted font-weight-light">	193	<p class="h5 card-text text-muted font-weight-light">
194	Busque aquí los productos<br>	194	Busque aquí los productos<br>
195	que no tienen código.</p>	195	que no tienen código.</p>
196	</div>	196	</div>
197	<div class="col-auto p-0">	197	<div class="col-auto p-0">
198	<img src="{{apiUrl}}/imagenes/primario.buscar.png" class="icon-dim mb-2">	198	<img src="{{apiImagenes}}/imagenes/primario.buscar.png" class="icon-dim mb-2">
199	</div>	199	</div>
200	</div>	200	</div>
201		201
202	</div>	202	</div>
203	</div>	203	</div>
204		204
205	</div>	205	</div>
206		206
207	</div>	207	</div>
208		208
209	</div>	209	</div>
210	</div>	210	</div>
211		211

src/app/components/inicio/inicio.component.ts

Diff comments View file @ 5c153ab

1	import { Component, OnInit, ViewChild, HostListener, AfterViewInit } from '@angular/core';	1	import { Component, OnInit, ViewChild, HostListener, AfterViewInit } from '@angular/core';
2	import { PopoverDirective } from 'ngx-bootstrap';	2	import { PopoverDirective } from 'ngx-bootstrap';
3	import { appSettings } from 'src/etc/AppSettings';	3	import { appSettings } from 'src/etc/AppSettings';
4	import { Router } from '@angular/router';	4	import { Router } from '@angular/router';
5	import { ProductoService } from 'src/app/services/producto.service';	5	import { ProductoService } from 'src/app/services/producto.service';
6	import { Producto } from 'src/app/wrappers/producto';	6	import { Producto } from 'src/app/wrappers/producto';
7	import { Sinonimo } from 'src/app/wrappers/sinonimo';	7	import { Sinonimo } from 'src/app/wrappers/sinonimo';
8		8
9	@Component({	9	@Component({
10	selector: 'app-inicio',	10	selector: 'app-inicio',
11	templateUrl: './inicio.component.html',	11	templateUrl: './inicio.component.html',
12	styleUrls: ['./inicio.component.scss']	12	styleUrls: ['./inicio.component.scss']
13	})	13	})
14	export class InicioComponent implements OnInit, AfterViewInit {	14	export class InicioComponent implements OnInit, AfterViewInit {
15		15
16	private tienePromo = false;	16	private tienePromo = false;
17	private productoEsPromo = false;	17	private productoEsPromo = false;
18	private busqueda: string = '';	18	private busqueda: string = '';
19	private productoAcargar: Producto;	19	private productoAcargar: Producto;
20	private promoAcargar: Producto;	20	private promoAcargar: Producto;
21	private productos: Producto[] = [];	21	private productos: Producto[] = [];
22	private promociones: Producto[] = [];	22	private promociones: Producto[] = [];
23	private sinonimos: Sinonimo[] = [];	23	private sinonimos: Sinonimo[] = [];
24	private apiUrl: string = appSettings.apiUrl;	24	private apiImagenes: string = appSettings.apiImagenes;
25		25
26	@ViewChild('pop', { static: false }) popoverDirective: PopoverDirective;	26	@ViewChild('pop', { static: false }) popoverDirective: PopoverDirective;
27		27
28	@HostListener('document:keypress', ["$event"]) catchInput(e: KeyboardEvent) {	28	@HostListener('document:keypress', ["$event"]) catchInput(e: KeyboardEvent) {
29		29
30	if (e.keyCode == 13) {	30	if (e.keyCode == 13) {
31	this.buscarByCodigoBarras(this.busqueda);	31	this.buscarByCodigoBarras(this.busqueda);
32	this.busqueda = '';	32	this.busqueda = '';
33	} else {	33	} else {
34	this.busqueda += e.key;	34	this.busqueda += e.key;
35	}	35	}
36		36
37	};	37	};
38		38
39	constructor(	39	constructor(
40	private router: Router,	40	private router: Router,
41	private productoService: ProductoService	41	private productoService: ProductoService
42	) { }	42	) { }
43		43
44	ngOnInit() {	44	ngOnInit() {
45		45
46	this.productoAcargar = this.productoService.productoAcargar;	46	this.productoAcargar = this.productoService.productoAcargar;
47	this.getProductos();	47	this.getProductos();
48	}	48	}
49		49
50	ngAfterViewInit() {	50	ngAfterViewInit() {
51		51
52	setTimeout(() => {	52	setTimeout(() => {
53	if (!this.productoAcargar) return;	53	if (!this.productoAcargar) return;
54		54
55	if (this.productoAcargar.PRO) {	55	if (this.productoAcargar.PRO) {
56	this.promociones.push(this.productoAcargar);	56	this.promociones.push(this.productoAcargar);
57	this.promoSeleccionada(this.productoAcargar, true);	57	this.promoSeleccionada(this.productoAcargar, true);
58	}	58	}
59	else {	59	else {
60	this.getPromociones();	60	this.getPromociones();
61	}	61	}
62	})	62	})
63	}	63	}
64		64
65	getProductos() {	65	getProductos() {
66		66
67	this.productoService.getAll()	67	this.productoService.getAll()
68	.subscribe((productos: Producto[]) => {	68	.subscribe((productos: Producto[]) => {
69	this.productos = productos;	69	this.productos = productos;
70	});	70	});
71	}	71	}
72		72
73	getPromociones() {	73	getPromociones() {
74		74
75	var sector = this.productoAcargar.CodSec;	75	var sector = this.productoAcargar.CodSec;
76	var codigo = this.productoAcargar.CodArt;	76	var codigo = this.productoAcargar.CodArt;
77	this.productoService.getPromociones(sector, codigo)	77	this.productoService.getPromociones(sector, codigo)
78	.subscribe((res: Producto[]) => {	78	.subscribe((res: Producto[]) => {
79		79
80	if (res.length === 0) {	80	if (res.length === 0) {
81		81
82	this.productoAcargar.cantidad = 1;	82	this.productoAcargar.cantidad = 1;
83	this.productoService.setProductos(this.productoAcargar);	83	this.productoService.setProductos(this.productoAcargar);
84	this.productoAcargar = this.productoService.productoAcargar = undefined;	84	this.productoAcargar = this.productoService.productoAcargar = undefined;
85	} else {	85	} else {
86		86
87	this.promociones = res;	87	this.promociones = res;
88	this.popoverDirective.show();	88	this.popoverDirective.show();
89	}	89	}
90	}, error => { console.error(error); })	90	}, error => { console.error(error); })
91	}	91	}
92		92
93	confirmarProducto() {	93	confirmarProducto() {
94		94
95	var producto = this.promoAcargar ? this.promoAcargar : this.productoAcargar;	95	var producto = this.promoAcargar ? this.promoAcargar : this.productoAcargar;
96	producto.cantidad = 1;	96	producto.cantidad = 1;
97	this.productoService.setProductos(producto);	97	this.productoService.setProductos(producto);
98	this.productoService.productoAcargar = this.promoAcargar = this.productoAcargar = undefined;	98	this.productoService.productoAcargar = this.promoAcargar = this.productoAcargar = undefined;
99	this.promociones = [];	99	this.promociones = [];
100	this.popoverDirective.hide();	100	this.popoverDirective.hide();
101	}	101	}
102		102
103	promoSeleccionada($event: Producto, showPopover: boolean) {	103	promoSeleccionada($event: Producto, showPopover: boolean) {
104		104
105	this.productoService.getProductoById($event.id)	105	this.productoService.getProductoById($event.id)
106	.subscribe((res: Producto) => {	106	.subscribe((res: Producto) => {
107		107
108	$event.imagenes = res.imagenes.length == 0 ? [{ imagen: 'noImage.jpg' }] : res.imagenes;	108	$event.imagenes = res.imagenes.length == 0 ? [{ imagen: 'noImage.jpg' }] : res.imagenes;
109	this.promoAcargar = $event;	109	this.promoAcargar = $event;
110		110
111	if ($event.tieneSinonimos) {	111	if ($event.tieneSinonimos) {
112	this.getSinonimos(this.promoAcargar.CodSec, this.promoAcargar.CodArt);	112	this.getSinonimos(this.promoAcargar.CodSec, this.promoAcargar.CodArt);
113	} else if (showPopover) {	113	} else if (showPopover) {
114	this.popoverDirective.show();	114	this.popoverDirective.show();
115	} else {	115	} else {
116	this.popoverDirective.hide();	116	this.popoverDirective.hide();
117	}	117	}
118		118
119	},	119	},
120	error => { console.log(error); })	120	error => { console.log(error); })
121	}	121	}
122		122
123	getSinonimos(sector, codigo) {	123	getSinonimos(sector, codigo) {
124		124
125	this.productoService.getPromocionSinonimos(sector, codigo)	125	this.productoService.getPromocionSinonimos(sector, codigo)
126	.subscribe((res: Sinonimo[]) => {	126	.subscribe((res: Sinonimo[]) => {
127		127
128	res.forEach(sinonimo => {	128	res.forEach(sinonimo => {
129		129
130	sinonimo.cantidad = 0;	130	sinonimo.cantidad = 0;
131	this.promoAcargar.productos.forEach(productoPromo => {	131	this.promoAcargar.productos.forEach(productoPromo => {
132		132
133	sinonimo.productos.forEach(productoSinonimo => {	133	sinonimo.productos.forEach(productoSinonimo => {
134		134
135	if (productoSinonimo.id === productoPromo.id) {	135	if (productoSinonimo.id === productoPromo.id) {
136	productoSinonimo.cantidad = productoPromo.cantidad;	136	productoSinonimo.cantidad = productoPromo.cantidad;
137	sinonimo.cantidad += productoPromo.cantidad;	137	sinonimo.cantidad += productoPromo.cantidad;
138	}	138	}
139	})	139	})
140	})	140	})
141	})	141	})
142	this.sinonimos = res;	142	this.sinonimos = res;
143	(this.sinonimos.length > 0) ? this.popoverDirective.show() : this.popoverDirective.hide();	143	(this.sinonimos.length > 0) ? this.popoverDirective.show() : this.popoverDirective.hide();
144	})	144	})
145	}	145	}
146		146
147	productosPersonalizados($event: Producto[]) {	147	productosPersonalizados($event: Producto[]) {
148		148
149	var productosPersonalizados = $event;	149	var productosPersonalizados = $event;
150		150
151	this.promoAcargar.productos.forEach(productoPromo => {	151	this.promoAcargar.productos.forEach(productoPromo => {
152		152
153	if (!productoPromo.idSinonimo) productosPersonalizados.push(productoPromo);	153	if (!productoPromo.idSinonimo) productosPersonalizados.push(productoPromo);
154	})	154	})
155		155
156	this.promoAcargar.productos = productosPersonalizados;	156	this.promoAcargar.productos = productosPersonalizados;
157	this.confirmarProducto();	157	this.confirmarProducto();
158	}	158	}
159		159
160	buscarByCodigoBarras(busqueda) {	160	buscarByCodigoBarras(busqueda) {
161		161
162	let producto = this.productos.filter(producto => {	162	let producto = this.productos.filter(producto => {
163	return producto.codigoBarra == busqueda;	163	return producto.codigoBarra == busqueda;
164	});	164	});
165		165
166	if (producto.length) {	166	if (producto.length) {
167		167
168	this.productoAcargar = producto[0];	168	this.productoAcargar = producto[0];
169	this.getPromociones();	169	this.getPromociones();
170		170
171	} else {	171	} else {
172	alert('No se encuentra el producto');	172	alert('No se encuentra el producto');
173	}	173	}
174		174
175	}	175	}
176		176
177	irBusquedaProductos(value) {	177	irBusquedaProductos(value) {
178		178
179	this.productoService.mostrar = value;	179	this.productoService.mostrar = value;
180	this.router.navigate(['busqueda-productos']);	180	this.router.navigate(['busqueda-productos']);
181	}	181	}
182		182
183	deshacerCarga() {	183	deshacerCarga() {
184		184
185	if (this.sinonimos.length > 0) {	185	if (this.sinonimos.length > 0) {
186	this.sinonimos = [];	186	this.sinonimos = [];
187	this.popoverDirective.hide();	187	this.popoverDirective.hide();
188	}	188	}
189		189
190	if (this.promoAcargar) {	190	if (this.promoAcargar) {
191	this.promoAcargar = undefined;	191	this.promoAcargar = undefined;
192	if (this.productoAcargar.PRO) {	192	if (this.productoAcargar.PRO) {
193	this.productoAcargar = undefined;	193	this.productoAcargar = undefined;
194	this.promociones = [];	194	this.promociones = [];
195	this.popoverDirective.hide();	195	this.popoverDirective.hide();
196	} else {	196	} else {
197	this.popoverDirective.show();	197	this.popoverDirective.show();
198	}	198	}
199	} else {	199	} else {
200	this.productoAcargar = undefined;	200	this.productoAcargar = undefined;
201	this.promociones = [];	201	this.promociones = [];
202	this.popoverDirective.hide();	202	this.popoverDirective.hide();
203	}	203	}
204	}	204	}
205		205
206	}	206	}
207		207

src/app/components/mensaje-final/mensaje-final.component.html

Diff comments View file @ 5c153ab

1	<div class="container-fluid fade-in p-0 disable-user-select">	1	<div class="container-fluid fade-in p-0 disable-user-select">
2	<img src="{{apiUrl}}/imagenes/homeBackground.jpg" class="background-image vh-100 w-100">	2	<img src="{{apiImagenes}}/imagenes/homeBackground.jpg" class="background-image vh-100 w-100">
3	<div class="row m-0">	3	<div class="row m-0">
4	<div class="col p-0">	4	<div class="col p-0">
5	<div class="vh-100 fade-in d-flex align-content-between flex-wrap disable-user-select">	5	<div class="vh-100 fade-in d-flex align-content-between flex-wrap disable-user-select">
6		6
7	<!-- HEADER -->	7	<!-- HEADER -->
8	<div class="row m-0 w-100 bg-primary-gradient-horizontal">	8	<div class="row m-0 w-100 bg-primary-gradient-horizontal">
9	<div class="col-6 bg-white p-3 rounded-bottom-right">	9	<div class="col-6 bg-white p-3 rounded-bottom-right">
10	<img class="w-25 mx-auto d-block" src="{{apiUrl}}/imagenes/logoempresa.png">	10	<img class="w-25 mx-auto d-block" src="{{apiImagenes}}/imagenes/logoempresa.png">
11	</div>	11	</div>
12	</div>	12	</div>
13		13
14	<div class="row py-5 m-0 w-100">	14	<div class="row py-5 m-0 w-100">
15	<div class="col-6 offset-3">	15	<div class="col-6 offset-3">
16	<div class="row h-100">	16	<div class="row h-100">
17	<div class="col-12 my-auto">	17	<div class="col-12 my-auto">
18	<div>	18	<div>
19	<div class="mb-5 mt-4">	19	<div class="mb-5 mt-4">
20	<p class="display-1 card-text text-center text-white font-weight-bold">	20	<p class="display-1 card-text text-center text-white font-weight-bold">
21	Gracias	21	Gracias
22	</p>	22	</p>
23	<p class="display-4 card-text text-center text-white font-weight-bold">	23	<p class="display-4 card-text text-center text-white font-weight-bold">
24	Por su compra	24	Por su compra
25	</p>	25	</p>
26	</div>	26	</div>
27	</div>	27	</div>
28	</div>	28	</div>
29	</div>	29	</div>
30	</div>	30	</div>
31	</div>	31	</div>
32		32
33	<!-- FOOTER -->	33	<!-- FOOTER -->
34	<div class="row m-0 w-100 bg-gray">	34	<div class="row m-0 w-100 bg-gray">
35	<div class="col-6 bg-white offset-6 p-3 rounded-top-left">	35	<div class="col-6 bg-white offset-6 p-3 rounded-top-left">
36	<img class="w-25 mx-auto d-block" src="{{apiUrl}}/imagenes/logodebo.png">	36	<img class="w-25 mx-auto d-block" src="{{apiImagenes}}/imagenes/logodebo.png">
37	</div>	37	</div>
38	</div>	38	</div>
39		39
40	</div>	40	</div>
41	</div>	41	</div>
42	</div>	42	</div>
43	</div>	43	</div>
44		44

src/app/components/mensaje-final/mensaje-final.component.ts

Diff comments View file @ 5c153ab

1	import { Component, OnInit } from '@angular/core';	1	import { Component, OnInit } from '@angular/core';
2	import { appSettings } from 'src/etc/AppSettings';	2	import { appSettings } from 'src/etc/AppSettings';
3	import { ProductoService } from 'src/app/services/producto.service';	3	import { ProductoService } from 'src/app/services/producto.service';
4	import { Router } from '@angular/router';	4	import { Router } from '@angular/router';
5		5
6	@Component({	6	@Component({
7	selector: 'app-mensaje-final',	7	selector: 'app-mensaje-final',
8	templateUrl: './mensaje-final.component.html',	8	templateUrl: './mensaje-final.component.html',
9	styleUrls: ['./mensaje-final.component.scss']	9	styleUrls: ['./mensaje-final.component.scss']
10	})	10	})
11	export class MensajeFinalComponent implements OnInit {	11	export class MensajeFinalComponent implements OnInit {
12		12
13	private apiUrl: string = appSettings.apiUrl;	13	private apiImagenes: string = appSettings.apiImagenes;
14	private timer: any;	14	private timer: any;
15		15
16	constructor(	16	constructor(
17	private productoService: ProductoService,	17	private productoService: ProductoService,
18	private router: Router	18	private router: Router
19	) { }	19	) { }
20		20
21	ngOnInit() {	21	ngOnInit() {
22		22
23	this.timer = setTimeout(() => {	23	this.timer = setTimeout(() => {
24		24
25	this.limpiarCarritoYvolver();	25	this.limpiarCarritoYvolver();
26	}, 3000)	26	}, 3000)
27	}	27	}
28		28
29	ngOnDestroy() {	29	ngOnDestroy() {
30		30
31	clearTimeout(this.timer);	31	clearTimeout(this.timer);
32	}	32	}
33		33
34	limpiarCarritoYvolver() {	34	limpiarCarritoYvolver() {
35		35
36	this.productoService.productoAcargar = undefined;	36	this.productoService.productoAcargar = undefined;
37	this.productoService.promoAcargar = undefined;	37	this.productoService.promoAcargar = undefined;
38	this.productoService.productos = [];	38	this.productoService.productos = [];
39	this.router.navigate(['/home']);	39	this.router.navigate(['/home']);
40	}	40	}
41		41
42	}	42	}
43		43

src/app/components/pago/pago.component.html

Diff comments View file @ 5c153ab

1	<div	1	<div
2	*ngIf="!compraConEfectivofinalizada && !compraConQRfinalizada"	2	*ngIf="!compraConEfectivofinalizada && !compraConQRfinalizada"
3	class="row m-0 fade-in bg-primary-gradient disable-user-select"	3	class="row m-0 fade-in bg-primary-gradient disable-user-select"
4	(click)="reiniciarTimer()">	4	(click)="reiniciarTimer()">
5		5
6	<div class="col-12 p-0 vh-100">	6	<div class="col-12 p-0 vh-100">
7		7
8	<app-header></app-header>	8	<app-header></app-header>
9		9
10	<!-- NOMBRE DE SECCION -->	10	<!-- NOMBRE DE SECCION -->
11	<div class="row m-0">	11	<div class="row m-0">
12	<div class="col-12 p-0">	12	<div class="col-12 p-0">
13	<p class="h5 py-1 bg-gray text-muted text-center m-0">	13	<p class="h5 py-1 bg-gray text-muted text-center m-0">
14	Pagar	14	Pagar
15	<i class="fa fa-usd"></i>	15	<i class="fa fa-usd"></i>
16	</p>	16	</p>
17	</div>	17	</div>
18	</div>	18	</div>
19		19
20	<div *ngIf="!verQR" class="row mt-4 m-3 d-flex align-items-center">	20	<div *ngIf="!verQR" class="row mt-4 m-3 d-flex align-items-center">
21	<div class="col-7 text-center">	21	<div class="col-7 text-center">
22	<p class="text-white h2" *ngIf="!verQR">Elija forma de pago</p>	22	<p class="text-white h2" *ngIf="!verQR">Elija forma de pago</p>
23	</div>	23	</div>
24	</div>	24	</div>
25		25
26	<div *ngIf="!verQR" class="row fade-in mt-3">	26	<div *ngIf="!verQR" class="row fade-in mt-3">
27	<!-- GRILLA DE PRODUCTOS DE MI COMPRA -->	27	<!-- GRILLA DE PRODUCTOS DE MI COMPRA -->
28	<div class="col-sm-7">	28	<div class="col-sm-7">
29	<div class="row ml-4 pr-3 vh-70 overflow-scroll text-dark">	29	<div class="row ml-4 pr-3 vh-70 overflow-scroll text-dark">
30	<div class="col-4 p-2">	30	<div class="col-4 p-2">
31	<div	31	<div
32	class="bg-white rounded-sm shadow border-0"	32	class="bg-white rounded-sm shadow border-0"
33	(click)="pagoEfectivo('efectivo')">	33	(click)="pagoEfectivo('efectivo')">
34	<img src="{{apiUrl}}/imagenes/efectivo.png" class="rounded-sm w-75 py-2 mx-auto d-block">	34	<img src="{{apiImagenes}}/imagenes/efectivo.png" class="rounded-sm w-75 py-2 mx-auto d-block">
35	<div class="p-2 card-text text-center">	35	<div class="p-2 card-text text-center">
36	<p class="h6 text-center m-0">Efectivo</p>	36	<p class="h6 text-center m-0">Efectivo</p>
37	</div>	37	</div>
38	</div>	38	</div>
39	</div>	39	</div>
40	<div class="col-4 p-2">	40	<div class="col-4 p-2">
41	<div class="bg-white rounded-sm shadow border-0">	41	<div class="bg-white rounded-sm shadow border-0">
42	<img src="{{apiUrl}}/imagenes/tarjeta.png" class="rounded-sm w-75 py-2 mx-auto d-block">	42	<img src="{{apiImagenes}}/imagenes/tarjeta.png" class="rounded-sm w-75 py-2 mx-auto d-block">
43	<div class="p-2 card-text text-center">	43	<div class="p-2 card-text text-center">
44	<p class="h6 text-center m-0">Tarjeta</p>	44	<p class="h6 text-center m-0">Tarjeta</p>
45	</div>	45	</div>
46	</div>	46	</div>
47	</div>	47	</div>
48	<div class="col-4 p-2">	48	<div class="col-4 p-2">
49	<div	49	<div
50	class="bg-white rounded-sm shadow border-0"	50	class="bg-white rounded-sm shadow border-0"
51	(click)="pagar('electronico')">	51	(click)="pagar('electronico')">
52	<img src="{{apiUrl}}/imagenes/qr.png" class="rounded-sm w-75 py-2 mx-auto d-block">	52	<img src="{{apiImagenes}}/imagenes/qr.png" class="rounded-sm w-75 py-2 mx-auto d-block">
53	<div class="p-2 card-text text-center">	53	<div class="p-2 card-text text-center">
54	<p class="h6 text-center m-0">Pago Electrónico</p>	54	<p class="h6 text-center m-0">Pago Electrónico</p>
55	</div>	55	</div>
56	</div>	56	</div>
57	</div>	57	</div>
58	</div>	58	</div>
59	</div>	59	</div>
60		60
61	<div class="col-sm-5 pl-0">	61	<div class="col-sm-5 pl-0">
62	<div class="row ml-3">	62	<div class="row ml-3">
63	<!-- TICKET -->	63	<!-- TICKET -->
64	<div class="col-sm-7 p-0">	64	<div class="col-sm-7 p-0">
65	<div class="card rounded-sm shadow">	65	<div class="card rounded-sm shadow">
66	<div class="card-body">	66	<div class="card-body">
67	<p class="h5 card-title">Su Ticket</p>	67	<p class="h5 card-title">Su Ticket</p>
68	<div class="row mt-4 m-0">	68	<div class="row mt-4 m-0">
69	<div class="col-12 p-0 mb-2">	69	<div class="col-12 p-0 mb-2">
70	<p class="h6 m-0 card-text text-left">	70	<p class="h6 m-0 card-text text-left">
71	<small class="font-weight-bold">DESCRIPCIÓN</small>	71	<small class="font-weight-bold">DESCRIPCIÓN</small>
72	</p>	72	</p>
73	<p class="h6 m-0 card-text text-left">	73	<p class="h6 m-0 card-text text-left">
74	<small class="font-weight-bold">CANTIDAD X PRECIO UNITARIO</small>	74	<small class="font-weight-bold">CANTIDAD X PRECIO UNITARIO</small>
75	</p>	75	</p>
76	</div>	76	</div>
77	</div>	77	</div>
78	<div class="row px-2 vh-50 overflow-scroll m-0">	78	<div class="row px-2 vh-50 overflow-scroll m-0">
79	<div class="col-12 p-0 mb-2" *ngFor="let producto of productos">	79	<div class="col-12 p-0 mb-2" *ngFor="let producto of productos">
80	<p class="h6 m-0 card-text text-left">	80	<p class="h6 m-0 card-text text-left">
81	<small>{{producto.DET_LAR}}</small>	81	<small>{{producto.DET_LAR}}</small>
82	</p>	82	</p>
83	<div class="row d-flex justify-content-between m-0">	83	<div class="row d-flex justify-content-between m-0">
84	<div class="col p-0">	84	<div class="col p-0">
85	<p class="h6 m-0 card-text text-left">	85	<p class="h6 m-0 card-text text-left">
86	<small>{{producto.cantidad}} x {{producto.PreVen \| currency}}</small>	86	<small>{{producto.cantidad}} x {{producto.PreVen \| currency}}</small>
87	</p>	87	</p>
88	</div>	88	</div>
89	<div class="col p-0">	89	<div class="col p-0">
90	<p class="h6 m-0 card-text text-right">	90	<p class="h6 m-0 card-text text-right">
91	<small>{{(producto.PreVen) * (producto.cantidad) \| currency}}</small>	91	<small>{{(producto.PreVen) * (producto.cantidad) \| currency}}</small>
92	</p>	92	</p>
93	</div>	93	</div>
94	</div>	94	</div>
95	</div>	95	</div>
96	</div>	96	</div>
97	<p class="h4 font-weight-bold card-text text-right mt-3 mb-0">	97	<p class="h4 font-weight-bold card-text text-right mt-3 mb-0">
98	Total {{getTotal() \| currency}}	98	Total {{getTotal() \| currency}}
99	</p>	99	</p>
100	</div>	100	</div>
101	</div>	101	</div>
102	</div>	102	</div>
103	</div>	103	</div>
104	</div>	104	</div>
105	</div>	105	</div>
106		106
107	<div *ngIf="verQR" class="row fade-in mt-5">	107	<div *ngIf="verQR" class="row fade-in mt-5">
108	<div class="col-6 offset-3 border-0 mb-auto">	108	<div class="col-6 offset-3 border-0 mb-auto">
109	<img src="{{apiUrl}}/imagenes/qrmp.jpg" class="w-50 mx-auto d-block shadow rounded-sm">	109	<img src="{{apiImagenes}}/imagenes/qrmp.jpg" class="w-50 mx-auto d-block shadow rounded-sm">
110	</div>	110	</div>
111	</div>	111	</div>
112		112
113	<!-- OPCIONES ABAJO DERECHA -->	113	<!-- OPCIONES ABAJO DERECHA -->
114	<div class="row m-0 fixed-bottom" >	114	<div class="row m-0 fixed-bottom" >
115	<div class="col-sm-2 offset-sm-10 p-0 mt-auto">	115	<div class="col-sm-2 offset-sm-10 p-0 mt-auto">
116	<div class="card m-2 rounded-top-sm mt-auto blue-gradient border-0">	116	<div class="card m-2 rounded-top-sm mt-auto blue-gradient border-0">
117	<div class="card-body row m-0">	117	<div class="card-body row m-0">
118	<div class="col-12 p-3">	118	<div class="col-12 p-3">
119	<button	119	<button
120	type="button"	120	type="button"
121	class="btn btn-block btn-light shadow btn-sm shadow"	121	class="btn btn-block btn-light shadow btn-sm shadow"
122	(click)="volverPreviousPage()">	122	(click)="volverPreviousPage()">
123	<span class="pr-2">Volver</span>	123	<span class="pr-2">Volver</span>
124	<i class="fa fa-undo text-warning"></i>	124	<i class="fa fa-undo text-warning"></i>
125	</button>	125	</button>
126	<button	126	<button
127	type="button"	127	type="button"
128	class="btn btn-block btn-light shadow btn-sm shadow"	128	class="btn btn-block btn-light shadow btn-sm shadow"
129	[routerLink]="['/cancelar-compra']">	129	[routerLink]="['/cancelar-compra']">
130	<span class="pr-2">Cancelar</span>	130	<span class="pr-2">Cancelar</span>
131	<i class="fa fa-times text-danger"></i>	131	<i class="fa fa-times text-danger"></i>
132	</button>	132	</button>
133	</div>	133	</div>
134	</div>	134	</div>
135	</div>	135	</div>
136	</div>	136	</div>
137	</div>	137	</div>
138		138
139	</div>	139	</div>
140		140
141	</div>	141	</div>
142		142
143	<div	143	<div
144	*ngIf="compraConQRfinalizada"	144	*ngIf="compraConQRfinalizada"
145	class="row m-0 fade-in bg-primary-gradient disable-user-select vh-100">	145	class="row m-0 fade-in bg-primary-gradient disable-user-select vh-100">
146	<div class="col-12 text-center text-white my-auto">	146	<div class="col-12 text-center text-white my-auto">
147	<p class="font-weight-bold display-4">	147	<p class="font-weight-bold display-4">
148	Su pago fue<br>	148	Su pago fue<br>
149	acreditado	149	acreditado
150	exitosamente	150	exitosamente
151	</p>	151	</p>
152	<p class="font-weight-bold display-4">Recuerde retirar su ticket</p>	152	<p class="font-weight-bold display-4">Recuerde retirar su ticket</p>
153	</div>	153	</div>
154	</div>	154	</div>
155		155
156	<div	156	<div
157	*ngIf="compraConEfectivofinalizada"	157	*ngIf="compraConEfectivofinalizada"
158	class="row m-0 fade-in bg-primary-gradient disable-user-select vh-100">	158	class="row m-0 fade-in bg-primary-gradient disable-user-select vh-100">
159	<div class="col-12 text-center text-white my-auto">	159	<div class="col-12 text-center text-white my-auto">
160	<p class="font-weight-bold display-4">	160	<p class="font-weight-bold display-4">
161	Retire su ticket<br>	161	Retire su ticket<br>
162	y diríjase a caja para<br>	162	y diríjase a caja para<br>
163	efectuar el pago.	163	efectuar el pago.
164	</p>	164	</p>
165	</div>	165	</div>
166	</div>	166	</div>
167		167

src/app/components/pago/pago.component.ts

Diff comments View file @ 5c153ab

1	import { Component, OnInit, OnDestroy } from '@angular/core';	1	import { Component, OnInit, OnDestroy } from '@angular/core';
2	import { appSettings } from 'src/etc/AppSettings';	2	import { appSettings } from 'src/etc/AppSettings';
3	import { Location } from '@angular/common';	3	import { Location } from '@angular/common';
4	import { ProductoService } from 'src/app/services/producto.service';	4	import { ProductoService } from 'src/app/services/producto.service';
5	import { Router } from '@angular/router';	5	import { Router } from '@angular/router';
6	import { Producto } from 'src/app/wrappers/producto';	6	import { Producto } from 'src/app/wrappers/producto';
7		7
8	@Component({	8	@Component({
9	selector: 'app-pago',	9	selector: 'app-pago',
10	templateUrl: './pago.component.html',	10	templateUrl: './pago.component.html',
11	styleUrls: ['./pago.component.scss']	11	styleUrls: ['./pago.component.scss']
12	})	12	})
13	export class PagoComponent implements OnInit, OnDestroy {	13	export class PagoComponent implements OnInit, OnDestroy {
14		14
15	private apiUrl: string = appSettings.apiUrl;	15	private apiImagenes: string = appSettings.apiImagenes;
16	private verQR: boolean = false;	16	private verQR: boolean = false;
17	private productos: Producto[] = [];	17	private productos: Producto[] = [];
18	private total: number = 0;	18	private total: number = 0;
19		19
20	private compraConQRfinalizada: boolean = false;	20	private compraConQRfinalizada: boolean = false;
21	private compraConEfectivofinalizada: boolean = false;	21	private compraConEfectivofinalizada: boolean = false;
22	private timerReposo: any;	22	private timerReposo: any;
23		23
24	constructor(	24	constructor(
25	private productoService: ProductoService,	25	private productoService: ProductoService,
26	private location: Location,	26	private location: Location,
27	private router: Router,	27	private router: Router,
28	) { }	28	) { }
29		29
30	ngOnInit() {	30	ngOnInit() {
31		31
32	this.timerReposo = setTimeout(() => {	32	this.timerReposo = setTimeout(() => {
33		33
34	this.router.navigate(['cancelar-compra']);	34	this.router.navigate(['cancelar-compra']);
35	}, 90000)	35	}, 90000)
36	this.productos = this.productoService.productos;	36	this.productos = this.productoService.productos;
37	}	37	}
38		38
39	ngOnDestroy() {	39	ngOnDestroy() {
40		40
41	clearTimeout(this.timerReposo);	41	clearTimeout(this.timerReposo);
42	}	42	}
43		43
44	pagoEfectivo() {	44	pagoEfectivo() {
45		45
46	this.compraConEfectivofinalizada = true;	46	this.compraConEfectivofinalizada = true;
47	clearTimeout(this.timerReposo);	47	clearTimeout(this.timerReposo);
48	setTimeout(() => {	48	setTimeout(() => {
49		49
50	this.router.navigate(['mensaje-final']);	50	this.router.navigate(['mensaje-final']);
51	}, 3000);	51	}, 3000);
52	}	52	}
53		53
54	pagar(medioPago: string) {	54	pagar(medioPago: string) {
55		55
56	this.verQR = true;	56	this.verQR = true;
57		57
58	this.productoService.pagar(medioPago)	58	this.productoService.pagar(medioPago)
59	.subscribe(() => {	59	.subscribe(() => {
60		60
61	clearTimeout(this.timerReposo);	61	clearTimeout(this.timerReposo);
62	this.compraConQRfinalizada = true;	62	this.compraConQRfinalizada = true;
63	setTimeout(() => {	63	setTimeout(() => {
64		64
65	this.router.navigate(['mensaje-final']);	65	this.router.navigate(['mensaje-final']);
66	}, 3000);	66	}, 3000);
67	}, err => {	67	}, err => {
68	console.log(err);	68	console.log(err);
69	alert('algo salió mal');	69	alert('algo salió mal');
70	})	70	})
71	}	71	}
72		72
73	volverPreviousPage() {	73	volverPreviousPage() {
74		74
75	if (this.verQR) {	75	if (this.verQR) {
76	this.verQR = false;	76	this.verQR = false;
77	return;	77	return;
78	}	78	}
79	this.location.back();	79	this.location.back();
80	}	80	}
81		81
82	getTotal() {	82	getTotal() {
83		83
84	var subTotal = 0;	84	var subTotal = 0;
85	this.productos.forEach(producto => {	85	this.productos.forEach(producto => {
86		86
87	subTotal = subTotal + (producto.PreVen * producto.cantidad);	87	subTotal = subTotal + (producto.PreVen * producto.cantidad);
88	});	88	});
89	return this.total = subTotal;	89	return this.total = subTotal;
90	}	90	}
91		91
92	reiniciarTimer() {	92	reiniciarTimer() {
93		93
94	clearTimeout(this.timerReposo);	94	clearTimeout(this.timerReposo);
95	this.timerReposo = setTimeout(() => {	95	this.timerReposo = setTimeout(() => {
96		96
97	this.router.navigate(['cancelar-compra']);	97	this.router.navigate(['cancelar-compra']);
98	}, 90000)	98	}, 90000)
99	}	99	}
100		100
101	}	101	}
102		102

src/app/components/sidebar/sidebar.component.html

Diff comments View file @ 5c153ab

1	<div class="disable-user-select d-flex align-items-center flex-column h-100 pt-2 text-center">	1	<div class="disable-user-select d-flex align-items-center flex-column h-100 pt-2 text-center">
2		2
3	<!-- ENCABEZADO -->	3	<!-- ENCABEZADO -->
4	<p class="h4 border-bottom border-white text-white mt-4 pb-2">	4	<p class="h4 border-bottom border-white text-white mt-4 pb-2">
5	Mi compra	5	Mi compra
6	<i class="fa fa-shopping-cart" aria-hidden="true"></i>	6	<i class="fa fa-shopping-cart" aria-hidden="true"></i>
7	</p>	7	</p>
8		8
9	<div class="overflow-auto overflow-scroll mb-2 w-100">	9	<div class="overflow-auto overflow-scroll mb-2 w-100">
10	<!-- PRODUCTOS CARRITO -->	10	<!-- PRODUCTOS CARRITO -->
11	<div	11	<div
12	class="slide-in-bl my-2 bg-white border-0 rounded-sm"	12	class="slide-in-bl my-2 bg-white border-0 rounded-sm"
13	*ngFor="let producto of productosCarrito.slice().reverse(); let i = index">	13	*ngFor="let producto of productosCarrito.slice().reverse(); let i = index">
14	<img class="w-100 m-auto rounded-sm shadow" src="{{apiUrl}}/imagenes/{{producto.imagenes[0].imagen}}">	14	<img class="w-100 m-auto rounded-sm shadow" src="{{apiImagenes}}/imagenes/{{producto.imagenes[0].imagen}}">
15	<div class="row m-0 p-0 px-1 py-1 shadow rounded-sm">	15	<div class="row m-0 p-0 px-1 py-1 shadow rounded-sm">
16	<div class="col-12 p-0 pt-2 text-left my-auto">	16	<div class="col-12 p-0 pt-2 text-left my-auto">
17	<p class="m-0 h6"><small>{{producto.DetArt}}</small></p>	17	<p class="m-0 h6"><small>{{producto.DetArt}}</small></p>
18	</div>	18	</div>
19	<div class="col-12 pr-1 text-right h6 my-auto ">	19	<div class="col-12 pr-1 text-right h6 my-auto ">
20	<p class="m-0">{{producto.PreVen \| currency}}</p>	20	<p class="m-0">{{producto.PreVen \| currency}}</p>
21	</div>	21	</div>
22	</div>	22	</div>
23		23
24	<!-- BOTONES -->	24	<!-- BOTONES -->
25	<div class="row m-0 d-flex justify-content-between">	25	<div class="row m-0 d-flex justify-content-between">
26		26
27	<!-- SUMAR - RESTAR CANTIDAD -->	27	<!-- SUMAR - RESTAR CANTIDAD -->
28	<div class="col-auto px-1 my-2">	28	<div class="col-auto px-1 my-2">
29	<div class="btn-group-sm btn-group float-left my-auto" role="group">	29	<div class="btn-group-sm btn-group float-left my-auto" role="group">
30	<button	30	<button
31	type="button"	31	type="button"
32	class="btn btn-light btn-sm my-auto border shadow"	32	class="btn btn-light btn-sm my-auto border shadow"
33	(click)="aumentarCantidad(producto)">	33	(click)="aumentarCantidad(producto)">
34	<i class="fa fa-plus" aria-hidden="true"></i>	34	<i class="fa fa-plus" aria-hidden="true"></i>
35	</button>	35	</button>
36	<div class="bg-white border border-white px-2 my-auto text-dark h5 shadow">	36	<div class="bg-white border border-white px-2 my-auto text-dark h5 shadow">
37	<small>{{producto.cantidad}}</small>	37	<small>{{producto.cantidad}}</small>
38	</div>	38	</div>
39	<button	39	<button
40	type="button"	40	type="button"
41	class="btn btn-light btn-sm my-auto border shadow"	41	class="btn btn-light btn-sm my-auto border shadow"
42	(click)="restarCantidad(producto)">	42	(click)="restarCantidad(producto)">
43	<i class="fa fa-minus" aria-hidden="true"></i>	43	<i class="fa fa-minus" aria-hidden="true"></i>
44	</button>	44	</button>
45	</div>	45	</div>
46	</div>	46	</div>
47		47
48	<!-- PERSONALIZAR -->	48	<!-- PERSONALIZAR -->
49	<div class="col-auto px-1 my-2">	49	<div class="col-auto px-1 my-2">
50	<button	50	<button
51	*ngIf="producto.tieneSinonimos"	51	*ngIf="producto.tieneSinonimos"
52	type="button"	52	type="button"
53	class="btn btn-light btn-sm my-auto float-left border shadow"	53	class="btn btn-light btn-sm my-auto float-left border shadow"
54	(click)="personalizarPromo(producto, i)">	54	(click)="personalizarPromo(producto, i)">
55	<i class="fa fa-refresh text-purple" aria-hidden="true"></i>	55	<i class="fa fa-refresh text-purple" aria-hidden="true"></i>
56	</button>	56	</button>
57	</div>	57	</div>
58		58
59	<!-- BORRAR -->	59	<!-- BORRAR -->
60	<div class="col-auto px-1 my-2">	60	<div class="col-auto px-1 my-2">
61	<button	61	<button
62	type="button"	62	type="button"
63	class="btn btn-secondary btn-sm my-auto shadow"	63	class="btn btn-secondary btn-sm my-auto shadow"
64	(click)="deleteProducto(producto, i)">	64	(click)="deleteProducto(producto, i)">
65	<i class="fa fa-trash" aria-hidden="true"></i>	65	<i class="fa fa-trash" aria-hidden="true"></i>
66	</button>	66	</button>
67	</div>	67	</div>
68	</div>	68	</div>
69	</div>	69	</div>
70	</div>	70	</div>
71		71
72	<!-- TOTAL -->	72	<!-- TOTAL -->
73	<div class="card rounded-top-sm mt-auto blue-gradient border-0">	73	<div class="card rounded-top-sm mt-auto blue-gradient border-0">
74	<div class="card-body row">	74	<div class="card-body row">
75	<div class="col-12">	75	<div class="col-12">
76	<p	76	<p
77	class="h4 border-bottom border-secondary text-secondary pb-2">	77	class="h4 border-bottom border-secondary text-secondary pb-2">
78	({{getCantidadProductos()}}) artículos	78	({{getCantidadProductos()}}) artículos
79	</p>	79	</p>
80	<p class="h3 text-secondary">Total</p>	80	<p class="h3 text-secondary">Total</p>
81	<p class="h3 font-weight-bold">{{getTotal() \| currency}}</p>	81	<p class="h3 font-weight-bold">{{getTotal() \| currency}}</p>
82	</div>	82	</div>
83	<div class="col-12">	83	<div class="col-12">
84	<button	84	<button
85	*ngIf="getCantidadProductos() > 0"	85	*ngIf="getCantidadProductos() > 0"
86	type="button"	86	type="button"
87	class="btn btn-block btn-light btn-lg shadow mb-2 p-1"	87	class="btn btn-block btn-light btn-lg shadow mb-2 p-1"
88	routerLink="/confirmacion-carrito">	88	routerLink="/confirmacion-carrito">
89	<span class="font-weight-bold pr-1">Finalizar y Pagar</span>	89	<span class="font-weight-bold pr-1">Finalizar y Pagar</span>
90	<i class="fa fa-check text-success" aria-hidden="true"></i>	90	<i class="fa fa-check text-success" aria-hidden="true"></i>
91	</button>	91	</button>
92	<button	92	<button
93	type="button"	93	type="button"
94	class="btn btn-block btn-light shadow btn-sm shadow"	94	class="btn btn-block btn-light shadow btn-sm shadow"
95	[routerLink]="['/cancelar-compra']">	95	[routerLink]="['/cancelar-compra']">
96	<span class="pr-1">Cancelar</span>	96	<span class="pr-1">Cancelar</span>
97	<i class="fa fa-times text-danger" aria-hidden="true"></i>	97	<i class="fa fa-times text-danger" aria-hidden="true"></i>
98	</button>	98	</button>
99	</div>	99	</div>
100	</div>	100	</div>
101	</div>	101	</div>
102	</div>	102	</div>
103		103

src/app/components/sidebar/sidebar.component.ts

Diff comments View file @ 5c153ab

1	import { Component, OnInit } from '@angular/core';	1	import { Component, OnInit } from '@angular/core';
2	import { Producto } from 'src/app/wrappers/producto';	2	import { Producto } from 'src/app/wrappers/producto';
3	import { appSettings } from 'src/etc/AppSettings';	3	import { appSettings } from 'src/etc/AppSettings';
4	import { ProductoService } from 'src/app/services/producto.service';	4	import { ProductoService } from 'src/app/services/producto.service';
5	import { Router } from '@angular/router';	5	import { Router } from '@angular/router';
6		6
7	@Component({	7	@Component({
8	selector: 'app-sidebar',	8	selector: 'app-sidebar',
9	templateUrl: './sidebar.component.html',	9	templateUrl: './sidebar.component.html',
10	styleUrls: ['./sidebar.component.scss'],	10	styleUrls: ['./sidebar.component.scss'],
11	})	11	})
12	export class SidebarComponent implements OnInit {	12	export class SidebarComponent implements OnInit {
13		13
14	private cantTotal: number = 0;	14	private cantTotal: number = 0;
15	private cantMin: number = 1;	15	private cantMin: number = 1;
16	private cantMax: number = 50;	16	private cantMax: number = 50;
17	private total: number = 0;	17	private total: number = 0;
18	private apiUrl: string = appSettings.apiUrl;	18	private apiImagenes: string = appSettings.apiImagenes;
19		19
20	public productosCarrito: Producto[] = [];	20	public productosCarrito: Producto[] = [];
21		21
22	constructor(	22	constructor(
23	private productoService: ProductoService,	23	private productoService: ProductoService,
24	private router: Router) {	24	private router: Router) {
25	this.router.routeReuseStrategy.shouldReuseRoute = function () {	25	this.router.routeReuseStrategy.shouldReuseRoute = function () {
26	return false;	26	return false;
27	}	27	}
28	}	28	}
29		29
30	ngOnInit() {	30	ngOnInit() {
31		31
32	this.productosCarrito = this.productoService.productos;	32	this.productosCarrito = this.productoService.productos;
33	}	33	}
34		34
35	getCantidadProductos() {	35	getCantidadProductos() {
36		36
37	var cantTotalAux = 0;	37	var cantTotalAux = 0;
38	this.productosCarrito.forEach(producto => {	38	this.productosCarrito.forEach(producto => {
39		39
40	cantTotalAux += producto.cantidad;	40	cantTotalAux += producto.cantidad;
41	});	41	});
42	this.cantTotal = cantTotalAux;	42	this.cantTotal = cantTotalAux;
43		43
44	return this.cantTotal;	44	return this.cantTotal;
45	}	45	}
46		46
47	getTotal() {	47	getTotal() {
48		48
49	var subTotal = 0;	49	var subTotal = 0;
50	for (let i = 0; i < this.productosCarrito.length; i++) {	50	for (let i = 0; i < this.productosCarrito.length; i++) {
51	subTotal = subTotal + (this.productosCarrito[i].PreVen * this.productosCarrito[i].cantidad);	51	subTotal = subTotal + (this.productosCarrito[i].PreVen * this.productosCarrito[i].cantidad);
52	}	52	}
53	return this.total = subTotal;	53	return this.total = subTotal;
54	}	54	}
55		55
56	aumentarCantidad(producto: Producto) {	56	aumentarCantidad(producto: Producto) {
57		57
58	if (producto.cantidad < this.cantMax) {	58	if (producto.cantidad < this.cantMax) {
59	producto.cantidad++;	59	producto.cantidad++;
60	this.cantTotal++	60	this.cantTotal++
61	}	61	}
62	}	62	}
63		63
64	restarCantidad(producto: Producto) {	64	restarCantidad(producto: Producto) {
65		65
66	if (producto.cantidad > this.cantMin) {	66	if (producto.cantidad > this.cantMin) {
67	producto.cantidad--;	67	producto.cantidad--;
68	this.cantTotal--;	68	this.cantTotal--;
69	}	69	}
70	}	70	}
71		71
72	deleteProducto(producto: Producto, index: number) {	72	deleteProducto(producto: Producto, index: number) {
73		73
74	this.cantTotal -= producto.cantidad;	74	this.cantTotal -= producto.cantidad;
75	this.total -= producto.PreVen * producto.cantidad;	75	this.total -= producto.PreVen * producto.cantidad;
76	this.productosCarrito.reverse().splice(index, 1);	76	this.productosCarrito.reverse().splice(index, 1);
77	return;	77	return;
78	}	78	}
79		79
80	personalizarPromo(producto: Producto, index) {	80	personalizarPromo(producto: Producto, index) {
81		81
82	this.productoService.productoAcargar = producto;	82	this.productoService.productoAcargar = producto;
83	this.deleteProducto(producto, index);	83	this.deleteProducto(producto, index);
84	this.router.navigate(['inicio']);	84	this.router.navigate(['inicio']);
85	}	85	}
86		86
87	}	87	}
88		88

src/etc/AppSettings ejemplo.ts

Diff comments View file @ 5c153ab

1	export const appSettings = {	1	export const appSettings = {
2	// apiUrl: 'http://10.231.45.117:4705/autoservicio'	2	// apiUrl: 'http://10.231.45.117:4705/autoservicio',
		3	// apiImagenes: 'http://10.231.45.117:4513/'
3	};	4	};
4		5