Marcelo Puebla / autoservicio-axion

Download as
Browse Code »

Commit 282e37b43f4f5e2f8a2f4b71fb611326d45608fb

Authored by Marcelo Puebla
1 parent 6411466d3d
Exists in develop

Agregado publicidades y promociones

Showing 13 changed files with 173 additions and 156 deletions   Show diff stats
src/app/interfaces/IPublicidad.ts
Diff comments   View file @ 282e37b
... ... @@ -6,6 +6,7 @@ export interface IPublicidad {
6 6 DET_LAR?: string;
7 7 id?: number;
8 8 base64?: any;
  9 + id_articulo?: number;
9 10 }
10 11  
11 12 export class Publicidad {
... ... @@ -16,6 +17,7 @@ export class Publicidad {
16 17 DET_LAR?: string;
17 18 id?: number;
18 19 base64?: any;
  20 + id_articulo?: number;
19 21  
20 22 constructor(publicidad?: Partial<Publicidad>) {
21 23 if (publicidad) {
src/app/modules/admin/admin.component.ts
Diff comments   View file @ 282e37b
1 1 import { Component, OnInit, HostListener } from '@angular/core';
2 2 import { Router } from '@angular/router';
3   -import { BsModalRef } from 'ngx-bootstrap/modal';
4 3  
5 4 @Component({
6 5 selector: 'app-admin',
... ... @@ -13,9 +12,8 @@ export class AdminComponent implements OnInit {
13 12  
14 13 constructor(
15 14 private router: Router,
16   - // private modalRef: BsModalRef
17   - ) { }
18   -
  15 + ) { }
  16 +
19 17 ngOnInit() {
20 18 this.startTimeOutInactividad();
21 19 }
... ... @@ -35,7 +33,6 @@ export class AdminComponent implements OnInit {
35 33  
36 34 startTimeOutInactividad() {
37 35 this.timerReposo = setTimeout(() => {
38   - // this.modalRef.hide();
39 36 this.router.navigate(['cancelar-compra']);
40 37 }, 90000);
41 38 }
src/app/modules/carrito/carrito.component.ts
Diff comments   View file @ 282e37b
1   -import { Component, OnInit } from '@angular/core';
  1 +import { Component, OnInit, OnDestroy } from '@angular/core';
2 2 import { Location } from '@angular/common';
3 3 import { ArticuloService } from 'src/app/services/articulo/articulo.service';
4 4 import { APP_SETTINGS } from 'src/etc/AppSettings';
5 5 import { trigger, state, style, transition, animate } from '@angular/animations';
6 6 import { IArticulo } from 'src/app/interfaces/IArticulo';
7 7 import { Router } from '@angular/router';
  8 +import { BsModalRef } from 'ngx-bootstrap/modal/public_api';
8 9  
9 10 @Component({
10 11 selector: 'app-carrito',
... ... @@ -23,9 +24,10 @@ import { Router } from &#39;@angular/router&#39;;
23 24 ])
24 25 ]
25 26 })
26   -export class CarritoComponent implements OnInit {
  27 +export class CarritoComponent implements OnInit, OnDestroy {
27 28 urlImagenes = `${APP_SETTINGS.apiDeboSuite}/imagenes/`;
28 29 maxCantidad = 50;
  30 + modalRef: BsModalRef;
29 31  
30 32 constructor(
31 33 public articuloService: ArticuloService,
... ... @@ -40,6 +42,10 @@ export class CarritoComponent implements OnInit {
40 42 }
41 43 }
42 44  
  45 + ngOnDestroy() {
  46 + if (this.modalRef) this.modalRef.hide();
  47 + }
  48 +
43 49 deleteArticulo(index: number) {
44 50 this.articuloService.carrito.splice(index, 1);
45 51 this.articuloService.calcularTotal();
src/app/modules/seleccion-articulos/seleccion-articulos.component.html
Diff comments   View file @ 282e37b
... ... @@ -100,7 +100,7 @@
100 100 <div
101 101 [ngClass]="{'bg-secondary': articulo.promo}"
102 102 class="row mx-0 justify-content-between bg-primary badge-pill"
103   - (click)="!articulo.FPP ? elegirArticulo(articulo) : openModalPromos(articulo, templatePromos)">
  103 + (click)="elegirArticulo(articulo)">
104 104 <div class="col px-0 align-self-center text-white text-right">
105 105 {{articulo.PreVen | currency}}
106 106 </div>
... ... @@ -224,57 +224,3 @@
224 224 </div>
225 225  
226 226 </div>
227   -
228   -<ng-template #templatePromos>
229   - <div class="modal-header bg-primary">
230   - <div class="col-12">
231   - <div class="row justify-content-between" *ngIf="articuloPromo.length">
232   - <div>
233   - <h3 class="ml-2 text-white mt-2">{{articuloPromo[0].DetArt}}</h3>
234   - </div>
235   - <div class="row"(click)="elegirArticulo(articuloPromo[0]); modalRef.hide()">
236   - <div
237   - class="row mr-3 justify-content-between bg-white badge-pill">
238   - <div class="col px-0 align-self-center text-primary">
239   - <p class="font-weight-bold">{{articuloPromo[0].PreVen | currency}}</p>
240   - </div>
241   - <div class="col-3 px-0">
242   - <img
243   - draggable="false"
244   - ondragstart="return false;"
245   - (contextmenu)="false"
246   - class="d-block ml-auto py-1 icon-30 mr-2 pt-2"
247   - src="assets/img/ir-color.svg">
248   - </div>
249   - </div>
250   - </div>
251   - </div>
252   - <div class="col-12 border-bottom mt-3 mx-n3"></div>
253   - </div>
254   - </div>
255   - <div class="modal-body bg-primary" *ngIf="articuloPromo.length">
256   - <div class="row">
257   - <div class="col-9">
258   - <p class="text-white"><small>¿TE GUSTARIA LLEVAR ESTE ARTÍCULO</small></p>
259   - <h1 class="text-white mb-4">en un combo?</h1>
260   - <div *ngFor="let promo of promociones">
261   - <div class="mx-0 bg-white badge-pill text-primary" (click)="elegirArticulo(promo); modalRef.hide()">
262   - <div class="row justify-content-between">
263   - <p class="ml-4 text-truncate">{{promo.DetArt}}</p>
264   - <p class="mr-4 font-weight-bold">{{promo.PreVen | currency}}</p>
265   - </div>
266   - </div>
267   - </div>
268   - </div>
269   - <div class="col-3 rounded-circle">
270   - <img
271   - draggable="false"
272   - ondragstart="return false;"
273   - (contextmenu)="false"
274   - src="{{urlImagenes}}{{articuloPromo[0].imagenes[0].imagen}}"
275   - onerror="this.src='assets/img/image-not-found.jpg'"
276   - class="card-img-top h-90 w-90 rounded-circle">
277   - </div>
278   - </div>
279   - </div>
280   - </ng-template>
281 227 \ No newline at end of file
src/app/modules/seleccion-articulos/seleccion-articulos.component.ts
Diff comments   View file @ 282e37b
1   -import { Component, OnInit, TemplateRef } from '@angular/core';
  1 +import { Component, OnInit, TemplateRef, OnDestroy } from '@angular/core';
2 2 import { BsModalRef, BsModalService } from 'ngx-bootstrap/modal';
3 3 import { ArticuloService } from 'src/app/services/articulo/articulo.service';
4 4 import { IArticulo } from 'src/app/interfaces/IArticulo';
... ... @@ -6,13 +6,14 @@ import { APP_SETTINGS } from &#39;src/etc/AppSettings&#39;;
6 6 import { ICategoria } from 'src/app/interfaces/ICategoria';
7 7 import { CategoriaService } from 'src/app/services/categoria/categoria.service';
8 8 import { PromocionService } from 'src/app/services/promocion/promocion.service';
  9 +import { PromocionComponent } from 'src/app/shared/promocion/promocion.component';
9 10  
10 11 @Component({
11 12 selector: 'app-seleccion-articulos',
12 13 templateUrl: './seleccion-articulos.component.html',
13 14 styleUrls: ['./seleccion-articulos.component.scss']
14 15 })
15   -export class SeleccionArticulosComponent implements OnInit {
  16 +export class SeleccionArticulosComponent implements OnInit, OnDestroy {
16 17 showSpinner = true;
17 18 timeoutHandler: any;
18 19 urlImagenes = `${APP_SETTINGS.apiDeboSuite}/imagenes/`;
... ... @@ -27,20 +28,21 @@ export class SeleccionArticulosComponent implements OnInit {
27 28 allActive = true;
28 29 modalRef: BsModalRef;
29 30 total = 0;
30   - articuloPromo: IArticulo[] = [];
31   - promociones: IArticulo[] = [];
32 31  
33 32 constructor(
34 33 public articuloService: ArticuloService,
35 34 private categoriaService: CategoriaService,
36 35 private modalService: BsModalService,
37   - private promocionService: PromocionService,
38 36 ) { }
39 37  
40 38 ngOnInit() {
41 39 this.getCategorias();
42 40 }
43 41  
  42 + ngOnDestroy() {
  43 + if (this.modalRef) this.modalRef.hide();
  44 + }
  45 +
44 46 getCategorias() {
45 47 this.categoriaService.getAll()
46 48 .subscribe((categorias: ICategoria[]) => {
... ... @@ -125,32 +127,29 @@ export class SeleccionArticulosComponent implements OnInit {
125 127 }
126 128  
127 129 elegirArticulo(articulo: IArticulo) {
128   - this.articuloService.getById(articulo.id)
129   - .subscribe((res: IArticulo) => {
130   - res.cantidad = 1;
131   - this.articuloService.setArticulo(res);
132   - }, err => console.error(err));
  130 + if (!articulo.FPP) {
  131 + this.getByID(articulo.id);
  132 + } else {
  133 + this.openModalPromos(articulo);
  134 + }
133 135 }
134 136  
135   - openModalPromos(articulo: IArticulo, templatePromos: TemplateRef<any>) {
136   - this.articuloService.getById(articulo.id)
  137 + getByID(id: number) {
  138 + this.articuloService.getById(id)
137 139 .subscribe((res: IArticulo) => {
138   - this.articuloPromo[0] = res;
139   - this.getPromociones();
  140 + res.cantidad = 1;
  141 + this.articuloService.setArticulo(res);
140 142 }, err => console.error(err));
141   - this.modalRef = this.modalService.show(templatePromos, { class: 'custom-modal modal-dialog-centered', backdrop: 'static' });
142   - setTimeout(() => {
143   - this.modalRef.hide();
144   - }, 80000);
145 143 }
146 144  
147   - getPromociones() {
148   - var sector = this.articuloPromo[0].CodSec;
149   - var codigo = this.articuloPromo[0].CodArt;
150   - this.promocionService.getPromociones(sector, codigo)
151   - .subscribe((res: IArticulo[]) => {
152   - this.promociones = res;
153   - }, error => { console.error(error); })
  145 + openModalPromos(articulo: IArticulo) {
  146 + this.modalRef = this.modalService.show(PromocionComponent,
  147 + {
  148 + initialState: {
  149 + idArticulo: articulo.id
  150 + },
  151 + class: 'modal-promo modal-dialog-centered'
  152 + });
154 153 }
155 154  
156 155 increaseShow() {
src/app/services/publicidad/publicidad.service.ts
Diff comments   View file @ 282e37b
1 1 import { Injectable } from '@angular/core';
2 2 import { HttpClient } from '@angular/common/http';
3 3 import { APP_SETTINGS } from 'src/etc/AppSettings';
4   -import { IPublicidad } from 'src/wrappers/publicidad';
  4 +import { IPublicidad } from 'src/app/interfaces/IPublicidad';
5 5  
6 6 @Injectable({
7 7 providedIn: 'root'
... ... @@ -31,4 +31,4 @@ export class PublicidadService {
31 31 delete(id: any) {
32 32 return this.http.delete(`${this.urlDeboSuite}/publicidad/${id}`);
33 33 }
34   -}
35 34 \ No newline at end of file
  35 +}
src/app/shared/header-publicidad/header-publicidad.component.html
Diff comments   View file @ 282e37b
... ... @@ -8,7 +8,8 @@
8 8 draggable="false"
9 9 ondragstart="return false;"
10 10 (contextmenu)="false"
11   - src="{{urlImagenes}}{{p.imagen}}">
  11 + src="{{urlImagenes}}{{p.imagen}}"
  12 + (click)="elegirArticulo(p)">
12 13 </slide>
13 14 </carousel>
14 15 </div>
src/app/shared/header-publicidad/header-publicidad.component.ts
Diff comments   View file @ 282e37b
... ... @@ -2,6 +2,10 @@ import { Component, OnInit } from &#39;@angular/core&#39;;
2 2 import { APP_SETTINGS } from 'src/etc/AppSettings';
3 3 import { IPublicidad } from 'src/app/interfaces/IPublicidad';
4 4 import { PublicidadService } from 'src/app/services/publicidad/publicidad.service';
  5 +import { IArticulo } from 'src/app/interfaces/IArticulo';
  6 +import { PromocionComponent } from '../promocion/promocion.component';
  7 +import { BsModalService, BsModalRef } from 'ngx-bootstrap/modal';
  8 +import { ArticuloService } from 'src/app/services/articulo/articulo.service';
5 9  
6 10 @Component({
7 11 selector: 'app-header-publicidad',
... ... @@ -11,9 +15,12 @@ import { PublicidadService } from &#39;src/app/services/publicidad/publicidad.servic
11 15 export class HeaderPublicidadComponent implements OnInit {
12 16 urlImagenes = `${APP_SETTINGS.apiDeboSuite}/imagenes/`;
13 17 publicidades: IPublicidad[] = [];
  18 + modalRef: BsModalRef;
14 19  
15 20 constructor(
16 21 private publicidadService: PublicidadService,
  22 + private articuloService: ArticuloService,
  23 + private modalService: BsModalService,
17 24 ) { }
18 25  
19 26 ngOnInit() {
... ... @@ -27,4 +34,31 @@ export class HeaderPublicidadComponent implements OnInit {
27 34 }, err => console.error(err));
28 35 }
29 36  
  37 + elegirArticulo(publicidad: IPublicidad) {
  38 + if (publicidad.id_articulo) this.getByID(publicidad.id_articulo);
  39 + }
  40 +
  41 +
  42 + getByID(id: number) {
  43 + this.articuloService.getById(id)
  44 + .subscribe((res: IArticulo) => {
  45 + if (res.FPP) {
  46 + this.openModalPromos(res);
  47 + return;
  48 + }
  49 + res.cantidad = 1;
  50 + this.articuloService.setArticulo(res);
  51 + }, err => console.error(err));
  52 + }
  53 +
  54 + openModalPromos(articulo: IArticulo) {
  55 + this.modalRef = this.modalService.show(PromocionComponent,
  56 + {
  57 + initialState: {
  58 + idArticulo: articulo.id
  59 + },
  60 + class: 'modal-promo modal-dialog-centered'
  61 + });
  62 + }
  63 +
30 64 }
src/app/shared/promocion/promocion.component.html
Diff comments   View file @ 282e37b
1   -<div class="p-3">
2   - <div class="row mx-0 justify-content-end">
3   - <div
4   - class="col-auto px-0 btn-effect"
5   - (click)="modalRef.hide()">
6   - <img
7   - draggable="false"
8   - ondragstart="return false;"
9   - (contextmenu)="false"
10   - class="icon-30 rotate-45"
11   - src="assets/img/mas-blanco.svg">
12   - </div>
13   - </div>
14   - <div class="row mb-4 mx-0 text-center">
15   - <div class="col-7 align-self-center">
16   - <p class="h6 text-muted mb-2"><small>{{'ENSALADA CAESAR'}}</small></p>
17   - <p class="h6"><small>¿QUERÉS LLEVAR ESTA ENSALADA</small></p>
18   - <p class="h4 mb-2 font-weight-bold">en combo con 1 bebida?</p>
19   - <div class="row">
20   - <div class="col-6 pl-0">
21   - <div
22   - class="row mx-0 justify-content-between bg-light badge-pill btn-effect">
23   - <div class="col px-0 align-self-center text-primary">
24   - <p class="d-block">
25   - <small class="pr-2">{{'Sola'}} {{155 | currency}}</small>
26   - <img
27   - draggable="false"
28   - ondragstart="return false;"
29   - (contextmenu)="false"
30   - class="icon-20"
31   - src="assets/img/ir-color.svg">
32   - </p>
33   - </div>
  1 +<div class="modal-header bg-primary">
  2 + <div class="col-12">
  3 + <div class="row justify-content-between" *ngIf="articulosPromo.length">
  4 + <div>
  5 + <h3 class="ml-2 text-white mt-2">{{articulosPromo[0].DetArt}}</h3>
  6 + </div>
  7 + <div>
  8 + <div
  9 + class="row mr-3 justify-content-between bg-white badge-pill"
  10 + (click)="elegirPromo(articulosPromo[0])">
  11 + <div class="col px-0 align-self-center text-primary">
  12 + <p class="font-weight-bold">{{articulosPromo[0].PreVen | currency}}</p>
  13 + </div>
  14 + <div class="col-3 px-0">
  15 + <img
  16 + draggable="false"
  17 + ondragstart="return false;"
  18 + (contextmenu)="false"
  19 + class="d-block ml-auto py-1 icon-30 mr-2 pt-2"
  20 + src="assets/img/ir-color.svg">
34 21 </div>
35 22 </div>
36   - <div class="col-6 px-0">
37   - <div
38   - class="row mx-0 justify-content-between bg-light badge-pill btn-effect">
39   - <div class="col px-0 align-self-center text-primary">
40   - <p class="d-block">
41   - <small class="pr-2">{{'Con bebida'}} {{155 | currency}}</small>
42   - <img
43   - draggable="false"
44   - ondragstart="return false;"
45   - (contextmenu)="false"
46   - class="icon-20"
47   - src="assets/img/ir-color.svg">
48   - </p>
49   - </div>
  23 + </div>
  24 + </div>
  25 + </div>
  26 +</div>
  27 +<div class="modal-body bg-primary" *ngIf="articulosPromo.length">
  28 + <div class="row">
  29 + <div class="col-9">
  30 + <p class="text-white"><small>¿TE GUSTARÍA LLEVAR ESTE ARTÍCULO</small></p>
  31 + <h1 class="text-white mb-4">en un combo?</h1>
  32 + <div *ngFor="let promo of promociones">
  33 + <div class="mx-0 mb-2 bg-white badge-pill text-primary" (click)="elegirPromo(promo)">
  34 + <div class="row mx-0 justify-content-between">
  35 + <p class="ml-4 text-truncate">{{promo.DetArt}}</p>
  36 + <p class="mr-4 font-weight-bold">{{promo.PreVen | currency}}</p>
50 37 </div>
51 38 </div>
52 39 </div>
53 40 </div>
54   - <div class="col-5 align-self-center">
  41 + <div class="col-3 rounded-circle">
55 42 <img
56   - draggable="false"
57   - ondragstart="return false;"
58   - (contextmenu)="false"
59   - class="icon-150 rounded-circle"
60   - src="assets/img/icono-volver.svg">
  43 + draggable="false"
  44 + ondragstart="return false;"
  45 + (contextmenu)="false"
  46 + src="{{urlImagenes}}{{articulosPromo[0].imagenes[0].imagen}}"
  47 + onerror="this.src='assets/img/image-not-found.jpg'"
  48 + class="card-img-top img-fluid rounded-circle">
61 49 </div>
62 50 </div>
63   -</div>
64 51 \ No newline at end of file
  52 +</div>
src/app/shared/promocion/promocion.component.ts
Diff comments   View file @ 282e37b
1 1 import { Component, OnInit } from '@angular/core';
2 2 import { BsModalRef } from 'ngx-bootstrap/modal';
  3 +import { IArticulo } from 'src/app/interfaces/IArticulo';
  4 +import { ArticuloService } from 'src/app/services/articulo/articulo.service';
  5 +import { PromocionService } from 'src/app/services/promocion/promocion.service';
  6 +import { Subject } from 'rxjs';
  7 +import { APP_SETTINGS } from 'src/etc/AppSettings';
3 8  
4 9 @Component({
5 10 selector: 'app-promocion',
... ... @@ -7,12 +12,41 @@ import { BsModalRef } from &#39;ngx-bootstrap/modal&#39;;
7 12 styleUrls: ['./promocion.component.scss']
8 13 })
9 14 export class PromocionComponent implements OnInit {
  15 + idArticulo: number;
  16 + articulosPromo: IArticulo[] = [];
  17 + promociones: IArticulo[] = [];
  18 + onClose: Subject<any>;
  19 + urlImagenes = `${APP_SETTINGS.apiDeboSuite}/imagenes/`;
10 20  
11 21 constructor(
12 22 public modalRef: BsModalRef,
13   - ) { }
  23 + private articuloService: ArticuloService,
  24 + private promocionService: PromocionService,
  25 + ) {
  26 + this.onClose = new Subject();
  27 + }
14 28  
15 29 ngOnInit() {
  30 + this.articuloService.getById(this.idArticulo)
  31 + .subscribe((res: IArticulo) => {
  32 + this.articulosPromo[0] = res;
  33 + this.getPromociones();
  34 + }, err => console.error(err));
  35 + }
  36 +
  37 + elegirPromo(promo: IArticulo) {
  38 + promo.cantidad = 1;
  39 + this.articuloService.setArticulo(promo);
  40 + this.modalRef.hide();
  41 + }
  42 +
  43 + getPromociones() {
  44 + const sector = this.articulosPromo[0].CodSec;
  45 + const codigo = this.articulosPromo[0].CodArt;
  46 + this.promocionService.getPromociones(sector, codigo)
  47 + .subscribe((res: IArticulo[]) => {
  48 + this.promociones = res;
  49 + }, error => { console.error(error); });
16 50 }
17 51  
18 52 }
src/scss/height-width.scss
Diff comments   View file @ 282e37b
... ... @@ -11,3 +11,11 @@
11 11 width: $widthValue !important;
12 12 }
13 13 }
  14 +
  15 +.min-h-50 {
  16 + min-height: 50px;
  17 +}
  18 +
  19 +.min-h-60 {
  20 + min-height: 60px;
  21 +}
src/scss/styles-bootstrap.scss
Diff comments   View file @ 282e37b
... ... @@ -40,19 +40,11 @@ $border-radius-sm: 0.5rem;
40 40 height: 100% !important;
41 41 }
42 42  
43   -@import "node_modules/bootstrap/scss/bootstrap";
44   -
45   -.min-h-50 {
46   - min-height: 50px;
47   -}
48   -
49   -.min-h-60 {
50   - min-height: 60px;
51   -}
52   -
53   -.custom-modal > div > div {
  43 +.modal-promo > div {
54 44 background-color: $primary !important;
55 45 border: none !important;
56 46 border-radius: 10rem;
57 47 margin-left: 10px !important;
58 48 }
  49 +
  50 +@import "node_modules/bootstrap/scss/bootstrap";
... ... @@ -70,6 +70,16 @@
70 70 true,
71 71 "as-needed"
72 72 ],
  73 + "variable-name": {
  74 + "options": [
  75 + "require-const-for-all-caps",
  76 + "ban-keywords",
  77 + "check-format",
  78 + "allow-leading-underscore",
  79 + "allow-snake-case",
  80 + "allow-pascal-case"
  81 + ]
  82 + },
73 83 "object-literal-sort-keys": false,
74 84 "ordered-imports": false,
75 85 "quotemark": [