fds

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

@@ -27,29 +27,27 @@
     <div class="row-container">
       <mat-form-field class="flex-auto">
         <mat-label>Name</mat-label>
-        <input matInput [formField]="form.name" />
+        <input matInput [value]="formModel().name" readonly />
       </mat-form-field>
     </div>
     <div class="row-container">
       <mat-form-field class="flex-auto">
         <mat-label>Address</mat-label>
-        <textarea matInput [formField]="form.address"> </textarea>
+        <textarea matInput [value]="formModel().address" readonly> </textarea>
       </mat-form-field>
     </div>
     <div class="row-container">
-      <mat-checkbox [formField]="form.printInBill">Print in Bill?</mat-checkbox>
+      <mat-checkbox [checked]="formModel().printInBill" [disabled]="true">Print in Bill?</mat-checkbox>
     </div>
     <p></p>
     <div class="discounts">
-      @for (r of item.discounts; track r; let i = $index) {
-        <div class="row-container">
-          <mat-form-field class="flex-auto">
-            <mat-label>Discount on {{ r.name }}</mat-label>
-            <input matInput [formField]="form.discounts[i].discount" />
-            <span matTextSuffix>%</span>
-          </mat-form-field>
-        </div>
-      }
+      <ul>
+        @for (r of formModel().discounts; track r.id) {
+          @if (r.discount > 0) {
+            <li>{{ r.name }} - {{ r.discount | percent: '1.2-2' }}</li>
+          }
+        }
+      </ul>
     </div>
   </form>
 </mat-dialog-content>

bookie/src/app/sales/choose-customer/choose-customer.component.ts

@@ -1,4 +1,5 @@
 import { CdkScrollableModule } from '@angular/cdk/scrolling';
+import { PercentPipe } from '@angular/common';
 import { Component, inject, computed, debounced, linkedSignal, signal } from '@angular/core';
 import { form, FormField } from '@angular/forms/signals';
 import { MatAutocompleteSelectedEvent, MatAutocompleteModule } from '@angular/material/autocomplete';
@@ -8,9 +9,9 @@ import { MatOptionModule } from '@angular/material/core';
 import { MAT_DIALOG_DATA, MatDialogRef, MatDialogModule } from '@angular/material/dialog';
 import { MatFormFieldModule } from '@angular/material/form-field';
 import { MatInputModule } from '@angular/material/input';
-import { round } from 'mathjs';
 
 import { Customer } from '../../core/customer';
+import { CustomerDiscount } from '../../core/customer-discount';
 import { CustomerService } from '../../customers/customer.service';
 
 export interface ChooseCustomerFormData {
@@ -19,9 +20,7 @@ export interface ChooseCustomerFormData {
   phone: string;
   address: string;
   printInBill: boolean;
-  discounts: {
-    discount: number | null;
-  }[];
+  discounts: CustomerDiscount[];
 }
 
 @Component({
@@ -37,6 +36,7 @@ export interface ChooseCustomerFormData {
     MatFormFieldModule,
     MatInputModule,
     MatOptionModule,
+    PercentPipe,
     FormField,
   ],
 })
@@ -55,9 +55,7 @@ export class ChooseCustomerComponent {
       phone: data.phone,
       address: data.address ?? '',
       printInBill: data.printInBill,
-      discounts: data.discounts.map((x) => ({
-        discount: x.discount ? x.discount * 100 : null,
-      })),
+      discounts: data.discounts ?? [],
     }),
   });
 
@@ -70,7 +68,9 @@ export class ChooseCustomerComponent {
   debouncedPhone = debounced(this.phoneSignal, 150);
 
   customersResource = this.ser.autocomplete(this.debouncedPhone.value);
-  customers = computed(() => { return this.customersResource.value() ?? [] });
+  customers = computed(() => {
+    return this.customersResource.value() ?? [];
+  });
 
   save() {
     const customer = this.getItem();
@@ -92,7 +92,6 @@ export class ChooseCustomerComponent {
 
   getItem(): Customer {
     const formModel = this.formModel();
-    const array = formModel.discounts;
 
     return new Customer({
       id: formModel.id,
@@ -100,14 +99,7 @@ export class ChooseCustomerComponent {
       phone: formModel.phone ?? '',
       address: formModel.address ?? '',
       printInBill: formModel.printInBill ?? false,
-      discounts: formModel.discounts.map((item, index) => {
-        const array_item = array?.[index];
-        return {
-          ...this.item().discounts?.[index],
-          discount:
-            array_item && array_item?.discount ? Math.max(Math.min(round(array_item.discount / 100, 5), 100), 0) : 0,
-        };
-      }),
+      discounts: formModel.discounts.map((item) => ({ ...item })),
     });
   }
 }

bookie/src/app/sales/discount/customer-discounts.service.ts

@@ -12,12 +12,15 @@ export class CustomerDiscountsService {
   private injector = inject(Injector);
 
   list(id: Signal<string | undefined>): HttpResourceRef<DiscountItem[] | undefined> {
-    return httpResource<DiscountItem[]>(() => {
-      const idVal = id();
-      return idVal === undefined ? url : `${url}/${idVal}`;
-    }, {
-      injector: this.injector,
-    });
+    return httpResource<DiscountItem[]>(
+      () => {
+        const idVal = id();
+        return idVal === undefined ? url : `${url}/${idVal}`;
+      },
+      {
+        injector: this.injector,
+      },
+    );
   }
 
   listForDiscount(): HttpResourceRef<{ name: string; discount: number; discountLimit: number }[] | undefined> {