Choose / Edit / Create customers during billing.

2021-09-19 22:42:27 +05:30
parent c478290da0
commit 6379e5f4e3
14 changed files with 326 additions and 39 deletions
@@ -0,0 +1,90 @@
+<h1 mat-dialog-title>Customer</h1>
+<mat-dialog-content>
+  <form [formGroup]="form" fxLayout="column">
+    <div
+      fxLayout="row"
+      fxLayoutAlign="space-around start"
+      fxLayout.lt-md="column"
+      fxLayoutGap="20px"
+      fxLayoutGap.lt-md="0px"
+    >
+      <mat-form-field fxFlex>
+        <mat-label>Phone</mat-label>
+        <input
+          matInput
+          placeholder="Phone"
+          type="text"
+          formControlName="phone"
+          [matAutocomplete]="auto"
+          autocomplete="off"
+          cdkFocusInitial
+        />
+      </mat-form-field>
+      <mat-autocomplete
+        #auto="matAutocomplete"
+        autoActiveFirstOption
+        [displayWith]="displayFn"
+        (optionSelected)="selected($event)"
+      >
+        <mat-option *ngFor="let customer of customers | async" [value]="customer"
+          >{{ customer.name }} - {{ customer.phone }}</mat-option
+        >
+      </mat-autocomplete>
+    </div>
+    <div
+      fxLayout="row"
+      fxLayoutAlign="space-around start"
+      fxLayout.lt-md="column"
+      fxLayoutGap="20px"
+      fxLayoutGap.lt-md="0px"
+    >
+      <mat-form-field fxFlex>
+        <mat-label>Name</mat-label>
+        <input matInput placeholder="Name" formControlName="name" />
+      </mat-form-field>
+    </div>
+    <div
+      fxLayout="row"
+      fxLayoutAlign="space-around start"
+      fxLayout.lt-md="column"
+      fxLayoutGap="20px"
+      fxLayoutGap.lt-md="0px"
+    >
+      <mat-form-field fxFlex>
+        <mat-label>Address</mat-label>
+        <textarea matInput placeholder="Address" formControlName="address"> </textarea>
+      </mat-form-field>
+    </div>
+    <div
+      fxLayout="row"
+      fxLayoutAlign="space-around start"
+      fxLayout.lt-md="column"
+      fxLayoutGap="20px"
+      fxLayoutGap.lt-md="0px"
+    >
+      <mat-checkbox formControlName="printInBill">Print in Bill?</mat-checkbox>
+    </div>
+    <p></p>
+    <div formArrayName="discounts" fxLayout="row wrap" class="discounts">
+      <div
+        *ngFor="let r of item.discounts; index as i"
+        [formGroupName]="i"
+        fxLayoutAlign="space-around start"
+        fxLayout.lt-md="column"
+        fxLayoutGap="20px"
+        fxLayoutGap.lt-md="0px"
+        fxFlex="33%"
+      >
+        <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-dialog-content>
+<mat-dialog-actions>
+  <button mat-button [mat-dialog-close]="false">Cancel</button>
+  <button mat-raised-button color="primary" (click)="save()">Select</button>
+</mat-dialog-actions>