Customer discount with prefill discount in sales.

bookie/src/app/customers/customer-detail/customer-detail.component.html

@@ -38,9 +38,28 @@
         >
           <mat-form-field fxFlex>
             <mat-label>Address</mat-label>
-            <input matInput placeholder="Address" formControlName="address" />
+            <textarea matInput placeholder="Address" formControlName="address"> </textarea>
           </mat-form-field>
         </div>
+        <mat-divider></mat-divider>
+        <div formArrayName="discounts">
+          <div
+            fxLayout="row"
+            *ngFor="let r of item.discounts; index as i"
+            [formGroupName]="i"
+            fxLayout="row"
+            fxLayoutAlign="space-around start"
+            fxLayout.lt-md="column"
+            fxLayoutGap="20px"
+            fxLayoutGap.lt-md="0px"
+          >
+            <mat-form-field fxFlex>
+              <mat-label>Discount on {{ r.name }}</mat-label>
+              <input matInput placeholder="Discount" formControlName="discount" />
+              <span matSuffix>%</span>
+            </mat-form-field>
+          </div>
+        </div>
       </form>
     </mat-card-content>
     <mat-card-actions>

bookie/src/app/customers/customer-detail/customer-detail.component.ts

@@ -2,6 +2,7 @@ import { AfterViewInit, Component, ElementRef, OnInit, ViewChild } from '@angula
 import { AbstractControl, FormArray, FormBuilder, FormGroup } from '@angular/forms';
 import { MatDialog } from '@angular/material/dialog';
 import { ActivatedRoute, Router } from '@angular/router';
+import { round } from 'mathjs';
 
 import { Customer } from '../../core/customer';
 import { ToasterService } from '../../core/toaster.service';
@@ -33,6 +34,7 @@ export class CustomerDetailComponent implements OnInit, AfterViewInit {
       name: '',
       phone: '',
       address: '',
+      discounts: this.fb.array([]),
     });
   }
 
@@ -48,6 +50,16 @@ export class CustomerDetailComponent implements OnInit, AfterViewInit {
     (this.form.get('name') as AbstractControl).setValue(item.name);
     (this.form.get('phone') as AbstractControl).setValue(item.phone);
     (this.form.get('address') as AbstractControl).setValue(item.address);
+    this.form.setControl(
+      'discounts',
+      this.fb.array(
+        item.discounts.map((x) =>
+          this.fb.group({
+            discount: '' + x.discount * 100,
+          }),
+        ),
+      ),
+    );
   }
 
   ngAfterViewInit() {
@@ -100,6 +112,13 @@ export class CustomerDetailComponent implements OnInit, AfterViewInit {
     this.item.name = formModel.name;
     this.item.phone = formModel.phone;
     this.item.address = formModel.address;
+    const array = this.form.get('discounts') as FormArray;
+    this.item.discounts.forEach((item, index) => {
+      item.discount = Math.max(
+        Math.min(round(array.controls[index].value.discount / 100, 5), 100),
+        0,
+      );
+    });
     return this.item;
   }
 }