67 lines
2.0 KiB
JavaScript
67 lines
2.0 KiB
JavaScript
let sidebar = document.querySelector(".sidebar");
|
|
let closeBtn = document.querySelector("#btn");
|
|
let searchBtn = document.querySelector(".bx-search");
|
|
|
|
// Add a click event listener to list items with sub-menus
|
|
const listItems = document.querySelectorAll(".sidebar li");
|
|
listItems.forEach((item) => {
|
|
const subMenu = item.querySelector(".sub-menu");
|
|
if (subMenu) {
|
|
item.addEventListener("click", () => {
|
|
// If the sidebar is in the collapsed state, expand it
|
|
if (!sidebar.classList.contains("open")) {
|
|
sidebar.classList.add("open");
|
|
menuBtnChange();
|
|
}
|
|
// Toggle the "open" class for the clicked sub-menu
|
|
subMenu.classList.toggle("open");
|
|
});
|
|
}
|
|
});
|
|
|
|
|
|
// Existing code to handle the "Inventory" menu
|
|
const inventoryMenuItem = document.querySelector(".sidebar li a span.links_name");
|
|
if (inventoryMenuItem) {
|
|
inventoryMenuItem.addEventListener("click", () => {
|
|
const subMenu = inventoryMenuItem.parentElement.nextElementSibling;
|
|
subMenu.classList.toggle("open");
|
|
});
|
|
}
|
|
|
|
closeBtn.addEventListener("click", () => {
|
|
// Toggle the "open" class for the sidebar
|
|
sidebar.classList.toggle("open");
|
|
|
|
// Toggle the "open" class for all sub-menus
|
|
const subMenus = document.querySelectorAll(".sub-menu");
|
|
subMenus.forEach((subMenu) => {
|
|
subMenu.classList.remove("open");
|
|
});
|
|
|
|
menuBtnChange();
|
|
});
|
|
|
|
searchBtn.addEventListener("click", () => {
|
|
// Toggle the "open" class for the sidebar
|
|
sidebar.classList.toggle("open");
|
|
|
|
// Toggle the "open" class for all sub-menus
|
|
const subMenus = document.querySelectorAll(".sub-menu");
|
|
subMenus.forEach((subMenu) => {
|
|
subMenu.classList.remove("open");
|
|
});
|
|
|
|
menuBtnChange();
|
|
});
|
|
|
|
// Existing code for menu button change
|
|
function menuBtnChange() {
|
|
if (sidebar.classList.contains("open")) {
|
|
closeBtn.classList.replace("bx-menu", "bx-menu-alt-right");
|
|
} else {
|
|
closeBtn.classList.replace("bx-menu-alt-right", "bx-menu");
|
|
}
|
|
}
|
|
|