Commit ac964d0816946c62d733eb55334c641f1716b17e

Authored by Marcelo Puebla
1 parent e635d1e96e
Exists in master

Creado componente comanda.

src/app/app-routing.module.ts
... ... @@ -9,6 +9,7 @@ import { AmbImagenesComponent } from './components/amb-imagenes/amb-imagenes.com
9 9 import { PagoComponent } from './components/pago/pago.component';
10 10 import { CancelarCompraComponent } from './components/cancelar-compra/cancelar-compra.component';
11 11 import { MensajeFinalComponent } from './components/mensaje-final/mensaje-final.component';
  12 +import { ComandaComponent } from './components/comanda/comanda.component';
12 13  
13 14 const routes: Routes = [
14 15 { path: '', component: HomeComponent },
... ... @@ -18,6 +19,7 @@ const routes: Routes = [
18 19 { path: 'pago', component: PagoComponent },
19 20 { path: 'cancelar-compra', component: CancelarCompraComponent },
20 21 { path: 'mensaje-final', component: MensajeFinalComponent },
  22 + { path: 'comanda', component: ComandaComponent },
21 23 {
22 24 path: '',
23 25 component: MasterComponent,
src/app/app.module.ts
... ... @@ -31,6 +31,7 @@ import { AmbImagenesComponent } from './components/amb-imagenes/amb-imagenes.com
31 31 import { PagoComponent } from './components/pago/pago.component';
32 32 import { CancelarCompraComponent } from './components/cancelar-compra/cancelar-compra.component';
33 33 import { MensajeFinalComponent } from './components/mensaje-final/mensaje-final.component';
  34 +import { ComandaComponent } from './components/comanda/comanda.component';
34 35 //#endregion
35 36  
36 37 @NgModule({
... ... @@ -48,7 +49,8 @@ import { MensajeFinalComponent } from './components/mensaje-final/mensaje-final.
48 49 AmbImagenesComponent,
49 50 PagoComponent,
50 51 CancelarCompraComponent,
51   - MensajeFinalComponent
  52 + MensajeFinalComponent,
  53 + ComandaComponent
52 54 ],
53 55 imports: [
54 56 BrowserModule,
src/app/components/comanda/comanda.component.html
... ... @@ -0,0 +1,37 @@
  1 +<div class="container-fluid p-0">
  2 + <div class="row m-1 fade-in disable-user-select">
  3 + <div class="col-2 col-1-5 p-1" *ngFor="let item of itemsArray">
  4 + <div
  5 + class="card rounded-sm shadow-sm"
  6 + [ngClass]="{ 'green-card': false, 'red-card': false }"
  7 + >
  8 + <img
  9 + class="card-img-top rounded-sm shadow"
  10 + src="{{ apiImagenes }}/imagenes/cerealitas.jpg"
  11 + />
  12 + <div class="card-body px-1 py-2">
  13 + <p class="h6 card-title">Title</p>
  14 + <p class="card-text">Text</p>
  15 + <button class="btn btn-block btn-danger shadow p-1">Elaborar</button>
  16 + <button class="btn btn-block btn-success shadow p-1">
  17 + Terminado
  18 + </button>
  19 + <div class="row mt-2 m-0">
  20 + <div class="col-6 p-0 pr-1">
  21 + <button class="btn btn-block btn-secondary btn-sm shadow p-0">
  22 + <span class="pr-1 h7"><small>Eliminar</small></span>
  23 + <i class="fa fa-trash" aria-hidden="true"></i>
  24 + </button>
  25 + </div>
  26 + <div class="col-6 p-0 pl-1">
  27 + <button class="btn btn-block btn-light btn-sm shadow p-0">
  28 + <span class="pr-1 h7"><small>En espera</small></span>
  29 + <i class="fa fa-undo text-warning" aria-hidden="true"></i>
  30 + </button>
  31 + </div>
  32 + </div>
  33 + </div>
  34 + </div>
  35 + </div>
  36 + </div>
  37 +</div>
src/app/components/comanda/comanda.component.scss
... ... @@ -0,0 +1,28 @@
  1 +@media (min-width: 1200px) {
  2 + .col-1-5 {
  3 + flex: 0 0 12.5%;
  4 + max-width: 12.5%;
  5 + position: relative;
  6 + width: 100%;
  7 + padding-right: 15px;
  8 + padding-left: 15px;
  9 + }
  10 +}
  11 +
  12 +.h7 {
  13 + font-size: 0.75rem;
  14 +}
  15 +
  16 +.red-card {
  17 + background-color: #8c000e;
  18 + .card-body {
  19 + color: #fff;
  20 + }
  21 +}
  22 +
  23 +.green-card {
  24 + background-color: #00751B;
  25 + .card-body {
  26 + color: #fff;
  27 + }
  28 +}
src/app/components/comanda/comanda.component.spec.ts
... ... @@ -0,0 +1,25 @@
  1 +import { async, ComponentFixture, TestBed } from '@angular/core/testing';
  2 +
  3 +import { ComandaComponent } from './comanda.component';
  4 +
  5 +describe('ComandaComponent', () => {
  6 + let component: ComandaComponent;
  7 + let fixture: ComponentFixture<ComandaComponent>;
  8 +
  9 + beforeEach(async(() => {
  10 + TestBed.configureTestingModule({
  11 + declarations: [ ComandaComponent ]
  12 + })
  13 + .compileComponents();
  14 + }));
  15 +
  16 + beforeEach(() => {
  17 + fixture = TestBed.createComponent(ComandaComponent);
  18 + component = fixture.componentInstance;
  19 + fixture.detectChanges();
  20 + });
  21 +
  22 + it('should create', () => {
  23 + expect(component).toBeTruthy();
  24 + });
  25 +});
src/app/components/comanda/comanda.component.ts
... ... @@ -0,0 +1,19 @@
  1 +import { Component, OnInit } from '@angular/core';
  2 +import { appSettings } from 'src/etc/AppSettings';
  3 +
  4 +@Component({
  5 + selector: 'app-comanda',
  6 + templateUrl: './comanda.component.html',
  7 + styleUrls: ['./comanda.component.scss']
  8 +})
  9 +export class ComandaComponent implements OnInit {
  10 +
  11 + private apiImagenes = appSettings.apiImagenes;
  12 + private itemsArray = [{},{},{},{},{},{},{},{}]
  13 +
  14 + constructor() { }
  15 +
  16 + ngOnInit() {
  17 + }
  18 +
  19 +}