Luis Suarez / autoservicio-axion

Download as
Browse Code »

Commit 51a6c068d5d0114fe99c070d87e1c57d7a6d94fd

Authored by Benjamin Rodriguez
1 parent c371b8831f
Exists in develop

modal promociones

Showing 6 changed files with 107 additions and 14 deletions   Show diff stats
src/app/app.module.ts
Diff comments   View file @ 51a6c06
... ... @@ -10,6 +10,7 @@ import { SplashScreenComponent } from './modules/splash-screen/splash-screen.com
10 10 import { AdminComponent } from './modules/admin/admin.component';
11 11 import { FooterComponent } from './shared/footer/footer.component';
12 12 import { SharedModule } from './modules/shared/shared.module';
  13 +import { ModalModule } from 'ngx-bootstrap/modal';
13 14  
14 15 @NgModule({
15 16 declarations: [
... ... @@ -25,6 +26,7 @@ import { SharedModule } from './modules/shared/shared.module';
25 26 AppRoutingModule,
26 27 HttpClientModule,
27 28 FormsModule,
  29 + ModalModule.forRoot(),
28 30 ReactiveFormsModule,
29 31 ReactiveFormsModule.withConfig({ warnOnNgModelWithFormControl: 'never' }),
30 32 SharedModule.forRoot(),
src/app/modules/admin/admin.component.ts
Diff comments   View file @ 51a6c06
1 1 import { Component, OnInit, HostListener } from '@angular/core';
2 2 import { Router } from '@angular/router';
  3 +import { BsModalRef } from 'ngx-bootstrap/modal';
3 4  
4 5 @Component({
5 6 selector: 'app-admin',
... ... @@ -12,19 +13,20 @@ export class AdminComponent implements OnInit {
12 13  
13 14 constructor(
14 15 private router: Router,
  16 + // private modalRef: BsModalRef
15 17 ) { }
16 18  
17   - ngOnInit() {
18   - this.startTimeOutInactividad();
19   - }
  19 + ngOnInit() {
  20 + // this.startTimeOutInactividad();
  21 + }
20 22  
21   - @HostListener('document:click', ['$event'])
  23 + @HostListener('document:click', ['$event'])
22 24  
23   - documentClick(event: MouseEvent) {
24   - if (event) {
25   - this.restartTimer();
26   - }
27   - }
  25 + // documentClick(event: MouseEvent) {
  26 + // if (event) {
  27 + // this.restartTimer();
  28 + // }
  29 + // }
28 30  
29 31 restartTimer() {
30 32 clearTimeout(this.timerReposo);
... ... @@ -33,6 +35,7 @@ export class AdminComponent implements OnInit {
33 35  
34 36 startTimeOutInactividad() {
35 37 this.timerReposo = setTimeout(() => {
  38 + // this.modalRef.hide();
36 39 this.router.navigate(['cancelar-compra']);
37 40 }, 90000);
38 41 }
src/app/modules/cancelar-compra/cancelar-compra.component.ts
Diff comments   View file @ 51a6c06
... ... @@ -27,7 +27,7 @@ export class CancelarCompraComponent implements OnInit {
27 27 }
28 28  
29 29 limpiarCarritoYvolver() {
30   - this.articuloService.carrito = undefined;
  30 + this.articuloService.carrito = [];
31 31 this.router.navigate(['/']);
32 32 }
33 33 }
src/app/modules/seleccion-articulos/seleccion-articulos.component.html
Diff comments   View file @ 51a6c06
... ... @@ -81,6 +81,9 @@
81 81 class="col px-2 my-1 my-md-3 h-auto"
82 82 *ngFor="let articulo of auxArticulos | slice:0:showQuantity;">
83 83 <div class="swing-in-top-fwd card h-auto">
  84 + <div *ngIf="articulo.PRO">
  85 + <i class="fas fa-piggy-bank"></i>
  86 + </div>
84 87 <img
85 88 draggable="false"
86 89 ondragstart="return false;"
... ... @@ -97,7 +100,7 @@
97 100 <div
98 101 [ngClass]="{'bg-secondary': articulo.promo}"
99 102 class="row mx-0 justify-content-between bg-primary badge-pill"
100   - (click)="elegirArticulo(articulo)">
  103 + (click)="!articulo.FPP ? elegirArticulo(articulo) : openModalPromos(articulo, templatePromos)">
101 104 <div class="col px-0 align-self-center text-white text-right">
102 105 {{articulo.PreVen | currency}}
103 106 </div>
... ... @@ -221,3 +224,57 @@
221 224 </div>
222 225  
223 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>
224 281 \ No newline at end of file
src/app/modules/seleccion-articulos/seleccion-articulos.component.ts
Diff comments   View file @ 51a6c06
1   -import { Component, OnInit } from '@angular/core';
2   -import { BsModalRef } from 'ngx-bootstrap/modal';
  1 +import { Component, OnInit, TemplateRef } from '@angular/core';
  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 7 import { CategoriaService } from 'src/app/services/categoria/categoria.service';
  8 +import { PromocionService } from 'src/app/services/promocion/promocion.service';
8 9  
9 10 @Component({
10 11 selector: 'app-seleccion-articulos',
... ... @@ -26,10 +27,14 @@ export class SeleccionArticulosComponent implements OnInit {
26 27 allActive = true;
27 28 modalRef: BsModalRef;
28 29 total: number = 0;
  30 + articuloPromo: IArticulo[] = [];
  31 + promociones: IArticulo[] = [];
29 32  
30 33 constructor(
31 34 public articuloService: ArticuloService,
32 35 private categoriaService: CategoriaService,
  36 + private modalService: BsModalService,
  37 + private promocionService: PromocionService
33 38 ) { }
34 39  
35 40 ngOnInit() {
... ... @@ -120,6 +125,7 @@ export class SeleccionArticulosComponent implements OnInit {
120 125 }
121 126  
122 127 elegirArticulo(articulo: IArticulo) {
  128 + console.log(this.articuloService.carrito)
123 129 this.articuloService.getById(articulo.id)
124 130 .subscribe((res: IArticulo) => {
125 131 res.cantidad = 1;
... ... @@ -127,6 +133,24 @@ export class SeleccionArticulosComponent implements OnInit {
127 133 }, err => console.error(err));
128 134 }
129 135  
  136 + openModalPromos(articulo: IArticulo, templatePromos: TemplateRef<any>) {
  137 + this.articuloService.getById(articulo.id)
  138 + .subscribe((res: IArticulo) => {
  139 + this.articuloPromo[0] = res;
  140 + this.getPromociones();
  141 + }, err => console.error(err));
  142 + this.modalRef = this.modalService.show(templatePromos, { class: 'custom-modal modal-dialog-centered', backdrop: 'static' });
  143 + }
  144 +
  145 + getPromociones() {
  146 + var sector = this.articuloPromo[0].CodSec;
  147 + var codigo = this.articuloPromo[0].CodArt;
  148 + this.promocionService.getPromociones(sector, codigo)
  149 + .subscribe((res: IArticulo[]) => {
  150 + this.promociones = res;
  151 + }, error => { console.error(error); })
  152 + }
  153 +
130 154 increaseShow() {
131 155 this.showQuantity += 100;
132 156 }
... ... @@ -149,4 +173,4 @@ export class SeleccionArticulosComponent implements OnInit {
149 173 el.scroll({ behavior: 'smooth', left: value + el.scrollLeft });
150 174 }, 500);
151 175 }
152 176 -}
  177 +}
153 178 \ No newline at end of file
src/scss/styles-bootstrap.scss
Diff comments   View file @ 51a6c06
... ... @@ -49,3 +49,10 @@ $border-radius-sm: 0.5rem;
49 49 .min-h-60 {
50 50 min-height: 60px;
51 51 }
  52 +
  53 +.custom-modal > div > div {
  54 + background-color: $primary !important;
  55 + border: none !important;
  56 + border-radius: 10rem;
  57 + margin-left: 10px !important;
  58 +}