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

bookie/src/app/modifiers/modifier-detail/modifier-detail.component.html

@@ -34,6 +34,10 @@
             </mat-select>
           </mat-form-field>
         </div>
+        <div fxLayout="row" fxLayoutAlign="space-around start" fxLayout.lt-md="column" fxLayoutGap="20px"
+             fxLayoutGap.lt-md="0px">
+          <mat-checkbox formControlName="isActive">Is Active?</mat-checkbox>
+        </div>
       </form>
     </mat-card-content>
     <mat-card-actions>

bookie/src/app/modifiers/modifier-detail/modifier-detail.component.ts

@@ -35,7 +35,8 @@ export class ModifierDetailComponent implements OnInit, AfterViewInit {
       name: '',
       showInBill: '',
       price: '',
-      modifierCategory: ''
+      modifierCategory: '',
+      isActive: ''
     });
   }
 
@@ -53,6 +54,7 @@ export class ModifierDetailComponent implements OnInit, AfterViewInit {
       name: this.item.name || '',
       showInBill: this.item.showInBill,
       price: this.item.price || '',
+      isActive: this.item.isActive,
       modifierCategory: this.item.modifierCategory.id ? this.item.modifierCategory.id : ''
     });
   }
@@ -107,6 +109,7 @@ export class ModifierDetailComponent implements OnInit, AfterViewInit {
     this.item.name = formModel.name;
     this.item.showInBill = formModel.showInBill;
     this.item.price = +formModel.price;
+    this.item.isActive = formModel.isActive;
     this.item.modifierCategory.id = formModel.modifierCategory;
     return this.item;
   }

bookie/src/app/modifiers/modifier-list/modifier-list.component.html

@@ -26,12 +26,12 @@
       <!-- Name Column -->
       <ng-container matColumnDef="name">
         <mat-header-cell *matHeaderCellDef>Name</mat-header-cell>
-        <mat-cell *matCellDef="let row"><a [routerLink]="['/modifiers', row.id]">{{row.name}} ({{row.units}})</a></mat-cell>
+        <mat-cell *matCellDef="let row"><a [routerLink]="['/modifiers', row.id]">{{row.name}}</a></mat-cell>
       </ng-container>
 
       <!-- Show In Bill Column -->
       <ng-container matColumnDef="showInBill">
-        <mat-header-cell *matHeaderCellDef>Show</mat-header-cell>
+        <mat-header-cell *matHeaderCellDef>Show In Bill</mat-header-cell>
         <mat-cell *matCellDef="let row">
           <div layout="row">
             <div flex>
@@ -56,6 +56,16 @@
         <mat-cell *matCellDef="let row">{{row.modifierCategory.name}}</mat-cell>
       </ng-container>
 
+      <!-- Is Active Column -->
+      <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-cell>
+      </ng-container>
 
      <mat-header-row *matHeaderRowDef="displayedColumns"></mat-header-row>
       <mat-row *matRowDef="let row; columns: displayedColumns;"></mat-row>

bookie/src/app/modifiers/modifier-list/modifier-list.component.ts

@@ -21,7 +21,7 @@ export class ModifierListComponent implements OnInit {
   data: BehaviorSubject<Modifier[]>;
   modifierCategories: ModifierCategory[];
   /** Columns displayed in the table. Columns IDs can be added, removed, or reordered. */
-  displayedColumns: string[] = ['name', 'showInBill', 'price', 'modifierCategory'];
+  displayedColumns: string[] = ['name', 'showInBill', 'price', 'isActive', 'modifierCategory'];
 
   constructor(
     private route: ActivatedRoute,