init to partner panel

src/app/domains/partner/modules/customers/components/layout.component.html

@@ -0,0 +1,5 @@
+@if (loading()) {
+  <shared-page-loading />
+} @else {
+  <router-outlet></router-outlet>
+}

src/app/domains/partner/modules/customers/components/layout.component.ts

@@ -0,0 +1,26 @@
+import { PageLoadingComponent } from '@/shared/components/page-loading.component';
+import { Component, computed, inject, signal } from '@angular/core';
+import { ActivatedRoute, RouterOutlet } from '@angular/router';
+import { PartnerCustomerStore } from '../store/customer.store';
+
+@Component({
+  selector: 'partner-customer-layout',
+  templateUrl: './layout.component.html',
+  imports: [PageLoadingComponent, RouterOutlet],
+})
+export class PartnerCustomerLayoutComponent {
+  private readonly route = inject(ActivatedRoute);
+  private readonly store = inject(PartnerCustomerStore);
+
+  readonly customerId = signal<string>(this.route.snapshot.paramMap.get('customerId')!);
+
+  readonly loading = computed(() => this.store.loading());
+
+  getData() {
+    this.store.getData(this.customerId());
+  }
+
+  ngOnInit() {
+    this.getData();
+  }
+}

src/app/domains/partner/modules/customers/components/list.component.html

@@ -0,0 +1,11 @@
+<app-page-data-list
+  [pageTitle]="'لیست مشتریان'"
+  [columns]="columns"
+  emptyPlaceholderTitle="مشتری‌ای یافت نشد"
+  [items]="items()"
+  [loading]="loading()"
+  [showEdit]="true"
+  [showDetails]="true"
+  (onEdit)="onEditClick($event)"
+  (onDetails)="toSinglePage($event)"
+/>

src/app/domains/partner/modules/customers/components/list.component.ts

@@ -0,0 +1,48 @@
+// import { CatalogRoleTagComponent } from '@/shared/catalog/roles';
+import { AbstractList } from '@/shared/abstractClasses/abstract-list';
+import {
+  IColumn,
+  PageDataListComponent,
+} from '@/shared/components/pageDataList/page-data-list.component';
+import { Component, inject, Input } from '@angular/core';
+import { Router } from '@angular/router';
+import { partnerCustomersNamedRoutes } from '../constants';
+import { ICustomerResponse } from '../models';
+import { CustomersService } from '../services/main.service';
+
+@Component({
+  selector: 'partner-customer-list',
+  templateUrl: './list.component.html',
+  imports: [PageDataListComponent],
+})
+export class PartnerCustomerListComponent extends AbstractList<ICustomerResponse> {
+  @Input() fullHeight?: boolean;
+  @Input() header: IColumn[] = [
+    { field: 'id', header: 'شناسه', type: 'id' },
+
+    {
+      field: 'first_name',
+      header: 'عنوان',
+    },
+    {
+      field: 'created_at',
+      header: 'تاریخ ایجاد',
+      type: 'date',
+    },
+  ];
+
+  private readonly service = inject(CustomersService);
+  private readonly router = inject(Router);
+
+  override setColumns(): void {
+    this.columns = this.header;
+  }
+
+  override getDataRequest() {
+    return this.service.getAll();
+  }
+
+  toSinglePage(item: ICustomerResponse) {
+    this.router.navigateByUrl(partnerCustomersNamedRoutes.customer.meta.pagePath!(item.id));
+  }
+}

src/app/domains/partner/modules/customers/constants/apiRoutes/index.ts

@@ -0,0 +1,6 @@
+const baseUrl = '/api/v1/partner/customers';
+
+export const PARTNER_CUSTOMERS_API_ROUTES = {
+  list: () => `${baseUrl}`,
+  single: (id: string) => `${baseUrl}/${id}`,
+};

src/app/domains/partner/modules/customers/constants/index.ts

@@ -0,0 +1,2 @@
+export * from './apiRoutes';
+export * from './routes';

src/app/domains/partner/modules/customers/constants/routes/index.ts

@@ -0,0 +1,40 @@
+import { NamedRoutes } from '@/core';
+import { Routes } from '@angular/router';
+
+export type TPartnerCustomersRouteNames = 'customers' | 'customer';
+
+export const partnerCustomersNamedRoutes: NamedRoutes<TPartnerCustomersRouteNames> = {
+  customers: {
+    path: 'customers',
+    loadComponent: () =>
+      import('../../views/list.component').then((m) => m.PartnerCustomersComponent),
+    meta: {
+      title: 'مشتریان',
+      pagePath: () => 'partner/customers',
+    },
+  },
+  customer: {
+    path: 'customers/:customerId',
+    loadComponent: () =>
+      import('../../views/single.component').then((m) => m.PartnerCustomerComponent),
+    meta: {
+      title: 'مشتری',
+      pagePath: (customerId: string) => `partner/customers/${customerId}`,
+    },
+  },
+};
+
+export const PARTNER_CUSTOMERS_ROUTES: Routes = [
+  partnerCustomersNamedRoutes.customers,
+  {
+    path: partnerCustomersNamedRoutes.customer.path,
+    loadComponent: () =>
+      import('../../components/layout.component').then((m) => m.PartnerCustomerLayoutComponent),
+    children: [
+      {
+        ...partnerCustomersNamedRoutes.customer,
+        path: '',
+      },
+    ],
+  },
+];

src/app/domains/partner/modules/customers/models/index.ts

@@ -0,0 +1 @@
+export * from './io';

src/app/domains/partner/modules/customers/models/io.d.ts

@@ -0,0 +1,8 @@
+export interface ICustomerRawResponse {
+  id: string;
+  first_name: string;
+  last_name: string;
+}
+export interface ICustomerResponse extends ICustomerRawResponse {}
+
+export interface ICustomerRequest {}

src/app/domains/partner/modules/customers/services/main.service.ts

@@ -0,0 +1,20 @@
+import { IPaginatedResponse } from '@/core/models/service.model';
+import { HttpClient } from '@angular/common/http';
+import { Injectable } from '@angular/core';
+import { Observable } from 'rxjs';
+import { PARTNER_CUSTOMERS_API_ROUTES } from '../constants';
+import { ICustomerRawResponse, ICustomerResponse } from '../models';
+
+@Injectable({ providedIn: 'root' })
+export class CustomersService {
+  constructor(private http: HttpClient) {}
+
+  private apiRoutes = PARTNER_CUSTOMERS_API_ROUTES;
+
+  getAll(): Observable<IPaginatedResponse<ICustomerResponse>> {
+    return this.http.get<IPaginatedResponse<ICustomerRawResponse>>(this.apiRoutes.list());
+  }
+  getSingle(customerId: string): Observable<ICustomerResponse> {
+    return this.http.get<ICustomerRawResponse>(this.apiRoutes.single(customerId));
+  }
+}

src/app/domains/partner/modules/customers/store/customer.store.ts

@@ -0,0 +1,75 @@
+import { EntityState, EntityStore } from '@/core/state';
+import { computed, inject, Injectable } from '@angular/core';
+import { MenuItem } from 'primeng/api';
+import { catchError, finalize } from 'rxjs';
+import { partnerCustomersNamedRoutes } from '../constants';
+import { ICustomerResponse } from '../models';
+import { CustomersService } from '../services/main.service';
+
+interface PartnerCustomerState extends EntityState<ICustomerResponse> {
+  breadcrumbItems: MenuItem[];
+}
+
+@Injectable({
+  providedIn: 'root',
+})
+export class PartnerCustomerStore extends EntityStore<ICustomerResponse, PartnerCustomerState> {
+  private readonly service = inject(CustomersService);
+  constructor() {
+    super({
+      loading: false,
+      error: null,
+      entity: null,
+      initialized: false,
+      isRefreshing: false,
+      breadcrumbItems: [],
+    });
+  }
+
+  breadcrumbItems = computed(() => this._state().breadcrumbItems);
+
+  private setBreadcrumb(customerId: string) {
+    this.patchState({
+      breadcrumbItems: [
+        {
+          ...partnerCustomersNamedRoutes.customers.meta,
+          routerLink: partnerCustomersNamedRoutes.customers.meta.pagePath!(),
+        },
+        {
+          title: this.entity()?.first_name,
+          routerLink: partnerCustomersNamedRoutes.customer.meta.pagePath!(customerId),
+        },
+      ],
+    });
+  }
+
+  getData(customerId: string) {
+    this.patchState({ loading: true });
+    this.service
+      .getSingle(customerId)
+      .pipe(
+        finalize(() => {
+          this.patchState({ loading: false });
+        }),
+        catchError((error) => {
+          this.setError(error);
+          throw error;
+        }),
+      )
+      .subscribe((entity) => {
+        this.patchState({ entity });
+        this.setBreadcrumb(customerId);
+      });
+  }
+
+  override reset(): void {
+    this.setState({
+      loading: false,
+      error: null,
+      entity: null,
+      initialized: false,
+      isRefreshing: false,
+      breadcrumbItems: [],
+    });
+  }
+}

src/app/domains/partner/modules/customers/views/index.ts

@@ -0,0 +1,2 @@
+export * from './list.component';
+export * from './single.component';

src/app/domains/partner/modules/customers/views/list.component.html

@@ -0,0 +1 @@
+<partner-customer-list />

src/app/domains/partner/modules/customers/views/list.component.ts

@@ -0,0 +1,10 @@
+// import { CatalogRoleTagComponent } from '@/shared/catalog/roles';
+import { Component } from '@angular/core';
+import { PartnerCustomerListComponent } from '../components/list.component';
+
+@Component({
+  selector: 'partner-customers',
+  templateUrl: './list.component.html',
+  imports: [PartnerCustomerListComponent],
+})
+export class PartnerCustomersComponent {}

src/app/domains/partner/modules/customers/views/single.component.html

@@ -0,0 +1,9 @@
+<div class="flex flex-col gap-6">
+  <app-card-data cardTitle="اطلاعات مشتری" [editable]="true" [(editMode)]="editMode">
+    <div class="flex flex-col gap-4">
+      <div class="grid grid-cols-3 gap-4 items-center">
+        <app-key-value label="عنوان" [value]="customer()?.first_name" />
+      </div>
+    </div>
+  </app-card-data>
+</div>

src/app/domains/partner/modules/customers/views/single.component.ts

@@ -0,0 +1,39 @@
+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 { PartnerCustomerStore } from '../store/customer.store';
+
+@Component({
+  selector: 'partner-customer',
+  templateUrl: './single.component.html',
+  imports: [AppCardComponent, KeyValueComponent],
+})
+export class PartnerCustomerComponent {
+  private readonly store = inject(PartnerCustomerStore);
+  private readonly route = inject(ActivatedRoute);
+  private readonly breadcrumbService = inject(BreadcrumbService);
+
+  readonly customerId = signal<string>(this.route.snapshot.paramMap.get('customerId')!);
+  editMode = signal<boolean>(false);
+
+  readonly loading = computed(() => this.store.loading());
+  readonly customer = computed(() => this.store.entity());
+  readonly customerBreadcrumb = computed(() => this.store.breadcrumbItems());
+
+  constructor() {
+    effect(() => {
+      if (this.customer()?.id) {
+        this.setBreadcrumb();
+      }
+    });
+  }
+
+  getData() {
+    this.store.getData(this.customerId());
+  }
+
+  setBreadcrumb() {
+    this.breadcrumbService.setItems(this.customerBreadcrumb());
+  }
+}