Big Chunk of updates on way to making the sales portion working

bookie/src/app/sales/bills/bill-resolver.service.ts

@@ -0,0 +1,18 @@
+import {Injectable} from '@angular/core';
+import {ActivatedRouteSnapshot, Resolve, Router, RouterStateSnapshot} from '@angular/router';
+import {Observable} from 'rxjs/internal/Observable';
+import {Table} from "../../core/table";
+import {TableService} from "../../tables/table.service";
+
+@Injectable({
+  providedIn: 'root'
+})
+export class BillResolver implements Resolve<Table[]> {
+
+  constructor(private ser: TableService, private router: Router) {
+  }
+
+  resolve(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): Observable<Table[]> {
+    return this.ser.list();
+  }
+}

bookie/src/app/sales/bills/bills.component.css

@@ -0,0 +1,10 @@
+.kot {
+  background-color: red;
+  font-weight: bold;
+}
+
+.square-button {
+  min-width: 150px;
+  max-width: 150px;
+  min-height: 150px;
+}

bookie/src/app/sales/bills/bills.component.html

@@ -0,0 +1,15 @@
+<mat-card>
+  <mat-card-title-group>
+    <mat-card-title>Bill</mat-card-title>
+  </mat-card-title-group>
+  <mat-card-content fxLayout="row wrap" fxLayoutGap="grid 20px">
+    <mat-table #table [dataSource]="dataSource" aria-label="Elements">
+      <!-- Info Column -->
+      <ng-container matColumnDef="info">
+        <mat-cell *matCellDef="let row" [class.kot]="row.isKot">{{row.info}}</mat-cell>
+      </ng-container>
+      <mat-row *matRowDef="let row; columns: displayedColumns;"></mat-row>
+    </mat-table>
+  </mat-card-content>
+</mat-card>
+<router-outlet></router-outlet>

bookie/src/app/sales/bills/bills.component.spec.ts

@@ -0,0 +1,25 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { BillsComponent } from './bills.component';
+
+describe('BillsComponent', () => {
+  let component: BillsComponent;
+  let fixture: ComponentFixture<BillsComponent>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [ BillsComponent ]
+    })
+    .compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(BillsComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

bookie/src/app/sales/bills/bills.component.ts

@@ -0,0 +1,22 @@
+import { Component, OnInit } from '@angular/core';
+import { ActivatedRoute } from "@angular/router";
+import { Table } from "../../core/table";
+
+@Component({
+  selector: 'app-bills',
+  templateUrl: './bills.component.html',
+  styleUrls: ['./bills.component.css']
+})
+export class BillsComponent implements OnInit {
+  list: Table[];
+
+  constructor(private route: ActivatedRoute) {
+  }
+
+  ngOnInit() {
+    this.route.data
+      .subscribe((data: { list: Table[] }) => {
+        this.list = data.list;
+      });
+  }
+}

bookie/src/app/sales/menu-categories/menu-categories-resolver.service.spec.ts

@@ -0,0 +1,12 @@
+import { TestBed } from '@angular/core/testing';
+
+import { MenuCategoriesResolver } from './menu-categories-resolver.service';
+
+describe('MenuCategoriesResolver', () => {
+  beforeEach(() => TestBed.configureTestingModule({}));
+
+  it('should be created', () => {
+    const service: MenuCategoriesResolver = TestBed.get(MenuCategoriesResolver);
+    expect(service).toBeTruthy();
+  });
+});

bookie/src/app/sales/menu-categories/menu-categories-resolver.service.ts

@@ -0,0 +1,18 @@
+import { Injectable } from '@angular/core';
+import { ActivatedRouteSnapshot, Resolve, Router, RouterStateSnapshot } from '@angular/router';
+import { MenuCategory } from '../../core/menu-category';
+import { Observable } from 'rxjs/internal/Observable';
+import { MenuCategoryService } from "../../menu-category/menu-category.service";
+
+@Injectable({
+  providedIn: 'root'
+})
+export class MenuCategoriesResolver implements Resolve<MenuCategory[]> {
+
+  constructor(private ser: MenuCategoryService, private router: Router) {
+  }
+
+  resolve(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): Observable<MenuCategory[]> {
+    return this.ser.list();
+  }
+}

bookie/src/app/sales/menu-categories/menu-categories.component.css

@@ -0,0 +1,5 @@
+.square-button {
+  min-width: 150px;
+  max-width: 150px;
+  min-height: 150px;
+}

bookie/src/app/sales/menu-categories/menu-categories.component.html

@@ -0,0 +1,6 @@
+<mat-card>
+  <mat-card-content fxLayout="row wrap" fxLayoutGap="grid 20px">
+    <button mat-raised-button class="square-button"
+       *ngFor="let item of list" [routerLink]="['/sales', 'products', item.id]">{{item.name}}</button>
+  </mat-card-content>
+</mat-card>

bookie/src/app/sales/menu-categories/menu-categories.component.spec.ts

@@ -0,0 +1,25 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { MenuCategoriesComponent } from './menu-categories.component';
+
+describe('MenuCategoriesComponent', () => {
+  let component: MenuCategoriesComponent;
+  let fixture: ComponentFixture<MenuCategoriesComponent>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [ MenuCategoriesComponent ]
+    })
+    .compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(MenuCategoriesComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

bookie/src/app/sales/menu-categories/menu-categories.component.ts

@@ -0,0 +1,23 @@
+import { Component, OnInit } from '@angular/core';
+import { ActivatedRoute } from "@angular/router";
+import { MenuCategory } from "../../core/menu-category";
+
+@Component({
+  selector: 'app-menu-category',
+  templateUrl: './menu-categories.component.html',
+  styleUrls: ['./menu-categories.component.css']
+})
+export class MenuCategoriesComponent implements OnInit {
+  list: MenuCategory[];
+
+  constructor(private route: ActivatedRoute) {
+  }
+
+  ngOnInit() {
+    this.route.data
+      .subscribe((data: { list: MenuCategory[] }) => {
+        this.list = data.list;
+      });
+  }
+
+}

bookie/src/app/sales/modifiers/modifiers.component.css

@@ -0,0 +1,5 @@
+.square-button {
+  min-width: 150px;
+  max-width: 150px;
+  min-height: 150px;
+}

bookie/src/app/sales/modifiers/modifiers.component.html

@@ -0,0 +1,17 @@
+<mat-tab-group>
+  <mat-tab *ngFor="let item of list">
+    <ng-template matTabLabel>
+      <span>{{item.name}}</span>
+      <mat-chip-list matBadge="0" matBadgeOverlap="false">
+        <mat-chip *ngIf="!item.maximum">{{item.minimum}} - ∞</mat-chip>
+        <mat-chip *ngIf="!!item.maximum">{{item.minimum}} - {{item.maximum}}</mat-chip>
+      </mat-chip-list>
+    </ng-template>
+    <mat-button-toggle-group multiple>
+      <mat-button-toggle mat-raised-button class="square-button" *ngFor="let m of item.modifiers" (click)="select(m)">{{m.name}}</mat-button-toggle>
+    </mat-button-toggle-group>
+  </mat-tab>
+</mat-tab-group>
+<mat-dialog-actions align="end">
+  <button mat-button mat-dialog-close>Done</button>
+</mat-dialog-actions>

bookie/src/app/sales/modifiers/modifiers.component.spec.ts

@@ -0,0 +1,25 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { ModifiersComponent } from './modifiers.component';
+
+describe('ModifiersComponent', () => {
+  let component: ModifiersComponent;
+  let fixture: ComponentFixture<ModifiersComponent>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [ ModifiersComponent ]
+    })
+    .compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(ModifiersComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

bookie/src/app/sales/modifiers/modifiers.component.ts

@@ -0,0 +1,26 @@
+import { Component, Inject } from '@angular/core';
+import { ModifierCategory } from "../../core/modifier-category";
+import { Modifier } from "../../core/modifier";
+import { MAT_DIALOG_DATA } from "@angular/material";
+import {Observable} from "rxjs";
+
+@Component({
+  selector: 'app-modifiers',
+  templateUrl: './modifiers.component.html',
+  styleUrls: ['./modifiers.component.css']
+})
+export class ModifiersComponent {
+  list: ModifierCategory[];
+
+  constructor(@Inject(MAT_DIALOG_DATA) public data: Observable<ModifierCategory[]>) {
+    this.data.subscribe((list: ModifierCategory[]) => {
+      this.list = list;
+      console.log(this.list);
+    });
+    console.log(this.list);
+  }
+
+  select(m: Modifier) {
+    console.log(m);
+  }
+}

bookie/src/app/sales/products/products-resolver.service.spec.ts

@@ -0,0 +1,12 @@
+import { TestBed } from '@angular/core/testing';
+
+import { ProductsResolver } from './products-resolver.service';
+
+describe('ProductsResolver', () => {
+  beforeEach(() => TestBed.configureTestingModule({}));
+
+  it('should be created', () => {
+    const service: ProductsResolver = TestBed.get(ProductsResolver);
+    expect(service).toBeTruthy();
+  });
+});

bookie/src/app/sales/products/products-resolver.service.ts

@@ -0,0 +1,19 @@
+import { Injectable } from '@angular/core';
+import { ActivatedRouteSnapshot, Resolve, Router, RouterStateSnapshot } from "@angular/router";
+import { Observable } from "rxjs";
+import { Product } from "../../core/product";
+import { ProductService } from "../../product/product.service";
+
+@Injectable({
+  providedIn: 'root'
+})
+export class ProductsResolver implements Resolve<Product[]> {
+
+  constructor(private ser: ProductService, private router: Router) {
+  }
+
+  resolve(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): Observable<Product[]> {
+    const id = route.paramMap.get('id');
+    return this.ser.listIsActiveOfCategory(id);
+  }
+}

bookie/src/app/sales/products/products.component.css

@@ -0,0 +1,5 @@
+.square-button {
+  min-width: 150px;
+  max-width: 150px;
+  min-height: 150px;
+}

bookie/src/app/sales/products/products.component.html

@@ -0,0 +1,6 @@
+<mat-card>
+  <mat-card-content fxLayout="row wrap" fxLayoutGap="grid 20px">
+    <button mat-raised-button class="square-button"
+       *ngFor="let item of list" (click)="showModifier(item)">{{item.name}}</button>
+  </mat-card-content>
+</mat-card>

bookie/src/app/sales/products/products.component.spec.ts

@@ -0,0 +1,25 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { ProductsComponent } from './products.component';
+
+describe('ProductsComponent', () => {
+  let component: ProductsComponent;
+  let fixture: ComponentFixture<ProductsComponent>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [ ProductsComponent ]
+    })
+    .compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(ProductsComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

bookie/src/app/sales/products/products.component.ts

@@ -0,0 +1,39 @@
+import { Component, OnInit } from '@angular/core';
+import { ActivatedRoute } from "@angular/router";
+import { MatDialog } from "@angular/material";
+import { Product } from "../../core/product";
+import {ModifiersComponent} from "../modifiers/modifiers.component";
+import {ModifierCategoryService} from "../../modifier-categories/modifier-category.service";
+
+@Component({
+  selector: 'app-products',
+  templateUrl: './products.component.html',
+  styleUrls: ['./products.component.css']
+})
+export class ProductsComponent implements OnInit {
+  list: Product[];
+
+  constructor(private route: ActivatedRoute, private dialog: MatDialog, private modifierCategoryService: ModifierCategoryService) {
+  }
+
+  ngOnInit() {
+    this.route.data
+      .subscribe((data: { list: Product[] }) => {
+        this.list = data.list;
+      });
+  }
+
+  showModifier(product: Product): void {
+    // [routerLink]="['/sales', 'modifiers', item.id]"
+    let dialogRef = this.dialog.open(ModifiersComponent, {
+      position: {
+        top: '10vh'
+      },
+      data: this.modifierCategoryService.listIsActiveOfProduct(product.id)
+    });
+
+    dialogRef.afterClosed().subscribe(result => {
+      console.log('The dialog was closed');
+    });
+  }
+}

bookie/src/app/sales/running-tables/running-tables-resolver.service.ts

@@ -0,0 +1,18 @@
+import {Injectable} from '@angular/core';
+import {ActivatedRouteSnapshot, Resolve, Router, RouterStateSnapshot} from '@angular/router';
+import {Observable} from 'rxjs/internal/Observable';
+import {Table} from "../../core/table";
+import {TableService} from "../../tables/table.service";
+
+@Injectable({
+  providedIn: 'root'
+})
+export class RunningTablesResolver implements Resolve<Table[]> {
+
+  constructor(private ser: TableService, private router: Router) {
+  }
+
+  resolve(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): Observable<Table[]> {
+    return this.ser.list();
+  }
+}

bookie/src/app/sales/running-tables/running-tables.component.css

@@ -0,0 +1,5 @@
+.square-button {
+  min-width: 150px;
+  max-width: 150px;
+  min-height: 150px;
+}

bookie/src/app/sales/running-tables/running-tables.component.html

@@ -0,0 +1,10 @@
+<mat-card>
+  <mat-card-title-group>
+    <mat-card-title>Running Tables</mat-card-title>
+  </mat-card-title-group>
+  <mat-card-content fxLayout="row wrap" fxLayoutGap="grid 20px">
+    <button mat-raised-button class="square-button" [routerLink]="['/sales', 'menu-categories']">Menu Categories</button>
+    <button mat-raised-button class="square-button"
+       *ngFor="let table of list" [routerLink]="['/bills', 'new']" [queryParams]="{table: table.id}" queryParamsHandling="merge">{{table.name}}</button>
+  </mat-card-content>
+</mat-card>

bookie/src/app/sales/running-tables/running-tables.component.spec.ts

@@ -0,0 +1,25 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { RunningTablesComponent } from './running-tables.component';
+
+describe('RunningTablesComponent', () => {
+  let component: RunningTablesComponent;
+  let fixture: ComponentFixture<RunningTablesComponent>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [ RunningTablesComponent ]
+    })
+    .compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(RunningTablesComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

bookie/src/app/sales/running-tables/running-tables.component.ts

@@ -0,0 +1,22 @@
+import { Component, OnInit } from '@angular/core';
+import { ActivatedRoute } from "@angular/router";
+import { Table } from "../../core/table";
+
+@Component({
+  selector: 'app-running-tables',
+  templateUrl: './running-tables.component.html',
+  styleUrls: ['./running-tables.component.css']
+})
+export class RunningTablesComponent implements OnInit {
+  list: Table[];
+
+  constructor(private route: ActivatedRoute) {
+  }
+
+  ngOnInit() {
+    this.route.data
+      .subscribe((data: { list: Table[] }) => {
+        this.list = data.list;
+      });
+  }
+}

bookie/src/app/sales/sales-routing.module.ts

@@ -0,0 +1,88 @@
+import { NgModule } from '@angular/core';
+import { Routes, RouterModule } from '@angular/router';
+import { AuthGuard } from "../auth/auth-guard.service";
+import { RunningTablesResolver } from "./running-tables/running-tables-resolver.service";
+import { RunningTablesComponent } from "./running-tables/running-tables.component";
+import { MenuCategoriesComponent } from "./menu-categories/menu-categories.component";
+import { MenuCategoriesResolver } from "./menu-categories/menu-categories-resolver.service";
+import { ProductsComponent } from "./products/products.component";
+import { ProductsResolver } from "./products/products-resolver.service";
+import { BillsComponent } from "./bills/bills.component";
+import { BillResolver } from "./bills/bill-resolver.service";
+
+const routes: Routes = [
+  {
+    path: 'tables',
+    component: RunningTablesComponent,
+    canActivate: [AuthGuard],
+    data: {
+      permission: 'Guest Book'
+    },
+    resolve: {
+      list: RunningTablesResolver
+    }
+  },
+  {
+    path: 'tables/:id',
+    component: RunningTablesComponent,
+    canActivate: [AuthGuard],
+    data: {
+      permission: 'Guest Book'
+    },
+    resolve: {
+      item: RunningTablesResolver
+    }
+  },
+  {
+    path: 'bill',
+    component: BillsComponent,
+    canActivate: [AuthGuard],
+    // canDeactivate: [CanDeactivateGuard],
+    data: {
+      permission: 'Guest Book'
+    },
+    resolve: {
+      list: BillResolver
+    },
+    children: [
+      {
+        path: 'menu-categories',
+        component: MenuCategoriesComponent,
+        canActivate: [AuthGuard],
+        data: {
+          permission: 'Guest Book'
+        },
+        resolve: {
+          list: MenuCategoriesResolver
+        }
+      },
+      {
+        path: 'products/:id',
+        component: ProductsComponent,
+        canActivate: [AuthGuard],
+        data: {
+          permission: 'Guest Book'
+        },
+        resolve: {
+          list: ProductsResolver
+        }
+      },
+    ]
+  },
+  { path: '',
+    redirectTo: 'tables',
+    pathMatch: 'full'
+  },
+];
+
+
+@NgModule({
+  imports: [RouterModule.forChild(routes)],
+  exports: [RouterModule],
+  providers: [
+    RunningTablesResolver,
+    MenuCategoriesResolver,
+    ProductsResolver
+  ]
+})
+export class SalesRoutingModule { }

bookie/src/app/sales/sales.module.ts

@@ -0,0 +1,36 @@
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { MatBadgeModule } from '@angular/material/badge';
+import { MatButtonModule } from '@angular/material/button';
+import { MatButtonToggleModule } from '@angular/material/button-toggle';
+import { MatCardModule } from '@angular/material/card';
+import { MatChipsModule } from '@angular/material/chips';
+import { MatDialogModule } from '@angular/material/dialog';
+import { MatTabsModule } from '@angular/material/tabs';
+import { FlexLayoutModule } from '@angular/flex-layout';
+
+import { SalesRoutingModule } from './sales-routing.module';
+import { RunningTablesComponent } from "./running-tables/running-tables.component";
+import { MenuCategoriesComponent } from './menu-categories/menu-categories.component';
+import { ProductsComponent } from './products/products.component';
+import { ModifiersComponent } from './modifiers/modifiers.component';
+
+@NgModule({
+  declarations: [RunningTablesComponent, MenuCategoriesComponent, ProductsComponent, ModifiersComponent],
+  imports: [
+    CommonModule,
+    FlexLayoutModule,
+    MatBadgeModule,
+    MatButtonModule,
+    MatButtonToggleModule,
+    MatCardModule,
+    MatChipsModule,
+    MatDialogModule,
+    MatTabsModule,
+    SalesRoutingModule
+  ],
+  entryComponents: [
+    ModifiersComponent
+  ]
+})
+export class SalesModule { }