Luis Suarez / autoservicio-axion

Commit 29059ce0201164fe6b6b35987b77cc00df0a646f

Authored by Marcelo Puebla 2020-01-14 17:10:50 -0300

Merge branch 'master' into 'develop'

Master(benjamin)

See merge request !18

Showing 3 changed files Show diff stats

src/app/app.module.ts

Diff comments View file @ 29059ce

 import { BrowserModule } from '@angular/platform-browser';
 import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
 import { NgModule } from '@angular/core';
 import { AppRoutingModule } from './app-routing.module';
 import { HttpClientModule } from '@angular/common/http';
 import { FormsModule, ReactiveFormsModule } from '@angular/forms';
 import { SplitPipe } from './pipes/split.pipe';
 import { AppComponent } from './app.component';
 import { SplashScreenComponent } from './modules/splash-screen/splash-screen.component';
 import { AdminComponent } from './modules/admin/admin.component';
 import { FooterComponent } from './shared/footer/footer.component';
 import { SharedModule } from './modules/shared/shared.module';
-import { NgxSpinnerModule } from 'ngx-spinner';
 @NgModule({
   declarations: [
     AppComponent,
     SplashScreenComponent,
     SplitPipe,
     AdminComponent,
     FooterComponent,
   ],
   imports: [
     BrowserModule,
     BrowserAnimationsModule,
     AppRoutingModule,
     HttpClientModule,
     FormsModule,
     ReactiveFormsModule,
     ReactiveFormsModule.withConfig({ warnOnNgModelWithFormControl: 'never' }),
     SharedModule.forRoot(),
-    NgxSpinnerModule,
   ],
   bootstrap: [AppComponent]
 })
 export class AppModule { }

src/app/modules/comanda/comanda.component.html

Diff comments View file @ 29059ce

 <div class="container-fluid d-flex flex-column h-100 fade-in pb-4 pr-2">
   <div class="row pt-5 mt-n5">
     <div class="col-12">
       <p class="mb-3 h2 text-center mt-2">Pedidos a elaborar</p>
     </div>
   </div>
   <div class="row flex-fill m-0 overflow-scroll">
     <div class="col-12 px-2">
       <div class="card-columns h-100 m-1 fade-in disable-user-select">
         <div
           *ngFor="let comanda of comandas"
           class="card fade-in rounded-xs shadow-sm mt-2"
           [ngClass]="{
             'bg-light': comanda.estado === 1,
             'bg-danger': comanda.estado === 2,
             'bg-success swing-out-top-bck': comanda.estado === 3
           }">
           <div class="card-body p-2">
             <div class="row justify-content-between">
               <img
                 src="../../../assets/img/para-llevar-fondo-sombra.png"
                 class="w-25 h-25 float-left ml-0 mt-n3"
                 *ngIf="comanda.paraLlevar == true">
               <div></div>
               <!-- NUMERO DE PEDIDO -->
               <p class="h1 text-right mr-3">
                 {{rellenar(comanda.id.toString().slice(0), 3)}}
               </p>
           </div>
             <div>
               <!-- PEDIDO A NOMBRE DE -->
               <p class="text-center m-0">
                 {{comanda.pedidoAnombreDe ? comanda.pedidoAnombreDe.toUpperCase() : ''}}
               </p>
               <!-- TIMER PEDIDO -->
               <div class="d-flex justify-content-between align-items-center mt-2">
                 <p><i class="fas fa-user-clock text-info"></i></p>
                 <p class="text-center mb-1">
                   {{comanda.hoursPedido}}:{{comanda.minutesPedido}}:{{comanda.secondsPedido}}
                 </p>
                 <p><i class="far fa-clock fa-spin text-info"></i></p>
               </div>
               <div *ngFor="let detalle of comanda.detalles">
                 <p
                   class="card-text border-top pt-2 mb-2"
                   [ngClass]="
                   {
                     'border-secondary': comanda.estado === 1,
                     'border-light': comanda.estado != 1
                   }">
                   <!-- DETALLE Y CANTIDAD -->
                   <small>{{detalle.DetLar}}</small><br>
                   <small>CANT.{{detalle.cantidad}}</small>
                 </p>
+                <blockquote
+                  *ngIf="detalle.comentario">
+                  <p class="text-muted font-italic px-4" *ngIf="comanda.estado === 1"><small>{{detalle.comentario}}</small></p>
+                  <p class="text-white font-italic px-4" *ngIf="comanda.estado !== 1"><small>{{detalle.comentario}}</small></p>
+                </blockquote>
               </div>
               <!-- BOTONES -->
               <button
                 *ngIf="comanda.estado === 1"
                 class="btn btn-block btn-primary shadow-sm btn-elaborar"
                 (click)="updateComanda(comanda, 2, 'En elaboracion')">
                 <div class="row justify-content-between">
                   <div></div>
                   <p class="ml-4" style="color: #fff;">Elaborar</p>
                   <img
                   draggable="false"
                   ondragstart="return false;"
                   (contextmenu)="false"
                   class="icon-30 mr-2"
                   src="assets/img/ir.svg">
                 </div>
               </button>
               <button
                 *ngIf="comanda.estado === 2"
                 class="btn btn-block shadow-sm  btn-terminar"
                 (click)="updateComanda(comanda, 3, 'Terminado')">
                 <div class="row justify-content-between">
                   <div></div>
                   <p class="ml-4">Terminar</p>
                   <img
                   draggable="false"
                   ondragstart="return false;"
                   (contextmenu)="false"
                   class="icon-30 mr-2"
                   src="assets/img/flecha-borde-color.svg">
                 </div>
               </button>
               <button
                 *ngIf="comanda.estado === 2"
                 class="btn btn-block btn-deshacer btn-sm shadow-sm p-0"
                 (click)="updateComanda(comanda, 1, 'Pagado')">
                 <div class="row justify-content-between">
                   <div></div>
                   <span class="h6 ml-4"><small>Deshacer</small></span>
                   <i class="fas fa-undo-alt text-info mr-4 my-auto"></i>
                 </div>
               </button>
             </div>
             <!-- TIMER DE ELABORACION -->
             <div *ngIf="comanda.estado === 2" class="d-flex justify-content-between align-items-center mt-2">
               <div *ngIf="comanda.estado !== 1">
                 <i class="fa fa-utensils text-info" aria-hidden="true"></i>
               </div>
               <span *ngIf="comanda.estado === 1" class="text-dark">
                 {{comanda.hoursElaboracion}}:{{comanda.minutesElaboracion}}:{{comanda.secondsElaboracion}}
               </span>
               <span *ngIf="comanda.estado !== 1" class="text-white">
                 {{comanda.hoursElaboracion}}:{{comanda.minutesElaboracion}}:{{comanda.secondsElaboracion}}
               </span>
               <i class="fas fa-clock fa-spin text-info"></i>
             </div>
           </div>
         </div>
       </div>
     </div>
   </div>
 </div>

src/app/modules/comanda/comanda.component.ts

Diff comments View file @ 29059ce

 import { Component, OnInit } from '@angular/core';
 import { IComanda, IComandaDetalle, IComponente } from 'src/app/interfaces/IComanda';
 import { ComandaService } from 'src/app/services/comanda/comanda.service';
 import * as _ from 'lodash';
-import { NgxSpinnerService } from 'ngx-spinner'
 @Component({
   selector: 'app-comanda',
   templateUrl: './comanda.component.html',
   styleUrls: ['./comanda.component.scss']
 })
 export class ComandaComponent implements OnInit {
   comandas: IComanda[] = [];
   cicloTime: any;
   constructor(
     private comandaService: ComandaService,
-    private spinnerService: NgxSpinnerService,
   ) { }
   ngOnInit() {
     this.getComandas();
     this.timerGetComandas();
   }
   ngOnDestroy() {
     clearInterval(this.cicloTime);
   }
   timerGetComandas() {
     this.cicloTime = setInterval(() => {
       this.getComandas();
     }, 5000);
   }
   getComandas() {
     this.comandaService.getAll()
       .subscribe((resComandas: IComanda[]) => {
         this.addNewComandas(resComandas);
       }, e => console.error(e));
   }
   addNewComandas(resComandas: IComanda[]) {
     for (let j = 0; j < resComandas.length; j++) {
       for (let i = 0; i < this.comandas.length; i++) {
         if (this.comandas[i].id === resComandas[j].id) {
           resComandas.splice(j, 1);
         }
       }
     }
     if (!resComandas.length) return;
     Array.prototype.push.apply(this.comandas, resComandas);
     this.startTimersPedido(resComandas);
   }
   updateComanda(comanda: IComanda, estadoNuevo: number, observacionNueva: string) {
     let data = {
       idComanda: comanda.id,
       estado: estadoNuevo,
       observacion: observacionNueva,
       tiempoEspera: `${comanda.hoursPedido}:${comanda.secondsPedido}:${comanda.secondsPedido}`,
       tiempoElaboracion: `${comanda.hoursElaboracion}:${comanda.secondsElaboracion}:${comanda.secondsElaboracion}`,
     }
     if (data.estado == 3) {
       this.comandaService.imprimirComandaCocina(parseInt(data.idComanda))
         .subscribe(res => { }, err => console.error(err)
         );
     }
     if (estadoNuevo !== 2) comanda.detalles.forEach(d => d.seeDetalle = false);
     this.comandaService.update(data)
       .subscribe((res: any) => {
         if (res.data) {
           comanda.estado = estadoNuevo;
           comanda.observacion = observacionNueva;
           if (estadoNuevo == 2) {
             this.startTimerElaboracion(comanda);
           } else if (comanda.timerElaboracion) {
             clearInterval(comanda.timerElaboracion)
           }
         }
       }, e => console.error(e));
   }
   rellenar(relleno, longitud) {
     relleno = '' + relleno;
     while (relleno.length < longitud) {
       relleno = '0' + relleno;
     }
     return relleno;
   }
   toggleVerComponentes(detalle: IComandaDetalle, comanda: IComanda) {
     detalle.seeDetalle = !detalle.seeDetalle;
   }
   hasTipo(componentes: IComponente[]) {
     return componentes.some(c => c.tipoArticulo === 6);
   }
   //#region TIMERS
   startTimersPedido(comandas) {
     comandas.forEach((comanda: IComanda) => {
       this.comandaService.startTimerComanda(comanda, 'Pedido');
       if (comanda.estado === 2) {
         this.startTimerElaboracion(comanda);
       }
     });
   }
   startTimerElaboracion(comanda: IComanda) {
-    this.spinnerService.show(comanda.id.toString());
     this.comandaService.startTimerComanda(comanda, 'Elaboracion');
   }
   //#endregion
 }