WMS system V1.0.0.3,调整settings按钮
This commit is contained in:
parent
20e1471d0a
commit
d4084d176d
File diff suppressed because one or more lines are too long
55
frontend/src/components/Sidebar.jsx
Normal file
55
frontend/src/components/Sidebar.jsx
Normal file
@ -0,0 +1,55 @@
|
|||||||
|
import React, { useState } from 'react';
|
||||||
|
import { NavLink } from 'react-router-dom';
|
||||||
|
|
||||||
|
const Sidebar = () => {
|
||||||
|
const [isSettingsOpen, setIsSettingsOpen] = useState(false);
|
||||||
|
|
||||||
|
const toggleSettingsMenu = () => {
|
||||||
|
setIsSettingsOpen(!isSettingsOpen);
|
||||||
|
};
|
||||||
|
|
||||||
|
const getNavLinkClass = ({ isActive }) =>
|
||||||
|
isActive
|
||||||
|
? 'bg-gray-900 text-white block py-2 px-4'
|
||||||
|
: 'text-white block py-2 px-4 hover:bg-gray-700';
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div className="h-full bg-gray-800 p-4">
|
||||||
|
<ul className="space-y-2">
|
||||||
|
<li>
|
||||||
|
<NavLink to="/dashboard" className={getNavLinkClass}>
|
||||||
|
Dashboard
|
||||||
|
</NavLink>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<NavLink to="/swagger" className={getNavLinkClass}>
|
||||||
|
Swagger API
|
||||||
|
</NavLink>
|
||||||
|
</li>
|
||||||
|
{/* Top-level Settings menu */}
|
||||||
|
<li>
|
||||||
|
<button onClick={toggleSettingsMenu}
|
||||||
|
className="w-full text-left text-white block py-2 px-4 hover:bg-gray-700 focus:outline-none">
|
||||||
|
Settings
|
||||||
|
</button>
|
||||||
|
{isSettingsOpen && (
|
||||||
|
<ul className="pl-4 space-y-1">
|
||||||
|
<li>
|
||||||
|
<NavLink to="/roles" className={getNavLinkClass}>
|
||||||
|
Roles
|
||||||
|
</NavLink>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<NavLink to="/permissions" className={getNavLinkClass}>
|
||||||
|
Permissions
|
||||||
|
</NavLink>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
)}
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default Sidebar;
|
||||||
Loading…
x
Reference in New Issue
Block a user