[FEATURE]CAF-42 Interface View Edit Permissions

tests/cypress/e2e/dashboard.cy.js

@@ -28,7 +28,7 @@ describe("Role-based button functionality", () => {
       cy.visitWithToken("/dashboard");
 
       cy.get("#btnParcelControl").contains("Control de paquetería").click();
-      cy.url().should("include", "/packages");
+      cy.url().should("include", "/package-tracking");
       cy.visitWithToken("/dashboard");
     });
   });
@@ -56,7 +56,7 @@ describe("Role-based button functionality", () => {
       cy.visitWithToken("/dashboard");
 
       cy.get("#btnParcelControl").contains("Control de paquetería").click();
-      cy.url().should("include", "/packages");
+      cy.url().should("include", "/package-tracking");
     });
   });
 

tests/cypress/e2e/packages.cy.js

@@ -17,7 +17,7 @@ describe("Packages Table", () => {
       },
     }).as("getPackages");
 
-    cy.visitWithToken("/packages");
+    cy.visitWithToken("/package-tracking");
   });
 
   it("should display the packages table with confirmation buttons", () => {
@@ -36,7 +36,7 @@ describe("Packages Table", () => {
       body: { message: "Internal Server Error" },
     }).as("getPackagesError");
 
-    cy.visitWithToken("/packages");
+    cy.visitWithToken("/package-tracking");
     cy.wait("@getPackagesError");
 
     cy.get("#packageTable").should("exist");

tests/cypress/e2e/roles.permissions.cy.js

@@ -0,0 +1,45 @@
+describe("Permissions Page", () => {
+    beforeEach(() => {
+        var id = 123;
+
+        cy.intercept("GET", "/roles/123/nodes", {
+            body: {
+                message: "OK",
+                permissions: {
+                    "Usuarios": ["Crear", "Editar", "Eliminar"],
+                    "Roles": ["Asignar", "Modificar"]
+                }
+            }
+        }).as("getPermissions");
+
+        cy.intercept("POST", "/roles/123/nodes").as("savePermissions");
+
+        cy.visitWithToken(`/roles/permissions/?id=${id}`);
+    });
+
+    it("should load and display permissions", () => {
+        cy.wait("@getPermissions");
+
+        cy.get("#permissionsTable").should("be.visible");
+        cy.contains("Usuarios").should("exist");
+        cy.contains("Crear").should("exist");
+        cy.contains("Editar").should("exist");
+        cy.contains("Eliminar").should("exist");
+        cy.contains("Roles").should("exist");
+        cy.contains("Asignar").should("exist");
+        cy.contains("Modificar").should("exist");
+    });
+
+    it("should have checkboxes for permissions", () => {
+        cy.get("input[type='checkbox']").should("have.length", 5);
+    });
+
+    it("should allow selecting permissions", () => {
+        cy.get("input[type='checkbox']").first().check().should("be.checked");
+        cy.get("input[type='checkbox']").eq(1).uncheck().should("not.be.checked");
+    });
+
+    it("should have save button disabled initially", () => {
+        cy.get("#savePermissions").should("be.disabled");
+    });
+});

views/dashboard/blocks/parcelControlbutton.html

@@ -4,7 +4,7 @@
   id="btnParcelControl"
   class="btn btn-primary btn-lg me-3"
   style="width: 150px; height: 150px"
-  onclick="navigateTo('/packages')"
+  onclick="navigateTo('/package-tracking')"
 >
   <span class="material-symbols-outlined">local_shipping</span><br />
   Control de paquetería

views/packages/assets/index.js → views/package-tracking/assets/index.js

@@ -93,7 +93,7 @@ async function loadPackagesTable() {
 }
 
 document.getElementById("registerPackage").addEventListener("click", () => {
-  window.location.href = "/packages/register.html";
+  window.location.href = "/package-tracking/register.html";
 });
 
 window.addEventListener("load", async () => {

views/packages/index.html → views/package-tracking/index.html

@@ -23,4 +23,4 @@ <h3 class="text-center">Lista de Entregas</h3>
     </div>
   </div>
 </div>
-<script src="/packages/assets/index.js"></script>
+<script src="/package-tracking/assets/index.js"></script>

views/roles/assets/index.js

@@ -37,7 +37,7 @@ function createActionsCell(role) {
   return actionsCell;
 }
 
-function createAssignButton() {
+function createAssignButton(role) {
   const assignButton = document.createElement("button");
   assignButton.className = "btn outline-secondary btn-sm me-2";
   assignButton.title = "Asignar Permisos";
@@ -50,7 +50,7 @@ function createAssignButton() {
   assignButton.appendChild(assignIcon);
 
   assignButton.onclick = () => {
-    // Logica para Asignar Permisos
+    window.location.href = `/roles/permissions/?id=${role.id}`;
   };
 
   return assignButton;

views/roles/assets/permissions.js

@@ -0,0 +1,76 @@
+
+async function fetchPermissions(roleId) {
+    try {
+        const response = await apiRequest("GET", `roles/${roleId}/nodes`);
+
+        return response.data;
+    } catch (error) {
+        console.error("Error al cargar permisos:", error);
+        return null;
+    }
+}
+
+function createPermissionsTable(permissions) {
+    const permissionsTable = document.getElementById("permissionsTable");
+
+    Object.entries(permissions).forEach(([category, permissionList]) => {
+        const categoryRow = document.createElement("tr");
+        const categoryCell = document.createElement("td");
+        categoryCell.colSpan = 2;
+        categoryCell.textContent = category;
+        categoryCell.style.fontWeight = "bold";
+        categoryRow.appendChild(categoryCell);
+        permissionsTable.appendChild(categoryRow);
+
+        permissionList.forEach((permission) => {
+            const permissionRow = document.createElement("tr");
+
+            const permissionCell = document.createElement("td");
+            permissionCell.textContent = permission;
+
+            const checkboxCell = document.createElement("td");
+            const checkbox = document.createElement("input");
+            checkbox.type = "checkbox";
+            checkbox.dataset.permissionName = permission;
+            checkboxCell.appendChild(checkbox);
+
+            permissionRow.appendChild(permissionCell);
+            permissionRow.appendChild(checkboxCell);
+            permissionsTable.appendChild(permissionRow);
+        });
+    });
+}
+
+async function savePermissions(roleId) {
+    const checkboxes = document.querySelectorAll("input[type='checkbox']");
+    const updatedPermissions = Array.from(checkboxes).map((checkbox) => ({
+        permission: checkbox.dataset.permissionName,
+        enabled: checkbox.checked,
+    }));
+
+    try {
+        await apiRequest("POST", `roles/${roleId}/nodes`, updatedPermissions);
+
+        alert("Permisos guardados con éxito.");
+    } catch (error) {
+        console.error("Error al guardar permisos:", error);
+        alert("Hubo un error al guardar los permisos.");
+    }
+}
+
+window.addEventListener("load", async () => {
+    const urlParams = new URLSearchParams(window.location.search);
+    const roleId = urlParams.get("id");
+
+    const permissionsData = await fetchPermissions(roleId);
+
+    if (permissionsData && permissionsData.message === "OK") {
+        createPermissionsTable(permissionsData.permissions);
+    } else {
+        alert(permissionsData?.message || "Error al cargar los permisos.");
+    }
+});
+
+document.getElementById("savePermissions").addEventListener("click", async () => {
+    await savePermissions(roleId);
+});

views/roles/permissions.html

@@ -0,0 +1,18 @@
+<div class="container mt-5">
+  <div class="row justify-content-center">
+      <div class="col-md-10">
+          <table class="table table-bordered table-striped">
+              <thead class="table-white">
+                  <tr>
+                      <th>Permisos</th>
+                  </tr>
+              </thead>
+              <tbody id="permissionsTable"></tbody>
+          </table>
+          <!-- Botón para guardar los permisos -->
+          <button id="savePermissions" class="btn btn-primary mt-3" disabled>Guardar Permisos</button>
+      </div>
+  </div>
+</div>
+
+<script src="/roles/assets/permissions.js"></script>