last commit

src/app/pages/customers/create-customers-modal/customers-card-form.ts

@@ -0,0 +1,61 @@
+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>()
+}