refactor: replace economic code fields with individual and legal variants, add equal length validation

2026-06-03 17:48:54 +03:30
parent 8d6fa8860b
commit 694b2ec946
23 changed files with 272 additions and 101 deletions
@@ -5,12 +5,11 @@
 <ng-template #topbarCenter>
  @if (posInfo()) {
    <a [routerLink]="homeRouteLink" class="flex flex-col items-center justify-center gap-2">
-      <div class="w-8 h-8">
+      <div class="h-8 w-8">
        <img
          [src]="posInfo()?.partner?.logo_url ?? placeholderLogo"
          alt="Logo"
-          class="w-full h-full object-cover rounded-md bg-surface-card"
-        />
+          class="bg-surface-card h-full w-full rounded-md object-cover" />
      </div>
      <span class="text-base font-semibold">{{ posInfo()?.partner?.name }}</span>
    </a>
@@ -19,7 +18,7 @@

 <ng-template #topbarEnd>
  <div class="">
-    <p-menu #menu [model]="profileMenuItems" [popup]="true" />
+    <p-menu #menu [model]="profileMenuItems" [popup]="true" appendTo="body" />
    <p-button (click)="menu.toggle($event)" icon="pi pi-user" outlined size="large" />
  </div>
 </ng-template>
@@ -57,11 +56,11 @@
        <pos-choose-cards class="h-full" (onChoose)="onChoosePos()" />
      }
      @default {
-        <div class="h-full w-full flex items-center justify-center">
-          <p-card class="border border-surface-border">
-            <div class="flex flex-col gap-2 items-center justify-between shrink-0">
-              <i class="pi pi-exclamation-triangle text-6xl! mb-3 text-error" aria-hidden="true"></i>
-              <span class="text-xl font-semibold mb-2 text-error block"> عدم دسترسی </span>
+        <div class="flex h-full w-full items-center justify-center">
+          <p-card class="border-surface-border border">
+            <div class="flex shrink-0 flex-col items-center justify-between gap-2">
+              <i class="pi pi-exclamation-triangle text-error mb-3 text-6xl!" aria-hidden="true"></i>
+              <span class="text-error mb-2 block text-xl font-semibold"> عدم دسترسی </span>
              <p class="inline-block text-base">متاسفانه امکان دسترسی برای کاربر شما فراهم نیست</p>
              <button pButton outlined severity="danger" class="mt-5 w-32" (click)="logout()">خروج</button>
            </div>
@@ -1,9 +1,10 @@
 <form [formGroup]="form" (submit)="submit()">
+  <p-message severity="info"> وارد کردن شماره اقتصادی و یا کد ملی به همراه کد پستی الزامی است. </p-message>
+
  <field-first-name [control]="form.controls.first_name" />
  <field-last-name [control]="form.controls.last_name" />
-  <field-mobile-number [control]="form.controls.mobile_number" />
+  <field-individual-economic-code [control]="form.controls.economic_code" />
  <field-national-id [control]="form.controls.national_id" />
-  <field-economic-code [control]="form.controls.economic_code" />
  <field-postal-code [control]="form.controls.postal_code" />

  <app-form-footer-actions submitLabel="ثبت مشتری و ادامه" (onCancel)="close()" (onSubmit)="submit()" />
@@ -1,9 +1,8 @@
 import { AbstractForm } from '@/shared/abstractClasses';
 import {
-  EconomicCodeComponent,
  FirstNameComponent,
+  IndividualEconomicCodeComponent,
  LastNameComponent,
-  MobileNumberComponent,
  NationalIdComponent,
  PostalCodeComponent,
 } from '@/shared/components';
@@ -11,7 +10,8 @@ import { FormFooterActionsComponent } from '@/shared/components/formFooterAction
 import { fieldControl } from '@/shared/constants';
 import { CustomerType } from '@/shared/localEnum/constants/customerTypes';
 import { Component, computed, inject } from '@angular/core';
-import { ReactiveFormsModule } from '@angular/forms';
+import { AbstractControl, ReactiveFormsModule, ValidationErrors } from '@angular/forms';
+import { Message } from 'primeng/message';
 import { Observable } from 'rxjs';
 import { IIndividualCustomer } from '../../../models/customer';
 import { PosLandingStore } from '../../../store/main.store';
@@ -24,10 +24,10 @@ import { PosLandingStore } from '../../../store/main.store';
    FormFooterActionsComponent,
    FirstNameComponent,
    LastNameComponent,
-    NationalIdComponent,
-    EconomicCodeComponent,
-    MobileNumberComponent,
+    IndividualEconomicCodeComponent,
    PostalCodeComponent,
+    Message,
+    NationalIdComponent,
  ],
 })
 export class CustomerIndividualFormComponent extends AbstractForm<
@@ -38,14 +38,56 @@ export class CustomerIndividualFormComponent extends AbstractForm<
  costumerInfo = computed(() => this.store.customer().info?.customer_individual);

  override showSuccessMessage = false;
-  form = this.fb.group({
-    first_name: fieldControl.first_name(this.costumerInfo()?.first_name || ''),
-    last_name: fieldControl.last_name(this.costumerInfo()?.last_name || ''),
-    national_id: fieldControl.national_id(this.costumerInfo()?.national_id || ''),
-    postal_code: fieldControl.postal_code(this.costumerInfo()?.postal_code || ''),
-    economic_code: fieldControl.economic_code(this.costumerInfo()?.economic_code || ''),
-    mobile_number: fieldControl.mobile_number(this.costumerInfo()?.mobile_number || ''),
-  });
+  private readonly identityOrEconomicCodeValidator = (
+    control: AbstractControl
+  ): ValidationErrors | null => {
+    const economicCode = control.get('economic_code')?.value;
+    const nationalId = control.get('national_id')?.value;
+    const postalCode = control.get('postal_code')?.value;
+
+    const hasEconomicCode = !!String(economicCode ?? '').trim();
+    const hasNationalId = !!String(nationalId ?? '').trim();
+    const hasPostalCode = !!String(postalCode ?? '').trim();
+
+    const isValid = hasEconomicCode || (hasNationalId && hasPostalCode);
+
+    if (!isValid) {
+      return { identityOrEconomicCodeRequired: true };
+    }
+
+    return null;
+  };
+
+  form = this.fb.group(
+    {
+      first_name: fieldControl.first_name(this.costumerInfo()?.first_name || '', false),
+      last_name: fieldControl.last_name(this.costumerInfo()?.last_name || '', false),
+      economic_code: fieldControl.individual_economic_code(
+        this.costumerInfo()?.economic_code || '',
+        false
+      ),
+      national_id: fieldControl.national_id(this.costumerInfo()?.national_id || '', false),
+      postal_code: fieldControl.postal_code(this.costumerInfo()?.postal_code || '', false),
+    },
+    { validators: this.identityOrEconomicCodeValidator }
+  );
+
+  override submit() {
+    this.form.markAllAsTouched();
+    this.form.updateValueAndValidity({ onlySelf: false, emitEvent: false });
+
+    if (this.form.hasError('identityOrEconomicCodeRequired')) {
+      this.toastService.warn({
+        text: 'وارد کردن شماره اقتصادی و یا کد ملی به همراه کد پستی الزامی است.',
+      });
+    }
+
+    if (this.form.invalid) {
+      return;
+    }
+
+    super.submit();
+  }

  override submitForm() {
    return new Observable<IIndividualCustomer>((observer) => {
@@ -54,7 +96,10 @@ export class CustomerIndividualFormComponent extends AbstractForm<
        customer_id: '',
        type: CustomerType.INDIVIDUAL,
        info: {
-          customer_individual: info,
+          customer_individual: {
+            ...info,
+            economic_code: info.economic_code ? info.economic_code.toString() : undefined,
+          },
        },
      });
      return observer.next(info);
@@ -1,8 +1,11 @@
 <form [formGroup]="form" (submit)="submit()">
-  <app-input [control]="form.controls.company_name" name="company_name" label="نام مجموعه" />
-  <app-input [control]="form.controls.registration_number" name="registration_number" label="شماره ثبت" />
-  <app-input [control]="form.controls.economic_code" name="economic_code" label="کد اقتصادی" maxlength="11" />
-  <app-input [control]="form.controls.postal_code" name="postal_code" label="کد پستی" type="postalCode" />
+  <p-message severity="info" icon="pi pi-info-circle">
+    وارد کردن شماره اقتصادی و یا شناسه‌ ملی به همراه کد پستی الزامی است.
+  </p-message>
+  <field-name [control]="form.controls.name" name="name" label="نام مجموعه" />
+  <field-legal-economic-code [control]="form.controls.economic_code" />
+  <field-registration-number [control]="form.controls.registration_number" />
+  <field-postal-code [control]="form.controls.postal_code" />

  <app-form-footer-actions submitLabel="ثبت مشتری و ادامه" (onCancel)="close()" (onSubmit)="submit()" />
 </form>
@@ -1,10 +1,16 @@
-import { postalCodeValidator } from '@/core/validators';
 import { AbstractForm } from '@/shared/abstractClasses';
-import { InputComponent } from '@/shared/components';
+import {
+  LegalEconomicCodeComponent,
+  NameComponent,
+  PostalCodeComponent,
+  RegistrationNumberComponent,
+} from '@/shared/components';
 import { FormFooterActionsComponent } from '@/shared/components/formFooterActions/form-footer-actions.component';
+import { fieldControl } from '@/shared/constants';
 import { CustomerType } from '@/shared/localEnum/constants/customerTypes';
 import { Component, inject } from '@angular/core';
-import { ReactiveFormsModule, Validators } from '@angular/forms';
+import { AbstractControl, ReactiveFormsModule, ValidationErrors } from '@angular/forms';
+import { Message } from 'primeng/message';
 import { Observable } from 'rxjs';
 import { ILegalCustomer } from '../../../models/customer';
 import { PosLandingStore } from '../../../store/main.store';
@@ -12,31 +18,76 @@ import { PosLandingStore } from '../../../store/main.store';
@Component({
  selector: 'pos-customer-legal-form',
  templateUrl: './form.component.html',
-  imports: [ReactiveFormsModule, InputComponent, FormFooterActionsComponent],
+  imports: [
+    ReactiveFormsModule,
+    FormFooterActionsComponent,
+    LegalEconomicCodeComponent,
+    NameComponent,
+    RegistrationNumberComponent,
+    PostalCodeComponent,
+    Message,
+  ],
 })
 export class CustomerLegalFormComponent extends AbstractForm<ILegalCustomer, ILegalCustomer> {
  private readonly store = inject(PosLandingStore);

  override showSuccessMessage = false;

-  form = this.fb.group({
-    company_name: [
-      this.store.customer().info?.customer_legal?.company_name || '',
-      [Validators.required],
-    ],
-    registration_number: [
-      this.store.customer().info?.customer_legal?.registration_number || '',
-      [Validators.required],
-    ],
-    economic_code: [
-      this.store.customer().info?.customer_legal?.economic_code || '',
-      [Validators.required],
-    ],
-    postal_code: [
-      this.store.customer().info?.customer_legal?.postal_code || '',
-      [postalCodeValidator()],
-    ],
-  });
+  private readonly registrationOrEconomicCodeValidator = (
+    control: AbstractControl
+  ): ValidationErrors | null => {
+    const economicCode = control.get('economic_code')?.value;
+    const registrationNumber = control.get('registration_number')?.value;
+    const postalCode = control.get('postal_code')?.value;
+
+    const hasEconomicCode = !!String(economicCode ?? '').trim();
+    const hasRegistrationNumber = !!String(registrationNumber ?? '').trim();
+    const hasPostalCode = !!String(postalCode ?? '').trim();
+
+    const isValid = hasEconomicCode || (hasRegistrationNumber && hasPostalCode);
+
+    if (!isValid) {
+      return { registrationOrEconomicCodeRequired: true };
+    }
+
+    return null;
+  };
+
+  form = this.fb.group(
+    {
+      name: fieldControl.name(this.store.customer().info?.customer_legal?.name || ''),
+      economic_code: fieldControl.legal_economic_code(
+        this.store.customer().info?.customer_legal?.economic_code || '',
+        false
+      ),
+      registration_number: fieldControl.registration_number(
+        this.store.customer().info?.customer_legal?.registration_number || '',
+        false
+      ),
+      postal_code: fieldControl.postal_code(
+        this.store.customer().info?.customer_legal?.postal_code || '',
+        false
+      ),
+    },
+    { validators: this.registrationOrEconomicCodeValidator }
+  );
+
+  override submit() {
+    this.form.markAllAsTouched();
+    this.form.updateValueAndValidity({ onlySelf: false, emitEvent: false });
+
+    if (this.form.hasError('registrationOrEconomicCodeRequired')) {
+      this.toastService.warn({
+        text: 'وارد کردن شماره اقتصادی و یا شناسه‌ ملی به همراه کد پستی الزامی است.',
+      });
+    }
+
+    if (this.form.invalid) {
+      return;
+    }
+
+    super.submit();
+  }

  override submitForm() {
    return new Observable<ILegalCustomer>((observer) => {
@@ -45,7 +96,10 @@ export class CustomerLegalFormComponent extends AbstractForm<ILegalCustomer, ILe
        customer_id: '',
        type: CustomerType.LEGAL,
        info: {
-          customer_legal: info,
+          customer_legal: {
+            ...info,
+            economic_code: info.economic_code ? info.economic_code.toString() : undefined,
+          },
        },
      });
      return observer.next(info);
@@ -9,13 +9,13 @@ import { PosOrderSectionComponent } from './order-section.component';
  imports: [SharedLightBottomsheetComponent, PosOrderSectionComponent],
 })
 export class PosOrderSectionDialogComponent extends AbstractDialog {
-  @Output() onCloseInvoiceBottomSheet = new EventEmitter();
-  @Output() onSubmitOrder = new EventEmitter();
+  @Output() onAddMoreGoods = new EventEmitter();
+  @Output() onSubmit = new EventEmitter();

  closeInvoiceBottomSheet = () => {
-    this.onCloseInvoiceBottomSheet.emit();
+    this.onAddMoreGoods.emit();
  };
  submitOrder = () => {
-    this.onSubmitOrder.emit();
+    this.onSubmit.emit();
  };
 }
@@ -64,7 +64,7 @@ export class PosOrderSectionComponent {
        customerNameToShow = `${info?.customer_individual ? info?.customer_individual.first_name + ' ' + info?.customer_individual.last_name : '-----'} (نوع اول)`;
        break;
      case 'LEGAL':
-        customerNameToShow = `${info?.customer_legal?.company_name || '-----'} (نوع اول)`;
+        customerNameToShow = `${info?.customer_legal?.name || '-----'} (نوع اول)`;
        break;
    }

@@ -85,6 +85,8 @@ export class PosOrderSectionComponent {
  }

  submitAndPay() {
+    console.log('submitAndPay');
+
    this.onSubmit.emit();
  }

@@ -1,17 +1,16 @@
 export interface IIndividualCustomer {
-  first_name: string;
-  last_name: string;
-  national_id: string;
-  postal_code: string;
-  mobile_number: string;
-  economic_code: string;
+  first_name?: string;
+  last_name?: string;
+  national_id?: string;
+  postal_code?: string;
+  economic_code?: string;
  is_favorite?: boolean;
 }
 export interface ILegalCustomer {
-  company_name: string;
-  economic_code: string;
-  registration_number: string;
-  postal_code: string;
+  name?: string;
+  economic_code?: string;
+  registration_number?: string;
+  postal_code?: string;
  is_favorite?: boolean;
 }