64 lines
1.8 KiB
TypeScript
64 lines
1.8 KiB
TypeScript
import {Component, output} from '@angular/core';
|
|
import {ContactAddForm} from "../contact-add-form/contact-add-form";
|
|
import {NzMessageService} from "ng-zorro-antd/message";
|
|
import {NzButtonComponent} from "ng-zorro-antd/button";
|
|
import {NzModalComponent} from "ng-zorro-antd/modal";
|
|
|
|
@Component({
|
|
selector: 'app-create-contact-modal',
|
|
imports: [
|
|
ContactAddForm,
|
|
NzButtonComponent,
|
|
NzModalComponent
|
|
],
|
|
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 contacts</ng-template>
|
|
|
|
<ng-template #modalContent>
|
|
<app-contact-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: './create-contact-modal.css',
|
|
})
|
|
export class CreateContactModal {
|
|
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>()
|
|
}
|