Merge branch 'feature/ConnectingApiToQuotationPage' into develop
This commit is contained in:
@@ -1,4 +1,4 @@
|
||||
<form nz-form nzLayout="horizontal" [formGroup]="QuotationForm" (ngSubmit)="submitForm()">
|
||||
<form nz-form nzLayout="horizontal" [formGroup]="QuotationForm">
|
||||
<nz-form-item nz-flex>
|
||||
<nz-form-label nzSpan="9">
|
||||
Message du devis
|
||||
@@ -18,15 +18,5 @@
|
||||
<input nz-input placeholder="Conditions de vente" formControlName="quotationConditionsSale">
|
||||
</nz-form-control>
|
||||
</nz-form-item>
|
||||
|
||||
<nz-form-item nz-flex>
|
||||
<nz-form-label nzSpan="9" nzRequired>
|
||||
Fournisseur
|
||||
</nz-form-label>
|
||||
|
||||
<nz-form-control nzSpan="12">
|
||||
<input nz-input placeholder="Fournisseur" formControlName="quotationProvider">
|
||||
</nz-form-control>
|
||||
</nz-form-item>
|
||||
</form>
|
||||
|
||||
|
||||
@@ -26,15 +26,4 @@ export class QuotationForm {
|
||||
quotationMessage: new FormControl<string>(null),
|
||||
quotationConditionsSale: new FormControl<string>(null),
|
||||
})
|
||||
|
||||
submitForm() {
|
||||
// Pour annuler si le formulaire est invalide
|
||||
if (this.QuotationForm.invalid) return;
|
||||
|
||||
// Pour obtenir la valeur du formulaire
|
||||
console.log(this.QuotationForm.getRawValue())
|
||||
|
||||
// Pour vider le formulaire
|
||||
this.QuotationForm.reset()
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,22 +1,23 @@
|
||||
<nz-table #basicTable [nzData]="quotations" class="mr-7">
|
||||
<nz-table class="mr-7"
|
||||
[nzData]="quotations()"
|
||||
[nzLoading]="quotationsLoading()"
|
||||
[nzFrontPagination]="false"
|
||||
>
|
||||
<thead>
|
||||
<tr class="text-center">
|
||||
<th>Numéro de Devis</th>
|
||||
<th>Message</th>
|
||||
<th>Conditions de vente</th>
|
||||
<th>Fournisseur</th>
|
||||
<th>Produit</th>
|
||||
<th>Action</th>
|
||||
</tr>
|
||||
</thead >
|
||||
<tbody class="text-center">
|
||||
@for (data of basicTable.data; track data) {
|
||||
@for (quotation of quotations(); track quotation.id) {
|
||||
<tr>
|
||||
<td>{{data.quotationId}}</td>
|
||||
<td>{{data.quotationMessage}}</td>
|
||||
<td>{{data.quotationConditionsSale}}</td>
|
||||
<td>{{data.Supplier}}</td>
|
||||
|
||||
<td>{{quotation.id}}</td>
|
||||
<td>{{quotation.message}}</td>
|
||||
<td>{{quotation.conditionsSale}}</td>
|
||||
<td>
|
||||
<app-modal-button type="link" name="Voir les produits">
|
||||
<div style="max-height: 400px; overflow-y: auto;">
|
||||
@@ -31,25 +32,19 @@
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody class="text-center">
|
||||
|
||||
@for (product of quotation.getQuotationProductDto; track product.productId) {
|
||||
<tr>
|
||||
<td>{{data.quotationProductReference}}</td>
|
||||
<td>{{data.quotationProductName}}</td>
|
||||
<td>XX.XX€</td>
|
||||
<td>{{data.quotationProductQuantity}}</td>
|
||||
<td>{{ product.productReferences }}</td>
|
||||
<td>{{ product.productName }}</td>
|
||||
<td>Price ???</td>
|
||||
<td>Quantité ???</td>
|
||||
<td>
|
||||
<div style="justify-content: center; display: flex">
|
||||
<app-modal-nav nameIcon="edit" name="Modification du produit" class="cursor-pointer">
|
||||
<app-product-form></app-product-form>
|
||||
</app-modal-nav>
|
||||
<nz-divider nzType="vertical"></nz-divider>
|
||||
<div>
|
||||
<nz-icon nzType="delete" nzTheme="outline" class="cursor-pointer text-red-700"/>
|
||||
</div>
|
||||
<nz-icon nzType="delete" nzTheme="outline" class="cursor-pointer text-red-700"/>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
}
|
||||
</tbody>
|
||||
</nz-table>
|
||||
</div>
|
||||
@@ -57,12 +52,16 @@
|
||||
</td>
|
||||
<td>
|
||||
<div style="justify-content: center; display: flex">
|
||||
<div>
|
||||
<nz-icon nzType="plus-circle" nzTheme="outline" class="cursor-pointer text-green-700" />
|
||||
</div>
|
||||
<nz-divider nzType="vertical"></nz-divider>
|
||||
<app-modal-nav nameIcon="edit" name="Modification du devis" class="cursor-pointer">
|
||||
<app-quotation-form></app-quotation-form>
|
||||
</app-modal-nav>
|
||||
<nz-divider nzType="vertical"></nz-divider>
|
||||
<div>
|
||||
<nz-icon nzType="delete" nzTheme="outline" class="cursor-pointer text-red-700"/>
|
||||
<nz-icon nzType="delete" nzTheme="outline" class="cursor-pointer text-red-700" (click)="delete(quotation.id)"/>
|
||||
</div>
|
||||
<nz-divider nzType="vertical"></nz-divider>
|
||||
<div>
|
||||
|
||||
@@ -1,27 +1,13 @@
|
||||
import { Component } from '@angular/core';
|
||||
import {Component, inject, OnInit, signal} from '@angular/core';
|
||||
import {NzTableComponent} from "ng-zorro-antd/table";
|
||||
import {ModalButton} from "../modal-button/modal-button";
|
||||
import {ModalNav} from "../modal-nav/modal-nav";
|
||||
import {NzDividerComponent} from "ng-zorro-antd/divider";
|
||||
import {NzIconDirective} from "ng-zorro-antd/icon";
|
||||
import {QuotationForm} from "../quotation-form/quotation-form";
|
||||
import {ProductTable} from "../product-table/product-table";
|
||||
import {ProductForm} from "../product-form/product-form";
|
||||
|
||||
interface QuotationInfo {
|
||||
quotationId: number;
|
||||
quotationMessage?: string;
|
||||
quotationConditionsSale?: string;
|
||||
quotationProduct: [
|
||||
{ quotationProductReference: string; },
|
||||
{ quotationProductName: string; },
|
||||
{ quotationProductQuantity?: number; },
|
||||
],
|
||||
quotationProductReference: string;
|
||||
quotationProductName: string;
|
||||
quotationProductQuantity?: number;
|
||||
Supplier?: string;
|
||||
}
|
||||
import {GetQuotationDto, QuotationsService} from "../../services/api";
|
||||
import {NzNotificationService} from "ng-zorro-antd/notification";
|
||||
import {firstValueFrom} from "rxjs";
|
||||
|
||||
@Component({
|
||||
selector: 'app-quotation-table',
|
||||
@@ -32,56 +18,50 @@ interface QuotationInfo {
|
||||
NzIconDirective,
|
||||
NzTableComponent,
|
||||
QuotationForm,
|
||||
ProductForm
|
||||
],
|
||||
templateUrl: './quotation-table.html',
|
||||
styleUrl: './quotation-table.css',
|
||||
})
|
||||
|
||||
export class QuotationTable {
|
||||
quotations: QuotationInfo[] = [
|
||||
{
|
||||
quotationId: 101,
|
||||
quotationMessage: 'Livraison urgente demandée',
|
||||
quotationConditionsSale: 'Paiement à 30 jours',
|
||||
quotationProduct: [
|
||||
{ quotationProductReference: 'DLV-1000' },
|
||||
{ quotationProductName: 'Produit1'},
|
||||
{ quotationProductQuantity: 5 },
|
||||
],
|
||||
quotationProductReference: 'DLV-1000',
|
||||
quotationProductName: 'Produit1',
|
||||
quotationProductQuantity: 5,
|
||||
Supplier: 'Fireworkssupplier&Co'
|
||||
},
|
||||
{
|
||||
quotationId: 102,
|
||||
quotationMessage: 'Livraison standard',
|
||||
quotationConditionsSale: 'Payé d\'avance',
|
||||
quotationProduct: [
|
||||
{ quotationProductReference: 'DLV-1001' },
|
||||
{ quotationProductName: 'Produit2'},
|
||||
{ quotationProductQuantity: 6 },
|
||||
],
|
||||
quotationProductReference: 'DLV-1001',
|
||||
quotationProductName: 'Produit2',
|
||||
quotationProductQuantity: 6,
|
||||
Supplier: 'Fireworkssupplier&Co'
|
||||
},
|
||||
{
|
||||
quotationId: 103,
|
||||
quotationMessage: 'Livraison rapide',
|
||||
quotationConditionsSale: 'Paiement à 15 jours',
|
||||
quotationProduct: [
|
||||
{ quotationProductReference: 'DLV-1003' },
|
||||
{ quotationProductName: 'Produit3'},
|
||||
{ quotationProductQuantity: 7 },
|
||||
],
|
||||
quotationProductReference: 'DLV-1002',
|
||||
quotationProductName: 'Produit3',
|
||||
quotationProductQuantity: 7,
|
||||
Supplier: 'Fireworkssupplier&Co'
|
||||
export class QuotationTable implements OnInit {
|
||||
private quotationsService = inject(QuotationsService);
|
||||
private notificationService = inject(NzNotificationService)
|
||||
quotations = signal<GetQuotationDto[]>([]);
|
||||
quotationsLoading = signal<boolean>(false);
|
||||
|
||||
async ngOnInit() {
|
||||
await this.fetchQuotations();
|
||||
}
|
||||
|
||||
async fetchQuotations() {
|
||||
this.quotationsLoading.set(true)
|
||||
|
||||
try {
|
||||
const quotations = await firstValueFrom(this.quotationsService.getAllQuotationEndpoint())
|
||||
this.quotations.set(quotations);
|
||||
} catch (e) {
|
||||
this.notificationService.error(
|
||||
'Erreur',
|
||||
'Erreur de communication avec l\'API'
|
||||
)
|
||||
}
|
||||
];
|
||||
this.quotationsLoading.set(false)
|
||||
}
|
||||
|
||||
async delete(quotation:number) {
|
||||
try {
|
||||
await firstValueFrom(this.quotationsService.deleteQuotationEndpoint(quotation))
|
||||
this.notificationService.success(
|
||||
'Success',
|
||||
'Suppression effectuée'
|
||||
)
|
||||
} catch (e) {
|
||||
this.notificationService.error(
|
||||
'Erreur',
|
||||
'Impossible de supprimer la ligne'
|
||||
)
|
||||
}
|
||||
await this.fetchQuotations();
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -1,8 +1,4 @@
|
||||
<div class="flex mt-2">
|
||||
<app-modal-button type="primary" name="Créer un devis">
|
||||
<app-quotation-form></app-quotation-form>
|
||||
</app-modal-button>
|
||||
|
||||
<div class="ml-95 w-150">
|
||||
<app-search></app-search>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user