Added function to manage deliveries

This commit is contained in:
2026-05-26 11:52:31 +01:00
parent 7e69cbd952
commit c10a0a7c2f
13 changed files with 286 additions and 176 deletions
@@ -3,18 +3,55 @@
(input)="search.set($any($event.target).value)"/> (input)="search.set($any($event.target).value)"/>
<div class="livraisons-list"> <div class="livraisons-list">
@for (deliveryItem of filteredLivraisons(); track deliveryItem.id) { @for (deliveryItem of filteredDeliveries(); track deliveryItem.id) {
<div class="livraison-card"> <div class="livraison-card">
<div class="livraison-info"> <div class="livraison-info">
<h3>{{ deliveryItem.client }}</h3> <h3>{{ deliveryItem.delivererTransporter }}</h3>
<p class="mr-5">Date d'expédition: {{ deliveryItem.date }}</p> <p class="mr-5">Date d'expédition: {{ deliveryItem.expeditionDate }}</p>
<p>Produits : {{ deliveryItem.produits }}</p> <p>Quantité livrée : {{ deliveryItem.products.length }}</p>
</div> </div>
<button nz-button nzType="primary" [nzSize]="size" nzShape="round" (click)="validate(deliveryItem.id)"> <app-modal-nav #modal name="Valider la livraison" nameIcon="check"
<nz-icon nzType="check"/> (click)="check(deliveryItem.id)"
Valider (ok)="validate(deliveryItem.id, selectedWarehouseId!, modal)"
</button> (cancel)="reject(modal)">
<div class="mb-4 flex justify-center">
<nz-select
[(ngModel)]="selectedWarehouseId"
nzPlaceHolder="Sélectionner un entrepôt"
required
class="w-64">
@for (wareHouse of wareHouses(); track wareHouse.id) {
<nz-option [nzValue]="wareHouse.id" [nzLabel]="wareHouse.name"/>
}
</nz-select>
</div>
<div style="max-height: 400px; overflow-y: auto;">
<nz-table [nzData]="filteredDeliveries()"
[nzFrontPagination]="false">
<thead>
<tr class="text-center">
<th>Réference</th>
<th>Nom</th>
<th>Quantité</th>
</tr>
</thead>
<tbody class="text-center">
@for (product of deliveryItem.products; track product.productId) {
<tr>
<td>{{ product.productReference }}</td>
<td>{{ product.productName }}</td>
<td>{{ product.quantity }}</td>
</tr>
}
</tbody>
</nz-table>
</div>
</app-modal-nav>
</div> </div>
} }
</div> </div>
@@ -1,44 +1,120 @@
import {Component, computed, signal} from '@angular/core'; import {Component, computed, inject, OnInit, signal} from '@angular/core';
import {NzButtonComponent, NzButtonSize} from "ng-zorro-antd/button"; import {
import {NzIconDirective} from "ng-zorro-antd/icon"; DeliverynotesService,
GetDeliveryNoteDto, GetWareHouseDto,
WarehouseproductsService,
WarehousesService
} from "../../services/api";
import {firstValueFrom} from "rxjs";
import {NzNotificationService} from "ng-zorro-antd/notification";
import {NzTableComponent} from "ng-zorro-antd/table";
import {format} from "date-fns";
import {ModalNav} from "../modal-nav/modal-nav";
import {NzOptionComponent, NzSelectComponent} from "ng-zorro-antd/select";
import {FormsModule} from "@angular/forms";
@Component({ @Component({
selector: 'app-delivery-validator', selector: 'app-delivery-validator',
imports: [ imports: [
NzButtonComponent, NzTableComponent,
NzIconDirective ModalNav,
NzSelectComponent,
NzOptionComponent,
FormsModule
], ],
templateUrl: './delivery-validator.html', templateUrl: './delivery-validator.html',
styleUrl: './delivery-validator.css', styleUrl: './delivery-validator.css',
}) })
export class DeliveryValidator { export class DeliveryValidator implements OnInit {
size: NzButtonSize = 'large'; private deliveryNotesService = inject(DeliverynotesService);
search = signal(''); private notificationService = inject(NzNotificationService);
private warehousesService = inject(WarehousesService);
private warehouseProductsService = inject(WarehouseproductsService);
livraisons = signal([ search = signal<string>('');
{id: 1, client: 'Carrefour', date: '2025-02-03', produits: 12}, deliveryNotes = signal<GetDeliveryNoteDto[]>([]);
{id: 2, client: 'Intermarché', date: '2025-02-04', produits: 8}, wareHouses = signal<GetWareHouseDto[]>([]);
{id: 3, client: 'Auchan', date: '2025-02-05', produits: 23},
{id: 1, client: 'Carrefour', date: '2025-02-03', produits: 12},
{id: 2, client: 'Intermarché', date: '2025-02-04', produits: 8},
{id: 3, client: 'Auchan', date: '2025-02-05', produits: 23},
{id: 1, client: 'Carrefour', date: '2025-02-03', produits: 12},
{id: 2, client: 'Intermarché', date: '2025-02-04', produits: 8},
{id: 3, client: 'Auchan', date: '2025-02-05', produits: 23},
{id: 1, client: 'Carrefour', date: '2025-02-03', produits: 12},
{id: 2, client: 'Intermarché', date: '2025-02-04', produits: 8},
{id: 3, client: 'Auchan', date: '2025-02-05', produits: 23}
]);
filteredLivraisons = computed(() => { selectedWarehouseId: number | null = null;
async ngOnInit() {
await this.fetchDeliveryNotes();
try {
const wareHouses = await firstValueFrom(this.warehousesService.getAllWarehouseEndpoint());
this.wareHouses.set(wareHouses);
} catch {
this.notificationService.error(
'Erreur',
'Erreur de communication avec l\'API'
)
}
}
async fetchDeliveryNotes() {
try {
const deliveries = await firstValueFrom(this.deliveryNotesService.getAllDeliveryNotesNotArrivedEndpoint());
this.deliveryNotes.set(deliveries);
} catch {
this.notificationService.error(
'Erreur',
'Erreur de communication avec l\'API'
)
}
}
filteredDeliveries = computed(() => {
const query = this.search().toLowerCase(); const query = this.search().toLowerCase();
return this.livraisons().filter(l => return this.deliveryNotes().filter(l =>
l.client.toLowerCase().includes(query) || l.delivererTransporter.toLowerCase().includes(query) ||
l.date.includes(query) l.expeditionDate.includes(query)
); );
}); });
validate(id: number) { async check(id: number) {
return try {
const PatchRealDate = {
realDeliveryDate: format(new Date(), 'yyyy-MM-dd')
};
await firstValueFrom(this.deliveryNotesService.patchRealDeliveryDateEndpoint(id, PatchRealDate));
} catch (e) {
this.notificationService.error(
'Erreur',
'Erreur de communication avec l\'API',
)
}
}
async validate(id: number, warehouseId: number, modal: ModalNav) {
try {
const deliveryNote = this.deliveryNotes().find(x => x.id === id);
for (const product of deliveryNote.products) {
await firstValueFrom(this.warehouseProductsService.patchWareHouseProductQuantityEndpoint(
product.productId,
warehouseId,
{
quantity: product.quantity
}
));
}
this.notificationService.success(
'Succès',
'Les produits sont bien ajoutés au stock'
)
modal.isVisible = false;
await this.fetchDeliveryNotes();
} catch {
this.notificationService.error(
'Erreur',
'Vous devez choisir un entrepôt',
)
}
}
async reject(modal: ModalNav) {
modal.isVisible = false;
await this.fetchDeliveryNotes();
} }
} }
+1 -1
View File
@@ -13,7 +13,7 @@ import {NgStyle} from "@angular/common";
}) })
export class InfoCard { export class InfoCard {
icon = input.required<string>() icon = input.required<string>()
value = input.required<string>() value = input.required<number>()
description = input.required<string>() description = input.required<string>()
color = input.required<string>() color = input.required<string>()
} }
@@ -1,71 +0,0 @@
.documents-section {
display: flex;
flex-direction: column;
align-items: flex-start; /* contenu aligné à gauche */
gap: 16px; /* espace entre le titre et la liste */
margin: 40px 6%;
}
/* Titre */
.documents-section h1 {
font-size: 24px;
font-weight: 700;
color: #111827;
margin: 0; /* on gère lespace avec le gap */
letter-spacing: 0.5px;
text-transform: capitalize;
border-left: 4px solid #3b82f6;
padding-left: 12px;
}
/* Liste de documents scrollable */
.content {
width: 1000px;
display: flex;
flex-wrap: wrap;
gap: 16px;
padding: 30px 15px;
border-radius: 20px;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.06),
0 8px 20px rgba(0, 0, 0, 0.08),
0 16px 40px rgba(0, 0, 0, 0.06);
max-height: 390px;
overflow-y: auto;
}
/* Chaque carte */
.content > div {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
width: 120px;
height: 140px;
padding: 12px;
background: #ffffff;
border-radius: 14px;
cursor: pointer;
box-shadow: 0 6px 16px rgba(0, 0, 0, 0.08);
transition: all 0.2s ease;
text-align: center;
}
.content > div:hover {
transform: translateY(-3px);
box-shadow: 0 10px 22px rgba(0, 0, 0, 0.12);
}
.content img {
width: 48px;
height: 48px;
margin-bottom: 10px;
object-fit: contain;
}
.content p {
margin: 0;
font-size: 16px;
font-weight: 600;
color: #111827;
word-break: break-word;
}
@@ -1,11 +0,0 @@
<div class="documents-section">
<h1>Documents récents</h1>
<div class="content">
@for (doc of purchaseOrder(); track doc.id) {
<div>
<img src="https://cdn-icons-png.flaticon.com/512/337/337946.png" alt="pdf">
<p>{{ doc.name }}</p>
</div>
}
</div>
</div>
@@ -1,44 +0,0 @@
import {Component} from '@angular/core';
interface PurchaseOrder {
id: number;
name: string;
}
@Component({
selector: 'app-info-table',
templateUrl: './info-table.html',
styleUrls: ['./info-table.css'],
})
export class InfoTable {
docs: PurchaseOrder[] = [
{id: 1, name: 'Bon de commande'},
{id: 2, name: 'Bon de commande'},
{id: 3, name: 'Bon de commande'},
{id: 1, name: 'Bon de commande'},
{id: 2, name: 'Bon de commande'},
{id: 3, name: 'Bon de commande'},
{id: 1, name: 'Bon de commande'},
{id: 2, name: 'Bon de commande'},
{id: 3, name: 'Bon de commande'},
{id: 1, name: 'Bon de commande'},
{id: 2, name: 'Bon de commande'},
{id: 3, name: 'Bon de commande'},
{id: 1, name: 'Bon de commande'},
{id: 2, name: 'Bon de commande'},
{id: 3, name: 'Bon de commande'},
{id: 1, name: 'Bon de commande'},
{id: 2, name: 'Bon de commande'},
{id: 3, name: 'Bon de commande'},
{id: 1, name: 'Bon de commande'},
{id: 2, name: 'Bon de commande'},
{id: 3, name: 'Bon de commande'},
{id: 1, name: 'Bon de commande'},
{id: 2, name: 'Bon de commande'},
{id: 3, name: 'Bon de commande'},
];
purchaseOrder(): PurchaseOrder[] {
return this.docs;
}
}
+7 -6
View File
@@ -1,13 +1,14 @@
<div class="flex gap-17 ml-20"> <div class="flex gap-17 ml-20">
<app-info-card color="#f59e0b" icon="inbox" value="15" <app-info-card color="#f59e0b" icon="inbox" [value]="productsUnderLimitCount()"
description="Produits sous le seuil minimal."></app-info-card> description="Produits sous le seuil minimal."></app-info-card>
<app-info-card color="#3b82f6" icon="team" value="56" description="Partenaires actifs."></app-info-card> <app-info-card color="#3b82f6" icon="team" [value]="deliversCount()+suppliersCount()"
<app-info-card color="#10b981" icon="truck" value="8" description="Livreurs partenaires."></app-info-card> description="Partenaires actifs."></app-info-card>
<app-info-card color="#ef4444" icon="shop" value="48" <app-info-card color="#10b981" icon="truck" [value]=deliversCount()
description="Fournisseurs travaillant avec nous."></app-info-card> description="Livreurs partenaires."></app-info-card>
<app-info-card color="#ef4444" icon="shop" [value]="suppliersCount()"
description="Fournisseurs partenaires."></app-info-card>
</div> </div>
<div class="mt-10 flex gap-30"> <div class="mt-10 flex gap-30">
<app-delivery-validator></app-delivery-validator> <app-delivery-validator></app-delivery-validator>
<app-info-table></app-info-table>
</div> </div>
+53 -3
View File
@@ -1,19 +1,69 @@
import {Component} from '@angular/core'; import {Component, inject, signal} from '@angular/core';
import {InfoCard} from "../../components/info-card/info-card"; import {InfoCard} from "../../components/info-card/info-card";
import {DeliveryValidator} from "../../components/delivery-validator/delivery-validator"; import {DeliveryValidator} from "../../components/delivery-validator/delivery-validator";
import {InfoTable} from "../../components/info-table/info-table"; import {NzNotificationService} from "ng-zorro-antd/notification";
import {DeliverersService, ProductsService, SuppliersService} from "../../services/api";
import {firstValueFrom} from "rxjs";
@Component({ @Component({
selector: 'app-welcome', selector: 'app-welcome',
imports: [ imports: [
InfoCard, InfoCard,
DeliveryValidator, DeliveryValidator,
InfoTable,
], ],
templateUrl: './welcome.html', templateUrl: './welcome.html',
styleUrl: './welcome.css' styleUrl: './welcome.css'
}) })
export class Welcome { export class Welcome {
private productsService = inject(ProductsService);
private deliverersService = inject(DeliverersService);
private suppliersService = inject(SuppliersService);
private notificationsService = inject(NzNotificationService);
deliversCount = signal<number>(0);
suppliersCount = signal<number>(0);
productsUnderLimitCount = signal<number>(0);
async getDeliverers() {
try {
const deliverers = await firstValueFrom(this.deliverersService.getAllDelivererEndpoint());
this.deliversCount.set(deliverers.length);
} catch (e) {
this.notificationsService.error(
'Error',
'Error while getting deliverers.',
)
}
}
async getSuppliers() {
try {
const suppliers = await firstValueFrom(this.suppliersService.getAllSuppliersEndpoint());
this.suppliersCount.set(suppliers.length);
} catch (e) {
this.notificationsService.error(
'Error',
'Error while getting suppliers.',
)
}
}
async getProductsUnderLimit() {
try {
const products = await firstValueFrom(this.productsService.getAllProductsUnderLimitEndpoint());
this.productsUnderLimitCount.set(products.length);
} catch (e) {
this.notificationsService.error(
'Error',
'Error while getting products.',
)
}
}
async ngOnInit() {
await this.getDeliverers();
await this.getSuppliers();
await this.getProductsUnderLimit();
}
} }
@@ -14,6 +14,7 @@ api/settings.service.ts
api/suppliers.service.ts api/suppliers.service.ts
api/users.service.ts api/users.service.ts
api/warehouseproducts.service.ts api/warehouseproducts.service.ts
api/warehouses.service.ts
configuration.ts configuration.ts
encoder.ts encoder.ts
git_push.sh git_push.sh
@@ -44,6 +45,7 @@ model/get-supplier-dto.ts
model/get-token-dto.ts model/get-token-dto.ts
model/get-total-quantity-dto.ts model/get-total-quantity-dto.ts
model/get-user-dto.ts model/get-user-dto.ts
model/get-ware-house-dto.ts
model/get-ware-house-product-dto.ts model/get-ware-house-product-dto.ts
model/models.ts model/models.ts
model/patch-delivery-note-real-delivery-date-dto.ts model/patch-delivery-note-real-delivery-date-dto.ts
+4 -1
View File
@@ -28,4 +28,7 @@ import {UsersService} from './users.service';
export * from './warehouseproducts.service'; export * from './warehouseproducts.service';
import {WarehouseproductsService} from './warehouseproducts.service'; import {WarehouseproductsService} from './warehouseproducts.service';
export const APIS = [DeliverersService, DeliverynotesService, PricesService, ProductsService, PurchaseordersService, QuotationsService, SettingsService, SuppliersService, UsersService, WarehouseproductsService]; export * from './warehouses.service';
import {WarehousesService} from './warehouses.service';
export const APIS = [DeliverersService, DeliverynotesService, PricesService, ProductsService, PurchaseordersService, QuotationsService, SettingsService, SuppliersService, UsersService, WarehouseproductsService, WarehousesService];
@@ -261,6 +261,72 @@ export class DeliverynotesService extends BaseService {
); );
} }
/**
* @endpoint get /API/deliveryNotes/validation
* @param observe set whether or not to return the data Observable as the body, response or events. defaults to returning the body.
* @param reportProgress flag to report request and response progress.
*/
public getAllDeliveryNotesNotArrivedEndpoint(observe?: 'body', reportProgress?: boolean, options?: {
httpHeaderAccept?: 'application/json',
context?: HttpContext,
transferCache?: boolean
}): Observable<Array<GetDeliveryNoteDto>>;
public getAllDeliveryNotesNotArrivedEndpoint(observe?: 'response', reportProgress?: boolean, options?: {
httpHeaderAccept?: 'application/json',
context?: HttpContext,
transferCache?: boolean
}): Observable<HttpResponse<Array<GetDeliveryNoteDto>>>;
public getAllDeliveryNotesNotArrivedEndpoint(observe?: 'events', reportProgress?: boolean, options?: {
httpHeaderAccept?: 'application/json',
context?: HttpContext,
transferCache?: boolean
}): Observable<HttpEvent<Array<GetDeliveryNoteDto>>>;
public getAllDeliveryNotesNotArrivedEndpoint(observe: any = 'body', reportProgress: boolean = false, options?: {
httpHeaderAccept?: 'application/json',
context?: HttpContext,
transferCache?: boolean
}): Observable<any> {
let localVarHeaders = this.defaultHeaders;
const localVarHttpHeaderAcceptSelected: string | undefined = options?.httpHeaderAccept ?? this.configuration.selectHeaderAccept([
'application/json'
]);
if (localVarHttpHeaderAcceptSelected !== undefined) {
localVarHeaders = localVarHeaders.set('Accept', localVarHttpHeaderAcceptSelected);
}
const localVarHttpContext: HttpContext = options?.context ?? new HttpContext();
const localVarTransferCache: boolean = options?.transferCache ?? true;
let responseType_: 'text' | 'json' | 'blob' = 'json';
if (localVarHttpHeaderAcceptSelected) {
if (localVarHttpHeaderAcceptSelected.startsWith('text')) {
responseType_ = 'text';
} else if (this.configuration.isJsonMime(localVarHttpHeaderAcceptSelected)) {
responseType_ = 'json';
} else {
responseType_ = 'blob';
}
}
let localVarPath = `/API/deliveryNotes/validation`;
const {basePath, withCredentials} = this.configuration;
return this.httpClient.request<Array<GetDeliveryNoteDto>>('get', `${basePath}${localVarPath}`,
{
context: localVarHttpContext,
responseType: <any>responseType_,
...(withCredentials ? {withCredentials} : {}),
headers: localVarHeaders,
observe: observe,
...(localVarTransferCache !== undefined ? {transferCache: localVarTransferCache} : {}),
reportProgress: reportProgress
}
);
}
/** /**
* @endpoint get /API/deliveryNotes/{deliveryNoteId} * @endpoint get /API/deliveryNotes/{deliveryNoteId}
* @param deliveryNoteId * @param deliveryNoteId
+1
View File
@@ -24,6 +24,7 @@ export * from './get-supplier-dto';
export * from './get-token-dto'; export * from './get-token-dto';
export * from './get-total-quantity-dto'; export * from './get-total-quantity-dto';
export * from './get-user-dto'; export * from './get-user-dto';
export * from './get-ware-house-dto';
export * from './get-ware-house-product-dto'; export * from './get-ware-house-product-dto';
export * from './patch-delivery-note-real-delivery-date-dto'; export * from './patch-delivery-note-real-delivery-date-dto';
export * from './patch-price-selling-price-dto'; export * from './patch-price-selling-price-dto';