diff --git a/src/app/app.routes.ts b/src/app/app.routes.ts
index 9d068cd..1556a7d 100644
--- a/src/app/app.routes.ts
+++ b/src/app/app.routes.ts
@@ -7,8 +7,12 @@ export const routes: Routes = [
redirectTo: '/customers'
},
{
- path:'customers',
- loadComponent: () => import('./pages/customers/customers').then(x => x.Customers)
+ path:'contact',
+ loadComponent: () => import('./pages/contact/contact').then(x => x.Contact)
+ },
+ {
+ path:'customers',
+ loadComponent: () => import('./pages/customers/customers').then(x => x.Customers)
},
{
diff --git a/src/app/app.ts b/src/app/app.ts
index 16a99a4..e04f8f4 100644
--- a/src/app/app.ts
+++ b/src/app/app.ts
@@ -2,10 +2,11 @@ import { Component } from '@angular/core';
import {RouterLink, RouterLinkActive, RouterOutlet} from '@angular/router';
import { NzLayoutModule } from 'ng-zorro-antd/layout';
import { NzMenuModule } from 'ng-zorro-antd/menu';
+import {NzIconDirective} from "ng-zorro-antd/icon";
@Component({
selector: 'app-root',
- imports: [RouterOutlet, NzLayoutModule, NzMenuModule, RouterLinkActive, RouterLink],
+ imports: [RouterOutlet, NzLayoutModule, NzMenuModule, RouterLinkActive, RouterLink, NzIconDirective],
templateUrl: './app.html',
styleUrl: './app.css'
})
diff --git a/src/app/pages/contact/contact-add-form/contact-add-form.css b/src/app/pages/contact/contact-add-form/contact-add-form.css
new file mode 100644
index 0000000..e69de29
diff --git a/src/app/pages/contact/contact-add-form/contact-add-form.html b/src/app/pages/contact/contact-add-form/contact-add-form.html
new file mode 100644
index 0000000..9cf3fbf
--- /dev/null
+++ b/src/app/pages/contact/contact-add-form/contact-add-form.html
@@ -0,0 +1,61 @@
+
\ No newline at end of file
diff --git a/src/app/pages/contact/contact-add-form/contact-add-form.ts b/src/app/pages/contact/contact-add-form/contact-add-form.ts
new file mode 100644
index 0000000..604001f
--- /dev/null
+++ b/src/app/pages/contact/contact-add-form/contact-add-form.ts
@@ -0,0 +1,89 @@
+import {Component, inject, signal} from '@angular/core';
+import {NzFormControlComponent, NzFormDirective, NzFormItemComponent, NzFormLabelComponent} from "ng-zorro-antd/form";
+import {NzInputDirective} from "ng-zorro-antd/input";
+import {FormControl, FormGroup, ReactiveFormsModule, Validators} from "@angular/forms";
+import {NzColDirective} from "ng-zorro-antd/grid";
+import {NzFlexDirective} from "ng-zorro-antd/flex";
+import {ContactsService, CreateContactDto} from "../../../services/api";
+import {NzNotificationService} from "ng-zorro-antd/notification";
+import {firstValueFrom} from "rxjs";
+import {NzButtonComponent} from "ng-zorro-antd/button";
+
+@Component({
+ selector: 'app-contact-add-form',
+ imports: [
+ NzFormLabelComponent,
+ NzFormItemComponent,
+ NzFormControlComponent,
+ NzInputDirective,
+ ReactiveFormsModule,
+ NzColDirective,
+ NzFormDirective,
+ NzFlexDirective,
+ NzButtonComponent
+ ],
+ templateUrl: './contact-add-form.html',
+ styleUrl: './contact-add-form.css',
+})
+export class ContactAddForm {
+ private contactsService = inject(ContactsService);
+ private notificationService = inject(NzNotificationService);
+
+ contactForm = new FormGroup({
+ lastName: new FormControl
(null, [Validators.required]),
+ firstName: new FormControl(null, [Validators.required]),
+ phoneNumber: new FormControl(null, [Validators.required]),
+ email: new FormControl(null, [Validators.required]),
+ address: new FormControl(null, [Validators.required]),
+ city: new FormControl(null, [Validators.required]),
+ role: new FormControl(null, [Validators.required]),
+ customerId: new FormControl(null),
+ })
+
+ contactPost = signal(this.contactForm.value);
+ contactsLoading = signal(false);
+
+ async submitForm() {
+ if (this.contactForm.invalid) return;
+
+ console.log(this.contactForm.getRawValue())
+ this.contactPost.set(this.contactForm.getRawValue())
+
+ await this.createContact(
+ this.contactPost().lastName,
+ this.contactPost().firstName,
+ this.contactPost().phoneNumber,
+ this.contactPost().email,
+ this.contactPost().address,
+ this.contactPost().city,
+ this.contactPost().role,
+ this.contactPost().customerId
+ )
+ this.contactForm.reset()
+ }
+
+ async createContact(lastName: string, firstName: string, phoneNumber: string, email: string, address: string, city: string, role: string, customerId: number) {
+ this.contactsLoading.set(true);
+
+ const contactValue: CreateContactDto = {
+ lastName: lastName,
+ firstName: firstName,
+ phoneNumber: phoneNumber,
+ email: email,
+ address: address,
+ city: city,
+ role: role,
+ customerId: customerId
+ }
+
+ try {
+ const contact = await firstValueFrom(this.contactsService.createContactEndpoint(contactValue));
+ this.contactPost.set(contact);
+ console.log(contact);
+ } catch (e) {
+ this.notificationService.error('Erreur', 'Erreur de communication avec l\'API');
+ }
+
+ this.contactsLoading.set(false);
+ }
+}
diff --git a/src/app/pages/contact/contact-card/contact-card.css b/src/app/pages/contact/contact-card/contact-card.css
new file mode 100644
index 0000000..e69de29
diff --git a/src/app/pages/contact/contact-card/contact-card.html b/src/app/pages/contact/contact-card/contact-card.html
new file mode 100644
index 0000000..331e35b
--- /dev/null
+++ b/src/app/pages/contact/contact-card/contact-card.html
@@ -0,0 +1,70 @@
+@if (edit() == false) {
+
+ Contact n°{{ contact().id }}
+ Nom : {{ contact().lastName + " " + contact().firstName }}
+ Rôle : {{ contact().role }}
+ Numéro de téléphone : {{ contact().phoneNumber }}
+ Email : {{ contact().email }}
+ Adresse : {{ contact().address + ", " + contact().city }}
+
+
+
+
+
+
+
+
+} @else {
+
+
+
+
+
+
+
+
+
+}
\ No newline at end of file
diff --git a/src/app/pages/contact/contact-card/contact-card.ts b/src/app/pages/contact/contact-card/contact-card.ts
new file mode 100644
index 0000000..c8ef92d
--- /dev/null
+++ b/src/app/pages/contact/contact-card/contact-card.ts
@@ -0,0 +1,108 @@
+import {Component, inject, input, output, signal} from '@angular/core';
+import {
+ ContactsService,
+ CustomersService, GetContactDto,
+ GetCustomerDto,
+ UpdateContactDto,
+ UpdateCustomerDto
+} from "../../../services/api";
+import {NzNotificationService} from "ng-zorro-antd/notification";
+import {FormControl, FormGroup, ReactiveFormsModule, Validators} from "@angular/forms";
+import {firstValueFrom} from "rxjs";
+import {NzCardComponent} from "ng-zorro-antd/card";
+import {NzColDirective, NzRowDirective} from "ng-zorro-antd/grid";
+import {NzFormControlComponent, NzFormDirective, NzFormItemComponent, NzFormLabelComponent} from "ng-zorro-antd/form";
+import {NzIconDirective} from "ng-zorro-antd/icon";
+import {NzInputDirective} from "ng-zorro-antd/input";
+
+@Component({
+ selector: 'app-contact-card',
+ imports: [NzCardComponent, NzColDirective, NzFormControlComponent, NzFormDirective, NzFormItemComponent, NzFormLabelComponent, NzIconDirective, NzInputDirective, NzRowDirective, ReactiveFormsModule],
+ templateUrl: './contact-card.html',
+ styleUrl: './contact-card.css',
+})
+export class ContactCard {
+ private contactsService = inject(ContactsService);
+ private notificationService = inject(NzNotificationService)
+
+ contactEdit = signal(null);
+ contactsLoading = signal(false);
+
+ contactForm = new FormGroup({
+ id: new FormControl(null, [Validators.required]),
+ lastname: new FormControl(null, [Validators.required]),
+ firstname: new FormControl(null, [Validators.required]),
+ phone: new FormControl(null, [Validators.required]),
+ email: new FormControl(null, [Validators.required]),
+ address: new FormControl(null, [Validators.required]),
+ city: new FormControl(null, [Validators.required]),
+ role: new FormControl(null, [Validators.required])
+ })
+
+ async submitForm() {
+ this.contactsLoading.set(true);
+
+ const contactValue = {
+ lastname: this.contactForm.value.lastname,
+ firstname: this.contactForm.value.firstname,
+ phone: this.contactForm.value.phone,
+ email: this.contactForm.value.email,
+ address: this.contactForm.value.address,
+ city: this.contactForm.value.city,
+ role: this.contactForm.value.role,
+ }
+
+ try {
+ const contact = await firstValueFrom(this.contactsService.updateContactEndpoint(this.contact().id,contactValue));
+ this.contactEdit.set(contact);
+ console.log(contact);
+ this.contactForm.reset();
+ this.edit.set(false);
+
+ this.triggerEdited.emit();
+
+ } catch (e)
+ {
+ this.notificationService.error('Erreur', ' (ou Erreur de communication avec l\'API)');
+ }
+
+ this.contactsLoading.set(false);
+
+ }
+
+
+ contact = input(null);
+
+ edit = signal(false)
+
+ triggerEdited = output();
+
+ protected Edit() {
+ this.edit.set(true)
+ }
+
+ protected Back() {
+ this.edit.set(false)
+ this.contactForm.reset();
+ }
+
+ async Delete() {
+ this.contactsLoading.set(true);
+
+ try {
+ const contact = await firstValueFrom(this.contactsService.deleteContactEndpoint(this.contact().id));
+ this.contactEdit.set(contact);
+
+ this.contactForm.reset();
+ this.triggerEdited.emit();
+
+ } catch (e)
+ {
+ this.notificationService.error('Erreur de recherche', "Le contact n\'existe pas !");
+
+ this.notificationService.error('Erreur', ' (ou Erreur de communication avec l\'API)');
+ }
+
+ this.contactsLoading.set(false);
+ }
+}
diff --git a/src/app/pages/contact/contact.css b/src/app/pages/contact/contact.css
new file mode 100644
index 0000000..e69de29
diff --git a/src/app/pages/contact/contact.html b/src/app/pages/contact/contact.html
new file mode 100644
index 0000000..70b892c
--- /dev/null
+++ b/src/app/pages/contact/contact.html
@@ -0,0 +1,11 @@
+
+
+
+
+ @for (contact of contacts(); track contact.id)
+ {
+
+
+ }
+
+
create-contact-modal works!
diff --git a/src/app/pages/contact/create-contact-modal/create-contact-modal.ts b/src/app/pages/contact/create-contact-modal/create-contact-modal.ts
new file mode 100644
index 0000000..e88f0df
--- /dev/null
+++ b/src/app/pages/contact/create-contact-modal/create-contact-modal.ts
@@ -0,0 +1,63 @@
+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: `
+
+
+ Création de contacts
+
+
+
+
+
+
+
+
+
+
+ `,
+ 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()
+}
diff --git a/src/app/pages/customers/create-customers-modal/customers-card-form.css b/src/app/pages/customers/create-customers-modal/customers-card-form.css
new file mode 100644
index 0000000..e69de29
diff --git a/src/app/pages/customers/create-customers-modal/customers-card-form.html b/src/app/pages/customers/create-customers-modal/customers-card-form.html
new file mode 100644
index 0000000..4b55f97
--- /dev/null
+++ b/src/app/pages/customers/create-customers-modal/customers-card-form.html
@@ -0,0 +1 @@
+customers-card-form works!
diff --git a/src/app/pages/customers/create-customers-modal/customers-card-form.ts b/src/app/pages/customers/create-customers-modal/customers-card-form.ts
new file mode 100644
index 0000000..a20b2fc
--- /dev/null
+++ b/src/app/pages/customers/create-customers-modal/customers-card-form.ts
@@ -0,0 +1,59 @@
+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 {CustomersAddForm} from "../customers-add-form/customers-add-form";
+
+@Component({
+ selector: 'app-create-customers-modal',
+ imports: [NzButtonModule, NzModalModule, CustomersAddForm],
+ template: `
+
+
+ Création de clients
+
+
+
+
+
+
+
+
+
+
+ `,
+ 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()
+}
\ No newline at end of file
diff --git a/src/app/pages/customers/customers-add-form/customers-add-form.css b/src/app/pages/customers/customers-add-form/customers-add-form.css
new file mode 100644
index 0000000..eb7e51c
--- /dev/null
+++ b/src/app/pages/customers/customers-add-form/customers-add-form.css
@@ -0,0 +1,19 @@
+nz-form-container {
+ background-color: #0000;
+}
+
+nz-form-item {
+ background-color: #1c1c1c;
+
+
+}
+
+nz-form-label {
+ font-style: italic;
+ color: #fff;
+}
+
+
+nz-modal-footer {
+
+}
diff --git a/src/app/pages/customers/customers-add-form/customers-add-form.html b/src/app/pages/customers/customers-add-form/customers-add-form.html
new file mode 100644
index 0000000..9d888b2
--- /dev/null
+++ b/src/app/pages/customers/customers-add-form/customers-add-form.html
@@ -0,0 +1,23 @@
+
diff --git a/src/app/pages/customers/customers-add-form/customers-add-form.ts b/src/app/pages/customers/customers-add-form/customers-add-form.ts
new file mode 100644
index 0000000..2f61b14
--- /dev/null
+++ b/src/app/pages/customers/customers-add-form/customers-add-form.ts
@@ -0,0 +1,86 @@
+import {Component, inject, signal} from '@angular/core';
+import {FormControl, FormGroup, FormsModule, ReactiveFormsModule, Validators} from "@angular/forms";
+import {NzColDirective, NzRowDirective} from "ng-zorro-antd/grid";
+import {NzFormModule} from "ng-zorro-antd/form";
+import {NzInputDirective} from "ng-zorro-antd/input";
+import {CreateCustomerDto, CustomersService, CustomertypesService, GetCustomerTypeDto} from "../../../services/api";
+import {NzNotificationService} from "ng-zorro-antd/notification";
+import {firstValueFrom} from "rxjs";
+import {NzFlexDirective} from "ng-zorro-antd/flex";
+import {NzButtonComponent} from "ng-zorro-antd/button";
+import {NzOptionComponent, NzSelectComponent} from "ng-zorro-antd/select";
+
+@Component({
+ selector: 'app-customers-add-form',
+ imports: [ReactiveFormsModule, NzFormModule, NzInputDirective, NzFlexDirective, NzButtonComponent, NzColDirective, NzFlexDirective, NzButtonComponent, NzSelectComponent, NzOptionComponent],
+ templateUrl: './customers-add-form.html',
+ styleUrl: './customers-add-form.css',
+})
+export class CustomersAddForm {
+
+ private customersService = inject(CustomersService);
+ private customertypesService = inject(CustomertypesService);
+ private notificationService = inject(NzNotificationService)
+
+
+ customerForm = new FormGroup({
+ note: new FormControl(null, [Validators.required]),
+ customerTypeId: new FormControl(null, [Validators.required]),
+ })
+
+ customerPost = signal(this.customerForm.value);
+ customersLoading = signal(false);
+
+ async submitForm() {
+ // Pour annuler si le formulaire est invalide
+ if (this.customerForm.invalid) return;
+
+ // Pour obtenir la valeur du formulaire
+ console.log(this.customerForm.getRawValue())
+ this.customerPost.set(this.customerForm.getRawValue())
+
+ await this.createCustomers(this.customerPost().note, this.customerPost().customerTypeId)
+ // Pour vider le formulaire
+ this.customerForm.reset()
+ }
+
+ async createCustomers(note: string, customerTypeId: number) {
+ this.customersLoading.set(true);
+
+ const customerValue = {
+ note: note,
+ customerTypeId: customerTypeId
+ }
+
+ try {
+ const customer = await firstValueFrom(this.customersService.createCustomerEndpoint(customerValue));
+ this.customerPost.set(customer);
+ console.log(customer);
+ } catch (e)
+ {
+ this.notificationService.error('Erreur de recherche', "L\'auteur n\'existe pas !");
+
+ this.notificationService.error('Erreur', ' (ou Erreur de communication avec l\'API)');
+ }
+
+ this.customersLoading.set(false);
+ }
+
+ customerTypes = signal([])
+
+ async ngOnInit() {
+ await this.fetchCustomerTypes()
+ }
+
+ async fetchCustomerTypes() {
+ this.customersLoading.set(true);
+ try {
+ const customerType = await firstValueFrom(this.customertypesService.getAllCustomerTypeEndpoint())
+ this.customerTypes.set(customerType)
+ } catch (e) {
+ this.notificationService.error('Erreur', 'Erreur de communication avec l\'API');
+ }
+
+ this.customersLoading.set(false);
+ }
+}
diff --git a/src/app/pages/customers/customers-card/get-all-customers-card.css b/src/app/pages/customers/customers-card/get-all-customers-card.css
new file mode 100644
index 0000000..e69de29
diff --git a/src/app/pages/customers/customers-card/get-all-customers-card.html b/src/app/pages/customers/customers-card/get-all-customers-card.html
new file mode 100644
index 0000000..944568d
--- /dev/null
+++ b/src/app/pages/customers/customers-card/get-all-customers-card.html
@@ -0,0 +1,30 @@
+@if (edit() == false) {
+
+ Client n°{{ customer().id }}
+ Note : {{ customer().note }}
+ Type de client : {{ customer().customerType}}
+
+
+
+
+
+
+
+} @else {
+
+
+
+
+
+
+
+
+
+}
diff --git a/src/app/pages/customers/customers-card/get-all-customers-card.ts b/src/app/pages/customers/customers-card/get-all-customers-card.ts
new file mode 100644
index 0000000..c06483f
--- /dev/null
+++ b/src/app/pages/customers/customers-card/get-all-customers-card.ts
@@ -0,0 +1,89 @@
+import {Component, inject, input, output, signal} from '@angular/core';
+import {NzIconDirective} from "ng-zorro-antd/icon";
+import {FormControl, FormGroup, ReactiveFormsModule, Validators} from "@angular/forms";
+import {NzFormModule} from "ng-zorro-antd/form";
+import {NzCardComponent} from "ng-zorro-antd/card";
+import {NzInputDirective} from "ng-zorro-antd/input";
+import {CustomersService, GetCustomerDto, UpdateCustomerDto} from "../../../services/api";
+import {NzNotificationService} from "ng-zorro-antd/notification";
+import {firstValueFrom} from "rxjs";
+
+@Component({
+ selector: 'app-customers-card',
+ imports: [ReactiveFormsModule, NzFormModule, NzCardComponent, NzIconDirective, NzInputDirective],
+ templateUrl: './get-all-customers-card.html',
+ styleUrl: './get-all-customers-card.css',
+})
+export class GetAllCustomersCard {
+ private customersService = inject(CustomersService);
+ private notificationService = inject(NzNotificationService)
+
+ customerEdit = signal(null);
+ customersLoading = signal(false);
+
+ customerForm = new FormGroup({
+ id: new FormControl(null, [Validators.required]),
+ note: new FormControl(null, [Validators.required]),
+ })
+
+ async submitForm() {
+ this.customersLoading.set(true);
+
+ const customerValue = {
+ note: this.customerForm.value.note,
+ }
+
+ try {
+ const customer = await firstValueFrom(this.customersService.updateCustomer(this.customer().id,customerValue));
+ this.customerEdit.set(customer);
+ console.log(customer);
+ this.customerForm.reset();
+ this.edit.set(false);
+
+ this.triggerEdited.emit();
+
+ } catch (e)
+ {
+ this.notificationService.error('Erreur', ' (ou Erreur de communication avec l\'API)');
+ }
+
+ this.customersLoading.set(false);
+
+ }
+
+
+ customer = input(null);
+
+ edit = signal(false)
+
+ triggerEdited = output();
+
+ protected Edit() {
+ this.edit.set(true)
+ }
+
+ protected Back() {
+ this.edit.set(false)
+ this.customerForm.reset();
+ }
+
+ async Delete() {
+ this.customersLoading.set(true);
+
+ try {
+ const customer = await firstValueFrom(this.customersService.deleteCustomerEndpoint(this.customer().id));
+ this.customerEdit.set(customer);
+
+ this.customerForm.reset();
+ this.triggerEdited.emit();
+
+ } catch (e)
+ {
+ this.notificationService.error('Erreur de recherche', "L\'auteur n\'existe pas !");
+
+ this.notificationService.error('Erreur', ' (ou Erreur de communication avec l\'API)');
+ }
+
+ this.customersLoading.set(false);
+ }
+}
diff --git a/src/app/pages/customers/customers.html b/src/app/pages/customers/customers.html
index 7ed2f32..7d7576a 100644
--- a/src/app/pages/customers/customers.html
+++ b/src/app/pages/customers/customers.html
@@ -1 +1,11 @@
-customers works!
+
+
+
+
+ @for (customer of customers(); track customer.id)
+ {
+
+
+ }
+
+
create-opportunity-modal works!
diff --git a/src/app/pages/opportunities/create-opportunity-modal/create-opportunity-modal.ts b/src/app/pages/opportunities/create-opportunity-modal/create-opportunity-modal.ts
new file mode 100644
index 0000000..d3599df
--- /dev/null
+++ b/src/app/pages/opportunities/create-opportunity-modal/create-opportunity-modal.ts
@@ -0,0 +1,63 @@
+import {Component, output} from '@angular/core';
+import {OpportunityAddForm} from "../opportunity-add-form/opportunity-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-opportunity-modal',
+ imports: [
+ OpportunityAddForm,
+ NzButtonComponent,
+ NzModalComponent
+ ],
+ template: `
+
+
+ Création d'opportunités
+
+
+
+
+
+
+
+
+
+
+ `,
+ styleUrl: './create-opportunity-modal.css',
+})
+export class CreateOpportunityModal {
+ constructor(private message: NzMessageService) {}
+ isVisible = false;
+ isConfirmLoading = false;
+
+ showModal(): void {
+ this.isVisible = true;
+ }
+
+ handleOk(): void {
+ this.isConfirmLoading = true;
+ this.message.success('Opportunité 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()
+}
diff --git a/src/app/pages/opportunities/opportunities.html b/src/app/pages/opportunities/opportunities.html
index 5b82714..2de5708 100644
--- a/src/app/pages/opportunities/opportunities.html
+++ b/src/app/pages/opportunities/opportunities.html
@@ -1 +1,57 @@
-opportunities works!
+
+
+
+
+
+
+
+
📞 Appels
+
{{ totalCalls }}
+
+
+
✉️ Emails
+
{{ totalEmails }}
+
+
+
🤝 Réunions
+
{{ totalMeetings }}
+
+
+
+
+ @for (communication of communications(); track communication.id) {
+ @if (communication.calling) {
+
+
+ }
+ }
+
+
+
+
+
+ @for (communication of communications(); track communication.id) {
+ @if (communication.email) {
+
+
+ }
+ }
+
+
+
+
+
+ @for (communication of communications(); track communication.id) {
+ @if (communication.meeting) {
+
+
+ }
+ }
+
+
+
Contact n°{{ communication().contactId }}
+ @if (communication().calling) {
+ 📞 Appel : {{ communication().calling }}
+ Nom du Contact : {{ communication().contactLastName + " " + communication().contactFirstName}}
+ Numéro du Contact : {{ communication().contactPhoneNumber }}
+ Email du Contact : {{ communication().contactEmail }}
+ }
+ @if (communication().email) {
+ ✉️ Email : {{ communication().email }}
+ Nom du Contact : {{ communication().contactLastName + " " + communication().contactFirstName}}
+ Numéro du Contact : {{ communication().contactPhoneNumber }}
+ Email du Contact : {{ communication().contactEmail }}
+ }
+ @if (communication().meeting) {
+ 🤝 Réunion : {{ communication().meeting }}
+ Nom du Contact : {{ communication().contactLastName + " " + communication().contactFirstName}}
+ Numéro du Contact : {{ communication().contactPhoneNumber }}
+ Email du Contact : {{ communication().contactEmail }}
+ }
+
+
+
+
+
+
+
+} @else {
+
+
+
+
+
+
+
+
+
+}
diff --git a/src/app/pages/opportunities/opportunity-card/opportunity-card.ts b/src/app/pages/opportunities/opportunity-card/opportunity-card.ts
new file mode 100644
index 0000000..447932c
--- /dev/null
+++ b/src/app/pages/opportunities/opportunity-card/opportunity-card.ts
@@ -0,0 +1,100 @@
+import {Component, inject, input, output, signal} from '@angular/core';
+import {NzNotificationService} from "ng-zorro-antd/notification";
+import {FormControl, FormGroup, ReactiveFormsModule} from "@angular/forms";
+import {firstValueFrom} from "rxjs";
+import {NzCardComponent} from "ng-zorro-antd/card";
+import {NzFormControlComponent, NzFormItemComponent, NzFormLabelComponent} from "ng-zorro-antd/form";
+import {NzIconDirective} from "ng-zorro-antd/icon";
+import {NzColDirective} from "ng-zorro-antd/grid";
+import {NzInputDirective} from "ng-zorro-antd/input";
+import {CommunicationsService, GetCommunicationDto, UpdateCommunicationDto} from "../../../services/api";
+
+@Component({
+ selector: 'app-opportunity-card',
+ imports: [
+ NzCardComponent,
+ ReactiveFormsModule,
+ NzFormLabelComponent,
+ NzFormControlComponent,
+ NzFormItemComponent,
+ NzIconDirective,
+ NzColDirective,
+ NzInputDirective
+ ],
+ templateUrl: './opportunity-card.html',
+ styleUrl: './opportunity-card.css',
+})
+export class OpportunityCard {
+ private communicationsService = inject(CommunicationsService);
+ private notificationService = inject(NzNotificationService);
+
+ communicationEdit = signal(null);
+ communicationsLoading = signal(false);
+
+ communicationForm = new FormGroup({
+ calling: new FormControl(null),
+ email: new FormControl(null),
+ meeting: new FormControl(null),
+ }, { validators: atLeastOneRequired })
+
+ async submitForm() {
+ this.communicationsLoading.set(true);
+
+ const communicationValue: UpdateCommunicationDto = {
+ calling: this.communicationForm.value.calling,
+ email: this.communicationForm.value.email,
+ meeting: this.communicationForm.value.meeting,
+ }
+
+ try {
+ const communication = await firstValueFrom(this.communicationsService.updateCommunicationEndpoint(this.communication().id, communicationValue));
+ this.communicationEdit.set(communication as unknown as UpdateCommunicationDto);
+ console.log(communication);
+ this.communicationForm.reset();
+ this.edit.set(false);
+ this.triggerEdited.emit();
+ } catch (e) {
+ this.notificationService.error('Erreur', '(ou Erreur de communication avec l\'API)');
+ }
+
+ this.communicationsLoading.set(false);
+ }
+
+ communication = input(null);
+ edit = signal(false);
+ triggerEdited = output();
+
+ protected Edit() {
+ this.edit.set(true);
+ this.communicationForm.patchValue({
+ calling: this.communication().calling,
+ email: this.communication().email,
+ meeting: this.communication().meeting,
+ });
+ }
+
+ protected Back() {
+ this.edit.set(false);
+ this.communicationForm.reset();
+ }
+
+ async Delete() {
+ this.communicationsLoading.set(true);
+
+ try {
+ await firstValueFrom(this.communicationsService.deleteCommunicationEndpoint(this.communication().id));
+ this.communicationForm.reset();
+ this.triggerEdited.emit();
+ } catch (e) {
+ this.notificationService.error('Erreur', '(ou Erreur de communication avec l\'API)');
+ }
+
+ this.communicationsLoading.set(false);
+ }
+ }
+
+ function atLeastOneRequired(group: FormGroup) {
+ const { calling, email, meeting } = group.controls;
+ const valid = [calling, email, meeting].some(c => c.value);
+ return valid ? null : { atLeastOneRequired: true };
+}
diff --git a/src/app/pages/providers/create-providers-modal/create-providers-modal.css b/src/app/pages/providers/create-providers-modal/create-providers-modal.css
new file mode 100644
index 0000000..e69de29
diff --git a/src/app/pages/providers/create-providers-modal/create-providers-modal.html b/src/app/pages/providers/create-providers-modal/create-providers-modal.html
new file mode 100644
index 0000000..1c34d8b
--- /dev/null
+++ b/src/app/pages/providers/create-providers-modal/create-providers-modal.html
@@ -0,0 +1 @@
+create-providers-modal works!
diff --git a/src/app/pages/providers/create-providers-modal/create-providers-modal.ts b/src/app/pages/providers/create-providers-modal/create-providers-modal.ts
new file mode 100644
index 0000000..551cc7e
--- /dev/null
+++ b/src/app/pages/providers/create-providers-modal/create-providers-modal.ts
@@ -0,0 +1,59 @@
+import {Component, output} from '@angular/core';
+import {NzMessageService} from "ng-zorro-antd/message";
+import {NzButtonComponent} from "ng-zorro-antd/button";
+import {NzModalComponent} from "ng-zorro-antd/modal";
+import {ProvidersAddForm} from "../providers-add-form/providers-add-form";
+
+@Component({
+ selector: 'app-create-providers-modal',
+ imports: [NzButtonComponent, NzModalComponent, ProvidersAddForm],
+ template: `
+
+
+ Création de prestataires
+
+
+
+
+
+
+
+
+
+
+ `,
+ styleUrl: './create-providers-modal.css',
+})
+export class CreateProvidersModal {
+ constructor(private message: NzMessageService) {}
+ isVisible = false;
+ isConfirmLoading = false;
+
+ showModal(): void {
+ this.isVisible = true;
+ }
+
+ handleOk(): void {
+ this.isConfirmLoading = true;
+ this.message.success('Prestataire 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()
+}
diff --git a/src/app/pages/providers/providers-add-form/providers-add-form.css b/src/app/pages/providers/providers-add-form/providers-add-form.css
new file mode 100644
index 0000000..e69de29
diff --git a/src/app/pages/providers/providers-add-form/providers-add-form.html b/src/app/pages/providers/providers-add-form/providers-add-form.html
new file mode 100644
index 0000000..69dfa7a
--- /dev/null
+++ b/src/app/pages/providers/providers-add-form/providers-add-form.html
@@ -0,0 +1,23 @@
+
diff --git a/src/app/pages/providers/providers-add-form/providers-add-form.ts b/src/app/pages/providers/providers-add-form/providers-add-form.ts
new file mode 100644
index 0000000..cbb7720
--- /dev/null
+++ b/src/app/pages/providers/providers-add-form/providers-add-form.ts
@@ -0,0 +1,85 @@
+import {Component, inject, signal} from '@angular/core';
+import {FormControl, FormGroup, FormsModule, ReactiveFormsModule, Validators} from "@angular/forms";
+import {NzButtonComponent} from "ng-zorro-antd/button";
+import {NzColDirective, NzRowDirective} 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 {NzOptionComponent, NzSelectComponent} from "ng-zorro-antd/select";
+import {CreateProviderDto, GetProviderTypeDto, ProvidertypesService, ServiceprovidersService} from "../../../services/api";
+import {NzNotificationService} from "ng-zorro-antd/notification";
+import {firstValueFrom} from "rxjs";
+
+@Component({
+ selector: 'app-providers-add-form',
+ imports: [FormsModule, NzButtonComponent, NzColDirective, NzFlexDirective, NzFormControlComponent, NzFormDirective, NzFormItemComponent, NzFormLabelComponent, NzInputDirective, NzOptionComponent, NzRowDirective, NzSelectComponent, ReactiveFormsModule],
+ templateUrl: './providers-add-form.html',
+ styleUrl: './providers-add-form.css',
+})
+export class ProvidersAddForm {
+ private providersService = inject(ServiceprovidersService);
+ private serviceprovidertypesService = inject(ProvidertypesService);
+ private notificationService = inject(NzNotificationService)
+
+
+ providerForm = new FormGroup({
+ Price: new FormControl(null, [Validators.required]),
+ providerTypeId: new FormControl(null, [Validators.required]),
+ })
+
+ providerPost = signal(this.providerForm.value);
+ providersLoading = signal(false);
+
+ async submitForm() {
+ // Pour annuler si le formulaire est invalide
+ if (this.providerForm.invalid) return;
+
+ // Pour obtenir la valeur du formulaire
+ console.log(this.providerForm.getRawValue())
+ this.providerPost.set(this.providerForm.getRawValue())
+
+ await this.createProviders(this.providerPost().price, this.providerPost().providerTypeId)
+ // Pour vider le formulaire
+ this.providerForm.reset()
+ }
+
+ async createProviders(price: number, customerTypeId: number) {
+ this.providersLoading.set(true);
+
+ const providerValue = {
+ price: price,
+ customerTypeId: customerTypeId
+ }
+
+ try {
+ const provider = await firstValueFrom(this.providersService.createProviderEndpoint(providerValue));
+ this.providerPost.set(provider);
+ console.log(provider);
+ } catch (e)
+ {
+ this.notificationService.error('Erreur de recherche', "L\'auteur n\'existe pas !");
+
+ this.notificationService.error('Erreur', ' (ou Erreur de communication avec l\'API)');
+ }
+
+ this.providersLoading.set(false);
+ }
+
+ providerTypes = signal([])
+
+ async ngOnInit() {
+ await this.fetchCustomerTypes()
+ }
+
+ async fetchCustomerTypes() {
+ this.providersLoading.set(true);
+ try {
+ const providerType = await firstValueFrom(this.serviceprovidertypesService.getAllProviderTypesEndpoint())
+ this.providerTypes.set(providerType)
+ } catch (e) {
+ this.notificationService.error('Erreur', 'Erreur de communication avec l\'API');
+ }
+
+ this.providersLoading.set(false);
+ }
+}
diff --git a/src/app/pages/providers/providers-card/providers-card.css b/src/app/pages/providers/providers-card/providers-card.css
new file mode 100644
index 0000000..e69de29
diff --git a/src/app/pages/providers/providers-card/providers-card.html b/src/app/pages/providers/providers-card/providers-card.html
new file mode 100644
index 0000000..e5b0da9
--- /dev/null
+++ b/src/app/pages/providers/providers-card/providers-card.html
@@ -0,0 +1,30 @@
+@if (edit() == false) {
+
+ Prestataire n°{{ provider().id }}
+ Prix : {{ provider().price }}
+ Type de Prestataire : {{ provider().providerType }}
+
+
+
+
+
+
+
+} @else {
+
+
+
+
+
+
+
+
+
+}
diff --git a/src/app/pages/providers/providers-card/providers-card.ts b/src/app/pages/providers/providers-card/providers-card.ts
new file mode 100644
index 0000000..8e52f43
--- /dev/null
+++ b/src/app/pages/providers/providers-card/providers-card.ts
@@ -0,0 +1,90 @@
+import {Component, inject, input, output, signal} from '@angular/core';
+import {FormControl, FormGroup, FormsModule, ReactiveFormsModule, Validators} from "@angular/forms";
+import {NzCardComponent} from "ng-zorro-antd/card";
+import {NzColDirective, NzRowDirective} from "ng-zorro-antd/grid";
+import {NzFormControlComponent, NzFormDirective, NzFormItemComponent, NzFormLabelComponent} from "ng-zorro-antd/form";
+import {NzIconDirective} from "ng-zorro-antd/icon";
+import {NzInputDirective} from "ng-zorro-antd/input";
+import {GetProviderDto, ServiceprovidersService, UpdateProviderDto} from "../../../services/api";
+import {NzNotificationService} from "ng-zorro-antd/notification";
+import {firstValueFrom} from "rxjs";
+
+@Component({
+ selector: 'app-providers-card',
+ imports: [FormsModule, NzCardComponent, NzColDirective, NzFormControlComponent, NzFormDirective, NzFormItemComponent, NzFormLabelComponent, NzIconDirective, NzInputDirective, NzRowDirective, ReactiveFormsModule],
+ templateUrl: './providers-card.html',
+ styleUrl: './providers-card.css',
+})
+export class ProvidersCard {
+ private providersService = inject(ServiceprovidersService);
+ private notificationService = inject(NzNotificationService)
+
+ providerEdit = signal(null);
+ providersLoading = signal(false);
+
+ providerForm = new FormGroup({
+ id: new FormControl(null, [Validators.required]),
+ price: new FormControl(null, [Validators.required]),
+ })
+
+ async submitForm() {
+ this.providersLoading.set(true);
+
+ const providerValue = {
+ price: this.providerForm.value.price,
+ }
+
+ try {
+ const provider = await firstValueFrom(this.providersService.updateProviderEndpoint(this.provider().id,providerValue));
+ this.providerEdit.set(provider);
+ console.log(provider);
+ this.providerForm.reset();
+ this.edit.set(false);
+
+ this.triggerEdited.emit();
+
+ } catch (e)
+ {
+ this.notificationService.error('Erreur', ' (ou Erreur de communication avec l\'API)');
+ }
+
+ this.providersLoading.set(false);
+
+ }
+
+
+ provider = input(null);
+
+ edit = signal(false)
+
+ triggerEdited = output();
+
+ protected Edit() {
+ this.edit.set(true)
+ }
+
+ protected Back() {
+ this.edit.set(false)
+ this.providerForm.reset();
+ }
+
+ async Delete() {
+ this.providersLoading.set(true);
+
+ try {
+ const provider = await firstValueFrom(this.providersService.deleteProviderEndpoint(this.provider().id));
+ this.providerEdit.set(provider);
+
+ this.providerForm.reset();
+ this.triggerEdited.emit();
+
+ } catch (e)
+ {
+ this.notificationService.error('Erreur de recherche', "L\'auteur n\'existe pas !");
+
+ this.notificationService.error('Erreur', ' (ou Erreur de communication avec l\'API)');
+ }
+
+ this.providersLoading.set(false);
+ }
+}
diff --git a/src/app/pages/providers/providers.html b/src/app/pages/providers/providers.html
index 5d1a3a1..6e1fd60 100644
--- a/src/app/pages/providers/providers.html
+++ b/src/app/pages/providers/providers.html
@@ -1 +1,11 @@
-providers works!
+
+
+
+
+ @for (provider of providers(); track provider.id)
+ {
+
+
+ }
+
+
create-staff-modal works!
diff --git a/src/app/pages/staff/create-staff-modal/create-staff-modal.ts b/src/app/pages/staff/create-staff-modal/create-staff-modal.ts
new file mode 100644
index 0000000..835acb8
--- /dev/null
+++ b/src/app/pages/staff/create-staff-modal/create-staff-modal.ts
@@ -0,0 +1,63 @@
+import {Component, output} from '@angular/core';
+import StaffAddForm from "../staff-add-form/staff-add-form";
+import {NzMessageService} from "ng-zorro-antd/message";
+import {NzModalComponent} from "ng-zorro-antd/modal";
+import {NzButtonComponent} from "ng-zorro-antd/button";
+
+@Component({
+ selector: 'app-create-staff-modal',
+ imports: [
+ StaffAddForm,
+ NzModalComponent,
+ NzButtonComponent
+ ],
+ template: `
+
+
+ Création de staff
+
+
+
+
+
+
+
+
+
+
+ `,
+ styleUrl: './create-staff-modal.css',
+})
+export class CreateStaffModal {
+ constructor(private message: NzMessageService) {}
+ isVisible = false;
+ isConfirmLoading = false;
+
+ showModal(): void {
+ this.isVisible = true;
+ }
+
+ handleOk(): void {
+ this.isConfirmLoading = true;
+ this.message.success('Staff 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()
+}
diff --git a/src/app/pages/staff/staff-add-form/staff-add-form.css b/src/app/pages/staff/staff-add-form/staff-add-form.css
new file mode 100644
index 0000000..e69de29
diff --git a/src/app/pages/staff/staff-add-form/staff-add-form.html b/src/app/pages/staff/staff-add-form/staff-add-form.html
new file mode 100644
index 0000000..678fcbb
--- /dev/null
+++ b/src/app/pages/staff/staff-add-form/staff-add-form.html
@@ -0,0 +1,47 @@
+
diff --git a/src/app/pages/staff/staff-add-form/staff-add-form.ts b/src/app/pages/staff/staff-add-form/staff-add-form.ts
new file mode 100644
index 0000000..56df90b
--- /dev/null
+++ b/src/app/pages/staff/staff-add-form/staff-add-form.ts
@@ -0,0 +1,94 @@
+import {Component, inject, signal} from '@angular/core';
+import {FormControl, FormGroup, FormsModule, ReactiveFormsModule, Validators} from "@angular/forms";
+import {NzButtonComponent} from "ng-zorro-antd/button";
+import {NzColDirective, NzRowDirective} 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 {NzNotificationService} from "ng-zorro-antd/notification";
+import {firstValueFrom} from "rxjs";
+import {CreateStaffDto, GetProviderTypeDto, ProvidertypesService, StaffsService} from "../../../services/api";
+
+@Component({
+ selector: 'app-staff-add-form',
+ imports: [FormsModule, NzButtonComponent, NzColDirective, NzFlexDirective, NzFormControlComponent, NzFormDirective, NzFormItemComponent, NzFormLabelComponent, NzInputDirective, NzRowDirective, ReactiveFormsModule],
+ templateUrl: './staff-add-form.html',
+ styleUrl: './staff-add-form.css',
+})
+class StaffAddForm {
+ private staffsService = inject(StaffsService);
+ private serviceprovidertypesService = inject(ProvidertypesService);
+ private notificationService = inject(NzNotificationService)
+
+
+ staffForm = new FormGroup({
+ lastName: new FormControl(null, [Validators.required]),
+ firstName: new FormControl(null, [Validators.required]),
+ profession: new FormControl(null, [Validators.required]),
+ email: new FormControl(null, [Validators.required]),
+ f4T2NumberApproval: new FormControl(null, [Validators.required]),
+ f4T2ExpirationDate: new FormControl(null, [Validators.required])
+ })
+
+ staffPost = signal(this.staffForm.value as any);
+ staffsLoading = signal(false);
+
+ async submitForm() {
+ // Pour annuler si le formulaire est invalide
+ if (this.staffForm.invalid) return;
+
+ // Pour obtenir la valeur du formulaire
+ console.log(this.staffForm.getRawValue())
+ this.staffPost.set(this.staffForm.getRawValue() as any)
+
+ await this.createStaff(this.staffPost().lastName, this.staffPost().firstName, this.staffPost().profession, this.staffPost().email, this.staffPost().f4T2NumberApproval, this.staffPost().f4T2ExpirationDate)
+ // Pour vider le formulaire
+ this.staffForm.reset()
+ }
+
+ async createStaff(lastname: string, firstname: string, profession: string, email: string, f4t2number: string, f4t2expiration: Date | string)
+ {
+ this.staffsLoading.set(true);
+
+ const staffValue: CreateStaffDto = {
+ lastName: lastname,
+ firstName: firstname,
+ profession: profession,
+ email: email,
+ f4T2NumberApproval: f4t2number,
+ f4T2ExpirationDate: f4t2expiration instanceof Date ? f4t2expiration : new Date(f4t2expiration)
+ }
+
+ try {
+ const staff = await firstValueFrom(this.staffsService.createStaffEndpoint(staffValue));
+ this.staffPost.set(staff as unknown as CreateStaffDto);
+ console.log(staff);
+ } catch (e)
+ {
+
+ this.notificationService.error('Erreur', ' (ou Erreur de communication avec l\'API)');
+ }
+
+ this.staffsLoading.set(false);
+ }
+
+ providerTypes = signal([])
+
+ async ngOnInit() {
+ await this.fetchCustomerTypes()
+ }
+
+ async fetchCustomerTypes() {
+ this.staffsLoading.set(true);
+ try {
+ const providerType = await firstValueFrom(this.serviceprovidertypesService.getAllProviderTypesEndpoint())
+ this.providerTypes.set(providerType)
+ } catch (e) {
+ this.notificationService.error('Erreur', 'Erreur de communication avec l\'API');
+ }
+
+ this.staffsLoading.set(false);
+ }
+}
+
+export default StaffAddForm
diff --git a/src/app/pages/staff/staff-card/staff-card.css b/src/app/pages/staff/staff-card/staff-card.css
new file mode 100644
index 0000000..e69de29
diff --git a/src/app/pages/staff/staff-card/staff-card.html b/src/app/pages/staff/staff-card/staff-card.html
new file mode 100644
index 0000000..09e0487
--- /dev/null
+++ b/src/app/pages/staff/staff-card/staff-card.html
@@ -0,0 +1,40 @@
+@if (edit() == false) {
+
+ Staff n°{{ staff().id }}
+ Nom : {{ staff().lastName }} {{ staff().firstName }}
+ Profession : {{ staff().profession }}
+ Email : {{ staff().email }}
+ N° F4T2 : {{ staff().f4T2NumberApproval }}
+ Expiration F4T2 : {{ staff().f4T2ExpirationDate }}
+ Niveau d'experience : {{ staff().experienceLevel}}
+
+
+
+
+
+
+
+} @else {
+
+
+
+
+
+
+
+
+
+}
\ No newline at end of file
diff --git a/src/app/pages/staff/staff-card/staff-card.ts b/src/app/pages/staff/staff-card/staff-card.ts
new file mode 100644
index 0000000..ef46418
--- /dev/null
+++ b/src/app/pages/staff/staff-card/staff-card.ts
@@ -0,0 +1,89 @@
+import {Component, inject, input, output, signal} from '@angular/core';
+import {NzCardComponent} from "ng-zorro-antd/card";
+import {NzColDirective, NzRowDirective} from "ng-zorro-antd/grid";
+import {NzFormControlComponent, NzFormDirective, NzFormItemComponent, NzFormLabelComponent} from "ng-zorro-antd/form";
+import {NzIconDirective} from "ng-zorro-antd/icon";
+import {NzInputDirective} from "ng-zorro-antd/input";
+import {FormControl, FormGroup, ReactiveFormsModule, Validators} from "@angular/forms";
+import {NzNotificationService} from "ng-zorro-antd/notification";
+import {firstValueFrom} from "rxjs";
+import {GetStaffDto, StaffsService, UpdateStaffDto} from "../../../services/api";
+
+@Component({
+ selector: 'app-staff-card',
+ imports: [
+ NzCardComponent,
+ NzColDirective,
+ NzFormControlComponent,
+ NzFormDirective,
+ NzFormItemComponent,
+ NzFormLabelComponent,
+ NzIconDirective,
+ NzInputDirective,
+ NzRowDirective,
+ ReactiveFormsModule
+ ],
+ templateUrl: './staff-card.html',
+ styleUrl: './staff-card.css',
+})
+export class StaffCard {
+ private staffsService = inject(StaffsService);
+ private notificationService = inject(NzNotificationService)
+
+ staffEdit = signal(null);
+ staffsLoading = signal(false);
+
+ staffForm = new FormGroup({
+ f4T2NumberApproval: new FormControl(null, [Validators.required]),
+ f4T2ExpirationDate: new FormControl(null, [Validators.required]),
+ })
+
+ async submitForm() {
+ this.staffsLoading.set(true);
+
+ const staffValue: UpdateStaffDto = {
+ f4T2NumberApproval: this.staffForm.value.f4T2NumberApproval,
+ f4T2ExpirationDate: this.staffForm.value.f4T2ExpirationDate,
+ }
+
+ try {
+ const staff = await firstValueFrom(this.staffsService.updateStaffEndpoint(this.staff().id, staffValue));
+ this.staffEdit.set(staff as unknown as UpdateStaffDto);
+ console.log(staff);
+ this.staffForm.reset();
+ this.edit.set(false);
+ this.triggerEdited.emit();
+ } catch (e) {
+ this.notificationService.error('Erreur', '(ou Erreur de communication avec l\'API)');
+ }
+
+ this.staffsLoading.set(false);
+ }
+
+ staff = input(null);
+ edit = signal(false)
+ triggerEdited = output();
+
+ protected Edit() {
+ this.edit.set(true)
+ }
+
+ protected Back() {
+ this.edit.set(false)
+ this.staffForm.reset();
+ }
+
+ async Delete() {
+ this.staffsLoading.set(true);
+
+ try {
+ await firstValueFrom(this.staffsService.deleteStaffEndpoint(this.staff().id));
+ this.staffForm.reset();
+ this.triggerEdited.emit();
+ } catch (e) {
+ this.notificationService.error('Erreur', '(ou Erreur de communication avec l\'API)');
+ }
+
+ this.staffsLoading.set(false);
+ }
+}
diff --git a/src/app/pages/staff/staff.html b/src/app/pages/staff/staff.html
index f9500ec..3cf8b5b 100644
--- a/src/app/pages/staff/staff.html
+++ b/src/app/pages/staff/staff.html
@@ -1 +1,11 @@
-staff works!
+
+
+
+
+ @for (staff of staffs(); track staff.id)
+ {
+
+
+ }
+
+
- 
+