Marcelo Puebla / autoservicio-axion

Download as
Browse Code »

Commit 81e1a8fc64917cfecf731820569a9fd9b2c350d4

Authored by Luis Suarez
2 parents 77cc137625 879d5e46ae
Exists in develop

solving merge 2

Showing 27 changed files   Show diff stats
src/app/modules/carrito/carrito.component.html
Diff comments   View file @ 81e1a8f
... ... @@ -46,37 +46,12 @@
46 46 <!-- CANTIDAD -->
47 47 <div class="col-6 col-md-3 h-50 h-md-100 border-right border-primary">
48 48 <p class="h-40"><small>CANT</small></p>
49   - <div class="row mx-0 justify-content-between bg-primary badge-pill">
50   - <!-- BOTON MENOS -->
51   - <div class="col-auto px-0 my-auto">
52   - <img
53   - draggable="false"
54   - ondragstart="return false;"
55   - (contextmenu)="false"
56   - class="d-block ml-auto py-2 icon-20 btn-effect"
57   - src="assets/img/menos-blanco.svg"
58   - (click)="substractCant(articulo)">
59   - </div>
60   - <!-- CANTIDAD -->
61   - <div class="col px-0 py-2 my-auto text-white">
62   - <p><small>{{articulo.cantidad}}</small></p>
63   - </div>
64   - <!-- BOTON MAS -->
65   - <div class="col-auto px-0 my-auto">
66   - <img
67   - draggable="false"
68   - ondragstart="return false;"
69   - (contextmenu)="false"
70   - class="d-block ml-auto py-2 icon-20 btn-effect"
71   - src="assets/img/mas-blanco.svg"
72   - (click)="addCant(articulo)">
73   - </div>
74   - </div>
  49 + <app-articulo-cantidad [articulo]="articulo"></app-articulo-cantidad>
75 50 </div>
76 51 <!-- PRECIO -->
77 52 <div class="col-6 col-md-3 h-50 h-md-100 border-right border-primary">
78 53 <p class="h-40"><small>PRECIO</small></p>
79   - <div class="py-2 badge-pill bg-dark text-white">
  54 + <div class="py-1 badge-pill bg-dark text-white">
80 55 <p><small>{{articulo.PreVen | currency}}</small></p>
81 56 </div>
82 57 </div>
src/app/modules/carrito/carrito.component.ts
Diff comments   View file @ 81e1a8f
... ... @@ -53,18 +53,6 @@ export class CarritoComponent implements OnInit, OnDestroy {
53 53 this.articuloService.deleteArticulo(index);
54 54 }
55 55  
56   - substractCant(articulo: IArticulo) {
57   - if (articulo.cantidad === 1) return;
58   - articulo.cantidad--;
59   - this.articuloService.calcularTotal();
60   - }
61   -
62   - addCant(articulo: IArticulo) {
63   - if (articulo.cantidad >= this.maxCantidad) return;
64   - articulo.cantidad++;
65   - this.articuloService.calcularTotal();
66   - }
67   -
68 56 goBack() {
69 57 this.location.back();
70 58 }
src/app/modules/comanda/comanda.component.html
Diff comments   View file @ 81e1a8f
... ... @@ -4,7 +4,7 @@
4 4 <p class="mb-3 h2 text-center mt-2">Pedidos a elaborar</p>
5 5 </div>
6 6 </div>
7   - <div class="row flex-fill m-0 overflow-scroll">
  7 + <div class="row flex-fill m-0 scroll-y">
8 8 <div class="col-12 px-2">
9 9 <div class="card-columns h-100 m-1 fade-in disable-user-select">
10 10 <div
src/app/modules/info-formas-pago/info-formas-pago.component.html
Diff comments   View file @ 81e1a8f
... ... @@ -13,8 +13,8 @@
13 13 <div class="row h-auto mt-6 mx-0 justify-content-center text-center">
14 14 <div
15 15 [routerLink]="['/opcion-pedido']"
16   - class="col-11 col-sm-10 col-md-7 col-lg-4 p-5 m-5 h-auto
17   - btn-effect align-self-end border border-secondary rounded">
  16 + class="col-11 col-sm-10 col-md-7 p-5 m-5 h-auto
  17 + btn-effect align-self-end border border-secondary rounded reduce-card-1">
18 18 <img
19 19 draggable="false"
20 20 ondragstart="return false;"
... ... @@ -41,8 +41,10 @@
41 41 src="assets/img/ir.svg">
42 42 </div>
43 43 </div>
44   - <div class="col-11 col-sm-10 col-md-7 col-lg-4 p-5 m-5 h-auto align-self-center
45   - btn-effect border border-primary rounded reduce-card-2">
  44 + <div
  45 + class="col-11 col-sm-10 col-md-7 p-5 m-5 h-auto align-self-center
  46 + btn-effect border border-primary rounded reduce-card-2"
  47 + (click)="openGoCaja(templateGoCaja)">
46 48 <img
47 49 draggable="false"
48 50 ondragstart="return false;"
... ... @@ -55,3 +57,11 @@
55 57 </div>
56 58 </div>
57 59 </div>
  60 +
  61 +<ng-template #templateGoCaja>
  62 + <div class="bg-primary rounded shadow text-white">
  63 + <div class="modal-body text-center">
  64 + Por favor, hace tu pedido en la caja.
  65 + </div>
  66 + </div>
  67 +</ng-template>
src/app/modules/info-formas-pago/info-formas-pago.component.scss
Diff comments   View file @ 81e1a8f
... ... @@ -3,22 +3,11 @@
3 3 }
4 4  
5 5 .reduce-card-1.media-pantalla {
6   - position: absolute;
7   - bottom: 0;
8   - -webkit-box-flex: 0;
9   - flex: 0 0 41.6666666667%;
10   - max-width: 41.6666666667%;
11   - left: 5%;
12   - margin-left: 0 !important;
  6 + flex: 0 0 35% !important;
  7 + max-width: 35% !important;
13 8 }
14 9  
15 10 .reduce-card-2.media-pantalla {
16   - position: absolute;
17   - bottom: 0;
18   - -webkit-box-flex: 0;
19   - flex: 0 0 41.6666666667%;
20   - max-width: 41.6666666667%;
21   - right: 5%;
22   - margin-right: 0 !important;
23   - height: 202px !important;
  11 + flex: 0 0 35% !important;
  12 + max-width: 35% !important;
24 13 }
src/app/modules/info-formas-pago/info-formas-pago.component.ts
Diff comments   View file @ 81e1a8f
1   -import { Component, OnInit } from '@angular/core';
  1 +import { Component, OnInit, TemplateRef, OnDestroy } from '@angular/core';
  2 +import { BsModalService } from 'ngx-bootstrap/modal';
2 3  
3 4 @Component({
4 5 selector: 'app-formas-pago',
5 6 templateUrl: './info-formas-pago.component.html',
6 7 styleUrls: ['./info-formas-pago.component.scss']
7 8 })
8   -export class InfoFormasPagoComponent implements OnInit {
  9 +export class InfoFormasPagoComponent implements OnInit, OnDestroy {
9 10 mediaPantalla = false;
  11 + timer: any;
10 12  
11   - constructor() { }
  13 + constructor(
  14 + private modalService: BsModalService,
  15 + ) { }
12 16  
13   - ngOnInit() {
14   - this.reducirPantalla();
  17 + ngOnInit() { }
  18 +
  19 + ngOnDestroy() {
  20 + if (this.timer) clearTimeout(this.timer);
15 21 }
16 22  
17   - reducirPantalla() {
18   - if ($('body').hasClass('media-pantalla')) {
19   - $('.reduce-card-1,.reduce-card-2').addClass('media-pantalla');
20   - }
  23 + openGoCaja(templateRef: TemplateRef<any>) {
  24 + const modalRef = this.modalService.show(templateRef, { class: 'modal-promo modal-sm modal-dialog-centered' });
  25 + this.timer = setTimeout(() => {
  26 + modalRef.hide();
  27 + }, 3000);
21 28 }
22 29 }
src/app/modules/opcion-pedido/opcion-pedido.component.html
Diff comments   View file @ 81e1a8f
1 1 <div class="h-92 bg-white fade-in-left">
2   - <div class="row mx-0 h-15">
  2 + <div class="row mx-0 h-20">
3 3 <div class="col-12 px-0 h-80 my-auto">
4 4 <img
5 5 draggable="false"
... ... @@ -9,61 +9,70 @@
9 9 src="assets/img/logo-spot.svg">
10 10 </div>
11 11 </div>
12   - <div class="h-85">
  12 + <div class="h-100">
  13 + <div class="h-10"></div>
13 14 <div class="row mt-5 mx-3 h-auto">
14 15 <div class="col-12 px-0 py-2 align-self-center">
15   - <p class="h6 text-truncate text-center">TU PEDIDO ES PARA</p>
  16 + <p class="col-auto h4 text-truncate text-center">TU PEDIDO ES PARA</p>
16 17 </div>
17 18 </div>
18 19 <div class="row mt-5 h-auto justify-content-center mx-0">
19   - <div class="col-auto px-0 h-auto align-self-start reduce-card-1">
20   - <div
21   - class="btn-effect col-auto align-self-center px-0 bg-white"
22   - (click)="goTo('/seleccion-articulos'); seleccionPedido('false')">
23   - <div class="row mx-0 bg-primary badge-pill">
24   - <div class="col-auto p-0">
25   - <img
26   - draggable="false"
27   - ondragstart="return false;"
28   - (contextmenu)="false"
29   - class="p-1 icon-50"
30   - src="assets/img/icono-plato.svg">
31   - </div>
32   - <div class="col-auto align-self-center text-white">comer acá</div>
33   - <div class="col-auto align-self-center p-0">
34   - <img
35   - draggable="false"
36   - ondragstart="return false;"
37   - (contextmenu)="false"
38   - class="p-1 icon-30"
39   - src="assets/img/ir.svg">
  20 + <div class="col-5 px-0 h-auto align-self-start reduce-card-1">
  21 + <div class="row justify-content-between">
  22 + <div class="col-12">
  23 + <div
  24 + class="btn-effect col-12 px-0 bg-white"
  25 + (click)="goTo('/seleccion-articulos'); seleccionPedido('false')">
  26 + <div class="row mx-0 bg-primary badge-pill">
  27 + <div class="col-2 p-0">
  28 + <img
  29 + draggable="false"
  30 + ondragstart="return false;"
  31 + (contextmenu)="false"
  32 + class="p-1 icon-50"
  33 + src="assets/img/icono-plato.svg">
  34 + </div>
  35 + <div class="col-8 align-self-center text-center text-white">comer acá</div>
  36 + <div class="col-2 align-self-center p-0">
  37 + <img
  38 + draggable="false"
  39 + ondragstart="return false;"
  40 + (contextmenu)="false"
  41 + class="p-1 icon-30"
  42 + src="assets/img/ir.svg">
  43 + </div>
  44 + </div>
40 45 </div>
41 46 </div>
42 47 </div>
43 48 </div>
44 49 </div>
45   - <div class="row mt-4 h-auto justify-content-center mx-0">
46   - <div class="col-auto px-0 h-auto align-self-start reduce-card-2">
47   - <div
48   - class="btn-effect col-auto align-self-center px-0 bg-white"
49   - (click)="goTo('/seleccion-articulos'); seleccionPedido('true')">
50   - <div class="row mx-0 bg-primary badge-pill">
51   - <div class="col-auto p-0">
52   - <img
53   - draggable="false"
54   - ondragstart="return false;"
55   - (contextmenu)="false"
56   - class="p-1 icon-50"
57   - src="assets/img/icono-take-away.svg">
58   - </div>
59   - <div class="col-auto align-self-center text-white">para llevar</div>
60   - <div class="col-auto align-self-center p-0">
61   - <img
62   - draggable="false"
63   - ondragstart="return false;"
64   - (contextmenu)="false"
65   - class="p-1 icon-30"
66   - src="assets/img/ir.svg">
  50 + <div class="row mt-5 h-auto justify-content-center mx-0">
  51 + <div class="col-5 px-0 h-auto align-self-start reduce-card-2">
  52 + <div class="row justify-content-between">
  53 + <div class="col-12">
  54 + <div
  55 + class="btn-effect col-12 align-self-center px-0 bg-white"
  56 + (click)="goTo('/seleccion-articulos'); seleccionPedido('true')">
  57 + <div class="row mx-0 bg-primary badge-pill">
  58 + <div class="col-2 p-0">
  59 + <img
  60 + draggable="false"
  61 + ondragstart="return false;"
  62 + (contextmenu)="false"
  63 + class="p-1 icon-50"
  64 + src="assets/img/icono-take-away.svg">
  65 + </div>
  66 + <div class="col-8 align-self-center text-center text-white">para llevar</div>
  67 + <div class="col-2 align-self-center p-0">
  68 + <img
  69 + draggable="false"
  70 + ondragstart="return false;"
  71 + (contextmenu)="false"
  72 + class="p-1 icon-30"
  73 + src="assets/img/ir.svg">
  74 + </div>
  75 + </div>
67 76 </div>
68 77 </div>
69 78 </div>
src/app/modules/opcion-pedido/opcion-pedido.component.ts
Diff comments   View file @ 81e1a8f
... ... @@ -21,7 +21,7 @@ export class OpcionPedidoComponent implements OnInit {
21 21 }
22 22  
23 23 seleccionPedido(lugar) {
24   - lugar === 'true' ? lugar = true : false;
  24 + lugar = lugar === 'true' ? true : false;
25 25 localStorage.setItem('pedidoParaLlevar', lugar);
26 26 }
27 27  
src/app/modules/pedidos-salientes/pedidos-salientes.component.html
Diff comments   View file @ 81e1a8f
... ... @@ -9,7 +9,7 @@
9 9 </div>
10 10 </div>
11 11 <div class="row mt-n5 mx-0 justify-content-around h-75">
12   - <div class="col-5 col-md-6 col-lg-3 h-100">
  12 + <div class="col-5 col-md-6 col-lg-4 h-100">
13 13 <div class="p-3 bg-white text-center shadow-lg rounded h-100">
14 14 <h5 class="pt-3">ESTAMOS</h5>
15 15 <h3 class="font-weight-bold text-secondary">preparando</h3>
... ... @@ -18,16 +18,16 @@
18 18 *ngFor="let pedido of pedidosPendientes; let i = index"
19 19 [hidden]="i > 3"
20 20 class="font-weight-bold mb-2 text-muted">
21   - <h1 class="display-4">{{rellenar(pedido.id.toString().slice(1), 3)}}</h1>
  21 + <h1 class="display-4">{{rellenar(pedido.id.toString().slice(0), 3)}}</h1>
22 22 </div>
23 23 </div>
24 24 </div>
25   - <div class="col-5 col-md-6 col-lg-3 h-100">
  25 + <div class="col-5 col-md-6 col-lg-4 h-100">
26 26 <div class="p-3 bg-white shadow-lg rounded text-center h-100">
27 27 <h5 class="pt-3">LISTO PARA</h5>
28 28 <h3 class="font-weight-bold text-primary">retirar</h3>
29 29 <div *ngIf="pedidoFinalizado.length">
30   - <h1 class="display-1 mt-4 text-primary mb-0">{{rellenar(pedidoFinalizado[0].id.toString().slice(1), 3)}}</h1>
  30 + <h1 class="display-1 mt-4 text-primary mb-0">{{rellenar(pedidoFinalizado[0].id.toString().slice(0), 3)}}</h1>
31 31 <hr class="line mt-0">
32 32 </div>
33 33 <h3 class="font-weight-bold text-info mt-4">¡Que lo disfrutes!</h3>
src/app/modules/seleccion-articulos/filtro-categorias/filtro-categorias.component.html
Diff comments   View file @ 81e1a8f
... ... @@ -0,0 +1,59 @@
  1 +<!-- FILTRO CATEGORIAS -->
  2 + <p class="h6 h-6 m-0 text-center"><small>CATEGORÍAS</small></p>
  3 + <div class="row mx-0 h-94 justify-content-center align-items-center">
  4 + <div class="col-auto btn-effect h-5 cat-btn">
  5 + <img
  6 + draggable="false"
  7 + ondragstart="return false;"
  8 + (contextmenu)="false"
  9 + class="h-100 d-block mx-auto rotate-90-neg"
  10 + src="assets/img/ir-color.svg"
  11 + (mousedown)="scrollY(templateCategorias, -100)"
  12 + (mouseup)="mouseup()"
  13 + (mouseleave)="mouseup()">
  14 + </div>
  15 + <!-- CATEGORIAS -->
  16 + <div
  17 + #templateCategorias
  18 + class="col-12 px-0 mx-0 box-categorias border border-primary py-1
  19 + border-left-0 rounded-right scroll-y cat-box"
  20 + (scroll)="scrollEvent($event)">
  21 + <div
  22 + class="row mx-2 mb-2 h-25 h-md-32 h-lg-45 justify-content-center tab cat-content"
  23 + [ngClass]="{ 'active rounded shadow px-2': allActive, 'border-bottom-effect': !allActive }"
  24 + (click)="selectCategoria(-1, 0)">
  25 + <img
  26 + draggable="false"
  27 + ondragstart="return false;"
  28 + (contextmenu)="false"
  29 + class="col-12 img-fluid align-self-end d-none d-sm-block rounded-circle"
  30 + src="assets/img/logo-spot.svg">
  31 + <small class="col-12 px-0 my-1 h-100 h-md-25 align-self-end text-center text-truncate">Todos</small>
  32 + </div>
  33 + <div
  34 + class="row mx-2 mb-2 h-25 h-md-32 h-lg-45 justify-content-center tab cat-content"
  35 + [ngClass]="{ 'active rounded shadow px-2': categoria.selected, 'border-bottom-effect': !categoria.selected }"
  36 + (click)="selectCategoria(i, categoria.id)"
  37 + *ngFor="let categoria of categorias; let i = index;">
  38 + <img
  39 + draggable="false"
  40 + ondragstart="return false;"
  41 + (contextmenu)="false"
  42 + class="col-12 img-fluid align-self-end d-none d-sm-block rounded-circle"
  43 + src="{{urlImagenes}}{{categoria.path_imagen}}"
  44 + onerror="this.src='assets/img/image-not-found.jpg'">
  45 + <small class="col-12 px-1 my-1 h-100 h-md-25 align-self-end text-center text-truncate">{{categoria.detalle}}</small>
  46 + </div>
  47 + </div>
  48 + <div class="col-auto btn-effect h-5 cat-btn">
  49 + <img
  50 + draggable="false"
  51 + ondragstart="return false;"
  52 + (contextmenu)="false"
  53 + class="h-100 d-block mx-auto rotate-90"
  54 + src="assets/img/ir-color.svg"
  55 + (mousedown)="scrollY(templateCategorias, 100)"
  56 + (mouseup)="mouseup()"
  57 + (mouseleave)="mouseup()">
  58 + </div>
  59 + </div>
src/app/modules/seleccion-articulos/filtro-categorias/filtro-categorias.component.scss
Diff comments   View file @ 81e1a8f
... ... @@ -0,0 +1,54 @@
  1 +$primary: #aa006b;
  2 +
  3 +.box-categorias {
  4 + height: calc(100% - 100px) !important;
  5 +}
  6 +
  7 +.active {
  8 + transition: 0.3s;
  9 + background-color: white;
  10 + border-bottom: 3px solid $primary !important;
  11 + border-top: 3px solid $primary !important;
  12 + border-left: 3px solid $primary !important;
  13 + border-right: 3px solid $primary !important;
  14 +}
  15 +
  16 +.border-bottom-effect {
  17 + border: none;
  18 + position: relative;
  19 + &:hover {
  20 + border: none;
  21 + }
  22 + &::after {
  23 + content: "";
  24 + position: absolute;
  25 + width: 0px;
  26 + height: 3px;
  27 + left: 50%;
  28 + bottom: 0;
  29 + background-color: $primary;
  30 + transition: all ease-in-out 0.2s;
  31 + }
  32 + &:hover::after {
  33 + width: 100%;
  34 + left: 0;
  35 + }
  36 +}
  37 +
  38 +.cat-content.media-pantalla {
  39 + margin: 0.5rem 0.7rem !important;
  40 + height: 76% !important;
  41 +}
  42 +
  43 +.cat-box.media-pantalla {
  44 + height: calc(100% - 85px) !important;
  45 +}
  46 +
  47 +.cat-btn.media-pantalla {
  48 + height: 7% !important;
  49 +}
  50 +
  51 +#content.media-pantalla,
  52 +#boxCarrito.media-pantalla {
  53 + max-height: 60% !important;
  54 +}
src/app/modules/seleccion-articulos/filtro-categorias/filtro-categorias.component.spec.ts
Diff comments   View file @ 81e1a8f
... ... @@ -0,0 +1,25 @@
  1 +import { async, ComponentFixture, TestBed } from '@angular/core/testing';
  2 +
  3 +import { FiltroCategoriasComponent } from './filtro-categorias.component';
  4 +
  5 +describe('FiltroCategoriasComponent', () => {
  6 + let component: FiltroCategoriasComponent;
  7 + let fixture: ComponentFixture<FiltroCategoriasComponent>;
  8 +
  9 + beforeEach(async(() => {
  10 + TestBed.configureTestingModule({
  11 + declarations: [ FiltroCategoriasComponent ]
  12 + })
  13 + .compileComponents();
  14 + }));
  15 +
  16 + beforeEach(() => {
  17 + fixture = TestBed.createComponent(FiltroCategoriasComponent);
  18 + component = fixture.componentInstance;
  19 + fixture.detectChanges();
  20 + });
  21 +
  22 + it('should create', () => {
  23 + expect(component).toBeTruthy();
  24 + });
  25 +});
src/app/modules/seleccion-articulos/filtro-categorias/filtro-categorias.component.ts
Diff comments   View file @ 81e1a8f
... ... @@ -0,0 +1,86 @@
  1 +import { Component, OnInit, Input, HostListener, Output, EventEmitter } from '@angular/core';
  2 +import { ICategoria } from 'src/app/interfaces/ICategoria';
  3 +import { InactiveScreenService } from 'src/app/services/inactive-screen/inactive-screen.service';
  4 +import { CategoriaService } from 'src/app/services/categoria/categoria.service';
  5 +import { APP_SETTINGS } from 'src/etc/AppSettings';
  6 +
  7 +@Component({
  8 + selector: 'app-filtro-categorias',
  9 + templateUrl: './filtro-categorias.component.html',
  10 + styleUrls: ['./filtro-categorias.component.scss']
  11 +})
  12 +export class FiltroCategoriasComponent implements OnInit {
  13 + @Output() getProductos = new EventEmitter<any>();
  14 + @Output() setProductos = new EventEmitter<any>();
  15 + @Output() filterItems = new EventEmitter<any>();
  16 + categorias: ICategoria[] = [];
  17 + timeoutHandler: any;
  18 + categoriaActive = null;
  19 + allActive = true;
  20 + queMostrar = 'todos';
  21 + urlImagenes = `${APP_SETTINGS.apiDeboSuite}/imagenes/`;
  22 +
  23 + constructor(
  24 + private categoriaService: CategoriaService,
  25 + private inactiveScreen: InactiveScreenService,
  26 + ) { }
  27 +
  28 + ngOnInit() { }
  29 +
  30 + getCategorias() {
  31 + this.categoriaService.getAll()
  32 + .subscribe((categorias: ICategoria[]) => {
  33 + switch (this.queMostrar) {
  34 + case 'todos':
  35 + this.categorias = categorias;
  36 + this.categoriaActive = 0;
  37 + break;
  38 + case 'promociones':
  39 + this.categorias = categorias;
  40 + this.categoriaActive = 19;
  41 + break;
  42 + case 'ordenar':
  43 + this.categorias = categorias.filter((categoria: ICategoria) => {
  44 + return categoria.ES_PEDIDO;
  45 + });
  46 + this.categoriaActive = 4;
  47 + break;
  48 + default:
  49 + this.categorias = categorias;
  50 + this.categoriaActive = 0;
  51 + break;
  52 + }
  53 + !localStorage.getItem('articulos') ?
  54 + this.getProductos.emit() :
  55 + this.setProductos.emit();
  56 + });
  57 + }
  58 +
  59 + selectCategoria(index: number, idCategoria?: number) {
  60 + if (this.categoriaActive === idCategoria) return;
  61 + this.categoriaActive = idCategoria;
  62 + this.allActive = idCategoria === 0 ? true : false;
  63 + this.categorias.forEach((categoria, i) => {
  64 + categoria.selected = index === i ? true : false;
  65 + });
  66 + this.filterItems.emit();
  67 + }
  68 +
  69 + @HostListener('scroll', ['$event'])
  70 + scrollEvent(event: Event) {
  71 + clearTimeout(this.inactiveScreen.timerReposo);
  72 + this.inactiveScreen.startTimeOutInactividad();
  73 + }
  74 +
  75 + mouseup() {
  76 + if (!this.timeoutHandler) return;
  77 + clearInterval(this.timeoutHandler);
  78 + }
  79 +
  80 + scrollY(el: HTMLElement, value) {
  81 + el.scroll({ behavior: 'smooth', top: value + el.scrollTop });
  82 + this.timeoutHandler = setInterval(() => {
  83 + el.scroll({ behavior: 'smooth', top: value + el.scrollTop });
  84 + }, 500);
  85 + }
  86 +}
src/app/modules/seleccion-articulos/seleccion-articulos.component.html
Diff comments   View file @ 81e1a8f
... ... @@ -15,70 +15,13 @@
15 15 <div class="row w-100 mr-4 h-50 h-md-70" id="content">
16 16 <div class="col-12 h-100 px-0 py-3">
17 17 <div class="row mx-0 h-100">
18   - <!-- FILTRO CATEGORIAS -->
19   - <div class="col-5 col-sm-3 col-xl-2 h-100">
20   - <p class="h6 h-6 m-0 text-center"><small>CATEGORÍAS</small></p>
21   - <div class="row mx-0 h-94 justify-content-center align-items-center">
22   - <div class="col-auto btn-effect h-5 cat-btn">
23   - <img
24   - draggable="false"
25   - ondragstart="return false;"
26   - (contextmenu)="false"
27   - class="h-100 d-block mx-auto rotate-90-neg"
28   - src="assets/img/ir-color.svg"
29   - (mousedown)="scrollY(templateCategorias, -100)"
30   - (mouseup)="mouseup()"
31   - (mouseleave)="mouseup()">
32   - </div>
33   - <!-- CATEGORIAS -->
34   - <div
35   - #templateCategorias
36   - class="col-12 px-0 box-categorias border border-primary
37   - border-left-0 rounded-right scroll-y cat-box"
38   - (scroll)="scrollEvent($event)">
39   - <div
40   - class="row mx-4 mb-2 h-25 h-md-32 h-lg-45 justify-content-center tab cat-content"
41   - [ngClass]="{ 'active rounded-sm shadow': allActive, 'border-bottom-effect': !allActive,
42   - 'media-pantalla' : boxCarrito.classList.contains('media-pantalla') }"
43   - (click)="selectCategoria(-1, 0)">
44   - <img
45   - draggable="false"
46   - ondragstart="return false;"
47   - (contextmenu)="false"
48   - class="col-12 h-50 align-self-end d-none d-sm-block rounded-circle"
49   - src="assets/img/logo-spot.svg">
50   - <small class="col-12 px-0 my-1 h-100 h-md-25 align-self-end text-center text-truncate">Todos</small>
51   - </div>
52   - <div
53   - class="row mx-4 mb-2 h-25 h-md-32 h-lg-45 justify-content-center tab cat-content"
54   - [ngClass]="{ 'active rounded-sm shadow': categoria.selected, 'border-bottom-effect': !categoria.selected,
55   - 'media-pantalla' : boxCarrito.classList.contains('media-pantalla') }"
56   - (click)="selectCategoria(i, categoria.id)"
57   - *ngFor="let categoria of categorias; let i = index;">
58   - <img
59   - draggable="false"
60   - ondragstart="return false;"
61   - (contextmenu)="false"
62   - class="col-12 h-50 align-self-end d-none d-sm-block rounded-circle img-categoria"
63   - [ngClass]="{'media-pantalla' : boxCarrito.classList.contains('media-pantalla')}"
64   - src="{{urlImagenes}}{{categoria.path_imagen}}"
65   - onerror="this.src='assets/img/image-not-found.jpg'">
66   - <small class="col-12 px-1 my-1 h-100 h-md-25 align-self-end text-center text-truncate">{{categoria.detalle}}</small>
67   - </div>
68   - </div>
69   - <div class="col-auto btn-effect h-5 cat-btn">
70   - <img
71   - draggable="false"
72   - ondragstart="return false;"
73   - (contextmenu)="false"
74   - class="h-100 d-block mx-auto rotate-90"
75   - src="assets/img/ir-color.svg"
76   - (mousedown)="scrollY(templateCategorias, 100)"
77   - (mouseup)="mouseup()"
78   - (mouseleave)="mouseup()">
79   - </div>
80   - </div>
81   - </div>
  18 + <app-filtro-categorias
  19 + class="col-5 col-sm-3 col-xl-2 h-100"
  20 + #filtroCategorias
  21 + (getProductos)="getProductos()"
  22 + (setProductos)="setProductos()"
  23 + (filterItems)="filterItems()">
  24 + </app-filtro-categorias>
82 25 <!-- LISTA DE ARTICULOS -->
83 26 <div
84 27 class="col-7 col-sm-9 col-xl-10 pb-3 h-100 align-self-center scroll-y-visible"
... ... @@ -170,30 +113,30 @@
170 113 #templateCarrito
171 114 class="row flex-row flex-nowrap h-100 mx-0 my-2 scroll-x"
172 115 (scroll)="scrollEvent($event)">
173   - <!-- MENSAJE DE ADVERTENCIA -->
174   - <div *ngIf="!articuloService.carrito.length" class="col h-100">
175   - <p class="text-center py-5">No hay articulos en el carrito</p>
176   - </div>
177 116 <!-- ARTICULOS -->
178 117 <div
179 118 class="col-10 col-sm-4 col-lg-2 px-2 px-xl-4 align-self-center border-right border-primary"
180   - *ngFor="let articulo of articuloService.carrito; let i = index;">
181   - <div class="swing-in-top-fwd">
182   - <img
183   - class="btn-effect icon-20 position-absolute right-0"
184   - src="assets/img/icono-cancelar-color.svg"
185   - (click)="deleteArticulo(i)">
186   - <img
187   - draggable="false"
188   - ondragstart="return false;"
189   - (contextmenu)="false"
190   - class="d-block img-fluid p-2 mx-auto rounded"
191   - src="{{urlImagenes}}{{articulo.imagenes[0].imagen}}"
192   - onerror="this.src='assets/img/image-not-found.jpg'">
193   - <p class="d-block mt-auto text-center text-primary text-truncate">
194   - <small>{{articulo.DetArt}}</small>
195   - </p>
196   - </div>
  119 + *ngFor="let articulo of articuloService.carrito; let i = index;"
  120 + @EnterLeave>
  121 + <img
  122 + class="btn-effect icon-20 mr-2 position-absolute right-0"
  123 + src="assets/img/icono-cancelar-color.svg"
  124 + (click)="deleteArticulo(i)">
  125 + <img
  126 + draggable="false"
  127 + ondragstart="return false;"
  128 + (contextmenu)="false"
  129 + class="d-block img-fluid p-2 mx-auto rounded"
  130 + src="{{urlImagenes}}{{articulo.imagenes[0].imagen}}"
  131 + onerror="this.src='assets/img/image-not-found.jpg'">
  132 + <p class="d-block mt-auto text-center text-primary text-truncate">
  133 + <small>{{articulo.DetArt}}</small>
  134 + </p>
  135 + <app-articulo-cantidad [articulo]="articulo"></app-articulo-cantidad>
  136 + </div>
  137 + <!-- MENSAJE DE ADVERTENCIA -->
  138 + <div *ngIf="!articuloService.carrito.length" class="col h-100">
  139 + <p class="text-center py-5">No hay articulos en el carrito</p>
197 140 </div>
198 141 </div>
199 142 </div>
src/app/modules/seleccion-articulos/seleccion-articulos.component.scss
Diff comments   View file @ 81e1a8f
1   -$primary: #aa006b;
2   -
3   -.box-categorias {
4   - height: calc(100% - 100px) !important;
5   -}
6   -
7   -.active {
8   - background-color: white;
9   - border-bottom: 3px solid $primary !important;
10   - border-top: 3px solid $primary !important;
11   - border-left: 3px solid $primary !important;
12   - border-right: 3px solid $primary !important;
13   -}
14   -
15   -.border-bottom-effect {
16   - border: none;
17   - position: relative;
18   - &:hover {
19   - border: none;
20   - }
21   - &::after {
22   - content: "";
23   - position: absolute;
24   - width: 0px;
25   - height: 3px;
26   - left: 50%;
27   - bottom: 0;
28   - background-color: $primary;
29   - transition: all ease-in-out 0.2s;
30   - }
31   - &:hover::after {
32   - width: 100%;
33   - left: 0;
34   - }
35   -}
36   -
37   -.card {
38   - border: none;
39   -}
40   -
41   -.line-height-sm {
42   - line-height: 1.2;
43   -}
44   -
45   -#content.media-pantalla,#boxCarrito.media-pantalla {
  1 +#content.media-pantalla,
  2 +#boxCarrito.media-pantalla {
46 3 max-height: 60% !important;
47 4 }
48   -
49   -.cat-content.media-pantalla {
50   - margin: 0.5rem 0.7rem !important;
51   - height: 76% !important;
52   -}
53   -
54   -.cat-box.media-pantalla{
55   - height: calc(100% - 85px) !important;
56   -}
57   -
58   -.cat-btn.media-pantalla {
59   - height: 7% !important;
60   -}
61   -
62   -.img-categoria.media-pantalla{
63   - min-height: 40px !important;
64   -}
65 5 \ No newline at end of file
src/app/modules/seleccion-articulos/seleccion-articulos.component.ts
Diff comments   View file @ 81e1a8f
1   -import { Component, OnInit, OnDestroy, HostListener } from '@angular/core';
  1 +import { Component, OnInit, OnDestroy, HostListener, ViewChild, ViewChildren, AfterViewInit } 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';
... ... @@ -10,27 +10,38 @@ import { PromocionComponent } from &#39;src/app/shared/promocion/promocion.component
10 10 import { InactiveScreenService } from 'src/app/services/inactive-screen/inactive-screen.service';
11 11 import { SinonimoService } from 'src/app/services/sinonimo/sinonimo.service';
12 12 import { SinonimoComponent } from 'src/app/shared/sinonimo/sinonimo.component';
  13 +import { trigger, state, style, transition, animate } from '@angular/animations';
  14 +import { FiltroCategoriasComponent } from './filtro-categorias/filtro-categorias.component';
13 15  
14 16 @Component({
15 17 selector: 'app-seleccion-articulos',
16 18 templateUrl: './seleccion-articulos.component.html',
17   - styleUrls: ['./seleccion-articulos.component.scss']
  19 + styleUrls: ['./seleccion-articulos.component.scss'],
  20 + animations: [
  21 + trigger('EnterLeave', [
  22 + state('flyIn', style({ transform: 'translateY(0)' })),
  23 + transition(':enter', [
  24 + style({ transform: 'translateY(-100%)' }),
  25 + animate('0.5s ease-in')
  26 + ]),
  27 + transition(':leave', [
  28 + animate('0.5s ease-out', style({ transform: 'translateY(-100%)' }))
  29 + ])
  30 + ])
  31 + ]
18 32 })
19   -export class SeleccionArticulosComponent implements OnInit, OnDestroy {
  33 +export class SeleccionArticulosComponent implements OnInit, AfterViewInit, OnDestroy {
20 34 showSpinner = true;
21 35 timeoutHandler: any;
22 36 urlImagenes = `${APP_SETTINGS.apiDeboSuite}/imagenes/`;
23 37 articulos: IArticulo[] = [];
24 38 auxArticulos: IArticulo[] = [];
25 39 showQuantity = 100;
26   - queMostrar = 'todos';
27   - categoriaActive = null;
28   - categorias: ICategoria[] = [];
29 40 searchTerm = '';
30 41 ordenandoByVendidos = true;
31   - allActive = true;
32 42 modalRef: BsModalRef;
33 43 total = 0;
  44 + @ViewChild(FiltroCategoriasComponent, { static: false }) filtroCategorias: FiltroCategoriasComponent;
34 45  
35 46 constructor(
36 47 public articuloService: ArticuloService,
... ... @@ -40,8 +51,10 @@ export class SeleccionArticulosComponent implements OnInit, OnDestroy {
40 51 private inactiveScreen: InactiveScreenService,
41 52 ) { }
42 53  
43   - ngOnInit() {
44   - this.getCategorias();
  54 + ngOnInit() { }
  55 +
  56 + ngAfterViewInit(): void {
  57 + this.filtroCategorias.getCategorias();
45 58 this.mediaPantalla();
46 59 }
47 60  
... ... @@ -51,41 +64,12 @@ export class SeleccionArticulosComponent implements OnInit, OnDestroy {
51 64 }
52 65 }
53 66  
54   - getCategorias() {
55   - this.categoriaService.getAll()
56   - .subscribe((categorias: ICategoria[]) => {
57   - switch (this.queMostrar) {
58   - case 'todos':
59   - this.categorias = categorias;
60   - this.categoriaActive = 0;
61   - break;
62   - case 'promociones':
63   - this.categorias = categorias;
64   - this.categoriaActive = 19;
65   - break;
66   - case 'ordenar':
67   - this.categorias = categorias.filter((categoria: ICategoria) => {
68   - return categoria.ES_PEDIDO;
69   - });
70   - this.categoriaActive = 4;
71   - break;
72   - default:
73   - this.categorias = categorias;
74   - this.categoriaActive = 0;
75   - break;
76   - }
77   - !localStorage.getItem('articulos') ?
78   - this.getProductos() :
79   - this.setProductos();
80   - });
81   - }
82   -
83 67 getProductos() {
84 68 this.articuloService.getAll()
85 69 .subscribe((result: IArticulo[]) => {
86 70 this.articuloService.setArticulosSinImagen(result);
87   - if (this.queMostrar === 'ordenar') {
88   - this.categorias.forEach((categoria: ICategoria) => {
  71 + if (this.filtroCategorias.queMostrar === 'ordenar') {
  72 + this.filtroCategorias.categorias.forEach((categoria: ICategoria) => {
89 73 const tempArticulos = result.filter((articulo: IArticulo) => {
90 74 return articulo.categoria_selfservice === categoria.id;
91 75 });
... ... @@ -106,12 +90,12 @@ export class SeleccionArticulosComponent implements OnInit, OnDestroy {
106 90 }
107 91  
108 92 filterItems() {
109   - if (this.categoriaActive === 0) {
  93 + if (this.filtroCategorias.categoriaActive === 0) {
110 94 this.auxArticulos = this.articulos;
111 95 return;
112 96 }
113 97 this.auxArticulos = this.articulos.filter(x => {
114   - return x.categoria_selfservice === this.categoriaActive;
  98 + return x.categoria_selfservice === this.filtroCategorias.categoriaActive;
115 99 });
116 100 this.ordenar();
117 101 }
... ... @@ -124,16 +108,6 @@ export class SeleccionArticulosComponent implements OnInit, OnDestroy {
124 108 }
125 109 }
126 110  
127   - selectCategoria(index: number, idCategoria?: number) {
128   - if (this.categoriaActive === idCategoria) return;
129   - this.categoriaActive = idCategoria;
130   - this.allActive = idCategoria === 0 ? true : false;
131   - this.categorias.forEach((categoria, i) => {
132   - categoria.selected = index === i ? true : false;
133   - });
134   - this.filterItems();
135   - }
136   -
137 111 selectArticulo(articulo: IArticulo) {
138 112 this.getByID(articulo.id);
139 113 }
... ... @@ -226,7 +200,9 @@ export class SeleccionArticulosComponent implements OnInit, OnDestroy {
226 200  
227 201 mediaPantalla() {
228 202 if ($('body').hasClass('media-pantalla')) {
229   - $('.cat-content,#content,.cat-btn,#boxCarrito,.cat-box,.img-categoria').addClass('media-pantalla').addBack('media-pantalla');
  203 + $('.cat-content,#content,.cat-btn,#boxCarrito,.cat-box,.img-categoria')
  204 + .addClass('media-pantalla')
  205 + .addBack('media-pantalla');
230 206 }
231 207 }
232 208 }
src/app/modules/seleccion-articulos/seleccion-articulos.module.ts
Diff comments   View file @ 81e1a8f
... ... @@ -10,6 +10,8 @@ import { SharedModule } from &#39;../shared/shared.module&#39;;
10 10 import { SinonimoComponent } from 'src/app/shared/sinonimo/sinonimo.component';
11 11 import { FormsModule } from '@angular/forms';
12 12 import { ConfirmacionComponent } from 'src/app/shared/confirmacion/confirmacion.component';
  13 +import { ArticuloCantidadComponent } from 'src/app/shared/articulo-cantidad/articulo-cantidad.component';
  14 +import { FiltroCategoriasComponent } from './filtro-categorias/filtro-categorias.component';
13 15  
14 16 @NgModule({
15 17 declarations: [
... ... @@ -17,7 +19,9 @@ import { ConfirmacionComponent } from &#39;src/app/shared/confirmacion/confirmacion.
17 19 HeaderPublicidadComponent,
18 20 PromocionComponent,
19 21 SinonimoComponent,
20   - ConfirmacionComponent
  22 + ConfirmacionComponent,
  23 + ArticuloCantidadComponent,
  24 + FiltroCategoriasComponent,
21 25 ],
22 26 imports: [
23 27 CommonModule,
... ... @@ -27,7 +31,7 @@ import { ConfirmacionComponent } from &#39;src/app/shared/confirmacion/confirmacion.
27 31 CarouselModule.forRoot(),
28 32 SharedModule
29 33 ],
30   - exports: [HeaderPublicidadComponent],
  34 + exports: [HeaderPublicidadComponent, ArticuloCantidadComponent],
31 35 entryComponents: [PromocionComponent, ConfirmacionComponent, SinonimoComponent]
32 36 })
33 37 export class SeleccionArticulosModule { }
src/app/services/articulo/articulo.service.ts
Diff comments   View file @ 81e1a8f
... ... @@ -16,6 +16,7 @@ export class ArticuloService {
16 16 medioPago: number;
17 17 idComanda: number;
18 18 subTotal = 0;
  19 + maxCantidad = 50;
19 20  
20 21 constructor(
21 22 private http: HttpClient,
... ... @@ -34,6 +35,18 @@ export class ArticuloService {
34 35 return this.http.get(`${this.urlDeboSuite}/articulos/${page}`);
35 36 }
36 37  
  38 + substractCant(articulo: IArticulo) {
  39 + if (articulo.cantidad === 1) return;
  40 + articulo.cantidad--;
  41 + this.calcularTotal();
  42 + }
  43 +
  44 + addCant(articulo: IArticulo) {
  45 + if (articulo.cantidad >= this.maxCantidad) return;
  46 + articulo.cantidad++;
  47 + this.calcularTotal();
  48 + }
  49 +
37 50 calcularTotal() {
38 51 this.subTotal = 0;
39 52 this.carrito.forEach(articulo => {
src/app/shared/articulo-cantidad/articulo-cantidad.component.html
Diff comments   View file @ 81e1a8f
... ... @@ -0,0 +1,26 @@
  1 +<div class="row mx-0 justify-content-between bg-primary badge-pill">
  2 + <!-- BOTON MENOS -->
  3 + <div class="col-auto px-0 my-auto">
  4 + <img
  5 + draggable="false"
  6 + ondragstart="return false;"
  7 + (contextmenu)="false"
  8 + class="d-block ml-auto py-2 icon-15 btn-effect"
  9 + src="assets/img/menos-blanco.svg"
  10 + (click)="substractCant(articulo)">
  11 + </div>
  12 + <!-- CANTIDAD -->
  13 + <div class="col px-0 my-auto text-white text-center">
  14 + <p><small>{{articulo.cantidad}}</small></p>
  15 + </div>
  16 + <!-- BOTON MAS -->
  17 + <div class="col-auto px-0 my-auto">
  18 + <img
  19 + draggable="false"
  20 + ondragstart="return false;"
  21 + (contextmenu)="false"
  22 + class="d-block ml-auto py-2 icon-15 btn-effect"
  23 + src="assets/img/mas-blanco.svg"
  24 + (click)="addCant(articulo)">
  25 + </div>
  26 +</div>
src/app/shared/articulo-cantidad/articulo-cantidad.component.scss
Diff comments   View file @ 81e1a8f
src/app/shared/articulo-cantidad/articulo-cantidad.component.spec.ts
Diff comments   View file @ 81e1a8f
... ... @@ -0,0 +1,25 @@
  1 +import { async, ComponentFixture, TestBed } from '@angular/core/testing';
  2 +
  3 +import { ArticuloCantidadComponent } from './articulo-cantidad.component';
  4 +
  5 +describe('ArticuloCantidadComponent', () => {
  6 + let component: ArticuloCantidadComponent;
  7 + let fixture: ComponentFixture<ArticuloCantidadComponent>;
  8 +
  9 + beforeEach(async(() => {
  10 + TestBed.configureTestingModule({
  11 + declarations: [ ArticuloCantidadComponent ]
  12 + })
  13 + .compileComponents();
  14 + }));
  15 +
  16 + beforeEach(() => {
  17 + fixture = TestBed.createComponent(ArticuloCantidadComponent);
  18 + component = fixture.componentInstance;
  19 + fixture.detectChanges();
  20 + });
  21 +
  22 + it('should create', () => {
  23 + expect(component).toBeTruthy();
  24 + });
  25 +});
src/app/shared/articulo-cantidad/articulo-cantidad.component.ts
Diff comments   View file @ 81e1a8f
... ... @@ -0,0 +1,25 @@
  1 +import { Component, OnInit, Input } from '@angular/core';
  2 +import { IArticulo } from 'src/app/interfaces/IArticulo';
  3 +import { ArticuloService } from 'src/app/services/articulo/articulo.service';
  4 +
  5 +@Component({
  6 + selector: 'app-articulo-cantidad',
  7 + templateUrl: './articulo-cantidad.component.html',
  8 + styleUrls: ['./articulo-cantidad.component.scss']
  9 +})
  10 +export class ArticuloCantidadComponent implements OnInit {
  11 + @Input() articulo: IArticulo;
  12 +
  13 + constructor(private articuloService: ArticuloService) { }
  14 +
  15 + ngOnInit() { }
  16 +
  17 + substractCant(articulo: IArticulo) {
  18 + this.articuloService.substractCant(articulo);
  19 + }
  20 +
  21 + addCant(articulo: IArticulo) {
  22 + this.articuloService.addCant(articulo);
  23 + }
  24 +
  25 +}
src/app/shared/header-publicidad/header-publicidad.component.ts
Diff comments   View file @ 81e1a8f
... ... @@ -7,6 +7,9 @@ import { PromocionComponent } from &#39;../promocion/promocion.component&#39;;
7 7 import { BsModalService, BsModalRef } from 'ngx-bootstrap/modal';
8 8 import { ArticuloService } from 'src/app/services/articulo/articulo.service';
9 9 import { ConfirmacionComponent } from '../confirmacion/confirmacion.component';
  10 +import { SinonimoService } from 'src/app/services/sinonimo/sinonimo.service';
  11 +import { ISinonimo } from 'src/app/interfaces/ISinonimo';
  12 +import { SinonimoComponent } from '../sinonimo/sinonimo.component';
10 13  
11 14 @Component({
12 15 selector: 'app-header-publicidad',
... ... @@ -22,6 +25,7 @@ export class HeaderPublicidadComponent implements OnInit {
22 25 private publicidadService: PublicidadService,
23 26 private articuloService: ArticuloService,
24 27 private modalService: BsModalService,
  28 + private sinonimoService: SinonimoService
25 29 ) { }
26 30  
27 31 ngOnInit() {
... ... @@ -68,7 +72,7 @@ export class HeaderPublicidadComponent implements OnInit {
68 72 {
69 73 initialState: {
70 74 titleMessage: articulo.DET_LAR,
71   - imagenPath: articulo.imagenes.length ? articulo.imagenes[0].imagen : '',
  75 + imagenPath: articulo.imagenes.length ? articulo.imagenes[0].imagen : 'assets/img/image-not-found.jpg',
72 76 footerMessageFirst: `¿DESEA AGREGAR ESTE ARTÍCULO`,
73 77 footerMessageSecond: `a su carrito?`,
74 78 footerConfirmation: articulo.PreVen,
... ... @@ -77,10 +81,42 @@ export class HeaderPublicidadComponent implements OnInit {
77 81 class: 'modal-promo modal-dialog-centered'
78 82 });
79 83 this.modalRef.content.onClose.subscribe(() => {
80   - this.articuloService.setArticulo(articulo);
  84 + this.sinonimoService.getSinonimos(articulo.CodSec, articulo.CodArt)
  85 + .subscribe((res: ISinonimo[]) => {
  86 + if (res.length) {
  87 + this.openModalSinonimos(res, articulo);
  88 + } else {
  89 + articulo.cantidad = 1;
  90 + this.articuloService.setArticulo(articulo);
  91 + }
  92 + }, err => console.error(err));
81 93 });
  94 + this.mediaPantalla();
82 95 }
83 96  
  97 + openModalSinonimos(sinonimosData: ISinonimo[], articulo: IArticulo) {
  98 + const modalSinonimo = this.modalService.show(SinonimoComponent, {
  99 + initialState: { sinonimos: sinonimosData },
  100 + class: 'modal-promo modal-dialog-centered'
  101 + });
  102 + modalSinonimo.content.onClose
  103 + .subscribe((res: any) => {
  104 + for (const a of articulo.productos) {
  105 + if (a.idSinonimo === res.ID_SIN) {
  106 + a.CODA = res.articulo.CodArt;
  107 + a.CodArt = res.articulo.CodArt;
  108 + a.SECA = res.articulo.CodSec;
  109 + a.CodSec = res.articulo.CodSec;
  110 + a.PreVen = res.articulo.PreVen;
  111 + a.id = res.articulo.id;
  112 + a.DET_LAR = res.articulo.DET_LAR;
  113 + a.DetArt = res.articulo.DetArt;
  114 + }
  115 + }
  116 + this.articuloService.setArticulo(articulo);
  117 + });
  118 +}
  119 +
84 120 mediaPantalla() {
85 121 if ($('body').hasClass('media-pantalla')) {
86 122 $('#headerPublicidad,#headerPad').addClass('media-pantalla');
src/app/shared/sinonimo/sinonimo.component.html
Diff comments   View file @ 81e1a8f
1 1 <div class="bg-primary rounded text-white">
2 2 <div class="modal-header">
3   - <p class="h4">Seleccione sinonimos</p>
  3 + <p class="h4">Elige una opción</p>
4 4 </div>
5 5  
6 6 <div class="modal-body">
... ... @@ -18,13 +18,13 @@
18 18 <label
19 19 class="custom-control-label"
20 20 [for]="articulo.id">
21   - {{articulo.DET_LAR}}
  21 + {{articulo.DET_LAR.toUpperCase()}}
22 22 </label>
23 23 </div>
24 24 </div>
25 25 </div>
26 26 </div>
27   -
  27 +
28 28 <div class="modal-footer">
29 29 <div
30 30 [ngClass]="validate()"
  1 +.icon-15 {
  2 + width: 15px;
  3 +}
  4 +
1 5 .icon-20 {
2 6 width: 20px;
3 7 }
src/scss/styles-bootstrap.scss
Diff comments   View file @ 81e1a8f
... ... @@ -61,4 +61,13 @@ $border-radius-sm: 0.5rem;
61 61 margin-left: 10px !important;
62 62 }
63 63  
  64 +.modal-content.media-pantalla {
  65 + margin-top: auto !important;
  66 + margin-bottom: 50px !important;
  67 +}
  68 +
  69 +.card {
  70 + border: none !important;
  71 +}
  72 +
64 73 @import "node_modules/bootstrap/scss/bootstrap";
... ... @@ -22,6 +22,13 @@ body {
22 22 user-select: none;
23 23 }
24 24  
  25 +body.media-pantalla {
  26 + height: 50% !important;
  27 + position: absolute;
  28 + bottom: 0;
  29 + width: 100%;
  30 +}
  31 +
25 32 .btn-effect {
26 33 transition: all 0.3s !important;
27 34 &:hover {
... ... @@ -77,15 +84,3 @@ p {
77 84 .disabled {
78 85 opacity: 0.5;
79 86 }
80   -
81   -body.media-pantalla {
82   - height: 50% !important;
83   - position: absolute;
84   - bottom: 0;
85   - width: 100%;
86   -}
87   -
88   -.modal-content.media-pantalla {
89   - margin-top: auto !important;
90   - margin-bottom: 50px !important;
91   -}