Martin Macola / autoservicio

Browse Code »

Commit ac964d0816946c62d733eb55334c641f1716b17e

Authored by Marcelo Puebla 2019-09-03 11:11:51 -0300

1 parent e635d1e96e

Exists in master

Creado componente comanda.

Showing 6 changed files with 114 additions and 1 deletions Show diff stats

src/app/app-routing.module.ts

Diff comments View file @ ac964d0

 import { NgModule } from '@angular/core';
 import { Routes, RouterModule } from '@angular/router';
 import { HomeComponent } from './components/home/home.component';
 import { InicioComponent } from './components/inicio/inicio.component';
 import { BusquedaProductosComponent } from './components/busqueda-productos/busqueda-productos.component';
 import { ConfirmacionCarritoComponent } from './components/confirmacion-carrito/confirmacion-carrito.component';
 import { MasterComponent } from './components/master/master.component';
 import { AmbImagenesComponent } from './components/amb-imagenes/amb-imagenes.component';
 import { PagoComponent } from './components/pago/pago.component';
 import { CancelarCompraComponent } from './components/cancelar-compra/cancelar-compra.component';
 import { MensajeFinalComponent } from './components/mensaje-final/mensaje-final.component';
+import { ComandaComponent } from './components/comanda/comanda.component';
 const routes: Routes = [
   { path: '', component: HomeComponent },
   { path: 'home', component: HomeComponent },
   { path: 'abm-imagenes', component: AmbImagenesComponent },
   { path: 'confirmacion-carrito', component: ConfirmacionCarritoComponent },
   { path: 'pago', component: PagoComponent },
   { path: 'cancelar-compra', component: CancelarCompraComponent },
   { path: 'mensaje-final', component: MensajeFinalComponent },
+  { path: 'comanda', component: ComandaComponent },
   {
     path: '',
     component: MasterComponent,
     children: [
       { path: 'inicio', component: InicioComponent },
       { path: 'busqueda-productos', component: BusquedaProductosComponent }
     ]
   },
   { path: '**', redirectTo: '/home', pathMatch: 'full' },
 ];
 @NgModule({
   imports: [RouterModule.forRoot(routes, {onSameUrlNavigation: 'reload'})],
   exports: [RouterModule]
 })
 export class AppRoutingModule { }

src/app/app.module.ts

Diff comments View file @ ac964d0

 //#region MODULES
 import { BrowserModule } from '@angular/platform-browser';
 import { NgModule } from '@angular/core';
 import { AppRoutingModule } from './app-routing.module';
 import { HttpClientModule } from '@angular/common/http';
 import { FormsModule, ReactiveFormsModule } from '@angular/forms';
 import { TooltipModule } from 'ngx-bootstrap/tooltip';
 import { PopoverModule } from 'ngx-bootstrap/popover';
 import { CarouselModule } from 'ngx-bootstrap/carousel';
 import { PaginationModule } from 'ngx-bootstrap/pagination';
 //#endregion
 //#region Keyboard
 import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
 import { MatButtonModule } from '@angular/material/button';
 import { MatKeyboardModule } from '@ngx-material-keyboard/core';
 //#endregion
 //#region COMPONENTS
 import { AppComponent } from './app.component';
 import { HeaderComponent } from './components/header/header.component';
 import { SidebarComponent } from './components/sidebar/sidebar.component';
 import { HomeComponent } from './components/home/home.component';
 import { InicioComponent } from './components/inicio/inicio.component';
 import { BusquedaProductosComponent } from './components/busqueda-productos/busqueda-productos.component';
 import { ConfirmacionCarritoComponent } from './components/confirmacion-carrito/confirmacion-carrito.component';
 import { MasterComponent } from './components/master/master.component';
 import { PopoverPromosComponent } from './components/popover-promos/popover-promos.component';
 import { PopoverSinonimosComponent } from './components/popover-sinonimos/popover-sinonimos.component';
 import { AmbImagenesComponent } from './components/amb-imagenes/amb-imagenes.component';
 import { PagoComponent } from './components/pago/pago.component';
 import { CancelarCompraComponent } from './components/cancelar-compra/cancelar-compra.component';
 import { MensajeFinalComponent } from './components/mensaje-final/mensaje-final.component';
+import { ComandaComponent } from './components/comanda/comanda.component';
 //#endregion
 @NgModule({
   declarations: [
     AppComponent,
     HeaderComponent,
     SidebarComponent,
     HomeComponent,
     InicioComponent,
     BusquedaProductosComponent,
     ConfirmacionCarritoComponent,
     MasterComponent,
     PopoverPromosComponent,
     PopoverSinonimosComponent,
     AmbImagenesComponent,
     PagoComponent,
     CancelarCompraComponent,
-    MensajeFinalComponent
+    MensajeFinalComponent,
+    ComandaComponent
   ],
   imports: [
     BrowserModule,
     AppRoutingModule,
     HttpClientModule,
     FormsModule,
     ReactiveFormsModule,
     ReactiveFormsModule.withConfig({ warnOnNgModelWithFormControl: 'never' }),
     TooltipModule.forRoot(),
     PopoverModule.forRoot(),
     BrowserAnimationsModule,
     MatKeyboardModule,
     MatButtonModule,
     CarouselModule.forRoot(),
     PaginationModule.forRoot()
   ],
   providers: [],
   bootstrap: [AppComponent]
 })
 export class AppModule { }

src/app/components/comanda/comanda.component.html

Diff comments View file @ ac964d0

File was created	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>
	38

src/app/components/comanda/comanda.component.scss

Diff comments View file @ ac964d0

File was created	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	}
	29

src/app/components/comanda/comanda.component.spec.ts

Diff comments View file @ ac964d0

File was created	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	});
	26

src/app/components/comanda/comanda.component.ts

Diff comments View file @ ac964d0

File was created	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	}
	20