Bills initially working just as proof of concept

ng linted
modifier categories list is better at displaying data sanely now

bookie/src/app/modifier-categories/modifier-category-detail/modifier-category-detail.component.ts

@@ -6,10 +6,10 @@ import {ToasterService} from '../../core/toaster.service';
 import {ConfirmDialogComponent} from '../../shared/confirm-dialog/confirm-dialog.component';
 import {MatDialog} from '@angular/material/dialog';
 import {FormBuilder, FormGroup} from '@angular/forms';
-import {MenuCategory} from "../../core/menu-category";
-import {NestedTreeControl} from "@angular/cdk/tree";
-import {MatTreeNestedDataSource} from "@angular/material";
-import {Product} from "../../core/product";
+import {MenuCategory} from '../../core/menu-category';
+import {NestedTreeControl} from '@angular/cdk/tree';
+import {MatTreeNestedDataSource} from '@angular/material';
+import {Product} from '../../core/product';
 
 @Component({
   selector: 'app-role-detail',
@@ -68,10 +68,10 @@ export class ModifierCategoryDetailComponent implements OnInit, AfterViewInit {
       mc.products.forEach((p: Product) => {
         this.products.set(p.id, p);
         if (!this.productsOfMenuCategory.has(mc.id)) {
-          this.productsOfMenuCategory.set(mc.id, [])
+          this.productsOfMenuCategory.set(mc.id, []);
         }
         this.productsOfMenuCategory.get(mc.id).push(p);
-      })
+      });
     });
     // this.setMenuCategories();
   }
@@ -141,15 +141,16 @@ export class ModifierCategoryDetailComponent implements OnInit, AfterViewInit {
   }
 
   isMenuCategorySelected(node: MenuCategory) {
-    return this.productsOfMenuCategory.get(node.id).reduce((acc, current) => { return acc && current.enabled}, true);
+    return this.productsOfMenuCategory.get(node.id).reduce((acc, current) => acc && current.enabled, true);
   }
 
   isMenuCategoryPartiallySelected(node: MenuCategory) {
-    let total = this.productsOfMenuCategory.get(node.id).length;
-    let ticked = this.productsOfMenuCategory.get(node.id).reduce((acc, current) => {
-      if (current.enabled)
+    const total = this.productsOfMenuCategory.get(node.id).length;
+    const ticked = this.productsOfMenuCategory.get(node.id).reduce((acc, current) => {
+      if (current.enabled) {
         acc += 1;
-      return acc
+      }
+      return acc;
     }, 0);
     return ticked > 0 && ticked < total;
   }
@@ -159,8 +160,8 @@ export class ModifierCategoryDetailComponent implements OnInit, AfterViewInit {
   }
 
   toggleMenuCategorySelection(node: MenuCategory) {
-    let sel = !this.isMenuCategorySelected(node);
-    this.productsOfMenuCategory.get(node.id).forEach((p) => {p.enabled = sel;});
-    return sel
+    const sel = !this.isMenuCategorySelected(node);
+    this.productsOfMenuCategory.get(node.id).forEach((p) => {p.enabled = sel; });
+    return sel;
   }
 }

bookie/src/app/modifier-categories/modifier-category-list/modifier-category-list.component.html

@@ -31,10 +31,10 @@
       <ng-container matColumnDef="isActive">
         <mat-header-cell *matHeaderCellDef>Is Active</mat-header-cell>
         <mat-cell *matCellDef="let row">
-              <mat-icon>
-                {{ row.isActive ? "visibility" : "visibility_off" }}
-              </mat-icon>
-              <b> {{ row.isActive ? "Active" : "Not Active" }}</b>
+          <mat-icon>
+            {{ row.isActive ? "visibility" : "visibility_off" }}
+          </mat-icon>
+          <b> {{ row.isActive ? "Active" : "Not Active" }}</b>
         </mat-cell>
       </ng-container>
 
@@ -43,7 +43,11 @@
         <mat-header-cell *matHeaderCellDef>Products</mat-header-cell>
         <mat-cell *matCellDef="let row">
           <ul>
-            <li *ngFor="let product of row.products">{{product}}</li>
+            <li *ngFor="let mc of row.menuCategories">{{mc.name}}
+              <ul *ngIf="!mc.enabled">
+                <li *ngFor="let p of mc.products">{{p.name}}</li>
+              </ul>
+            </li>
           </ul>
         </mat-cell>
       </ng-container>

bookie/src/app/modifier-categories/modifier-category.service.ts

@@ -42,25 +42,25 @@ export class ModifierCategoryService {
       );
   }
 
-  save(role: ModifierCategory): Observable<ModifierCategory> {
-    return <Observable<ModifierCategory>>this.http.post<ModifierCategory>(`${url}/new`, role, httpOptions)
+  save(modifierCategory: ModifierCategory): Observable<ModifierCategory> {
+    return <Observable<ModifierCategory>>this.http.post<ModifierCategory>(`${url}/new`, modifierCategory, httpOptions)
       .pipe(
         catchError(this.log.handleError(serviceName, 'save'))
       );
   }
 
-  update(role: ModifierCategory): Observable<ModifierCategory> {
-    return <Observable<ModifierCategory>>this.http.put<ModifierCategory>(`${url}/${role.id}`, role, httpOptions)
+  update(modifierCategory: ModifierCategory): Observable<ModifierCategory> {
+    return <Observable<ModifierCategory>>this.http.put<ModifierCategory>(`${url}/${modifierCategory.id}`, modifierCategory, httpOptions)
       .pipe(
         catchError(this.log.handleError(serviceName, 'update'))
       );
   }
 
-  saveOrUpdate(role: ModifierCategory): Observable<ModifierCategory> {
-    if (!role.id) {
-      return this.save(role);
+  saveOrUpdate(modifierCategory: ModifierCategory): Observable<ModifierCategory> {
+    if (!modifierCategory.id) {
+      return this.save(modifierCategory);
     } else {
-      return this.update(role);
+      return this.update(modifierCategory);
     }
   }