Fin opportunity

src/app/pages/contact/contact-add-form/contact-add-form.html

@@ -1 +1,61 @@
-<p>contact-add-form works!</p>
+<form nz-form nzLayout="horizontal" [formGroup]="contactForm">
+    <nz-form-item>
+        <nz-form-label nzSpan="5" nzRequired>Nom</nz-form-label>
+        <nz-form-control nzErrorTip="Ce champ est requis">
+            <input nz-input placeholder="Nom" formControlName="lastName">
+        </nz-form-control>
+    </nz-form-item>
+
+    <nz-form-item>
+        <nz-form-label nzSpan="5" nzRequired>Prénom</nz-form-label>
+        <nz-form-control nzErrorTip="Ce champ est requis">
+            <input nz-input placeholder="Prénom" formControlName="firstName">
+        </nz-form-control>
+    </nz-form-item>
+
+    <nz-form-item>
+        <nz-form-label nzSpan="5" nzRequired>Email</nz-form-label>
+        <nz-form-control nzErrorTip="Ce champ est requis">
+            <input nz-input placeholder="Email" formControlName="email">
+        </nz-form-control>
+    </nz-form-item>
+
+    <nz-form-item>
+        <nz-form-label nzSpan="5" nzRequired>Téléphone</nz-form-label>
+        <nz-form-control nzErrorTip="Ce champ est requis">
+            <input nz-input placeholder="Téléphone" formControlName="phoneNumber">
+        </nz-form-control>
+    </nz-form-item>
+
+    <nz-form-item>
+        <nz-form-label nzSpan="5" nzRequired>Adresse</nz-form-label>
+        <nz-form-control nzErrorTip="Ce champ est requis">
+            <input nz-input placeholder="Adresse" formControlName="address">
+        </nz-form-control>
+    </nz-form-item>
+
+    <nz-form-item>
+        <nz-form-label nzSpan="5" nzRequired>Code postal</nz-form-label>
+        <nz-form-control nzErrorTip="Ce champ est requis">
+            <input nz-input type="number" placeholder="Code postal" formControlName="zipCode">
+        </nz-form-control>
+    </nz-form-item>
+
+    <nz-form-item>
+        <nz-form-label nzSpan="5" nzRequired>Ville</nz-form-label>
+        <nz-form-control nzErrorTip="Ce champ est requis">
+            <input nz-input placeholder="Ville" formControlName="city">
+        </nz-form-control>
+    </nz-form-item>
+
+    <nz-form-item>
+        <nz-form-label nzSpan="5" nzRequired>Rôle</nz-form-label>
+        <nz-form-control nzErrorTip="Ce champ est requis">
+            <input nz-input placeholder="Rôle" formControlName="role">
+        </nz-form-control>
+    </nz-form-item>
+
+    <nz-flex nzJustify="end">
+        <button nz-button nzType="primary" (click)="submitForm()">Valider</button>
+    </nz-flex>
+</form>

src/app/pages/contact/contact-add-form/contact-add-form.ts

@@ -1,11 +1,89 @@
-import { Component } from '@angular/core';
+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: [],
+  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<string>(null, [Validators.required]),
+      firstName: new FormControl<string>(null, [Validators.required]),
+      phoneNumber: new FormControl<string>(null, [Validators.required]),
+      email: new FormControl<string>(null, [Validators.required]),
+      address: new FormControl<string>(null, [Validators.required]),
+      city: new FormControl<string>(null, [Validators.required]),
+      role: new FormControl<string>(null, [Validators.required]),
+      customerId: new FormControl<number>(null),
+    })
+
+    contactPost = signal<CreateContactDto>(this.contactForm.value);
+    contactsLoading = signal<boolean>(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);
+    }
 }

src/app/pages/contact/contact-card/contact-card.html

@@ -2,6 +2,11 @@
     <nz-card style="width:400px;" [nzActions]="[edit, delete]">
         <h2 style="text-align: center; font-weight: bold">Contact n°{{ contact().id }}</h2>
         <p>Nom : {{ contact().lastName + " " + contact().firstName }}</p>
+        <p>Rôle : {{ contact().role }}</p>
+        <p>Numéro de téléphone : {{ contact().phoneNumber }} </p>
+        <p>Email : {{ contact().email }}</p>
+        <p>Adresse : {{ contact().address + ", " + contact().city }}</p>
+
     </nz-card>
     <ng-template #edit>
         <nz-icon (click)="Edit()" nzType="edit" nzTheme="fill" />
@@ -15,7 +20,43 @@
             <nz-form-item>
                 <nz-form-label nzSpan="5" nzRequired> Nom </nz-form-label>
                 <nz-form-control nzSpan="22" nzErrorTip="Ce champ est requis !">
-                    <input nz-input placeholder="Nom" formControlName="note">
+                    <input nz-input placeholder="Nom" formControlName="lastname">
+                </nz-form-control>
+            </nz-form-item>
+            <nz-form-item>
+                <nz-form-label nzSpan="5" nzRequired> Prénom </nz-form-label>
+                <nz-form-control nzSpan="22" nzErrorTip="Ce champ est requis !">
+                    <input nz-input placeholder="Prénom" formControlName="firstname">
+                </nz-form-control>
+            </nz-form-item>
+            <nz-form-item>
+                <nz-form-label nzSpan="5" nzRequired> Num. Tél. </nz-form-label>
+                <nz-form-control nzSpan="22" nzErrorTip="Ce champ est requis !">
+                    <input nz-input placeholder="Numéro de téléphone" formControlName="phone">
+                </nz-form-control>
+            </nz-form-item>
+            <nz-form-item>
+                <nz-form-label nzSpan="5" nzRequired> Email </nz-form-label>
+                <nz-form-control nzSpan="22" nzErrorTip="Ce champ est requis !">
+                    <input nz-input placeholder="Email" formControlName="email">
+                </nz-form-control>
+            </nz-form-item>
+            <nz-form-item>
+                <nz-form-label nzSpan="5" nzRequired> Adresse </nz-form-label>
+                <nz-form-control nzSpan="22" nzErrorTip="Ce champ est requis !">
+                    <input nz-input placeholder="Adresse" formControlName="address">
+                </nz-form-control>
+            </nz-form-item>
+            <nz-form-item>
+                <nz-form-label nzSpan="5" nzRequired> Ville </nz-form-label>
+                <nz-form-control nzSpan="22" nzErrorTip="Ce champ est requis !">
+                    <input nz-input placeholder="Ville" formControlName="city">
+                </nz-form-control>
+            </nz-form-item>
+            <nz-form-item>
+                <nz-form-label nzSpan="5" nzRequired> Rôle </nz-form-label>
+                <nz-form-control nzSpan="22" nzErrorTip="Ce champ est requis !">
+                    <input nz-input placeholder="Rôle" formControlName="role">
                 </nz-form-control>
             </nz-form-item>
         </form>

src/app/pages/opportunities/opportunity-add-form/opportunity-add-form.html

@@ -20,6 +20,17 @@
         </nz-form-control>
     </nz-form-item>
 
+    <nz-form-item>
+        <nz-form-label nzSpan="5" nzRequired>Contact</nz-form-label>
+        <nz-form-control nzErrorTip="Ce champ est requis">
+            <nz-select placeholder="Sélectionner un contact" formControlName="contactId">
+                @for (contact of contacts(); track contact.id) {
+                    <nz-option [nzValue]="contact.id" nzLabel="{{ contact.firstName }} {{ contact.lastName }}"></nz-option>
+                }
+            </nz-select>
+        </nz-form-control>
+    </nz-form-item>
+
     <nz-flex nzJustify="end">
         <button nz-button nzType="primary" (click)="submitForm()">Valider</button>
     </nz-flex>

src/app/pages/opportunities/opportunity-add-form/opportunity-add-form.ts

@@ -4,10 +4,11 @@ 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 {FormControl, FormGroup, ReactiveFormsModule} from "@angular/forms";
+import {FormControl, FormGroup, ReactiveFormsModule, Validators} from "@angular/forms";
-import {CommunicationsService, CreateCommunicationDto} from "../../../services/api";
+import {CommunicationsService, ContactsService, CreateCommunicationDto, GetContactDto} from "../../../services/api";
 import {NzNotificationService} from "ng-zorro-antd/notification";
 import {firstValueFrom} from "rxjs";
+import {NzOptionComponent, NzSelectComponent} from "ng-zorro-antd/select";
 
 @Component({
   selector: 'app-opportunity-add-form',
@@ -21,7 +22,9 @@ import {firstValueFrom} from "rxjs";
     NzFormLabelComponent,
     NzInputDirective,
     NzRowDirective,
-    ReactiveFormsModule
+    ReactiveFormsModule,
+    NzSelectComponent,
+    NzOptionComponent
   ],
   templateUrl: './opportunity-add-form.html',
   styleUrl: './opportunity-add-form.css',
@@ -30,11 +33,14 @@ export class OpportunityAddForm {
 
     private communicationsService = inject(CommunicationsService);
     private notificationService = inject(NzNotificationService)
+    private contactsService = inject(ContactsService);
+
 
     communicationForm = new FormGroup({
       calling: new FormControl<string>(null),
       email: new FormControl<string>(null),
       meeting: new FormControl<string>(null),
+      contactId: new FormControl<number>(null, [Validators.required]),
     }, { validators: atLeastOneRequired })
 
     communicationPost = signal<CreateCommunicationDto>(this.communicationForm.value);
@@ -46,17 +52,18 @@ export class OpportunityAddForm {
       console.log(this.communicationForm.getRawValue())
       this.communicationPost.set(this.communicationForm.getRawValue())
 
-      await this.createCommunication(this.communicationPost().calling, this.communicationPost().email, this.communicationPost().meeting)
+      await this.createCommunication(this.communicationPost().calling, this.communicationPost().email, this.communicationPost().meeting, this.communicationPost().contactId)
       this.communicationForm.reset()
     }
 
-    async createCommunication(calling: string, email: string, meeting: string) {
+    async createCommunication(calling: string, email: string, meeting: string, contactId: number) {
       this.communicationsLoading.set(true);
 
       const communicationValue: CreateCommunicationDto = {
         calling: calling,
         email: email,
         meeting: meeting,
+        contactId: contactId
       }
 
       try {
@@ -69,8 +76,25 @@ export class OpportunityAddForm {
 
       this.communicationsLoading.set(false);
     }
+
+    contacts = signal<GetContactDto[]>([]);
+
+    async ngOnInit() {
+      await this.fetchContacts();
+    }
+
+    async fetchContacts() {
+      try {
+        const contacts = await firstValueFrom(this.contactsService.getAllContactEndpoint());
+        this.contacts.set(contacts);
+      } catch (e) {
+        this.notificationService.error('Erreur', 'Erreur de communication avec l\'API');
+      }
+    }
   }
 
+
+
   function atLeastOneRequired(group: FormGroup) {
     const { calling, email, meeting } = group.controls;
     const valid = [calling, email, meeting].some(c => c.value);

src/app/pages/opportunities/opportunity-card/opportunity-card.html

@@ -1,14 +1,23 @@
 @if (edit() == false) {
     <nz-card style="width:400px;" [nzActions]="[edit, delete]">
-        <h2 style="text-align: center; font-weight: bold">Communication n°{{ communication().id }}</h2>
+        <h2 style="text-align: center; font-weight: bold">Contact n°{{ communication().contactId }}</h2>
         @if (communication().calling) {
             <p>📞 Appel : {{ communication().calling }}</p>
+            <p> Nom du Contact : {{ communication().contactLastName + " " + communication().contactFirstName}}</p>
+            <p> Numéro du Contact : {{ communication().contactPhoneNumber }}</p>
+            <p> Email du Contact : {{ communication().contactEmail }}</p>
         }
         @if (communication().email) {
             <p>✉️ Email : {{ communication().email }}</p>
+            <p> Nom du Contact : {{ communication().contactLastName + " " + communication().contactFirstName}}</p>
+            <p> Numéro du Contact : {{ communication().contactPhoneNumber }}</p>
+            <p> Email du Contact : {{ communication().contactEmail }}</p>
         }
         @if (communication().meeting) {
             <p>🤝 Réunion : {{ communication().meeting }}</p>
+            <p> Nom du Contact : {{ communication().contactLastName + " " + communication().contactFirstName}}</p>
+            <p> Numéro du Contact : {{ communication().contactPhoneNumber }}</p>
+            <p> Email du Contact : {{ communication().contactEmail }}</p>
         }
     </nz-card>
     <ng-template #edit>

src/app/pages/staff/staff-card/staff-card.ts

@@ -35,7 +35,7 @@ export class StaffCard {
 
     staffForm = new FormGroup({
         f4T2NumberApproval: new FormControl<string>(null, [Validators.required]),
-        f4T2ExpirationDate: new FormControl<string>(null, [Validators.required]),
+        f4T2ExpirationDate: new FormControl<Date>(null, [Validators.required]),
     })
 
     async submitForm() {

src/app/services/api/model/create-communication-dto.ts

@@ -13,5 +13,6 @@ export interface CreateCommunicationDto {
     calling?: string | null;
     email?: string | null;
     meeting?: string | null;
+    contactId?: number;
 }
 

src/app/services/api/model/get-communication-dto.ts

@@ -14,5 +14,10 @@ export interface GetCommunicationDto {
     calling?: string | null;
     email?: string | null;
     meeting?: string | null;
+    contactId?: number;
+    contactFirstName?: string | null;
+    contactLastName?: string | null;
+    contactEmail?: string | null;
+    contactPhoneNumber?: string | null;
 }
 

src/app/services/api/model/update-staff-dto.ts

@@ -11,6 +11,6 @@
 
 export interface UpdateStaffDto { 
     f4T2NumberApproval?: string | null;
-    f4T2ExpirationDate?: string;
+    f4T2ExpirationDate?: Date | null;
 }