Commit d7e47a0c9a5822285d76e020e21e18f7b3557311
Exists in
develop
Merge branch 'develop' into 'develop'
Fix - Add See merge request !49
Showing
3 changed files
Show diff stats
src/app/shared/promocion/promocion.component.html
| 1 | <div class="modal-header bg-primary rounded-top pt-4 px-2"> | 1 | <div class="modal-header bg-primary rounded-top pt-4 px-2"> |
| 2 | <div class="row mx-0 w-100 justify-content-between" *ngIf="articulosPromo.length"> | 2 | <div class="row mx-0 w-100 justify-content-between" *ngIf="articulosPromo.length"> |
| 3 | <div class="col-8"> | 3 | <div class="col-8"> |
| 4 | <p class="h3 text-white">{{articulosPromo[0].DetArt}}</p> | 4 | <p class="h3 text-white">{{articulosPromo[0].DetArt}}</p> |
| 5 | </div> | 5 | </div> |
| 6 | <div class="col-4 align-self-center"> | 6 | <div class="col-4 align-self-center"> |
| 7 | <div | 7 | <div |
| 8 | class="row mx-0 justify-content-between bg-white badge-pill" | 8 | class="row mx-0 justify-content-between bg-white badge-pill" |
| 9 | (click)="selectPromo(articulosPromo[0])"> | 9 | (click)="selectPromo(articulosPromo[0])"> |
| 10 | <div class="col px-0 align-self-center text-primary"> | 10 | <div class="col px-0 align-self-center text-primary"> |
| 11 | <p class="font-weight-bold">{{articulosPromo[0].PreVen | currency}}</p> | 11 | <p class="font-weight-bold">{{articulosPromo[0].PreVen | currency}}</p> |
| 12 | </div> | 12 | </div> |
| 13 | <div class="col-3 px-0"> | 13 | <div class="col-3 px-0"> |
| 14 | <img | 14 | <img |
| 15 | draggable="false" | 15 | draggable="false" |
| 16 | ondragstart="return false;" | 16 | ondragstart="return false;" |
| 17 | (contextmenu)="false" | 17 | (contextmenu)="false" |
| 18 | class="d-block ml-auto py-1 icon-30 mr-2 pt-2" | 18 | class="d-block ml-auto py-1 icon-30 mr-2 pt-2" |
| 19 | src="assets/img/ir-color.svg"> | 19 | src="assets/img/ir-color.svg"> |
| 20 | </div> | 20 | </div> |
| 21 | </div> | 21 | </div> |
| 22 | </div> | 22 | </div> |
| 23 | </div> | 23 | </div> |
| 24 | </div> | 24 | </div> |
| 25 | <div class="modal-body bg-primary rounded-bottom pb-3 px-2" *ngIf="articulosPromo.length"> | 25 | <div class="modal-body bg-primary rounded-bottom pb-3 px-2" *ngIf="articulosPromo.length"> |
| 26 | <div class="row mx-0 w-100"> | 26 | <div class="row mx-0 w-100"> |
| 27 | <div class="col-9"> | 27 | <div class="col-9"> |
| 28 | <p class="text-white"><small>¿TE GUSTARÍA LLEVAR ESTE ARTÍCULO</small></p> | 28 | <p class="text-white"><small>¿TE GUSTARÍA LLEVAR ESTE ARTÍCULO</small></p> |
| 29 | <h1 class="text-white mb-4">en un combo?</h1> | 29 | <h1 class="text-white mb-4">en un combo?</h1> |
| 30 | </div> | 30 | </div> |
| 31 | <div class="col-3"> | 31 | <div class="col-3"> |
| 32 | <img | 32 | <img |
| 33 | draggable="false" | 33 | draggable="false" |
| 34 | ondragstart="return false;" | 34 | ondragstart="return false;" |
| 35 | (contextmenu)="false" | 35 | (contextmenu)="false" |
| 36 | src="{{urlImagenes}}{{articulosPromo[0].imagenes[0].imagen}}" | 36 | src="{{urlImagenes}}{{articulosPromo[0].imagenes[0].imagen}}" |
| 37 | onerror="this.src='assets/img/image-not-found.jpg'" | 37 | onerror="this.src='assets/img/image-not-found.jpg'" |
| 38 | class="card-img-top img-fluid rounded-circle"> | 38 | class="card-img-top img-fluid rounded-circle"> |
| 39 | </div> | 39 | </div> |
| 40 | </div> | 40 | </div> |
| 41 | <div | 41 | <div |
| 42 | class="row mx-0 lista-promociones scroll-y-visible" | 42 | class="row mx-0 lista-promociones scroll-y-visible" |
| 43 | (scroll)="scrollEvent($event)"> | 43 | (scroll)="scrollEvent($event)"> |
| 44 | <div class="col-12"> | 44 | <div class="col-12"> |
| 45 | <div *ngFor="let promo of promociones"> | 45 | <div *ngFor="let promo of promociones"> |
| 46 | <div class="mx-0 mb-2 bg-white badge-pill text-primary" (click)="selectPromo(promo)"> | 46 | <div |
| 47 | class="mx-0 mb-2 btn-effect bg-white badge-pill text-primary" | ||
| 48 | (click)="selectPromo(promo)"> | ||
| 47 | <div class="d-flex"> | 49 | <div class="d-flex"> |
| 48 | <p class="text-truncate mr-auto my-auto"><small>{{promo.DetArt}}</small></p> | 50 | <p class="text-truncate mr-auto my-auto"><small>{{promo.DetArt}}</small></p> |
| 49 | <p class="font-weight-bold my-auto pr-2"> | 51 | <p class="font-weight-bold my-auto pr-2"> |
| 50 | <span>{{promo.PreVen | currency}}</span> | 52 | <span>{{promo.PreVen | currency}}</span> |
| 51 | </p> | 53 | </p> |
| 52 | <img | 54 | <img |
| 53 | draggable="false" | 55 | draggable="false" |
| 54 | ondragstart="return false;" | 56 | ondragstart="return false;" |
| 55 | (contextmenu)="false" | 57 | (contextmenu)="false" |
| 56 | class="d-block icon-30 py-1" | 58 | class="d-block icon-30 py-1" |
| 57 | src="assets/img/ir-color.svg"> | 59 | src="assets/img/ir-color.svg"> |
| 58 | </div> | 60 | </div> |
| 59 | </div> | 61 | </div> |
| 60 | </div> | 62 | </div> |
| 61 | </div> | 63 | </div> |
| 62 | </div> | 64 | </div> |
| 63 | </div> | 65 | </div> |
| 64 | 66 |
src/app/shared/sinonimo/sinonimo.component.html
| 1 | <div class="bg-primary rounded text-white"> | 1 | <div class="bg-primary rounded text-white"> |
| 2 | <div class="modal-header"> | 2 | <div class="modal-header"> |
| 3 | <p class="h4">Seleccione sinonimos</p> | 3 | <p class="h4">Seleccione sinonimos</p> |
| 4 | </div> | 4 | </div> |
| 5 | 5 | ||
| 6 | <div class="modal-body"> | 6 | <div class="modal-body"> |
| 7 | <div | 7 | <div |
| 8 | class="lista-sinonimos scroll-y-visible" | 8 | class="lista-sinonimos scroll-y-visible" |
| 9 | *ngFor="let s of sinonimos"> | 9 | *ngFor="let s of sinonimos"> |
| 10 | <div *ngFor="let articulo of s.productos"> | 10 | <div *ngFor="let articulo of s.productos"> |
| 11 | <div class="custom-control custom-checkbox"> | 11 | <div class="custom-control custom-checkbox"> |
| 12 | <input | 12 | <input |
| 13 | type="checkbox" | 13 | type="checkbox" |
| 14 | class="custom-control-input" | 14 | class="custom-control-input" |
| 15 | [(ngModel)]="articulo.seleccionado" | 15 | [(ngModel)]="articulo.seleccionado" |
| 16 | (click)="selectArticulo(articulo)" | 16 | (click)="selectArticulo(articulo)" |
| 17 | [id]="articulo.id"> | 17 | [id]="articulo.id"> |
| 18 | <label | 18 | <label |
| 19 | class="custom-control-label" | 19 | class="custom-control-label" |
| 20 | [for]="articulo.id"> | 20 | [for]="articulo.id"> |
| 21 | {{articulo.DET_LAR}} | 21 | {{articulo.DET_LAR}} |
| 22 | </label> | 22 | </label> |
| 23 | </div> | 23 | </div> |
| 24 | </div> | 24 | </div> |
| 25 | </div> | 25 | </div> |
| 26 | </div> | 26 | </div> |
| 27 | 27 | ||
| 28 | <div class="modal-footer"> | 28 | <div class="modal-footer"> |
| 29 | <div | 29 | <div |
| 30 | [ngClass]="validate()" | 30 | [ngClass]="validate()" |
| 31 | class="d-inline-block py-1 btn-effect bg-white badge-pill text-primary" | 31 | class="d-inline-block py-1 bg-white badge-pill text-primary" |
| 32 | (click)="continue()"> | 32 | (click)="continue()"> |
| 33 | CONTINUAR | 33 | CONTINUAR |
| 34 | <img | 34 | <img |
| 35 | draggable="false" | 35 | draggable="false" |
| 36 | ondragstart="return false;" | 36 | ondragstart="return false;" |
| 37 | (contextmenu)="false" | 37 | (contextmenu)="false" |
| 38 | class="icon-30" | 38 | class="icon-30" |
| 39 | src="assets/img/ir-color.svg"> | 39 | src="assets/img/ir-color.svg"> |
| 40 | </div> | 40 | </div> |
| 41 | </div> | 41 | </div> |
| 42 | </div> | 42 | </div> |
| 43 | 43 |
src/app/shared/sinonimo/sinonimo.component.ts
| 1 | import { Component, OnInit } from '@angular/core'; | 1 | import { Component, OnInit } from '@angular/core'; |
| 2 | import { ISinonimo } from 'src/app/interfaces/ISinonimo'; | 2 | import { ISinonimo } from 'src/app/interfaces/ISinonimo'; |
| 3 | import { IArticulo } from 'src/app/interfaces/IArticulo'; | 3 | import { IArticulo } from 'src/app/interfaces/IArticulo'; |
| 4 | import { BsModalRef } from 'ngx-bootstrap/modal'; | 4 | import { BsModalRef } from 'ngx-bootstrap/modal'; |
| 5 | import { Subject } from 'rxjs'; | 5 | import { Subject } from 'rxjs'; |
| 6 | import { ArticuloService } from 'src/app/services/articulo/articulo.service'; | 6 | import { ArticuloService } from 'src/app/services/articulo/articulo.service'; |
| 7 | 7 | ||
| 8 | @Component({ | 8 | @Component({ |
| 9 | selector: 'app-sinonimo', | 9 | selector: 'app-sinonimo', |
| 10 | templateUrl: './sinonimo.component.html', | 10 | templateUrl: './sinonimo.component.html', |
| 11 | styleUrls: ['./sinonimo.component.scss'] | 11 | styleUrls: ['./sinonimo.component.scss'] |
| 12 | }) | 12 | }) |
| 13 | export class SinonimoComponent implements OnInit { | 13 | export class SinonimoComponent implements OnInit { |
| 14 | sinonimos: ISinonimo[] = []; | 14 | sinonimos: ISinonimo[] = []; |
| 15 | isValid: boolean; | 15 | isValid: boolean; |
| 16 | onClose: Subject<any>; | 16 | onClose: Subject<any>; |
| 17 | articuloSelected: IArticulo; | 17 | articuloSelected: IArticulo; |
| 18 | 18 | ||
| 19 | constructor( | 19 | constructor( |
| 20 | private modalRef: BsModalRef, | 20 | private modalRef: BsModalRef, |
| 21 | private articuloService: ArticuloService, | 21 | private articuloService: ArticuloService, |
| 22 | ) { | 22 | ) { |
| 23 | this.onClose = new Subject(); | 23 | this.onClose = new Subject(); |
| 24 | } | 24 | } |
| 25 | 25 | ||
| 26 | ngOnInit() { | 26 | ngOnInit() { |
| 27 | } | 27 | } |
| 28 | 28 | ||
| 29 | selectArticulo(articulo: IArticulo) { | 29 | selectArticulo(articulo: IArticulo) { |
| 30 | for (const s of this.sinonimos) { | 30 | for (const s of this.sinonimos) { |
| 31 | for (const a of s.productos) { | 31 | for (const a of s.productos) { |
| 32 | a.seleccionado = false; | 32 | a.seleccionado = false; |
| 33 | } | 33 | } |
| 34 | } | 34 | } |
| 35 | articulo.seleccionado = true; | 35 | articulo.seleccionado = true; |
| 36 | this.articuloSelected = articulo; | 36 | this.articuloSelected = articulo; |
| 37 | } | 37 | } |
| 38 | 38 | ||
| 39 | validate() { | 39 | validate() { |
| 40 | this.isValid = false; | 40 | this.isValid = false; |
| 41 | for (const s of this.sinonimos) { | 41 | for (const s of this.sinonimos) { |
| 42 | for (const articulo of s.productos) { | 42 | for (const articulo of s.productos) { |
| 43 | if (articulo.seleccionado) { | 43 | if (articulo.seleccionado) { |
| 44 | this.isValid = true; | 44 | this.isValid = true; |
| 45 | } | 45 | } |
| 46 | } | 46 | } |
| 47 | } | 47 | } |
| 48 | return !this.isValid ? 'disabled' : ''; | 48 | return !this.isValid ? 'disabled' : 'btn-effect'; |
| 49 | } | 49 | } |
| 50 | 50 | ||
| 51 | continue() { | 51 | continue() { |
| 52 | if (!this.isValid) return; | 52 | if (!this.isValid) return; |
| 53 | const ID_SIN = this.articuloSelected.ID_SIN; | 53 | const ID_SIN = this.articuloSelected.ID_SIN; |
| 54 | this.articuloService.getById(this.articuloSelected.id) | 54 | this.articuloService.getById(this.articuloSelected.id) |
| 55 | .subscribe((res: IArticulo) => { | 55 | .subscribe((res: IArticulo) => { |
| 56 | this.modalRef.hide(); | 56 | this.modalRef.hide(); |
| 57 | this.onClose.next({ | 57 | this.onClose.next({ |
| 58 | articulo: res, | 58 | articulo: res, |
| 59 | ID_SIN | 59 | ID_SIN |
| 60 | }); | 60 | }); |
| 61 | }, err => console.error(err)); | 61 | }, err => console.error(err)); |
| 62 | } | 62 | } |
| 63 | 63 | ||
| 64 | } | 64 | } |
| 65 | 65 |