Files
pyrofetes/src/app/pages/customers/create-customers-modal/customers-card-form.ts
2025-12-11 17:54:55 +01:00

61 lines
2.0 KiB
TypeScript

import {Component, output} from '@angular/core';
import {NzMessageService} from "ng-zorro-antd/message";
import {NzButtonModule} from "ng-zorro-antd/button";
import {NzModalModule} from "ng-zorro-antd/modal";
import {ProvidersAddForm} from "../../providers/providers-add-form/providers-add-form";
import {CustomersAddForm} from "../customers-add-form/customers-add-form";
@Component({
selector: 'app-create-customers-modal',
imports: [NzButtonModule, NzModalModule, CustomersAddForm],
template: `
<button nz-button nzType="primary" (click)="showModal()">
<span style="font-weight: bold">+</span>
</button>
<nz-modal
[(nzVisible)]="isVisible"
[nzTitle]="modalTitle"
[nzContent]="modalContent"
[nzFooter]="modalFooter"
(nzOnCancel)="handleCancel()"
>
<ng-template #modalTitle style="text-align: center">Création de clients</ng-template>
<ng-template #modalContent>
<app-customers-add-form/>
</ng-template>
<ng-template #modalFooter>
<button nz-button nzType="default" (click)="handleCancel()">Annuler</button>
<button nz-button nzType="primary" (click)="handleOk()" [nzLoading]="isConfirmLoading">Confirmer</button>
</ng-template>
</nz-modal>
`,
styleUrl: './customers-card-form.css',
})
export class CustomersCardForm {
constructor(private message: NzMessageService) {}
isVisible = false;
isConfirmLoading = false;
showModal(): void {
this.isVisible = true;
}
handleOk(): void {
this.isConfirmLoading = true;
this.message.success('Client créé !');
setTimeout(() => {
this.isVisible = false;
this.isConfirmLoading = false;
}, 300);
this.triggerCreated.emit();
}
handleCancel(): void {
this.isVisible = false;
this.message.info('Création annulée');
}
triggerCreated = output<void>()
}