feat: Ajout d'une tâche

src/view/pages/home/home.component.html

@@ -11,6 +11,28 @@
       {{ task.name_task }}
     </p>
   }
+
+  <button (click)="toggleForm()">
+    Ajouter une tâche
+  </button>
+
+  @if (showTaskForm){
+    <form [formGroup]="newTaskForm" (ngSubmit)="submitTask()">
+      <label for="name-task">Nom </label>
+      <input id="name-task" type="text" formControlName="name" />
+
+      <label for="date-task">Date limite </label>
+      <input id="date-task" type="date" formControlName="dueDate" />
+
+      <label for="priority-task">Priorité </label>
+      <input id="priority-task" type="number" formControlName="priority" />
+
+      <label for="status-task">Statut </label>
+      <input id="status-task" type="status" formControlName="status" />
+
+      <button type="submit" [disabled]="!newTaskForm.valid">Valider</button>
+    </form>
+  }
 </div>
 
 <h2>

src/view/pages/home/home.component.ts

@@ -6,9 +6,11 @@ import { GroupService } from '../../../services/group.service';
 import { Group } from '../../../model/Group';
 import { ProjectService } from '../../../services/project.service';
 import { Project } from '../../../model/Project';
+import { FormControl, FormGroup, ReactiveFormsModule, Validators } from '@angular/forms';
+import { Observable } from 'rxjs';
 
 @Component({
-  imports: [RouterOutlet],
+  imports: [RouterOutlet, ReactiveFormsModule],
   selector: 'app-root',
   styleUrl: './home.component.css',
   templateUrl: './home.component.html',
@@ -22,6 +24,15 @@ export class Home {
   groups: WritableSignal<Group[]> = signal<Group[]>([]);
   projects: WritableSignal<Project[]> = signal<Project[]>([]);
 
+  newTaskForm = new FormGroup({
+    name: new FormControl('', Validators.required),
+    dueDate: new FormControl(''),
+    priority: new FormControl(''),
+    status: new FormControl(''),
+  });
+
+  showTaskForm: boolean = false;
+
   public ngOnInit(): void {
     this.taskService.getTasks().subscribe((response: Task[]): void => {
       this.tasks.set(response);
@@ -35,4 +46,24 @@ export class Home {
       this.projects.set(response);
     })
   }
+
+  public toggleForm(): void {
+    this.showTaskForm = !this.showTaskForm;
+  }
+
+  /**
+   * submitTask
+   */
+  public submitTask(): void {
+    let response: Observable<Task> = this.taskService.addTask(this.newTaskForm.controls.name.value!,
+      this.newTaskForm.controls.dueDate.value,
+      this.newTaskForm.controls.priority.value,
+      this.newTaskForm.controls.status.value);
+
+    response.subscribe(response => {
+      this.tasks.update(values => {
+        return [...values, response];
+      });
+    });
+  }
 }