transform pos payload forms to shared

.gitignore

@@ -43,3 +43,4 @@ testem.log
 Thumbs.db
 
 .env.*
+.env

src/app/domains/pos/modules/shop/components/payloads/payload-form.component.html

@@ -7,14 +7,14 @@
   (onHide)="close()">
   @if (good) {
     @if (isGoldMode()) {
-      <pos-gold-payload-form
+      <shared-gold-payload-form
         [initialValues]="goldPayload()"
         [vatPercentage]="vatPercentage()"
         [editMode]="editMode()"
         [isRapidInvoice]="isRapidInvoice()"
         (onSubmit)="submit($event)" />
     } @else if (isStandardMode()) {
-      <pos-standard-payload-form
+      <shared-standard-payload-form
         [initialValues]="standardPayload()"
         [vatPercentage]="vatPercentage()"
         [measureUnit]="good.measure_unit"

src/app/domains/pos/modules/shop/components/payloads/payload-form.component.ts

@@ -1,20 +1,23 @@
 import { IGoodResponse } from '@/domains/pos/models/good.io';
 import { AbstractDialog } from '@/shared/abstractClasses/abstract-dialog';
-import { SharedLightBottomsheetComponent } from '@/shared/components/dialog/light-bottomsheet.component';
+import {
+  SharedGoldPayloadFormComponent,
+  SharedLightBottomsheetComponent,
+  SharedStandardPayloadFormComponent,
+} from '@/shared/components';
+import { IGoldPayload, IStandardPayload } from '@/shared/models';
 import { Component, computed, EventEmitter, inject, Input, Output, signal } from '@angular/core';
 import { PosConfigRapidInvoiceService } from '../../../configs/components/rapidInvoice/services/main.service';
-import { IGoldPayload, IPosOrderItem, IStandardPayload } from '../../models';
+import { IPosOrderItem } from '../../models';
 import { PosLandingStore } from '../../store/main.store';
-import { PosGoldPayloadFormComponent } from './gold/form.component';
-import { PosStandardPayloadFormComponent } from './standard/form.component';
 
 @Component({
   selector: 'pos-payload-form-dialog',
   templateUrl: './payload-form.component.html',
   imports: [
-    PosGoldPayloadFormComponent,
+    SharedGoldPayloadFormComponent,
+    SharedStandardPayloadFormComponent,
     SharedLightBottomsheetComponent,
-    PosStandardPayloadFormComponent,
   ],
 })
 export class PayloadFormDialogComponent extends AbstractDialog {

src/app/domains/pos/modules/shop/models/index.ts

@@ -1,6 +1,5 @@
 export * from './customer';
 export * from './io';
-export * from './payload';
 export * from './payment';
 export * from './posPaymentResult';
 export * from './types';

src/app/domains/pos/modules/shop/models/types.ts

@@ -1,6 +1,6 @@
 import ISummary from '@/core/models/summary';
 import { IGoodResponse } from '@/domains/pos/models/good.io';
-import { TPosOrderGoodPayload } from './payload';
+import { TPosOrderGoodPayload } from '@/shared/models';
 
 export interface IPosOrderItem<T = TPosOrderGoodPayload> {
   unit_price: number;

src/app/shared/components/calculatedAmountCard/calculated-amount-card.component.ts

@@ -3,11 +3,11 @@ import { Component, Input } from '@angular/core';
 import { Card } from 'primeng/card';
 
 @Component({
-  selector: 'pos-form-dialog-amount-card-template',
+  selector: 'shared-calculated-amount-card',
-  templateUrl: './form-dialog-amount-card-template.component.html',
+  templateUrl: './calculated-amount-card.component.html',
   imports: [Card, PriceMaskDirective],
 })
-export class PosFormDialogAmountCardTemplateComponent {
+export class CalculatedAmountCardComponent {
   @Input({ required: true }) baseTotalAmount!: number;
   @Input({ required: true }) totalAmount!: number;
   @Input({ required: true }) discountAmount!: number;

src/app/shared/components/dialog/index.ts

@@ -0,0 +1,2 @@
+export * from './dialog.component';
+export * from './light-bottomsheet.component';

src/app/shared/components/index.ts

@@ -1,12 +1,15 @@
 // export * from './abstract-select.component';
+export * from './amountPercentageInput/amount-percentage-input.component';
 export * from './breadcrumb.component';
+export * from './calculatedAmountCard/calculated-amount-card.component';
 export * from './card-data.component';
 export * from './changePasswordFormDialog/change-password-form-dialog.component';
-export * from './dialog/dialog.component';
+export * from './dialog';
 export * from './fields';
 export * from './inlineConfirmation/inline-confirmation.component';
 export * from './inlineEdit/inline-edit.component';
 export * from './input/input.component';
 export * from './key-value.component/key-value.component';
 export * from './passwordInput/password-input.component';
+export * from './posPayment';
 export * from './table-action-row.component';

src/app/shared/components/posPayment/gold-form.component.html

@@ -52,7 +52,7 @@
 
   <hr />
   <div class="flex w-full flex-col justify-center gap-4">
-    <pos-form-dialog-amount-card-template
+    <shared-calculated-amount-card
       [totalAmount]="totalAmount()"
       [baseTotalAmount]="baseTotalAmount()"
       [discountAmount]="form.controls.discount_amount.value || 0"

src/app/shared/components/posPayment/gold-form.component.ts

@@ -1,37 +1,46 @@
 import { greaterThanValidator } from '@/core/validators/greater.validator';
 import { PosConfigGoldPriceService } from '@/domains/pos/modules/configs/components/goldPrice/services/main.service';
+import { IPosOrderItem } from '@/domains/pos/modules/shop/models';
 import { AbstractForm } from '@/shared/abstractClasses';
 import { EnumSelectComponent } from '@/shared/apiEnum/select.component';
-import { InputComponent } from '@/shared/components';
+import {
-import { AmountPercentageInputComponent } from '@/shared/components/amountPercentageInput/amount-percentage-input.component';
+  AmountPercentageInputComponent,
+  CalculatedAmountCardComponent,
+  InputComponent,
+} from '@/shared/components';
 import { TGoldKarat } from '@/shared/localEnum/constants/goldKarat';
-import { formatWithCurrency } from '@/utils';
+import { IGoldPayload } from '@/shared/models';
 import { Component, computed, EventEmitter, inject, Input, Output, signal } from '@angular/core';
 import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
 import { FormsModule, ReactiveFormsModule, Validators } from '@angular/forms';
 import { ButtonDirective } from 'primeng/button';
 import { SelectButton, SelectButtonChangeEvent } from 'primeng/selectbutton';
-import { IGoldPayload, IPosOrderItem } from '../../../models';
-import { PosFormDialogAmountCardTemplateComponent } from '../form-dialog-amount-card-template.component';
 
 @Component({
-  selector: 'pos-gold-payload-form',
+  selector: 'shared-gold-payload-form',
-  templateUrl: './form.component.html',
+  templateUrl: './gold-form.component.html',
   imports: [
     FormsModule,
     ReactiveFormsModule,
     InputComponent,
     EnumSelectComponent,
-    PosFormDialogAmountCardTemplateComponent,
     SelectButton,
     AmountPercentageInputComponent,
     ButtonDirective,
+    CalculatedAmountCardComponent,
   ],
 })
-export class PosGoldPayloadFormComponent extends AbstractForm<
+export class SharedGoldPayloadFormComponent extends AbstractForm<
   IPosOrderItem<IGoldPayload>,
   IPosOrderItem<IGoldPayload>
 > {
+  @Input({ required: true }) vatPercentage!: number;
+  @Input() isRapidInvoice: boolean = false;
+  @Input() ctaText: string = '';
+
+  @Output() onSubmitForm = new EventEmitter<IGoldPayload>();
+  @Output() onChangeTotalAmount = new EventEmitter<number>();
+
   override defaultValues: Partial<IPosOrderItem<IGoldPayload>> = {
     // unit_price: 200_000_000,
     // quantity: 2,
@@ -43,12 +52,6 @@ export class PosGoldPayloadFormComponent extends AbstractForm<
     } as any,
   };
 
-  @Input({ required: true }) vatPercentage!: number;
-  @Input() isRapidInvoice!: boolean;
-
-  @Output() onSubmitForm = new EventEmitter<IGoldPayload>();
-  @Output() onChangeTotalAmount = new EventEmitter<number>();
-
   private readonly posGoldConfig = inject(PosConfigGoldPriceService);
 
   readonly discountTypeItems = [
@@ -74,7 +77,11 @@ export class PosGoldPayloadFormComponent extends AbstractForm<
   goldDefaultUnitPrice = signal<number>(0);
 
   preparedCTAText = computed(() =>
-    this.editMode ? 'اعمال ویرایش' : this.isRapidInvoice ? 'ثبت و پرداخت' : 'افزودن به لیست خرید'
+    this.ctaText || this.editMode
+      ? 'اعمال ویرایش'
+      : this.isRapidInvoice
+        ? 'ثبت و پرداخت'
+        : 'افزودن به لیست خرید'
   );
 
   private readonly initialForm = () => {
@@ -169,13 +176,6 @@ export class PosGoldPayloadFormComponent extends AbstractForm<
     this.onChangeTotalAmount.emit(totalAmount);
   }
 
-  toAmountFormat(amount: number) {
-    if (!amount) {
-      return '';
-    }
-    return `(${formatWithCurrency(amount)})`;
-  }
-
   changeDiscountCalculation($event: SelectButtonChangeEvent) {
     this.discountType.set($event.value);
 

src/app/shared/components/posPayment/index.ts

@@ -0,0 +1,2 @@
+export * from './gold-form.component';
+export * from './standard-form.component';

src/app/shared/components/posPayment/standard-form.component.html

@@ -19,7 +19,7 @@
 
   <hr />
   <div class="flex w-full flex-col justify-center gap-4">
-    <pos-form-dialog-amount-card-template
+    <shared-calculated-amount-card
       [totalAmount]="totalAmount()"
       [baseTotalAmount]="baseTotalAmount()"
       [discountAmount]="discountAmount()"

src/app/shared/components/posPayment/standard-form.component.ts

@@ -1,34 +1,37 @@
 import ISummary from '@/core/models/summary';
 import { greaterThanValidator } from '@/core/validators';
 import { AbstractForm } from '@/shared/abstractClasses';
-import { InputComponent } from '@/shared/components';
+import {
-import { AmountPercentageInputComponent } from '@/shared/components/amountPercentageInput/amount-percentage-input.component';
+  AmountPercentageInputComponent,
-import { formatWithCurrency } from '@/utils';
+  CalculatedAmountCardComponent,
+  InputComponent,
+} from '@/shared/components';
+import { IStandardPayload } from '@/shared/models';
 import { Component, computed, EventEmitter, Input, Output, signal } from '@angular/core';
 import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
 import { ReactiveFormsModule, Validators } from '@angular/forms';
 import { ButtonDirective } from 'primeng/button';
-import { IPosOrderItem, IStandardPayload } from '../../../models';
+import { IPosOrderItem } from '../../../domains/pos/modules/shop/models';
-import { PosFormDialogAmountCardTemplateComponent } from '../form-dialog-amount-card-template.component';
 
 @Component({
-  selector: 'pos-standard-payload-form',
+  selector: 'shared-standard-payload-form',
-  templateUrl: './form.component.html',
+  templateUrl: './standard-form.component.html',
   imports: [
     ReactiveFormsModule,
     InputComponent,
-    PosFormDialogAmountCardTemplateComponent,
     AmountPercentageInputComponent,
     ButtonDirective,
+    CalculatedAmountCardComponent,
   ],
 })
-export class PosStandardPayloadFormComponent extends AbstractForm<
+export class SharedStandardPayloadFormComponent extends AbstractForm<
   IPosOrderItem<IStandardPayload>,
   IPosOrderItem<IStandardPayload>
 > {
   @Input({ required: true }) measureUnit!: ISummary;
   @Input({ required: true }) vatPercentage!: number;
-  @Input() isRapidInvoice!: boolean;
+  @Input() isRapidInvoice: boolean = false;
+  @Input() ctaText: string = '';
   @Output() onChangeTotalAmount = new EventEmitter<number>();
 
   private readonly initialForm = () => {
@@ -66,16 +69,13 @@ export class PosStandardPayloadFormComponent extends AbstractForm<
   taxAmount = signal<number>(0);
 
   preparedCTAText = computed(() =>
-    this.editMode ? 'اعمال ویرایش' : this.isRapidInvoice ? 'ثبت و پرداخت' : 'افزودن به لیست خرید'
+    this.ctaText || this.editMode
+      ? 'اعمال ویرایش'
+      : this.isRapidInvoice
+        ? 'ثبت و پرداخت'
+        : 'افزودن به لیست خرید'
   );
 
-  toPriceFormat(amount: number) {
-    if (!amount) {
-      return '';
-    }
-    return `(${formatWithCurrency(amount)})`;
-  }
-
   updateCalculateAmount(value: Partial<IPosOrderItem<IStandardPayload>>) {
     const baseTotalAmount = (value.unit_price ?? 0) * (value.quantity ?? 0);
     const discountAmount = Number(value.discount_amount ?? '0');

src/app/shared/models/index.ts

@@ -0,0 +1,3 @@
+export * from './consumer.type';
+export * from './enum_translate.type';
+export * from './posPayments.type';

src/environments/environment.tis.ts

@@ -1,9 +1,9 @@
 // TIS tenant environment configuration
 export const environment = {
   production: true,
-  apiBaseUrl: 'https://psp-api.shift-am.ir',
+  // apiBaseUrl: 'https://psp-api.shift-am.ir',
   // apiBaseUrl: 'http://192.168.128.73:5002',
-  // apiBaseUrl: 'http://localhost:5002',
+  apiBaseUrl: 'http://localhost:5002',
   host: 'localhost',
   port: 5000,
   enableLogging: false,