added edit quantity function
This commit is contained in:
@@ -32,7 +32,7 @@
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody class="text-center">
|
||||
@for (product of purchaseOrder.getPurchaseProductDto; track product.productId) {
|
||||
@for (product of purchaseOrder.products; track product.productId) {
|
||||
<tr>
|
||||
<td>{{product.productName}}</td>
|
||||
<td>{{product.productReferences}}</td>
|
||||
@@ -40,9 +40,9 @@
|
||||
<td>{{product.quantity}}</td>
|
||||
<td>
|
||||
<div style="justify-content: center; display: flex">
|
||||
<div>
|
||||
<nz-icon nzType="delete" nzTheme="outline" class="cursor-pointer text-red-700"/>
|
||||
</div>
|
||||
<nz-icon nzType="edit" nzTheme="outline" class="cursor-pointer" (click)="openEditQuantityModal(product)"></nz-icon>
|
||||
<nz-divider nzType="vertical"></nz-divider>
|
||||
<nz-icon nzType="delete" nzTheme="outline" class="cursor-pointer text-red-700" (click)="deleteProduct(product.productId, purchaseOrder.id)"/>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
@@ -54,7 +54,7 @@
|
||||
</td>
|
||||
<td>
|
||||
<div style="justify-content: center; display: flex">
|
||||
<nz-icon nzType="plus-circle" nzTheme="outline" (click)="delete(purchaseOrder.id)" class="cursor-pointer text-green-700"/>
|
||||
<nz-icon nzType="plus-circle" nzTheme="outline" class="cursor-pointer text-green-700"/>
|
||||
<nz-divider nzType="vertical"></nz-divider>
|
||||
<nz-icon nzType="edit" nzTheme="outline" class="cursor-pointer" (click)="openEditModal(purchaseOrder)"></nz-icon>
|
||||
<nz-divider nzType="vertical"></nz-divider>
|
||||
@@ -75,3 +75,9 @@
|
||||
<app-purchase-order-form #purchaseOrderForm [purchaseOrder]="selectedPurchaseOrder"></app-purchase-order-form>
|
||||
</app-modal-nav>
|
||||
</div>
|
||||
|
||||
<div class="hidden">
|
||||
<app-modal-nav #modalQuantity nameIcon="edit" [name]="'Modification de la quantité'" (ok)="onModalQuantityOk(selectedQuantity.productId, selectedQuantity.purchaseOrderId, quantityForm, modalQuantity)" (cancel)="onModalCancel(modalQuantity)">
|
||||
<app-quantity-form #quantityForm [quantity]="selectedQuantity"></app-quantity-form>
|
||||
</app-modal-nav>
|
||||
</div>
|
||||
@@ -5,12 +5,16 @@ import {NzIconDirective} from "ng-zorro-antd/icon";
|
||||
import {NzTableComponent} from "ng-zorro-antd/table";
|
||||
import {PurchaseOrderForm} from "../purchase-order-form/purchase-order-form";
|
||||
import {ModalButton} from "../modal-button/modal-button";
|
||||
import {GetPurchaseOrderDto, GetQuotationDto, PurchaseordersService} from "../../services/api";
|
||||
import {
|
||||
GetPurchaseOrderDto,
|
||||
GetPurchaseProductDto,
|
||||
PurchaseordersService,
|
||||
PurchaseproductsService
|
||||
} from "../../services/api";
|
||||
import {NzNotificationService} from "ng-zorro-antd/notification";
|
||||
import {firstValueFrom} from "rxjs";
|
||||
import {FileService} from "../../services/file.service";
|
||||
import {QuotationForm} from "../quotation-form/quotation-form";
|
||||
import {DelivererForm} from "../deliverer-form/deliverer-form";
|
||||
import {QuantityForm} from "../quantity-form/quantity-form";
|
||||
|
||||
@Component({
|
||||
selector: 'app-purchase-order-table',
|
||||
@@ -21,7 +25,7 @@ import {DelivererForm} from "../deliverer-form/deliverer-form";
|
||||
NzTableComponent,
|
||||
PurchaseOrderForm,
|
||||
ModalButton,
|
||||
DelivererForm,
|
||||
QuantityForm,
|
||||
],
|
||||
templateUrl: './purchase-order-table.html',
|
||||
styleUrl: './purchase-order-table.css',
|
||||
@@ -30,9 +34,11 @@ export class PurchaseOrderTable implements OnInit {
|
||||
private purchaseOrdersService = inject(PurchaseordersService);
|
||||
private notificationService = inject(NzNotificationService);
|
||||
private fileService = inject(FileService);
|
||||
private purchaseProductService = inject(PurchaseproductsService)
|
||||
purchaseOrders = signal<GetPurchaseOrderDto[]>([]);
|
||||
purchaseOrdersLoading = signal<boolean>(false);
|
||||
modal = viewChild.required<ModalNav>('modalNav');
|
||||
modalQuantity = viewChild.required<ModalNav>('modalQuantity');
|
||||
|
||||
async ngOnInit() {
|
||||
await this.fetchPurchaseOrder();
|
||||
@@ -111,6 +117,43 @@ export class PurchaseOrderTable implements OnInit {
|
||||
}
|
||||
}
|
||||
|
||||
async deleteProduct(productId: number, purchaseOrderId: number) {
|
||||
this.purchaseOrdersLoading.set(true)
|
||||
try {
|
||||
await firstValueFrom(this.purchaseProductService.deletePurchaseProductEndpoint(productId, purchaseOrderId))
|
||||
this.notificationService.success(
|
||||
'Success',
|
||||
'Suppression effectuée'
|
||||
)
|
||||
} catch (e) {
|
||||
this.notificationService.error(
|
||||
'Erreur',
|
||||
'Impossible de supprimer la ligne'
|
||||
)
|
||||
}
|
||||
this.purchaseOrdersLoading.set(false)
|
||||
await this.fetchPurchaseOrder();
|
||||
}
|
||||
|
||||
async editQuantity(productId: number, purchaseOrderId: number, updateQuantityComponent: QuantityForm) {
|
||||
if (updateQuantityComponent.quantityForm.invalid) {
|
||||
this.notificationService.error(
|
||||
'Erreur',
|
||||
'Erreur d\'écriture dans le formulaire'
|
||||
)
|
||||
return;
|
||||
}
|
||||
|
||||
try {
|
||||
const quantity = updateQuantityComponent.quantityForm.getRawValue();
|
||||
await firstValueFrom(this.purchaseProductService.patchPurchaseProductQuantityEndpoint(productId, purchaseOrderId, quantity))
|
||||
|
||||
this.notificationService.success('Success', 'Quantité modifiée')
|
||||
} catch (e) {
|
||||
this.notificationService.error('Erreur', 'Erreur lors de la modification')
|
||||
}
|
||||
}
|
||||
|
||||
selectedPurchaseOrder: GetPurchaseOrderDto | null = null;
|
||||
openEditModal(purchaseOrder: GetPurchaseOrderDto) {
|
||||
this.selectedPurchaseOrder = { ...purchaseOrder };
|
||||
@@ -130,5 +173,18 @@ export class PurchaseOrderTable implements OnInit {
|
||||
modal.isVisible = false;
|
||||
}
|
||||
|
||||
protected readonly PurchaseOrderForm = PurchaseOrderForm;
|
||||
selectedQuantity: GetPurchaseProductDto | null = null;
|
||||
openEditQuantityModal(quantity: GetPurchaseProductDto) {
|
||||
this.selectedQuantity = { ...quantity };
|
||||
this.modalQuantity().showModal();
|
||||
}
|
||||
|
||||
async onModalQuantityOk(productId: number, purchaseOrderId: number, updateQuantityComponent: QuantityForm, modal: ModalNav) {
|
||||
if (!this.selectedQuantity) return;
|
||||
|
||||
await this.editQuantity(productId, purchaseOrderId, updateQuantityComponent);
|
||||
updateQuantityComponent.quantityForm.reset();
|
||||
modal.isVisible = false;
|
||||
await this.fetchPurchaseOrder();
|
||||
}
|
||||
}
|
||||
|
||||
0
src/app/components/quantity-form/quantity-form.css
Normal file
0
src/app/components/quantity-form/quantity-form.css
Normal file
11
src/app/components/quantity-form/quantity-form.html
Normal file
11
src/app/components/quantity-form/quantity-form.html
Normal file
@@ -0,0 +1,11 @@
|
||||
<form nz-form nzLayout="horizontal" [formGroup]="quantityForm">
|
||||
<nz-form-item nz-flex>
|
||||
<nz-form-label nzSpan="9" nzRequired>
|
||||
Quantité
|
||||
</nz-form-label>
|
||||
|
||||
<nz-form-control nzSpan="12" nzErrorTip="Ce champ est requis">
|
||||
<input nz-input type="number" placeholder="0" formControlName="quantity">
|
||||
</nz-form-control>
|
||||
</nz-form-item>
|
||||
</form>
|
||||
40
src/app/components/quantity-form/quantity-form.ts
Normal file
40
src/app/components/quantity-form/quantity-form.ts
Normal file
@@ -0,0 +1,40 @@
|
||||
import {Component, effect, input} from '@angular/core';
|
||||
import {FormControl, FormGroup, FormsModule, ReactiveFormsModule, Validators} from "@angular/forms";
|
||||
import {NzColDirective} from "ng-zorro-antd/grid";
|
||||
import {NzFlexDirective} from "ng-zorro-antd/flex";
|
||||
import {NzFormControlComponent, NzFormDirective, NzFormItemComponent, NzFormLabelComponent} from "ng-zorro-antd/form";
|
||||
import {NzInputDirective} from "ng-zorro-antd/input";
|
||||
import {GetDelivererDto, GetPurchaseProductDto} from "../../services/api";
|
||||
|
||||
@Component({
|
||||
selector: 'app-quantity-form',
|
||||
imports: [
|
||||
FormsModule,
|
||||
NzColDirective,
|
||||
NzFlexDirective,
|
||||
NzFormControlComponent,
|
||||
NzFormDirective,
|
||||
NzFormItemComponent,
|
||||
NzFormLabelComponent,
|
||||
NzInputDirective,
|
||||
ReactiveFormsModule
|
||||
],
|
||||
templateUrl: './quantity-form.html',
|
||||
styleUrl: './quantity-form.css',
|
||||
})
|
||||
export class QuantityForm {
|
||||
quantityForm: FormGroup = new FormGroup({
|
||||
quantity: new FormControl<number>(null, [Validators.required])
|
||||
})
|
||||
|
||||
quantity= input<GetPurchaseProductDto>();
|
||||
constructor() {
|
||||
effect(() => {
|
||||
if (this.quantity()) {
|
||||
this.quantityForm.patchValue({
|
||||
quantity: this.quantity().quantity
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
@@ -23,6 +23,8 @@ model/connect-user-dto.ts
|
||||
model/create-deliverer-dto.ts
|
||||
model/create-delivery-note-dto.ts
|
||||
model/create-price-dto.ts
|
||||
model/create-purchase-order-dto.ts
|
||||
model/create-purchase-order-product-dto.ts
|
||||
model/create-purchase-product-dto.ts
|
||||
model/create-quotation-product-dto.ts
|
||||
model/create-setting-dto.ts
|
||||
|
||||
@@ -16,6 +16,8 @@ import { HttpClient, HttpHeaders, HttpParams,
|
||||
import { CustomHttpParameterCodec } from '../encoder';
|
||||
import { Observable } from 'rxjs';
|
||||
|
||||
// @ts-ignore
|
||||
import { CreatePurchaseOrderDto } from '../model/create-purchase-order-dto';
|
||||
// @ts-ignore
|
||||
import { GetPurchaseOrderDto } from '../model/get-purchase-order-dto';
|
||||
// @ts-ignore
|
||||
@@ -37,6 +39,70 @@ export class PurchaseordersService extends BaseService {
|
||||
super(basePath, configuration);
|
||||
}
|
||||
|
||||
/**
|
||||
* @endpoint post /API/purchaseOrders
|
||||
* @param createPurchaseOrderDto
|
||||
* @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 createPurchaseOrder(createPurchaseOrderDto: CreatePurchaseOrderDto, observe?: 'body', reportProgress?: boolean, options?: {httpHeaderAccept?: 'application/json', context?: HttpContext, transferCache?: boolean}): Observable<GetPurchaseOrderDto>;
|
||||
public createPurchaseOrder(createPurchaseOrderDto: CreatePurchaseOrderDto, observe?: 'response', reportProgress?: boolean, options?: {httpHeaderAccept?: 'application/json', context?: HttpContext, transferCache?: boolean}): Observable<HttpResponse<GetPurchaseOrderDto>>;
|
||||
public createPurchaseOrder(createPurchaseOrderDto: CreatePurchaseOrderDto, observe?: 'events', reportProgress?: boolean, options?: {httpHeaderAccept?: 'application/json', context?: HttpContext, transferCache?: boolean}): Observable<HttpEvent<GetPurchaseOrderDto>>;
|
||||
public createPurchaseOrder(createPurchaseOrderDto: CreatePurchaseOrderDto, observe: any = 'body', reportProgress: boolean = false, options?: {httpHeaderAccept?: 'application/json', context?: HttpContext, transferCache?: boolean}): Observable<any> {
|
||||
if (createPurchaseOrderDto === null || createPurchaseOrderDto === undefined) {
|
||||
throw new Error('Required parameter createPurchaseOrderDto was null or undefined when calling createPurchaseOrder.');
|
||||
}
|
||||
|
||||
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;
|
||||
|
||||
|
||||
// to determine the Content-Type header
|
||||
const consumes: string[] = [
|
||||
'application/json'
|
||||
];
|
||||
const httpContentTypeSelected: string | undefined = this.configuration.selectHeaderContentType(consumes);
|
||||
if (httpContentTypeSelected !== undefined) {
|
||||
localVarHeaders = localVarHeaders.set('Content-Type', httpContentTypeSelected);
|
||||
}
|
||||
|
||||
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/purchaseOrders`;
|
||||
const { basePath, withCredentials } = this.configuration;
|
||||
return this.httpClient.request<GetPurchaseOrderDto>('post', `${basePath}${localVarPath}`,
|
||||
{
|
||||
context: localVarHttpContext,
|
||||
body: createPurchaseOrderDto,
|
||||
responseType: <any>responseType_,
|
||||
...(withCredentials ? { withCredentials } : {}),
|
||||
headers: localVarHeaders,
|
||||
observe: observe,
|
||||
...(localVarTransferCache !== undefined ? { transferCache: localVarTransferCache } : {}),
|
||||
reportProgress: reportProgress
|
||||
}
|
||||
);
|
||||
}
|
||||
|
||||
/**
|
||||
* @endpoint delete /API/purchaseOrders/{id}
|
||||
* @param id
|
||||
|
||||
17
src/app/services/api/model/create-purchase-order-dto.ts
Normal file
17
src/app/services/api/model/create-purchase-order-dto.ts
Normal file
@@ -0,0 +1,17 @@
|
||||
/**
|
||||
* PyroFetes
|
||||
*
|
||||
*
|
||||
*
|
||||
* NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
|
||||
* https://openapi-generator.tech
|
||||
* Do not edit the class manually.
|
||||
*/
|
||||
import { CreatePurchaseOrderProductDto } from './create-purchase-order-product-dto';
|
||||
|
||||
|
||||
export interface CreatePurchaseOrderDto {
|
||||
purchaseConditions?: string | null;
|
||||
products?: Array<CreatePurchaseOrderProductDto> | null;
|
||||
}
|
||||
|
||||
@@ -0,0 +1,16 @@
|
||||
/**
|
||||
* PyroFetes
|
||||
*
|
||||
*
|
||||
*
|
||||
* NOTE: This class is auto generated by OpenAPI Generator (https://openapi-generator.tech).
|
||||
* https://openapi-generator.tech
|
||||
* Do not edit the class manually.
|
||||
*/
|
||||
|
||||
|
||||
export interface CreatePurchaseOrderProductDto {
|
||||
productId?: number;
|
||||
quantity?: number;
|
||||
}
|
||||
|
||||
@@ -13,6 +13,6 @@ import { GetPurchaseProductDto } from './get-purchase-product-dto';
|
||||
export interface GetPurchaseOrderDto {
|
||||
id?: number;
|
||||
purchaseConditions?: string | null;
|
||||
getPurchaseProductDto?: Array<GetPurchaseProductDto> | null;
|
||||
products?: Array<GetPurchaseProductDto> | null;
|
||||
}
|
||||
|
||||
|
||||
@@ -15,7 +15,7 @@ export interface GetPurchaseProductDto {
|
||||
productName?: string | null;
|
||||
productDuration?: number;
|
||||
productCaliber?: number;
|
||||
productApprovalNumber?: number;
|
||||
productApprovalNumber?: string | null;
|
||||
productWeight?: number;
|
||||
productNec?: number;
|
||||
productImage?: string | null;
|
||||
|
||||
@@ -2,6 +2,8 @@ export * from './connect-user-dto';
|
||||
export * from './create-deliverer-dto';
|
||||
export * from './create-delivery-note-dto';
|
||||
export * from './create-price-dto';
|
||||
export * from './create-purchase-order-dto';
|
||||
export * from './create-purchase-order-product-dto';
|
||||
export * from './create-purchase-product-dto';
|
||||
export * from './create-quotation-product-dto';
|
||||
export * from './create-setting-dto';
|
||||
|
||||
Reference in New Issue
Block a user