Merge branch 'feature/ConnectingApiToPurchaseOrderPage' into develop

This commit is contained in:
2025-11-30 12:34:45 +01:00
7 changed files with 66 additions and 203 deletions

View File

@@ -1,4 +1,4 @@
<form nz-form nzLayout="horizontal" [formGroup]="productForm" (ngSubmit)="submitForm()"> <form nz-form nzLayout="horizontal" [formGroup]="productForm">
<nz-form-item nz-flex> <nz-form-item nz-flex>
<nz-form-label nzSpan="9" nzRequired> <nz-form-label nzSpan="9" nzRequired>
Prix Prix

View File

@@ -26,15 +26,4 @@ export class ProductForm {
price: new FormControl<string>(null, [Validators.required]), price: new FormControl<string>(null, [Validators.required]),
quantity: new FormControl<string>(null, [Validators.required]) quantity: new FormControl<string>(null, [Validators.required])
}) })
submitForm() {
// Pour annuler si le formulaire est invalide
if (this.productForm.invalid) return;
// Pour obtenir la valeur du formulaire
console.log(this.productForm.getRawValue())
// Pour vider le formulaire
this.productForm.reset()
}
} }

View File

@@ -1 +0,0 @@
<p>product-table works!</p>

View File

@@ -1,4 +1,4 @@
<form nz-form nzLayout="horizontal" [formGroup]="purchaseOrderForm" (ngSubmit)="submitForm()"> <form nz-form nzLayout="horizontal" [formGroup]="purchaseOrderForm">
<nz-form-item nz-flex> <nz-form-item nz-flex>
<nz-form-label nzSpan="12" nzRequired> <nz-form-label nzSpan="12" nzRequired>
Conditions générales de vente Conditions générales de vente

View File

@@ -25,15 +25,4 @@ export class PurchaseOrderForm {
purchaseOrderForm: FormGroup = new FormGroup({ purchaseOrderForm: FormGroup = new FormGroup({
purchaseCondition: new FormControl<string>(null,[Validators.required]) purchaseCondition: new FormControl<string>(null,[Validators.required])
}) })
submitForm() {
// Pour annuler si le formulaire est invalide
if (this.purchaseOrderForm.invalid) return;
// Pour obtenir la valeur du formulaire
console.log(this.purchaseOrderForm.getRawValue())
// Pour vider le formulaire
this.purchaseOrderForm.reset()
}
} }

View File

@@ -1,4 +1,7 @@
<nz-table #basicTable [nzData]="purchaseOrders" class="mr-7"> <nz-table [nzData]="purchaseOrders()"
[nzLoading]="purchaseOrdersLoading()"
[nzFrontPagination]="false"
class="mr-7">
<thead> <thead>
<tr class="text-center"> <tr class="text-center">
<th>Numéro</th> <th>Numéro</th>
@@ -9,37 +12,36 @@
</tr> </tr>
</thead> </thead>
<tbody class="text-center"> <tbody class="text-center">
@for (data of basicTable.data; track data) { @for (purchaseOrder of purchaseOrders(); track purchaseOrder.id) {
<tr> <tr>
<td></td> <td>{{ purchaseOrder.id }}</td>
<td></td> <td>{{purchaseOrder.purchaseConditions}}</td>
<td></td> <td>Fournisseur ???</td>
<td> <td>
<app-modal-button type="link" name="Voir les produits"> <app-modal-button type="link" name="Voir les produits">
<div style="max-height: 400px; overflow-y: auto;"> <div style="max-height: 400px; overflow-y: auto;">
<nz-table [nzData]="data.productOrder"> <nz-table [nzData]="purchaseOrders()"
[nzFrontPagination]="false">
<thead> <thead>
<tr class="text-center"> <tr class="text-center">
<th>Nom</th> <th>Nom</th>
<th>Reférence</th>
<th>Prix</th> <th>Prix</th>
<th>Quantité</th> <th>Quantité</th>
<th>Action</th> <th>Action</th>
</tr> </tr>
</thead> </thead>
<tbody class="text-center"> <tbody class="text-center">
@for (product of data.productOrder; track product) { @for (product of purchaseOrder.getPurchaseProductDto; track product.productId) {
<tr> <tr>
<td>{{product.product.name}}</td> <td>{{product.productName}}</td>
<td>{{product.price}}</td> <td>{{product.productReferences}}</td>
<td>Prix €€€€</td>
<td>{{product.quantity}}</td> <td>{{product.quantity}}</td>
<td> <td>
<div style="justify-content: center; display: flex"> <div style="justify-content: center; display: flex">
<app-modal-nav nameIcon="edit" name="Modification des conditions de vente" class="cursor-pointer">
<app-product-form></app-product-form>
</app-modal-nav>
<nz-divider nzType="vertical"></nz-divider>
<div> <div>
<nz-icon nzType="delete" nzTheme="outline" (click)="delete()" class="cursor-pointer text-red-700"/> <nz-icon nzType="delete" nzTheme="outline" class="cursor-pointer text-red-700"/>
</div> </div>
</div> </div>
</td> </td>
@@ -52,12 +54,16 @@
</td> </td>
<td> <td>
<div style="justify-content: center; display: flex"> <div style="justify-content: center; display: flex">
<div>
<nz-icon nzType="plus-circle" nzTheme="outline" (click)="delete(purchaseOrder.id)" class="cursor-pointer text-green-700"/>
</div>
<nz-divider nzType="vertical"></nz-divider>
<app-modal-nav nameIcon="edit" name="Modification des conditions de vente" class="cursor-pointer"> <app-modal-nav nameIcon="edit" name="Modification des conditions de vente" class="cursor-pointer">
<app-purchase-order-form></app-purchase-order-form> <app-purchase-order-form></app-purchase-order-form>
</app-modal-nav> </app-modal-nav>
<nz-divider nzType="vertical"></nz-divider> <nz-divider nzType="vertical"></nz-divider>
<div> <div>
<nz-icon nzType="delete" nzTheme="outline" (click)="delete()" class="cursor-pointer text-red-700"/> <nz-icon nzType="delete" nzTheme="outline" (click)="delete(purchaseOrder.id)" class="cursor-pointer text-red-700"/>
</div> </div>
<nz-divider nzType="vertical"></nz-divider> <nz-divider nzType="vertical"></nz-divider>
<div> <div>
@@ -65,7 +71,7 @@
</div> </div>
<nz-divider nzType="vertical"></nz-divider> <nz-divider nzType="vertical"></nz-divider>
<div> <div>
<nz-icon nzType="interaction" nzTheme="outline" (click)="transfert()" class="cursor-pointer text-blue-700"/> <nz-icon nzType="interaction" nzTheme="outline" (click)="transfer()" class="cursor-pointer text-blue-700"/>
</div> </div>
</div> </div>
</td> </td>

View File

@@ -1,12 +1,13 @@
import { Component } from '@angular/core'; import {Component, inject, OnInit, signal} from '@angular/core';
import {ModalNav} from "../modal-nav/modal-nav"; import {ModalNav} from "../modal-nav/modal-nav";
import {NzDividerComponent} from "ng-zorro-antd/divider"; import {NzDividerComponent} from "ng-zorro-antd/divider";
import {NzIconDirective} from "ng-zorro-antd/icon"; import {NzIconDirective} from "ng-zorro-antd/icon";
import {NzTableComponent} from "ng-zorro-antd/table"; import {NzTableComponent} from "ng-zorro-antd/table";
import {PurchaseOrderInfo} from "../../interfaces/purchase-order.interface";
import {PurchaseOrderForm} from "../purchase-order-form/purchase-order-form"; import {PurchaseOrderForm} from "../purchase-order-form/purchase-order-form";
import {ModalButton} from "../modal-button/modal-button"; import {ModalButton} from "../modal-button/modal-button";
import {ProductForm} from "../product-form/product-form"; import {GetPurchaseOrderDto, PurchaseordersService} from "../../services/api";
import {NzNotificationService} from "ng-zorro-antd/notification";
import {firstValueFrom} from "rxjs";
@Component({ @Component({
selector: 'app-purchase-order-table', selector: 'app-purchase-order-table',
@@ -17,177 +18,56 @@ import {ProductForm} from "../product-form/product-form";
NzTableComponent, NzTableComponent,
PurchaseOrderForm, PurchaseOrderForm,
ModalButton, ModalButton,
ProductForm
], ],
templateUrl: './purchase-order-table.html', templateUrl: './purchase-order-table.html',
styleUrl: './purchase-order-table.css', styleUrl: './purchase-order-table.css',
}) })
export class PurchaseOrderTable { export class PurchaseOrderTable implements OnInit {
purchaseOrders: PurchaseOrderInfo[] = [ private purchaseOrdersService = inject(PurchaseordersService);
{ private notificationService = inject(NzNotificationService)
purchaseCondition: "Condition d'achat standard 1", purchaseOrders = signal<GetPurchaseOrderDto[]>([]);
supplier: { purchaseOrdersLoading = signal<boolean>(false);
name: "Fournisseur 1",
email: "contact1@example.com",
phone: "0100000001",
address: "1 Rue de Paris",
zipCode: "75001",
city: "Paris",
deliveryDelay: 3,
products: [
{
reference: "F1-P1",
name: "Produit 1A",
supplier: [],
duration: 0,
caliber: "",
approvalNumber: "",
weight: 1,
nec: 0,
image: "",
link: "",
minimalQuantity: 1
},
{
reference: "F1-P2",
name: "Produit 1B",
supplier: [],
duration: 0,
caliber: "",
approvalNumber: "",
weight: 2,
nec: 0,
image: "",
link: "",
minimalQuantity: 1
}
]
},
productOrder: [
{
product: {
reference: "F1-P1",
name: "Produit 1A",
supplier: [],
duration: 0,
caliber: "",
approvalNumber: "",
weight: 1,
nec: 0,
image: "",
link: "",
minimalQuantity: 1
},
quantity: 5,
price: 10
},
{
product: {
reference: "F1-P2",
name: "Produit 1B",
supplier: [],
duration: 0,
caliber: "",
approvalNumber: "",
weight: 2,
nec: 0,
image: "",
link: "",
minimalQuantity: 1
},
quantity: 3,
price: 15
}
]
},
{ async ngOnInit() {
purchaseCondition: "Condition d'achat standard 2", await this.fetchPurchaseOrder();
supplier: { }
name: "Fournisseur 2",
email: "contact2@example.com",
phone: "0100000002",
address: "2 Rue de Lyon",
zipCode: "75002",
city: "Paris",
deliveryDelay: 4,
products: [
{
reference: "F2-P1",
name: "Produit 2A",
supplier: [],
duration: 0,
caliber: "",
approvalNumber: "",
weight: 1.5,
nec: 0,
image: "",
link: "",
minimalQuantity: 1
},
{
reference: "F2-P2",
name: "Produit 2B",
supplier: [],
duration: 0,
caliber: "",
approvalNumber: "",
weight: 2.5,
nec: 0,
image: "",
link: "",
minimalQuantity: 1
}
]
},
productOrder: [
{
product: {
reference: "F2-P1",
name: "Produit 2A",
supplier: [],
duration: 0,
caliber: "",
approvalNumber: "",
weight: 1.5,
nec: 0,
image: "",
link: "",
minimalQuantity: 1
},
quantity: 6,
price: 11
},
{
product: {
reference: "F2-P2",
name: "Produit 2B",
supplier: [],
duration: 0,
caliber: "",
approvalNumber: "",
weight: 2.5,
nec: 0,
image: "",
link: "",
minimalQuantity: 1
},
quantity: 4,
price: 16
}
]
},
];
delete() { async fetchPurchaseOrder() {
return this.purchaseOrdersLoading.set(true)
try {
const purchaseOrders = await firstValueFrom(this.purchaseOrdersService.getAllPurchaseOrderEndpoint())
this.purchaseOrders.set(purchaseOrders);
} catch (e) {
this.notificationService.error(
'Erreur',
'Erreur de communication avec l\'API'
)
}
this.purchaseOrdersLoading.set(false)
}
async delete(purchaseOrderId:number) {
try {
await firstValueFrom(this.purchaseOrdersService.deletePurchaseOrderEndpoint(purchaseOrderId))
this.notificationService.success(
'Success',
'Suppression effectuée'
)
} catch (e) {
this.notificationService.error(
'Erreur',
'Impossible de supprimer la ligne'
)
}
await this.fetchPurchaseOrder();
} }
export(){ export(){
return return
} }
transfert() { transfer() {
return return
} }
} }