barker/bookie/src/app/sales/choose-customer/choose-customer.component.html

62 lines
2.1 KiB
HTML

<h2 mat-dialog-title>Customer</h2>
<mat-dialog-content>
<form [formGroup]="form" class="flex flex-col">
<div class="flex flex-row justify-around content-start items-start">
<mat-form-field class="flex-auto">
<mat-label>Phone</mat-label>
<input
matInput
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 class="flex flex-row justify-around content-start items-start">
<mat-form-field class="flex-auto">
<mat-label>Name</mat-label>
<input matInput formControlName="name" />
</mat-form-field>
</div>
<div class="flex flex-row justify-around content-start items-start">
<mat-form-field class="flex-auto">
<mat-label>Address</mat-label>
<textarea matInput formControlName="address"> </textarea>
</mat-form-field>
</div>
<div class="flex flex-row justify-around content-start items-start">
<mat-checkbox formControlName="printInBill">Print in Bill?</mat-checkbox>
</div>
<p></p>
<div formArrayName="discounts" class="discounts">
<div
*ngFor="let r of item.discounts; index as i"
[formGroupName]="i"
class="flex flex-row justify-around content-start items-start"
>
<mat-form-field class="flex-auto">
<mat-label>Discount on {{ r.name }}</mat-label>
<input matInput 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>