Commit 6877b1afabb0331da524a83d12700a7030e991eb

Authored by Marcelo Puebla
Exists in develop

Merge branch 'develop' into 'develop'

Develop

See merge request !46
src/app/interfaces/IArticulo.ts
... ... @@ -14,6 +14,7 @@ export interface IArticulo {
14 14 FPP?: boolean;
15 15 id: number;
16 16 idSinonimo?: number;
  17 + ID_SIN?: number;
17 18 imagenes?: any[];
18 19 ImpInt: number;
19 20 ImpInt2: number;
... ... @@ -25,7 +26,10 @@ export interface IArticulo {
25 26 seleccionado?: boolean;
26 27 tieneSinonimo?: boolean;
27 28 tipo_articulo?: number;
28   - comentario?: string;
  29 + CODA?: number;
  30 + CODP?: number;
  31 + SECA?: number;
  32 + SECP?: number;
29 33 }
30 34  
31 35 export interface ICodigoBarra {
src/app/interfaces/ISinonimo.ts
... ... @@ -0,0 +1,9 @@
  1 +import { IArticulo } from './IArticulo';
  2 +
  3 +export interface ISinonimo {
  4 + ID_SIN: number;
  5 + descripcion: string;
  6 + productos: IArticulo[];
  7 + productoPadre?: number;
  8 + cantidad?: number;
  9 +}
src/app/modules/carrito/carrito.component.ts
... ... @@ -42,7 +42,7 @@ export class CarritoComponent implements OnInit, OnDestroy {
42 42 this.router.navigate(['']);
43 43 return;
44 44 }
45   - this.mediaPantallaP()
  45 + this.mediaPantallaP();
46 46 }
47 47  
48 48 ngOnDestroy() {
... ... @@ -50,8 +50,7 @@ export class CarritoComponent implements OnInit, OnDestroy {
50 50 }
51 51  
52 52 deleteArticulo(index: number) {
53   - this.articuloService.carrito.splice(index, 1);
54   - this.articuloService.calcularTotal();
  53 + this.articuloService.deleteArticulo(index);
55 54 }
56 55  
57 56 substractCant(articulo: IArticulo) {
... ... @@ -76,6 +75,12 @@ export class CarritoComponent implements OnInit, OnDestroy {
76 75 this.inactiveScreen.startTimeOutInactividad();
77 76 }
78 77  
  78 + @HostListener('scroll', ['$event'])
  79 + scrollEvent(event: Event) {
  80 + clearTimeout(this.inactiveScreen.timerReposo);
  81 + this.inactiveScreen.startTimeOutInactividad();
  82 + }
  83 +
79 84 mediaPantallaP() {
80 85 if ($('body').hasClass('media-pantalla')) {
81 86 $('.carrito-content,.carrito-articulo').addClass('media-pantalla');
src/app/modules/forma-pago/forma-pago.component.ts
1   -import { Component, OnInit } from "@angular/core";
2   -import { ArticuloService } from "src/app/services/articulo/articulo.service";
3   -import { Router } from "@angular/router";
  1 +import { Component, OnInit } from '@angular/core';
  2 +import { ArticuloService } from 'src/app/services/articulo/articulo.service';
  3 +import { Router } from '@angular/router';
4 4  
5 5 @Component({
6   - selector: "app-forma-pago",
7   - templateUrl: "./forma-pago.component.html",
8   - styleUrls: ["./forma-pago.component.scss"]
  6 + selector: 'app-forma-pago',
  7 + templateUrl: './forma-pago.component.html',
  8 + styleUrls: ['./forma-pago.component.scss']
9 9 })
10 10 export class FormaPagoComponent implements OnInit {
11 11 constructor(
... ... @@ -15,7 +15,7 @@ export class FormaPagoComponent implements OnInit {
15 15  
16 16 ngOnInit() {
17 17 if (!this.articuloService.carrito.length) {
18   - this.router.navigate([""]);
  18 + this.router.navigate(['']);
19 19 return;
20 20 }
21 21 this.mediaPantalla();
... ... @@ -25,10 +25,10 @@ export class FormaPagoComponent implements OnInit {
25 25 this.articuloService.medioPago = medioPago;
26 26 switch (medioPago) {
27 27 case 4:
28   - this.router.navigate(["pago-tarjeta"]);
  28 + this.router.navigate(['pago-tarjeta']);
29 29 break;
30 30 case 9:
31   - this.router.navigate(["pago-electronico"]);
  31 + this.router.navigate(['pago-electronico']);
32 32 break;
33 33 }
34 34 }
src/app/modules/info-formas-pago/info-formas-pago.component.ts
... ... @@ -7,13 +7,13 @@ import { Component, OnInit } from '@angular/core';
7 7 })
8 8 export class InfoFormasPagoComponent implements OnInit {
9 9 mediaPantalla = false;
10   -
11   - constructor() {}
  10 +
  11 + constructor() { }
12 12  
13 13 ngOnInit() {
14 14 this.reducirPantalla();
15 15 }
16   -
  16 +
17 17 reducirPantalla() {
18 18 if ($('body').hasClass('media-pantalla')) {
19 19 $('.reduce-card-1,.reduce-card-2').addClass('media-pantalla');
src/app/modules/seleccion-articulos/seleccion-articulos.component.html
... ... @@ -90,7 +90,7 @@
90 90 *ngFor="let articulo of auxArticulos | slice:0:showQuantity;">
91 91 <div
92 92 class="swing-in-top-fwd btn-effect card h-auto"
93   - (click)="elegirArticulo(articulo)">
  93 + (click)="selectArticulo(articulo)">
94 94 <img
95 95 draggable="false"
96 96 ondragstart="return false;"
src/app/modules/seleccion-articulos/seleccion-articulos.component.ts
1   -import { Component, OnInit, TemplateRef, OnDestroy, HostListener } from '@angular/core';
  1 +import { Component, OnInit, OnDestroy, HostListener } 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';
5 5 import { APP_SETTINGS } from 'src/etc/AppSettings';
6 6 import { ICategoria } from 'src/app/interfaces/ICategoria';
  7 +import { ISinonimo } from 'src/app/interfaces/ISinonimo';
7 8 import { CategoriaService } from 'src/app/services/categoria/categoria.service';
8   -import { PromocionService } from 'src/app/services/promocion/promocion.service';
9 9 import { PromocionComponent } from 'src/app/shared/promocion/promocion.component';
10 10 import { InactiveScreenService } from 'src/app/services/inactive-screen/inactive-screen.service';
  11 +import { SinonimoService } from 'src/app/services/sinonimo/sinonimo.service';
  12 +import { SinonimoComponent } from 'src/app/shared/sinonimo/sinonimo.component';
11 13  
12 14 @Component({
13 15 selector: 'app-seleccion-articulos',
... ... @@ -33,6 +35,7 @@ export class SeleccionArticulosComponent implements OnInit, OnDestroy {
33 35 constructor(
34 36 public articuloService: ArticuloService,
35 37 private categoriaService: CategoriaService,
  38 + private sinonimoService: SinonimoService,
36 39 private modalService: BsModalService,
37 40 private inactiveScreen: InactiveScreenService,
38 41 ) { }
... ... @@ -129,35 +132,65 @@ export class SeleccionArticulosComponent implements OnInit, OnDestroy {
129 132 this.filterItems();
130 133 }
131 134  
132   - elegirArticulo(articulo: IArticulo) {
133   - if (!articulo.FPP) {
134   - this.getByID(articulo.id);
135   - } else {
136   - this.openModalPromos(articulo);
137   - }
  135 + selectArticulo(articulo: IArticulo) {
  136 + this.getByID(articulo.id);
138 137 }
139 138  
140 139 getByID(id: number) {
141 140 this.articuloService.getById(id)
142 141 .subscribe((res: IArticulo) => {
143   - res.cantidad = 1;
144   - this.articuloService.setArticulo(res);
  142 + if (res.FPP) {
  143 + this.openModalPromos(res);
  144 + } else {
  145 + this.getSinonimos(res);
  146 + }
145 147 }, err => console.error(err));
146 148 }
147 149  
  150 + getSinonimos(articulo: IArticulo) {
  151 + this.sinonimoService.getSinonimos(articulo.CodSec, articulo.CodArt)
  152 + .subscribe((res: ISinonimo[]) => {
  153 + if (res.length) {
  154 + this.openModalSinonimos(res, articulo);
  155 + } else {
  156 + this.articuloService.setArticulo(articulo);
  157 + }
  158 + });
  159 + }
  160 +
148 161 openModalPromos(articulo: IArticulo) {
149   - this.modalRef = this.modalService.show(PromocionComponent,
150   - {
151   - initialState: {
152   - idArticulo: articulo.id
153   - },
154   - class: 'modal-promo modal-dialog-centered'
  162 + this.modalRef = this.modalService.show(PromocionComponent, {
  163 + initialState: { articulosPromo: [articulo] },
  164 + class: 'modal-promo modal-dialog-centered'
  165 + });
  166 + }
  167 +
  168 + openModalSinonimos(sinonimosData: ISinonimo[], articulo: IArticulo) {
  169 + this.modalRef = this.modalService.show(SinonimoComponent, {
  170 + initialState: { sinonimos: sinonimosData },
  171 + class: 'modal-promo modal-dialog-centered'
  172 + });
  173 +
  174 + this.modalRef.content.onClose
  175 + .subscribe((res: any) => {
  176 + for (const a of articulo.productos) {
  177 + if (a.idSinonimo === res.ID_SIN) {
  178 + a.CODA = res.articulo.CodArt;
  179 + a.CodArt = res.articulo.CodArt;
  180 + a.SECA = res.articulo.CodSec;
  181 + a.CodSec = res.articulo.CodSec;
  182 + a.PreVen = res.articulo.PreVen;
  183 + a.id = res.articulo.id;
  184 + a.DET_LAR = res.articulo.DET_LAR;
  185 + a.DetArt = res.articulo.DetArt;
  186 + }
  187 + }
  188 + this.articuloService.setArticulo(articulo);
155 189 });
156 190 }
157 191  
158 192 deleteArticulo(index: number) {
159   - this.articuloService.carrito.splice(index, 1);
160   - this.articuloService.calcularTotal();
  193 + this.articuloService.deleteArticulo(index);
161 194 }
162 195  
163 196 increaseShow() {
src/app/modules/seleccion-articulos/seleccion-articulos.module.ts
... ... @@ -7,6 +7,8 @@ import { ModalModule } from &#39;ngx-bootstrap/modal&#39;;
7 7 import { CarouselModule } from 'ngx-bootstrap/carousel';
8 8 import { PromocionComponent } from 'src/app/shared/promocion/promocion.component';
9 9 import { SharedModule } from '../shared/shared.module';
  10 +import { SinonimoComponent } from 'src/app/shared/sinonimo/sinonimo.component';
  11 +import { FormsModule } from '@angular/forms';
10 12 import { ConfirmacionComponent } from 'src/app/shared/confirmacion/confirmacion.component';
11 13  
12 14 @NgModule({
... ... @@ -14,16 +16,18 @@ import { ConfirmacionComponent } from &#39;src/app/shared/confirmacion/confirmacion.
14 16 SeleccionArticulosComponent,
15 17 HeaderPublicidadComponent,
16 18 PromocionComponent,
  19 + SinonimoComponent,
17 20 ConfirmacionComponent
18 21 ],
19 22 imports: [
20 23 CommonModule,
21 24 SeleccionArticulosRoutingModule,
  25 + FormsModule,
22 26 ModalModule.forRoot(),
23 27 CarouselModule.forRoot(),
24 28 SharedModule
25 29 ],
26 30 exports: [HeaderPublicidadComponent],
27   - entryComponents: [PromocionComponent, ConfirmacionComponent]
  31 + entryComponents: [PromocionComponent, ConfirmacionComponent, SinonimoComponent]
28 32 })
29 33 export class SeleccionArticulosModule { }
src/app/modules/shared/shared.module.ts
1 1 import { NgModule, ModuleWithProviders } from '@angular/core';
2 2 import { ArticuloService } from 'src/app/services/articulo/articulo.service';
3 3 import { CategoriaService } from 'src/app/services/categoria/categoria.service';
  4 +import { SinonimoService } from 'src/app/services/sinonimo/sinonimo.service';
4 5  
5 6 @NgModule({})
6 7 export class SharedModule {
... ... @@ -9,7 +10,8 @@ export class SharedModule {
9 10 ngModule: SharedModule,
10 11 providers: [
11 12 ArticuloService,
12   - CategoriaService
  13 + CategoriaService,
  14 + SinonimoService
13 15 ]
14 16 };
15 17 }
src/app/modules/splash-screen/splash-screen.component.ts
1   -import { Component, OnInit } from "@angular/core";
  1 +import { Component, OnInit } from '@angular/core';
2 2  
3 3 @Component({
4   - selector: "app-splash-screen",
5   - templateUrl: "./splash-screen.component.html",
6   - styleUrls: ["./splash-screen.component.scss"]
  4 + selector: 'app-splash-screen',
  5 + templateUrl: './splash-screen.component.html',
  6 + styleUrls: ['./splash-screen.component.scss']
7 7 })
8 8 export class SplashScreenComponent implements OnInit {
9 9 timerSplashScreen = 2000;
10 10 showSplashScreen = true;
11   - textWelcome = "BIENVENIDO A SPOT!";
12   - textComoEstas = "ยฟcรณmo estรกs?";
13   - textInvitamos = "TE INVITAMOS A HACER";
14   - textTuPedido = "tu pedido acรก";
  11 + textWelcome = 'BIENVENIDO A SPOT!';
  12 + textComoEstas = 'ยฟcรณmo estรกs?';
  13 + textInvitamos = 'TE INVITAMOS A HACER';
  14 + textTuPedido = 'tu pedido acรก';
15 15  
16 16 constructor() {}
17 17  
src/app/services/articulo/articulo.service.ts
... ... @@ -42,8 +42,9 @@ export class ArticuloService {
42 42 }
43 43  
44 44 setArticulo(articulo: IArticulo) {
  45 + articulo.cantidad = 1;
45 46 for (const articuloCarrito of this.carrito) {
46   - if (articuloCarrito.id === articulo.id) {
  47 + if (articuloCarrito.id === articulo.id && !articulo.productos.length) {
47 48 articuloCarrito.cantidad++;
48 49 this.calcularTotal();
49 50 return;
... ... @@ -54,6 +55,11 @@ export class ArticuloService {
54 55 this.calcularTotal();
55 56 }
56 57  
  58 + deleteArticulo(index: number) {
  59 + this.carrito.splice(index, 1);
  60 + this.calcularTotal();
  61 + }
  62 +
57 63 pay(dataPago: any) {
58 64 return new Observable((observer) => {
59 65 this.clienteService.getById(-1)
src/app/services/sinonimo/sinonimo.service.ts
... ... @@ -12,7 +12,7 @@ export class SinonimoService {
12 12 private http: HttpClient,
13 13 ) { }
14 14  
15   - getPromocionSinonimos(sector, codigo) {
  15 + getSinonimos(sector, codigo) {
16 16 return this.http.get(`${this.urlDeboSuite}/sinonimos/promo/${sector}/${codigo}`);
17 17 }
18 18 }
src/app/shared/confirmacion/confirmacion.component.ts
1 1 import { Component, OnInit, HostListener } from '@angular/core';
2   -import { ArticuloService } from 'src/app/services/articulo/articulo.service';
3   -import { IArticulo } from 'src/app/interfaces/IArticulo';
4 2 import { BsModalRef } from 'ngx-bootstrap/modal';
5 3 import { InactiveScreenService } from 'src/app/services/inactive-screen/inactive-screen.service';
6 4 import { Subject } from 'rxjs';
  5 +import { APP_SETTINGS } from 'src/etc/AppSettings';
7 6  
8 7 @Component({
9 8 selector: 'app-confirmacion',
... ... @@ -11,11 +10,14 @@ import { Subject } from &#39;rxjs&#39;;
11 10 styleUrls: ['./confirmacion.component.scss']
12 11 })
13 12 export class ConfirmacionComponent implements OnInit {
14   - idArticulo: number;
15   - imagenArticulo: any;
16   - detLarArticulo: string;
17   - preVenArticulo: any;
  13 + titleMessage: string;
  14 + imagenPath: any;
  15 + footerMessageFirst: string;
  16 + footerMessageSecond: string;
  17 + footerConfirmation: number;
  18 + footerClose: string;
18 19 onClose: Subject<any>;
  20 + urlImagenes = `${APP_SETTINGS.apiDeboSuite}/imagenes/`;
19 21  
20 22 constructor(
21 23 public modalRef: BsModalRef,
src/app/shared/footer/footer.component.ts
... ... @@ -7,15 +7,31 @@ import { Location } from &#39;@angular/common&#39;;
7 7 styleUrls: ['./footer.component.scss']
8 8 })
9 9 export class FooterComponent implements OnInit {
10   - constructor(private location: Location) {}
  10 + constructor(private location: Location) { }
11 11  
12   - ngOnInit() {}
  12 + ngOnInit() { }
13 13  
14 14 goBack() {
15 15 this.location.back();
16 16 }
17 17  
18 18 reducirPantalla() {
19   - $('body,.reduce-card-1,.reduce-card-2,#content,.cat-content,.cat-btn,.cat-box,#boxCarrito,#headerPublicidad,#headerPad,.img-categoria,.carrito-articulo,.carrito-content,.pago-tarjeta,.modal-promo').toggleClass('media-pantalla');
  19 + $(`
  20 + body,
  21 + .reduce-card-1,
  22 + .reduce-card-2,
  23 + #content,
  24 + .cat-content,
  25 + .cat-btn,
  26 + .cat-box,
  27 + #boxCarrito,
  28 + #headerPublicidad,
  29 + #headerPad,
  30 + .img-categoria,
  31 + .carrito-articulo,
  32 + .carrito-content,
  33 + .pago-tarjeta,
  34 + .modal-promo`)
  35 + .toggleClass('media-pantalla');
20 36 }
21 37 }
src/app/shared/header-publicidad/header-publicidad.component.ts
... ... @@ -68,7 +68,7 @@ export class HeaderPublicidadComponent implements OnInit {
68 68 {
69 69 initialState: {
70 70 titleMessage: articulo.DET_LAR,
71   - imagenPath: articulo.imagenes,
  71 + imagenPath: articulo.imagenes.length ? articulo.imagenes[0].imagen : '',
72 72 footerMessageFirst: `ยฟDESEA AGREGAR ESTE ARTรCULO`,
73 73 footerMessageSecond: `a su carrito?`,
74 74 footerConfirmation: articulo.PreVen,
... ... @@ -77,7 +77,6 @@ export class HeaderPublicidadComponent implements OnInit {
77 77 class: 'modal-promo modal-dialog-centered'
78 78 });
79 79 this.modalRef.content.onClose.subscribe(() => {
80   - articulo.cantidad = 1;
81 80 this.articuloService.setArticulo(articulo);
82 81 });
83 82 }
src/app/shared/promocion/promocion.component.html
... ... @@ -6,7 +6,7 @@
6 6 <div class="col-4 align-self-center">
7 7 <div
8 8 class="row mx-0 justify-content-between bg-white badge-pill"
9   - (click)="elegirPromo(articulosPromo[0])">
  9 + (click)="selectPromo(articulosPromo[0])">
10 10 <div class="col px-0 align-self-center text-primary">
11 11 <p class="font-weight-bold">{{articulosPromo[0].PreVen | currency}}</p>
12 12 </div>
... ... @@ -43,7 +43,7 @@
43 43 (scroll)="scrollEvent($event)">
44 44 <div class="col-12">
45 45 <div *ngFor="let promo of promociones">
46   - <div class="mx-0 mb-2 bg-white badge-pill text-primary" (click)="elegirPromo(promo)">
  46 + <div class="mx-0 mb-2 bg-white badge-pill text-primary" (click)="selectPromo(promo)">
47 47 <div class="d-flex">
48 48 <p class="text-truncate mr-auto my-auto"><small>{{promo.DetArt}}</small></p>
49 49 <p class="font-weight-bold my-auto pr-2">
src/app/shared/promocion/promocion.component.ts
1 1 import { Component, OnInit, HostListener } from '@angular/core';
2   -import { BsModalRef } from 'ngx-bootstrap/modal';
  2 +import { BsModalRef, BsModalService } from 'ngx-bootstrap/modal';
3 3 import { IArticulo } from 'src/app/interfaces/IArticulo';
4 4 import { ArticuloService } from 'src/app/services/articulo/articulo.service';
5 5 import { PromocionService } from 'src/app/services/promocion/promocion.service';
6 6 import { Subject } from 'rxjs';
7 7 import { APP_SETTINGS } from 'src/etc/AppSettings';
8 8 import { InactiveScreenService } from 'src/app/services/inactive-screen/inactive-screen.service';
  9 +import { SinonimoService } from 'src/app/services/sinonimo/sinonimo.service';
  10 +import { ISinonimo } from 'src/app/interfaces/ISinonimo';
  11 +import { SinonimoComponent } from '../sinonimo/sinonimo.component';
9 12  
10 13 @Component({
11 14 selector: 'app-promocion',
... ... @@ -13,34 +16,63 @@ import { InactiveScreenService } from &#39;src/app/services/inactive-screen/inactive
13 16 styleUrls: ['./promocion.component.scss']
14 17 })
15 18 export class PromocionComponent implements OnInit {
16   - idArticulo: number;
17 19 articulosPromo: IArticulo[] = [];
18 20 promociones: IArticulo[] = [];
19 21 onClose: Subject<any>;
20 22 urlImagenes = `${APP_SETTINGS.apiDeboSuite}/imagenes/`;
21 23  
22 24 constructor(
23   - public modalRef: BsModalRef,
  25 + public modalPromocion: BsModalRef,
  26 + private modalService: BsModalService,
24 27 private articuloService: ArticuloService,
25 28 private promocionService: PromocionService,
  29 + private sinonimoService: SinonimoService,
26 30 private inactiveScreen: InactiveScreenService,
27 31 ) {
28 32 this.onClose = new Subject();
29 33 }
30 34  
31 35 ngOnInit() {
32   - this.articuloService.getById(this.idArticulo)
33   - .subscribe((res: IArticulo) => {
34   - this.articulosPromo[0] = res;
35   - this.getPromociones();
  36 + this.getPromociones();
  37 + }
  38 +
  39 + selectPromo(promo: IArticulo) {
  40 + this.sinonimoService.getSinonimos(promo.CodSec, promo.CodArt)
  41 + .subscribe((res: ISinonimo[]) => {
  42 + if (res.length) {
  43 + this.openModalSinonimos(res, promo);
  44 + } else {
  45 + promo.cantidad = 1;
  46 + this.articuloService.setArticulo(promo);
  47 + this.modalPromocion.hide();
  48 + }
36 49 }, err => console.error(err));
37   - this.mediaPantalla();
  50 + this.mediaPantalla();
38 51 }
39 52  
40   - elegirPromo(promo: IArticulo) {
41   - promo.cantidad = 1;
42   - this.articuloService.setArticulo(promo);
43   - this.modalRef.hide();
  53 + openModalSinonimos(sinonimosData: ISinonimo[], articulo: IArticulo) {
  54 + const modalSinonimo = this.modalService.show(SinonimoComponent, {
  55 + initialState: { sinonimos: sinonimosData },
  56 + class: 'modal-promo modal-dialog-centered'
  57 + });
  58 +
  59 + modalSinonimo.content.onClose
  60 + .subscribe((res: any) => {
  61 + for (const a of articulo.productos) {
  62 + if (a.idSinonimo === res.ID_SIN) {
  63 + a.CODA = res.articulo.CodArt;
  64 + a.CodArt = res.articulo.CodArt;
  65 + a.SECA = res.articulo.CodSec;
  66 + a.CodSec = res.articulo.CodSec;
  67 + a.PreVen = res.articulo.PreVen;
  68 + a.id = res.articulo.id;
  69 + a.DET_LAR = res.articulo.DET_LAR;
  70 + a.DetArt = res.articulo.DetArt;
  71 + }
  72 + }
  73 + this.articuloService.setArticulo(articulo);
  74 + this.modalPromocion.hide();
  75 + });
44 76 }
45 77  
46 78 getPromociones() {
... ... @@ -58,8 +90,14 @@ export class PromocionComponent implements OnInit {
58 90 this.inactiveScreen.startTimeOutInactividad();
59 91 }
60 92  
  93 + @HostListener('scroll', ['$event'])
  94 + scrollEvent(event: Event) {
  95 + clearTimeout(this.inactiveScreen.timerReposo);
  96 + this.inactiveScreen.startTimeOutInactividad();
  97 + }
  98 +
61 99 mediaPantalla() {
62   - if($('body').hasClass('media-pantalla')) {
  100 + if ($('body').hasClass('media-pantalla')) {
63 101 $('.modal-content').addClass('media-pantalla');
64 102 }
65 103 }
src/app/shared/sinonimo/sinonimo.component.html
... ... @@ -0,0 +1,42 @@
  1 +<div class="bg-primary rounded text-white">
  2 + <div class="modal-header">
  3 + <p class="h4">Seleccione sinonimos</p>
  4 + </div>
  5 +
  6 + <div class="modal-body">
  7 + <div
  8 + class="lista-sinonimos scroll-y-visible"
  9 + *ngFor="let s of sinonimos">
  10 + <div *ngFor="let articulo of s.productos">
  11 + <div class="custom-control custom-checkbox">
  12 + <input
  13 + type="checkbox"
  14 + class="custom-control-input"
  15 + [(ngModel)]="articulo.seleccionado"
  16 + (click)="selectArticulo(articulo)"
  17 + [id]="articulo.id">
  18 + <label
  19 + class="custom-control-label"
  20 + [for]="articulo.id">
  21 + {{articulo.DET_LAR}}
  22 + </label>
  23 + </div>
  24 + </div>
  25 + </div>
  26 + </div>
  27 +
  28 + <div class="modal-footer">
  29 + <div
  30 + [ngClass]="validate()"
  31 + class="d-inline-block py-1 btn-effect bg-white badge-pill text-primary"
  32 + (click)="continue()">
  33 + CONTINUAR
  34 + <img
  35 + draggable="false"
  36 + ondragstart="return false;"
  37 + (contextmenu)="false"
  38 + class="icon-30"
  39 + src="assets/img/ir-color.svg">
  40 + </div>
  41 + </div>
  42 +</div>
src/app/shared/sinonimo/sinonimo.component.scss
... ... @@ -0,0 +1,4 @@
  1 +.lista-sinonimos {
  2 + min-height: auto;
  3 + max-height: 25vh;
  4 +}
src/app/shared/sinonimo/sinonimo.component.spec.ts
... ... @@ -0,0 +1,25 @@
  1 +import { async, ComponentFixture, TestBed } from '@angular/core/testing';
  2 +
  3 +import { SinonimoComponent } from './sinonimo.component';
  4 +
  5 +describe('SinonimoComponent', () => {
  6 + let component: SinonimoComponent;
  7 + let fixture: ComponentFixture<SinonimoComponent>;
  8 +
  9 + beforeEach(async(() => {
  10 + TestBed.configureTestingModule({
  11 + declarations: [ SinonimoComponent ]
  12 + })
  13 + .compileComponents();
  14 + }));
  15 +
  16 + beforeEach(() => {
  17 + fixture = TestBed.createComponent(SinonimoComponent);
  18 + component = fixture.componentInstance;
  19 + fixture.detectChanges();
  20 + });
  21 +
  22 + it('should create', () => {
  23 + expect(component).toBeTruthy();
  24 + });
  25 +});
src/app/shared/sinonimo/sinonimo.component.ts
... ... @@ -0,0 +1,64 @@
  1 +import { Component, OnInit } from '@angular/core';
  2 +import { ISinonimo } from 'src/app/interfaces/ISinonimo';
  3 +import { IArticulo } from 'src/app/interfaces/IArticulo';
  4 +import { BsModalRef } from 'ngx-bootstrap/modal';
  5 +import { Subject } from 'rxjs';
  6 +import { ArticuloService } from 'src/app/services/articulo/articulo.service';
  7 +
  8 +@Component({
  9 + selector: 'app-sinonimo',
  10 + templateUrl: './sinonimo.component.html',
  11 + styleUrls: ['./sinonimo.component.scss']
  12 +})
  13 +export class SinonimoComponent implements OnInit {
  14 + sinonimos: ISinonimo[] = [];
  15 + isValid: boolean;
  16 + onClose: Subject<any>;
  17 + articuloSelected: IArticulo;
  18 +
  19 + constructor(
  20 + private modalRef: BsModalRef,
  21 + private articuloService: ArticuloService,
  22 + ) {
  23 + this.onClose = new Subject();
  24 + }
  25 +
  26 + ngOnInit() {
  27 + }
  28 +
  29 + selectArticulo(articulo: IArticulo) {
  30 + for (const s of this.sinonimos) {
  31 + for (const a of s.productos) {
  32 + a.seleccionado = false;
  33 + }
  34 + }
  35 + articulo.seleccionado = true;
  36 + this.articuloSelected = articulo;
  37 + }
  38 +
  39 + validate() {
  40 + this.isValid = false;
  41 + for (const s of this.sinonimos) {
  42 + for (const articulo of s.productos) {
  43 + if (articulo.seleccionado) {
  44 + this.isValid = true;
  45 + }
  46 + }
  47 + }
  48 + return !this.isValid ? 'disabled' : '';
  49 + }
  50 +
  51 + continue() {
  52 + if (!this.isValid) return;
  53 + const ID_SIN = this.articuloSelected.ID_SIN;
  54 + this.articuloService.getById(this.articuloSelected.id)
  55 + .subscribe((res: IArticulo) => {
  56 + this.modalRef.hide();
  57 + this.onClose.next({
  58 + articulo: res,
  59 + ID_SIN
  60 + });
  61 + }, err => console.error(err));
  62 + }
  63 +
  64 +}
src/scss/styles-bootstrap.scss
... ... @@ -40,9 +40,24 @@ $border-radius-sm: 0.5rem;
40 40 height: 100% !important;
41 41 }
42 42  
  43 +.custom-checkbox .custom-control-input:checked ~ .custom-control-label::before {
  44 + background-color: $primary !important;
  45 +}
  46 +
  47 +.custom-control-input:checked ~ .custom-control-label::before {
  48 + border-color: $primary !important;
  49 + background-color: $primary !important;
  50 +}
  51 +
  52 +.custom-control-input:checked ~ .custom-control-label::before {
  53 + color: #fff;
  54 + border-color: $primary !important;
  55 + background-color: $primary !important;
  56 +}
  57 +
43 58 .modal-promo > div {
44 59 border: none !important;
45   - border-radius: 10rem;
  60 + border-radius: $border-radius;
46 61 margin-left: 10px !important;
47 62 }
48 63  
... ... @@ -74,6 +74,10 @@ p {
74 74 transform: rotate(-180deg);
75 75 }
76 76  
  77 +.disabled {
  78 + opacity: 0.5;
  79 +}
  80 +
77 81 body.media-pantalla {
78 82 height: 50% !important;
79 83 position: absolute;