get all customers done

src/app/pages/customers/customers-get-all/customers-get-all.html

@@ -2,14 +2,8 @@
     <div nz-row [nzGutter]="10" style="gap: 30px">
         @for (customer of customers(); track customer.id)
         {
-            <nz-card style="width:400px;">
+            <!-- Passage de la donnée du parent vers l'enfant + signal à émettre -->
-                <h2 style="text-align: center; font-weight: bold">Utilisateur n°{{ customer.id }}</h2>
+            <app-get-all-customers-card [customer]="customer" (triggerEdited)="fetchCustomers()" />
-                <p>Nom/Prénom : {{ customer.name }} {{ customer.firstName }}</p>
-                <p>Téléphone : {{ customer.phone }}</p>
-                <p>Email : {{ customer.email }}</p>
-                <p>Adresse : {{ customer.address }}</p>
-                <p>Note : {{ customer.note }}</p>
-            </nz-card>
         }
     </div>
-</div>
+</div>

src/app/pages/customers/customers-get-all/customers-get-all.ts

@@ -1,22 +1,28 @@
-import {Component, inject, signal} from '@angular/core';
+import {Component, inject, OnInit, signal} from '@angular/core';
-import {Router} from "@angular/router";
+import { Router } from '@angular/router';
-import {firstValueFrom} from "rxjs";
+import {CustomersService, GetCustomerDto} from "../../../services/api";
 import {NzNotificationService} from "ng-zorro-antd/notification";
+import {firstValueFrom} from "rxjs";
+import {ReactiveFormsModule} from "@angular/forms";
+import {NzFormModule} from "ng-zorro-antd/form";
+import {NzSpaceComponent} from "ng-zorro-antd/space";
+import {GetAllCustomersCard} from "../get-all-customers-card/get-all-customers-card";
 
 @Component({
   selector: 'app-customers-get-all',
-  imports: [],
+    imports: [ReactiveFormsModule, NzFormModule, GetAllCustomersCard, GetAllCustomersCard],
   templateUrl: './customers-get-all.html',
   styleUrl: './customers-get-all.css',
 })
 export class CustomersGetAll {
-    private customerService = inject(CustomersService);
+    private customersService = inject(CustomersService);
     private notificationService = inject(NzNotificationService)
 
     router = inject(Router);
 
     customers = signal<GetCustomerDto[]>([]);
     customersLoading = signal<boolean>(false);
+
     async ngOnInit() {
         await this.fetchCustomers();
     }
@@ -24,10 +30,9 @@ export class CustomersGetAll {
     async fetchCustomers() {
         this.customersLoading.set(true);
         try {
-            const customer = await firstValueFrom(this.customerService.getAllCustomersEndpoint())
+            const customers = await firstValueFrom(this.customersService.getAllCustomerEndpoint())
-            this.customers.set(customer)
+            this.customers.set(customers)
-        } catch (e)
+        } catch (e) {
-        {
             this.notificationService.error('Erreur', 'Erreur de communication avec l\'API');
         }
 

src/app/pages/customers/get-all-customers-card/get-all-customers-card.html

@@ -0,0 +1,29 @@
+@if (edit() == false) {
+    <nz-card style="width:400px;" [nzActions]="[edit, delete]">
+        <h2 style="text-align: center; font-weight: bold">Client n°{{ customer().id }}</h2>
+        <p>Note : {{ customer().note }}</p>
+    </nz-card>
+    <ng-template #edit>
+        <nz-icon (click)="Edit()" nzType="edit" nzTheme="fill" />
+    </ng-template>
+    <ng-template #delete>
+        <nz-icon (click)="Delete()" nzType="delete" nzTheme="fill" />
+    </ng-template>
+} @else {
+    <nz-card style="width:400px;" [nzActions]="[back, check]">
+        <form nz-form nzLayout="horizontal" [formGroup]="customerForm">
+            <nz-form-item>
+                <nz-form-label nzSpan="5" nzRequired> Note </nz-form-label>
+                <nz-form-control nzSpan="22" nzErrorTip="Ce champ est requis !">
+                    <input nz-input placeholder="Note" formControlName="note">
+                </nz-form-control>
+            </nz-form-item>
+        </form>
+    </nz-card>
+    <ng-template #back>
+        <nz-icon (click)="Back()" nzType="backward" nzTheme="fill" />
+    </ng-template>
+    <ng-template #check>
+        <nz-icon (click)="submitForm()" nzType="check" nzTheme="outline" />
+    </ng-template>
+}

src/app/pages/customers/get-all-customers-card/get-all-customers-card.ts

@@ -0,0 +1,89 @@
+import {Component, inject, input, output, signal} from '@angular/core';
+import {NzIconDirective} from "ng-zorro-antd/icon";
+import {FormControl, FormGroup, ReactiveFormsModule, Validators} from "@angular/forms";
+import {NzFormModule} from "ng-zorro-antd/form";
+import {NzCardComponent} from "ng-zorro-antd/card";
+import {NzInputDirective} from "ng-zorro-antd/input";
+import {CustomersService, GetCustomerDto, UpdateCustomerDto} from "../../../services/api";
+import {NzNotificationService} from "ng-zorro-antd/notification";
+import {firstValueFrom} from "rxjs";
+
+@Component({
+  selector: 'app-get-all-customers-card',
+    imports: [ReactiveFormsModule, NzFormModule, NzCardComponent, NzIconDirective, NzInputDirective],
+  templateUrl: './get-all-customers-card.html',
+  styleUrl: './get-all-customers-card.css',
+})
+export class GetAllCustomersCard {
+    private customersService = inject(CustomersService);
+    private notificationService = inject(NzNotificationService)
+
+    customerEdit = signal<UpdateCustomerDto>(null);
+    customersLoading = signal<boolean>(false);
+
+    customerForm = new FormGroup({
+        id: new FormControl(null, [Validators.required]),
+        note: new FormControl<string>(null, [Validators.required]),
+    })
+
+    async submitForm() {
+        this.customersLoading.set(true);
+
+        const customerValue = {
+            note: this.customerForm.value.note,
+        }
+
+        try {
+            const customer = await firstValueFrom(this.customersService.updateCustomer(this.customer().id,customerValue));
+            this.customerEdit.set(customer);
+            console.log(customer);
+            this.customerForm.reset();
+            this.edit.set(false);
+
+            this.triggerEdited.emit();
+
+        } catch (e)
+        {
+            this.notificationService.error('Erreur', ' (ou Erreur de communication avec l\'API)');
+        }
+
+        this.customersLoading.set(false);
+
+    }
+
+
+    customer = input<GetCustomerDto>(null);
+
+    edit = signal(false)
+
+    triggerEdited = output<void>();
+
+    protected Edit() {
+        this.edit.set(true)
+    }
+
+    protected Back() {
+        this.edit.set(false)
+        this.customerForm.reset();
+    }
+
+    async Delete() {
+        this.customersLoading.set(true);
+
+        try {
+            const customer = await firstValueFrom(this.customersService.deleteCustomerEndpoint(this.customer().id));
+            this.customerEdit.set(customer);
+
+            this.customerForm.reset();
+            this.triggerEdited.emit();
+
+        } catch (e)
+        {
+            this.notificationService.error('Erreur de recherche', "L\'auteur n\'existe pas !");
+
+            this.notificationService.error('Erreur', ' (ou Erreur de communication avec l\'API)');
+        }
+
+        this.customersLoading.set(false);
+    }
+}

src/app/pages/providers/providers-get-all/providers-get-all.ts

@@ -10,27 +10,4 @@ import {firstValueFrom} from "rxjs";
   styleUrl: './providers-get-all.css',
 })
 export class ProvidersGetAll {
-    private providersService = inject(ProvidersService);
-    private notificationService = inject(NzNotificationService)
-
-    router = inject(Router);
-
-    providers = signal<GetProviderDto[]>([]);
-    providersLoading = signal<boolean>(false);
-    async ngOnInit() {
-        await this.fetchProviders();
-    }
-
-    async fetchProviders() {
-        this.providersLoading.set(true);
-        try {
-            const providers = await firstValueFrom(this.providersService.getAllProvidersEndpoint())
-            this.providers.set(providers)
-        } catch (e)
-        {
-            this.notificationService.error('Erreur', 'Erreur de communication avec l\'API');
-        }
-
-        this.providersLoading.set(false);
-    }
 }

src/app/services/api/model/create-contact-dto.ts

@@ -15,6 +15,8 @@ export interface CreateContactDto {
     phoneNumber?: string | null;
     email?: string | null;
     address?: string | null;
+    city?: string | null;
     role?: string | null;
+    customerId?: number | null;
 }
 

src/app/services/api/model/create-customer-dto.ts

@@ -11,5 +11,6 @@
 
 export interface CreateCustomerDto { 
     note?: string | null;
+    customerTypeId?: number;
 }
 

src/app/services/api/model/get-contact-dto.ts

@@ -16,6 +16,8 @@ export interface GetContactDto {
     phoneNumber?: string | null;
     email?: string | null;
     address?: string | null;
+    city?: string | null;
     role?: string | null;
+    customerId?: number | null;
 }
 

src/app/services/api/model/get-customer-dto.ts

@@ -12,5 +12,6 @@
 export interface GetCustomerDto { 
     id?: number;
     note?: string | null;
+    customerTypeId?: number;
 }
 

src/app/services/api/model/method-impl-attributes.ts

@@ -18,7 +18,6 @@ export const MethodImplAttributes = {
     NUMBER_1: 1,
     NUMBER_2: 2,
     NUMBER_3: 3,
-    NUMBER_32: 3,
     NUMBER_4: 4,
     NUMBER_42: 4,
     NUMBER_8: 8,

src/app/services/api/model/update-contact-dto.ts

@@ -15,6 +15,8 @@ export interface UpdateContactDto {
     phoneNumber?: string | null;
     email?: string | null;
     address?: string | null;
+    city?: string | null;
     role?: string | null;
+    customerTypeId?: number | null;
 }