connect api to stock page for get, patch and delete

src/app/components/stock-table/stock-table.ts

@@ -1,13 +1,14 @@
-import {Component, output} from '@angular/core';
-import {StockInfo} from "../../interfaces/stock.interface";
-import {NzTableComponent} from "ng-zorro-antd/table";
+import {Component, inject, OnInit, output, signal, viewChild} from '@angular/core';
+import {NzTableComponent, NzThMeasureDirective} from "ng-zorro-antd/table";
 import {ModalNav} from "../modal-nav/modal-nav";
 import {NzIconDirective} from "ng-zorro-antd/icon";
 import {StockForm} from "../stock-form/stock-form";
 import {NzDividerComponent} from "ng-zorro-antd/divider";
-import {ProductTable} from "../product-table/product-table";
 import {FormsModule} from "@angular/forms";
 import {NzCheckboxComponent} from "ng-zorro-antd/checkbox";
+import {GetProductDto, ProductsService} from "../../services/api";
+import {NzNotificationService} from "ng-zorro-antd/notification";
+import {firstValueFrom} from "rxjs";
 
 @Component({
     selector: 'app-stock-table',
@@ -19,38 +20,30 @@ import {NzCheckboxComponent} from "ng-zorro-antd/checkbox";
         NzDividerComponent,
         FormsModule,
         NzCheckboxComponent,
+        NzThMeasureDirective,
     ],
     templateUrl: './stock-table.html',
     styleUrl: './stock-table.css',
 })
 
-export class StockTable {
-    listOfData: StockInfo[] = [
-        { id: 1,  product: ProductTable.listOfProducts[0],  quantity: 10 },
-        { id: 2,  product: ProductTable.listOfProducts[1],  quantity: 5 },
-        { id: 3,  product: ProductTable.listOfProducts[2],  quantity: 8 },
-        { id: 4,  product: ProductTable.listOfProducts[3],  quantity: 12 },
-        { id: 5,  product: ProductTable.listOfProducts[4],  quantity: 7 },
-        { id: 6,  product: ProductTable.listOfProducts[5],  quantity: 15 },
-        { id: 7,  product: ProductTable.listOfProducts[6],  quantity: 9 },
-        { id: 8,  product: ProductTable.listOfProducts[7],  quantity: 6 },
-        { id: 9,  product: ProductTable.listOfProducts[8],  quantity: 11 },
-        { id: 10, product: ProductTable.listOfProducts[9],  quantity: 14 },
-        { id: 11, product: ProductTable.listOfProducts[10], quantity: 7 },
-        { id: 12, product: ProductTable.listOfProducts[11], quantity: 13 },
-        { id: 13, product: ProductTable.listOfProducts[12], quantity: 10 },
-        { id: 14, product: ProductTable.listOfProducts[13], quantity: 5 },
-    ];
+export class StockTable implements OnInit {
+    private productsService = inject(ProductsService);
+    private notificationService = inject(NzNotificationService)
+    products = signal<GetProductDto[]>([]);
+    productsLoading = signal<boolean>(false);
+    updateProduct = viewChild.required<StockForm>('stockForm');
+    modal = viewChild.required<ModalNav>('modalNav');
 
     checked = false;
     indeterminate = false;
     setOfCheckedId = new Set<number>();
+    selectionChange = output<boolean>()
+    currentPageData: GetProductDto[] = [];
 
     get hasSelection(): boolean {
         return this.setOfCheckedId.size > 0;
     }
 
-
     updateCheckedSet(id: number, checked: boolean): void {
         if (checked) this.setOfCheckedId.add(id);
         else this.setOfCheckedId.delete(id);
@@ -62,31 +55,109 @@ export class StockTable {
     }
 
     onAllChecked(checked: boolean): void {
-        this.listOfData.forEach(item => this.updateCheckedSet(item.id, checked));
+        this.currentPageData.forEach(item =>
+            this.updateCheckedSet(item.id, checked)
+        );
+        this.refreshCheckedStatus();
+    }
+
+    onCurrentPageDataChange($event: GetProductDto[]): void {
+        this.currentPageData = $event;
         this.refreshCheckedStatus();
     }
 
     refreshCheckedStatus(): void {
-        const total = this.listOfData.length;
-        const checkedCount = this.setOfCheckedId.size;
+        const total = this.currentPageData.length;
+        const checkedCount = this.currentPageData.filter(p => this.setOfCheckedId.has(p.id)).length;
 
         this.checked = checkedCount === total;
         this.indeterminate = checkedCount > 0 && checkedCount < total;
 
-        // 🔥 Émission asynchrone -> corrige le retard d’affichage
-        setTimeout(() => {
-            this.selectionChange.emit(this.hasSelection);
-        });
+        setTimeout(() => this.selectionChange.emit(this.hasSelection));
     }
 
-
-    onCurrentPageDataChange($event: StockInfo[]): void {
-        this.listOfData = $event;
-        this.refreshCheckedStatus();
+    get selectedIds() {
+        return Array.from(this.setOfCheckedId);
     }
 
-    delete() {
-        return;
+    async ngOnInit() {
+        await this.fetchProducts();
+    }
+
+    async fetchProducts() {
+        this.productsLoading.set(true)
+
+        try {
+            const products = await firstValueFrom(this.productsService.getAllProductsEndpoint())
+            this.products.set(products);
+        } catch (e) {
+            this.notificationService.error(
+                'Erreur',
+                'Erreur de communication avec l\'API'
+            )
+        }
+        this.productsLoading.set(false)
+    }
+
+    async delete(productId:number) {
+        try {
+            await firstValueFrom(this.productsService.deleteProductEndpoint(productId))
+            this.notificationService.success(
+                'Success',
+                'Suppression effectuée'
+            )
+        } catch (e) {
+            this.notificationService.error(
+                'Erreur',
+                'Impossible de supprimer la ligne'
+            )
+        }
+        await this.fetchProducts();
+    }
+
+    async edit(id: number, updateProductComponent: StockForm) {
+        if (updateProductComponent.stockForm.invalid) {
+            this.notificationService.error(
+                'Erreur',
+                'Erreur d\'écriture dans le formulaire'
+            )
+            return;
+        }
+
+        try {
+
+            const products = updateProductComponent.stockForm.getRawValue();
+            await firstValueFrom(this.productsService.patchProductMinimalStockEndpoint(id, products))
+
+            this.notificationService.success(
+                'Success',
+                'Limite de stock modifiée'
+            )
+        } catch (e) {
+            console.error(e);
+            this.notificationService.error(
+                'Erreur',
+                'Erreur lors de la modification'
+            )
+        }
+    }
+
+    selectedProduct: GetProductDto | null = null;
+    openEditModal(product: GetProductDto) {
+        this.selectedProduct = { ...product};
+        this.modal().showModal();
+    }
+
+    async onModalOk(productId: number, updateProductComponent: StockForm, modal: ModalNav) {
+        if (!this.selectedProduct) return;
+
+        await this.edit(productId, updateProductComponent);
+        updateProductComponent.stockForm.reset();
+        modal.isVisible = false;
+        await this.fetchProducts();
+    }
+
+    onModalCancel(modal: ModalNav) {
+        modal.isVisible = false;
     }
-    selectionChange = output<boolean>()
 }