Add MenuHead_Deposit.jsp

2025-03-22 14:31:57 +00:00 · 2025-03-22 14:31:57 +00:00 · ca4186826b
commit ca4186826b
parent e926900dd5
1 changed files with 95 additions and 0 deletions
--- a/MenuHead_Deposit.jsp
+++ b/MenuHead_Deposit.jsp
@ -0,0 +1,95 @@
+<%-- 
+    Document   : MenuHead_Deposit
+    Created on : Mar 20, 2025, 5:43:06 PM
+    Author     : 1121947
+--%>
+
+<%@page contentType="text/html" pageEncoding="UTF-8"%>
+<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
+    "http://www.w3.org/TR/html4/loose.dtd">
+
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <title>Dynamic Menu</title>
+    <!-- Bootstrap CSS -->
+<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
+</head>
+<body>
+ 
+<!-- Bootstrap Navbar -->
+<nav class="navbar navbar-expand-lg navbar-dark bg-dark">
+    <div class="container-fluid">
+        <a class="navbar-brand" href="#">MyApp</a>
+        <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav">
+            <span class="navbar-toggler-icon"></span>
+        </button>
+        <div class="collapse navbar-collapse" id="navbarNav">
+            <ul class="navbar-nav" id="menuList">
+                <!-- Menu items will be loaded dynamically -->
+            </ul>
+        </div>
+        <span class="navbar-text text-white me-3" id="userRole"></span>
+    </div>
+</nav>
+ 
+<script>
+    document.addEventListener("DOMContentLoaded", function () {
+        fetch("/IFSS/MenuHeadServlet")
+            .then(response => {
+                if (!response.ok) {
+                    throw new Error("Failed to fetch menu data");
+                }
+                return response.json();
+            })
+            .then(data => {
+                console.log(data);
+                const menuList = document.getElementById("menuList");
+                menuList.innerHTML = ""; // Clear previous menu items
+                
+                const userRole = document.getElementById("userRole");
+                userRole.textContent = "Role: " + (data.role || "Unknown");
+ 
+                if (Object.keys(data.menus).length === 0) {
+                    menuList.innerHTML = "<li class='nav-item'><a class='nav-link disabled'>No access</a></li>";
+                } else {
+                    Object.entries(data.menus).forEach(([menuName, screens]) => {
+                        // Create dropdown menu
+                        const dropdown = document.createElement("li");
+                        dropdown.className = "nav-item dropdown";
+ 
+                        const dropdownToggle = document.createElement("a");
+                        dropdownToggle.className = "nav-link dropdown-toggle";
+                        dropdownToggle.href = "#";
+                        dropdownToggle.role = "button";
+                        dropdownToggle.dataset.bsToggle = "dropdown";
+                        dropdownToggle.textContent = menuName;
+ 
+                        const dropdownMenu = document.createElement("ul");
+                        dropdownMenu.className = "dropdown-menu";
+ 
+                        screens.forEach(screen => {
+                            const menuItem = document.createElement("li");
+                            const link = document.createElement("a");
+                            link.className = "dropdown-item";
+                            link.href = screen.jspPage;
+                            link.textContent = screen.screenID;
+                            menuItem.appendChild(link);
+                            dropdownMenu.appendChild(menuItem);
+                        });
+ 
+                        dropdown.appendChild(dropdownToggle);
+                        dropdown.appendChild(dropdownMenu);
+                        menuList.appendChild(dropdown);
+                    });
+                }
+            })
+            .catch(error => console.error("Error loading menu:", error));
+    });
+</script>
+ 
+<!-- Bootstrap JS -->
+
+ 
+</body>
+</html>