feat: Update project/create.html

src/main/java/com/maradona/backend/controllers/api/ProjectController.java

@@ -101,6 +101,7 @@ public class ProjectController {
    */
   @PostMapping({ "/", "" })
   public ResponseEntity<Project> post(@RequestBody Project project) {
+    System.out.println(project);
     Project savedProject = projectActions.saveProject(project);
     return ResponseEntity.status(HttpStatus.CREATED).body(savedProject);
   }

src/main/java/com/maradona/backend/entities/Employee.java

@@ -2,6 +2,8 @@ package com.maradona.backend.entities;
 
 import jakarta.persistence.*;
 import lombok.Data;
+
+import com.fasterxml.jackson.annotation.JsonBackReference;
 import com.fasterxml.jackson.annotation.JsonManagedReference;
 import java.time.LocalTime;
 import java.util.List;
@@ -81,6 +83,7 @@ public class Employee {
      */
     @ManyToMany
     @JoinTable(name = "employee_project", joinColumns = @JoinColumn(name = "employee_eid"), inverseJoinColumns = @JoinColumn(name = "project_pid"))
+    @JsonBackReference
     private List<Project> projects;
 
     /**

src/main/java/com/maradona/backend/entities/Project.java

@@ -5,6 +5,8 @@ import lombok.Data;
 import java.time.LocalDate;
 import java.util.List;
 
+import com.fasterxml.jackson.annotation.JsonManagedReference;
+
 /**
  * Represents a project.
  * 
@@ -36,6 +38,7 @@ public class Project {
      * This is a list of references to the employee entity.
      */
     @ManyToMany(mappedBy = "projects")
+    @JsonManagedReference
     private List<Employee> employees;
 
     /**

src/main/resources/templates/pages/projects/create.html

@@ -16,7 +16,8 @@
       <div class="content container mt-4">
         <h2 class="mb-4">Create Project</h2>
         <form
-          th:action="@{/projects/save}"
+          id="createProjectForm"
+          th:action="@{/api/project}"
           th:object="${project}"
           method="post"
           class="project-card"
@@ -52,6 +53,25 @@
                 required
               />
             </div>
+            <div class="form-group">
+              <label for="workload">Workload:</label>
+              <input
+                type="number"
+                id="workload"
+                th:field="*{workload}"
+                class="form-control"
+                required
+              />
+            </div>
+            <div class="form-group">
+              <label for="description">Description:</label>
+              <textarea
+                id="description"
+                th:field="*{description}"
+                class="form-control"
+                required
+              ></textarea>
+            </div>
             <div class="form-group">
               <button type="submit" class="btn-create-project">
                 Save Project
@@ -62,5 +82,37 @@
       </div>
       <div th:replace="~{/core/_footer :: footer}"></div>
     </div>
+    <script>
+      document
+        .getElementById("createProjectForm")
+        .addEventListener("submit", function (event) {
+          event.preventDefault();
+          const form = event.target;
+          const formData = new FormData(form);
+          const jsonData = {};
+          formData.forEach((value, key) => {
+            jsonData[key] = value;
+          });
+          fetch("/api/project", {
+            method: "POST",
+            headers: {
+              "Content-Type": "application/json",
+            },
+            body: JSON.stringify(jsonData),
+          })
+            .then((response) => {
+              if (response.ok) {
+                window.location.href = "/projects";
+              } else {
+                return response.json().then((error) => {
+                  console.error("Error:", error);
+                });
+              }
+            })
+            .catch((error) => {
+              console.error("Error:", error);
+            });
+        });
+    </script>
   </body>
 </html>