feat: update POS and account components to use new field names and improve form handling

src/app/domains/consumer/constants/components/pos/pos.ts

@@ -5,7 +5,7 @@ import { IPosInitialValues } from './pos.model';
 export const columns: IColumn[] = [
   // { field: 'id', header: 'شناسه', type: 'id' },
   { field: 'name', header: 'عنوان' },
-  { field: 'serial', header: 'شماره سریال' },
+  { field: 'serial_number', header: 'شماره سریال' },
   { field: 'pos_type', header: 'نوع دستگاه' },
   { field: 'device', header: 'دستگاه', type: 'nested', nestedOption: { path: 'device.name' } },
   {
@@ -14,7 +14,7 @@ export const columns: IColumn[] = [
     type: 'nested',
     nestedOption: { path: 'provider.name' },
   },
-  { field: 'status', header: 'وضعیت' },
+  { field: 'account', header: 'کاربر', type: 'nested', nestedOption: { path: 'account.username' } },
   {
     field: 'created_at',
     header: 'تاریخ ایجاد',

src/app/domains/consumer/modules/accounts/models/io.d.ts

@@ -3,6 +3,7 @@ export interface IAccountRawResponse {
   role: string;
   created_at: string;
   account: Account;
+  pos: PosComplex;
 }
 export interface IAccountResponse extends IAccountRawResponse {}
 
@@ -18,3 +19,9 @@ interface Account {
   username: string;
   status: string;
 }
+
+interface PosComplex {
+  name: string;
+  branch_code: string;
+  business_activity: { name: string };
+}

src/app/domains/consumer/modules/accounts/views/list.component.html

@@ -3,9 +3,7 @@
   [columns]="columns"
   emptyPlaceholderTitle="حساب‌ کاربری‌ای یافت نشد"
   [items]="items()"
-  [showDetails]="true"
   [loading]="loading()"
-  (onDetails)="toSinglePage($event)"
 />
 
 @if (selectedItemForEdit()) {

src/app/domains/consumer/modules/accounts/views/list.component.ts

@@ -26,12 +26,12 @@ export class ConsumerAccountsComponent extends AbstractList<IAccountResponse> {
         type: 'nested',
         nestedOption: { path: 'account.username' },
       },
-      { field: 'role', header: 'نقش' },
       {
-        field: 'status',
-        header: 'وضعیت',
-        type: 'nested',
-        nestedOption: { path: 'account.status' },
+        field: 'pos',
+        header: 'پایانه',
+        customDataModel(item) {
+          return `${item.pos.name} - ${item.pos.complex.name} - ${item.pos.complex.business_activity.name}`;
+        },
       },
       {
         field: 'created_at',

src/app/domains/consumer/modules/accounts/views/single.component.html

@@ -3,11 +3,9 @@
     <div class="flex flex-col gap-4">
       <div class="grid grid-cols-3 gap-4 items-center">
         <app-key-value label="نام کاربری" [value]="account()?.account?.username" />
-        <app-key-value label="نقش" [value]="account()?.role" />
-        <app-key-value label="وضعیت" [value]="account()?.account?.status" />
       </div>
     </div>
   </app-card-data>
 
-  <consumer-account-permission-list />
+  <!-- <consumer-account-permission-list /> -->
 </div>

src/app/domains/consumer/modules/businessActivities/components/complexes/form.component.ts

@@ -20,7 +20,7 @@ export class ConsumerComplexFormComponent extends AbstractFormDialog<
   private readonly service = inject(ConsumerComplexesService);
 
   @Input({ required: true }) businessActivityId!: string;
-  @Input({ required: true }) complexId!: string;
+  @Input() complexId!: string;
 
   initForm = () => {
     return this.fb.group({
@@ -33,7 +33,7 @@ export class ConsumerComplexFormComponent extends AbstractFormDialog<
   form = this.initForm();
 
   get preparedTitle() {
-    return `ویرایش شعبه ${this.initialValues?.name}`;
+    return `${this.editMode ? 'ویرایش' : 'ایجاد'} شعبه`;
   }
 
   override ngOnChanges(): void {
@@ -42,6 +42,9 @@ export class ConsumerComplexFormComponent extends AbstractFormDialog<
 
   submitForm() {
     const formValue = this.form.value as IComplexRequest;
-    return this.service.update(this.businessActivityId, this.complexId, formValue);
+    if (this.editMode) {
+      return this.service.update(this.businessActivityId, this.complexId, formValue);
+    }
+    return this.service.create(this.businessActivityId, formValue);
   }
 }

src/app/domains/consumer/modules/businessActivities/components/complexes/list.component.html

@@ -1,11 +1,16 @@
 <app-page-data-list
-  pageTitle="لیست شعب"
+  pageTitle="مدیریت شعب"
+  [addNewCtaLabel]="'افزودن شعبه‌ جدید'"
+  [showAdd]="true"
   [columns]="columns"
+  [showAdd]="true"
   emptyPlaceholderTitle="شعبه‌ای یافت نشد."
+  emptyPlaceholderDescription="برای افزودن شعبه‌ جدید، روی دکمهٔ بالا کلیک کنید."
   [items]="items()"
   [loading]="loading()"
   [showDetails]="true"
   [showEdit]="true"
+  (onAdd)="openAddForm()"
   (onEdit)="onEditClick($event)"
   (onDetails)="toSinglePage($event)"
 >

src/app/domains/consumer/modules/businessActivities/components/poses/form.component.html

@@ -8,6 +8,55 @@
 >
   <form [formGroup]="form" (submit)="submit()" class="flex flex-col gap-4">
     <app-input label="عنوان" [control]="form.controls.name" name="name" />
+
+    <app-enum-select [control]="form.controls.pos_type" type="posType" name="pos_type" />
+
+    @if (!editMode) {
+      <p-divider align="center"> اطلاعات ورود </p-divider>
+      <app-input label="نام کاربری" [control]="form.controls.username" name="username" [isLtrInput]="true" />
+      <uikit-field label="رمز عبور" [control]="form.controls.password">
+        <p-password
+          id="password"
+          name="password"
+          formControlName="password"
+          autocomplete="new-password"
+          class="w-full"
+          [toggleMask]="true"
+          [feedback]="false"
+          [invalid]="form.controls.password.touched && form.controls.password.invalid"
+          [inputStyle]="{
+            width: '100%',
+          }"
+        />
+
+        <span class="text-xs mt-1 text-muted-color">
+          رمز باید حداقل ۸ کاراکتر بوده و شامل حداقل یک حرف بزرگ، یک حرف کوچک، یک عدد و یک کاراکتر ویژه باشد.
+        </span>
+      </uikit-field>
+
+      <uikit-field label="تکرار رمز عبور" [control]="form.controls.confirmPassword">
+        <p-password
+          id="confirmPassword"
+          name="confirmPassword"
+          formControlName="confirmPassword"
+          autocomplete="new-password"
+          class="w-full"
+          [toggleMask]="true"
+          [feedback]="false"
+          [invalid]="form.controls.confirmPassword.touched && form.controls.confirmPassword.invalid"
+          [inputStyle]="{
+            width: '100%',
+          }"
+        />
+      </uikit-field>
+    }
+
+    @if (form.controls.pos_type.value === "PSP") {
+      <app-input label="سریال دستگاه" [control]="form.controls.serial_number" name="serial_number" />
+      <catalog-device-select [control]="form.controls.device_id" />
+      <catalog-provider-select [control]="form.controls.provider_id" />
+    }
+
     <app-form-footer-actions [submitLabel]="'ذخیره'" [loading]="submitLoading()" (onCancel)="close()" />
   </form>
 </p-dialog>

src/app/domains/consumer/modules/businessActivities/components/poses/form.component.ts

@@ -1,18 +1,35 @@
 // import { CatalogRolesComponent } from '@/shared/catalog/roles';
-import { CONSUMER_COMPONENTS_CONST } from '@/domains/consumer/constants';
+import { MustMatch } from '@/core/validators';
 import { AbstractFormDialog } from '@/shared/abstractClasses';
+import { EnumSelectComponent } from '@/shared/apiEnum/select.component';
+import { CatalogProviderSelectComponent } from '@/shared/catalog';
+import { CatalogDeviceSelectComponent } from '@/shared/catalog/devices';
 import { InputComponent } from '@/shared/components';
 import { FormFooterActionsComponent } from '@/shared/components/formFooterActions/form-footer-actions.component';
+import { UikitFieldComponent } from '@/uikit';
 import { Component, inject, Input } from '@angular/core';
-import { ReactiveFormsModule } from '@angular/forms';
+import { ReactiveFormsModule, Validators } from '@angular/forms';
 import { Dialog } from 'primeng/dialog';
+import { Divider } from 'primeng/divider';
+import { Password } from 'primeng/password';
 import { IPosRequest, IPosResponse } from '../../models';
 import { ConsumerPosesService } from '../../services/poses.service';
 
 @Component({
   selector: 'consumer-pos-form',
   templateUrl: './form.component.html',
-  imports: [ReactiveFormsModule, Dialog, InputComponent, FormFooterActionsComponent],
+  imports: [
+    ReactiveFormsModule,
+    Dialog,
+    InputComponent,
+    FormFooterActionsComponent,
+    CatalogDeviceSelectComponent,
+    CatalogProviderSelectComponent,
+    EnumSelectComponent,
+    UikitFieldComponent,
+    Password,
+    Divider,
+  ],
 })
 export class ConsumerPosFormComponent extends AbstractFormDialog<IPosRequest, IPosResponse> {
   private readonly service = inject(ConsumerPosesService);
@@ -21,14 +38,84 @@ export class ConsumerPosFormComponent extends AbstractFormDialog<IPosRequest, IP
   @Input({ required: true }) complexId!: string;
   @Input({ required: true }) posId!: string;
 
-  initForm() {
-    return CONSUMER_COMPONENTS_CONST.pos.initForm(this.fb, this.initialValues);
-  }
+  initForm = () => {
+    const form = this.fb.group({
+      name: [this.initialValues?.name || '', [Validators.required]],
+      pos_type: [this.initialValues?.pos_type || '', [Validators.required]],
+      serial_number: [this.initialValues?.serial_number || ''],
+      device_id: [this.initialValues?.device?.id || ''],
+      provider_id: [this.initialValues?.provider?.id || ''],
+      username: [''],
+      password: [''],
+      confirmPassword: [''],
+    });
+
+    form.controls.pos_type.valueChanges.subscribe((value) => {
+      if (value === 'PSP') {
+        form.controls.serial_number.setValidators([Validators.required]);
+        form.controls.device_id.setValidators([Validators.required]);
+        form.controls.provider_id.setValidators([Validators.required]);
+        form.controls.serial_number.enable({ emitEvent: false });
+        form.controls.device_id.enable({ emitEvent: false });
+        form.controls.provider_id.enable({ emitEvent: false });
+      } else {
+        form.controls.serial_number.clearValidators();
+        form.controls.device_id.clearValidators();
+        form.controls.provider_id.clearValidators();
+        form.controls.serial_number.reset('');
+        form.controls.device_id.reset('');
+        form.controls.provider_id.reset('');
+        form.controls.serial_number.disable({ emitEvent: false });
+        form.controls.device_id.disable({ emitEvent: false });
+        form.controls.provider_id.disable({ emitEvent: false });
+      }
+
+      form.controls.serial_number.updateValueAndValidity({ emitEvent: false });
+      form.controls.device_id.updateValueAndValidity({ emitEvent: false });
+      form.controls.provider_id.updateValueAndValidity({ emitEvent: false });
+    });
+    form.controls.pos_type.updateValueAndValidity({ emitEvent: true });
+
+    if (this.editMode) {
+      // @ts-ignore
+      form.removeControl('username');
+      // @ts-ignore
+      form.removeControl('password');
+      // @ts-ignore
+      form.removeControl('confirmPassword');
+      form.removeValidators([MustMatch('password', 'confirmPassword')]);
+    } else {
+      form.addControl(
+        'username',
+        this.fb.control<string>('', {
+          nonNullable: true,
+          validators: [Validators.required],
+        }),
+      );
+      form.addControl(
+        'password',
+        this.fb.control<string>('', {
+          nonNullable: true,
+          validators: [Validators.required],
+        }),
+      );
+      form.addControl(
+        'confirmPassword',
+        this.fb.control<string>('', {
+          nonNullable: true,
+          validators: [Validators.required],
+        }),
+      );
+      form.addValidators([MustMatch('password', 'confirmPassword')]);
+    }
+
+    return form;
+  };
 
   form = this.initForm();
 
   get preparedTitle() {
-    return `ویرایش پایانه فروش ${this.initialValues?.name}`;
+    return `${this.editMode ? 'ویرایش' : 'ایجاد'} پایانه فروش`;
   }
 
   override ngOnChanges(): void {
@@ -36,7 +123,11 @@ export class ConsumerPosFormComponent extends AbstractFormDialog<IPosRequest, IP
   }
 
   submitForm() {
-    const formValue = this.form.value as IPosRequest;
-    return this.service.update(this.businessActivityId, this.complexId, this.posId, formValue);
+    const formValue = this.form.value as IPosRequest & { confirmPassword?: string };
+    const { confirmPassword, ...rest } = formValue;
+    if (this.editMode) {
+      return this.service.update(this.businessActivityId, this.complexId, this.posId!, rest);
+    }
+    return this.service.create(this.businessActivityId, this.complexId, rest);
   }
 }

src/app/domains/consumer/modules/businessActivities/components/poses/list.component.html

@@ -1,11 +1,15 @@
 <app-page-data-list
   pageTitle="لیست پایانه‌های فروش"
   [columns]="columns"
+  [addNewCtaLabel]="'افزودن پایانه‌ی فروش جدید'"
   emptyPlaceholderTitle="پایانه‌ی فروشی یافت نشد."
+  emptyPlaceholderDescription="برای افزودن پایانه‌ی فروش جدید، روی دکمهٔ بالا کلیک کنید."
   [items]="items()"
   [loading]="loading()"
   [showDetails]="true"
   [showEdit]="true"
+  [showAdd]="true"
+  (onAdd)="openAddForm()"
   (onEdit)="onEditClick($event)"
   (onDetails)="toSinglePage($event)"
 >

src/app/domains/consumer/modules/businessActivities/models/io.d.ts

@@ -20,4 +20,5 @@ interface LicenseInfo {
   starts_at: string;
   expires_at: string;
   accounts_limit: number;
+  allocated_account_count: number;
 }

src/app/domains/consumer/modules/businessActivities/models/poses_io.d.ts

@@ -3,7 +3,7 @@ import ISummary from '@/core/models/summary';
 export interface IPosRawResponse {
   id: string;
   name: string;
-  serial: string;
+  serial_number: string;
   model?: string;
   status: string;
   pos_type: string;
@@ -15,4 +15,10 @@ export interface IPosResponse extends IPosRawResponse {}
 
 export interface IPosRequest {
   name: string;
+  serial_number: string;
+  pos_type: string;
+  device_id?: string;
+  provider_id?: string;
+  username?: string;
+  password?: string;
 }

src/app/domains/consumer/modules/businessActivities/services/complexes.service.ts

@@ -20,6 +20,10 @@ export class ConsumerComplexesService {
     return this.http.get<IComplexRawResponse>(this.apiRoutes.single(businessActivityId, complexId));
   }
 
+  create(businessActivityId: string, data: IComplexRequest): Observable<IComplexResponse> {
+    return this.http.post<IComplexRawResponse>(this.apiRoutes.list(businessActivityId), data);
+  }
+
   update(
     businessActivityId: string,
     complexId: string,

src/app/domains/consumer/modules/businessActivities/services/poses.service.ts

@@ -29,6 +29,17 @@ export class ConsumerPosesService {
     );
   }
 
+  create(
+    businessActivityId: string,
+    complexId: string,
+    data: IPosRequest,
+  ): Observable<IPosResponse> {
+    return this.http.post<IPosRawResponse>(
+      this.apiRoutes.list(businessActivityId, complexId),
+      data,
+    );
+  }
+
   update(
     businessActivityId: string,
     complexId: string,

src/app/domains/consumer/modules/businessActivities/views/poses/single.component.html

@@ -6,8 +6,8 @@
     <div class="flex flex-col gap-4">
       <div class="grid grid-cols-3 gap-4 items-center">
         <app-key-value label="عنوان" [value]="pos()?.name" />
-        <app-key-value label="شماره سریال" [value]="pos()?.serial" />
         <app-key-value label="نوع پایانه" [value]="pos()?.pos_type" />
+        <app-key-value label="شماره سریال" [value]="pos()?.serial_number" />
         <app-key-value label="نوع دستگاه" [value]="pos()?.device?.name" />
         <app-key-value label="مدل دستگاه" [value]="pos()?.model" />
         <app-key-value label="ارایه‌دهنده" [value]="pos()?.provider?.name" />

src/app/domains/consumer/modules/businessActivities/views/single.component.html

@@ -7,6 +7,12 @@
         <app-key-value label="کد اقتصادی" [value]="business()?.economic_code" />
         <app-key-value label="صنف" [value]="business()?.guild?.name" />
       </div>
+      <p-divider align="center">اطلاعات لایسنس</p-divider>
+      <div class="grid grid-cols-3 gap-4 items-center">
+        <app-key-value label="تاریخ پایان لایسنس" [value]="business()?.license_info?.expires_at" type="date" />
+        <app-key-value label="محدودیت کاربر" [value]="business()?.license_info?.accounts_limit" />
+        <app-key-value label="تعداد کاربران ایجاد شده" [value]="business()?.license_info?.allocated_account_count" />
+      </div>
     </div>
   </app-card-data>
 

src/app/domains/consumer/modules/businessActivities/views/single.component.ts

@@ -2,6 +2,7 @@ import { BreadcrumbService } from '@/core/services';
 import { AppCardComponent, KeyValueComponent } from '@/shared/components';
 import { Component, computed, effect, inject, signal } from '@angular/core';
 import { ActivatedRoute } from '@angular/router';
+import { Divider } from 'primeng/divider';
 import { ConsumerComplexListComponent } from '../components/complexes/list.component';
 import { ConsumerBusinessActivityFormComponent } from '../components/form.component';
 import { BusinessActivityStore } from '../store/businessActivity.store';
@@ -14,6 +15,7 @@ import { BusinessActivityStore } from '../store/businessActivity.store';
     KeyValueComponent,
     ConsumerBusinessActivityFormComponent,
     ConsumerComplexListComponent,
+    Divider,
   ],
 })
 export class ConsumerBusinessActivityComponent {

src/app/domains/consumer/modules/poses/components/list.component.ts

@@ -33,7 +33,7 @@ export class ConsumerPosListComponent extends AbstractList<IPosResponse> {
   override setColumns(): void {
     this.columns = [
       ...this.header.filter((header) =>
-        ['name', 'status', 'pos_type'].includes(header.field as string),
+        ['name', 'account', 'pos_type', 'status'].includes(header.field as string),
       ),
       {
         field: 'complex.business_activity',

src/app/domains/consumer/modules/poses/models/io.d.ts

@@ -3,7 +3,7 @@ import ISummary from '@/core/models/summary';
 export interface IPosRawResponse {
   id: string;
   name: string;
-  serial: string;
+  serial_number: string;
   model?: string;
   status: string;
   pos_type: string;

src/app/domains/consumer/modules/poses/views/single.component.html

@@ -6,8 +6,8 @@
     <div class="flex flex-col gap-4">
       <div class="grid grid-cols-3 gap-4 items-center">
         <app-key-value label="عنوان" [value]="pos()?.name" />
-        <app-key-value label="شماره سریال" [value]="pos()?.serial" />
         <app-key-value label="نوع پایانه" [value]="pos()?.pos_type" />
+        <app-key-value label="شماره سریال" [value]="pos()?.serial_number" />
         <app-key-value label="نوع دستگاه" [value]="pos()?.device?.name" />
         <app-key-value label="مدل دستگاه" [value]="pos()?.model" />
         <app-key-value label="ارایه‌دهنده" [value]="pos()?.provider?.name" />